/* ═══════════════════════════════════════════════════════════════════════════
   INO CRM 복사본 — 흰색 계열 테마 (CSS 덮어쓰기 전용, 2026-09-21)
   · 외주사 화면(templates/*.html)·기능 코드는 한 글자도 안 바꿈. 이 파일만 끼우면 흰 테마, 빼면 원래(검정+금색).
   · 끼우는 위치: 모든 <style> 뒤(</head> 바로 앞)가 가장 안전. 단, 아래 규칙은 전부 `html body …` 로
     우선순위를 올려 두었기 때문에 Tailwind CDN·core.js 가 나중에 넣는 <style> 보다도 이김.
   · 구성  1) 색 변수  2) 외주사 <style> 규칙을 1:1 로 옮긴 색 덮어쓰기(템플릿별)
           3) 다듬기(글꼴·표·버튼·입력칸·모달)  4) Tailwind 클래스  5) 인라인 style 색  6) 확장층(ino_ext) 패널  7) 인쇄
           8) 2차 정돈(머리 한 줄·현황 줄·접기·표 밀도·알림 센터) — 색이 아니라 배치·위계. static\layout.js 와 한 짝
   · 색 체계: 바탕 #f5f6f8 / 카드 #fff / 글자 #1f2329 / 보조 #626b78 / 포인트 = 차분한 남색 #2b4a8b (금색은 버림)
             상태색은 의미 유지: 있음·성공=초록, 오류=빨강, 경고=주황. 플랫폼 구분 점(금/보라/파랑/초록/빨강)은 유지.
   · 외주사가 새 화면·새 색을 넣으면: tests/theme_preview.py 를 돌려 대비 검사 0건인지 확인하고 여기에 규칙 추가.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── 1) 색 변수 ── */
:root {
    --t-bg: #f5f6f8;        /* 페이지 바탕 */
    --t-card: #ffffff;      /* 카드·입력칸·모달 */
    --t-sub: #f8f9fb;       /* 카드 안의 한 단계 옅은 칸, 표 머리줄 */
    --t-chip: #eef0f4;      /* 회색 배지·보조 버튼 바탕 */
    --t-line: #e4e7ec;      /* 옅은 테두리 */
    --t-line2: #cdd2db;     /* 입력칸 테두리 */
    --t-text: #1f2329;      /* 본문 글자 (흰 바탕 대비 15.9:1) */
    --t-text2: #3b4350;     /* 본문보다 살짝 옅은 글자 */
    --t-muted: #626b78;     /* 보조 글자 (흰 바탕 5.4:1) */
    --t-dim: #6a7281;       /* 0건·비활성처럼 일부러 흐린 글자 (흰 바탕 4.9:1) */
    --t-ac: #2b4a8b;        /* 포인트: 차분한 남색 (흰 바탕 8.6:1) */
    --t-ac-h: #223c72;      /* 포인트 hover */
    --t-ac-soft: #edf2fb;   /* 포인트 옅은 바탕 */
    --t-ac-line: #c9d6f0;   /* 포인트 옅은 테두리 */
    --t-ok: #15803d;        /* 있음·성공 글자 */
    --t-ok-soft: #e9f9ef;
    --t-ok-line: #a7e3bd;
    --t-bad: #b91c1c;       /* 오류 글자 */
    --t-bad-soft: #fdecec;
    --t-bad-line: #f3b4b4;
    --t-warn: #a44a08;      /* 경고 글자 */
    --t-warn-soft: #fff4e0;
    --t-warn-line: #f5cf8e;
    --t-info: #1d4ed8;
    --t-shadow: 0 1px 2px rgba(16,24,40,.05), 0 1px 3px rgba(16,24,40,.06);
    --t-shadow-lg: 0 12px 32px rgba(16,24,40,.16), 0 2px 6px rgba(16,24,40,.08);
    --t-font: 'Pretendard', 'Malgun Gothic', '맑은 고딕', -apple-system, 'Segoe UI', sans-serif;
    color-scheme: light;
}

