/* 콘텐츠 서비스 테마: 파랑 & 하양 (2026-10-20)
   맥에서 도는 콘텐츠 서비스(html[data-app="content"])에만 적용. 운영 화면(홈·대시보드·퍼포먼스·바이럴)의 따뜻한 테마는 그대로.
   공용 변수 이름은 그대로 쓰되 값만 파랑 계열로 — --blue 는 '연한 강조 바탕', --blue-ink 는 그 위 글자색이라는 뜻을 지킴.
   진한 파랑 바탕 + 흰 글자는 --cx-primary 로 주요 버튼·선택된 메뉴에만. */
html[data-app="content"]{
  --cx-primary:#2457e6;--cx-primary-hover:#1d48c4;--cx-primary-ink:#fff;--cx-ring:#9db9ff;
  --bg:#ffffff;--side:#ffffff;--panel:#f6f9ff;--card:#ffffff;
  --ink:#122142;--muted:#56688a;--faint:#7f8ca6;
  --line:#e2e9f5;--line-2:#cbd8ee;
  --blue:#dfe8ff;--blue-ink:#1a44b8;--blue-soft:#f3f7ff;--blue-soft-2:#c8d8fb;--blue-deep:#153a9e;
  --chip-ghost:#f2f6fd;--focus:#2457e6;--tile:#f6f9ff;--tile-chip:#e7eefc;
  --shadow:0 1px 2px rgba(18,33,66,.05),0 8px 24px rgba(36,87,230,.07);
  background:#fff;
}
html[data-app="content"] body{background:#fff;color:var(--ink)}

/* 상단바 · 사이드 메뉴: 하양 + 파랑 선택 */
html[data-app="content"] .sidebar{background:#fff;border-bottom:1px solid var(--line);box-shadow:0 1px 0 #fff,0 6px 18px rgba(36,87,230,.05);color:var(--ink)}
html[data-app="content"] .sidebar .sb-title{color:var(--ink)}
html[data-app="content"] .sidebar .sb-title .studio-word{color:var(--cx-primary)}
html[data-app="content"] .sidebar .flow li a{color:var(--muted)}
html[data-app="content"] .sidebar .flow li a:hover{background:var(--blue-soft);color:var(--blue-ink)}
html[data-app="content"] .sidebar .flow li a .num{background:var(--blue-soft);color:var(--blue-ink)}
html[data-app="content"] .sidebar .flow li.active a{background:var(--cx-primary);color:#fff}
html[data-app="content"] .sidebar .flow li.active .num{background:rgba(255,255,255,.18);color:#fff}
html[data-app="content"] .sidebar :focus-visible,html[data-app="content"] .workspace-rail :focus-visible{outline:2px solid var(--cx-ring)}
html[data-app="content"] .workspace-rail{background:#f7f9ff;border-right:1px solid var(--line);color:var(--muted);scrollbar-color:#c8d8fb #f7f9ff}
html[data-app="content"] .workspace-rail .rail-title{color:var(--ink);border-bottom-color:var(--line)}
html[data-app="content"] .workspace-rail button{color:var(--muted)}
html[data-app="content"] .workspace-rail .menu-number{color:var(--faint)}
html[data-app="content"] .workspace-rail button:hover{background:#eaf0ff;color:var(--blue-ink)}
html[data-app="content"] body.workspace-page .workspace-rail button[aria-current]{background:var(--cx-primary);color:#fff;box-shadow:0 6px 16px rgba(36,87,230,.25)}
html[data-app="content"] body.workspace-page .workspace-rail button[aria-current] .menu-number{color:#dbe6ff}
html[data-app="content"] .access-badge,html[data-app="content"] .adm-login{border-color:var(--line)}

/* 주요 버튼: 진한 파랑 + 흰 글자 */
html[data-app="content"] .btn.primary,html[data-app="content"] .btn.primary:hover{background:var(--cx-primary);border-color:var(--cx-primary);color:#fff;box-shadow:0 4px 12px rgba(36,87,230,.22)}
html[data-app="content"] .btn.primary:hover{background:var(--cx-primary-hover);border-color:var(--cx-primary-hover)}
html[data-app="content"] .btn{border-color:var(--line-2)}
html[data-app="content"] .btn:hover{border-color:var(--cx-primary);color:var(--blue-ink)}

/* 콘텐츠 목록: 탭 · 제품 칩 · 요약 카드 */
html[data-app="content"] .cw-tabs{background:var(--blue-soft);border-color:var(--line)}
html[data-app="content"] .cw-tabs button{color:var(--muted)}
html[data-app="content"] .cw-tabs button[aria-current]{background:#fff;color:var(--cx-primary);box-shadow:0 2px 8px rgba(36,87,230,.12)}
html[data-app="content"] .content-product,html[data-app="content"] .content-product.tone-1,html[data-app="content"] .content-product.tone-2,
html[data-app="content"] .content-product.tone-3,html[data-app="content"] .content-product.tone-4{--chip-start:#ffffff;--chip-end:#f3f7ff;--chip-border:var(--cx-primary);border-color:var(--line);color:var(--ink)}
html[data-app="content"] .content-product small{background:var(--blue);color:var(--blue-ink)}
html[data-app="content"] .content-product[aria-pressed=true]{background:var(--cx-primary);border-color:var(--cx-primary);color:#fff;box-shadow:0 6px 16px rgba(36,87,230,.22)}
html[data-app="content"] .content-product[aria-pressed=true] small{background:rgba(255,255,255,.22);color:#fff}
html[data-app="content"] .cw-kpis article,html[data-app="content"] .cw-kpis article:nth-child(n){background:linear-gradient(135deg,#f3f7ff,#fff 70%);border-color:var(--line);box-shadow:inset 0 3px 0 var(--cx-primary)}
html[data-app="content"] .cw-kpis article:nth-child(2){box-shadow:inset 0 3px 0 #5b8cff}
html[data-app="content"] .cw-kpis article:nth-child(3){box-shadow:inset 0 3px 0 #9db9ff}
html[data-app="content"] .cw-kpis b{color:var(--ink)}

/* 제작 팝업: 단계 메뉴 · 머리 · 아래 버튼 */
html[data-app="content"] #mkDialog .mk-window{border-color:var(--line);box-shadow:0 30px 90px rgba(18,33,66,.22)}
html[data-app="content"] #mkDialog .mk-window:focus{outline:none}
html[data-app="content"] .mk-workflow-rail{background:#f7f9ff}
html[data-app="content"] .mk-workflow-rail button:hover{background:#eaf0ff}
html[data-app="content"] .mk-workflow-rail button[aria-current=step]{background:var(--cx-primary);border-color:var(--cx-primary);color:#fff}
html[data-app="content"] #mkDialog .mksteps .st{background:var(--blue-soft);color:var(--muted)}
html[data-app="content"] #mkDialog .mksteps .st .n{background:var(--blue);color:var(--blue-ink)}
html[data-app="content"] #mkDialog .mksteps .st.cur{background:var(--cx-primary);color:#fff;border-color:var(--cx-primary)}
html[data-app="content"] #mkDialog .mksteps .st.cur .n{background:rgba(255,255,255,.2);color:#fff}
html[data-app="content"] #mkDialog .mksteps .st.done{background:#eef3ff;color:var(--blue-ink)}
html[data-app="content"] #mkDialog .mksteps .st.done .n{background:#d5e2ff;color:var(--blue-ink)}
html[data-app="content"] #mkDialog .mksteps .ln{background:var(--line-2)}

/* 메뉴가 콘텐츠 하나뿐이라 늘 선택된 모양 */
html[data-app="content"] .sidebar .flow li#navPlanLi a{background:var(--cx-primary);color:#fff}
html[data-app="content"] .sidebar .flow li#navPlanLi .num{background:rgba(255,255,255,.18);color:#fff}

/* 제품별 제작 수요 표 */
html[data-app="content"] .cw-demand th{background:var(--blue-soft);color:var(--muted);border-bottom-color:var(--line)}
html[data-app="content"] .cw-demand td{border-color:var(--line)}
html[data-app="content"] .cw-badge{background:#e7eefc;color:var(--blue-ink)}
html[data-app="content"] .cw-badge.sale{background:#eef0f6;color:#46506a}
html[data-app="content"] .cw-need{color:var(--cx-primary)}
html[data-app="content"] #plHead .lh-left b{background:var(--blue);color:var(--blue-ink)}

/* 기획서 카드: 하양 바탕 + 단계는 파랑 농도로 (1 연함 → 6 진함) */
html[data-app="content"] .content-output,html[data-app="content"] .content-output[data-output-step]{background:#fff;border-color:var(--line);box-shadow:0 6px 20px rgba(36,87,230,.06)}
html[data-app="content"] .content-output:hover{border-color:var(--blue-soft-2)}
html[data-app="content"] .content-brief-stage,html[data-app="content"] .content-brief-stage[data-step]{background:#eef3ff;color:var(--blue-ink)}
html[data-app="content"] .content-brief-stage[data-step="2"]{background:#dfe8ff}
html[data-app="content"] .content-brief-stage[data-step="3"]{background:#c8d8fb}
html[data-app="content"] .content-brief-stage[data-step="4"]{background:#9db9ff;color:#0f2a75}
html[data-app="content"] .content-brief-stage[data-step="5"]{background:#5b8cff;color:#fff}
html[data-app="content"] .content-brief-stage[data-step="6"]{background:var(--cx-primary);color:#fff}

/* 제작 팝업 안 */
html[data-app="content"] #mkDialog .mk-workflow-rail{background:var(--blue-soft)}
html[data-app="content"] #mkDialog .mk-workflow-rail button{color:var(--muted)}
html[data-app="content"] #mkDialog .mk-workflow-rail button[aria-current]{background:var(--cx-primary);border-color:var(--cx-primary);color:#fff;opacity:1}
html[data-app="content"] #mkDialog .mk-workflow-rail .mk-rail-group{color:var(--blue-ink);border-left-color:var(--line-2)}
html[data-app="content"] .shorts-format{background:var(--blue);color:var(--blue-ink)}
html[data-app="content"] .svstep{background:var(--cx-primary);color:#fff}
html[data-app="content"] .svcard{background:var(--blue-soft);border-color:var(--line)}
html[data-app="content"] .svvoice-unit:nth-child(even){background:#f7f9ff}
html[data-app="content"] .content-final-audio{background:linear-gradient(120deg,#eef3ff,#fff);border-color:var(--blue-soft-2)}
html[data-app="content"] .svspeaker-name.female{background:#f1f0ff;border-color:#cfcaf7;color:#4338ca}
html[data-app="content"] .svspeaker-name.male{background:#eaf2ff;border-color:#b9d1f7;color:#1d4ed8}

/* 선택 칩·링크·불러오기 창: 보라 → 파랑 (씬 종류 색 --rg-* 은 뜻이 있어 그대로) */
html[data-app="content"] .studio-chip.selected{border-color:var(--cx-primary);background:#eaf0ff;color:var(--blue-ink);box-shadow:inset 0 0 0 1px var(--cx-primary)}
html[data-app="content"] .studio-chip:focus-visible{outline-color:var(--cx-ring)}
html[data-app="content"] .svspeaker-chip.studio-chip.female{background:#f4f3ff;border-color:#d9d6fb;color:#4f46e5}
html[data-app="content"] .svspeaker-chip.studio-chip.female.selected{background:#e3e1ff;border-color:#8b85f0;color:#3730a3;box-shadow:inset 0 0 0 1px #8b85f0}
html[data-app="content"] .svspeaker-chip.studio-chip.male{background:#f1f6ff;border-color:#cfdffa;color:#2563eb}
html[data-app="content"] .svspeaker-chip.studio-chip.male.selected{background:#dbe8ff;border-color:#5b8cff;color:#1a44b8;box-shadow:inset 0 0 0 1px #5b8cff}
html[data-app="content"] .drv-tab.on,html[data-app="content"] .drv-chip.on{border-color:var(--cx-primary);background:#eaf0ff;color:var(--blue-ink)}
html[data-app="content"] .drv-tile:hover,html[data-app="content"] .drv-tile:focus-visible{border-color:var(--cx-primary);box-shadow:0 0 0 2px var(--blue-soft-2)}
html[data-app="content"] .spr-chip{border-color:var(--blue-soft-2);background:#eef3ff;color:var(--blue-ink)}
html[data-app="content"] .spr-summary{background:#eef3ff;color:var(--blue-ink)}
html[data-app="content"] .spr-link,html[data-app="content"] .s4-link,html[data-app="content"] .ugc-rules>summary{color:var(--cx-primary)}
html[data-app="content"] .spr-spin{border-color:#dbe6ff;border-top-color:var(--cx-primary)}

/* 팝업 안쪽 바탕 · 1단계 제품 정보 칩 */
html[data-app="content"] #mkDialog #mkBody{background:var(--blue-soft)}
html[data-app="content"] .brief-product-info>span{background:#fff;border-color:var(--line)}
html[data-app="content"] .brief-product-info small{color:var(--faint)}
html[data-app="content"] .formwrap .fhead .code{background:var(--blue);color:var(--blue-ink)}
html[data-app="content"] #gate{background:radial-gradient(ellipse at 24% 15%,#dfe8ff 0,transparent 45%),radial-gradient(ellipse at 85% 82%,#eef3ff 0,transparent 40%),#fff}
html[data-app="content"] .copy-scene>header>span{color:var(--faint)}
html[data-app="content"] .copy-scene>header{border-right-color:var(--blue-soft-2)}

/* 완료 표시: 초록 → 파랑 */
html[data-app="content"] #mkFoot .btn.plan-done,html[data-app="content"] #mkFoot .btn.plan-done:hover{background:var(--cx-primary);border-color:var(--cx-primary)}
html[data-app="content"] #mkFoot .btn.plan-done:hover{background:var(--cx-primary-hover)}
html[data-app="content"] .reference-block.complete>summary{background:var(--blue-soft)}
html[data-app="content"] .reference-block.complete .reference-block-check{background:var(--cx-primary);border-color:var(--cx-primary)}
html[data-app="content"] .reference-block.complete .reference-block-status{color:var(--cx-primary)}
html[data-app="content"] .s4-model.done{border-color:var(--blue-soft-2)}

/* ================= 콘텐츠 스튜디오 틀 (2026-10-20) =================
   단독 서비스: ELT STUDIO 상단 메뉴·데이터 날짜·관리자 배지 없이, 왼쪽 사이드바 하나 + 페이지 머리글 */
html[data-app="content"] .sidebar,html[data-app="content"] #accessBadge,html[data-app="content"] .topbar{display:none!important}
html[data-app="content"] body.workspace-page .shell{grid-template-columns:264px minmax(0,1fr);grid-template-rows:minmax(0,1fr)}
html[data-app="content"] body.workspace-page #wrap{grid-row:1;padding:28px 40px 56px;max-width:1680px}
html[data-app="content"] .workspace-rail{grid-row:1;top:0;height:100dvh;display:flex;flex-direction:column;gap:2px;padding:20px 16px 16px;background:#fff;border-right:1px solid var(--line)}
html[data-app="content"] .cs-brand{display:flex;align-items:center;gap:10px;padding:4px 8px 18px}
html[data-app="content"] .cs-brand img{border-radius:10px;box-shadow:0 4px 12px rgba(36,87,230,.18)}
html[data-app="content"] .cs-brand b{display:block;font-size:16px;letter-spacing:-.02em;color:var(--ink)}
html[data-app="content"] .cs-brand small{display:block;font-size:11px;color:var(--faint);margin-top:1px}
html[data-app="content"] .cs-new{position:relative;margin:0 0 14px}
html[data-app="content"] .workspace-rail .cs-new-btn{display:block;width:100%;min-height:44px;padding:11px 14px;border-radius:12px;background:var(--cx-primary);color:#fff;font-size:14px;font-weight:700;text-align:center;box-shadow:0 8px 20px rgba(36,87,230,.25)}
html[data-app="content"] .workspace-rail .cs-new-btn:hover{background:var(--cx-primary-hover);color:#fff}
html[data-app="content"] .cs-new-menu{position:absolute;left:0;right:-60px;top:calc(100% + 6px);z-index:40;display:flex;flex-direction:column;gap:2px;padding:6px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 18px 40px rgba(18,33,66,.16)}
html[data-app="content"] .cs-new-menu[hidden]{display:none}
html[data-app="content"] .workspace-rail .cs-new-menu button{display:flex;align-items:center;gap:10px;min-height:0;padding:10px 12px;border-radius:10px;font-weight:600;color:var(--ink)}
html[data-app="content"] .workspace-rail .cs-new-menu button>span:first-child{font-size:20px}
html[data-app="content"] .cs-new-menu b{display:block;font-size:13px}
html[data-app="content"] .cs-new-menu small{display:block;font-size:11px;color:var(--muted);font-weight:500;margin-top:1px}
html[data-app="content"] .workspace-rail .cs-new-menu button:hover{background:var(--blue-soft);color:var(--blue-ink)}
html[data-app="content"] .cs-group{margin:14px 10px 6px;font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--faint)}
html[data-app="content"] .workspace-rail nav{gap:2px}
html[data-app="content"] .workspace-rail nav button{display:flex;align-items:center;gap:10px;min-height:42px;padding:9px 12px;border-radius:10px;font-size:13.5px;font-weight:600;color:var(--muted)}
html[data-app="content"] .cs-emoji{font-size:17px;width:22px;text-align:center}
html[data-app="content"] .cs-label{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html[data-app="content"] .cs-count{min-width:22px;padding:1px 7px;border-radius:999px;background:var(--blue);color:var(--blue-ink);font-size:11px;font-weight:700;text-align:center}
html[data-app="content"] body.workspace-page .workspace-rail nav button[aria-current]{background:var(--blue-soft);color:var(--cx-primary);box-shadow:inset 3px 0 0 var(--cx-primary)}
html[data-app="content"] body.workspace-page .workspace-rail nav button[aria-current] .cs-count{background:var(--cx-primary);color:#fff}
html[data-app="content"] .cs-foot{margin-top:auto;padding-top:14px;border-top:1px solid var(--line)}
html[data-app="content"] .cs-worker{display:flex;align-items:flex-start;gap:9px;padding:10px;border-radius:12px;background:var(--blue-soft)}
html[data-app="content"] .cs-worker b{display:block;font-size:12px;color:var(--ink)}
html[data-app="content"] .cs-worker small{display:block;font-size:11px;color:var(--muted);margin-top:2px}
html[data-app="content"] .cs-dot{flex:none;width:9px;height:9px;margin-top:4px;border-radius:50%;background:#b6c2d6;box-shadow:0 0 0 3px #e3e9f3}
html[data-app="content"] .cs-dot.on{background:#22c55e;box-shadow:0 0 0 3px #dcfce7}
html[data-app="content"] .cs-local{margin:10px 4px 0;font-size:11px;color:var(--faint)}
/* 페이지 머리글 */
html[data-app="content"] #workspacePageHead{margin:0 0 22px}
html[data-app="content"] .cs-eyebrow{margin:0 0 6px;font-size:12px;font-weight:700;color:var(--cx-primary);letter-spacing:.02em}
html[data-app="content"] .cs-head h2{margin:0;font-size:26px;letter-spacing:-.03em;color:var(--ink)}
html[data-app="content"] .cs-sub{margin:6px 0 0;font-size:13px;color:var(--muted)}
/* 좁은 화면: 사이드바를 위쪽 가로 막대로 */
@media(max-width:900px){
  html[data-app="content"] body.workspace-page .shell{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr)}
  html[data-app="content"] .workspace-rail{position:static;height:auto;flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px;padding:12px 16px;border-right:0;border-bottom:1px solid var(--line)}
  html[data-app="content"] body.workspace-page #wrap{grid-column:1;grid-row:2;padding:20px 16px 40px}
  html[data-app="content"] .cs-brand{padding:0}
  html[data-app="content"] .cs-brand small{display:none}
  html[data-app="content"] .cs-group,html[data-app="content"] .cs-foot{display:none}
  html[data-app="content"] .cs-new{margin:0;order:3}
  html[data-app="content"] .workspace-rail nav{flex-direction:row}
}

/* 콘텐츠 편집기(할인 숏폼·실제 촬영)·캘린더·빈 화면: 베이지 → 하양·파랑 */
html[data-app="content"] .cw-empty{color:var(--muted);border-color:var(--blue-soft-2);background:var(--blue-soft)}
html[data-app="content"] .cw-field input,html[data-app="content"] .cw-field textarea,html[data-app="content"] .cw-field select{background:#fff;border-color:var(--line-2)}
html[data-app="content"] .cw-field input:focus,html[data-app="content"] .cw-field textarea:focus,html[data-app="content"] .cw-field select:focus{border-color:var(--cx-primary);outline:2px solid var(--blue);outline-offset:0}
html[data-app="content"] .cw-field span{color:var(--muted)}
html[data-app="content"] .cw-project{border-color:var(--line);background:#fff;box-shadow:0 6px 20px rgba(36,87,230,.06)}
html[data-app="content"] .cw-shot,html[data-app="content"] .cw-reference{border-color:var(--line);background:linear-gradient(120deg,var(--blue-soft),#fff)}
html[data-app="content"] .cw-image-picks button{background:#fff;border-color:var(--line);color:var(--muted)}
html[data-app="content"] .cw-image-picks button[aria-pressed=true]{border-color:var(--cx-primary);background:#eaf0ff}
html[data-app="content"] .cw-week{background:var(--blue-soft);color:var(--muted)}
html[data-app="content"] .cw-day.outside{background:#fafbfe;color:#b4bfd2}
html[data-app="content"] .cw-day.today{background:#f3f7ff}
html[data-app="content"] .cw-day.today .cw-day-number{background:var(--cx-primary);color:#fff}
html[data-app="content"] .cw-event{border-left-color:var(--cx-primary);background:#eaf0ff;color:var(--blue-ink)}
html[data-app="content"] .cw-event.shoot_date{border-left-color:#5b8cff;background:#f1f6ff;color:#1d4ed8}
html[data-app="content"] .cw-worker{background:var(--blue);color:var(--blue-ink)}
html[data-app="content"] .cw-calendar,html[data-app="content"] .cw-day{border-color:var(--line)}
html[data-app="content"] .cw-editor{border-color:var(--line)}
