/* ⛔ 설계도(MASTER.md) → 이 폴더 GUIDE.md(설명서) → LOG.md 순서로 읽고 작업한다. 이 파일을 바로 열었다면 멈추고 설계도부터. */
:root{
  --font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Apple SD Gothic Neo", "Pretendard", "Noto Sans KR", system-ui, sans-serif;
  --text-caption: 12px; --text-footnote: 13px; --text-body: 15px; --text-callout: 17px; --text-title3: 20px; --text-title2: 26px; --text-title1: 32px; --leading: 1.45;
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 24px; --space-6: 32px; --space-7: 48px;
  --control-sm: 32px; --control-md: 40px; --control-lg: 48px;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 20px; --radius-full: 999px;
}
@media (pointer: coarse) { :root { --control-sm: 44px; --control-md: 44px; --control-lg: 50px; } }

/* AStore Hub shared theme layer. Customer-facing AppleCare Play is standalone. */
html[data-theme="dark"]{
  color-scheme:dark;
  --bg:#050505;--surface:#0d0d0f;--surface-2:#121216;--surface-3:#17191f;
  --panel:var(--surface);--panel2:var(--surface-2);--card-bg:rgba(255,255,255,.038);
  --text:#f5f5f7;--text-muted:#909096;--muted:var(--text-muted);--text-soft:#c7c7cc;
  --border:rgba(255,255,255,.09);--line:var(--border);--divider:rgba(255,255,255,.065);
  --input-bg:#111114;--hover:rgba(255,255,255,.06);--selected:rgba(41,151,255,.13);
  --header-bg:rgba(5,5,6,.88);--sidebar-bg:rgba(7,7,8,.86);--table-head:rgba(255,255,255,.025);
  --shadow:0 24px 70px rgba(0,0,0,.22);--control-text:#f5f5f7;--button-bg:#f5f5f7;--button-text:#050505;
  --accent:#2997ff;--accent-soft:#80bfff;--accent2:#7c5cff;--success:#42d392;--ok:var(--success);
  --danger:#ff5f57;--warning:#ffae42;--overlay:rgba(0,0,0,.58);
  --ambient-opacity:.18;--ambient-a:#1d6fff;--ambient-b:#7c5cff;
}
html[data-theme="light"]{
  color-scheme:light;
  --bg:#f3f5f8;--surface:#ffffff;--surface-2:#f8f9fb;--surface-3:#eef1f5;
  --panel:var(--surface);--panel2:var(--surface-2);--card-bg:#ffffff;
  --text:#1d1d1f;--text-muted:#5f6875;--muted:var(--text-muted);--text-soft:#3d4550;
  --border:rgba(30,40,55,.12);--line:var(--border);--divider:rgba(30,40,55,.095);
  --input-bg:#ffffff;--hover:rgba(28,39,55,.055);--selected:rgba(0,113,227,.095);
  --header-bg:rgba(255,255,255,.9);--sidebar-bg:rgba(248,249,251,.92);--table-head:#f4f6f8;
  --shadow:0 18px 50px rgba(32,47,66,.09);--control-text:#1d1d1f;--button-bg:#1d1d1f;--button-text:#ffffff;
  --accent:#0071e3;--accent-soft:#086fc7;--accent2:#6555c9;--success:#168554;--ok:var(--success);
  --danger:#c93632;--warning:#9a5b00;--overlay:rgba(24,30,39,.38);
  --ambient-opacity:.09;--ambient-a:#5aa9ff;--ambient-b:#a38cff;
}