/* ── 2) 외주사 <style> 규칙 색 덮어쓰기 (템플릿별, 원래 선택자 그대로 + html body) ── */
/* ── base.html ── */
html body { background: var(--t-bg); color: var(--t-text); }
html ::-webkit-scrollbar-thumb { background: var(--t-chip); }
html body .header { background: var(--t-sub); color: var(--t-text); border-bottom: 1px solid var(--t-line); }
html body .header-brand-icon { background: var(--t-ac); }
html body .header-brand-icon .material-symbols-outlined { color: #ffffff; }
html body .header h1 { color: var(--t-text); }
html body .header-nav { border-bottom: 1px solid var(--t-line); }
html body .nav-tab { color: var(--t-muted); }
html body .nav-tab:hover { color: var(--t-ac); }
html body .nav-tab.active { color: var(--t-ac); border-bottom-color: var(--t-ac); }
html body .nav-dropdown-toggle { color: var(--t-muted); }
html body .nav-dropdown-toggle:hover { color: var(--t-ac); }
html body .nav-dropdown-toggle.active { color: var(--t-ac); border-bottom-color: var(--t-ac); }
html body .nav-dropdown-menu { background: var(--t-card); border: 1px solid var(--t-line); box-shadow: 0 8px 24px rgba(16,24,40,0.11); }
html body .nav-dropdown-menu a { color: var(--t-muted); }
html body .nav-dropdown-menu a:hover { background: rgba(43,74,139,0.08); color: var(--t-ac); }
html body .nav-dropdown-menu a.active { color: var(--t-ac); background: rgba(43,74,139,0.06); }
html body .platform-btn { border: 1px solid rgba(43,74,139,0.30); background: rgba(43,74,139,0.08); color: var(--t-muted); }
html body .platform-btn:hover { background: rgba(43,74,139,0.16); color: var(--t-ac); }
html body .platform-btn.success { background: rgba(34,197,94,0.14); border-color: rgba(22,163,74,0.50); color: var(--t-ok); }
html body .platform-btn.error { background: rgba(239,68,68,0.11); border-color: rgba(220,38,38,0.50); color: var(--t-bad); }
html body .pgrid-all-btn { border: 1px solid rgba(43,74,139,0.20); background: rgba(43,74,139,0.06); color: var(--t-muted); }
html body .pgrid-all-btn:hover { background: rgba(43,74,139,0.16); color: var(--t-ac); }
html body .sync-btn { border: 1px solid rgba(43,74,139,0.15); background: rgba(43,74,139,0.04); color: var(--t-muted); }
html body .sync-btn:hover { background: rgba(43,74,139,0.12); color: var(--t-ac); }
html body .sync-btn.success, html body .pgrid-all-btn.success { background: rgba(34,197,94,0.14); border-color: rgba(22,163,74,0.50); color: var(--t-ok); }
html body .sync-btn.error, html body .pgrid-all-btn.error { background: rgba(239,68,68,0.11); border-color: rgba(220,38,38,0.50); color: var(--t-bad); }
html body .group-title { color: var(--t-muted); }
html body .sub-tab-bar { background: var(--t-card); border-bottom: 1px solid var(--t-line); }
html body .sub-tab { color: var(--t-muted); }
html body .sub-tab:hover { color: var(--t-text); }
html body .sub-tab.active { color: var(--t-ac); border-bottom-color: var(--t-ac); }
html body .api-card { background: var(--t-card); box-shadow: 0 1px 3px rgba(16,24,40,0.06); border: 1px solid var(--t-line); }
html body .api-card-header h3 { color: var(--t-text); }
html body .method-POST { background: rgba(43,74,139,0.16); color: var(--t-ac); }
html body .method-GET { background: rgba(34,197,94,0.14); color: var(--t-ok); }
html body .method-PUT { background: rgba(59,130,246,0.12); color: var(--t-info); }
html body .method-DELETE { background: rgba(239,68,68,0.11); color: var(--t-bad); }
html body .api-url { color: var(--t-muted); }
html body .api-desc { color: var(--t-muted); }
html body .step-bar { background: var(--t-sub); border: 1px solid var(--t-line); }
html body .step-dot { background: var(--t-chip); }
html body .step-dot.running { background: var(--t-ac); box-shadow: 0 0 0 3px rgba(43,74,139,0.20); }
html body .step-label { color: var(--t-muted); }
html body .step-label.success { color: var(--t-ok); }
html body .step-label.error { color: var(--t-bad); }
html body .step-label.running { color: var(--t-ac); }
html body .step-arrow { color: var(--t-dim); }
html body .step-arrow.done { color: var(--t-ok); }
html body .btn-run { background: var(--t-ac); color: #ffffff; }
html body .btn-run:hover { background: var(--t-ac-h); }
html body .btn-run:disabled { background: rgba(43,74,139,.45); }
html body .btn-run.btn-outline { color: var(--t-ac); border: 1px solid var(--t-ac); }
html body .btn-run.btn-outline:hover { background: rgba(43,74,139,0.08); }
html body .btn-run.btn-danger { color: var(--t-bad); }
html body .btn-run.btn-danger:hover { background: rgba(239,68,68,0.10); }
html body .api-fields { background: var(--t-sub); border: 1px solid var(--t-line); }
html body .field-label { color: var(--t-muted); }
html body .field-input { border: 1px solid var(--t-line); background: var(--t-card); color: var(--t-text); }
html body .field-input:focus { border-color: var(--t-ac); box-shadow: 0 0 0 2px rgba(43,74,139,0.10); }
html body .checkbox-group { border: 1px solid var(--t-line); background: var(--t-card); color: var(--t-text); }
html body .checkbox-group label { color: var(--t-text); }
html body .btn-run .spinner { border: 2px solid #ffffff; }
html body .result-area { border-top: 1px solid var(--t-line); }
html body .result-status.success { background: rgba(34,197,94,0.14); color: var(--t-ok); }
html body .result-status.error { background: rgba(239,68,68,0.11); color: var(--t-bad); }
html body .result-elapsed { color: var(--t-muted); }
html body .result-summary { background: rgba(43,74,139,0.08); border: 1px solid rgba(43,74,139,0.30); color: var(--t-ac); }
html body .result-summary .summary-page { color: var(--t-muted); }
html body .api-note { background: rgba(43,74,139,0.08); border: 1px solid rgba(43,74,139,0.30); color: var(--t-ac); }
html body .placeholder-page { color: var(--t-muted); }
html body .placeholder-page .title { color: var(--t-muted); }
html body .product-search { border: 1px solid var(--t-line2) !important; background: var(--t-card) !important; color: var(--t-text) !important; }
html body .product-search:focus { border-color: var(--t-ac) !important; box-shadow: 0 0 0 3px rgba(43,74,139,0.15) !important; }
html body .product-search::placeholder { color: var(--t-muted) !important; }
html body .product-filter { border: 1px solid var(--t-line); background: var(--t-card); color: var(--t-text); }
html body .product-table th { background: var(--t-card); border-bottom: 2px solid var(--t-line); color: var(--t-muted); }
html body .product-table td { border-bottom: 1px solid var(--t-line); color: var(--t-text); }
html body .product-table tbody tr:hover { background: rgba(43,74,139,0.04); }
html body .product-table .thumb { background: var(--t-chip); }
html body .status-badge { background: var(--t-chip); color: var(--t-muted); }
html body .status-badge.active { background: rgba(34,197,94,0.14); color: var(--t-ok); }
html body .status-badge.inactive { background: rgba(239,68,68,0.11); color: var(--t-bad); }
html body .status-badge.pending { background: rgba(43,74,139,0.16); color: var(--t-ac); }
html body .product-pagination button { border: 1px solid var(--t-line); background: var(--t-card); color: var(--t-text); }
html body .product-pagination button:hover { background: rgba(43,74,139,0.08); }
html body .product-pagination button.active { background: var(--t-ac); color: #ffffff; border-color: var(--t-ac); }
html body .product-total { color: var(--t-muted); }
html body .product-loading { color: var(--t-muted); }
html body .product-empty { color: var(--t-muted); }
html body .row-link-btn { border: 1px solid var(--t-line); background: var(--t-card); color: var(--t-text); }
html body .row-link-btn:hover { background: rgba(43,74,139,0.08); border-color: var(--t-ac); }
html body .row-link-btn.success { background: rgba(34,197,94,0.14); border-color: rgba(22,163,74,0.50); color: var(--t-ok); }
html body .row-link-btn.error { background: rgba(239,68,68,0.11); border-color: rgba(220,38,38,0.50); color: var(--t-bad); }
html body .header-summary { border: 1px solid var(--t-line); background: var(--t-card); }
html body .header-summary th, html body .header-summary td { color: var(--t-text); border-right: 1px solid var(--t-line); }
html body .header-summary thead th { background: var(--t-sub); color: var(--t-muted); }
html body .header-summary tbody th { color: var(--t-muted); background: var(--t-sub); }
html body .header-summary td.zero { color: var(--t-dim); }
html body .header-summary td.high { color: var(--t-ac); }
html body .header-summary tfoot th, html body .header-summary tfoot td { background: var(--t-sub); border-top: 1px solid var(--t-line); color: var(--t-ac); }
html body .header-summary tfoot th { color: var(--t-ac); }
html body .header-summary-help { border: 1px solid var(--t-line); color: var(--t-muted); }
html body .header-summary-help:hover { color: var(--t-ac); border-color: var(--t-ac); }
html body .hs-modal-backdrop { background: rgba(16,24,40,0.45); }
html body .hs-modal { background: var(--t-card); border: 1px solid var(--t-line); }
html body .hs-modal-header { border-bottom: 1px solid var(--t-line); }
html body .hs-modal-header span { color: var(--t-ac); }
html body .hs-modal-header button { color: var(--t-muted); }
html body .hs-modal-body { color: var(--t-text); }
html body .hs-modal-body h4 { color: var(--t-ac); border-bottom: 1px solid var(--t-line); }
html body .hs-modal-body code { background: var(--t-card); border: 1px solid var(--t-line); color: var(--t-ac); }
html body .hs-modal-body li { color: var(--t-text2); }
html body .hs-modal-body .pf-name { color: var(--t-text); }
html body .hs-note { color: var(--t-muted); border-top: 1px dashed var(--t-line); }

/* ── login.html ── */
html body { background: var(--t-bg); color: var(--t-text); }
html body .login-brand-icon { background: var(--t-ac); }
html body .login-brand-icon .material-symbols-outlined { color: #ffffff; }
html body .login-brand h1 { color: var(--t-text); }
html body .login-brand p { color: var(--t-muted); }
html body .login-card { background: var(--t-card); border: 1px solid var(--t-line); }
html body .login-label { color: var(--t-muted); }
html body .login-input { border: 1px solid var(--t-line); background: var(--t-card); color: var(--t-text); }
html body .login-input:focus { border-color: var(--t-ac); box-shadow: 0 0 0 3px rgba(43,74,139,0.15); }
html body .login-input::placeholder { color: var(--t-muted); }
html body .login-btn { background: var(--t-ac); color: #ffffff; }
html body .login-btn:hover { background: var(--t-ac-h); }
html body .login-error { background: rgba(239,68,68,0.11); border: 1px solid rgba(220,38,38,0.30); color: var(--t-bad); }

/* ── dashboard.html ── */
html body .sync-panel { background: var(--t-card); border: 1px solid var(--t-line); }
html body .sync-panel-title { color: var(--t-text); }
html body .sync-panel-title .material-symbols-outlined { color: var(--t-ac); }
html body .sync-card { background: var(--t-sub); border: 1px solid var(--t-line); }
html body .sync-card-name { color: var(--t-text); }
html body .sync-latest { border-bottom: 1px solid var(--t-line); }
html body .sync-badge.success { background: rgba(34,197,94,0.14); color: var(--t-ok); }
html body .sync-badge.error { background: rgba(239,68,68,0.11); color: var(--t-bad); }
html body .sync-time { color: var(--t-muted); }
html body .sync-latest-detail { color: var(--t-muted); }
html body .sync-latest-detail .count { color: var(--t-ac); }
html body .sync-latest-error { color: var(--t-bad); }
html body .sync-history-row { color: var(--t-muted); }
html body .sync-empty { color: var(--t-muted); }
html body .sync-no-scheduler { color: var(--t-muted); }
html body .ch-card { background: var(--t-card); border: 1px solid var(--t-line); }
html body .ch-card-name { color: var(--t-text); }
html body .ch-stat-label { color: var(--t-muted); }
html body .ch-stat-total { color: var(--t-text); }
html body .ch-stat-today { color: var(--t-ac); }
html body .ch-stat-today.zero { color: var(--t-muted); }

/* ── unified_products.html ── */
html body .unified-toolbar select { border: 1px solid var(--t-line); background: var(--t-card); color: var(--t-text); }
html body .unified-table th { background: var(--t-card); border-bottom: 2px solid var(--t-line); color: var(--t-muted); }
html body .unified-table td { border-bottom: 1px solid var(--t-line); color: var(--t-text); }
html body .unified-table tbody tr.data-row:hover { background: rgba(43,74,139,0.04); }
html body .filter-panel { background: var(--t-card); border: 1px solid var(--t-line); }
html body .filter-mode { border-bottom: 1px solid var(--t-line); }
html body .filter-mode label { color: var(--t-text); }
html body .filter-mode input { accent-color: var(--t-ac); }
html body .filter-title { color: var(--t-ac); }
html body .filter-select { border: 1px solid var(--t-line); background: var(--t-card); color: var(--t-text); }
html body .filter-plats label { color: var(--t-text); border: 1px solid var(--t-line); background: var(--t-card); }
html body .filter-plats label:has(input:checked) { border-color: var(--t-ac); background: rgba(43,74,139,0.10); color: var(--t-ac); }
html body .filter-plats input { accent-color: var(--t-ac); }
html body .filter-btn.apply { background: var(--t-ac); color: #ffffff; }
html body .filter-btn.reset { background: var(--t-card); color: var(--t-muted); border: 1px solid var(--t-line); }
html body .link-badge.linked { background: rgba(34,197,94,0.14); color: var(--t-ok); }
html body .link-badge.unlinked { background: var(--t-chip); color: var(--t-muted); }
html body .link-dot.off { background: var(--t-chip); }
html body .detail-row td { background: var(--t-sub); }
html body .detail-panel { border-top: 2px solid var(--t-ac); }
html body .detail-master { background: rgba(43,74,139,0.08); border: 1px solid rgba(43,74,139,0.30); }
html body .detail-master strong { color: var(--t-ac); }
html body .dm-label { color: var(--t-muted); }
html body .dm-value { color: var(--t-text); }
html body .platform-card { border: 1px solid var(--t-line); background: var(--t-card); }
html body .platform-card.linked-card { border-color: rgba(22,163,74,0.50); }
html body .pc-title { color: var(--t-text); }
html body .pc-status-linked { color: var(--t-ok); }
html body .pc-status-unlinked { color: var(--t-muted); }
html body .pc-info-label { color: var(--t-muted); }
html body .pc-info-value { color: var(--t-text); }
html body .pc-btn { border: 1px solid var(--t-line); background: var(--t-sub); color: var(--t-text); }
html body .pc-btn:hover { background: rgba(43,74,139,0.08); }
html body .pc-btn.btn-link { border-color: var(--t-ac); color: var(--t-ac); }
html body .pc-btn.btn-link:hover { background: rgba(43,74,139,0.08); }
html body .pc-btn.btn-unlink { color: var(--t-bad); }
html body .pc-btn.btn-unlink:hover { background: rgba(239,68,68,0.10); }
html body .expand-btn { border: 1px solid var(--t-line); background: var(--t-card); color: var(--t-text); }
html body .expand-btn:hover { background: rgba(43,74,139,0.08); }
html body .price-adjust { background: var(--t-card); border: 1px solid var(--t-line); }
html body .price-adjust h4 { color: var(--t-ac); }
html body .pa-label { color: var(--t-text); }
html body .pa-pct { color: var(--t-muted); }
html body .pa-input { border: 1px solid var(--t-line); background: var(--t-card); color: var(--t-text); }
html body .pa-input:focus { border-color: var(--t-ac); }
html body .pa-unit { color: var(--t-muted); }
html body .pa-calc { background: var(--t-card); color: var(--t-ac); border: 1px solid var(--t-ac); }
html body .pa-calc:hover { background: rgba(43,74,139,0.10); }
html body .pa-apply { background: var(--t-ac); color: #ffffff; }
html body .pa-apply:hover { background: var(--t-ac-h); }
html body .pa-result.ok { color: var(--t-ok); }
html body .pa-result.err { color: var(--t-bad); }
html body .stock-btn-soldout { border-color: #ea8a3e; color: var(--t-warn); }
html body .stock-btn-soldout:hover { background: rgba(249,115,22,0.10); }
html body .stock-btn-resume { color: var(--t-ok); }
html body .stock-btn-resume:hover { background: rgba(34,197,94,0.10); }
html body .stock-badge.stock-on { background: rgba(34,197,94,0.14); color: var(--t-ok); }
html body .stock-badge.stock-off { background: rgba(239,68,68,0.11); color: var(--t-bad); }
html body .stock-badge.stock-na { background: var(--t-chip); color: var(--t-muted); }
html body .stock-indicator.na { background: var(--t-chip); }
html body .modal-overlay { background: rgba(16,24,40,0.45); }
html body .modal-box { background: var(--t-card); box-shadow: 0 20px 60px rgba(16,24,40,0.14); border: 1px solid var(--t-line); }
html body .modal-title { color: var(--t-text); }
html body .modal-info { color: var(--t-muted); background: var(--t-sub); }
html body .modal-search-type label { color: var(--t-text); }
html body .modal-search-bar input { border: 1px solid var(--t-line); background: var(--t-card); color: var(--t-text); }
html body .modal-search-bar input:focus { border-color: var(--t-ac); }
html body .modal-search-bar button { background: var(--t-ac); color: #ffffff; }
html body .modal-search-bar button:hover { background: var(--t-ac-h); }
html body .modal-result-item { border: 1px solid var(--t-line); }
html body .modal-result-item:hover { border-color: var(--t-ac); background: rgba(43,74,139,0.08); }
html body .modal-result-item.selected { border-color: var(--t-ac); background: rgba(43,74,139,0.12); }
html body .modal-result-item.already-linked { border-color: var(--t-line); }
html body .modal-result-item.already-linked:hover { background: var(--t-card); border-color: var(--t-line); }
html body .mri-name { color: var(--t-text); }
html body .mri-meta { color: var(--t-muted); }
html body .mri-already { color: var(--t-bad); }
html body .modal-btn-cancel { border: 1px solid var(--t-line); background: var(--t-sub); color: var(--t-text); }
html body .modal-btn-cancel:hover { background: rgba(43,74,139,0.08); }
html body .modal-btn-confirm { background: var(--t-ac); color: #ffffff; }
html body .modal-btn-confirm:hover { background: var(--t-ac-h); }
html body .modal-btn-confirm:disabled { background: rgba(43,74,139,.45); }
html body .modal-loading { color: var(--t-muted); }
html body .modal-empty { color: var(--t-muted); }

/* ── unified_upload.html ── */
html body .section-card { background: var(--t-card); border: 1px solid var(--t-line); }
html body .section-title { color: var(--t-text); border-bottom: 2px solid var(--t-line); }
html body .field-label { color: var(--t-muted); }
html body .field-input-wrap input[type="text"], html body .field-input-wrap input[type="number"] { border: 1px solid var(--t-line); background: var(--t-card); color: var(--t-text); }
html body .file-thumb { border: 1px solid var(--t-line); }
html body .img-row { background: var(--t-sub); border: 1px solid var(--t-line); }
html body .img-row.is-thumb { border-color: var(--t-ac); background: var(--t-ac-soft); }
html body .img-row .img-thumb { border: 1px solid var(--t-line); }
html body .img-row .img-label { color: var(--t-muted); background: var(--t-chip); }
html body .img-row.is-thumb .img-label { background: var(--t-ac); color: #ffffff; }
html body .img-row .img-name { color: var(--t-text); }
html body .img-row .img-btn { background: var(--t-chip); border: 1px solid var(--t-line2); color: var(--t-text); }
html body .img-row .img-btn:hover:not(:disabled) { background: #dfe3ea; }
html body .img-row .img-btn.remove { color: var(--t-bad); border-color: #f3b4b4; }
html body .img-row .img-btn.remove:hover { background: #dc2626; color: #ffffff; }
html body .img-add-btn { background: var(--t-chip); border: 1px dashed var(--t-line2); color: var(--t-text); }
html body .img-add-btn:hover { background: #dfe3ea; }
html body .file-count { color: var(--t-muted); }
html body .platform-toggle { border: 2px solid var(--t-line); color: var(--t-text); }
html body .platform-toggle:hover { border-color: rgba(43,74,139,0.50); }
html body .platform-toggle.active { border-color: var(--t-ac); background: rgba(43,74,139,0.08); }
html body .platform-tab { background: var(--t-chip); color: var(--t-muted); }
html body .platform-tab.active { background: var(--t-ac); color: #ffffff; }
html body .platform-tab:hover:not(.active) { background: rgba(43,74,139,0.12); }
html body .pf-field label { color: var(--t-muted); }
html body .pf-field input, html body .pf-field select, html body .pf-field textarea { border: 1px solid var(--t-line); background: var(--t-card); color: var(--t-text); }
html body .checkbox-group label { color: var(--t-text); }
html body .loading-badge { color: var(--t-muted); }
html body .brand-search-row button { background: var(--t-ac); color: #ffffff; }
html body .brand-search-row button:disabled { background: rgba(43,74,139,.45); }
html body .brand-selected-info { color: var(--t-ok); }
html body .btn-upload { background: var(--t-ac); color: #ffffff; }
html body .btn-upload:hover { background: var(--t-ac-h); }
html body .btn-upload:disabled { background: rgba(43,74,139,.45); }
html body .result-row.success { background: rgba(34,197,94,0.10); border: 1px solid rgba(22,163,74,0.30); }
html body .result-row.error { background: rgba(239,68,68,0.10); border: 1px solid rgba(220,38,38,0.30); }
html body .result-row.pending { background: var(--t-card); border: 1px solid var(--t-line); }
html body .result-platform { color: var(--t-text); }
html body .result-detail { color: var(--t-muted); }
html body .spinner { border: 2px solid var(--t-line); border-top-color: var(--t-ac); }
html body .tag-input-wrap { border: 1px solid var(--t-line); background: var(--t-card); }
html body .tag-input-wrap .tag-badge { background: var(--t-ac); color: #ffffff; }
html body .tag-input-wrap .tag-text-input { color: var(--t-text); }
html body .cs-display { border: 1px solid var(--t-line); background: var(--t-card); color: var(--t-text); }
html body .cs-display::after { color: var(--t-muted); }
html body .cs-dropdown { background: var(--t-card); border: 1px solid var(--t-line); box-shadow: 0 4px 12px rgba(16,24,40,0.11); }
html body .cs-search { border-bottom: 1px solid var(--t-line); background: var(--t-card); color: var(--t-text); }
html body .cs-search::placeholder { color: var(--t-dim); }
html body .cs-option { color: var(--t-text); }
html body .cs-option:hover, html body .cs-option.selected { background: var(--t-chip); color: var(--t-ac); }

/* ── price_settings.html ── */
html body .ps-header h2 { color: var(--t-text); }
html body .ps-header p { color: var(--t-muted); }
html body .ps-card { background: var(--t-card); border: 1px solid var(--t-line); }
html body .ps-base { background: rgba(43,74,139,0.06); border: 1px solid rgba(43,74,139,0.30); }
html body .ps-base .ps-base-name { color: var(--t-ac); }
html body .ps-base .ps-base-desc { color: var(--t-muted); }
html body .ps-base .ps-base-val { color: var(--t-ac); }
html body .ps-row { border-bottom: 1px solid var(--t-line); }
html body .ps-row-name { color: var(--t-text); }
html body .ps-row-input { border: 1px solid var(--t-line); background: var(--t-card); color: var(--t-text); }
html body .ps-row-input:focus { border-color: var(--t-ac); }
html body .ps-row-unit { color: var(--t-muted); }
html body .ps-btn.primary { background: var(--t-ac); color: #ffffff; }
html body .ps-btn.primary:hover { background: var(--t-ac-h); }
html body .ps-toast.success { color: var(--t-text); }
html body .ps-toast.error { background: #dc2626; color: #ffffff; }

/* ── price_bulk.html ── */
html body .pb-header h2 { color: var(--t-text); }
html body .pb-header p { color: var(--t-muted); }
html body .pb-card { background: var(--t-card); border: 1px solid var(--t-line); }
html body .pb-form select, html body .pb-form input { border: 1px solid var(--t-line); background: var(--t-card); color: var(--t-text); }
html body .pb-btn.outline { background: var(--t-card); color: var(--t-ac); border: 1px solid var(--t-ac); }
html body .pb-btn.primary { background: var(--t-ac); color: #ffffff; }
html body .pb-btn.danger { background: #dc2626; color: #ffffff; }
html body .pb-radio { color: var(--t-text); }
html body .pb-target textarea { border: 1px solid var(--t-line); background: var(--t-card); color: var(--t-text); }
html body .pb-preview { color: var(--t-text); }
html body .pb-preview th, html body .pb-preview td { border-bottom: 1px solid var(--t-line); }
html body .pb-progress { background: var(--t-sub); }
html body .pb-progress-bar { background: var(--t-ac); }
html body .pb-job { border: 1px solid var(--t-line); }
html body .pb-status.cancelled { background: var(--t-chip); color: var(--t-muted); }
html body .pb-status.failed { background: #dc2626; color: var(--t-bad); }
html body .pb-status.pending { background: var(--t-chip); color: var(--t-muted); }
html body .pb-muted { color: var(--t-muted); }

/* ── scheduler_settings.html ── */
html body .ss-summary { background: var(--t-card); border: 1px solid var(--t-line); }
html body .ss-summary-item { color: var(--t-muted); }
html body .ss-summary-item strong { color: var(--t-text); }
html body .ss-summary-item.active strong { color: var(--t-ok); }
html body .ss-btn { border: 1px solid var(--t-line); background: var(--t-card); color: var(--t-text); }
html body .ss-btn:hover { background: rgba(43,74,139,0.08); }
html body .ss-btn.danger { color: var(--t-bad); border-color: rgba(220,38,38,0.30); }
html body .ss-btn.danger:hover { background: rgba(239,68,68,0.10); }
html body .ss-btn.success { color: var(--t-ok); border-color: rgba(22,163,74,0.30); }
html body .ss-btn.success:hover { background: rgba(34,197,94,0.10); }
html body .ss-group-title { color: var(--t-muted); border-bottom: 2px solid var(--t-line); }
html body .ss-table th { color: var(--t-muted); border-bottom: 1px solid var(--t-line); }
html body .ss-table td { border-bottom: 1px solid var(--t-line); color: var(--t-text); }
html body .ss-table tbody tr:hover { background: rgba(43,74,139,0.04); }
html body .toggle-slider { background: var(--t-chip); box-shadow: inset 0 1px 3px rgba(16,24,40,0.08); }
html body .toggle-slider:before { background: var(--t-chip); box-shadow: 0 1px 3px rgba(16,24,40,0.08); }
html body .toggle-switch input:checked + .toggle-slider { box-shadow: inset 0 1px 3px rgba(16,24,40,0.06); }
html body .ss-interval-num { border: 1px solid var(--t-line); background: var(--t-sub); color: var(--t-text); }
html body .ss-interval-num:focus { border-color: var(--t-ac); box-shadow: 0 0 0 2px rgba(43,74,139,0.15); }
html body .ss-interval-unit { border: 1px solid var(--t-line); background: var(--t-sub); color: var(--t-text); }
html body .ss-status.success { background: rgba(34,197,94,0.14); color: var(--t-ok); }
html body .ss-status.error { background: rgba(239,68,68,0.11); color: var(--t-bad); }
html body .ss-status.none { color: var(--t-muted); }
html body .ss-time { color: var(--t-muted); }
html body .ss-time.next { color: var(--t-ac); }
html body .ss-run-btn { border: 1px solid rgba(43,74,139,0.30); background: rgba(43,74,139,0.08); color: var(--t-ac); }
html body .ss-run-btn:hover { background: rgba(43,74,139,0.16); border-color: rgba(43,74,139,0.50); }
html body .ss-run-btn .spinner { border: 2px solid rgba(43,74,139,0.30); border-top-color: var(--t-ac); }
html body .ss-loading { color: var(--t-muted); }

/* ── scheduler_logs.html ── */
html body .sl-filter { background: var(--t-card); border: 1px solid var(--t-line); }
html body .sl-filter select { border: 1px solid var(--t-line); background: var(--t-card); color: var(--t-text); }
html body .sl-filter select:focus { border-color: var(--t-ac); }
html body .sl-total { color: var(--t-muted); }
html body .sl-btn { border: 1px solid var(--t-line); background: var(--t-card); color: var(--t-text); }
html body .sl-btn:hover { background: rgba(43,74,139,0.08); }
html body .sl-table { background: var(--t-card); border: 1px solid var(--t-line); }
html body .sl-table th { color: var(--t-muted); background: var(--t-sub); border-bottom: 1px solid var(--t-line); }
html body .sl-table td { border-bottom: 1px solid var(--t-line); color: var(--t-text); }
html body .sl-table tbody tr:hover { background: rgba(43,74,139,0.04); }
html body .sl-table tbody tr.error-row { background: rgba(239,68,68,0.10); }
html body .sl-table tbody tr.error-row:hover { background: rgba(239,68,68,0.11); }
html body .sl-status.success { background: rgba(34,197,94,0.14); color: var(--t-ok); }
html body .sl-status.error { background: rgba(239,68,68,0.11); color: var(--t-bad); }
html body .sl-platform { background: var(--t-chip); color: var(--t-muted); }
html body .sl-error-detail { background: rgba(239,68,68,0.10); border-bottom: 1px solid rgba(220,38,38,0.30); color: var(--t-bad); }
html body .sl-error-text { background: var(--t-sub); border: 1px solid rgba(220,38,38,0.30); color: var(--t-bad); }
html body .sl-time { color: var(--t-muted); }
html body .sl-elapsed { color: var(--t-muted); }
html body .sl-count { color: var(--t-text); }
html body .sl-empty { color: var(--t-muted); }

/* ── user_settings.html ── */
html body .us-title { color: var(--t-text); }
html body .us-add-btn { background: var(--t-ac); color: #ffffff; }
html body .us-add-btn:hover { background: var(--t-ac-h); }
html body .us-table-wrap { background: var(--t-card); border: 1px solid var(--t-line); }
html body .us-table th { color: var(--t-muted); background: var(--t-sub); border-bottom: 1px solid var(--t-line); }
html body .us-table td { border-bottom: 1px solid var(--t-line); color: var(--t-text); }
html body .us-table tbody tr:hover { background: rgba(43,74,139,0.04); }
html body .us-status.active { background: rgba(34,197,94,0.14); color: var(--t-ok); }
html body .us-status.inactive { background: rgba(239,68,68,0.11); color: var(--t-bad); }
html body .us-action-btn { border: 1px solid var(--t-line); background: var(--t-card); color: var(--t-text); }
html body .us-action-btn:hover { background: rgba(43,74,139,0.08); border-color: var(--t-ac); }
html body .us-action-btn.danger { color: var(--t-bad); border-color: rgba(220,38,38,0.30); }
html body .us-action-btn.danger:hover { background: rgba(239,68,68,0.10); }
html body .us-time { color: var(--t-muted); }
html body .us-empty { color: var(--t-muted); }
html body .us-modal-overlay { background: rgba(16,24,40,0.45); }
html body .us-modal { background: var(--t-card); border: 1px solid var(--t-line); box-shadow: 0 16px 48px rgba(16,24,40,0.14); }
html body .us-modal-title { color: var(--t-text); }
html body .us-modal-label { color: var(--t-muted); }
html body .us-modal-input { border: 1px solid var(--t-line); background: var(--t-card); color: var(--t-text); }
html body .us-modal-input:focus { border-color: var(--t-ac); box-shadow: 0 0 0 3px rgba(43,74,139,0.15); }
html body .us-modal-cancel { color: var(--t-muted); border: 1px solid var(--t-line); }
html body .us-modal-cancel:hover { background: rgba(43,74,139,0.04); }
html body .us-modal-save { background: var(--t-ac); color: #ffffff; }
html body .us-modal-save:hover { background: var(--t-ac-h); }
html body .us-modal-save:disabled { background: rgba(43,74,139,0.32); }
html body .us-modal-msg.ok { color: var(--t-ok); }
html body .us-modal-msg.err { color: var(--t-bad); }
html body .us-pw-hint { color: var(--t-muted); }

/* ── account_settings.html ── */
html body .as-header { color: var(--t-text); }
html body .as-card { background: var(--t-card); border: 1px solid var(--t-line); }
html body .as-card-header { border-bottom: 1px solid var(--t-line); }
html body .as-card-header:hover { background: rgba(43,74,139,0.04); }
html body .as-platform-name { color: var(--t-text); }
html body .as-status.saved { background: rgba(34,197,94,0.14); color: var(--t-ok); }
html body .as-status.empty { color: var(--t-warn); }
html body .as-toggle { color: var(--t-muted); }
html body .as-label { color: var(--t-muted); }
html body .as-input { border: 1px solid var(--t-line); background: var(--t-card); color: var(--t-text); }
html body .as-input:focus { border-color: var(--t-ac); box-shadow: 0 0 0 3px rgba(43,74,139,0.15); }
html body .as-eye-btn { color: var(--t-muted); }
html body .as-eye-btn:hover { color: var(--t-ac); }
html body .as-save-btn { background: var(--t-ac); color: #ffffff; }
html body .as-save-btn:hover { background: var(--t-ac-h); }
html body .as-save-btn:disabled { background: rgba(43,74,139,0.32); }
html body .as-save-msg.ok { color: var(--t-ok); }
html body .as-save-msg.err { color: var(--t-bad); }
html body .as-updated { color: var(--t-muted); }

/* ── api.html ── */
html body .tag-input-wrap { border: 1px solid var(--t-line); }
html body .tag-input-wrap .tag-badge { background: var(--t-ac); color: #ffffff; }

/* ── orders.html ── */
html body .date-filter-group { background: var(--t-sub); border: 1px solid var(--t-line); }
html body .date-preset-btn { color: var(--t-muted); }
html body .date-preset-btn:hover { background: var(--t-chip); color: var(--t-text); }
html body .date-preset-btn.active { background: var(--t-ac); color: #ffffff; box-shadow: 0 1px 4px rgba(43,74,139,0.30); }

/* ── 3) 다듬기: 글꼴·머리·표·버튼·입력칸·모달 ── */
html body,
html body button, html body input, html body select, html body textarea,
html body .login-input, html body .login-btn, html body .nav-dropdown-toggle {
    font-family: var(--t-font);
}
html body { -webkit-font-smoothing: antialiased; letter-spacing: -0.005em; }
html body .header h1, html body .login-brand h1, html body .font-serif {
    font-family: var(--t-font); font-weight: 800; letter-spacing: -0.02em; color: var(--t-text);
}
html body .material-symbols-outlined { font-family: 'Material Symbols Outlined'; }
html body .api-url, html body pre, html body code { font-family: 'Cascadia Code', 'Consolas', 'Malgun Gothic', monospace; }

/* 숫자 열은 자릿수 맞춤 */
html body table, html body .ch-stat-total, html body .ch-stat-today, html body .sync-time, html body .sync-latest-detail,
html body .sync-history-row, html body .product-total, html body .pa-input, html body input[type="number"],
html body .product-pagination, html body .inoext-panel { font-variant-numeric: tabular-nums; }

/* 스크롤바 */
html ::-webkit-scrollbar { width: 10px; height: 10px; }
html ::-webkit-scrollbar-thumb { background: #cfd4dc; border-radius: 10px; border: 2px solid var(--t-bg); }
html ::-webkit-scrollbar-thumb:hover { background: #b3bac6; }
html body ::selection { background: rgba(43,74,139,.18); }

/* 머리(로고·요약표·메뉴): 흰 띠 + 아래 옅은 그림자 */
html body .header { background: var(--t-card); border-bottom: 1px solid var(--t-line); box-shadow: 0 1px 0 rgba(16,24,40,.02), 0 2px 8px rgba(16,24,40,.04); }
html body .header-nav { border-bottom: none; }
html body .nav-tab, html body .nav-dropdown-toggle { font-weight: 600; color: var(--t-muted); }
html body .nav-tab:hover, html body .nav-dropdown-toggle:hover { color: var(--t-text); }
html body .nav-tab.active, html body .nav-dropdown-toggle.active { color: var(--t-ac); border-bottom-color: var(--t-ac); }
html body .nav-dropdown-menu { box-shadow: var(--t-shadow-lg); border-radius: 10px; }
html body .nav-dropdown-menu a { color: var(--t-text2); }
html body .nav-dropdown-menu a:hover, html body .nav-dropdown-menu a.active { background: var(--t-ac-soft); color: var(--t-ac); }
html body .header-nav-user a[href="/logout"] { border-radius: 6px; }

/* 머리 요약표 */
html body .header-summary { background: var(--t-card); border: 1px solid var(--t-line); box-shadow: var(--t-shadow); }
html body .header-summary th, html body .header-summary td { color: var(--t-text); border-right: 1px solid var(--t-line); }
html body .header-summary thead th { background: var(--t-sub); color: var(--t-muted); font-weight: 600; }
html body .header-summary tbody th { background: var(--t-card); color: var(--t-text2); font-weight: 600; }
html body .header-summary tbody tr + tr th, html body .header-summary tbody tr + tr td { border-top: 1px solid #f0f2f5; }
html body .header-summary td.zero { color: var(--t-dim); }
html body .header-summary td.high { color: var(--t-ac); }
html body .header-summary tfoot th, html body .header-summary tfoot td { background: var(--t-ac-soft); border-top: 1px solid var(--t-ac-line); color: var(--t-ac); }
html body .header-summary .pf-dot { width: 7px; height: 7px; }
html body .header-summary-help { border-color: var(--t-line2); color: var(--t-muted); }
html body .header-summary-help:hover { color: var(--t-ac); border-color: var(--t-ac); }
html body .hs-delta { font-variant-numeric: tabular-nums; }

/* 플랫폼 바로가기 작은 버튼(로컬 전용) */
html body .platform-btn, html body .pgrid-all-btn, html body .sync-btn {
    background: var(--t-card); border: 1px solid var(--t-line2); color: var(--t-text2);
}
html body .platform-btn:hover, html body .pgrid-all-btn:hover, html body .sync-btn:hover {
    background: var(--t-ac-soft); border-color: var(--t-ac); color: var(--t-ac);
}

/* 카드류: 흰 바탕 + 옅은 테두리·그림자 */
html body .api-card, html body .sync-panel, html body .ch-card, html body .section-card, html body .pb-card,
html body .filter-panel, html body .login-card {
    background: var(--t-card); border: 1px solid var(--t-line); box-shadow: var(--t-shadow);
}
html body .sync-card { background: var(--t-sub); border: 1px solid var(--t-line); }
html body .sync-panel-title .material-symbols-outlined { color: var(--t-ac); }
html body .ch-stat-total { color: var(--t-text); letter-spacing: -0.02em; }
html body .ch-stat-today { color: var(--t-ok); }
html body .ch-stat-today.zero { color: var(--t-dim); }
html body .sync-latest-detail .count { color: var(--t-text); font-weight: 600; }
html body .section-title { border-bottom: 1px solid var(--t-line); }

/* 표: 줄 간격 넉넉히, 머리줄은 옅은 회색 띠, 행 hover 옅게 */
html body .product-table-wrap { background: var(--t-card); border: 1px solid var(--t-line); border-radius: 10px; box-shadow: var(--t-shadow); }
html body .product-table th, html body .unified-table th {
    background: var(--t-sub); color: var(--t-muted); font-weight: 700; font-size: 12px;
    padding: 11px 12px; border-bottom: 1px solid var(--t-line2);
}
html body .product-table thead th:first-child, html body .unified-table thead th:first-child { border-top-left-radius: 10px; }
html body .product-table thead th:last-child, html body .unified-table thead th:last-child { border-top-right-radius: 10px; }
html body .product-table td, html body .unified-table td {
    padding: 12px 12px; border-bottom: 1px solid #eef0f3; color: var(--t-text); line-height: 1.55; word-break: keep-all;
}
html body .unified-table .detail-row > td { padding: 0; }
html body .product-table td[style*="text-align:right"], html body .unified-table td[style*="text-align:right"] { white-space: nowrap; }
html body .status-badge, html body .link-badge, html body .stock-badge { white-space: nowrap; }
html body .product-table tbody tr:last-child td, html body .unified-table tbody tr:last-child td { border-bottom: none; }
html body .product-table tbody tr:hover, html body .unified-table tbody tr.data-row:hover { background: #f4f7fd; }
html body .product-table .thumb, html body .unified-table .thumb { background: var(--t-chip); border: 1px solid var(--t-line); }
html body .product-loading, html body .product-empty { color: var(--t-muted); }
html body .product-total { color: var(--t-muted); font-weight: 600; }
html body .detail-row td { background: var(--t-sub); }
html body .detail-panel { border-top: 2px solid var(--t-ac); }
html body .detail-master { background: var(--t-ac-soft); border: 1px solid var(--t-ac-line); color: var(--t-text); }
html body .platform-card { background: var(--t-card); box-shadow: var(--t-shadow); }
html body .platform-card.linked-card { border-color: var(--t-ok-line); }
html body .price-adjust { background: var(--t-card); }

/* 배지: 의미색 유지(초록=있음/성공, 빨강=오류/품절, 주황=경고/대기, 회색=없음) */
html body .status-badge, html body .link-badge.unlinked, html body .stock-badge.stock-na { background: var(--t-chip); color: var(--t-muted); }
html body .status-badge.active, html body .link-badge.linked, html body .stock-badge.stock-on,
html body .sync-badge.success, html body .result-status.success { background: var(--t-ok-soft); color: var(--t-ok); }
html body .status-badge.inactive, html body .stock-badge.stock-off,
html body .sync-badge.error, html body .result-status.error { background: var(--t-bad-soft); color: var(--t-bad); }
html body .status-badge.pending { background: var(--t-warn-soft); color: var(--t-warn); }
html body .link-dot.off { background: #c3c9d3; }
html body .link-dot.on, html body .stock-indicator.on, html body .sync-dot.success { background: #16a34a; }
html body .stock-indicator.off, html body .sync-dot.error { background: #dc2626; }
html body .stock-indicator.na { background: #c3c9d3; }
html body .method-GET { background: var(--t-ok-soft); color: var(--t-ok); }
html body .method-POST { background: var(--t-ac-soft); color: var(--t-ac); }
html body .method-DELETE { background: var(--t-bad-soft); color: var(--t-bad); }
html body .step-dot { background: #c3c9d3; }
html body .step-dot.success { background: #16a34a; }
html body .step-dot.error { background: #dc2626; }
html body .step-dot.running { background: var(--t-ac); }
html body .pb-progress { background: var(--t-chip); }
html body .pb-status { font-weight: 600; }
html body .pb-status.running { background: #e5efff; color: var(--t-info); }
html body .pb-status.completed { background: var(--t-ok-soft); color: var(--t-ok); }
html body .pb-status.cancelled, html body .pb-status.pending { background: var(--t-chip); color: var(--t-muted); }
html body .pb-status.failed { background: var(--t-bad-soft); color: var(--t-bad); }

/* 버튼: 둥근 7px, 주 버튼만 포인트 색 */
html body .btn-run, html body .btn-upload, html body .filter-btn, html body .pa-calc, html body .pa-apply,
html body .pb-btn, html body .modal-footer button, html body .modal-search-bar button, html body .brand-search-row button,
html body .login-btn { border-radius: 7px; }
html body .btn-run, html body .btn-upload, html body .filter-btn.apply, html body .pa-apply, html body .pb-btn.primary,
html body .modal-btn-confirm, html body .modal-search-bar button, html body .brand-search-row button, html body .login-btn {
    background: var(--t-ac); color: #ffffff; box-shadow: 0 1px 2px rgba(16,24,40,.12);
}
html body .btn-run:hover, html body .btn-upload:hover, html body .filter-btn.apply:hover, html body .pa-apply:hover,
html body .pb-btn.primary:hover, html body .modal-btn-confirm:hover, html body .modal-search-bar button:hover,
html body .brand-search-row button:hover, html body .login-btn:hover { background: var(--t-ac-h); }
html body .btn-run:disabled, html body .btn-upload:disabled, html body .modal-btn-confirm:disabled,
html body .brand-search-row button:disabled, html body .pa-apply:disabled, html body .pb-btn.primary:disabled { background: #e3e8f2; color: #5f6c88; opacity: 1; box-shadow: none; }
/* 비활성은 반투명(opacity) 대신 회색 글자로 — 흰 바탕에서 반투명은 글자가 거의 안 보임 */
html body .product-pagination button:disabled, html body .row-link-btn:disabled, html body .pb-btn:disabled:not(.primary),
html body .img-row .img-btn:disabled, html body .stock-btn:disabled { opacity: 1; background: var(--t-sub); color: var(--t-dim); border-color: var(--t-line); }
html body .filter-row.disabled { opacity: 1; }
html body .filter-row.disabled .filter-title, html body .filter-row.disabled select, html body .filter-row.disabled label { color: var(--t-dim); background: var(--t-sub); border-color: var(--t-line); }
html body .filter-row.disabled .filter-title { background: transparent; }
html body .modal-result-item.already-linked { opacity: 1; background: var(--t-sub); }
html body .modal-result-item.already-linked .mri-name, html body .modal-result-item.already-linked .mri-meta { color: var(--t-dim); }
html body .pa-input:disabled { opacity: 1; }
html body .btn-run.btn-outline, html body .pa-calc, html body .pb-btn.outline {
    background: var(--t-card); color: var(--t-ac); border: 1px solid var(--t-ac); box-shadow: none;
}
html body .btn-run.btn-outline:hover, html body .pa-calc:hover, html body .pb-btn.outline:hover { background: var(--t-ac-soft); }
html body .btn-run.btn-danger { background: var(--t-card); color: var(--t-bad); border: 1px solid #e5484d; box-shadow: none; }
html body .btn-run.btn-danger:hover { background: var(--t-bad-soft); }
html body .pb-btn.danger { background: #dc2626; color: #ffffff; }
html body .filter-btn.reset, html body .modal-btn-cancel, html body .row-link-btn, html body .pc-btn, html body .expand-btn,
html body .product-pagination button, html body .img-row .img-btn, html body .img-add-btn {
    background: var(--t-card); color: var(--t-text2); border-color: var(--t-line2);
}
html body .filter-btn.reset:hover, html body .modal-btn-cancel:hover, html body .row-link-btn:hover, html body .pc-btn:hover,
html body .expand-btn:hover, html body .product-pagination button:hover, html body .img-row .img-btn:hover:not(:disabled),
html body .img-add-btn:hover { background: var(--t-ac-soft); border-color: var(--t-ac); color: var(--t-ac); }
html body .row-link-btn, html body .pc-btn, html body .expand-btn, html body .product-pagination button { border-radius: 6px; }
html body .product-pagination button.active { background: var(--t-ac); color: #ffffff; border-color: var(--t-ac); }
html body .row-link-btn.success { background: var(--t-ok-soft); border-color: var(--t-ok-line); color: var(--t-ok); }
html body .row-link-btn.error { background: var(--t-bad-soft); border-color: var(--t-bad-line); color: var(--t-bad); }
html body .pc-btn.btn-link { border-color: var(--t-ac); color: var(--t-ac); }
html body .pc-btn.btn-unlink { border-color: var(--t-bad-line); color: var(--t-bad); }
html body .pc-btn.btn-unlink:hover { background: var(--t-bad-soft); border-color: #e5484d; color: var(--t-bad); }
html body .img-row .img-btn.remove { color: var(--t-bad); border-color: var(--t-bad-line); }
html body .img-row .img-btn.remove:hover { background: #dc2626; border-color: #dc2626; color: #ffffff; }
html body .stock-btn { border-radius: 6px; background: var(--t-card); }
html body .stock-btn-soldout { border-color: #ea8a3e; color: var(--t-warn); }
html body .stock-btn-soldout:hover { background: var(--t-warn-soft); }
html body .stock-btn-resume { border-color: #4cb774; color: var(--t-ok); }
html body .stock-btn-resume:hover { background: var(--t-ok-soft); }

/* 입력칸: 흰 바탕 + 테두리, 초점은 포인트 색 고리 */
html body input[type="text"], html body input[type="number"], html body input[type="password"], html body input[type="date"],
html body input[type="search"], html body input[type="email"], html body input[type="tel"], html body input[type="url"],
html body input:not([type]), html body select, html body textarea {
    background-color: var(--t-card); color: var(--t-text); border-color: var(--t-line2); border-radius: 7px;
    color-scheme: light; --tw-ring-color: transparent;
}
html body input::placeholder, html body textarea::placeholder { color: #8b93a1 !important; opacity: 1; }
html body input:focus, html body select:focus, html body textarea:focus {
    outline: none; border-color: var(--t-ac) !important; box-shadow: 0 0 0 3px rgba(43,74,139,.15) !important;
}
html body input:disabled, html body select:disabled, html body textarea:disabled { background-color: var(--t-chip); color: var(--t-dim); }
html body input[type="checkbox"], html body input[type="radio"], html body .filter-mode input, html body .filter-plats input { accent-color: var(--t-ac); }
html body input[type="file"] { color: var(--t-text2); }
html body .tag-input-wrap { background: var(--t-card); border-color: var(--t-line2); border-radius: 7px; }
html body .tag-input-wrap .tag-text-input { background: transparent; color: var(--t-text); border: none; box-shadow: none !important; }
html body .tag-input-wrap .tag-badge { background: var(--t-ac-soft); color: var(--t-ac); border: 1px solid var(--t-ac-line); }
html body .cs-display { background: var(--t-card); border-color: var(--t-line2); border-radius: 7px; color: var(--t-text); }
html body .cs-dropdown { box-shadow: var(--t-shadow-lg); border-color: var(--t-line2); }
html body .cs-search { border-radius: 0; border-width: 0 0 1px; }
html body .cs-option:hover, html body .cs-option.selected { background: var(--t-ac-soft); color: var(--t-ac); }
html body .filter-plats label { background: var(--t-card); border-color: var(--t-line2); color: var(--t-text2); }
html body .filter-plats label:has(input:checked) { border-color: var(--t-ac); background: var(--t-ac-soft); color: var(--t-ac); }
html body .filter-title { color: var(--t-ac); }
html body .checkbox-group { border-color: var(--t-line2); border-radius: 7px; }

/* 통합업로드 */
html body .platform-toggle { background: var(--t-card); border-color: var(--t-line2); color: var(--t-text2); }
html body .platform-toggle:hover { border-color: var(--t-ac); }
html body .platform-toggle.active { border-color: var(--t-ac); background: var(--t-ac-soft); color: var(--t-ac); font-weight: 600; }
html body .platform-tab { background: var(--t-chip); color: var(--t-muted); }
html body .platform-tab:hover:not(.active) { background: var(--t-ac-soft); color: var(--t-ac); }
html body .platform-tab.active { background: var(--t-ac); color: #ffffff; }
html body .img-row { background: var(--t-sub); }
html body .img-row.is-thumb { border-color: var(--t-ac); background: var(--t-ac-soft); }
html body .img-row .img-label { background: var(--t-chip); color: var(--t-muted); }
html body .img-row.is-thumb .img-label { background: var(--t-ac); color: #ffffff; }
html body .result-row.success { background: var(--t-ok-soft); border-color: var(--t-ok-line); }
html body .result-row.error { background: var(--t-bad-soft); border-color: var(--t-bad-line); }
html body .result-row.pending { background: var(--t-sub); }
html body .chic-mode-btn { background: var(--t-card) !important; color: var(--t-muted) !important; }
html body .chic-mode-btn.active { background: var(--t-ac) !important; color: #ffffff !important; }
html body #uu-toast { background: #166534 !important; color: #ffffff !important; box-shadow: var(--t-shadow-lg); }

/* 모달: 흰색 + 큰 그림자, 뒤 배경은 옅은 남색 막 */
html body .hs-modal-backdrop, html body .modal-overlay { background: rgba(16,24,40,.45); }
html body .hs-modal, html body .modal-box { background: var(--t-card); border: 1px solid var(--t-line); box-shadow: var(--t-shadow-lg); border-radius: 14px; }
html body .hs-modal-header span, html body .modal-title { color: var(--t-text); }
html body .hs-modal-header button { color: var(--t-muted); }
html body .hs-modal-body { color: var(--t-text); }
html body .hs-modal-body h4 { color: var(--t-ac); border-bottom: 1px solid var(--t-line); }
html body .hs-modal-body code { background: var(--t-sub); border: 1px solid var(--t-line); color: #3a4a6b; }
html body .hs-modal-body li { color: var(--t-text2); }
html body .hs-modal-body .pf-name { color: var(--t-text); }
html body .modal-info { background: var(--t-sub); border: 1px solid var(--t-line); color: var(--t-text2); }
html body .modal-result-item:hover, html body .modal-result-item.selected { border-color: var(--t-ac); background: var(--t-ac-soft); }
html body .modal-result-item.already-linked:hover { background: var(--t-card); border-color: var(--t-line); }
html body .result-summary, html body .api-note { background: var(--t-ac-soft); border-color: var(--t-ac-line); color: var(--t-ac); }

/* 로그인 */
html body .login-brand-icon, html body .header-brand-icon { background: var(--t-ac); box-shadow: 0 2px 6px rgba(43,74,139,.3); }
html body .login-brand-icon .material-symbols-outlined, html body .header-brand-icon .material-symbols-outlined { color: #ffffff; }
html body .login-card { box-shadow: 0 8px 28px rgba(16,24,40,.08), 0 1px 3px rgba(16,24,40,.06); border-radius: 14px; }
html body .login-input { border-color: var(--t-line2); }
html body .login-error { background: var(--t-bad-soft); border-color: var(--t-bad-line); color: var(--t-bad); }

/* 설정 화면들(스케줄러 설정·로그, 사용자, 계정): 상태 배지·켜기/끄기 스위치 */
html body .ss-status, html body .sl-status, html body .us-status, html body .as-status, html body .pb-status { white-space: nowrap; }
html body .ss-status.success, html body .sl-status.success, html body .us-status.active, html body .as-status.saved { background: var(--t-ok-soft); color: var(--t-ok); }
html body .ss-status.error, html body .sl-status.error, html body .us-status.inactive { background: var(--t-bad-soft); color: var(--t-bad); }
html body .as-status.empty { background: var(--t-warn-soft); color: var(--t-warn); }
html body .toggle-slider { background: #cfd4dc; box-shadow: inset 0 1px 2px rgba(16,24,40,.12); }
html body .toggle-slider:before { background: #ffffff; box-shadow: 0 1px 3px rgba(16,24,40,.3); }
html body .toggle-switch input:checked + .toggle-slider { background: #16a34a; }
html body .as-save-btn, html body .ss-run-btn { border-radius: 7px; }
html body .as-save-btn:disabled { background: #e3e8f2; color: #5f6c88; }
/* ── 4) Tailwind 클래스(_components.html 매크로가 씀) ── */
html body .text-white { color: var(--t-text); }
html body .text-\[\#a89b7a\] { color: var(--t-muted); }
html body .text-primary { color: var(--t-ac); }
html body .hover\:text-primary:hover { color: var(--t-ac); }
html body .hover\:bg-primary\/10:hover { background-color: var(--t-ac-soft); }
html body .bg-charcoal { background-color: var(--t-card); box-shadow: var(--t-shadow); }
html body .border-card-border { border-color: var(--t-line); }
html body .bg-\[\#3d3520\] { background-color: var(--t-chip); }
html body .border-\[\#3d3520\], html body .border-\[\#3d3520\]\/50 { border-color: var(--t-line); }
html body .bg-primary\/20 { background-color: var(--t-ac-soft); }
html body .text-emerald-400 { color: var(--t-ok); }
html body .text-red-400 { color: var(--t-bad); }
html body .text-amber-400 { color: var(--t-warn); }
html body .text-blue-400 { color: var(--t-info); }
html body .text-violet-400 { color: #6d28d9; }
html body .text-sky-400 { color: #0369a1; }
html body .text-rose-400 { color: #be123c; }
html body .bg-emerald-500\/20 { background-color: var(--t-ok-soft); }
html body .bg-red-500\/20 { background-color: var(--t-bad-soft); }
html body .bg-amber-500\/20 { background-color: var(--t-warn-soft); }
html body .bg-blue-500\/20 { background-color: #e5efff; }
html body .bg-violet-500\/20 { background-color: #f1eafe; }
html body .bg-sky-500\/20 { background-color: #e2f3fc; }
html body .bg-rose-500\/20 { background-color: #fde8ee; }

/* ── 5) 인라인 style 로 박힌 색 (HTML 속성·JS innerHTML 조각). 속성 선택자 + !important 로 최소한만 ──
   · 브라우저는 JS(style.cssText / el.style.color=…)로 넣은 색을 "rgb(168, 155, 122)" 꼴로 다시 적으므로 두 꼴 다 잡음.
   · color:#fff 는 일부러 안 건드림(초록·빨강 등 진한 바탕 위의 흰 글자). */
/* 글자색: 옅은 금빛·회색 → 보조 글자 */
html body [style*="color:#a89b7a"], html body [style*="color: #a89b7a"], html body [style*="color: rgb(168, 155, 122)"],
html body [style*="color:#aaa"], html body [style*="color: #aaa"],
html body [style*="color:#888"], html body [style*="color: #888"],
html body [style*="color:#ccc"], html body [style*="color: #ccc"] { color: var(--t-muted) !important; }
html body [style*="color:#6b6350"], html body [style*="color: #6b6350"], html body [style*="color: rgb(107, 99, 80)"] { color: var(--t-dim) !important; }
/* 글자색: 밝은 본문색 → 진한 본문색 */
html body [style*="color:#e2e8f0"], html body [style*="color: #e2e8f0"], html body [style*="color: rgb(226, 232, 240)"],
html body [style*="color:#e0e0e0"], html body [style*="color: #e0e0e0"] { color: var(--t-text) !important; }
/* 글자색: 금색 → 포인트 / 상태색은 흰 바탕에서 읽히게 진하게 */
html body [style*="color:#eca413"], html body [style*="color: #eca413"] { color: var(--t-ac) !important; }
html body [style*="color:#ef4444"], html body [style*="color: #ef4444"], html body [style*="color: rgb(239, 68, 68)"],
html body [style*="color:#f87171"], html body [style*="color: #f87171"],
html body [style*="color:#ff9a94"], html body [style*="color: rgb(255, 154, 148)"] { color: var(--t-bad) !important; }
html body [style*="color:#22c55e"], html body [style*="color: #22c55e"], html body [style*="color: rgb(34, 197, 94)"],
html body [style*="color:#4ade80"], html body [style*="color: #4ade80"],
html body [style*="color:#7ee787"], html body [style*="color: rgb(126, 231, 135)"] { color: var(--t-ok) !important; }
/* 바탕: 어두운 상자 → 흰색 / 회색 칩 */
html body [style*="background:#2d281f"], html body [style*="background: #2d281f"],
html body [style*="background:#1a1a2e"], html body [style*="background: #1a1a2e"],
html body [style*="background:#1a160f"], html body [style*="background: #1a160f"] { background: var(--t-card) !important; }
html body [style*="background:#3d3520"], html body [style*="background: #3d3520"] { background: var(--t-chip) !important; }
html body [style*="background:#6b6350"], html body [style*="background: #6b6350"] { background: #dfe3ea !important; }
html body [style*="background:#059669"][style*="color:#fff"] { background: #047857 !important; }
/* 테두리 */
html body [style*="solid #3d3520"], html body [style*="solid #6b6350"], html body [style*="dashed #6b6350"],
html body [style*="solid rgba(255,255,255,0.1)"], html body [style*="solid rgba(255,255,255,0.06)"],
html body [style*="solid rgba(255, 255, 255, 0.1)"], html body [style*="solid rgba(255, 255, 255, 0.06)"] { border-color: var(--t-line2) !important; }
html body tr[style*="rgba(255,255,255,0.06)"] { border-color: #eef0f3 !important; }
html body [style*="solid #eca413"], html body [style*="solid rgb(236, 164, 19)"] { border-color: var(--t-ac) !important; }
/* 모달(인라인으로 만든 것): 뒤 막 + 흰 상자 그림자 */
html body #order-detail-modal, html body #detail-modal, html body #desc-modal { background: rgba(16,24,40,.45) !important; }
html body #order-detail-modal > div, html body #detail-modal > div, html body #desc-modal > div {
    box-shadow: var(--t-shadow-lg); border-color: var(--t-line) !important; border-radius: 14px !important;
}
/* 통합주문 플랫폼 배지: 구구스 금색 바탕엔 흰 글자가 안 읽혀서(2.1:1) 글자만 진하게. 나머지 4색은 흰 글자 그대로 */
html body .badge[style*="background:#eca413"] { color: #3a2900 !important; font-weight: 700; }
html body .badge[style*="color:#fff"] { font-weight: 600; }
/* 플랫폼 구분 점: 흰 바탕에서 또렷하게(금색만 살짝 진하게) */
html body .pf-dot[style*="#eca413"] { background: #e09a0b !important; }
/* 새 주문 알림 토스트(base.html 이 JS 로 만듦: 어두운 남색 바탕 + 금색 글자) → 흰 카드 */
html body > div[style*="rgb(26, 26, 46)"] {
    background: var(--t-card) !important; color: var(--t-text) !important; border: 1px solid var(--t-ac) !important;
    border-left: 4px solid var(--t-ac) !important; box-shadow: var(--t-shadow-lg) !important; font-weight: 600;
}

/* ── 6) 확장층(ino_ext) 패널 — core.js / feat_*.js 가 나중에 넣는 어두운 색을 흰 테마로 ── */
html body .inoext-panel {
    background: var(--t-card); border: 1px solid var(--t-line); border-left: 3px solid var(--t-line2);
    color: var(--t-text); color-scheme: light; font-family: var(--t-font); box-shadow: var(--t-shadow);
}
html body .inoext-panel.inoext-has { border-left-color: #16a34a; }
html body .inoext-panel.inoext-bad { border-left-color: #dc2626; }
html body .inoext-h[data-dir=se]::after { border-right-color: #aeb5c1; border-bottom-color: #aeb5c1; }
html body .inoext-title { color: var(--t-muted); }
html body .inoext-panel button { border: 1px solid var(--t-line2); background: var(--t-card); color: var(--t-text2); }
html body .inoext-panel button:hover { color: var(--t-ac); border-color: var(--t-ac); background: var(--t-ac-soft); }
html body .inoext-chip { background: var(--t-sub); border: 1px solid var(--t-line); color: var(--t-muted); }
html body .inoext-chip.zero { color: var(--t-dim); }
html body .inoext-chip.has { background: var(--t-ok-soft); border-color: var(--t-ok-line); color: #14532d; }
html body .inoext-chip.err { background: var(--t-bad-soft); border-color: var(--t-bad-line); color: #7f1d1d; }
html body .inoext-toast { border: 1px solid var(--t-ac-line); background: var(--t-ac-soft); color: var(--t-text); }
html body .inoext-toast b { color: var(--t-ac); }
html body #inoext-toast-float .inoext-toast { box-shadow: var(--t-shadow-lg); background: var(--t-card); border-left: 4px solid var(--t-ac); }
html body #inoext-inquiry .inq-total { color: var(--t-text); }
html body #inoext-inquiry .inq-total.inq-red { color: var(--t-bad); }
html body #inoext-inquiry .inq-total.inq-green { color: var(--t-ok); }
html body #inoext-inquiry .inq-failtxt { color: var(--t-bad); }
html body #inoext-inquiry .inq-time { color: var(--t-dim); }
html body #inoext-inquiry .inq-time.inq-old { color: var(--t-bad); }
html body #inoext-inquiry a.inq-link:hover .inoext-chip { border-color: var(--t-ac); color: var(--t-text); }
html body #inoext-inquiry .inoext-chip b { color: var(--t-dim); }
html body #inoext-inquiry .inoext-chip.has b { color: var(--t-ok); }
html body #inoext-inquiry .inoext-chip.err b { color: var(--t-bad); }
html body #inoext-inquiry .inq-sub { border-left-color: var(--t-line2); }
html body #inoext-inquiry .inq-part { color: var(--t-dim); }
html body #inoext-inquiry .inoext-chip.has .inq-sub { border-left-color: var(--t-ok-line); }
html body #inoext-inquiry .inoext-chip.has .inq-part { color: #3f7a55; }
html body #inoext-inquiry .inoext-chip.err .inq-sub { border-left-color: var(--t-bad-line); }
html body #inoext-inquiry .inoext-chip.err .inq-part { color: #9a4a44; }
html body #inoext-inquiry .inoext-chip .inq-part.inq-part-new { color: var(--t-ok); }
html body #inoext-inquiry .inoext-chip .inq-part.inq-part-bad { color: var(--t-bad); }
html body #inoext-inquiry .inq-notes { color: var(--t-bad); }
html body #inoext-inquiry .inq-notes .inq-dim { color: var(--t-muted); }
html body #inoext-inquiry .inq-memo { color: #c81e1e; }
html body #inoext-inquiry .inq-spin { border-color: rgba(43,74,139,.25); border-top-color: var(--t-ac); }
html body .inoext-xl-b { background: var(--t-chip); color: var(--t-muted); }
html body .inoext-xl-b.has { background: var(--t-ok-soft); color: var(--t-ok); }
html body .inoext-xl-b.off { background: var(--t-warn-soft); color: var(--t-warn); }
html body .inoext-xl-b.err { background: var(--t-bad-soft); color: var(--t-bad); }
html body .inoext-xl-sum { color: var(--t-muted); font-family: var(--t-font); }
html body .inoext-xl-pop {
    background: var(--t-card); border: 1px solid var(--t-line); border-left: 3px solid #16a34a; color: var(--t-text);
    font-family: var(--t-font); box-shadow: var(--t-shadow-lg);
}
html body .inoext-xl-pop a { color: var(--t-ac); }
html body .inoext-xl-pop .dim { color: var(--t-muted); }

/* ── 7) 인쇄: 바탕·그림자 없이 흰 종이에 검은 글자, 떠 있는 패널·메뉴는 숨김 ── */
@media print {
    html body { background: #ffffff; }
    html body .header { box-shadow: none; }
    html body .header-nav, html body .platform-grid, html body .inoext-panel, html body #inoext-toast-float { display: none !important; }
    html body .api-card, html body .sync-panel, html body .ch-card, html body .section-card, html body .pb-card,
    html body .product-table-wrap, html body .filter-panel { box-shadow: none; }
    html body .product-table-wrap { overflow: visible; }
    html body .product-table th, html body .unified-table th, html body .badge, html body .status-badge,
    html body .link-badge, html body .stock-badge { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
    html body .inoext-bell, html body .inoext-brief, html body .inoext-drawer, html body .ino-fold-btn { display: none !important; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   8) 2차 정돈(2026-09-21) — "색이 아니라 너무 지저분하고 번잡스럽다" 대응. 정보 밀도·배치·위계만 손봄
   · 짝: static\layout.js(접기 단추·날짜 줄이기) + core.js 의 알림 센터(종·서랍). 외주사 DOM·JS 는 그대로, 여기서는 display/순서/크기만 바꿈
   · 머리 = 한 줄(로고 · 메뉴 · 종 · 사용자) + 얇은 현황 줄(주문 합계 한 줄 · 문의 칩). 요약표는 DOM 그대로 두고 모양만 한 줄로
     (외주사 JS 는 칸을 id 로 찾아 textContent 만 바꾸므로 영향 없음 — base.html 1628~1639줄)
   · 글자 3단(제목 20 / 본문 14 / 보조 12), 굵기 2단(600·800 → 보통/굵게). 그림자 없음, 구획은 여백과 옅은 선 하나
   · 안전장치: layout.js 가 안 돌면 접어 둔 필터·구역을 3초 뒤 저절로 펼침(ino-failsafe)
   ═══════════════════════════════════════════════════════════════════════════ */
:root { --t-layout: 2; --t-shadow: none; }

/* ── 8-1) 머리: 한 줄 + 얇은 현황 줄 ── */
html body .header {
    display: flex; flex-wrap: wrap; align-items: center; column-gap: 20px; row-gap: 0;
    padding: 0 32px; position: relative; background: var(--t-card); border-bottom: 1px solid var(--t-line); box-shadow: none;
}
html body .header::before {   /* 1줄과 2줄 사이 옅은 선(겸 줄바꿈) */
    content: ''; order: 3; flex: 0 0 calc(100% + 64px); margin: 0 -32px; height: 1px; background: var(--t-line);
}
html body .header-top { display: contents; }   /* 로고·요약표·단추판을 머리의 직계 칸처럼 배치(노드는 그대로) */
html body .header-brand { order: 1; flex: 0 0 auto; height: 56px; gap: 9px; }
html body .header-brand-icon { width: 28px; height: 28px; border-radius: 7px; box-shadow: none; }
html body .header-brand-icon .material-symbols-outlined { font-size: 17px; }
html body .header h1 { font-size: 17px; font-weight: 800; white-space: nowrap; }
html body .header-nav { order: 2; flex: 1 1 0; min-width: 0; margin-top: 0; min-height: 56px; align-items: stretch; flex-wrap: wrap; border-bottom: none; }
html body .nav-tab, html body .nav-dropdown-toggle {
    display: flex; align-items: center; min-height: 56px; padding: 0 14px; font-size: 14px; font-weight: 600; white-space: nowrap;
}
html body .nav-dropdown { display: flex; }
html body .header-nav-user { align-self: center; padding-bottom: 0; gap: 10px; white-space: nowrap; }
html body .header-nav-user > span { font-size: 12px !important; }

/* 현황 줄 왼쪽: 주문 합계 한 줄(외주사 요약표의 합계 줄만 보이게). [주문 현황 ▾] 를 누르면 표 전체가 아래로 펼쳐짐 */
html body .ino-hs-toggle { order: 4; }
html body .header-summary { order: 5; border: 0; border-radius: 0; background: transparent; box-shadow: none; overflow: visible; min-height: 38px; display: flex; align-items: center; }
html:not(.ino-hs-open) body .header-summary table { display: block; font-size: 12px; }
html:not(.ino-hs-open) body .header-summary thead, html:not(.ino-hs-open) body .header-summary tbody { display: none; }
html:not(.ino-hs-open) body .header-summary tfoot { display: block; }
html:not(.ino-hs-open) body .header-summary tfoot tr { display: flex; align-items: baseline; gap: 18px; }
html:not(.ino-hs-open) body .header-summary tfoot th { display: none; }
html:not(.ino-hs-open) body .header-summary tfoot td {
    display: inline-flex; align-items: baseline; gap: 6px; padding: 0; border: 0; background: transparent;
    font-size: 13px; font-weight: 800; color: var(--t-text); white-space: nowrap;
}
html:not(.ino-hs-open) body .header-summary tfoot td::before { font-size: 12px; font-weight: 500; color: var(--t-muted); }
html:not(.ino-hs-open) body .header-summary tfoot td:nth-child(2)::before { content: var(--ino-hs-l1, '발주 요청'); }
html:not(.ino-hs-open) body .header-summary tfoot td:nth-child(3)::before { content: var(--ino-hs-l2, '배송준비중'); }
html:not(.ino-hs-open) body .header-summary tfoot td:nth-child(4)::before { content: var(--ino-hs-l3, '배송중'); }
html:not(.ino-hs-open) body .header-summary tfoot td:nth-child(5)::before { content: var(--ino-hs-l4, '배송완료'); }
html:not(.ino-hs-open) body .header-summary tfoot td:nth-child(6)::before { content: var(--ino-hs-l5, ''); }
html:not(.ino-hs-open) body .header-summary tfoot td:nth-child(2) { color: var(--t-ac); }
/* 펼친 표: 머리 아래에 뜨는 작은 창. 세로선 없이 */
html.ino-hs-open body .header-summary {
    position: absolute; left: 32px; top: 100%; z-index: 950; margin-top: 6px; min-height: 0; display: block; overflow: hidden;
    background: var(--t-card); border: 1px solid var(--t-line); border-radius: 10px; box-shadow: var(--t-shadow-lg);
}
html.ino-hs-open body .header-summary table { font-size: 12px; }
html.ino-hs-open body .header-summary th, html.ino-hs-open body .header-summary td { padding: 7px 16px; border-right: 0; }
html.ino-hs-open body .header-summary thead th { background: var(--t-card); border-bottom: 1px solid var(--t-line); }
html.ino-hs-open body .header-summary tfoot th, html.ino-hs-open body .header-summary tfoot td { background: var(--t-sub); border-top: 1px solid var(--t-line); color: var(--t-text); font-weight: 800; }

/* 로컬 전용 동기화 단추판: 평소엔 안 보임 → [동기화 도구 ▾] */
html body .ino-pg-toggle { order: 6; }
html body .header .platform-grid {
    position: absolute; right: 32px; top: 100%; z-index: 950; margin-top: 6px; padding: 12px; visibility: hidden;
    background: var(--t-card); border: 1px solid var(--t-line); border-radius: 10px; box-shadow: var(--t-shadow-lg);
}
html.ino-pg-open body .header .platform-grid { visibility: visible; }
html:not(.ino-layout) body .header .platform-grid { animation: ino-failsafe-show .01s linear 3s forwards; }
@keyframes ino-failsafe-show { to { visibility: visible; } }

/* 현황 줄 오른쪽: 늘 보이는 문의 한 줄(core.js 의 brief) */
html body .header > .inoext-brief { order: 7; margin-left: auto; min-width: 0; flex: 0 1 auto; min-height: 38px; padding: 0; justify-content: flex-end; color: var(--t-muted); font-family: var(--t-font); }
html body .inoext-brief .inoext-chip { border-color: transparent; background: var(--t-chip); color: var(--t-muted); font-size: 12px; font-weight: 600; }
html body .inoext-brief .inoext-chip.zero { background: transparent; color: var(--t-dim); font-weight: 500; padding-left: 0; padding-right: 2px; }
html body .inoext-brief .inoext-chip.has { background: var(--t-ok-soft); color: #14532d; }
html body .inoext-brief .inoext-chip.err { background: var(--t-bad-soft); color: #7f1d1d; }
html body .inoext-brief:hover .inoext-chip { filter: brightness(.97); }

/* 접기 단추(layout.js 가 만드는 우리 단추) */
html body .ino-fold-btn {
    display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 10px; border: 1px solid var(--t-line2); border-radius: 7px;
    background: var(--t-card); color: var(--t-text2); font-family: var(--t-font); font-size: 12px; font-weight: 600; line-height: 1;
    cursor: pointer; white-space: nowrap; flex: 0 0 auto;
}
html body .ino-fold-btn:hover { border-color: var(--t-ac); color: var(--t-ac); background: var(--t-ac-soft); }
html body .ino-fold-btn:focus-visible, html body .inoext-bell:focus-visible, html body .inoext-brief:focus-visible,
html body .inoext-drawer button:focus-visible { outline: 2px solid var(--t-ac); outline-offset: 2px; }
html body .ino-fold-caret { font-size: 10px; transition: transform .15s; }
html body .ino-fold-btn[aria-expanded="true"] .ino-fold-caret { transform: rotate(180deg); }
html body .ino-fold-note:empty { display: none; }
html body .ino-hs-toggle, html body .ino-pg-toggle { border-color: transparent; background: transparent; color: var(--t-muted); padding: 0 6px 0 0; }
html body .ino-hs-toggle:hover, html body .ino-pg-toggle:hover { background: transparent; border-color: transparent; }
html body .ino-filter-toggle { height: 42px; padding: 0 14px; font-size: 13px; }
html body .ino-filter-toggle .ino-fold-note {
    min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--t-ac); color: #ffffff; font-size: 11px; line-height: 18px; text-align: center;
}
html body .ino-filter-toggle.ino-fold-active { border-color: var(--t-ac); color: var(--t-ac); }

/* 접힘: layout.js 가 data-ino-fold 를 붙임. 아직 안 붙은 동안(화면이 막 뜬 순간)은 자리만 비우고, 3초가 지나도 안 붙으면 저절로 보임 */
html body [data-ino-fold="closed"] { display: none !important; }
/* (3차 정돈: 필터는 기본 펼침이라 처음부터 보이게 둠 — 접어서 시작하는 건 대시보드 동기화 구역뿐) */
html body .sync-panel > .sync-grid:not([data-ino-fold]) {
    max-height: 0; overflow: hidden; visibility: hidden; padding-top: 0; padding-bottom: 0; margin-top: 0 !important; margin-bottom: 0; border-width: 0;
    animation: ino-failsafe .01s linear 3s forwards;
}
@keyframes ino-failsafe { to { max-height: 3000px; overflow: visible; visibility: visible; padding-top: 12px; padding-bottom: 12px; margin-bottom: 14px; border-width: 1px; } }

/* ── 8-2) 본문 위계: 제목 한 줄 → 필터 한 줄 → 표 ── */
html body .container { margin: 20px auto; }
html body .container > .mb-6, html body .container .mb-6:first-child { margin-bottom: 16px; }
html body h2.text-2xl { font-size: 20px; line-height: 28px; font-weight: 800; letter-spacing: -0.02em; display: inline; }
html body h2.text-2xl + p.text-sm { display: inline; margin: 0 0 0 10px; font-size: 12px; line-height: 28px; color: var(--t-muted); }
/* 표가 있는 화면은 폭을 넉넉히(칸이 세로로 접히던 원인) — 제목·탭·표의 왼쪽 선을 맞춤 */
html body .container:has(.product-table), html body .container:has(+ .sub-tab-bar), html body .unified-container { max-width: min(1600px, 100%); padding-left: 32px; padding-right: 32px; }
html body .unified-container { margin: 20px auto; }
html body .unified-container::before { content: '통합상품'; display: block; margin-bottom: 14px; font-size: 20px; line-height: 28px; font-weight: 800; letter-spacing: -0.02em; color: var(--t-text); }
html body .sub-tab-bar { background: transparent; margin-bottom: 16px; padding: 0 max(32px, calc((100% - 1600px) / 2 + 32px)); border-bottom: 1px solid var(--t-line); }
html body .sub-tab { padding: 8px 14px; font-size: 14px; font-weight: 600; }
html body .sub-tab:first-child { margin-left: -14px; }
html body .product-toolbar, html body .unified-toolbar { gap: 8px; margin-bottom: 12px; }
html body .product-search { padding: 0 14px !important; height: 42px; font-size: 14px !important; border-radius: 8px !important; }
html body .product-filter, html body .unified-toolbar select { height: 42px; border-radius: 8px; border-color: var(--t-line2); }
html body #unified-orders-filter ~ .container > .product-toolbar input[type="date"],
html body #unified-orders-filter ~ .container > .product-toolbar > button { height: 42px; border-radius: 8px !important; }
html body #unified-orders-filter ~ .container > .product-toolbar + .product-toolbar { margin-top: 0 !important; }
html body #unified-orders-filter ~ .container > .product-toolbar select { height: 34px; }
/* 주문관리: 검색 + (상태·기간) 을 한 줄로 */
html body #orders-sub-tabs ~ .container .product-toolbar { flex-direction: row !important; align-items: center !important; flex-wrap: wrap; }
html body #orders-sub-tabs ~ .container .product-toolbar > .product-search { flex: 1 1 260px; }
html body .date-filter-group { border: 0; background: transparent; padding: 0; }
html body .date-preset-btn { height: 34px; padding: 0 12px; border-radius: 7px; }
html body .date-preset-btn.active { box-shadow: none; }
/* 통합상품 필터(펼쳤을 때): 상자 안 상자 느낌 없이 */
html body .filter-panel { box-shadow: none; border-radius: 10px; padding: 10px 16px 12px; margin-bottom: 12px; }
html body .filter-mode { border-bottom: 0; margin-bottom: 0; padding-bottom: 4px; }
html body .filter-title { color: var(--t-muted); font-weight: 600; }
html body .filter-actions { margin-top: 6px; }
html body .product-total { font-size: 12px; font-weight: 500; margin-bottom: 8px; }
html body .unified-container > .product-total { float: left; margin: 0 16px 8px 0; line-height: 24px; }
html body .unified-container > .inoext-xl-sum { justify-content: flex-end; min-height: 24px; margin: 0 0 8px; font-size: 12px; }
html body .unified-container > .inoext-xl-sum .inoext-chip { border-color: transparent; background: transparent; padding: 0 4px; }
html body .unified-container > .inoext-xl-sum .inoext-chip.has { background: var(--t-ok-soft); padding: 1px 8px; border-radius: 999px; }
html body .unified-container > .inoext-xl-sum .inoext-chip.err { background: var(--t-bad-soft); padding: 1px 8px; border-radius: 999px; }
html body .unified-container > .product-table-wrap { clear: both; }

/* ── 8-3) 표: 세로선 없음 · 줄 높이 일정 · 숫자 오른쪽 · 배지 작고 연하게 · 줄 단추는 마우스를 올리면 진하게 ── */
html body .product-table-wrap { box-shadow: none; border-radius: 10px; }
html body .product-table, html body .unified-table { font-size: 14px; }
html body .product-table th, html body .unified-table th {
    background: var(--t-card); color: var(--t-muted); font-size: 12px; font-weight: 600; padding: 10px 12px;
    border-bottom: 1px solid var(--t-line); border-right: 0;
}
html body .product-table td, html body .unified-table td { padding: 8px 12px; height: 52px; border-bottom: 1px solid #f0f2f5; border-right: 0; line-height: 1.45; }
html body .unified-table .detail-row > td { height: auto; }
/* 칸이 12개가 넘는 표(통합주문·주문관리): 좁은 화면에서 칸을 세로로 찌그러뜨리는 대신 표 안에서 가로로 밀어 봄 */
html body .product-table:has(thead th:nth-child(12)) { min-width: 1440px; }
@media (max-width: 1500px) {
    html body .product-table, html body .unified-table { font-size: 13px; }
    html body .product-table td, html body .unified-table td, html body .product-table th, html body .unified-table th { padding-left: 10px; padding-right: 10px; }
}
html body .product-table tbody tr:hover, html body .unified-table tbody tr.data-row:hover { background: var(--t-sub); }
html body .product-table .thumb, html body .unified-table .thumb { width: 40px; height: 40px; border-radius: 6px; border: 0; display: block; }
html body .ino-date { white-space: nowrap; font-size: 12px; color: var(--t-muted); }
html body .link-badges, html body .stock-badges { flex-wrap: nowrap; justify-content: flex-start; gap: 3px; }
html body .status-badge, html body .link-badge, html body .stock-badge, html body .sync-badge { font-size: 11px; font-weight: 600; padding: 1px 7px; border-radius: 999px; }
html body .link-badge.unlinked, html body .stock-badge.stock-na { background: transparent; color: var(--t-dim); }
html body .link-dot, html body .stock-indicator { width: 5px; height: 5px; }
/* 통합주문 플랫폼 배지: 진한 색 덩어리 → 옅은 바탕 + 같은 계열 글자 */
html body .product-table .badge[style*="background:#eca413"] { background: #fdf3d7 !important; color: #7a5200 !important; }
html body .product-table .badge[style*="background:#7c3aed"] { background: #f1eafe !important; color: #5b21b6 !important; }
html body .product-table .badge[style*="background:#2563eb"] { background: #e5efff !important; color: #1e40af !important; }
html body .product-table .badge[style*="background:#059669"] { background: var(--t-ok-soft) !important; color: #065f46 !important; }
html body .product-table .badge[style*="background:#dc2626"] { background: var(--t-bad-soft) !important; color: #991b1b !important; }
html body .product-table .badge { font-weight: 600 !important; border-radius: 999px !important; }
/* 줄마다 있는 단추: 평소 연하게 → 그 줄에 마우스를 올리거나 키보드로 들어가면 진하게 */
html body .product-table td .row-link-btn, html body .unified-table .stock-btn, html body .unified-table .expand-btn {
    background: transparent; border-color: var(--t-line); color: var(--t-muted); box-shadow: none; font-weight: 500;
}
html body .unified-table .stock-btn + .stock-btn { margin-left: 4px; }
html body .unified-table .expand-btn { border-color: transparent; }
html body .product-table tr:hover td .row-link-btn, html body .product-table tr:focus-within td .row-link-btn { border-color: var(--t-line2); color: var(--t-text); background: var(--t-card); }
html body .unified-table tr:hover .stock-btn-soldout, html body .unified-table tr:focus-within .stock-btn-soldout { border-color: #ea8a3e; color: var(--t-warn); background: var(--t-card); }
html body .unified-table tr:hover .stock-btn-resume, html body .unified-table tr:focus-within .stock-btn-resume { border-color: #4cb774; color: var(--t-ok); background: var(--t-card); }
html body .unified-table tr:hover .expand-btn, html body .unified-table tr:focus-within .expand-btn { border-color: var(--t-line2); color: var(--t-text); }
html body .product-table td .row-link-btn:hover { border-color: var(--t-ac); color: var(--t-ac); background: var(--t-ac-soft); }
html body .product-table td .row-link-btn.success { background: var(--t-ok-soft); border-color: var(--t-ok-line); color: var(--t-ok); }
html body .product-table td .row-link-btn.error { background: var(--t-bad-soft); border-color: var(--t-bad-line); color: var(--t-bad); }
html body .product-table td .row-link-btn[style*="background:#059669"] { background: var(--t-ok-soft) !important; color: #065f46 !important; border-color: transparent; font-weight: 600; }
html body .product-table tr:hover td .row-link-btn[style*="background:#059669"] { border-color: var(--t-ok-line); }
html body .product-pagination { margin-top: 12px; gap: 2px; }
html body .product-pagination button { border-color: transparent; background: transparent; min-width: 32px; height: 32px; padding: 0 8px; font-size: 13px; }
html body .product-pagination button:disabled { background: transparent; border-color: transparent; }

/* ── 8-4) 대시보드: 플랫폼 카드 5개는 그대로, 운영자용 3구역은 제목 줄만(실패가 있으면 layout.js 가 펼치고 빨강) ── */
html body .ch-card { box-shadow: none; padding: 16px 18px; }
html body .ch-card-top { height: 2px; }
html body .ch-stat-label { font-size: 12px; text-transform: none; }
html body .ch-stat-label .material-symbols-outlined { display: none; }
html body .ch-stat-total { font-size: 20px; font-weight: 800; }
html body .ch-stat-today { font-size: 12px; }
html body .sync-panel { padding: 0; margin-bottom: 8px; border-radius: 10px; box-shadow: none; }
html body .sync-panel-title { position: relative; margin: 0; padding: 12px 16px; font-size: 14px; font-weight: 600; }
html body .sync-panel-title .material-symbols-outlined { display: none; }
html body .sync-panel > .sync-grid { padding: 0 16px 16px; }
html body .ino-sync-toggle { margin-left: auto; border-color: transparent; background: transparent; color: var(--t-muted); font-weight: 500; }
html body .ino-sync-toggle:hover { background: transparent; border-color: transparent; }
html body .ino-sync-toggle::after { content: ''; position: absolute; inset: 0; border-radius: 10px; }   /* 제목 줄 어디를 눌러도 펼쳐짐 */
html body .sync-panel[data-ino-state="bad"] { border-color: var(--t-bad-line); }
html body .sync-panel[data-ino-state="bad"] .ino-fold-note { color: var(--t-bad); font-weight: 700; }
html body .sync-card { border: 0; background: var(--t-sub); height: auto; min-height: 132px; }
html body .sync-latest-error { white-space: normal; overflow: visible; }

/* ── 8-5) 카드류(업로드·가격·설정): 그림자 없이, 구획 제목은 본문 크기 굵게 ── */
html body .section-title, html body .api-card-header h3, html body .ss-group-title { font-size: 14px; font-weight: 700; }
html body .section-card { border-radius: 10px; }

/* ── 8-6) 알림 센터(core.js): 종 · 서랍 — 흰 테마 ── */
html body .inoext-bell { border-color: var(--t-line2); background: var(--t-card); color: var(--t-text2); }
html body .inoext-bell:hover { border-color: var(--t-ac); color: var(--t-ac); background: var(--t-ac-soft); }
html body .inoext-bell.inoext-bell-has { color: var(--t-ok); border-color: var(--t-ok-line); }
html body .inoext-bell.inoext-bell-bad { color: var(--t-bad); border-color: var(--t-bad-line); }
html body .inoext-bell-count { background: #c62828; color: #ffffff; box-shadow: 0 0 0 2px var(--t-card); }
html body .inoext-drawer { background: var(--t-card); color: var(--t-text); border-left: 1px solid var(--t-line); box-shadow: var(--t-shadow-lg); font-family: var(--t-font); color-scheme: light; }
html body .inoext-drawer-head { border-bottom-color: var(--t-line); }
html body .inoext-drawer-title { font-size: 16px; color: var(--t-text); }
html body .inoext-drawer-close { border-color: transparent; color: var(--t-muted); background: transparent; }
html body .inoext-drawer-close:hover { background: var(--t-chip); color: var(--t-text); }
html body .inoext-panel.inoext-in-drawer { background: transparent; border: 0; border-bottom: 1px solid var(--t-line); box-shadow: none; }
html body .inoext-in-drawer .inoext-title { color: var(--t-text); }
html body .inoext-in-drawer.inoext-has .inoext-title::before { background: #16a34a; }
html body .inoext-in-drawer.inoext-bad .inoext-title::before { background: #dc2626; }
html body #inoext-inquiry.inoext-in-drawer .inoext-chip { background: transparent; border-color: var(--t-line); }
html body #inoext-inquiry.inoext-in-drawer .inoext-chip.has { background: var(--t-ok-soft); border-color: transparent; }
html body #inoext-inquiry.inoext-in-drawer .inoext-chip.err { background: var(--t-bad-soft); border-color: transparent; }
html body #inoext-inquiry.inoext-in-drawer .inq-memo { color: var(--t-bad); border-color: var(--t-bad-line); background: #fffafa; }
html body #inoext-toast-float { border: 0; background: transparent; box-shadow: none; padding: 0; }

/* ── 8-7) 좁은 화면 ── */
@media (max-width: 1100px) {
    html body .header { padding: 0 16px; column-gap: 12px; }
    html body .header::before { flex-basis: calc(100% + 32px); margin: 0 -16px; }
    html body .nav-tab, html body .nav-dropdown-toggle { min-height: 44px; padding: 0 10px; }
    html body .header-summary tfoot tr { gap: 12px; }
    html body .header > .inoext-brief { flex-basis: 100%; justify-content: flex-start; margin-left: 0; }
    html body .container:has(.product-table), html body .container:has(+ .sub-tab-bar), html body .unified-container { padding-left: 16px; padding-right: 16px; }
    html body .sub-tab-bar { padding: 0 16px; }
    html.ino-hs-open body .header-summary { left: 16px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   9) 3차 정돈(2026-09-21 저녁) — 사장님 "오히려 가독성 떨어진 부분도 많다. 뭐가 됐건 깔끔하게"
      원칙: 깔끔함 = 정보를 숨기는 게 아니라 정렬·간격·위계가 가지런한 것. 2차에서 너무 흐리게·작게·숨긴 것을 되돌림
      · 글자: 본문 #111827 / 보조 #4b5563 / 표 14px(좁은 화면에서도 줄이지 않음) / 보조 글자 12.5px 이상
      · 표: 머리줄 굵게+옅은 바탕, 줄 높이 44px, 줄 사이 선 있음, 짝수 줄 아주 옅은 바탕
      · 줄 단추(품절처리·판매재개 등) 평소에도 또렷하게 / 상태 배지·플랫폼 배지는 한눈에 구분되는 채도
      · 머리 = 한 줄(요약표 띠 없앰 — 숫자는 대시보드 '주문 현황'). 메뉴 합치기·탭·대시보드·반품 화면(layout.js / feat_dashboard.js / page_returns.js)
   ═══════════════════════════════════════════════════════════════════════════ */
:root { --t-text: #111827; --t-text2: #1f2937; --t-muted: #4b5563; --t-dim: #6b7280; --t-line: #e5e7eb; --t-line2: #d1d5db; }
html body { font-size: 14px; color: var(--t-text); }

/* ── 9-1) 머리: 한 줄. 요약표 DOM 은 그대로(외주사 JS 가 계속 채움, 새 주문 알림도 그대로) — 화면에서만 숨김 ── */
html body .header::before { display: none; }
html body .header-summary, html.ino-hs-open body .header-summary { display: none !important; }
html body .ino-hs-toggle { display: none !important; }
html body .nav-tab, html body .nav-dropdown-toggle { color: var(--t-text2); font-weight: 600; font-size: 14.5px; }
html body .nav-tab:hover, html body .nav-dropdown-toggle:hover { color: var(--t-ac); }
html body .nav-tab.active, html body .nav-tab[data-ino-active], html body .nav-dropdown-toggle[data-ino-active] { color: var(--t-ac); border-bottom-color: var(--t-ac); font-weight: 800; }
html body .nav-tab[data-ino-merged] { display: none !important; }
html body .nav-dropdown-menu a { color: var(--t-text2); font-size: 14px; }
html body .header-nav-user { gap: 10px; }
html body .header-nav-user > span { color: var(--t-text2) !important; font-size: 13px !important; }
html body .header-nav-user .ino-pg-toggle { color: var(--t-text2); }
/* 문의 한 줄: 종 바로 옆에 "문의 19" 하나만(오류 칩은 같이). 옮기기 전(머리 끝에 있을 때)은 안 보이게 */
html.ino-layout body .header > .inoext-brief { display: none !important; }
html body .inoext-brief.ino-brief-short { min-height: 0; padding: 0; margin: 0; gap: 4px; flex-wrap: nowrap; }
html body .inoext-brief.ino-brief-short .inoext-brief-slot:not([data-panel="inquiry"]) { display: none; }
html body .inoext-brief.ino-brief-short .inoext-brief-slot[data-panel="inquiry"] > .inoext-chip:not(:first-child):not(.err) { display: none; }
html body .inoext-brief.ino-brief-short .inoext-chip { font-size: 13px; font-weight: 700; padding: 3px 10px; white-space: nowrap; }
html body .inoext-brief.ino-brief-short .inoext-chip.zero { background: var(--t-chip); color: var(--t-muted); padding: 3px 10px; }
html.ino-dash body .inoext-brief { display: none !important; }      /* 대시보드에 문의 구역이 있으니 중복 안 함 */

/* ── 9-2) 제목·탭 ── */
html body h2.text-2xl { font-size: 22px; color: var(--t-text); }
html body h2.text-2xl + p.text-sm { font-size: 13px; color: var(--t-muted); }
html body .mb-6 > p[data-ino-hide] { display: none !important; }
html body .unified-container::before { content: '상품'; font-size: 22px; }
html body .ino-viewtabs-wrap { margin: 2px 0 14px; }
html body .ino-viewtabs { display: flex; gap: 2px; border-bottom: 1px solid var(--t-line2); }
html body .ino-viewtabs a { display: inline-flex; align-items: baseline; gap: 5px; padding: 9px 16px 10px; margin-bottom: -1px; font-size: 15px; font-weight: 700;
    color: var(--t-muted); text-decoration: none; border-bottom: 3px solid transparent; }
html body .ino-viewtabs a small { font-size: 12.5px; font-weight: 600; color: var(--t-muted); }
html body .ino-viewtabs a:hover { color: var(--t-ac); }
html body .ino-viewtabs a[aria-current="page"] { color: var(--t-ac); border-bottom-color: var(--t-ac); }
html body .ino-viewtabs a[aria-current="page"] small { color: var(--t-ac); }
html body .ino-viewtabs-desc { margin: 8px 0 0; font-size: 13px; color: var(--t-muted); }
html body .ino-back-link { display: inline-block; margin-left: 12px; font-size: 13px; font-weight: 700; color: var(--t-ac); }
/* 사이트 고르기 탭(외주사 .sub-tab): 우리 보기 탭보다 한 단계 작게, 그래도 또렷하게 */
html body .sub-tab { color: var(--t-text2); font-weight: 600; }
html body .sub-tab.active { color: var(--t-ac); font-weight: 800; }

/* ── 9-3) 표 ── */
html body .product-table, html body .unified-table { font-size: 14px; }
@media (max-width: 1500px) { html body .product-table, html body .unified-table { font-size: 14px; } }
html body .product-table th, html body .unified-table th {
    background: #f3f4f6; color: #374151; font-size: 13px; font-weight: 700; padding: 10px 12px; border-bottom: 1px solid var(--t-line2);
}
html body .product-table td, html body .unified-table td { height: 44px; padding: 7px 12px; border-bottom: 1px solid #e5e7eb; color: var(--t-text); }
html body .product-table tbody tr:nth-child(even) > td { background: #fafbfc; }
html body .unified-table tbody tr.data-row:nth-child(4n+3) > td { background: #fafbfc; }
html body .product-table tbody tr:hover > td, html body .unified-table tbody tr.data-row:hover > td { background: #eef3fb; }
html body .product-table tbody tr:last-child td, html body .unified-table tbody tr:last-child td { border-bottom: none; }
html body .ino-date { font-size: 13px; color: var(--t-muted); }
html body .product-total { font-size: 13px; font-weight: 600; color: var(--t-muted); }
/* 줄 단추: 평소에도 테두리 있는 또렷한 작은 단추 */
html body .product-table td .row-link-btn, html body .unified-table .expand-btn,
html body .product-table tr:hover td .row-link-btn, html body .product-table tr:focus-within td .row-link-btn,
html body .unified-table tr:hover .expand-btn, html body .unified-table tr:focus-within .expand-btn {
    background: #ffffff; border: 1px solid var(--t-line2); color: #1f2937; font-weight: 600; font-size: 12.5px;
}
html body .unified-table .stock-btn-soldout, html body .unified-table tr:hover .stock-btn-soldout, html body .unified-table tr:focus-within .stock-btn-soldout {
    background: #ffffff; border: 1px solid #ea8a3e; color: #9a3412; font-weight: 600; font-size: 12.5px;
}
html body .unified-table .stock-btn-resume, html body .unified-table tr:hover .stock-btn-resume, html body .unified-table tr:focus-within .stock-btn-resume {
    background: #ffffff; border: 1px solid #4cb774; color: #166534; font-weight: 600; font-size: 12.5px;
}
html body .product-table td .row-link-btn:hover, html body .unified-table .expand-btn:hover { background: var(--t-ac-soft); border-color: var(--t-ac); color: var(--t-ac); }
html body .unified-table .stock-btn-soldout:hover { background: var(--t-warn-soft); }
html body .unified-table .stock-btn-resume:hover { background: var(--t-ok-soft); }
html body .product-table td .row-link-btn[style*="background:#059669"] { background: #dcfce7 !important; color: #14532d !important; border: 1px solid #86efac; }
/* 상태 배지: 한눈에 구분되는 채도(바탕 + 진한 글자) */
html body .status-badge, html body .link-badge, html body .stock-badge, html body .sync-badge { font-size: 12px; font-weight: 700; padding: 2px 8px; border-radius: 999px; }
html body .status-badge { background: #e5e7eb; color: #374151; }
html body .status-badge.active, html body .link-badge.linked, html body .stock-badge.stock-on, html body .sync-badge.success { background: #dcfce7; color: #166534; }
html body .status-badge.inactive, html body .stock-badge.stock-off, html body .sync-badge.error { background: #fee2e2; color: #991b1b; }
html body .status-badge.pending { background: #ffedd5; color: #9a3412; }
html body .link-badge.unlinked, html body .stock-badge.stock-na { background: #f3f4f6; color: #4b5563; }
html body .link-dot, html body .stock-indicator { width: 7px; height: 7px; }
html body .link-dot.off, html body .stock-indicator.na { background: #9ca3af; }
/* 통합주문 플랫폼 배지: 옅은 색 → 또렷한 중간 채도 */
html body .product-table .badge[style*="background:#eca413"] { background: #fde68a !important; color: #78350f !important; }
html body .product-table .badge[style*="background:#7c3aed"] { background: #ddd6fe !important; color: #4c1d95 !important; }
html body .product-table .badge[style*="background:#2563eb"] { background: #bfdbfe !important; color: #1e3a8a !important; }
html body .product-table .badge[style*="background:#059669"] { background: #a7f3d0 !important; color: #064e3b !important; }
html body .product-table .badge[style*="background:#dc2626"] { background: #fecaca !important; color: #7f1d1d !important; }
html body .product-table .badge { font-size: 12px !important; font-weight: 700 !important; }
/* 필터(기본 펼침): 라벨 · 고르기 · 체크가 한 줄에 가지런히 */
html body .filter-panel { background: #ffffff; border: 1px solid var(--t-line); border-radius: 12px; padding: 10px 16px; }
html body .filter-mode { display: flex; gap: 16px; padding-bottom: 6px; border-bottom: 1px solid #f1f2f4; }
html body .filter-mode label { font-size: 14px; font-weight: 600; color: var(--t-text); }
html body .filter-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 7px 0; border-bottom: 1px solid #f1f2f4; }
html body .filter-title { min-width: 84px; font-size: 13.5px; font-weight: 700; color: var(--t-text); }
html body .filter-plats label { font-size: 13px; color: var(--t-text2); }
html body .filter-row.disabled .filter-title, html body .filter-row.disabled select, html body .filter-row.disabled label { color: var(--t-dim); }
html body #unified-orders-filter ~ .container > .product-toolbar + .product-toolbar { padding: 8px 12px; background: #ffffff; border: 1px solid var(--t-line); border-radius: 10px; }
html body #unified-orders-filter ~ .container > .product-toolbar select { height: 36px; font-size: 13.5px; }
html body #unified-orders-filter ~ .container #unified-tbody > tr > td:nth-child(12) { white-space: nowrap; }   /* 주문일(2026. 9. 21.)이 세 줄로 꺾이지 않게 */

/* ── 9-4) 대시보드(feat_dashboard.js) — 우리 대시보드가 뜨면 외주사 구역은 "연동 상태" 보기(/?view=status)로 ── */
html.ino-dash-ready body .container:has(> #channel-summary) { display: none !important; }
html body .idb { max-width: min(1600px, 100%); margin: 16px auto 24px; padding: 0 32px; box-sizing: border-box; font-family: var(--t-font); color: var(--t-text); }
html body .idb-head { display: flex; align-items: baseline; gap: 12px; margin-bottom: 12px; }
html body .idb-head h2 { font-size: 22px; font-weight: 800; letter-spacing: -0.02em; }
html body .idb-sub { font-size: 13px; color: var(--t-muted); }
html body .idb-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 14px; align-items: start; }
html body .idb-span7 { grid-column: span 7; } html body .idb-span5 { grid-column: span 5; }
html body .idb-stack { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
html body .idb-card { background: #ffffff; border: 1px solid var(--t-line); border-radius: 12px; padding: 14px 18px 16px; min-width: 0; box-sizing: border-box; }
html body .idb-card[hidden] { display: none; }
html body .idb-card[data-state="bad"] { border-color: var(--t-bad-line); }
html body .idb-card > h3 { display: flex; align-items: baseline; gap: 10px; margin: 0 0 10px; font-size: 16px; font-weight: 800; color: var(--t-text); }
html body .idb-meta { margin-left: auto; font-size: 12.5px; font-weight: 500; color: var(--t-muted); text-align: right; }
html body .idb-metalink, html body .idb-more, html body .idb-warnlink { color: var(--t-ac); font-weight: 700; text-decoration: none; }
html body .idb-metalink:hover, html body .idb-more:hover, html body .idb-warnlink:hover { text-decoration: underline; }
html body .idb-note { margin: 8px 0 0; font-size: 13px; color: var(--t-muted); line-height: 1.5; }
html body .idb-note.bad { color: var(--t-bad); font-weight: 600; }
html body .idb-note.info { background: #f3f4f6; color: #374151; padding: 10px 12px; border-radius: 8px; }
html body .idb-muted { font-size: 12.5px; color: var(--t-muted); }
/* 주문 현황 */
html body .idb-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
html body .idb-tile { display: flex; flex-direction: column; gap: 2px; padding: 10px 14px; border: 1px solid var(--t-line); border-radius: 10px; background: #ffffff; color: inherit; text-decoration: none; }
html body .idb-tile:hover, html body .idb-tile:focus-visible { border-color: var(--t-ac); background: var(--t-ac-soft); outline: none; }
html body .idb-tile .l { font-size: 13.5px; font-weight: 700; color: #374151; }
html body .idb-tile .n { font-size: 30px; font-weight: 800; line-height: 1.15; color: var(--t-text); font-variant-numeric: tabular-nums; }
html body .idb-tile .n.zero { color: var(--t-dim); }
html body .idb-tile .n.has { color: var(--t-ok); }
html body .idb-tile .go { font-size: 12.5px; color: var(--t-muted); }
html body .idb-pt { width: 100%; margin-top: 12px; border-collapse: collapse; font-size: 14px; font-variant-numeric: tabular-nums; }
html body .idb-pt th, html body .idb-pt td { padding: 5px 12px; text-align: right; border-bottom: 1px solid #eef0f3; }
html body .idb-pt tr > :first-child { text-align: left; }
html body .idb-pt thead th { background: #f3f4f6; font-size: 12.5px; font-weight: 700; color: #374151; }
html body .idb-pt tbody th { font-weight: 700; color: var(--t-text); }
html body .idb-pt tbody tr:last-child > * { border-bottom: 0; }
html body .idb-pt td.z { color: var(--t-dim); }
html body .idb-pt tfoot th, html body .idb-pt tfoot td { border-top: 2px solid #d1d5db; border-bottom: 0; font-weight: 800; color: var(--t-text); background: #f9fafb; }
html body .idb-pt tfoot td.z { color: var(--t-dim); font-weight: 700; }
html body .idb-dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 7px; vertical-align: 0; }
html body .idb-dot-gugus { background: #d97706; } html body .idb-dot-trenbe { background: #7c3aed; } html body .idb-dot-feelway { background: #2563eb; }
html body .idb-dot-chic { background: #059669; } html body .idb-dot-bunjang { background: #dc2626; }
html body .idb-dot-reebonz { background: #111827; } html body .idb-dot-mustit { background: #db2777; }
html body .idb-pt td.bad { color: #b91c1c; font-weight: 700; }
/* 문의 */
html body .idb-inq-total { display: flex; align-items: baseline; gap: 10px; margin-bottom: 10px; }
html body .idb-inq-total .l { font-size: 13.5px; font-weight: 700; color: #374151; }
html body .idb-inq-total b { font-size: 30px; font-weight: 800; line-height: 1.1; color: var(--t-text); }
html body .idb-inq-total b.has { color: var(--t-ok); }
html body .idb-inq-sub { font-size: 12.5px; color: var(--t-muted); }
html body .idb-inq-sub.bad { color: var(--t-bad); font-weight: 700; }
html body .idb-chips { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
html body .idb-chip { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; padding: 6px 10px; border: 1px solid var(--t-line); border-radius: 8px;
    color: var(--t-text); text-decoration: none; font-size: 14px; font-weight: 600; background: #ffffff; }
html body .idb-chip:hover { border-color: var(--t-ac); }
html body .idb-chip b { margin-left: auto; font-size: 16px; font-weight: 800; font-variant-numeric: tabular-nums; }
html body .idb-chip .sub { flex-basis: 100%; font-size: 12.5px; font-weight: 500; color: #374151; }
html body .idb-chip.zero b { color: var(--t-dim); }
html body .idb-chip.has { background: #ecfdf3; border-color: #a7e3bd; } html body .idb-chip.has b { color: #15803d; }
html body .idb-chip.err { background: #fef2f2; border-color: #f3b4b4; } html body .idb-chip.err b { color: #b91c1c; }
/* 반품 */
html body .idb-rcounts { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
html body .idb-rc { display: flex; flex-direction: column; padding: 8px 12px; border: 1px solid var(--t-line); border-radius: 10px; color: inherit; text-decoration: none; }
html body .idb-rc:hover { border-color: var(--t-ac); background: var(--t-ac-soft); }
html body .idb-rc .l { font-size: 13px; font-weight: 700; color: #374151; }
html body .idb-rc .n { font-size: 24px; font-weight: 800; line-height: 1.2; color: var(--t-text); font-variant-numeric: tabular-nums; }
html body .idb-rc .n.warn { color: var(--t-warn); } html body .idb-rc .n.zero { color: var(--t-dim); }
html body .idb-rhead { margin: 12px 0 2px; font-size: 12.5px; font-weight: 700; color: var(--t-muted); }
html body .idb-rlist { list-style: none; margin: 0; padding: 0; }
html body .idb-rlist li { display: grid; grid-template-columns: 76px minmax(0, 1fr) auto 52px; gap: 10px; align-items: center; padding: 6px 0; border-top: 1px solid #eef0f3; font-size: 14px; }
html body .idb-rlist li.idb-empty { display: block; color: var(--t-muted); font-size: 13.5px; padding: 10px 0; }
html body .idb-rlist .nm { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html body .idb-rlist .st { font-size: 13px; font-weight: 600; color: #374151; }
html body .idb-rlist .el { text-align: right; font-weight: 800; font-variant-numeric: tabular-nums; }
html body .idb-rlist .el.old { color: var(--t-bad); }
html body .idb-rfoot { display: flex; align-items: center; gap: 14px; margin-top: 10px; font-size: 13.5px; }
html body .idb-rfoot .idb-more { margin-left: auto; }
html body .idb-pf { display: inline-block; font-size: 12px; font-weight: 700; padding: 2px 8px; border-radius: 999px; text-align: center; white-space: nowrap; }
html body .idb-pf-gugus { background: #fde68a; color: #78350f; } html body .idb-pf-trenbe { background: #ddd6fe; color: #4c1d95; }
html body .idb-pf-feelway { background: #bfdbfe; color: #1e3a8a; } html body .idb-pf-chic { background: #a7f3d0; color: #064e3b; }
html body .idb-pf-bunjang { background: #fecaca; color: #7f1d1d; }
/* 재고·공지·리본즈머스트잇 */
html body .idb-kv { display: flex; gap: 18px; margin-bottom: 6px; }
html body .idb-kv .kv { display: inline-flex; align-items: baseline; gap: 6px; }
html body .idb-kv .l { font-size: 13px; font-weight: 700; color: #374151; }
html body .idb-kv b { font-size: 22px; font-weight: 800; color: var(--t-text); }
html body .idb-kv b.bad { color: var(--t-bad); } html body .idb-kv b.warn { color: var(--t-warn); } html body .idb-kv b.zero { color: var(--t-dim); }
html body .idb-line { margin: 5px 0 0; font-size: 13.5px; line-height: 1.5; color: var(--t-text); }
html body .idb-line a { color: var(--t-text); text-decoration: underline; text-decoration-color: var(--t-line2); }
html body .idb-line a:hover { color: var(--t-ac); }
html body .idb-grade { display: inline-block; font-size: 12px; font-weight: 700; padding: 1px 7px; border-radius: 999px; }
html body .idb-grade.bad { background: #fee2e2; color: #991b1b; } html body .idb-grade.warn { background: #ffedd5; color: #9a3412; }
html body .idb-kvi { font-size: 13.5px; color: var(--t-muted); } html body .idb-kvi.has { color: var(--t-ok); font-weight: 700; }
html body .idb-bad { color: var(--t-bad); font-size: 13px; }
html body .idb-linkbtn { display: inline-block; margin-top: 8px; padding: 0; border: 0; background: none; cursor: pointer; font: inherit; font-size: 13px; }
html body .idb-foot { margin-top: 16px; text-align: right; }
html body .idb-status-link { font-size: 13px; font-weight: 600; color: var(--t-muted); text-decoration: none; }
html body .idb-status-link:hover { color: var(--t-ac); text-decoration: underline; }
/* 새로고침 ↻ / 지금 확인 버튼(카드 제목 오른쪽) */
html body .idb-rf { flex: none; margin-left: 6px; padding: 3px 9px; border: 1px solid var(--t-line); border-radius: 7px; background: #ffffff; color: #374151;
    font: inherit; font-size: 12.5px; font-weight: 700; line-height: 1.3; cursor: pointer; }
html body .idb-meta + .idb-rf { margin-left: 8px; }
html body .idb-rf:hover { border-color: var(--t-ac); color: var(--t-ac); }
html body .idb-rf:disabled { opacity: .55; cursor: wait; }
html body .idb-rf.primary { background: var(--t-ac); border-color: var(--t-ac); color: #ffffff; }
html body .idb-rf.primary:hover { filter: brightness(1.08); color: #ffffff; }
html body .idb-flash { margin: 8px 0 0; font-size: 13px; font-weight: 600; color: var(--t-ok); }
html body .idb-flash.bad { color: var(--t-bad); }
html body .idb-span12 { grid-column: 1 / -1; }
html body .idb-memo { margin: 10px 0 0; font-size: 12px; line-height: 1.5; color: #b91c1c; }
/* 로그인 상태(직원 요청: 품절처리·판매재개 전에 로그인 살아 있는지) */
html body .idb-login { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; }
html body .idb-ls { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border: 1px solid var(--t-line); border-radius: 10px; background: #ffffff;
    color: var(--t-text); text-decoration: none; min-width: 0; }
html body .idb-ls .lamp { flex: none; width: 12px; height: 12px; border-radius: 50%; background: #d1d5db; }
html body .idb-ls .nm { font-size: 14px; font-weight: 800; white-space: nowrap; }
html body .idb-ls .st { margin-left: auto; font-size: 12.5px; font-weight: 700; color: var(--t-muted); white-space: nowrap; }
html body .idb-ls.ok { background: #ecfdf3; border-color: #a7e3bd; } html body .idb-ls.ok .lamp { background: #16a34a; box-shadow: 0 0 0 3px #bbf7d0; } html body .idb-ls.ok .st { color: #15803d; }
html body .idb-ls.bad { background: #fef2f2; border-color: #f3b4b4; } html body .idb-ls.bad .lamp { background: #dc2626; box-shadow: 0 0 0 3px #fecaca; } html body .idb-ls.bad .st { color: #b91c1c; }
html body .idb-ls.error { background: #fffbeb; border-color: #fcd34d; } html body .idb-ls.error .lamp { background: #f59e0b; } html body .idb-ls.error .st { color: #b45309; }
html body a.idb-ls:hover { border-color: var(--t-ac); }
@media (max-width: 1100px) {
    html body .idb { padding: 0 16px; }
    html body .idb-span7, html body .idb-span5 { grid-column: 1 / -1; }
    html body .idb-login { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    html body .idb-rcounts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
/* 연동 상태 보기(/?view=status): 외주사 구역 전부. 카드 제목을 분명하게 */
html.ino-dash-status body .sync-panel-title { font-size: 16px; font-weight: 800; }

/* ── 9-5) 반품 화면(/ext/returns, page_returns.js) ── */
html body .ino-returns { max-width: min(1600px, 100%); padding-left: 32px; padding-right: 32px; }
html body .ino-rt-cards { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
html body .ino-rt-card { display: flex; flex-direction: column; align-items: flex-start; padding: 10px 14px; border: 1px solid var(--t-line); border-radius: 10px;
    background: #ffffff; cursor: pointer; font-family: inherit; text-align: left; }
html body .ino-rt-card:hover { border-color: var(--t-ac); }
html body .ino-rt-card.on { border-color: var(--t-ac); background: var(--t-ac-soft); box-shadow: inset 0 0 0 1px var(--t-ac); }
html body .ino-rt-card .l { font-size: 13.5px; font-weight: 700; color: #374151; }
html body .ino-rt-card .n { font-size: 26px; font-weight: 800; color: var(--t-text); font-variant-numeric: tabular-nums; }
html body .ino-rt-card .n.warn { color: var(--t-warn); } html body .ino-rt-card .n.zero { color: var(--t-dim); }
html body .ino-rt-bar { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; margin-bottom: 12px; padding: 10px 14px; background: #ffffff;
    border: 1px solid var(--t-line); border-radius: 10px; }
html body .ino-rt-field { display: flex; flex-direction: column; gap: 3px; font-size: 12.5px; font-weight: 700; color: #374151; }
html body .ino-rt-field select { height: 36px; min-width: 150px; padding: 0 10px; font-size: 14px; border: 1px solid var(--t-line2); border-radius: 8px; }
html body .ino-rt-info { margin-left: auto; font-size: 13px; font-weight: 600; color: var(--t-muted); padding-bottom: 8px; }
html body .ino-rt-warn p { margin: 0 0 8px; font-size: 13px; color: var(--t-warn); font-weight: 600; }
html body .ino-rt-table td.ino-rt-mono { font-family: 'Cascadia Code', Consolas, monospace; font-size: 13px; }
html body .ino-rt-day { white-space: nowrap; }
html body .ino-rt-el { text-align: right; font-weight: 800; white-space: nowrap; }
html body .ino-rt-el.old { color: var(--t-bad); }
html body .ino-rt-table th:last-child { text-align: right; }
html body .ino-rt-dim { font-size: 12.5px; color: var(--t-muted); }
html body .ino-rt-err { color: var(--t-bad); font-weight: 600; }
html body .ino-rt-cat { display: inline-block; font-size: 12px; font-weight: 700; padding: 2px 8px; border-radius: 999px; background: #e5e7eb; color: #374151; }
html body .ino-rt-cat.cat-반품요청, html body .ino-rt-cat.cat-반품진행, html body .ino-rt-cat.cat-교환 { background: #ffedd5; color: #9a3412; }
html body .ino-rt-cat.cat-반품완료 { background: #dcfce7; color: #166534; }
html body .ino-rt-cat.cat-취소 { background: #e5e7eb; color: #374151; }
html body .ino-rt-cat.cat-미분류 { background: #fee2e2; color: #991b1b; }
html body .ino-rt-sec { margin-top: 18px; padding: 14px 18px; background: #ffffff; border: 1px solid var(--t-line); border-radius: 12px; }
html body .ino-rt-sec h3 { margin: 0 0 8px; font-size: 16px; font-weight: 800; color: var(--t-text); }
html body .ino-rt-sec p { margin: 4px 0; }
html body .ino-rt-um { margin: 8px 0; }
html body .ino-rt-after ul { margin: 0; padding-left: 18px; }
html body .ino-rt-after li { margin: 4px 0; font-size: 14px; line-height: 1.55; color: var(--t-text); }
html body .ino-rt-after li b { display: inline-block; min-width: 64px; }
html body .ino-rt-loading { color: var(--t-muted); }
@media print { html body .idb-foot, html body .ino-rt-bar { display: none !important; } }

/* ═══════════════════════════════════════════════════════════════════════════
   10) 차분 정리(2026-09-21 밤) — 사장님 "전체적으로 너무 번잡스러워 조잡해"
       규칙 5개만:
       · 색   : 회색 + 강조 남색(--t-ac) 1개 + 상태색(초록=있음/성공, 빨강=오류, 주황=경고)만. 사이트별 무지개색(구구스 노랑·트렌비 보라…)은 전부 회색 한 가지
       · 글씨 : 12px(보조·표 머리) / 14px(본문·표·단추) / 16px(카드 제목) / 22px(화면 제목·큰 숫자) 네 단계
       · 선   : 카드·표 테두리 1px 옅은 회색 하나, 그림자 없음, 모서리 카드 10px · 단추/입력칸 6px
       · 단추 : 주 단추(남색 채움) / 보조 단추(흰 바탕+회색 테두리) 두 종류. 줄마다 있는 단추는 전부 보조 단추
       · 표   : 줄무늬 없이 줄 사이 선 하나, 머리줄은 바탕색 없이 굵은 회색 글자
       오류·경고의 의미는 그대로(빨강 글자·빨강 테두리) — 다만 칸 전체를 색으로 칠하지 않음
   ═══════════════════════════════════════════════════════════════════════════ */
:root { --t-r: 10px; --t-r-sm: 6px; --t-th: #4b5563; --t-hover: #f5f7fa; }

/* ── 10-1) 사이트 무지개색 → 회색 한 가지 ── */
html body .idb-pf, html body .idb-pf-gugus, html body .idb-pf-trenbe, html body .idb-pf-feelway, html body .idb-pf-chic, html body .idb-pf-bunjang,
html body .product-table .badge[style*="background:#eca413"], html body .product-table .badge[style*="background:#7c3aed"],
html body .product-table .badge[style*="background:#2563eb"], html body .product-table .badge[style*="background:#059669"],
html body .product-table .badge[style*="background:#dc2626"] {
    background: #f3f4f6 !important; color: #374151 !important; font-size: 12px !important; font-weight: 600 !important; border-radius: 4px !important; padding: 2px 7px !important;
}
html body .idb-dot { display: none; }                               /* 대시보드 주문표 사이트 앞 색 점 */
html body .as-color-bar { display: none !important; }              /* 계정설정 카드 앞 색 막대 */
html body .as-status.empty { background: #f3f4f6; color: var(--t-muted); }
html body .as-status.saved { background: transparent; color: var(--t-ok); }

/* ── 10-2) 글씨 크기 네 단계 ── */
html body h2.text-2xl, html body .idb-head h2, html body .unified-container::before, html body .as-header { font-size: 22px !important; font-weight: 700 !important; letter-spacing: -0.01em; }
html body .font-serif, html body .as-header, html body h1, html body h2, html body h3 { font-family: var(--t-font) !important; }   /* 제목만 명조(Playfair)로 섞여 있던 것 → 한 글꼴 */
html body .as-label { color: var(--t-muted) !important; }
html body .idb-card > h3, html body .ino-rt-sec h3, html body .section-title, html body .as-platform-name, html body .sync-panel-title { font-size: 16px !important; font-weight: 700 !important; }
html body .nav-tab, html body .nav-dropdown-toggle { font-size: 14px; }
html body .nav-tab.active, html body .nav-tab[data-ino-active], html body .nav-dropdown-toggle[data-ino-active] { font-weight: 700; }
html body .ino-viewtabs a { font-size: 14px; font-weight: 600; padding: 8px 14px 9px; border-bottom-width: 2px; }
html body .ino-viewtabs a[aria-current="page"] { font-weight: 700; }
/* 큰 숫자: 22px 한 가지 */
html body .idb-tile .n, html body .idb-inq-total b, html body .idb-rc .n, html body .ino-rt-card .n, html body .idb-kv b { font-size: 22px; font-weight: 700; line-height: 1.25; }
/* 칸 이름(발주 요청·반품요청…): 본문 크기, 보조색 */
html body .idb-tile .l, html body .idb-rc .l, html body .ino-rt-card .l, html body .idb-inq-total .l, html body .idb-kv .l, html body .ino-rt-field { font-size: 12px; font-weight: 600; color: var(--t-muted); }
/* 보조 글자: 12px */
html body .idb-meta, html body .idb-muted, html body .idb-sub, html body .idb-inq-sub, html body .idb-chip .sub, html body .idb-rhead, html body .ino-rt-dim, html body .ino-rt-info,
html body .ino-date, html body .product-total, html body .idb-status-link, html body .h2-sub, html body h2.text-2xl + p.text-sm, html body .section-title span, html body .as-label { font-size: 12px !important; }
html body .idb-note { font-size: 12px; }
html body .idb-line, html body .idb-rlist li, html body .idb-chip, html body .idb-rfoot, html body .ino-rt-after li { font-size: 14px; }
html body .idb-chip b { font-size: 14px; font-weight: 700; }

/* ── 10-3) 카드: 테두리 1px 하나 · 그림자 없음 · 모서리 10px ── */
html body .idb-card, html body .ino-rt-sec, html body .ino-rt-bar, html body .filter-panel, html body .as-card, html body .product-table-wrap, html body .unified-table-wrap,
html body .upload-section, html body .card, html body .sync-panel {
    border: 1px solid var(--t-line) !important; border-radius: var(--t-r) !important; box-shadow: none !important;
}
html body .idb-card[data-state="bad"] { border-color: var(--t-line) !important; }      /* 오류는 카드 안 빨간 글자로만 */
html body .idb-card { padding: 16px 20px; }
html body .idb-grid, html body .idb-stack { gap: 16px; }
html body .ino-rt-cards { gap: 8px; }
html body .ino-rt-sec { margin-top: 16px; padding: 16px 20px; }

/* ── 10-4) 타일·칩: 칸을 색으로 칠하지 않음(숫자 글자색으로만 상태 표시) ── */
html body .idb-tile .go { display: none; }                         /* 타일 4개마다 '주문 목록 보기 →' 반복 → 타일 자체를 누르면 됨 */
html body .idb-tile, html body .idb-rc, html body .ino-rt-card, html body .idb-chip, html body .idb-ls { border-radius: 8px; border-color: var(--t-line); background: #ffffff; }
html body .idb-tile:hover, html body .idb-rc:hover, html body .ino-rt-card:hover, html body .idb-chip:hover, html body a.idb-ls:hover { background: var(--t-hover); border-color: var(--t-line2); }
html body .ino-rt-card.on { background: var(--t-ac-soft); border-color: var(--t-ac); box-shadow: none; }
html body .idb-tile .n.has { color: var(--t-text); }                /* 주문 있음은 상태가 아님 → 검정 숫자 */
html body .idb-rc .n.warn, html body .ino-rt-card .n.warn { color: var(--t-text); }
html body .idb-chip.has, html body .idb-chip.err { background: #ffffff; }
html body .idb-chip.has { border-color: var(--t-line); }
html body .idb-chip.err { border-color: var(--t-bad-line); }
html body .idb-ls.ok, html body .idb-ls.bad, html body .idb-ls.error { background: #ffffff; }
html body .idb-ls.ok { border-color: var(--t-line); }
html body .idb-ls.ok .lamp, html body .idb-ls.bad .lamp { box-shadow: none; }
html body .idb-ls .lamp { width: 8px; height: 8px; }
/* 반품 분류 배지: 회색 한 가지(미분류만 빨강 글자) */
html body .ino-rt-cat, html body .ino-rt-cat.cat-반품요청, html body .ino-rt-cat.cat-반품진행, html body .ino-rt-cat.cat-교환, html body .ino-rt-cat.cat-반품완료, html body .ino-rt-cat.cat-취소 {
    background: #f3f4f6; color: #374151; font-weight: 600; border-radius: 4px;
}
html body .ino-rt-cat.cat-미분류 { background: #f3f4f6; color: var(--t-bad); font-weight: 600; border-radius: 4px; }
html body .ino-rt-table td.ino-rt-mono { font-family: inherit; font-size: 14px; font-variant-numeric: tabular-nums; }
/* 상태 배지(판매중·품절·연결됨…): 칠한 알약 → 점 + 글자 (점 색이 상태) */
html body .link-badge, html body .stock-badge, html body .link-badge.linked, html body .link-badge.unlinked,
html body .stock-badge.stock-on, html body .stock-badge.stock-off, html body .stock-badge.stock-na {
    background: transparent !important; border: 0 !important; padding: 1px 4px !important; font-weight: 600 !important; color: #374151 !important;
}
html body .link-badge.unlinked, html body .stock-badge.stock-na { color: var(--t-dim) !important; font-weight: 500 !important; }
html body .stock-badge.stock-off { color: var(--t-bad) !important; }
html body .status-badge, html body .sync-badge { border-radius: 4px; font-weight: 600; }
html body .idb-grade { border-radius: 4px; font-weight: 600; }

/* ── 10-5) 단추 두 종류 ── */
/* 보조 단추: 흰 바탕 + 회색 테두리 + 진한 회색 글자 */
html body .idb-rf, html body .product-table td .row-link-btn, html body .unified-table .expand-btn,
html body .unified-table .stock-btn-soldout, html body .unified-table .stock-btn-resume,
html body .unified-table tr:hover .stock-btn-soldout, html body .unified-table tr:hover .stock-btn-resume,
html body .unified-table tr:focus-within .stock-btn-soldout, html body .unified-table tr:focus-within .stock-btn-resume,
html body .product-table td .row-link-btn[style*="background:#059669"] {
    background: #ffffff !important; border: 1px solid var(--t-line2) !important; color: #1f2937 !important;
    border-radius: var(--t-r-sm) !important; font-size: 12px !important; font-weight: 600 !important; box-shadow: none !important;
}
html body .idb-rf:hover, html body .product-table td .row-link-btn:hover, html body .unified-table .expand-btn:hover,
html body .unified-table .stock-btn-soldout:hover, html body .unified-table .stock-btn-resume:hover {
    background: var(--t-hover) !important; border-color: #9ca3af !important; color: var(--t-text) !important;
}
/* 품절처리 / 판매재개: 모양은 같게, 글자색으로만 구분(잘못 누르지 않게) */
html body .unified-table .stock-btn-soldout, html body .unified-table tr:hover .stock-btn-soldout { color: #9a3412 !important; }
html body .unified-table .stock-btn-resume, html body .unified-table tr:hover .stock-btn-resume { color: #166534 !important; }
/* '설명보기' 없음(시크 연동 필요): 점선 대신 흐린 보조 단추 */
html body .product-table td .row-link-btn[style*="dashed"] { background: #ffffff !important; border: 1px dashed var(--t-line2) !important; color: var(--t-dim) !important; font-size: 12px !important; }
/* 주 단추(저장·필터 적용·업로드): 남색 채움, 모서리 6px */
html body .as-save-btn, html body .idb-rf.primary, html body .btn-primary, html body .filter-apply-btn, html body .upload-btn {
    border-radius: var(--t-r-sm) !important; box-shadow: none !important; font-weight: 600 !important;
}
html body .idb-rf.primary { background: var(--t-ac) !important; border-color: var(--t-ac) !important; color: #ffffff !important; }
html body .idb-rf.primary:hover { background: var(--t-ac-h) !important; color: #ffffff !important; filter: none; }
html body .idb-rf { padding: 3px 10px; line-height: 1.4; }
/* 입력칸·고르기 모서리 통일 */
html body input[type="text"], html body input[type="search"], html body input[type="number"], html body input[type="password"], html body input[type="date"],
html body select, html body textarea, html body .as-input { border-radius: var(--t-r-sm) !important; box-shadow: none; }

/* ── 10-6) 표: 줄무늬 없이 선 하나, 머리줄 바탕 없음 ── */
html body .product-table th, html body .unified-table th, html body .idb-pt thead th {
    background: #ffffff !important; color: var(--t-th) !important; font-size: 12px !important; font-weight: 600 !important; border-bottom: 1px solid var(--t-line2) !important;
}
html body .product-table tbody tr:nth-child(even) > td, html body .unified-table tbody tr.data-row:nth-child(4n+3) > td { background: transparent; }
html body .product-table tbody tr:hover > td, html body .unified-table tbody tr.data-row:hover > td { background: var(--t-hover); }
html body .product-table td, html body .unified-table td { border-bottom: 1px solid #eef0f3; }
html body .idb-pt tfoot th, html body .idb-pt tfoot td { background: transparent; border-top: 1px solid var(--t-line2); font-weight: 700; }
html body .idb-pt td.bad, html body .ino-rt-el, html body .idb-rlist .el { font-weight: 600; }

/* ── 10-7) 설명 문구 줄이기: 탭 옆 괄호 설명·탭 아래 한 줄 설명은 마우스를 올리면(layout.js 가 title 로 옮김) ── */
html body .ino-viewtabs a small { display: none; }
html body .ino-viewtabs-desc { display: none; }
html body .idb-head .idb-sub { display: none; }
/* 사장님 고정 메모: 빨강은 유지하되 굵기·크기를 본문 보조 수준으로 */
html body .idb-note.bad { font-weight: 500; }

/* ── 10-8) 색 줄이기 2차 — 사장님 "색상이 휘황찬란하다, 전부 다 눈 아프다" ──
   바탕 흰색/아주 옅은 회색 · 글자 검정/회색 · 강조 남색 1개. 초록/빨강/주황은 '문의 있음·문제 있음'에만, 채도 낮게, 칸을 칠하지 않고 글자색(또는 얇은 왼쪽 선)으로만 */
:root {
    --t-ok: #3f7a56;      --t-ok-soft: #ffffff;  --t-ok-line: var(--t-line);      /* 차분한 초록(흰 바탕 5.1:1) */
    --t-bad: #b0413e;     --t-bad-soft: #ffffff; --t-bad-line: #e6c9c7;           /* 차분한 빨강(흰 바탕 5.6:1) */
    --t-warn: #8a6a1c;    --t-warn-soft: #ffffff; --t-warn-line: var(--t-line);   /* 차분한 황토(흰 바탕 5.0:1) */
    --t-dot: #9ca3af;     --t-dot-off: #d1d5db;
}
/* 머리: 종·'문의 19'·'오류 1곳' — 칠한 알약 → 회색 칸 + 글자색 */
html body .inoext-bell, html body .inoext-bell.inoext-bell-has { color: var(--t-text2); border-color: var(--t-line2); background: #ffffff; }
html body .inoext-bell.inoext-bell-bad { color: var(--t-bad); border-color: var(--t-line2); }
html body .inoext-bell-count { background: var(--t-ac); color: #ffffff; box-shadow: 0 0 0 2px #ffffff; }
html body .inoext-chip, html body .inoext-brief .inoext-chip, html body .inoext-brief.ino-brief-short .inoext-chip,
html body .inoext-chip.has, html body .inoext-brief .inoext-chip.has, html body .inoext-chip.err, html body .inoext-brief .inoext-chip.err,
html body #inoext-inquiry.inoext-in-drawer .inoext-chip.has, html body #inoext-inquiry.inoext-in-drawer .inoext-chip.err,
html body .unified-container > .inoext-xl-sum .inoext-chip.has, html body .unified-container > .inoext-xl-sum .inoext-chip.err {
    background: #ffffff !important; border: 1px solid var(--t-line) !important; color: var(--t-text2) !important;
}
html body .inoext-chip.has, html body .inoext-brief .inoext-chip.has { color: var(--t-ok) !important; }
html body .inoext-chip.err, html body .inoext-brief .inoext-chip.err { color: var(--t-bad) !important; }
html body .unified-container > .inoext-xl-sum .inoext-chip { border-color: transparent !important; }
html body #inoext-inquiry .inoext-chip.has .inq-part { color: var(--t-text2); }
html body #inoext-inquiry .inoext-chip.err .inq-part { color: var(--t-bad); }
html body .inoext-xl-b, html body .inoext-xl-b.has, html body .inoext-xl-b.off { background: #f3f4f6 !important; color: #4b5563 !important; }
html body .inoext-xl-b.err { background: #f3f4f6 !important; color: var(--t-bad) !important; }

/* 상품 표의 점: 연결됨·판매중 = 초록 불(사장님 2026-09-21 "연결된 건 초록불 왜 안 들어오냐") / 안 됨 = 옅은 회색 / 품절 = 차분한 빨강 */
html body .link-dot, html body .stock-indicator { width: 7px !important; height: 7px !important; }
html body .link-dot.on, html body .stock-indicator.on, html body .sync-dot.success { background: #16a34a !important; }
html body .link-badge.linked { color: #1f2937 !important; }
html body .link-dot.off, html body .stock-indicator.na { background: var(--t-dot-off) !important; }
html body .stock-indicator.off, html body .sync-dot.error { background: var(--t-bad) !important; }
/* 품절처리·판매재개 단추: 같은 회색 단추(글자로 구분) */
html body .unified-table .stock-btn-soldout, html body .unified-table tr:hover .stock-btn-soldout,
html body .unified-table .stock-btn-resume, html body .unified-table tr:hover .stock-btn-resume { color: #1f2937 !important; }

/* 상태 배지(판매중·오류·대기…): 칠하지 않고 옅은 회색 칸 + 글자색 */
html body .status-badge, html body .status-badge.active, html body .status-badge.inactive, html body .status-badge.pending,
html body .sync-badge, html body .sync-badge.success, html body .sync-badge.error { background: #f3f4f6 !important; color: #374151 !important; }
html body .status-badge.inactive, html body .sync-badge.error { color: var(--t-bad) !important; }
html body .status-badge.pending { color: var(--t-warn) !important; }
html body .idb-grade, html body .idb-grade.bad, html body .idb-grade.warn { background: transparent !important; padding: 0 4px 0 0; }
html body .idb-grade.bad { color: var(--t-bad) !important; } html body .idb-grade.warn { color: var(--t-warn) !important; }

/* 대시보드 */
html body .idb-chip.has b { color: var(--t-ok); }
html body .idb-chip.err b { color: var(--t-bad); }
html body .idb-chip.err { border-color: var(--t-line) !important; box-shadow: inset 2px 0 0 var(--t-bad); }   /* 오류 칸 = 얇은 왼쪽 빨간 선만 */
html body .idb-tile .n.has, html body .idb-kv b.warn { color: var(--t-text); }
html body .idb-kv b.bad { color: var(--t-bad); }
/* 로그인 상태 칸: 칸 색 없이 작은 점 + 회색 글자. 문제 있는 곳만 빨간 글자 */
html body .idb-ls, html body .idb-ls.ok, html body .idb-ls.bad, html body .idb-ls.error { background: #ffffff !important; border-color: var(--t-line) !important; }
html body .idb-ls .nm { font-weight: 600; }
html body .idb-ls .lamp { width: 7px; height: 7px; box-shadow: none !important; background: var(--t-dot-off); }
html body .idb-ls.ok .lamp { background: var(--t-ok); }
html body .idb-ls.bad .lamp { background: var(--t-bad); }
html body .idb-ls.error .lamp { background: var(--t-warn); }
html body .idb-ls .st, html body .idb-ls.ok .st, html body .idb-ls.error .st { color: var(--t-muted) !important; font-weight: 500; }
html body .idb-ls.bad .st { color: var(--t-bad) !important; font-weight: 600; }
html body .idb-ls.bad .nm { color: var(--t-bad); }
html body .idb-ls.error .st { color: var(--t-warn) !important; font-weight: 600; }

/* 통합업로드 리본즈·머스트잇 구역(feat_extupload.js 가 넣는 .eu-*) — 색만 */
html body .eu-root { border-color: var(--t-line); border-radius: var(--t-r); }
html body .eu-root .eu-head { background: #ffffff; }
html body .eu-root .eu-title { color: var(--t-text); font-size: 16px; }
html body .eu-mode, html body .eu-mode.send { background: #f3f4f6 !important; border-color: transparent !important; color: #374151 !important; border-radius: 4px; }
html body .eu-mode.send { color: var(--t-ok) !important; }
html body .eu-root button.eu-btn { border-color: var(--t-line2); color: #1f2937; }
html body .eu-root button.eu-btn:hover:not(:disabled) { background: var(--t-hover); }
html body .eu-preview .eu-step-head { color: var(--t-text); }
html body .eu-preview tr.chg td { background: #f5f7fa; }
html body .eu-notice { background: #ffffff; border: 1px solid var(--t-line); box-shadow: inset 3px 0 0 var(--t-warn); color: var(--t-text2); }
html body :is(.eu-root,.eu-part) .eu-photos { background: #ffffff; border-color: var(--t-line); box-shadow: inset 3px 0 0 var(--t-bad); }
html body :is(.eu-root,.eu-part) .eu-auto, html body .eu-auto { color: var(--t-muted); }

/* 외주사 화면 곳곳의 알록달록한 작은 칸(업로드 플랫폼 탭·로딩 배지 등) */
html body .loading-badge { background: #f3f4f6 !important; color: #4b5563 !important; }

/* ═══ 11) 색 구분 되살림 (사장님 2026-09-21 "색이 없어지니까 사이트별·상태별 구분이 안 돼서 불편") ═══
   원칙: 옅은 바탕 + 진한 글자(눈 안 아프게). 사이트 5+2색, 주문 상태 5색(결제·준비·배송중·완료·취소/반품) */
html body .product-table .badge[style*="background:#eca413"], html body .idb-pf-gugus   { background: #fef3c7 !important; color: #92400e !important; }
html body .product-table .badge[style*="background:#7c3aed"], html body .idb-pf-trenbe  { background: #ede9fe !important; color: #5b21b6 !important; }
html body .product-table .badge[style*="background:#2563eb"], html body .idb-pf-feelway { background: #dbeafe !important; color: #1e40af !important; }
html body .product-table .badge[style*="background:#059669"], html body .idb-pf-chic    { background: #d1fae5 !important; color: #065f46 !important; }
html body .product-table .badge[style*="background:#dc2626"], html body .idb-pf-bunjang { background: #fee2e2 !important; color: #991b1b !important; }
html body .idb-pf-reebonz { background: #e5e7eb !important; color: #111827 !important; }
html body .idb-pf-mustit  { background: #fce7f3 !important; color: #9d174d !important; }
html body .idb-dot { display: inline-block !important; }
html body .idb-dot-gugus { background: #d97706; } html body .idb-dot-trenbe { background: #7c3aed; } html body .idb-dot-feelway { background: #2563eb; }
html body .idb-dot-chic { background: #059669; } html body .idb-dot-bunjang { background: #dc2626; } html body .idb-dot-reebonz { background: #111827; } html body .idb-dot-mustit { background: #db2777; }
/* 주문 상태 칸(feat_status_colors.js 가 글자를 보고 붙임) */
html body .ino-st { display: inline-block; padding: 2px 8px; border-radius: 4px; font-weight: 600; font-size: 12.5px; line-height: 1.5; }
html body .ino-st-pay   { background: #dbeafe; color: #1e40af; }
html body .ino-st-ready { background: #fef3c7; color: #92400e; }
html body .ino-st-ship  { background: #ede9fe; color: #5b21b6; }
html body .ino-st-done  { background: #d1fae5; color: #065f46; }
html body .ino-st-cancel{ background: #fee2e2; color: #991b1b; }
html body .ino-st-return{ background: #ffe4e6; color: #9f1239; }
/* 반품 분류 배지 */
html body .ino-rt-cat.cat-반품요청 { background: #ffe4e6 !important; color: #9f1239 !important; }
html body .ino-rt-cat.cat-반품진행 { background: #fef3c7 !important; color: #92400e !important; }
html body .ino-rt-cat.cat-반품완료 { background: #d1fae5 !important; color: #065f46 !important; }
html body .ino-rt-cat.cat-취소     { background: #f3f4f6 !important; color: #374151 !important; }
html body .ino-rt-cat.cat-교환     { background: #ede9fe !important; color: #5b21b6 !important; }