html,body,.sidebar,.admin-nav,.analytics-shell,.analytics-topbar,.metric-card,.feature-card,
.data-panel,.bulk-panel,.form-panel,.import-panel,.analytics-panel,input,select,textarea,
.theme-toggle{transition:background-color .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease}
body{background:var(--bg);color:var(--text)}
.ambient{opacity:var(--ambient-opacity)}.ambient-a{background:var(--ambient-a)}.ambient-b{background:var(--ambient-b)}
.sidebar{background:var(--sidebar-bg);border-color:var(--border)}
.admin-nav{background:var(--header-bg);border-color:var(--border);padding-right:max(142px,calc((100vw - 1440px)/2))}
.nav-item,.nav-pill{color:var(--text-soft)}
.nav-item:hover,.nav-item.active,.nav-pill:hover{background:var(--hover);color:var(--text)}
.nav-pill.active{background:var(--selected);color:var(--accent-soft)}
.nav-pill.logout{color:var(--text-muted)}
.brand-mark{background:linear-gradient(145deg,var(--button-bg),color-mix(in srgb,var(--button-bg) 68%,var(--bg)));color:var(--button-text);box-shadow:0 10px 35px color-mix(in srgb,var(--text) 12%,transparent)}
.eyebrow,.card-kicker,.cell-sub,.empty-value,.lock-mark{color:var(--text-muted)}
.status-pill,.notice,.badge{background:var(--hover);color:var(--text-soft);border-color:var(--border)}
.metric-card,.feature-card,.glass-soft,.glass,.action-card,.data-panel,.bulk-panel,.form-panel,.import-panel,
.filter-panel,.preview-panel,.toggle-row,.info-grid article,.employee-identity-card>div,.store-choice{
  border-color:var(--border);background:linear-gradient(145deg,color-mix(in srgb,var(--surface) 97%,var(--text) 3%),var(--surface));box-shadow:var(--shadow)
}
.feature-card:hover,.action-card:hover{border-color:color-mix(in srgb,var(--text) 20%,transparent);background:var(--surface)}
select,input,textarea,.analytics-filter select,.analytics-filter input,.form-grid select,.form-grid input,
.salary-input input,.inline-sort select,.money-input input,.import-methods textarea,.view-toolbar select,
.period-selectors select{background:var(--input-bg);border-color:var(--border);color:var(--control-text)}
input::placeholder,textarea::placeholder{color:color-mix(in srgb,var(--text-muted) 78%,transparent);opacity:1}
input:disabled,select:disabled,textarea:disabled{background:var(--surface-3);color:var(--text-muted);opacity:.72}
input[readonly],textarea[readonly]{background:var(--surface-2);color:var(--text-soft)}
.primary,.button-primary{background:var(--button-bg);color:var(--button-text)}
.primary:hover,.button-primary:hover{background:color-mix(in srgb,var(--button-bg) 86%,var(--accent))}
.button-secondary,.accounts-page .button,.accounts-page .ghost{background:var(--surface-2);border-color:var(--border);color:var(--text)}
.button-secondary:hover,.button-ghost:hover{background:var(--hover);border-color:color-mix(in srgb,var(--text) 20%,transparent);color:var(--text)}
.data-table th{background:var(--table-head);color:var(--text-muted);border-color:var(--border)}
.data-table td{border-color:var(--divider)}.data-table tbody tr:hover{background:var(--hover)}
.code-value{background:var(--surface-3);color:color-mix(in srgb,var(--accent) 55%,var(--text))}
.store-link,.store-members-toggle{color:color-mix(in srgb,var(--accent) 64%,var(--text))}
.identity-line,.store-value,.store-address,.store-phone,.employee-note{color:var(--text-soft)}
.store-member-card{background:var(--surface-2);border-color:var(--border)}
.store-members-row td{background:color-mix(in srgb,var(--accent) 5%,var(--surface))}
.store-members-panel{border-color:color-mix(in srgb,var(--accent) 20%,transparent)}
.sort-button:hover,.sort-button.active,.store-sort-button:hover,.store-sort-button.active{color:var(--accent-soft)}
.form-grid>label,.store-choice-fieldset legend{color:var(--text)}
.import-step span{background:var(--surface-2)}
.notice--success{color:color-mix(in srgb,var(--success) 76%,var(--text));background:color-mix(in srgb,var(--success) 10%,var(--surface))}
.notice--error,.alert{color:color-mix(in srgb,var(--danger) 76%,var(--text));background:color-mix(in srgb,var(--danger) 10%,var(--surface))}

/* Sales workspaces keep achievement colors semantic while surfaces follow the theme. */
.analytics-shell{background:radial-gradient(circle at 85% 0,color-mix(in srgb,var(--accent) 12%,transparent),transparent 28%),var(--bg);color:var(--text)}
.analytics-topbar{background:var(--header-bg);border-color:var(--border)}
.analytics-brand{color:var(--text)}.analytics-brand small,.analytics-links a{color:var(--text-muted)}
.analytics-links a:hover,.analytics-links a.active{background:var(--hover);color:var(--text)}
.data-freshness,.analytics-filter,.view-tabs,.analytics-panel,.sales-kpis article,.region-card,.view-toolbar,
.raw-totals>div,.apply-summary>div{border-color:var(--border);background:var(--card-bg);box-shadow:var(--shadow)}
.view-tabs a{color:var(--text-muted)}.view-tabs a.active,.group-toggle a.active{background:var(--surface-3);color:var(--text)}
.sales-kpis span,.sales-kpis small,.gauge-summary span,.compact-heading>small,.view-toolbar small{color:var(--text-muted)}
.gauge-track,.mini-progress,.region-progress>div,.table-progress>span,.comparison-track{background:var(--surface-3)}
.gauge-marker{background:var(--text)}.gauge-marker span{background:var(--text);color:var(--bg)}
.milestone-detail,.milestone-detail div,.compact-region-list>div,.top-store-list>a,.region-card footer,
.region-store-head,.region-store-list>a,.region-group-total td{border-color:var(--divider)}
.top-store-list>a,.region-store-list>a{color:var(--text)}.region-store-list>a:hover{background:var(--hover)}
.rank{background:var(--surface-3);color:var(--accent-soft)}
.sales-table th,.paste-grid th{background:var(--table-head);color:var(--text-muted);border-color:var(--border)}
.sales-table td,.paste-grid td{background:var(--surface);color:var(--text);border-color:var(--divider)}
.sales-table tr:hover td{background:var(--hover)}
.spreadsheet-shell{background:var(--surface);border-color:var(--border)}
.paste-grid .row-number{background:var(--surface-2);color:var(--text-muted)}.paste-grid input{color:var(--text)}
.grid-summary,.grid-summary>span,.group-toggle{background:var(--surface-2);color:var(--text-soft)}
.legacy-upload[open] summary{border-color:var(--border)}
#applySavePanel{background:color-mix(in srgb,var(--surface) 94%,var(--success));box-shadow:var(--shadow)}
.grid-footer #gridHint strong,.grid-summary strong{color:var(--text)}
.trend-chart .grid line{stroke:var(--border)}.trend-labels,.chart-legend{color:var(--text-muted)}

/* Shared overlays and the administrator assistant. */
.astore-ai{color:var(--text)}
.astore-ai-launcher{background:linear-gradient(145deg,color-mix(in srgb,var(--accent2) 28%,var(--surface)),var(--surface));border-color:color-mix(in srgb,var(--accent2) 38%,transparent);color:var(--text);box-shadow:var(--shadow)}
.astore-ai-panel{background:color-mix(in srgb,var(--surface) 98%,transparent);border-color:var(--border);box-shadow:0 30px 90px color-mix(in srgb,var(--text) 18%,transparent)}
.astore-ai-header{background:linear-gradient(135deg,color-mix(in srgb,var(--accent2) 20%,var(--surface)),var(--surface));border-color:var(--border)}
.astore-ai-header small,.astore-ai-controls small,.astore-ai-controls label>span{color:var(--text-muted)}
.astore-ai-close,.astore-ai-controls select{background:var(--surface-2);border-color:var(--border);color:var(--text)}
.astore-ai-controls,.astore-ai-status,.astore-ai-composer{background:var(--surface);border-color:var(--border);color:var(--text-muted)}
.astore-ai-messages{background:radial-gradient(circle at 90% 10%,color-mix(in srgb,var(--accent2) 8%,transparent),transparent 34%),var(--surface-2)}
.astore-ai-bubble,.astore-ai-action-card{background:var(--surface);border-color:var(--border);color:var(--text)}
.astore-ai-action-card small{color:var(--text-muted)}
.astore-ai-composer textarea{background:var(--input-bg);border-color:var(--border);color:var(--text)}

/* AppleCare management/editor uses Hub theme. Product presentation remains intentionally light. */
.applecare-admin-tabs a,.applecare-source-note,.applecare-settings-form,.applecare-asset-form,
.applecare-editor-status,.applecare-editor-block,.applecare-filter-group,.applecare-bulk-select label,
.applecare-bulk-select button{background:var(--surface-2);border-color:var(--border);color:var(--text)}
.applecare-grid-wrap,.applecare-preview-table{border-color:var(--border)}
.applecare-grid th,.applecare-grid th:first-child,.applecare-grid td:first-child{background:var(--table-head);color:var(--text-muted)}
.applecare-grid td{background:var(--surface);border-color:var(--divider)}
.applecare-grid input,.applecare-grid select,.applecare-official-table input,.applecare-official-table select,
.applecare-settings-form input[type=number],.applecare-settings-form input[type=file],.applecare-asset-form input,
.applecare-asset-form select,.applecare-editor-block input,.applecare-editor-block textarea,
.applecare-editor-block select,.applecare-editor-card-row input,.applecare-editor-card-row select{
  background:var(--input-bg);border-color:var(--border);color:var(--text)
}
.applecare-editor-sort-row,.applecare-editor-card-row{background:var(--surface-2);border-color:var(--border)}
.applecare-save-bar{background:color-mix(in srgb,var(--surface) 94%,var(--accent));box-shadow:var(--shadow)}
.applecare-last-check,.applecare-review-guide,.applecare-editor-status,.applecare-editor-block>p,
.applecare-editor-block label,.applecare-editor-card-row label,.applecare-ipad-label{color:var(--text-muted)}

.theme-toggle{position:fixed;z-index:13000;top:17px;right:18px;display:inline-flex;align-items:center;gap:var(--space-2);min-height:var(--control-md);padding:0 var(--space-3);border:1px solid var(--border);border-radius:var(--radius-sm);background:color-mix(in srgb,var(--surface) 92%,transparent);box-shadow:0 10px 28px color-mix(in srgb,var(--text) 10%,transparent);color:var(--text);font-size:var(--text-caption);font-weight:750;backdrop-filter:blur(18px)}
.theme-toggle:hover{background:var(--surface);border-color:color-mix(in srgb,var(--accent) 38%,var(--border));transform:translateY(-1px)}
.theme-toggle:focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 28%,transparent);outline-offset:2px}
.theme-toggle__icon{display:grid;place-items:center;width:20px;height:20px;font-size:var(--text-body)}.theme-toggle__label{min-width:30px;text-align:left}

@media(max-width:960px){.admin-nav{padding-right:130px}.admin-nav>form{margin-right:0}}
@media(max-width:720px){
  .theme-toggle{top:13px;right:13px;min-height:var(--control-md);padding:0 var(--space-2)}.theme-toggle__label{display:none}.theme-toggle__icon{width:18px}
  .admin-nav{padding-right:58px}.admin-nav>form{margin-right:0}.role-admin-return-float{top:58px}
  .sidebar{background:var(--sidebar-bg)}
}
@media(prefers-reduced-motion:reduce){html,body,.sidebar,.admin-nav,.analytics-shell,.analytics-topbar,.metric-card,.feature-card,.data-panel,.bulk-panel,.form-panel,.import-panel,.analytics-panel,input,select,textarea,.theme-toggle{transition:none}}