/*  AMES Office Web — desktop layout
    Side-nav (260px) + main content area, dark theme to match POP/PDA. */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800;900&family=JetBrains+Mono:wght@400;600;700&family=Bebas+Neue&family=Noto+Sans+KR:wght@400;500;700&display=swap');

/* ── Radzen 컴포넌트 변수 오버라이드 — AMES 다크 브랜딩에 맞춤 ──────
   material-dark-base 위에 소수 변수만 조정. Radzen 컴포넌트는 .rz-* 로 스코프되어
   기존 .ames-* 화면과 충돌하지 않는다. */
:root {
    /* 글꼴 스택 — 라틴은 디자인 글꼴, 한글은 고정폭 대체 글꼴(굴림체 계열)로 떨어지지 않게 한글 산세리프를 monospace 앞에 둔다 */
    --ames-font-sans: 'Inter', 'Noto Sans KR', 'Malgun Gothic', sans-serif;
    --ames-font-mono: 'JetBrains Mono', 'Noto Sans KR', 'Malgun Gothic', monospace;
    --ames-font-display: 'Bebas Neue', 'Noto Sans KR', 'Malgun Gothic', sans-serif;
    --ames-font-code: ui-monospace, Consolas, 'Noto Sans KR', 'Malgun Gothic', monospace;
    /* 작은 글씨 보정: 영어·스페인어 0, 한국어 +1px (획이 많아 같은 px 에서 더 작게 읽힌다). 안내문은 10px → 11px(ko 12px) */
    --ames-fs-bump: 0px;
    --ames-fs-hint: 11px;
    --rz-primary: #2563eb;
    --rz-primary-light: #3b82f6;
    --rz-text-color: #e5edf7;
    --rz-text-secondary-color: #93a4bd;
    --rz-base-background-color: #060b17;
    --rz-body-background-color: transparent;
    --rz-panel-background-color: rgba(255, 255, 255, .03);
    --rz-input-background-color: rgba(255, 255, 255, .04);
    --rz-input-value-color: #e5edf7;
    --rz-border-radius: 10px;
    --rz-grid-background-color: transparent;
    --rz-grid-header-background-color: rgba(255, 255, 255, .04);
    --rz-grid-cell-color: #e5edf7;
    --rz-grid-stripe-background-color: rgba(255, 255, 255, .02);
    --rz-font-family: var(--ames-font-sans);
}

/* ═══ THEME TOKENS (dark) — tools/theme-tokenize.js 가 만든다. 값은 다크 원래 색, 라이트 값은 아래 (light) 블록 ═══ */
:root {
    --ames-bd-white-a04: rgba(255,255,255,.04);
    --ames-bd-white-a05: rgba(255,255,255,.05);
    --ames-bd-white-a06: rgba(255,255,255,.06);
    --ames-bd-white-a07: rgba(255,255,255,.07);
    --ames-bd-white-a08: rgba(255,255,255,.08);
    --ames-bd-white-a10: rgba(255,255,255,.1);
    --ames-bd-white-a12: rgba(255,255,255,.12);
    --ames-bd-white-a14: rgba(255,255,255,.14);
    --ames-bd-white-a15: rgba(255,255,255,.15);
    --ames-bd-white-a25: rgba(255,255,255,.25);
    --ames-bd-white-a45: rgba(255,255,255,.45);
    --ames-sf-03251a: #03251a;
    --ames-sf-040e10-a92: rgba(4,14,16,.92);
    --ames-sf-040e10-a97: rgba(4,14,16,.97);
    --ames-sf-050a13: #050a13;
    --ames-sf-050a14-a92: rgba(5,10,20,.92);
    --ames-sf-050a14-a97: rgba(5,10,20,.97);
    --ames-sf-050d10: #050d10;
    --ames-sf-050d10-a85: rgba(5,13,16,.85);
    --ames-sf-050f12: #050f12;
    --ames-sf-052e1f: #052e1f;
    --ames-sf-060b17: #060b17;
    --ames-sf-061a1c-a92: rgba(6,26,28,.92);
    --ames-sf-061a1c-a97: rgba(6,26,28,.97);
    --ames-sf-07101f: #07101f;
    --ames-sf-071a1c: #071a1c;
    --ames-sf-080f1c-a72: rgba(8,15,28,.72);
    --ames-sf-080f1c-a98: rgba(8,15,28,.98);
    --ames-sf-090f1d: #090f1d;
    --ames-sf-0a1426-a85: rgba(10,20,38,.85);
    --ames-sf-0a1426-a92: rgba(10,20,38,.92);
    --ames-sf-0a1426-a95: rgba(10,20,38,.95);
    --ames-sf-0a1426-a97: rgba(10,20,38,.97);
    --ames-sf-0b1220: #0b1220;
    --ames-sf-0c182b: #0c182b;
    --ames-sf-0d1a2e: #0d1a2e;
    --ames-sf-0d1b2e: #0d1b2e;
    --ames-sf-0e1a30: #0e1a30;
    --ames-sf-0f172a: #0f172a;
    --ames-sf-0f172a-a62: rgba(15, 23, 42, .62);
    --ames-sf-0f172a-a64: rgba(15,23,42,.64);
    --ames-sf-0f172a-a70: rgba(15,23,42,.7);
    --ames-sf-0f172a-a72: rgba(15,23,42,.72);
    --ames-sf-0f172a-a76: rgba(15,23,42,.76);
    --ames-sf-0f172a-a78: rgba(15,23,42,.78);
    --ames-sf-0f172a-a82: rgba(15,23,42,.82);
    --ames-sf-0f172a-a84: rgba(15,23,42,.84);
    --ames-sf-0f172a-a86: rgba(15,23,42,.86);
    --ames-sf-0f172a-a88: rgba(15,23,42,.88);
    --ames-sf-0f172a-a90: rgba(15,23,42,.9);
    --ames-sf-0f172a-a98: rgba(15,23,42,.98);
    --ames-sf-0f1b2e: #0f1b2e;
    --ames-sf-0f1d33-a85: rgba(15,29,51,.85);
    --ames-sf-0f1d33-a95: rgba(15,29,51,.95);
    --ames-sf-0f1d33-a98: rgba(15,29,51,.98);
    --ames-sf-0f3d3e: #0f3d3e;
    --ames-sf-111827: #111827;
    --ames-sf-111827-a95: rgba(17,24,39,.95);
    --ames-sf-111c30: #111c30;
    --ames-sf-16243b-a80: rgba(22,36,59,.8);
    --ames-sf-16243d: #16243d;
    --ames-sf-172238: #172238;
    --ames-sf-182638: #182638;
    --ames-sf-1e293b: #1e293b;
    --ames-sf-1e293b-a60: rgba(30,41,59,.6);
    --ames-sf-1e293b-a62: rgba(30,41,59,.62);
    --ames-sf-1e293b-a68: rgba(30,41,59,.68);
    --ames-sf-1e293b-a70: rgba(30,41,59,.7);
    --ames-sf-1e293b-a72: rgba(30,41,59,.72);
    --ames-sf-1e293b-a75: rgba(30,41,59,.75);
    --ames-sf-1e293b-a82: rgba(30,41,59,.82);
    --ames-sf-1e293b-a86: rgba(30,41,59,.86);
    --ames-sf-1e293b-a88: rgba(30,41,59,.88);
    --ames-sf-1e293b-a90: rgba(30,41,59,.9);
    --ames-sf-1e293b-a92: rgba(30,41,59,.92);
    --ames-sf-1e293b-a96: rgba(30,41,59,.96);
    --ames-sf-252a32: #252a32;
    --ames-tx-93a4bd: #93a4bd;
    --ames-tx-amber-200: #fde68a;
    --ames-tx-amber-300: #fcd34d;
    --ames-tx-amber-400: #fbbf24;
    --ames-tx-amber-500: #f59e0b;
    --ames-tx-blue-100: #dbeafe;
    --ames-tx-blue-200: #bfdbfe;
    --ames-tx-blue-300: #93c5fd;
    --ames-tx-blue-300-a35: rgba(147,197,253,.35);
    --ames-tx-blue-300-a60: rgba(147,197,253,.6);
    --ames-tx-blue-300-a65: rgba(147,197,253,.65);
    --ames-tx-blue-300-a70: rgba(147,197,253,.7);
    --ames-tx-blue-300-a85: rgba(147,197,253,.85);
    --ames-tx-blue-400: #60a5fa;
    --ames-tx-blue-400-a70: rgba(96,165,250,.7);
    --ames-tx-blue-400-a80: rgba(96,165,250,.8);
    --ames-tx-blue-600: #2563eb;
    --ames-tx-c4dafe: #c4dafe;
    --ames-tx-cyan-400: #22d3ee;
    --ames-tx-dbe5ef: #dbe5ef;
    --ames-tx-e5edf7: #e5edf7;
    --ames-tx-emerald-300: #6ee7b7;
    --ames-tx-emerald-400: #34d399;
    --ames-tx-emerald-500: #10b981;
    --ames-tx-gray-200: #e5e7eb;
    --ames-tx-gray-400: #9ca3af;
    --ames-tx-green-200: #bbf7d0;
    --ames-tx-green-300: #86efac;
    --ames-tx-green-400: #4ade80;
    --ames-tx-indigo-200: #c7d2fe;
    --ames-tx-orange-300: #fdba74;
    --ames-tx-orange-400: #fb923c;
    --ames-tx-orange-500: #f97316;
    --ames-tx-orange-600: #ea580c;
    --ames-tx-pink-400: #f472b6;
    --ames-tx-purple-300: #d8b4fe;
    --ames-tx-red-300: #fca5a5;
    --ames-tx-red-300-a70: rgba(252,165,165,.7);
    --ames-tx-red-300-a80: rgba(252,165,165,.8);
    --ames-tx-red-300-a85: rgba(252,165,165,.85);
    --ames-tx-red-400: #f87171;
    --ames-tx-red-500: #ef4444;
    --ames-tx-red-600: #dc2626;
    --ames-tx-rose-300: #fda4af;
    --ames-tx-sky-100: #e0f2fe;
    --ames-tx-sky-300: #7dd3fc;
    --ames-tx-sky-400: #38bdf8;
    --ames-tx-slate-200: #e2e8f0;
    --ames-tx-slate-200-a82: rgba(226,232,240,.82);
    --ames-tx-slate-300: #cbd5e1;
    --ames-tx-slate-300-a86: rgba(203,213,225,.86);
    --ames-tx-slate-400: #94a3b8;
    --ames-tx-slate-400-a42: rgba(148,163,184,.42);
    --ames-tx-slate-400-a60: rgba(148,163,184,.6);
    --ames-tx-slate-400-a80: rgba(148,163,184,.8);
    --ames-tx-slate-400-a90: rgba(148,163,184,.9);
    --ames-tx-slate-50: #f8fafc;
    --ames-tx-slate-500: #64748b;
    --ames-tx-teal-100: #ccfbf1;
    --ames-tx-teal-200: #99f6e4;
    --ames-tx-teal-300: #5eead4;
    --ames-tx-violet-300: #c4b5fd;
    --ames-tx-violet-400: #a78bfa;
    --ames-tx-white: #fff;
    --ames-tx-white-a20: rgba(255,255,255,.2);
    --ames-tx-white-a35: rgba(255,255,255,.35);
    --ames-tx-white-a40: rgba(255,255,255,.4);
    --ames-tx-white-a45: rgba(255,255,255,.45);
    --ames-tx-white-a50: rgba(255,255,255,.5);
    --ames-tx-white-a55: rgba(255,255,255,.55);
    --ames-tx-white-a60: rgba(255,255,255,.6);
    --ames-tx-white-a70: rgba(255,255,255,.7);
    --ames-tx-white-a75: rgba(255,255,255,.75);
    --ames-tx-white-a78: rgba(255,255,255,.78);
    --ames-tx-white-a80: rgba(255,255,255,.8);
    --ames-tx-white-a88: rgba(255,255,255,.88);
}
/* ═══ THEME TOKENS END ═══ */

/* FG-004 shipment DCR and internal product labels */
.fg-document-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1500;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(2, 6, 23, .7);
}

.fg-document-modal {
    width: min(1180px, calc(100vw - 48px));
    height: min(900px, calc(100vh - 48px));
    display: flex;
    flex-direction: column;
    background: var(--ames-panel, var(--ames-sf-111827));
    border: 1px solid rgba(148, 163, 184, .35);
    box-shadow: 0 24px 64px rgba(0, 0, 0, .48);
}

.fg-document-header,
.fg-document-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 20px;
    border-bottom: 1px solid rgba(148, 163, 184, .22);
}

.fg-document-header div {
    display: grid;
    gap: 3px;
}

.fg-document-header span {
    color: var(--ames-tx-blue-400);
    font-size: calc(11px + var(--ames-fs-bump));
    font-weight: 800;
    letter-spacing: .14em;
}

.fg-document-header strong { font-size: 22px; }
.fg-document-header small { color: var(--ames-tx-slate-400); }

.fg-document-header button {
    width: 38px;
    height: 38px;
    border: 1px solid rgba(148, 163, 184, .28);
    border-radius: 0;
    background: transparent;
    color: inherit;
}

.fg-document-tabs { display: flex; gap: 6px; }
.fg-document-tabs button {
    min-height: 34px;
    padding: 0 14px;
    border: 1px solid rgba(148, 163, 184, .28);
    border-radius: 0;
    background: transparent;
    color: var(--ames-tx-slate-400);
    font-weight: 700;
}
.fg-document-tabs button.active { border-color: #3b82f6; background: #1d4ed8; color: #fff; }

.fg-document-preview {
    flex: 1;
    overflow: auto;
    padding: 22px;
    background: var(--ames-sf-252a32);
}

.fg-dcr-paper {
    position: relative;
    width: 210mm;
    min-height: 297mm;
    margin: 0 auto;
    padding: 14mm 10mm 12mm;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: #fff;
    color: #050505;
    box-shadow: 0 14px 42px rgba(0, 0, 0, .34);
    font-family: Arial, Helvetica, sans-serif;
}

.fg-doc-watermark {
    position: absolute;
    top: 22mm;
    left: 16mm;
    z-index: 0;
    color: rgba(15, 23, 42, .07);
    font-size: 92px;
    font-weight: 900;
}

.fg-dcr-paper > *:not(.fg-doc-watermark) { position: relative; z-index: 1; }
.fg-dcr-paper h1 { margin: 2mm 0 0; text-align: center; font-size: 34px; letter-spacing: .04em; }
.fg-doc-subtitle { margin-bottom: 5mm; text-align: center; font-size: 12px; font-weight: 700; }

.fg-dcr-parties,
.fg-dcr-summary {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 7mm;
}

.fg-dcr-parties table,
.fg-dcr-destination table,
.fg-dcr-lines { width: 100%; border-collapse: collapse; }
.fg-dcr-parties th,
.fg-dcr-parties td { border: 1px solid #111; padding: 4px 7px; text-align: left; font-size: calc(11px + var(--ames-fs-bump)); }
.fg-dcr-parties thead th { background: #f3f4f6; }
.fg-dcr-parties tbody th { width: 25mm; }

.fg-dcr-summary { margin-top: 4mm; align-items: end; }
.fg-dcr-barcode-block { display: grid; grid-template-columns: 1fr 1fr; gap: 3px 10px; font-size: calc(11px + var(--ames-fs-bump)); }
.fg-dcr-barcode-block > div:nth-child(3) { grid-column: 1 / -1; }
.fg-doc-barcode { grid-column: 1 / -1; width: 100%; height: 23mm; margin-top: 2mm; }
.fg-doc-barcode rect,
.fg-label-barcode rect,
.fg-label-part-barcode rect { fill: #000; }
.fg-dcr-barcode-block > strong { grid-column: 1 / -1; text-align: center; font-family: 'Courier New', monospace; font-size: 12px; }
.fg-dcr-destination { display: grid; gap: 5px; font-size: calc(11px + var(--ames-fs-bump)); }
.fg-dcr-destination table { margin-top: 4mm; }
.fg-dcr-destination th,
.fg-dcr-destination td { border-top: 1px solid #111; border-bottom: 1px solid #111; padding: 4px; text-align: center; }

.fg-dcr-lines { margin-top: 4mm; table-layout: fixed; font-size: calc(9px + var(--ames-fs-bump)); }
.fg-dcr-lines th,
.fg-dcr-lines td { border-top: 1px solid #111; border-bottom: 1px dashed #777; padding: 5px 4px; text-align: center; vertical-align: middle; }
.fg-dcr-lines th:nth-child(1) { width: 7mm; }
.fg-dcr-lines th:nth-child(2) { width: 48mm; }
.fg-dcr-lines th:nth-child(3) { width: 12mm; }
.fg-dcr-lines th:nth-child(4) { width: 31mm; }
.fg-dcr-lines th:nth-child(5),
.fg-dcr-lines th:nth-child(6),
.fg-dcr-lines th:nth-child(7) { width: 16mm; }
.fg-dcr-lines td:nth-child(2) { text-align: left; }
.fg-dcr-lines td small { display: block; margin-top: 2px; }

.fg-dcr-signatures {
    min-height: 34mm;
    margin-top: auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    border: 1px solid #111;
}
.fg-dcr-signatures > div { display: flex; flex-direction: column; align-items: center; border-right: 1px solid #111; text-align: center; }
.fg-dcr-signatures > div:last-child { border-right: 0; }
.fg-dcr-signatures b { width: 100%; padding: 4px; border-bottom: 1px solid #111; font-size: calc(10px + var(--ames-fs-bump)); }
.fg-dcr-signatures span { width: 100%; margin-top: auto; padding: 4px; border-top: 1px solid #111; border-bottom: 1px solid #111; font-size: calc(9px + var(--ames-fs-bump)); }
.fg-dcr-signatures strong { padding: 5px; font-size: 12px; }
.fg-dcr-paper > footer { display: flex; justify-content: space-between; gap: 10px; margin-top: 3mm; font-size: calc(9px + var(--ames-fs-bump)); }

.fg-label-sheet {
    width: 297mm;
    min-height: 210mm;
    margin: 0 auto;
    padding: 6mm;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-content: start;
    background: #fff;
    color: #050505;
    box-shadow: 0 14px 42px rgba(0, 0, 0, .34);
    font-family: Arial, Helvetica, sans-serif;
}

.fg-product-label {
    min-height: 96mm;
    padding: 5mm 6mm 3mm;
    border: 1px dashed #555;
    break-inside: avoid;
    page-break-inside: avoid;
}
.fg-product-label header,
.fg-product-label footer { display: flex; justify-content: space-between; gap: 8px; font-size: calc(10px + var(--ames-fs-bump)); }
.fg-product-label header { padding-bottom: 2mm; border-bottom: 1px solid #111; font-size: 12px; }
.fg-label-barcode { display: block; width: 78%; height: 18mm; margin: 2mm auto 0; }
.fg-label-readable { text-align: center; font-family: 'Courier New', monospace; font-size: 13px; font-weight: 800; }
.fg-label-product { display: flex; align-items: baseline; gap: 4mm; margin-top: 2mm; border-top: 1px solid #111; padding: 2mm 2mm 1mm; }
.fg-label-product strong { font-size: 24px; letter-spacing: .03em; }
.fg-label-desc { display: flex; gap: 4mm; padding: 1mm 2mm 2mm; border-bottom: 1px solid #111; }
.fg-label-product span,
.fg-label-desc span,
.fg-label-grid span,
.fg-label-part > span { min-width: 16mm; font-size: calc(9px + var(--ames-fs-bump)); }
.fg-label-desc b { font-size: 14px; }
.fg-label-grid { display: grid; grid-template-columns: 1fr 1fr; }
.fg-label-grid div { display: flex; align-items: center; gap: 2mm; min-height: 9mm; padding: 1mm 2mm; border-bottom: 1px solid #111; }
.fg-label-grid div:nth-child(odd) { border-right: 1px solid #111; }
.fg-label-grid b { font-size: 13px; }
.fg-label-part { display: flex; align-items: center; gap: 3mm; min-height: 13mm; border-bottom: 1px solid #111; }
.fg-label-part-barcode { flex: 1; height: 11mm; }
.fg-product-label footer { padding-top: 2mm; }
.fg-doc-empty { padding: 30px; text-align: center; color: var(--ames-tx-slate-500); }

@media (max-width: 900px) {
    .fg-document-backdrop { padding: 10px; }
    .fg-document-modal { width: calc(100vw - 20px); height: calc(100vh - 20px); }
    .fg-document-toolbar { align-items: stretch; flex-direction: column; }
    .fg-document-tabs button { flex: 1; }
    .fg-document-preview { padding: 10px; }
}

@page fg-dcr { size: A4 portrait; margin: 0; }
@page fg-labels { size: A4 landscape; margin: 0; }

@media print {
    body * { visibility: hidden !important; }
    .fg-print-area,
    .fg-print-area * { visibility: visible !important; }
    .fg-print-area {
        position: absolute;
        inset: 0 auto auto 0;
        margin: 0;
        box-shadow: none;
    }
    .fg-dcr-paper { width: 210mm; min-height: 297mm; page: fg-dcr; }
    .fg-label-sheet { width: 297mm; min-height: 210mm; page: fg-labels; }
}

/* DataGrid 페이저: 버튼 왼쪽 · 페이지수/총건수 요약 오른쪽 */
.ames-rz-grid .rz-pager {
    display: flex;
    align-items: center;
    gap: 8px;
}
.ames-rz-grid .rz-pager .rz-paging-summary {
    margin-left: auto;
    color: var(--rz-text-secondary-color);
}

/* ── 스크롤바: 다크 테마에 맞춤 (그리드 본문 + 메인 콘텐츠) ────── */
.ames-rz-grid ::-webkit-scrollbar,
.ames-main::-webkit-scrollbar { width: 10px; height: 10px; }
.ames-rz-grid ::-webkit-scrollbar-track,
.ames-main::-webkit-scrollbar-track { background: transparent; }
.ames-rz-grid ::-webkit-scrollbar-thumb,
.ames-main::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, .14);
    border-radius: 6px;
    border: 2px solid transparent;
    background-clip: padding-box;
}
.ames-rz-grid ::-webkit-scrollbar-thumb:hover,
.ames-main::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, .28);
    background-clip: padding-box;
}
.ames-rz-grid ::-webkit-scrollbar-corner,
.ames-main::-webkit-scrollbar-corner { background: transparent; }
/* Firefox (자식 스크롤 요소로 상속) */
.ames-rz-grid, .ames-main { scrollbar-width: thin; scrollbar-color: rgba(255, 255, 255, .22) transparent; }

* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { width: 100%; height: 100%; }
body {
    font-family: var(--ames-font-sans);
    background: var(--ames-sf-060b17);
    color: var(--ames-tx-e5edf7);
    font-size: 17px;
    -webkit-font-smoothing: antialiased;
}
a { color: var(--ames-tx-blue-300); text-decoration: none; }
a:hover { color: var(--ames-tx-c4dafe); }

.ames-shell {
    display: flex;
    flex-direction: column;
    height: 100vh;
    background:
        radial-gradient(1200px 600px at 12% -10%, rgba(37,99,235,.18), transparent 60%),
        radial-gradient(900px 500px at 110% 10%, rgba(168,85,247,.12), transparent 60%),
        var(--ames-sf-060b17);
}

/* ── Top bar ──────────────────────────────────────────────── */
.ames-topbar {
    display: flex;
    align-items: center;
    height: 60px;
    flex-shrink: 0;
    background: linear-gradient(180deg, var(--ames-sf-0a1426-a97), var(--ames-sf-050a14-a97));
    border-bottom: 1px solid var(--ames-bd-white-a07);
    backdrop-filter: blur(6px);
    z-index: 100;
}
.ames-topbar-spacer { flex: 1; }

/* ── 현재 화면 경로/이름 (브랜드 우측 브레드크럼) ─────────────── */
.ames-topbar-loc {
    display: flex; align-items: center; gap: 10px;
    padding: 0 22px; height: 100%; min-width: 0;
}
.ames-loc-code {
    font-family: var(--ames-font-mono);
    font-size: calc(11px + var(--ames-fs-bump)); letter-spacing: 1px;
    color: var(--ames-tx-blue-300); line-height: 1;
    padding: 4px 9px; border-radius: 6px;
    background: rgba(147,197,253,.1);
    border: 1px solid rgba(147,197,253,.22);
    flex-shrink: 0;
}
.ames-loc-name {
    font-size: 15px; font-weight: 600; letter-spacing: .3px;
    color: var(--ames-tx-e5edf7);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* ── Shell body (side + main) ─────────────────────────────── */
.ames-body {
    display: flex;
    flex: 1;
    min-height: 0;
}

/* ── Sidebar ──────────────────────────────────────────────── */
.ames-side {
    flex: 0 0 330px;   /* 좌측 메뉴 폭 320 → 330 */
    overflow: hidden;
    background: linear-gradient(180deg, var(--ames-sf-0a1426-a92), var(--ames-sf-050a14-a92));
    border-right: 1px solid var(--ames-bd-white-a06);
    display: flex; flex-direction: column;
    backdrop-filter: blur(6px);
    transition: flex-basis .22s ease;
}

/* ── Sidebar toggle button ─────────────────────────────────── */
.ames-side-toggle {
    display: flex;
    align-items: center; justify-content: center;
    width: 34px; flex-shrink: 0;
    background: rgba(255,255,255,.06);
    border: 1px solid var(--ames-bd-white-a10);
    color: var(--ames-tx-white-a50);
    border-radius: 8px;
    font-size: calc(10px + var(--ames-fs-bump)); cursor: pointer;
    transition: background .12s, color .12s;
}
.ames-side-toggle:hover { background: rgba(255,255,255,.14); color: var(--ames-tx-white); }

/* ── Collapsed state (76px — just wide enough for .lid badges) */
.ames-side--collapsed { flex-basis: 76px; }

.ames-side--collapsed .ames-nav-top { justify-content: center; }
.ames-side--collapsed .ames-side-toggle { height: 34px; margin: 0 auto; }

.ames-side--collapsed .ames-nav { padding: 4px 4px 24px; }

.ames-side--collapsed .ames-nav-home {
    justify-content: center; padding: 10px 4px;
}
.ames-side--collapsed .ames-nav-home > span:last-child { display: none; }

.ames-side--collapsed .ames-nav-section {
    justify-content: center; padding: 12px 8px;
}
.ames-side--collapsed .ames-nav-section-t,
.ames-side--collapsed .ames-nav-section-n,
.ames-side--collapsed .ames-nav-chevron { display: none; }

.ames-side--collapsed .ames-nav-sub {
    justify-content: center; padding: 8px 4px; margin-left: 0;
}
.ames-side--collapsed .ames-nav-sub-body,
.ames-side--collapsed .ames-nav-sub-chevron { display: none; }

.ames-side--collapsed .ames-nav-link {
    justify-content: center; padding: 5px 4px;
}
.ames-side--collapsed .ames-nav-link > span:not(.lid) { display: none; }

.ames-brand {
    flex: 0 0 330px;   /* 좌측 메뉴(.ames-side)와 같은 폭 — 내용이 넘쳐도 늘어나지 않게 min-width/overflow 고정 */
    min-width: 0; max-width: 330px; overflow: hidden;
    padding: 0 20px 0 20px;
    height: 100%;
    display: flex;
    align-items: center;
    border-right: 1px solid var(--ames-bd-white-a07);
}
.ames-brand-row { display: flex; align-items: center; gap: 10px; }
/* 회사 CI 로고(brand/eos-logo.png, 521×120 투명 PNG — 원본 1213×363 에서 흰 배경 제거·여백 트림). 브랜드 칸 330px 안에 로고 + A-MES + OFFICE WEB 이 한 줄에 들어가도록 36px 높이로 */
.ames-brand-mark {
    display: block;
    height: 28px; width: auto;   /* 521×120 → 122×28: 로고 + A-MES + OFFICE WEB 합계가 330px 안에 들어가는 크기 */
}
html:not([data-theme="light"]) .ames-brand-mark { filter: drop-shadow(0 0 3px rgba(147,197,253,.45)); }   /* 짙은 남색 로고가 어두운 상단바에 묻히지 않게 */
.ames-brand-logo {
    font-family: var(--ames-font-display);
    font-size: 26px; letter-spacing: 2px;
    color: var(--ames-tx-white); line-height: 1; white-space: nowrap;
}
.ames-brand-sub {
    font-family: var(--ames-font-mono);
    font-size: calc(9px + var(--ames-fs-bump)); letter-spacing: 1.5px;
    color: var(--ames-tx-blue-300-a60); white-space: nowrap;
}

.ames-user {
    margin: 0 10px 0 0;
    padding: 8px 12px;
    background: linear-gradient(180deg, rgba(147,197,253,.08), rgba(147,197,253,.02));
    border: 1px solid rgba(147,197,253,.18);
    border-radius: 12px;
    display: flex; align-items: center; gap: 10px;
}
.ames-user.dim { opacity: .55; }
/* 사용자 아바타 — 역할별 Material 아이콘을 담은 단색 원 (역할 키는 TopBar.RoleVisual) */
.ames-user-av {
    width: 36px; height: 36px; flex: 0 0 36px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: var(--av-bg, rgba(59,130,246,.16));
    border: 1px solid var(--av-line, rgba(147,197,253,.35));
    color: var(--av-fg, var(--ames-tx-blue-300));
}
.ames-user-av .rzi { font-size: 20px !important; line-height: 1; color: inherit; }
.ames-user-av--admin { --av-bg: rgba(59,130,246,.18);  --av-line: rgba(147,197,253,.4);  --av-fg: #93c5fd; }
.ames-user-av--maint { --av-bg: rgba(245,158,11,.16);  --av-line: rgba(251,191,36,.4);   --av-fg: #fbbf24; }
.ames-user-av--oper  { --av-bg: rgba(34,197,94,.16);   --av-line: rgba(74,222,128,.4);   --av-fg: #4ade80; }
.ames-user-av--user  { --av-bg: rgba(148,163,184,.16); --av-line: rgba(148,163,184,.4);  --av-fg: #cbd5e1; }
.ames-user-av--none  { --av-bg: rgba(148,163,184,.10); --av-line: rgba(148,163,184,.25); --av-fg: #94a3b8; }
html[data-theme="light"] .ames-user-av--admin { --av-bg: rgba(37,99,235,.10);  --av-fg: #1d4ed8; }
html[data-theme="light"] .ames-user-av--maint { --av-bg: rgba(217,119,6,.10);  --av-fg: #b45309; }
html[data-theme="light"] .ames-user-av--oper  { --av-bg: rgba(22,163,74,.10);  --av-fg: #15803d; }
html[data-theme="light"] .ames-user-av--user,
html[data-theme="light"] .ames-user-av--none  { --av-bg: rgba(100,116,139,.10); --av-fg: #475569; }
.ames-user-info { flex: 1; min-width: 0; }
.ames-user-name {
    font-family: var(--ames-font-sans);
    color: var(--ames-tx-white); font-weight: 700;
    font-size: 14px;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ames-user-role {
    font-family: var(--ames-font-mono);
    color: var(--ames-tx-blue-300-a70);
    font-size: calc(11px + var(--ames-fs-bump)); letter-spacing: 1.5px;
    text-transform: uppercase; margin-top: 2px;
}
.ames-user-out {
    background: rgba(252,165,165,.08);
    border: 1px solid rgba(252,165,165,.28);
    color: var(--ames-tx-red-300);
    width: 30px; height: 30px;
    border-radius: 8px;
    font-size: 16px; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    transition: background .12s;
}
.ames-user-out:hover { background: rgba(252,165,165,.2); }

/* ── 언어 전환 (TopBar) ─────────────────────────────────────── */
.culture-switcher .culture-sep { color: #475569; font-size: .75em; line-height: 1; }
.culture-switcher a { font-size: .78em; text-decoration: none; cursor: pointer; color: var(--ames-tx-slate-400); font-weight: 400; }
.culture-switcher a.cur { color: var(--ames-tx-sky-400); font-weight: 700; }

.ames-nav {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 4px 10px 24px;
}
.ames-nav::-webkit-scrollbar { width: 6px; }
.ames-nav::-webkit-scrollbar-thumb { background: rgba(255,255,255,.1); border-radius: 3px; }
.ames-nav-home {
    display: flex; align-items: center; gap: 10px;
    padding: 10px 12px; margin-bottom: 4px;
    color: var(--ames-tx-white-a78);
    font-weight: 700; font-size: 14px;
    line-height: 1.25;
    border-radius: 8px;
    transition: background .12s, color .12s;
}
.ames-nav-home:hover { background: rgba(255,255,255,.04); color: var(--ames-tx-white); }
.ames-nav-home.active {
    background: linear-gradient(90deg, rgba(147,197,253,.15), transparent);
    color: var(--ames-tx-white);
}
.ames-nav-ic { font-size: 17px; opacity: .85; }

.ames-nav-section {
    display: flex; align-items: center; gap: 8px;
    padding: 16px 12px 8px;
    font-family: var(--ames-font-mono);
    font-size: calc(11px + var(--ames-fs-bump)); letter-spacing: 1.8px;
    color: var(--ames-tx-blue-300);
    text-transform: uppercase;
    position: relative;
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
}
.ames-nav-section:hover { color: var(--ames-tx-sky-300); }
.ames-nav-chevron { font-size: 12px; margin-left: auto; opacity: .7; }
.ames-nav-section-ic { font-size: 16px; }
.ames-nav-section-t { flex: 1; }
.ames-nav-section-n {
    background: rgba(255,255,255,.06);
    color: var(--ames-tx-white-a55);
    padding: 1px 6px; border-radius: 6px;
    font-size: calc(11px + var(--ames-fs-bump));
}
/* 섹션 색상 통일 — 전 카테고리 동일 색, 현재 열린(선택) 섹션 강조 */
.ames-nav-section.open { color: var(--ames-tx-sky-400); font-weight: 700; box-shadow: inset 2px 0 0 #38bdf8; }
.ames-nav-section.open .ames-nav-section-n { background: rgba(56,189,248,.14); color: var(--ames-tx-sky-300); }

/* ── MD 하위 카테고리 (마스터 데이터 5그룹) ─────────────────────── */
.ames-nav-sub {
    display: flex; align-items: center; gap: 10px;
    padding: 8px 10px;
    margin: 2px 0 2px 10px;
    border-radius: 8px;
    border-left: 2px solid transparent;
    cursor: pointer;
    user-select: none;
    transition: background .12s;
}
.ames-nav-sub:hover { background: rgba(255,255,255,.03); }
.ames-nav-sub.open {
    background: rgba(167,139,250,.08);
    border-left-color: #a78bfa;
}
.ames-nav-sub-letter {
    flex-shrink: 0; width: 20px; height: 20px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 6px;
    background: rgba(167,139,250,.14); color: var(--ames-tx-violet-400);
    font-family: var(--ames-font-mono);
    font-size: calc(11px + var(--ames-fs-bump)); font-weight: 700;
}
.ames-nav-sub-body { flex: 1; min-width: 0; }
.ames-nav-sub-t {
    font-size: 13px; font-weight: 700;
    line-height: 1.25;
    color: var(--ames-tx-white-a88); white-space: nowrap;
}
.ames-nav-sub-s {
    font-size: calc(11px + var(--ames-fs-bump)); color: var(--ames-tx-white-a40); margin-top: 1px;
    line-height: 1.2;
    font-family: var(--ames-font-mono);
}
.ames-nav-sub-chevron { font-size: calc(11px + var(--ames-fs-bump)); opacity: .6; flex-shrink: 0; }
/* 단일 언어(한글 비활성) 시 서브그룹 화면 수 배지 — 메인 섹션과 유사, MD 퍼플 */
.ames-nav-sub .ames-nav-section-n {
    flex-shrink: 0;
    background: rgba(167,139,250,.14); color: var(--ames-tx-violet-400);
}

.ames-nav-link {
    display: flex; align-items: center; gap: 9px;
    padding: 6px 12px;
    color: var(--ames-tx-white-a60);
    font-size: 14px;
    line-height: 1.25;   /* 명시하지 않으면 한글 폴백 글꼴의 normal 행간이 Inter 보다 커서 언어에 따라 메뉴 높이가 달라진다 */
    border-radius: 7px;
    margin: 1px 0;
    transition: background .12s, color .12s;
    white-space: nowrap;
}
.ames-nav-link.sub { margin-left: 22px; }
/* 메뉴 이름 아래 보조 언어 이름 (NavMenu.NL) */
.ames-nav-alt { display: block; font-size: .72em; color: var(--ames-tx-slate-400); font-weight: 400; line-height: 1.2; }
.ames-nav-link:hover { color: var(--ames-tx-white); background: rgba(255,255,255,.04); }
.ames-nav-link.active {
    color: var(--ames-tx-white); font-weight: 700;
    background: linear-gradient(90deg, rgba(147,197,253,.18), rgba(147,197,253,.04));
    box-shadow: inset 2px 0 0 #93c5fd;
}
.ames-nav-link .lid {
    display: inline-block;
    min-width: 53px; text-align: center;
    background: rgba(255,255,255,.05);
    border: 1px solid var(--ames-bd-white-a08);
    color: var(--ames-tx-white-a55);
    font-family: var(--ames-font-mono);
    font-size: calc(11px + var(--ames-fs-bump)); letter-spacing: .5px;
    padding: 2px 6px; border-radius: 5px;
}
.ames-nav-link.active .lid {
    background: rgba(147,197,253,.18);
    border-color: rgba(147,197,253,.35);
    color: var(--ames-tx-blue-300);
}
.ames-nav-korean-detail {
    display: block;
    margin-top: 2px;
    color: var(--ames-tx-slate-400);
    font-size: .72em;
    font-weight: 400;
    line-height: 1.2;
}

/* ── Nav search box + sidebar toggle row ───────────────────── */
.ames-nav-top {
    display: flex; align-items: stretch; gap: 6px;
    flex-shrink: 0;
    padding: 8px 12px 6px;
}
.ames-nav-search {
    flex: 1; min-width: 0;
    display: flex; align-items: center; gap: 6px;
    padding: 0 8px;
    background: rgba(255,255,255,.05);
    border: 1px solid var(--ames-bd-white-a10);
    border-radius: 8px;
    transition: border-color .12s, background .12s;
}
.ames-nav-search:focus-within {
    border-color: rgba(147,197,253,.5);
    background: rgba(147,197,253,.06);
}
.ames-nav-search-ic { font-size: 13px; opacity: .6; }
.ames-nav-search input {
    flex: 1; min-width: 0;
    background: transparent; border: 0; outline: 0;
    color: var(--ames-tx-e5edf7); font-size: 13px;
    padding: 8px 0;
}
.ames-nav-search input::placeholder { color: var(--ames-tx-white-a40); }
.ames-nav-search-x {
    background: transparent; border: 0; cursor: pointer;
    color: var(--ames-tx-white-a50); font-size: 12px;
    padding: 2px 4px; line-height: 1;
    transition: color .12s;
}
.ames-nav-search-x:hover { color: var(--ames-tx-white); }

/* ── Search results / empty ────────────────────────────────── */
.ames-nav-results { padding-top: 2px; }
.ames-nav-empty {
    padding: 16px 12px;
    color: var(--ames-tx-white-a40);
    font-size: 13px; text-align: center;
}
/* id badge (favorites + search rows) — 색상 통일(모듈별 색 제거, 기본 슬레이트) */

/* ── Nav row (link + favorite star) ────────────────────────── */
.ames-nav-row { position: relative; display: flex; align-items: stretch; }
.ames-nav-row .ames-nav-link { flex: 1; min-width: 0; }
.ames-nav-star {
    flex: 0 0 auto;
    background: transparent; border: 0; cursor: pointer;
    width: 30px;
    color: var(--ames-tx-white-a35);
    font-size: 15px; line-height: 1;
    opacity: 0;
    transition: opacity .12s, color .12s, transform .1s;
}
.ames-nav-row:hover .ames-nav-star { opacity: 1; }
.ames-nav-star:hover { color: var(--ames-tx-amber-400); transform: scale(1.15); }
.ames-nav-row.is-fav .ames-nav-star { opacity: 1; color: var(--ames-tx-amber-400); }

/* ── Favorites section header ──────────────────────────────── */
.ames-nav-fav { color: var(--ames-tx-amber-400); }
.ames-nav-fav .ames-nav-section-n { background: rgba(251,191,36,.14); color: var(--ames-tx-amber-400); }
.ames-nav-fav:hover { color: var(--ames-tx-amber-300); }

/* ── Collapsed state: hide search / star / favorites text ──── */
.ames-side--collapsed .ames-nav-search,
.ames-side--collapsed .ames-nav-star { display: none; }
.ames-side--collapsed .ames-nav-fav { justify-content: center; padding: 12px 8px; }
.ames-side--collapsed .ames-nav-fav .ames-nav-section-t,
.ames-side--collapsed .ames-nav-fav .ames-nav-section-n { display: none; }
.ames-side--collapsed .ames-nav-row .ames-nav-link { justify-content: center; }

/* ── Main content ─────────────────────────────────────────── */
.ames-main { flex: 1; min-width: 0; overflow-y: auto; }
.ames-content { padding: 12px 20px 16px; }

/* 화면 경로/이름은 TopBar 브레드크럼(.ames-topbar-loc)에 표시된다.
   과거 페이지 상단 헤더(.ames-page-h/-id/-t/-sub)는 제거됨. */

/* ── Tiles (module / home) ────────────────────────────────── */
.ames-tiles {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 16px;
}
/* 넓은 타일 — 기본 대비 열당 폭 확대, 설명 줄바꿈 완화 */
.ames-tiles.ames-tiles-4up { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }
/* 카테고리 카드를 한 줄에 나란히 (내려쓰기 방지) */
.rpt-cat-row { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 8px; }
.ames-card.rpt-col { flex: 1 1 0; min-width: 0; margin-bottom: 0; }
.ames-tile {
    background: linear-gradient(160deg, var(--ames-sf-16243d), var(--ames-sf-0e1a30));
    border: 1px solid var(--ames-bd-white-a08);
    border-radius: 14px; padding: 24px;
    color: var(--ames-tx-white); cursor: pointer;
    display: flex; flex-direction: column; gap: 8px;
    transition: transform .15s, border-color .15s, box-shadow .15s;
    position: relative; overflow: hidden;
}
.ames-tile:hover {
    transform: translateY(-3px);
    border-color: rgba(147,197,253,.45);
    box-shadow: 0 18px 32px -18px rgba(37,99,235,.55);
    color: var(--ames-tx-white);
}
.ames-tile.pp  { border-top: 3px solid #93c5fd; }
.ames-tile.mnt { border-top: 3px solid #c084fc; }
.ames-tile.rpt { border-top: 3px solid #86efac; }
.ames-tile.md  { border-top: 3px solid #fb923c; }
.ames-tile.sys { border-top: 3px solid #fbbf24; }
.ames-tile-ic { font-size: 36px; line-height: 1; opacity: .9; }
/* 타일 상단행: 아이콘(좌) + sub(우) baseline 정렬 — 세로 높이 축소 */
.ames-tile-top { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.ames-tile-h  { font-family: var(--ames-font-display); font-size: 26px; letter-spacing: 1.5px; }
.ames-tile-sub{ font-family: var(--ames-font-mono); font-size: 12px;
                color: var(--ames-tx-white-a55); letter-spacing: 1px; }

.ames-card {
    background: linear-gradient(180deg, var(--ames-sf-0f1d33-a95), var(--ames-sf-0a1426-a95));
    border: 1px solid var(--ames-bd-white-a06);
    border-radius: 6px;
    padding: 10px 12px;
    margin-bottom: 8px;
    box-shadow: 0 2px 6px -4px rgba(0,0,0,.6);
}
.ames-card-h {
    font-family: var(--ames-font-mono);
    font-size: 13px; letter-spacing: 1.6px;
    color: var(--ames-tx-blue-300); text-transform: uppercase;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--ames-bd-white-a05);
    display: flex; align-items: center;
}

/* ── 공통 탭 모듈 (AmesTabs/AmesTab) ───────────────────────── */
.ames-tabstrip { display: flex; gap: 4px; }
.ames-tab {
    padding: 8px 18px;
    font-family: var(--ames-font-mono);
    font-size: 12px; letter-spacing: 1px; font-weight: 600;
    color: var(--ames-tx-93a4bd);
    background: rgba(255,255,255,.03);
    border: 1px solid var(--ames-bd-white-a06);
    border-bottom: none;
    border-radius: 8px 8px 0 0;
    cursor: pointer;
}
.ames-tab:hover { color: var(--ames-tx-e5edf7); }
.ames-tab.on {
    color: var(--ames-tx-white);
    background: linear-gradient(180deg, var(--ames-sf-0f1d33-a95), var(--ames-sf-0a1426-a95));
    box-shadow: inset 0 -2px 0 #2563eb;
}
.ames-tabpanel {
    background: linear-gradient(180deg, var(--ames-sf-0f1d33-a95), var(--ames-sf-0a1426-a95));
    border: 1px solid var(--ames-bd-white-a06);
    border-radius: 0 12px 12px 12px;
    padding: 3px;
    margin-bottom: 16px;
    box-shadow: 0 4px 12px -8px rgba(0,0,0,.6);
}

/* ── 라벨 필드 (입력 위 라벨) ──────────────────────────────── */
.ames-fld { display: flex; flex-direction: column; gap: 4px; }
.ames-fld > label {
    font-family: var(--ames-font-mono);
    font-size: calc(11px + var(--ames-fs-bump)); font-weight: 700; letter-spacing: .5px;
    text-transform: uppercase; color: var(--ames-tx-93a4bd);
}

/* ── KPI strip ────────────────────────────────────────────── */
.ames-kpis {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px; margin-bottom: 14px;
}
.ames-kpi {
    background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01));
    border: 1px solid var(--ames-bd-white-a08);
    border-radius: 8px;
    padding: 10px 12px;
    position: relative; overflow: hidden;
}
.ames-kpi::before {
    content: ''; position: absolute; left: 0; top: 0;
    width: 3px; height: 100%; background: #93c5fd;
}
.ames-kpi.ok::before   { background: linear-gradient(180deg, #22c55e, #15803d); }
.ames-kpi.warn::before { background: linear-gradient(180deg, #fbbf24, #b45309); }
.ames-kpi.bad::before  { background: linear-gradient(180deg, #fca5a5, #b91c1c); }
.ames-kpi-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
}
.ames-kpi-l { font-family: var(--ames-font-mono); font-size: calc(11px + var(--ames-fs-bump));
              color: var(--ames-tx-blue-300-a85); letter-spacing: 1.4px;
              text-transform: uppercase; }
.ames-kpi-v { font-family: var(--ames-font-display); font-size: 28px;
              color: var(--ames-tx-white); line-height: 1; margin-top: 5px; letter-spacing: 1px; }
.ames-kpi-s { font-size: 12px; color: var(--ames-tx-white-a50); margin-top: 4px;
              font-family: var(--ames-font-mono); }

/* 컴팩트 KPI (화면별 옵션) — 세로 공간 축소 */
.ames-kpis.compact { gap: 10px; margin-bottom: 12px; }
.ames-kpis.compact .ames-kpi { padding: 8px 14px; }
.ames-kpis.compact .ames-kpi-l { font-size: 12px; letter-spacing: 1px; }
.ames-kpis.compact .ames-kpi-v { font-size: 24px; margin-top: 2px; }
.ames-kpis.compact .ames-kpi-s { font-size: 13px; margin-top: 2px; }

/* ── Tables ───────────────────────────────────────────────── */
.ames-table {
    width: 100%; border-collapse: collapse;
    background: transparent;
}
.ames-table th {
    background: rgba(147,197,253,.06);
    color: var(--ames-tx-blue-300); font-family: var(--ames-font-mono);
    font-size: 12px; letter-spacing: 1.2px; text-transform: uppercase;
    padding: 10px 14px; text-align: left;
    border-bottom: 1px solid rgba(147,197,253,.15);
    white-space: nowrap;
}
.ames-table th.num { text-align: right; }
.ames-table td {
    padding: 11px 14px; color: var(--ames-tx-e5edf7); font-size: 16px;
    border-bottom: 1px solid var(--ames-bd-white-a04);
    white-space: nowrap;
}
.ames-table tr:last-child td { border-bottom: none; }
.ames-table tr:hover td { background: rgba(147,197,253,.04); }
.ames-table td.code { font-family: var(--ames-font-mono); color: var(--ames-tx-blue-300); font-weight: 700; }
.ames-table td.num  { font-family: var(--ames-font-mono); text-align: right; color: var(--ames-tx-white); font-weight: 600; }
.ames-table td.dim  { color: var(--ames-tx-white-a50); font-size: 14px;
                      font-family: var(--ames-font-mono); }

.ames-empty {
    padding: 40px; text-align: center;
    color: var(--ames-tx-white-a40); font-size: 16px;
    font-family: var(--ames-font-mono);
}

/* status pills */
.pill { display: inline-block; padding: 2px 8px; border-radius: 6px;
        font-family: var(--ames-font-mono); font-size: 12px;
        letter-spacing: 1px; text-transform: uppercase; }
.pill.ok     { background: rgba(34,197,94,.15);    color: var(--ames-tx-green-300); border: 1px solid rgba(134,239,172,.3); }
.pill.warn   { background: rgba(251,191,36,.14);   color: var(--ames-tx-amber-400); border: 1px solid rgba(251,191,36,.3); }
.pill.bad    { background: rgba(252,165,165,.12);   color: var(--ames-tx-red-300); border: 1px solid rgba(252,165,165,.3); }
.pill.info   { background: rgba(147,197,253,.12);   color: var(--ames-tx-blue-300); border: 1px solid rgba(147,197,253,.3); }
.pill.mute   { background: rgba(148,163,184,.10);   color: var(--ames-tx-slate-400); border: 1px solid rgba(148,163,184,.3); }
.pill.orange { background: rgba(249,115,22,.20);    color: var(--ames-tx-orange-400); border: 1px solid rgba(249,115,22,.5); }
.pill.idle   { background: rgba(148,163,184,.12);   color: var(--ames-tx-slate-300); border: 1px dashed rgba(148,163,184,.4); }
.pill.ghost  { background: transparent;             color: var(--ames-tx-slate-400); border: 1px solid rgba(148,163,184,.4); }
.pill.rt-a   { background: rgba(37,99,235,.14);     color: var(--ames-tx-blue-600); border: 1px solid rgba(37,99,235,.42); }
.pill.rt-b   { background: rgba(234,88,12,.14);      color: var(--ames-tx-orange-600); border: 1px solid rgba(234,88,12,.42); }

/* ── Forms ────────────────────────────────────────────────── */
.ames-form { display: flex; flex-direction: column; gap: 12px; }
.ames-form label { font-family: var(--ames-font-mono); font-size: 13px;
                   color: var(--ames-tx-blue-300); letter-spacing: 1px; text-transform: uppercase; }
.ames-form input, .ames-form select, .ames-form textarea {
    background: var(--ames-sf-050a13); border: 1px solid var(--ames-bd-white-a12);
    color: var(--ames-tx-white); padding: 9px 12px; border-radius: 6px;
    font-family: var(--ames-font-mono); font-size: 16px;
    outline: none; min-width: 220px;
}
.ames-form input:focus, .ames-form select:focus, .ames-form textarea:focus { border-color: #93c5fd; }

.ames-btn {
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
    border: none;
    color: #fff; padding: 10px 22px; border-radius: 8px;
    font-family: var(--ames-font-mono);
    font-size: 14px; font-weight: 700; letter-spacing: 1.5px;
    cursor: pointer; transition: filter .12s, box-shadow .12s;
    box-shadow: 0 4px 12px -6px rgba(37,99,235,.6);
    white-space: nowrap;
}
.ames-btn:hover:not(:disabled) { filter: brightness(1.12); box-shadow: 0 8px 18px -8px rgba(37,99,235,.8); }
.ames-btn:disabled { opacity: .4; cursor: not-allowed; filter: saturate(.5); }
.ames-btn.ghost { background: transparent; border: 1px solid var(--ames-bd-white-a25); color: var(--ames-tx-white-a75); box-shadow: none; }
.ames-btn.ghost:hover:not(:disabled) { background: rgba(255,255,255,.07); color: var(--ames-tx-white); border-color: var(--ames-bd-white-a45); }

.ames-rz-btn {
    font-family: var(--ames-font-mono);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

/* ── Error overlay ────────────────────────────────────────── */
#blazor-error-ui {
    background: #dc2626; color: #fff;
    position: fixed; bottom: 0; left: 0; right: 0;
    padding: 12px 22px; z-index: 9999; display: none;
}
#blazor-error-ui .dismiss { float: right; cursor: pointer; }

/* ╔═════════════════════════════════════════════════════════╗
   ║  AUTH (Login / Register / Forgot) — dark glass card      ║
   ╚═════════════════════════════════════════════════════════╝ */
.ames-auth-page {
    min-height: 100vh; width: 100%;
    background:
        radial-gradient(900px 600px at 10% 0%, rgba(37,99,235,.25), transparent 60%),
        radial-gradient(900px 600px at 100% 100%, rgba(124,58,237,.22), transparent 60%),
        linear-gradient(180deg, #050a13 0%, #060b17 100%);
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    padding: 28px;
    position: relative; overflow: hidden;
}
.ames-auth-bg-grid {
    position: absolute; inset: 0;
    background-image:
        linear-gradient(rgba(147,197,253,.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(147,197,253,.05) 1px, transparent 1px);
    background-size: 56px 56px;
    mask-image: radial-gradient(ellipse at center, #000 30%, transparent 80%);
    pointer-events: none;
}
.ames-auth-card {
    position: relative; z-index: 1;
    width: 100%; max-width: 420px;
    background: linear-gradient(180deg, rgba(15,29,51,.85), rgba(8,15,28,.85));
    border: 1px solid rgba(147,197,253,.2);
    border-radius: 18px;
    padding: 36px 36px 28px;
    box-shadow:
        0 30px 80px -20px rgba(0,0,0,.7),
        0 0 0 1px rgba(147,197,253,.08) inset;
    backdrop-filter: blur(20px);
}
.ames-auth-brand { text-align: center; margin-bottom: 28px; }
.ames-auth-logo {
    font-family: var(--ames-font-display);
    font-size: 58px; letter-spacing: 6px;
    color: #fff; line-height: 1;
    background: linear-gradient(135deg, #93c5fd, #a78bfa);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.ames-auth-sub {
    font-family: var(--ames-font-mono);
    font-size: 12px; letter-spacing: 3px;
    color: rgba(147,197,253,.7);
    margin-top: 8px;
}
.ames-auth-error {
    background: rgba(252,165,165,.1);
    border: 1px solid rgba(252,165,165,.35);
    color: #fca5a5;
    padding: 10px 14px; border-radius: 8px;
    font-size: 14px; margin-bottom: 14px;
    font-family: var(--ames-font-mono);
    letter-spacing: .5px;
}
.ames-auth-form { display: flex; flex-direction: column; gap: 6px; }
.ames-auth-label {
    font-family: var(--ames-font-mono);
    font-size: 12px; letter-spacing: 1.8px;
    color: rgba(147,197,253,.85);
    text-transform: uppercase;
    margin-top: 10px; margin-bottom: 4px;
}
.ames-auth-input {
    width: 100%;
    background: rgba(5,10,19,.7);
    border: 1px solid rgba(147,197,253,.18);
    color: #fff;
    padding: 12px 14px; border-radius: 10px;
    font-family: var(--ames-font-mono);
    font-size: 17px;
    outline: none;
    transition: border-color .15s, box-shadow .15s;
}
.ames-auth-input::placeholder { color: rgba(255,255,255,.3); }
.ames-auth-input:focus {
    border-color: #93c5fd;
    box-shadow: 0 0 0 3px rgba(147,197,253,.15);
}
/* 브라우저가 저장된 비밀번호 등을 채우면(:-webkit-autofill) 밝은 기본 배경을 칠한다 — 카드 배경색과 흰 글자로 덮는다.
   서버가 쿠키로 채운 이메일은 자동완성이 아니라서 비밀번호 칸만 하얗게 보였다. */
.ames-auth-input:-webkit-autofill,
.ames-auth-input:-webkit-autofill:hover,
.ames-auth-input:-webkit-autofill:focus {
    -webkit-text-fill-color: #fff;
    -webkit-box-shadow: 0 0 0 1000px var(--ames-auth-input-fill, #070e19) inset;
    caret-color: #fff;
    transition: background-color 9999s ease-out 0s;
}
.ames-auth-input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px var(--ames-auth-input-fill, #070e19) inset, 0 0 0 3px var(--ames-auth-input-ring, rgba(147,197,253,.15));
}
.ames-auth-vm {
    color: #fca5a5; font-size: 13px;
    font-family: var(--ames-font-mono);
    margin-top: 2px;
}
.ames-auth-remember {
    display: flex; align-items: center; gap: 8px;
    margin-top: 14px;
    font-size: 14px; color: rgba(255,255,255,.65);
    cursor: pointer;
}
.ames-auth-remember input { accent-color: #93c5fd; width: 14px; height: 14px; }
.ames-auth-submit {
    margin-top: 20px;
    width: 100%;
    background: linear-gradient(135deg, #2563eb, #7c3aed);
    border: none;
    color: #fff;
    padding: 13px 16px;
    border-radius: 10px;
    font-family: var(--ames-font-mono);
    font-size: 16px; font-weight: 700; letter-spacing: 2px;
    cursor: pointer;
    transition: transform .1s, box-shadow .15s;
    box-shadow: 0 10px 28px -10px rgba(124,58,237,.7);
}
.ames-auth-submit:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 32px -10px rgba(124,58,237,.85);
}
.ames-auth-hint {
    margin-top: 18px;
    padding: 10px 14px;
    background: rgba(147,197,253,.06);
    border: 1px dashed rgba(147,197,253,.22);
    border-radius: 8px;
    font-size: 13px; color: rgba(255,255,255,.6);
    text-align: center;
}
.ames-auth-hint code {
    font-family: var(--ames-font-mono);
    color: #93c5fd;
    background: rgba(0,0,0,.3);
    padding: 1px 5px; border-radius: 4px;
    font-size: 13px;
}
.ames-auth-meta {
    margin-top: 14px; text-align: center;
    display: flex; align-items: center; justify-content: center; gap: 8px;
    font-size: 13px; color: rgba(255,255,255,.5);
    font-family: var(--ames-font-mono);
}
.ames-auth-meta a { color: rgba(147,197,253,.85); }
.ames-auth-meta a:hover { color: #fff; }
.ames-auth-foot {
    margin-top: 22px;
    font-family: var(--ames-font-mono);
    font-size: 12px; letter-spacing: 3px;
    color: rgba(255,255,255,.35);
    text-align: center;
    z-index: 1;
}

/* ── Modal ────────────────────────────────────────────────────── */
.ames-modal-bg {
    position: fixed; inset: 0; background: rgba(0,0,0,.65);
    display: flex; align-items: center; justify-content: center; z-index: 1000;
    padding: 20px;
}
.ames-modal {
    background: var(--ames-sf-0d1b2e); border: 1px solid var(--ames-bd-white-a12);
    border-radius: 10px; padding: 28px 32px; min-width: 400px; max-width: 640px;
    width: 100%; display: flex; flex-direction: column; gap: 10px;
    max-height: calc(100vh - 40px); overflow-y: auto;
}
.ames-modal.ames-modal-wide { max-width: 800px; }
.ames-modal.ames-modal-fullwide { max-width: 1400px; }
.ames-modal-h {
    font-family: var(--ames-font-mono); font-size: 16px;
    color: var(--ames-tx-blue-300); letter-spacing: 1px; text-transform: uppercase;
    margin-bottom: 6px; border-bottom: 1px solid var(--ames-bd-white-a08); padding-bottom: 10px;
}
.ames-modal label {
    font-family: var(--ames-font-mono); font-size: 12px;
    color: var(--ames-tx-slate-500); letter-spacing: 1px; text-transform: uppercase; margin-bottom: -4px;
}
.ames-modal-footer {
    display: flex; justify-content: flex-end; gap: 8px; margin-top: 10px;
    border-top: 1px solid var(--ames-bd-white-a08); padding-top: 14px;
}
.ames-input {
    background: var(--ames-sf-050a13); border: 1px solid var(--ames-bd-white-a12);
    color: var(--ames-tx-white); padding: 9px 12px; border-radius: 6px;
    font-size: 16px; width: 100%; box-sizing: border-box;
}
.ames-input:focus { outline: none; border-color: #3b82f6; }
select.ames-input {
    padding: 9px 12px; font-size: 16px;
    cursor: pointer; appearance: auto;
}
select.ames-input option { background: var(--ames-sf-0d1b2e); }

.ames-rz-modal-label {
    font-family: var(--ames-font-mono);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.2px;
    line-height: 0.9;
    padding: 0;
    margin-bottom: 1px;
    display: inline-block;
    flex-shrink: 0;
    width:120px;
}
.ames-rz-input {
    background: var(--ames-sf-050a13);
    font-family: var(--ames-font-mono);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.5px;
}
select.ames-rz-input {
    padding: 0;
    font-size: 12px;
    cursor: pointer;
    appearance: auto;
}

/* ── Alert bar ────────────────────────────────────────────────── */
.ames-alert {
    padding: 10px 14px; border-radius: 6px; font-size: 16px; margin: 6px 0;
}
.ames-alert.ok  { background: rgba(34,197,94,.12);  color: var(--ames-tx-green-300); border: 1px solid rgba(134,239,172,.25); }
.ames-alert.bad { background: rgba(239,68,68,.12);  color: var(--ames-tx-red-300); border: 1px solid rgba(252,165,165,.25); }

/* ── Button variants ──────────────────────────────────────────── */
/* ok  = 조회 · 확인 (teal)  */
.ames-btn.ok  { background: linear-gradient(135deg, #0d9488, #0f766e); box-shadow: 0 4px 12px -6px rgba(13,148,136,.55); }
.ames-btn.ok:hover:not(:disabled)  { box-shadow: 0 8px 18px -8px rgba(13,148,136,.8); }
/* bad = 삭제 · 위험 (red)   */
.ames-btn.bad { background: linear-gradient(135deg, #dc2626, #b91c1c); box-shadow: 0 4px 12px -6px rgba(220,38,38,.55); }
.ames-btn.bad:hover:not(:disabled) { box-shadow: 0 8px 18px -8px rgba(220,38,38,.8); }
/* warn= 경고성 액션 (amber) */
.ames-btn.warn{ background: linear-gradient(135deg, #d97706, #b45309); color: #fff; box-shadow: 0 4px 12px -6px rgba(217,119,6,.55); }
.ames-btn.warn:hover:not(:disabled){ box-shadow: 0 8px 18px -8px rgba(217,119,6,.8); }

/* ── Clickable table row ─────────────────────────────────────── */
.ames-row-link { cursor: pointer; }
.ames-row-link:hover td,
.ames-row-link:hover .rz-data-cell { background: rgba(99,179,237,.08) !important; }
.ames-row-selected td,
.ames-row-selected .rz-data-cell   { background: rgba(99,179,237,.15) !important; }
/* 재고 부족 행(현재고 < 안전재고) — 예비품 MD-026·MNT-008. 호버보다 우선 */
.ames-row-low td,
.ames-row-low .rz-data-cell        { background: rgba(220,53,69,.14) !important; }
.ames-row-low:hover td,
.ames-row-low:hover .rz-data-cell  { background: rgba(220,53,69,.22) !important; }

/* ── RadzenDataGrid — AMES 스타일 (humanistic-dark-base.css 위에 덮어씀) ── */

/* 1. 외부 컨테이너 */
.ames-rz-grid { background: transparent !important; }

/* 2. 테이블 구조 복원
   humanistic-dark-base.css가 반응형을 위해 table→block, tr→block, td→block으로 변경함.
   데스크탑에서 정상 table 레이아웃으로 복원한다. */
.ames-rz-grid .rz-data-grid-data > table {
    display: table !important;
    table-layout: auto !important;
    width: 100% !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    background: transparent !important;
}
.ames-rz-grid .rz-data-grid-data > table > tbody { display: table-row-group !important; }
.ames-rz-grid .rz-data-row                       { display: table-row !important; }
.ames-rz-grid .rz-data-row > td                  { display: table-cell !important; width: auto !important; }

/* 3. 헤더 — th는 sticky라 반투명이면 세로 스크롤 시 행이 밑으로 비친다.
   불투명 배경 위에 기존 파란 틴트를 합성한다. */
.ames-rz-grid thead th {
    background: linear-gradient(rgba(147,197,253,.06), rgba(147,197,253,.06)), var(--ames-frozen-bg) !important;
}
.ames-rz-grid .rz-column-header {
    background: rgba(147,197,253,.06) !important;
    color: var(--ames-tx-blue-300) !important;
    font-family: var(--ames-font-mono) !important;
    font-size: 12px !important; letter-spacing: 1.2px !important; text-transform: uppercase !important;
    padding: 10px 14px !important; white-space: nowrap !important;
    border: none !important; border-bottom: 1px solid rgba(147,197,253,.15) !important;
    text-align: left !important;
}
.ames-rz-grid .rz-column-header-content { display: flex !important; align-items: center !important; gap: 4px !important; }
.ames-rz-grid .rz-column-title          { display: inline !important; color: var(--ames-tx-blue-300) !important; }
.ames-rz-grid .rz-sortable-column-icon  { color: var(--ames-tx-blue-300-a35) !important; font-size: 14px !important; }
.ames-rz-grid .rz-state-active.rz-column-header { background: rgba(147,197,253,.12) !important; }

/* MD/SYS·PP·MNT·RPT·외부 포탈 화면: RadzenDataGrid 헤더는 데이터 정렬(컬럼 TextAlign)과 무관하게 항상 가운데.
   Radzen은 .rz-column-title(inline-flex)의 justify-content 로 헤더를 정렬하는데,
   이 프로젝트가 .rz-column-title 을 display:inline 으로 덮으므로 여기서 inline-flex+center 로 복원한다. */
.ames-sec-md  .ames-rz-grid thead th,
.ames-sec-sys .ames-rz-grid thead th,
.ames-sec-pp  .ames-rz-grid thead th,
.ames-sec-mnt .ames-rz-grid thead th,
.ames-sec-rpt .ames-rz-grid thead th,
.ames-sec-portal .ames-rz-grid thead th,
.ames-sec-md  .ames-rz-grid .rz-column-header,
.ames-sec-sys .ames-rz-grid .rz-column-header,
.ames-sec-pp  .ames-rz-grid .rz-column-header,
.ames-sec-mnt .ames-rz-grid .rz-column-header,
.ames-sec-rpt .ames-rz-grid .rz-column-header,
.ames-sec-portal .ames-rz-grid .rz-column-header { text-align: center !important; }
.ames-sec-md  .ames-rz-grid .rz-column-title,
.ames-sec-sys .ames-rz-grid .rz-column-title,
.ames-sec-pp  .ames-rz-grid .rz-column-title,
.ames-sec-mnt .ames-rz-grid .rz-column-title,
.ames-sec-rpt .ames-rz-grid .rz-column-title,
.ames-sec-portal .ames-rz-grid .rz-column-title {
    display: inline-flex !important;
    justify-content: center !important;
    width: 100% !important;
    text-align: center !important;
    padding-inline-start: 0 !important;
}
/* MD/SYS 헤더 좌우 여백 — 위 .rz-column-header 의 padding 은 Radzen 11 에서 그 클래스가 없어져 먹지 않는다.
   여백이 0 이면 열이 글자폭까지 줄었을 때 헤더끼리 붙는다. */
.ames-sec-md  .ames-rz-grid thead th > div,
.ames-sec-sys .ames-rz-grid thead th > div { padding-inline: 8px !important; }

/* 4. 데이터 셀 */
.ames-rz-grid .rz-data-cell {
    padding: 11px 14px !important; color: var(--ames-tx-e5edf7) !important; font-size: 16px !important;
    border: none !important; border-bottom: 1px solid var(--ames-bd-white-a04) !important;
    white-space: nowrap !important; vertical-align: middle !important; background: transparent !important;
}
.ames-rz-grid .rz-cell-data { padding: 0 !important; margin: 0 !important; color: inherit !important; background: transparent !important; }
.ames-rz-grid .rz-data-row:last-child .rz-data-cell { border-bottom: none !important; }
.ames-rz-grid .rz-data-cell.rz-text-align-right     { text-align: right !important; }

/* 셀 내 AMES 클래스 */
.ames-rz-grid .rz-data-cell .code {
    font-family: var(--ames-font-mono); color: var(--ames-tx-blue-300); font-weight: 700;
}
.ames-rz-grid .rz-data-cell .dim {
    color: var(--ames-tx-white-a50); font-size: 14px; font-family: var(--ames-font-mono);
}

/* 5. 행 hover */
.ames-rz-grid .rz-state-highlight .rz-data-cell  { background: rgba(99,179,237,.08) !important; }
.ames-row-link:hover .rz-data-cell                { background: rgba(99,179,237,.08) !important; }

/* 5b. 고정(Frozen) 컬럼 — Radzen 기본 배경이 반투명(rgba(255,255,255,.02))이라
   가로 스크롤 시 뒤 컬럼이 비쳐 보인다. 그리드가 놓인 배경과 같은 톤의 불투명 배경을
   깔고, 반투명 강조색은 그 위에 겹친다. Radzen 11은 td/th에 rz-frozen-cell만 붙는다
   (rz-data-cell·rz-column-header 아님 — 헤더 틴트는 th 안쪽 div가 덮는다). */
.ames-rz-grid { --ames-frozen-bg: #060b17; }                /* 본문 배경 위 그리드 */
.ames-tabpanel .ames-rz-grid,
.ames-card .ames-rz-grid { --ames-frozen-bg: #0c182b; }     /* 탭 패널·카드 안 그리드 */

/* box-shadow: 테이블이 auto 레이아웃이라 실제 렌더 폭이 선언 폭(=sticky 오프셋 계산 기준)보다
   좁아질 수 있고, 그 오차만큼 고정 셀 사이에 틈이 생겨 뒤 컬럼이 비친다.
   배경을 왼쪽으로 12px 연장해 틈을 덮는다 (왼쪽은 항상 고정 셀 영역이라 안전). */
.ames-rz-grid td.rz-frozen-cell {
    background: var(--ames-frozen-bg) !important;
    box-shadow: -12px 0 0 var(--ames-frozen-bg) !important;
}
.ames-rz-grid th.rz-frozen-cell {
    /* 일반 헤더와 같은 틴트 합성 배경 (3. 헤더 참조) */
    background: linear-gradient(rgba(147,197,253,.06), rgba(147,197,253,.06)), var(--ames-frozen-bg) !important;
    box-shadow: -12px 0 0 var(--ames-frozen-bg) !important;
}
/* 마지막이 아닌 고정 셀은 오른쪽으로도 연장 — 소수 DPI 배율에서 다음 고정 셀의
   배경/그림자 래스터 경계가 서브픽셀로 어긋나며 생기는 실선 이음새를 뒤에서 받친다 */
.ames-rz-grid td.rz-frozen-cell:not(.rz-frozen-cell-left-end),
.ames-rz-grid th.rz-frozen-cell:not(.rz-frozen-cell-left-end) {
    box-shadow: -12px 0 0 var(--ames-frozen-bg), 12px 0 0 var(--ames-frozen-bg) !important;
}
/* 마지막 고정 셀은 Radzen의 우측 경계 그림자를 유지하며 병합 */
.ames-rz-grid td.rz-frozen-cell-left-end,
.ames-rz-grid th.rz-frozen-cell-left-end {
    box-shadow: -12px 0 0 var(--ames-frozen-bg), 5px 0 5px -5px rgba(0,0,0,.12) !important;
}
/* 고정 셀 sticky 오프셋은 js/frozen-columns.js가 실제 렌더 폭 기준으로 재계산한다
   (Radzen의 선언 폭 기반 인라인 오프셋은 auto 레이아웃 실제 폭과 어긋나 틈 발생). */
.ames-rz-grid tr.rz-state-highlight td.rz-frozen-cell,
.ames-row-link:hover td.rz-frozen-cell {
    background: linear-gradient(rgba(99,179,237,.08), rgba(99,179,237,.08)), var(--ames-frozen-bg) !important;
    box-shadow: -12px 0 0 color-mix(in srgb, rgb(99,179,237) 8%, var(--ames-frozen-bg)) !important;
}
.ames-rz-grid tr.rz-state-highlight td.rz-frozen-cell:not(.rz-frozen-cell-left-end),
.ames-row-link:hover td.rz-frozen-cell:not(.rz-frozen-cell-left-end) {
    box-shadow: -12px 0 0 color-mix(in srgb, rgb(99,179,237) 8%, var(--ames-frozen-bg)),
                12px 0 0 color-mix(in srgb, rgb(99,179,237) 8%, var(--ames-frozen-bg)) !important;
}
.ames-rz-grid tr.rz-state-highlight td.rz-frozen-cell-left-end,
.ames-row-link:hover td.rz-frozen-cell-left-end {
    box-shadow: -12px 0 0 color-mix(in srgb, rgb(99,179,237) 8%, var(--ames-frozen-bg)),
                5px 0 5px -5px rgba(0,0,0,.12) !important;
}
.ames-row-selected td.rz-frozen-cell {
    background: linear-gradient(rgba(99,179,237,.15), rgba(99,179,237,.15)), var(--ames-frozen-bg) !important;
    box-shadow: -12px 0 0 color-mix(in srgb, rgb(99,179,237) 15%, var(--ames-frozen-bg)) !important;
}

/* 6. 페이저 — Material Symbols 폰트가 humanistic-dark-base.css에서 로드됨 */
.ames-rz-grid .rz-pager {
    background: transparent !important;
    border-color: var(--ames-bd-white-a06) !important;
    padding: 8px 14px !important;
    gap: 4px !important;
}
.ames-rz-grid .rz-pager-pages { gap: 4px !important; }
.ames-rz-grid .rz-pager-element {
    background: transparent !important;
    color: var(--ames-tx-blue-300) !important;
    border: 1px solid rgba(147,197,253,.22) !important;
    border-radius: 6px !important;
    min-width: 32px !important; height: 30px !important; padding: 0 8px !important;
    font-size: 13px !important;
}
.ames-rz-grid .rz-pager-element:hover:not([disabled]) {
    background: rgba(147,197,253,.08) !important;
    color: var(--ames-tx-white) !important;
    border-color: rgba(147,197,253,.4) !important;
}
.ames-rz-grid .rz-pager-page.rz-state-active,
.ames-rz-grid .rz-pager-element.rz-state-active {
    background: rgba(147,197,253,.15) !important;
    color: var(--ames-tx-white) !important;
    border-color: rgba(147,197,253,.6) !important;
}
.ames-rz-grid .rz-pager-element[disabled] { opacity: .35 !important; }
/* Material Symbols 아이콘 색상 */
.ames-rz-grid .rz-pager .rzi { color: var(--ames-tx-blue-300) !important; font-size: 18px !important; }
/* 페이지 요약 텍스트 */
.ames-rz-grid .rz-pager-summary {
    color: var(--ames-tx-white-a40) !important; font-size: 13px !important;
    white-space: nowrap !important;
}
/* PageSize 드롭다운 (PageSizeOptions 사용 시) */
.ames-rz-grid .rz-pager .rz-dropdown {
    background: var(--ames-sf-0f1b2e) !important; border-color: rgba(147,197,253,.2) !important;
    color: var(--ames-tx-blue-300) !important; font-size: 13px !important;
}
.ames-rz-grid .rz-pager .rz-dropdown .rz-dropdown-trigger { color: var(--ames-tx-blue-300) !important; }

/* ── User detail grid inside modal ──────────────────────────── */
.ames-detail-grid {
    display: grid;
    grid-template-columns: 110px 1fr;
    gap: 8px 12px;
    margin: 12px 0 16px;
    font-size: 0.88em;
}
.ames-detail-label {
    color: var(--ames-tx-slate-500);
    font-size: 0.8em;
    letter-spacing: .04em;
    text-transform: uppercase;
    padding-top: 2px;
}

/* ── Audit detail modal ─────────────────────────────────────── */
.audit-section-label {
    font-size: 13px; font-weight: 700; letter-spacing: 1.1px;
    text-transform: uppercase; color: #475569;
    border-bottom: 1px solid var(--ames-bd-white-a06);
    padding-bottom: 5px; margin-top: 6px;
}
.audit-detail-grid {
    display: grid; grid-template-columns: 1fr 1fr;
    gap: 10px 20px; margin-top: 8px;
}
.audit-kv { display: flex; flex-direction: column; gap: 3px; }
.audit-kv-l {
    font-size: 13px; color: var(--ames-tx-slate-500);
    text-transform: uppercase; letter-spacing: .06em;
}
.audit-kv-v { font-size: 14px; color: var(--ames-tx-e5edf7); }

/* ── FullCalendar PP-CAL dark theme ─────────────────────────── */
#pp-cal-fc { background: transparent; }
#pp-cal-fc .fc { color: var(--ames-tx-slate-200); }
#pp-cal-fc .fc-theme-standard td,
#pp-cal-fc .fc-theme-standard th,
#pp-cal-fc .fc-theme-standard .fc-scrollgrid { border-color: var(--ames-bd-white-a10); }
#pp-cal-fc .fc-col-header-cell-cushion { color: var(--ames-tx-blue-300); font-size: 12px; letter-spacing:.04em; }
#pp-cal-fc .fc-daygrid-day-number { color: var(--ames-tx-slate-400); font-size: 12px; }
#pp-cal-fc .fc-day-today { background: rgba(59,130,246,.08) !important; }
#pp-cal-fc .fc-daygrid-day:hover { background: rgba(255,255,255,.03); }
#pp-cal-fc .fc-button-primary {
    background: rgba(59,130,246,.12); border-color: rgba(59,130,246,.3);
    color: var(--ames-tx-blue-300); font-size: 12px; padding: 4px 12px;
}
#pp-cal-fc .fc-button-primary:hover { background: rgba(59,130,246,.22); border-color: rgba(59,130,246,.5); }
#pp-cal-fc .fc-button-primary:not(:disabled).fc-button-active { background: rgba(59,130,246,.35); }
#pp-cal-fc .fc-button-primary:disabled { opacity: .45; }
#pp-cal-fc .fc-toolbar-title { color: var(--ames-tx-white); font-size: 16px; letter-spacing:.02em; }
#pp-cal-fc .fc-event { border: none !important; border-radius: 3px; font-size: calc(11px + var(--ames-fs-bump)); cursor: pointer; }
#pp-cal-fc .fc-event-title { padding: 1px 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#pp-cal-fc .fc-more-link { color: var(--ames-tx-blue-300); font-size: calc(11px + var(--ames-fs-bump)); }
#pp-cal-fc .fc-popover { background: var(--ames-sf-0d1b2e); border: 1px solid var(--ames-bd-white-a15); border-radius: 8px; }
#pp-cal-fc .fc-popover-header { background: rgba(59,130,246,.15); color: var(--ames-tx-blue-300); border-radius: 8px 8px 0 0; }
#pp-cal-fc .fc-timegrid-slot { height: 32px; }
#pp-cal-fc .fc-timegrid-slot-label-cushion { color: var(--ames-tx-slate-500); font-size: calc(11px + var(--ames-fs-bump)); }

/* ── Line picker (multi-select checkboxes) ───────────────────── */
.ames-line-picker {
    display: flex;
    flex-direction: column;
    gap: 4px;
    max-height: 160px;
    overflow-y: auto;
    padding: 8px 10px;
    background: rgba(255,255,255,.04);
    border: 1px solid var(--ames-bd-white-a10);
    border-radius: 6px;
    margin-bottom: 4px;
}
.ames-line-item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85em;
    cursor: pointer;
    padding: 2px 0;
}
.ames-line-item input[type="checkbox"] {
    accent-color: #60a5fa;
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}

/* ── Calendar view tabs ──────────────────────────────────────── */
.ames-cal-tabs {
    display: flex;
    align-items: center;
    gap: 0;
    margin-bottom: 16px;
}
.ames-cal-tab {
    padding: 9px 24px;
    font-family: var(--ames-font-mono);
    font-size: 13px; letter-spacing: 1.2px; text-transform: uppercase;
    color: var(--ames-tx-white-a50);
    border: 1px solid var(--ames-bd-white-a08);
    background: rgba(255,255,255,.02);
    cursor: pointer;
    transition: background .12s, color .12s;
}
.ames-cal-tab-group {
    display: flex;
}
.ames-cal-tab:first-child {
    border-radius: 8px 0 0 8px;
}
.ames-cal-tab:last-child {
    border-radius: 0 8px 8px 0;
    overflow: hidden;
}
.ames-cal-tab.active {
    background: rgba(147,197,253,.15);
    color: var(--ames-tx-blue-300);
    border-color: rgba(147,197,253,.35);
}
.ames-cal-tab:hover:not(.active) { background: rgba(255,255,255,.05); color: var(--ames-tx-white-a80); }

/* ── Monthly calendar grid ───────────────────────────────────── */
.ames-cal-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 3px;
    margin-top: 4px;
}
.ames-cal-head {
    padding: 8px 6px;
    text-align: center;
    font-family: var(--ames-font-mono);
    font-size: 12px; letter-spacing: .8px;
    color: var(--ames-tx-blue-300-a65);
    border-bottom: 1px solid var(--ames-bd-white-a06);
    margin-bottom: 2px;
}
.ames-cal-head.sun { color: var(--ames-tx-red-300-a80); }
.ames-cal-head.sat { color: var(--ames-tx-blue-400-a80); }

.ames-cal-cell {
    min-height: 166px;  /* SYS 캘린더 일별 높이 = 92px 의 180% (PP·MNT 달력은 .pp-wo-grid 로 92px 유지) */
    padding: 7px 9px 6px;
    background: rgba(255,255,255,.02);
    border: 1px solid var(--ames-bd-white-a04);
    border-radius: 7px;
    display: flex; flex-direction: column; gap: 3px;
    cursor: default;
    transition: background .12s, border-color .12s;
}
.ames-cal-cell--empty {
    background: transparent !important;
    border-color: transparent !important;
    cursor: default !important;
}
.ames-cal-cell--data { cursor: pointer; }
.ames-cal-cell--data:hover {
    background: rgba(147,197,253,.07);
    border-color: rgba(147,197,253,.22);
}
.ames-cal-cell--today {
    border-color: rgba(147,197,253,.45) !important;
    background: rgba(147,197,253,.06) !important;
}
.ames-cal-cell--holiday {
    background: rgba(252,165,165,.04);
    border-color: rgba(252,165,165,.12);
}
.ames-cal-cell--holiday.ames-cal-cell--data:hover {
    background: rgba(252,165,165,.1);
    border-color: rgba(252,165,165,.3);
}
.ames-cal-cell--weekend {
    background: rgba(251,191,36,.03);
    border-color: rgba(251,191,36,.08);
}

.ames-cal-daynum {
    font-family: var(--ames-font-mono);
    font-size: 14px; font-weight: 700;
    color: var(--ames-tx-slate-300);
    display: flex; align-items: center; gap: 5px;
}
.ames-cal-daynum.sun { color: var(--ames-tx-red-300); }
.ames-cal-daynum.sat { color: var(--ames-tx-blue-300); }
.ames-cal-today-dot {
    width: 6px; height: 6px;
    border-radius: 50%;
    background: #93c5fd;
    display: inline-block;
    box-shadow: 0 0 6px rgba(147,197,253,.8);
}

/* 인라인 경고 배지 (품목 미등록·지연 등) — 셀 안에서 통째로 유지, 중간 줄바꿈 금지 */
.badge-bad {
    display: inline-block;
    white-space: nowrap;
    margin-left: 6px;
    font-size: calc(10px + var(--ames-fs-bump)); letter-spacing: .5px; font-weight: 600;
    padding: 1px 6px; border-radius: 4px;
    background: rgba(239,68,68,.15);
    color: var(--ames-tx-red-400);
}

.ames-cal-badge {
    display: inline-block;
    font-family: var(--ames-font-mono);
    font-size: calc(10px + var(--ames-fs-bump)); letter-spacing: .5px;
    padding: 1px 6px; border-radius: 4px;
    text-transform: uppercase;
    width: fit-content;
}
.ames-cal-badge--holiday { background: rgba(252,165,165,.15); color: var(--ames-tx-red-300); }
.ames-cal-badge--weekend { background: rgba(251,191,36,.12); color: var(--ames-tx-amber-400); }

.ames-cal-hname {
    font-size: calc(11px + var(--ames-fs-bump));
    color: var(--ames-tx-red-300-a85);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

.ames-cal-shifts {
    display: flex; gap: 4px;
    margin-top: auto; padding-top: 4px;
}
.ames-cal-sh {
    display: inline-flex; align-items: center; justify-content: center;
    width: 20px; height: 20px;
    border-radius: 50%;
    font-family: var(--ames-font-mono);
    font-size: calc(10px + var(--ames-fs-bump)); font-weight: 700;
}
.ames-cal-sh.sh-off { background: rgba(255,255,255,.05); color: var(--ames-tx-white-a20); }
.ames-cal-sh.sh-a   { background: rgba(52,211,153,.18); color: var(--ames-tx-emerald-400); border: 1px solid rgba(52,211,153,.35); }
.ames-cal-sh.sh-b   { background: rgba(96,165,250,.18); color: var(--ames-tx-blue-400); border: 1px solid rgba(96,165,250,.35); }
.ames-cal-sh.sh-c   { background: rgba(244,114,182,.18); color: var(--ames-tx-pink-400); border: 1px solid rgba(244,114,182,.35); }

.ames-cal-legend {
    display: flex; align-items: center; gap: 8px;
    padding: 12px 4px 0;
    font-family: var(--ames-font-mono);
    font-size: 12px; color: var(--ames-tx-white-a45);
    border-top: 1px solid var(--ames-bd-white-a05);
    margin-top: 10px; flex-wrap: wrap;
}

/* ── PP-LSB Gantt Board ──────────────────────────────────────── */
.pp-gantt-wrap  { overflow-x: hidden; position: relative; border-radius: 6px; }
.pp-gantt-inner { position: relative; width: 100%; padding: 0 20px; box-sizing: border-box; }
.pp-gantt-ruler {
    height: 26px; position: relative;
    border-bottom: 1px solid var(--ames-bd-white-a08);
    user-select: none;
}
.pp-gantt-tick {
    position: absolute; bottom: 3px;
    font-family: var(--ames-font-mono); font-size: calc(10px + var(--ames-fs-bump));
    color: #475569; transform: translateX(-50%); white-space: nowrap;
}
.pp-gantt-tick.major { color: var(--ames-tx-slate-500); }
.pp-gantt-gridline {
    position: absolute; top: 0; height: 100%; width: 1px;
    background: rgba(255,255,255,.05);
}
.pp-gantt-gridline.major { background: rgba(255,255,255,.09); }
.pp-gantt-row {
    position: relative; overflow: hidden;
    border-bottom: 1px solid var(--ames-bd-white-a04);
}
.pp-gantt-row-lbl {
    position: absolute; left: 4px; top: 50%; transform: translateY(-50%);
    font-family: var(--ames-font-mono); font-size: calc(9px + var(--ames-fs-bump));
    color: #334155; pointer-events: none; z-index: 2; white-space: nowrap;
}
/* band types */
.pp-gantt-band {
    position: absolute; top: 5px; height: calc(100% - 10px);
    border-radius: 4px; display: flex; flex-direction: column;
    align-items: flex-start; justify-content: center;
    padding: 0 6px; overflow: hidden; white-space: nowrap;
    font-family: var(--ames-font-mono); font-size: calc(10px + var(--ames-fs-bump));
    box-sizing: border-box; cursor: pointer;
    transition: filter .15s;
}
.pp-gantt-band:hover { filter: brightness(1.35); }
/* 밴드 색 = Pp/LineSchedule.razor 의 SegColor 팔레트와 동일 (bg=color+22, border=color+88, text=color) */
.pp-gantt-band--work  { background: #86efac22; border: 1px solid #86efac88; color: var(--ames-tx-green-300); }
.pp-gantt-band--down  { background: #fca5a522; border: 1px solid #fca5a588; color: var(--ames-tx-red-300); }
.pp-gantt-band--break { background: #fde68a22; border: 1px solid #fde68a88; color: var(--ames-tx-amber-200); }
.pp-gantt-band--meal  { background: #93c5fd22; border: 1px solid #93c5fd88; color: var(--ames-tx-blue-300); }
.pp-gantt-band--idle  { background: #cbd5e122; border: 1px dashed #cbd5e188; color: var(--ames-tx-slate-300); }
.pp-gantt-band--inspect { background: #22d3ee22; border: 1px solid #22d3ee88; color: var(--ames-tx-cyan-400); }
.pp-gantt-band--pm    { background: #fdba7422; border: 1px solid #fdba7488; color: var(--ames-tx-orange-300); }
/* WO slots */
.pp-gantt-wo {
    position: absolute; top: 4px; height: calc(100% - 8px);
    border-radius: 4px; display: flex; flex-direction: column;
    justify-content: center; padding: 0 6px; overflow: hidden; white-space: nowrap;
    font-family: var(--ames-font-mono); font-size: calc(10px + var(--ames-fs-bump)); box-sizing: border-box;
    cursor: pointer; transition: filter .15s;
    background: rgba(168,85,247,.26); border: 1px solid rgba(168,85,247,.6); color: var(--ames-tx-purple-300);
}
.pp-gantt-wo:hover { filter: brightness(1.3); }
.pp-gantt-wo.sel      { box-shadow: 0 0 0 2px rgba(147,197,253,.75); }
.pp-gantt-wo.conflict { border-color: #ef4444; box-shadow: 0 0 0 1px rgba(239,68,68,.6) inset; }
/* PM(예방보전) 밴드 오버레이 — WO와 같은 레인, 주황 계열 */
.pp-gantt-pm {
    position: absolute; top: 4px; height: calc(100% - 8px);
    border-radius: 4px; display: flex; flex-direction: column;
    justify-content: center; padding: 0 6px; overflow: hidden; white-space: nowrap;
    font-family: var(--ames-font-mono); font-size: calc(10px + var(--ames-fs-bump)); box-sizing: border-box;
    cursor: pointer; transition: filter .15s;
    background: rgba(251,146,60,.26); border: 1px solid rgba(251,146,60,.6); color: var(--ames-tx-orange-300);
}
.pp-gantt-pm:hover    { filter: brightness(1.3); }
.pp-gantt-pm.sel      { box-shadow: 0 0 0 2px rgba(147,197,253,.75); }
.pp-gantt-pm.conflict { border-color: #ef4444; box-shadow: 0 0 0 1px rgba(239,68,68,.6) inset; }
/* 금형 교체(MC) 블록 — WO 레인, 보라. 편집 가능(.editable)할 때만 클릭 */
.pp-gantt-mc {
    position: absolute; border-radius: 4px; display: flex; flex-direction: column;
    justify-content: center; padding: 0 6px; overflow: hidden; white-space: nowrap;
    font-family: var(--ames-font-mono); font-size: calc(10px + var(--ames-fs-bump)); box-sizing: border-box; cursor: default;
    background: rgba(167,139,250,.28); border: 1px dashed rgba(167,139,250,.7); color: var(--ames-tx-violet-300);
    transition: filter .15s;
}
.pp-gantt-mc.editable       { cursor: pointer; }
.pp-gantt-mc.editable:hover { filter: brightness(1.3); }
.pp-gantt-mc.sel            { box-shadow: 0 0 0 2px rgba(147,197,253,.75); }
/* block labels (band · WO 공통) */
.pp-blk-t { font-weight: 600; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.pp-blk-s { font-size: calc(9px + var(--ames-fs-bump)); opacity: .72; margin-top: 2px;
            max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
/* NOW marker */
.pp-gantt-now {
    position: absolute; top: 0; bottom: 0; width: 2px; z-index: 5;
    background: #ef4444; pointer-events: none;
}
.pp-gantt-now::after {
    content: 'NOW'; position: absolute; top: 1px; left: 3px;
    font-family: var(--ames-font-mono); font-size: calc(8px + var(--ames-fs-bump));
    letter-spacing: .5px; color: var(--ames-tx-red-300);
}
/* timeline header + legend */
.pp-tl-h {
    display: flex; justify-content: space-between; align-items: center;
    flex-wrap: wrap; gap: 8px; padding: 10px 14px 6px;
}
.pp-tl-t {
    font-family: var(--ames-font-mono); font-size: 12px;
    color: var(--ames-tx-blue-300); letter-spacing: .6px;
}
.pp-tl-legend { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.pp-lgd {
    display: inline-flex; align-items: center; gap: 5px;
    font-family: var(--ames-font-mono); font-size: calc(10px + var(--ames-fs-bump));
    color: var(--ames-tx-white-a55); white-space: nowrap;
}
.pp-lgd i { width: 10px; height: 10px; border-radius: 2px; display: inline-block; }
/* drag surface */
.pp-gantt-drag {
    position: absolute; inset: 0; cursor: crosshair; z-index: 10;
    border: 1px dashed rgba(59,130,246,.35); border-radius: 4px;
    background: rgba(59,130,246,.02);
}

/* ── PP-CAL: WO chips inside calendar cells ─────────────────── */
.ames-cal-wo {
    display: block; font-size: calc(10px + var(--ames-fs-bump)); line-height: 1.45;
    padding: 2px 5px; border-radius: 3px; margin-top: 3px;
    cursor: pointer; white-space: nowrap;
    overflow: hidden; text-overflow: ellipsis;
    font-family: var(--ames-font-mono);
    opacity: .88; transition: opacity .12s, transform .1s;
}
.ames-cal-wo:hover { opacity: 1; transform: translateX(2px); }
.ames-cal-wo.wo-overdue { background: rgba(185,28,28,.22);  color: var(--ames-tx-red-300); border-left: 2px solid #b91c1c; }
.ames-cal-wo.wo-d3      { background: rgba(239,68,68,.18);  color: var(--ames-tx-red-300); border-left: 2px solid #ef4444; }
.ames-cal-wo.wo-prog    { background: rgba(34,197,94,.14);  color: var(--ames-tx-green-300); border-left: 2px solid #22c55e; }
.ames-cal-wo.wo-rta     { background: rgba(37,99,235,.16); color: var(--ames-tx-blue-600); border-left: 2px solid #2563eb; }
.ames-cal-wo.wo-rtb     { background: rgba(234,88,12,.16); color: var(--ames-tx-orange-600); border-left: 2px solid #ea580c; }
.ames-cal-wo.wo-rel     { background: rgba(124,58,237,.14); color: var(--ames-tx-violet-300); border-left: 2px solid #7c3aed; }
.ames-cal-wo.wo-draft   { background: rgba(107,114,128,.1); color: var(--ames-tx-gray-400); border-left: 2px solid #6b7280; }
.ames-cal-wo-more {
    display: block; font-size: calc(10px + var(--ames-fs-bump)); color: var(--ames-tx-blue-300); cursor: pointer;
    padding: 1px 5px; margin-top: 3px;
    font-family: var(--ames-font-mono);
}
.ames-cal-wo-more:hover { text-decoration: underline; color: var(--ames-tx-blue-200); }
/* override base cell min-height for WO calendar */
.ames-cal-grid.pp-wo-grid .ames-cal-cell { min-height: 166px; }   /* PP 캘린더·MNT PM 일정 = 92px 의 180% */
/* 화면 채움 달력(.ames-cal-fill — MNT-005·010 PM 일정, PP-CAL 월·주 탭) — 목록 화면(.ames-grid-fixed)과 같이 콘텐츠를 화면 높이로 세우고
   달력 카드(탭 화면은 탭 패널까지)가 남은 높이를 채워, 카드 바닥이 설비 카드 목록과 같은 자리에 온다. 탭은 활성 탭만 렌더되므로 패널 체인에 걸어도 된다.
   월 달력: 주 행 = 남은 높이 ÷ 주 수(--cal-weeks, 5~6), 화면이 낮으면 110px 까지 줄고 그 아래로는 페이지가 스크롤된다.
   주 목록(.ames-cal-weeklist): 7일 행이 남은 높이를 나눠 갖는다(최소 44px). */
.ames-content:has(.ames-cal-fill) { display: flex; flex-direction: column; height: 100%; box-sizing: border-box; min-height: 0; padding-bottom: 6px; }
.ames-content:has(.ames-cal-fill) :is(.ames-card, .ames-tabpanel):has(.ames-cal-fill) { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; }
.ames-content:has(.ames-cal-fill) .ames-tabpanel:has(.ames-cal-fill) { margin-bottom: 8px; }
.ames-cal-grid.ames-cal-fill { flex: 1 1 auto; min-height: 0; grid-template-rows: auto repeat(var(--cal-weeks, 5), minmax(110px, 1fr)); }
.ames-cal-grid.ames-cal-fill .ames-cal-cell { min-height: 0; overflow: hidden; }
.ames-cal-weeklist.ames-cal-fill { flex: 1 1 auto; min-height: 0; display: grid; grid-template-rows: repeat(7, minmax(44px, 1fr)); gap: 5px; margin-top: 6px; }
.ames-cal-weeklist.ames-cal-fill > div { min-height: 0; }

/* ── PP-CAL: week view ───────────────────────────────────────── */
.ames-cal-week-cols {
    display: grid; grid-template-columns: repeat(7, 1fr);
    gap: 6px; margin-top: 6px;
}
.ames-cal-week-day {
    min-height: 200px; padding: 8px 7px;
    border: 1px solid var(--ames-bd-white-a07); border-radius: 6px;
    background: rgba(255,255,255,.01);
}
.ames-cal-week-day.wk-today {
    border-color: rgba(147,197,253,.45);
    background: rgba(147,197,253,.06);
}
.ames-cal-week-day.wk-weekend {
    background: rgba(251,191,36,.02);
    border-color: rgba(251,191,36,.08);
}
.ames-cal-week-hdr {
    font-family: var(--ames-font-mono);
    font-size: calc(10px + var(--ames-fs-bump)); color: var(--ames-tx-slate-500); text-transform: uppercase;
    letter-spacing: .05em; margin-bottom: 2px;
}
.ames-cal-week-hdr.sun { color: var(--ames-tx-red-300-a70); }
.ames-cal-week-hdr.sat { color: var(--ames-tx-blue-400-a70); }
.ames-cal-week-num {
    font-family: var(--ames-font-mono);
    font-size: 20px; font-weight: 700; color: var(--ames-tx-slate-200);
    display: flex; align-items: center; gap: 5px; margin-bottom: 5px;
}
.ames-cal-week-num.sun { color: var(--ames-tx-red-300); }
.ames-cal-week-num.sat { color: var(--ames-tx-blue-300); }
.ames-cal-week-num .ames-cal-today-dot { flex-shrink: 0; }

/* ── MD master-data: clickable list-card items ───────────────── */
.ames-list-item {
    padding: 9px 12px;
    border-bottom: 1px solid var(--ames-bd-white-a04);
    cursor: pointer;
    transition: background .1s;
}
.ames-list-item:hover     { background: rgba(99,179,237,.07); }
.ames-list-item.selected  { background: rgba(99,179,237,.16); border-left: 2px solid #60a5fa; padding-left: 10px; }
.ames-list-item:last-child{ border-bottom: none; }

/* ── MD master-data: selected-item info header bar ───────────── */
.ames-info-bar {
    background: var(--ames-sf-16243b-a80);
    border: 1px solid rgba(71,85,105,.4);
    border-radius: 8px;
    padding: 10px 14px;
    margin-bottom: 10px;
    flex-shrink: 0;
}

/* ── Inline delete confirmation bar ─────────────────────────── */
.ames-delete-confirm {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 12px;
    padding: 10px 14px;
    background: rgba(239,68,68,.1);
    border: 1px solid rgba(239,68,68,.3);
    border-radius: 6px;
    font-size: 0.88em;
    color: var(--ames-tx-red-300);
}

/* ── PP-OEE Line OEE dashboard ──────────────────────────────────── */
.pp-oee-mono { font-family: var(--ames-font-mono); }
.pp-oee-kpis { grid-template-columns: repeat(5, 1fr); }
.ames-kpi.pp-oee-kpi-a::before { background: linear-gradient(180deg, #60a5fa, #2563eb); }
.ames-kpi.pp-oee-kpi-p::before { background: linear-gradient(180deg, #c4b5fd, #7c3aed); }
.ames-kpi.pp-oee-kpi-q::before { background: linear-gradient(180deg, #67e8f9, #0891b2); }

/* 공통 트랙/필 */
.pp-oee-track {
    flex: 1; height: 10px; min-width: 46px;
    background: rgba(255,255,255,.07); border-radius: 5px; overflow: hidden;
}
.pp-oee-track i { display: block; height: 100%; border-radius: 5px; transition: width .35s cubic-bezier(.4,0,.2,1); }
.pp-oee-fill-a { background: #2563eb; }
.pp-oee-fill-p { background: #7c3aed; }
.pp-oee-fill-q { background: #0891b2; }

/* 라인 테이블 A/P/Q */
.pp-oee-apq { display: flex; align-items: center; gap: 6px; }
.pp-oee-apq-val { font-family: var(--ames-font-mono); font-size: calc(10px + var(--ames-fs-bump)); font-weight: 800; width: 46px; text-align: right; flex-shrink: 0; }

/* OEE 등급 필 */
.pp-oee-pill { display: inline-block; font-family: var(--ames-font-mono); font-size: 12px; font-weight: 900; padding: 3px 10px; border-radius: 11px; }
.pp-oee-pill.wc { background: rgba(5,150,105,.22);  color: var(--ames-tx-emerald-300); }
.pp-oee-pill.ok { background: rgba(217,119,6,.22);  color: var(--ames-tx-amber-300); }
.pp-oee-pill.lo { background: rgba(220,38,38,.22);  color: var(--ames-tx-red-300); }

/* 손실 · 구성 2단 */
.pp-oee-grid2 { display: grid; grid-template-columns: 1.35fr 1fr; gap: 8px; margin-bottom: 8px; }
@media (max-width: 960px) { .pp-oee-grid2 { grid-template-columns: 1fr; } .pp-oee-kpis { grid-template-columns: repeat(2, 1fr); } }

.pp-oee-loss-row  { display: flex; align-items: center; gap: 8px; padding: 6px 0; border-bottom: 1px dashed var(--ames-bd-white-a07); }
.pp-oee-loss-name { font-size: calc(11px + var(--ames-fs-bump)); width: 118px; flex-shrink: 0; }
.pp-oee-loss-cat  { font-size: calc(8px + var(--ames-fs-bump)); color: var(--ames-tx-slate-400); }
.pp-oee-loss-track { height: 14px; border-radius: 3px; }
.pp-oee-loss-track i { border-radius: 3px; }
.pp-oee-loss-val  { font-family: var(--ames-font-mono); font-size: calc(10px + var(--ames-fs-bump)); font-weight: 800; width: 64px; text-align: right; }

.pp-oee-donut-wrap { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 6px 0 2px; }
.pp-oee-donut-wrap.wc { color: var(--ames-tx-emerald-300); }
.pp-oee-donut-wrap.ok { color: var(--ames-tx-amber-300); }
.pp-oee-donut-wrap.lo { color: var(--ames-tx-red-300); }
.pp-oee-donut-track { stroke: rgba(255,255,255,.08); }
.pp-oee-comp { margin-top: 12px; }
.pp-oee-comp-row { margin-bottom: 9px; }
.pp-oee-comp-h { display: flex; justify-content: space-between; font-size: calc(10px + var(--ames-fs-bump)); margin-bottom: 3px; }
.pp-oee-comp-h b { font-family: var(--ames-font-mono); }
.pp-oee-comp-track { height: 13px; border-radius: 4px; }

/* 드릴다운 */
.pp-oee-chart-wrap { width: 100%; overflow: hidden; }
.pp-oee-calc { display: grid; grid-template-columns: 170px 1fr; gap: 16px; align-items: start; }
.pp-oee-dot { display: inline-block; width: 9px; height: 9px; border-radius: 2px; margin-right: 4px; vertical-align: middle; }
@media (max-width: 640px) { .pp-oee-calc { grid-template-columns: 1fr; } }

/* ── PP-ODM Downtime Monitor ────────────────────────────────────────── */

/* 경보 배너 */
.odm-alert-banner {
    display: flex; flex-wrap: wrap; align-items: center; gap: .5rem;
    background: rgba(239,68,68,.1); border: 1px solid rgba(239,68,68,.32);
    border-radius: 8px; padding: .6rem 1rem;
    margin-bottom: 1.25rem; font-size: .88rem;
}
.odm-alert-chip {
    background: rgba(239,68,68,.2); border: 1px solid rgba(239,68,68,.38);
    color: var(--ames-tx-red-300); border-radius: 5px; padding: 1px 10px;
    font-size: .8rem; cursor: pointer; font-family: var(--ames-font-mono);
}
.odm-alert-chip:hover { background: rgba(239,68,68,.32); }

/* 라인 카드 그리드 */
.odm-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 1rem; margin-bottom: .5rem;
}
.odm-card {
    background: rgba(255,255,255,.04);
    border: 1px solid var(--ames-bd-white-a07);
    border-radius: 10px; padding: .9rem 1rem;
    display: flex; flex-direction: column; gap: .6rem;
}
.odm-card-alert {
    border-color: rgba(239,68,68,.4);
    box-shadow: 0 0 0 1px rgba(239,68,68,.14) inset;
}

/* 카드 상단 행 */
.odm-card-top {
    display: flex; align-items: center; gap: .5rem; flex-wrap: wrap;
}
.odm-line-id {
    font-family: var(--ames-font-mono);
    font-size: .95rem; font-weight: 700; color: var(--ames-tx-e5edf7);
}
.odm-badge {
    border-radius: 4px; padding: 2px 8px;
    font-size: .72rem; font-weight: 600;
}
.odm-badge-work    { background: rgba(34,197,94,.18);  color: var(--ames-tx-green-400); }
.odm-badge-unplan  { background: rgba(239,68,68,.18);  color: var(--ames-tx-red-400); }
.odm-badge-plan    { background: rgba(148,163,184,.12);color: var(--ames-tx-slate-400); }
.odm-badge-break   { background: rgba(202,138,4,.15);  color: var(--ames-tx-amber-400); }
.odm-badge-unknown { background: rgba(255,255,255,.06);color: var(--ames-tx-slate-500); }
.odm-plan-label    { font-size: .72rem; margin-left: auto; }

/* 경과 시간 */
.odm-elapsed      { font-size: .95rem; font-weight: 600; display: flex; align-items: center; gap: .4rem; }
.odm-elapsed-ok   { color: var(--ames-tx-green-400); }
.odm-elapsed-bad  { color: var(--ames-tx-red-400); }
.odm-blink {
    background: rgba(239,68,68,.18); color: var(--ames-tx-red-300);
    border-radius: 4px; padding: 1px 7px; font-size: .7rem; font-weight: 500;
    animation: odm-blink 1.2s ease-in-out infinite;
}
@keyframes odm-blink { 0%,100%{opacity:1} 50%{opacity:.35} }

/* 60분 타임라인 */
.odm-tl-wrap {
    display: flex; height: 16px;
    border-radius: 3px; overflow: hidden;
    border: 1px solid var(--ames-bd-white-a07);
}
.odm-tl-seg      { flex: 1; }
.odm-tl-work     { background: rgba(34,197,94,.75); }
.odm-tl-unplan   { background: rgba(239,68,68,.82); }
.odm-tl-break    { background: rgba(202,138,4,.5); }
.odm-tl-plan     { background: rgba(148,163,184,.2); }
.odm-tl-empty    { background: rgba(255,255,255,.03); }
.odm-tl-axis {
    display: flex; justify-content: space-between;
    font-size: .62rem; color: #475569; margin-top: 1px;
}

/* 오늘 누적 통계 행 */
.odm-day-stats {
    display: flex; gap: 1rem; font-size: .78rem; color: var(--ames-tx-slate-400);
}
.odm-day-stats .ok  { color: var(--ames-tx-green-400); }
.odm-day-stats .bad { color: var(--ames-tx-red-400); }

/* 비가동 이력 테이블 — 사유 미입력 강조 */
.odm-row-no-reason td { background: rgba(251,191,36,.04); }
.odm-row-no-reason td:first-child { border-left: 2px solid rgba(251,191,36,.5); }

/* 사유 수정 모달 */
.odm-edit-info {
    background: rgba(255,255,255,.04); border-radius: 6px;
    padding: .5rem .75rem; font-size: .85rem;
    color: var(--ames-tx-slate-300); margin-bottom: .9rem;
}
/* ── Pager ──────────────────────────────────────────────────────────── */
.ames-pager {
    display: flex; align-items: center; justify-content: center; gap: 4px;
    padding: 10px 16px; border-top: 1px solid var(--ames-bd-white-a06);
}
.ames-pager-btn {
    min-width: 30px; height: 28px; padding: 0 6px;
    border-radius: 5px; border: 1px solid var(--ames-bd-white-a15);
    background: rgba(255,255,255,.04); color: var(--ames-tx-white-a70);
    cursor: pointer; font-size: .82rem; transition: background .15s;
}
.ames-pager-btn:hover:not(:disabled) {
    background: rgba(37,99,235,.25); border-color: rgba(37,99,235,.5); color: var(--ames-tx-white);
}
.ames-pager-btn:disabled { opacity: .3; cursor: not-allowed; }
.ames-pager-btn.active {
    background: linear-gradient(135deg,#2563eb,#1d4ed8);
    border-color: transparent; color: #fff; font-weight: 700;
}
.ames-pager-info {
    margin-left: 8px; font-size: .78rem; color: var(--ames-tx-white-a40);
}
.ames-pager-size {
    margin-left: 8px; height: 28px; padding: 0 6px;
    border-radius: 5px; border: 1px solid var(--ames-bd-white-a15);
    background: rgba(255,255,255,.04); color: var(--ames-tx-white-a70);
    font-size: .82rem; cursor: pointer;
}
.ames-pager-size option { background: var(--ames-sf-1e293b); color: var(--ames-tx-white); }

.ames-form-row {
    display: flex; align-items: center; gap: .75rem; margin-bottom: .65rem;
}
/* ── SYS-010 실시간 서버 정보 (Server & Service Status / Resource Utilization) ── */
.sh-grid-2 {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    gap: 16px; align-items: stretch;
}
.sh-svc-row {
    display: flex; align-items: center; justify-content: space-between;
    gap: 10px; padding: 10px 0;
    border-bottom: 1px solid var(--ames-bd-white-a06);
}
.sh-svc-row:last-child { border-bottom: none; }
.sh-svc-left { display: flex; align-items: center; gap: 10px; min-width: 0; }
.sh-svc-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.sh-svc-dot.ok   { background: #22c55e; box-shadow: 0 0 6px rgba(34,197,94,.7); }
.sh-svc-dot.warn { background: #fbbf24; box-shadow: 0 0 6px rgba(251,191,36,.7); }
.sh-svc-dot.bad  { background: #f87171; box-shadow: 0 0 6px rgba(248,113,113,.7); }
.sh-svc-text { min-width: 0; }
.sh-svc-name { font-size: 14px; color: var(--ames-tx-e5edf7); font-weight: 600; }
.sh-svc-meta { font-size: calc(11px + var(--ames-fs-bump)); color: var(--ames-tx-white-a45);
               font-family: var(--ames-font-mono); margin-top: 2px; }

.ames-form-row label {
    width: 72px; font-size: .78rem; color: var(--ames-tx-slate-400); flex-shrink: 0;
}

/* -- Warehouse web screens -- */
.wh-modal-wide {
    width: min(920px, calc(100vw - 48px));
}

.wh-slip-layout {
    display: grid;
    grid-template-columns: minmax(520px, 1.05fr) minmax(460px, .95fr);
    gap: 14px;
    align-items: start;
}

.wh-slip-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.wh-slip-check {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--ames-tx-slate-300);
    font-size: 12px;
}

.wh-slip-detail-card {
    position: sticky;
    top: 78px;
}

.wh-slip-meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    padding: 12px;
    border-bottom: 1px solid var(--ames-bd-white-a08);
}

.wh-slip-meta div {
    min-width: 0;
    padding: 8px 10px;
    border: 1px solid rgba(148,163,184,.18);
    border-radius: 6px;
    background: rgba(15,23,42,.44);
}

.wh-slip-meta span {
    display: block;
    color: var(--ames-tx-slate-400);
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.wh-slip-meta b {
    display: block;
    color: var(--ames-tx-e5edf7);
    font-size: .86rem;
    margin-top: 3px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.wh-slip-lines {
    margin: 0 12px 12px;
}

.wh-slip-create-modal {
    max-width: 980px;
}

.wh-slip-note {
    padding: 10px 12px;
    margin-bottom: 10px;
    border: 1px solid rgba(59,130,246,.28);
    border-radius: 6px;
    background: rgba(59,130,246,.10);
    color: var(--ames-tx-blue-200);
    font-size: .78rem;
    line-height: 1.45;
}

.wh-slip-form-grid {
    grid-template-columns: repeat(4, minmax(150px, 1fr));
}

.wh-slip-line-editor {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) 160px auto;
    gap: 10px;
    align-items: end;
    margin-top: 12px;
}

.wh-slip-draft-list {
    margin-top: 12px;
    border: 1px solid rgba(148,163,184,.18);
    border-radius: 6px;
    overflow: hidden;
}

.wh-slip-draft-row {
    display: grid;
    grid-template-columns: 150px minmax(160px, 1fr) 90px 42px;
    align-items: center;
    gap: 10px;
    padding: 9px 10px;
    border-bottom: 1px solid rgba(148,163,184,.14);
    color: var(--ames-tx-e5edf7);
}

.wh-slip-draft-row:last-child {
    border-bottom: 0;
}

.wh-slip-draft-row b {
    text-align: right;
}

.wh-print-modal-bg {
    align-items: flex-start;
    overflow: auto;
    padding: 32px 18px;
}

.wh-print-modal {
    width: min(1080px, calc(100vw - 36px));
    max-width: 1080px;
}

.wh-print-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}

.wh-print-paper {
    width: 900px;
    min-height: 1040px;
    margin: 12px auto 0;
    padding: 0;
    background: #fff;
    color: #000;
    font-family: Arial, Helvetica, sans-serif;
    box-shadow: 0 18px 48px rgba(0,0,0,.38);
}

.wh-print-title {
    border: 2px solid #111;
    border-bottom: 0;
    background: #bfbfbf;
    color: #000;
    text-align: center;
    font-size: 46px;
    line-height: 1.18;
    font-weight: 800;
}

.wh-print-head {
    display: grid;
    grid-template-columns: 1fr 238px;
    border: 2px solid #111;
    min-height: 140px;
}

.wh-print-info {
    padding: 18px;
    font-size: 17px;
    line-height: 1.55;
}

.wh-print-barcode-box {
    border-left: 2px solid #111;
    padding: 14px 12px;
    font-size: 16px;
}

.wh-code128 {
    height: 82px;
    margin-top: 10px;
    border-left: 5px solid #000;
    border-right: 5px solid #000;
}

.wh-print-table {
    width: 100%;
    margin-top: 16px;
    border-collapse: collapse;
    table-layout: fixed;
    color: #000;
    font-size: 14px;
}

.wh-print-table th,
.wh-print-table td {
    border: 1.5px solid #111;
    padding: 5px 6px;
    vertical-align: middle;
    line-height: 1.1;
}

.wh-print-table th {
    background: #bfbfbf;
    text-align: center;
    font-weight: 700;
}

.wh-print-table th:nth-child(1) { width: 42px; }
.wh-print-table th:nth-child(2) { width: 150px; }
.wh-print-table th:nth-child(3) { width: 250px; }
.wh-print-table th:nth-child(4) { width: 95px; }

.wh-print-table td:first-child,
.wh-print-table .num {
    text-align: right;
}

@media (max-width: 1100px) {
    .wh-slip-layout {
        grid-template-columns: 1fr;
    }

    .wh-slip-detail-card {
        position: static;
    }

    .wh-slip-form-grid,
    .wh-slip-line-editor {
        grid-template-columns: 1fr 1fr;
    }
}

@media print {
    body * {
        visibility: hidden !important;
    }

    #wh-print-paper,
    #wh-print-paper * {
        visibility: visible !important;
    }

    #wh-print-paper {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        min-height: 0;
        margin: 0;
        box-shadow: none;
    }
}

.wh-form-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(150px, 1fr));
    gap: 10px 12px;
}

.wh-check {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 34px;
    color: var(--ames-tx-slate-300);
    cursor: pointer;
}

.wh-setting-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 92px;
    padding: 4px 9px;
    border: 1px solid;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .04em;
    box-shadow: 0 8px 18px rgba(15,23,42,.22);
}

.wh-shortage-text {
    color: var(--ames-tx-orange-500);
    font-weight: 800;
}

.wh-setting-cell {
    display: flex;
    align-items: center;
    justify-content: center;
}

.wh-setting-btn {
    width: 34px;
    min-width: 34px;
    height: 32px;
    padding: 0;
}

.wh-setting-modal {
    width: min(420px, calc(100vw - 32px));
    max-width: 420px;
    overflow-x: hidden;
}

.wh-setting-modal-title {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.wh-setting-modal-title span {
    color: var(--ames-tx-slate-400);
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.wh-setting-modal-title strong {
    color: var(--ames-tx-slate-50);
    font-family: var(--ames-font-mono);
    font-size: 1rem;
}

.wh-setting-form {
    grid-template-columns: repeat(2, minmax(130px, 1fr));
}

@media (max-width: 520px) {
    .wh-setting-form {
        grid-template-columns: minmax(0, 1fr);
    }
}

.wh-pick-workspace {
    display: grid;
    grid-template-columns: minmax(420px, .95fr) minmax(520px, 1.05fr);
    gap: 12px;
    align-items: start;
}

.wh-pick-card-head {
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

.wh-pick-form {
    display: grid;
    grid-template-columns: 150px minmax(220px, 1fr) minmax(150px, .7fr);
    gap: 10px;
    margin-bottom: 12px;
}

.wh-pick-section-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    color: var(--ames-tx-blue-300);
    font-family: var(--ames-font-mono);
    font-size: calc(11px + var(--ames-fs-bump));
    font-weight: 800;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    margin: 8px 0;
}

.wh-pick-candidate-grid {
    margin-bottom: 12px;
}

.wh-pick-split {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    max-height: 340px;
    overflow-y: auto;
    border: 1px solid rgba(148, 163, 184, .16);
    border-radius: 6px;
}

.wh-pick-split-scroll {
    min-width: 0;
    overflow-x: auto;
}

.wh-pick-split-table {
    min-width: 860px;
    width: 100%;
    table-layout: auto;
}

.wh-pick-split-table th,
.wh-pick-split-table td {
    height: 46px;
    vertical-align: middle;
}

.wh-pick-split-table th {
    height: 42px;
}

.wh-pick-action-rail {
    background: var(--ames-sf-0c182b);
    border-left: 1px solid rgba(147, 197, 253, .22);
}

.wh-pick-action-head,
.wh-pick-action-row {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

.wh-pick-action-head {
    height: 42px;
    color: var(--ames-tx-blue-300);
    font-family: var(--ames-font-mono);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    background: rgba(147, 197, 253, .06);
    border-bottom: 1px solid rgba(147, 197, 253, .15);
}

.wh-pick-action-row {
    height: 46px;
    border-bottom: 1px solid var(--ames-bd-white-a04);
}

.wh-pick-add-rail { width: 88px; }
.wh-pick-remove-rail { width: 112px; }

.wh-pick-action-rail .rz-button { min-width: 66px; }
.wh-pick-remove-rail .rz-button { min-width: 94px; }

.wh-pick-qty-input {
    width: 78px;
    min-width: 70px;
}

.wh-pick-selected {
    border: 1px solid rgba(148, 163, 184, .16);
    border-radius: 6px;
    padding: 8px;
    background: rgba(15, 23, 42, .28);
}

.wh-pick-selected-table {
    min-width: 760px;
}

.wh-slip-print-area {
    margin: 14px auto 0;
    max-width: 980px;
}

.wh-slip-paper {
    background: #fff;
    color: #000;
    width: min(920px, 100%);
    margin: 0 auto;
    padding: 28px 34px 42px;
    border-radius: 3px;
    box-shadow: 0 18px 38px -24px rgba(0, 0, 0, .65);
    font-family: Arial, Helvetica, sans-serif;
}

.wh-slip-title {
    border: 2px solid #111;
    border-bottom: 0;
    background: #c9c9c9;
    color: #000;
    font-size: 36px;
    line-height: 1.15;
    font-weight: 800;
    text-align: center;
    padding: 6px 10px 4px;
}

.wh-slip-head {
    display: grid;
    grid-template-columns: 1fr 240px;
    border: 2px solid #111;
    margin-bottom: 14px;
    min-height: 112px;
}

.wh-slip-paper .wh-slip-meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    padding: 14px 16px;
    font-size: 14px;
    line-height: 1.65;
    border: 0;
    background: #fff;
}

.wh-slip-paper .wh-slip-meta div {
    min-width: 0;
    padding: 9px 11px;
    border: 1px solid #9ca3af;
    border-radius: 4px;
    background: #eef2f7;
    color: #111827;
}

.wh-slip-paper .wh-slip-meta span {
    display: inline-block;
    min-width: 92px;
    color: #334155;
    font-size: calc(11px + var(--ames-fs-bump));
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.wh-slip-barcode-box {
    border-left: 2px solid #111;
    padding: 12px 12px 10px;
    font-size: 13px;
}

.wh-slip-barcode {
    display: block;
    width: 100%;
    height: 66px;
    margin-top: 8px;
}

.wh-slip-barcode rect {
    fill: #000;
}

.location-label-modal {
    width: min(560px, calc(100vw - 32px));
}

.location-code-print-cell {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-width: 0;
}

.location-code-print-cell .code {
    min-width: 0;
    overflow-wrap: anywhere;
}

.location-code-print-btn.rz-button {
    flex: 0 0 32px;
    width: 32px;
    min-width: 32px;
    height: 30px;
    padding: 0 !important;
}

.location-barcode-picker-modal {
    width: min(520px, calc(100vw - 32px));
}

.location-barcode-picker-body {
    display: grid;
    gap: 8px;
    padding: 18px 20px 6px;
}

.location-label-preview {
    padding: 18px;
    border: 1px solid rgba(148, 163, 184, .18);
    border-radius: 6px;
    background: rgba(15, 23, 42, .55);
}

.location-label-print-area {
    display: flex;
    justify-content: center;
}

.location-label-paper {
    width: 100mm;
    min-height: 60mm;
    padding: 6mm 7mm 5mm;
    border: 1px solid #111;
    background: #fff;
    color: #000;
    font-family: Arial, Helvetica, sans-serif;
    text-align: center;
}

.location-label-caption {
    font-size: calc(10px + var(--ames-fs-bump));
    font-weight: 800;
    letter-spacing: 1.6px;
}

.location-label-code {
    margin-top: 2px;
    font-size: 25px;
    line-height: 1.1;
    font-weight: 900;
    overflow-wrap: anywhere;
}

.location-label-barcode {
    display: block;
    width: 100%;
    height: 24mm;
    margin: 4mm 0 1mm;
}

.location-label-barcode rect {
    fill: #000;
}

.location-label-readable {
    font-family: 'Courier New', monospace;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: 1px;
}

.location-label-name {
    margin-top: 2mm;
    font-size: 12px;
    font-weight: 700;
}

.location-label-path {
    display: flex;
    justify-content: center;
    gap: 3mm;
    margin-top: 2mm;
    font-size: calc(9px + var(--ames-fs-bump));
    color: #333;
}

.location-label-path span + span::before {
    content: "/";
    margin-right: 3mm;
    color: #777;
}

.wh-slip-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    font-size: 12px;
}

.wh-slip-table th,
.wh-slip-table td {
    border: 1.5px solid #111;
    padding: 5px 6px;
    line-height: 1.08;
    vertical-align: middle;
}

.wh-slip-table th {
    background: #bfbfbf;
    color: #000;
    text-align: center;
    font-weight: 700;
}

.wh-slip-table td.num {
    text-align: right;
}

@media (max-width: 1180px) {
    .wh-pick-workspace {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media print {
    body * {
        visibility: hidden !important;
    }

    .wh-slip-print-area,
    .wh-slip-print-area * {
        visibility: visible !important;
    }

    .wh-slip-print-area {
        position: absolute;
        inset: 0 auto auto 0;
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 0;
        background: #fff;
    }

    .wh-slip-paper {
        width: 100%;
        box-shadow: none;
        border-radius: 0;
        padding: 18mm 12mm;
    }

    .location-label-print-area,
    .location-label-print-area * {
        visibility: visible !important;
    }

    .location-label-print-area {
        position: absolute;
        inset: 0 auto auto 0;
        width: 100mm;
        margin: 0;
        padding: 0;
        background: #fff;
    }

    .location-label-paper {
        width: 100mm;
        min-height: 60mm;
        border: 0;
    }
}

.wh-map-legend {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 0 14px 12px;
    color: var(--ames-tx-slate-400);
    font-size: .76rem;
}

.wh-map-legend span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.wh-map-legend i {
    width: 10px;
    height: 10px;
    border-radius: 3px;
    display: inline-block;
}

.wh-map-legend .empty { background: rgba(148,163,184,.18); border: 1px solid rgba(148,163,184,.28); }
.wh-map-legend .stocked { background: rgba(34,197,94,.2); border: 1px solid rgba(74,222,128,.45); }
.wh-map-legend .mixed { background: rgba(251,191,36,.18); border: 1px solid rgba(251,191,36,.45); }
.wh-map-legend .selected { background: transparent; border: 2px solid #60a5fa; }

.wh-map-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.wh-map-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 14px 12px;
    color: var(--ames-tx-slate-400);
    font-size: .76rem;
}

.wh-map-breadcrumb button {
    border: 1px solid rgba(148,163,184,.24);
    border-radius: 999px;
    background: rgba(15,23,42,.54);
    color: #cbd5e1;
    padding: 5px 10px;
    font-weight: 800;
    cursor: pointer;
}

.wh-map-breadcrumb button.on {
    border-color: rgba(56,189,248,.62);
    background: rgba(14,165,233,.16);
    color: var(--ames-tx-slate-50);
}

.wh-map-breadcrumb button:disabled {
    opacity: .48;
    cursor: default;
}

.wh-locations-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.wh-factory-plan {
    position: relative;
    min-width: 420px;
    min-height: 320px;
    max-width: none;
    margin: 0 14px 16px;
    border: 1px solid rgba(148,163,184,.24);
    border-radius: 12px;
    overflow: hidden;
    background:
        linear-gradient(90deg, rgba(14,165,233,.08) 1px, transparent 1px),
        linear-gradient(0deg, rgba(14,165,233,.08) 1px, transparent 1px),
        linear-gradient(135deg, var(--ames-sf-0f172a-a98), var(--ames-sf-1e293b-a92));
    background-size: 44px 44px, 44px 44px, auto;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.035);
    touch-action: none;
}

.wh-location-placement-plan {
    resize: none;
}

.wh-location-grid-plan {
    min-width: 0;
    min-height: 420px;
    overflow: auto;
    background:
        linear-gradient(135deg, var(--ames-sf-0f172a-a98), var(--ames-sf-111827-a95));
    touch-action: pan-x pan-y;
}

.wh-location-grid-plan::before,
.wh-location-grid-plan::after {
    display: none;
}

.wh-location-grid-stage {
    position: relative;
    z-index: 2;
    width: 100%;
    min-height: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 14px;
}

.wh-location-grid-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border: 1px solid rgba(125,211,252,.22);
    border-radius: 10px;
    background: var(--ames-sf-0f172a-a78);
    color: var(--ames-tx-e5edf7);
}

.wh-location-grid-head div {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.wh-location-grid-head strong {
    color: var(--ames-tx-slate-50);
    font-size: .92rem;
}

.wh-location-grid-head span {
    color: var(--ames-tx-blue-300);
    font-size: .76rem;
    font-weight: 800;
}

.wh-map-empty-state {
    position: absolute;
    inset: 84px 24px 24px;
    z-index: 2;
    display: grid;
    place-content: center;
    gap: 6px;
    border: 1px dashed rgba(125,211,252,.28);
    border-radius: 12px;
    color: var(--ames-tx-slate-300);
    text-align: center;
    background: rgba(15,23,42,.34);
}

.wh-map-empty-state strong {
    color: var(--ames-tx-slate-50);
    font-size: .98rem;
}

.wh-map-empty-state span {
    color: var(--ames-tx-slate-400);
    font-size: .78rem;
}

.wh-factory-plan::before,
.wh-factory-plan::after {
    content: "";
    position: absolute;
    pointer-events: none;
}

.wh-factory-plan::before {
    left: 0;
    right: 0;
    top: 49%;
    height: 42px;
    border-block: 1px dashed rgba(125,211,252,.24);
    background: rgba(15,23,42,.36);
}

.wh-factory-plan::after {
    top: 0;
    bottom: 0;
    left: 50%;
    width: 44px;
    border-inline: 1px dashed rgba(125,211,252,.22);
    background: rgba(15,23,42,.28);
}

.wh-factory-label {
    position: absolute;
    z-index: 1;
    padding: 5px 9px;
    border-radius: 999px;
    border: 1px solid rgba(148,163,184,.25);
    background: var(--ames-sf-0f172a-a72);
    color: var(--ames-tx-slate-300);
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.wh-factory-label-receiving { left: 16px; top: 14px; }
.wh-factory-label-production { left: 50%; top: 50%; transform: translate(-50%, -50%); }
.wh-factory-label-shipping { right: 16px; bottom: 14px; }

.wh-area-block {
    position: absolute;
    z-index: 2;
    min-width: 120px;
    min-height: 96px;
    border-radius: 12px;
    padding: 12px;
    border: 1px solid rgba(148,163,184,.32);
    color: var(--ames-tx-e5edf7);
    background: var(--ames-sf-0f172a-a88);
    box-shadow: 0 18px 40px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.05);
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    text-align: left;
    transition: border-color .15s ease, transform .15s ease, background .15s ease;
    user-select: none;
    touch-action: none;
}

.wh-area-block:hover {
    transform: translateY(-1px);
    border-color: rgba(147,197,253,.72);
}

.wh-area-block.dragging,
.wh-area-block.resizing {
    transform: none;
    transition: none;
    z-index: 5;
}

.wh-area-block.dragging {
    cursor: grabbing;
}

.wh-area-block.resizing {
    cursor: nwse-resize;
}

.wh-area-block.selected {
    border-color: #60a5fa;
    box-shadow: 0 0 0 2px rgba(96,165,250,.25), 0 18px 42px rgba(0,0,0,.28);
}

.wh-area-block.empty { background: var(--ames-sf-1e293b-a88); }
.wh-area-block.stocked { background: linear-gradient(135deg, rgba(21,128,61,.72), var(--ames-sf-0f172a-a90)); border-color: rgba(74,222,128,.58); }
.wh-area-block.mixed { background: linear-gradient(135deg, rgba(180,83,9,.72), var(--ames-sf-0f172a-a90)); border-color: rgba(251,191,36,.62); }

.wh-factory-area-card {
    min-width: 150px;
    min-height: 96px;
    justify-content: center;
    gap: 8px;
    padding-right: 36px;
}

.wh-factory-area-card .wh-area-code {
    font-size: 1.08rem;
}

.wh-factory-area-card .wh-area-name {
    font-size: .82rem;
    color: var(--ames-tx-blue-100);
}

.wh-map-readonly .wh-area-resize-handle {
    display: none;
}

.wh-map-readonly .wh-area-block {
    cursor: pointer;
}

.wh-map-editable .wh-area-block {
    cursor: grab;
}

.wh-location-placement-card {
    min-width: 72px;
    min-height: 72px;
    padding: 8px;
}

.wh-location-placement-card .wh-area-code {
    font-size: .84rem;
}

.wh-location-placement-card .wh-area-name {
    font-size: .66rem;
    line-height: 1.1;
}

.wh-location-placement-card .wh-area-metrics,
.wh-location-placement-card .wh-area-mini {
    font-size: .62rem;
    line-height: 1.1;
}

.wh-area-resize-handle {
    position: absolute;
    right: 7px;
    bottom: 7px;
    width: 17px;
    height: 17px;
    border-right: 2px solid rgba(226,232,240,.9);
    border-bottom: 2px solid rgba(226,232,240,.9);
    border-radius: 2px;
    cursor: nwse-resize;
}

.wh-area-resize-handle::before {
    content: "";
    position: absolute;
    right: 4px;
    bottom: 4px;
    width: 7px;
    height: 7px;
    border-right: 1px solid rgba(226,232,240,.72);
    border-bottom: 1px solid rgba(226,232,240,.72);
}

.wh-map-delete-btn {
    position: absolute;
    z-index: 7;
    top: 8px;
    right: 8px;
    width: 24px;
    height: 24px;
    display: inline-grid;
    place-items: center;
    border: 1px solid rgba(254,202,202,.82);
    border-radius: 999px;
    background: #dc2626;
    color: #fff;
    font-size: .78rem;
    font-weight: 900;
    line-height: 1;
    box-shadow: 0 8px 18px rgba(127,29,29,.34);
    cursor: pointer;
}

.wh-map-delete-btn:hover {
    background: #b91c1c;
    border-color: #fff;
}

.wh-map-picker-backdrop {
    position: fixed;
    z-index: 1200;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 24px;
    background: rgba(2,6,23,.62);
}

.wh-map-picker {
    width: min(620px, 100%);
    max-height: min(680px, calc(100vh - 48px));
    overflow: hidden;
    border: 1px solid rgba(125,211,252,.28);
    border-radius: 12px;
    background: linear-gradient(180deg, var(--ames-sf-0f1d33-a98), var(--ames-sf-080f1c-a98));
    box-shadow: 0 28px 70px rgba(0,0,0,.46);
}

.wh-map-picker-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    padding: 16px 18px;
    border-bottom: 1px solid rgba(148,163,184,.18);
}

.wh-map-picker-head strong {
    display: block;
    color: var(--ames-tx-slate-50);
    font-size: 1rem;
}

.wh-map-picker-head span {
    display: block;
    margin-top: 4px;
    color: var(--ames-tx-slate-400);
    font-size: .78rem;
}

.wh-map-picker-close {
    width: 30px;
    height: 30px;
    display: inline-grid;
    place-items: center;
    border: 1px solid rgba(148,163,184,.28);
    border-radius: 999px;
    background: var(--ames-sf-0f172a-a70);
    color: var(--ames-tx-e5edf7);
    font-weight: 900;
    cursor: pointer;
}

.wh-map-picker-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
    gap: 10px;
    max-height: 520px;
    overflow-y: auto;
    padding: 14px;
}

.wh-map-picker-item {
    min-height: 78px;
    text-align: left;
    border: 1px solid rgba(148,163,184,.24);
    border-radius: 10px;
    padding: 12px 14px;
    background: var(--ames-sf-0f172a-a76);
    color: var(--ames-tx-e5edf7);
    cursor: pointer;
}

.wh-map-picker-item:hover {
    border-color: rgba(56,189,248,.72);
    background: rgba(14,165,233,.16);
}

.wh-map-picker-item strong,
.wh-map-picker-item span {
    display: block;
}

.wh-map-picker-item strong {
    font-family: var(--ames-font-mono);
    color: var(--ames-tx-sky-300);
    font-size: .94rem;
}

.wh-map-picker-item span {
    margin-top: 6px;
    color: var(--ames-tx-slate-300);
    font-size: .78rem;
}

.wh-map-resize-handle {
    position: absolute;
    z-index: 6;
    right: 8px;
    bottom: 8px;
    width: 24px;
    height: 24px;
    border-right: 3px solid rgba(125,211,252,.9);
    border-bottom: 3px solid rgba(125,211,252,.9);
    border-radius: 3px;
    cursor: nwse-resize;
    background: var(--ames-sf-0f172a-a64);
}

.wh-map-readonly .wh-map-resize-handle {
    display: none;
}

.wh-map-resize-handle::before {
    content: "";
    position: absolute;
    right: 5px;
    bottom: 5px;
    width: 10px;
    height: 10px;
    border-right: 2px solid rgba(226,232,240,.76);
    border-bottom: 2px solid rgba(226,232,240,.76);
}

.wh-factory-plan.resizing-plan {
    transition: none;
}

.wh-map-editing,
.wh-map-editing * {
    cursor: grabbing !important;
    user-select: none !important;
}

.wh-map-editing .wh-area-resize-handle {
    cursor: nwse-resize !important;
}

.wh-selected-location-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.wh-master-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.wh-master-context {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 0 14px 12px;
    color: var(--ames-tx-slate-400);
    font-size: .78rem;
}

.wh-master-context span {
    text-transform: uppercase;
    font-weight: 900;
    letter-spacing: .06em;
}

.wh-master-context strong {
    color: var(--ames-tx-slate-50);
    font-family: var(--ames-font-mono);
}

.wh-master-modal {
    width: min(560px, calc(100vw - 36px));
}

.wh-master-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.wh-master-form-compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.wh-master-form label,
.wh-master-form .rz-label {
    color: var(--ames-tx-slate-300);
    font-size: .78rem;
    font-weight: 800;
}

@media (max-width: 620px) {
    .wh-master-form,
    .wh-master-form-compact {
        grid-template-columns: minmax(0, 1fr);
    }
}

.wh-area-code {
    font-family: var(--ames-font-mono);
    font-weight: 900;
    font-size: 1.15rem;
    color: var(--ames-tx-slate-50);
}

.wh-area-name {
    margin-top: 2px;
    color: var(--ames-tx-slate-200-a82);
    font-size: .78rem;
    font-weight: 700;
}

.wh-area-metrics,
.wh-area-mini {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    color: var(--ames-tx-slate-300-a86);
    font-size: .72rem;
}

.wh-area-metrics strong {
    color: var(--ames-tx-white);
    font-family: var(--ames-font-mono);
}

.wh-map-workspace {
    display: grid;
    grid-template-columns: minmax(280px, 360px) minmax(0, 1fr);
    gap: 14px;
}

.wh-location-map-workspace {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
    align-items: start;
    padding: 0 14px 16px;
}

.wh-location-map-workspace .wh-factory-plan {
    margin: 0;
}

.wh-map-search {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: min(100%, 330px);
}

.wh-map-search-input {
    min-width: 220px;
    flex: 1 1 auto;
}

.wh-map-stock-panel {
    min-width: 0;
    max-height: 620px;
    overflow: hidden;
    border: 1px solid rgba(125,211,252,.24);
    border-radius: 10px;
    background: var(--ames-sf-0f172a-a76);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}

.wh-map-stock-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 13px 14px;
    border-bottom: 1px solid rgba(148,163,184,.16);
    background: var(--ames-sf-1e293b-a68);
}

.wh-map-stock-head > div {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 3px;
}

.wh-map-stock-head span:first-child {
    color: var(--ames-tx-blue-300);
    font-size: .7rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.wh-map-stock-head strong {
    overflow: hidden;
    color: var(--ames-tx-slate-50);
    font-size: .82rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.wh-map-stock-count {
    flex: 0 0 auto;
    color: var(--ames-tx-slate-300);
    font-family: var(--ames-font-mono);
    font-size: .7rem;
    font-weight: 800;
}

.wh-map-stock-list {
    display: flex;
    max-height: 548px;
    flex-direction: column;
    gap: 8px;
    overflow: auto;
    padding: 10px;
}

.wh-map-stock-item {
    width: 100%;
    border: 1px solid rgba(148,163,184,.18);
    border-radius: 8px;
    background: var(--ames-sf-1e293b-a62);
    color: var(--ames-tx-e5edf7);
    cursor: pointer;
    padding: 10px 11px;
    text-align: left;
}

.wh-map-stock-item:hover,
.wh-map-stock-item.highlighted {
    border-color: rgba(96,165,250,.84);
    background: rgba(30,64,175,.28);
}

.wh-map-stock-part,
.wh-map-stock-name,
.wh-map-stock-meta {
    display: block;
}

.wh-map-stock-part {
    color: var(--ames-tx-blue-200);
    font-family: var(--ames-font-mono);
    font-size: .78rem;
    font-weight: 900;
}

.wh-map-stock-name {
    margin-top: 3px;
    overflow: hidden;
    color: var(--ames-tx-slate-200);
    font-size: .76rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.wh-map-stock-meta {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin-top: 8px;
    color: var(--ames-tx-slate-400);
    font-family: var(--ames-font-mono);
    font-size: .72rem;
}

.wh-map-stock-meta b {
    color: var(--ames-tx-sky-300);
}

.wh-map-stock-meta span {
    color: var(--ames-tx-slate-50);
    font-weight: 800;
}

.wh-map-stock-empty {
    display: flex;
    min-height: 140px;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    padding: 20px;
    color: var(--ames-tx-slate-400);
    text-align: center;
}

.wh-map-stock-empty strong {
    color: var(--ames-tx-slate-200);
    font-size: .86rem;
}

.wh-map-stock-empty span {
    font-size: .75rem;
}

.wh-position-panel {
    padding: 14px;
}

.wh-position-title {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin-bottom: 12px;
}

.wh-position-title strong {
    color: var(--ames-tx-e5edf7);
    font-family: var(--ames-font-mono);
    font-size: 1.1rem;
}

.wh-position-title span {
    color: var(--ames-tx-slate-400);
    font-size: .82rem;
}

.wh-position-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 12px;
}

.wh-position-grid .rz-label {
    color: var(--ames-tx-slate-400);
    font-size: .74rem;
    font-weight: 700;
}

.wh-location-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 10px;
    padding: 14px;
}

.wh-location-coordinate-scroll {
    padding: 14px;
    overflow: auto;
}

.wh-location-coordinate-map {
    display: grid;
    grid-template-columns: 64px repeat(var(--wh-cols), minmax(148px, 1fr));
    gap: 8px;
    align-items: stretch;
}

.wh-grid-corner,
.wh-grid-axis {
    min-height: 34px;
    border-radius: 8px;
    border: 1px solid rgba(148,163,184,.16);
    background: var(--ames-sf-0f172a-a72);
    color: var(--ames-tx-blue-300);
    font-family: var(--ames-font-mono);
    font-size: .72rem;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
}

.wh-grid-corner {
    color: var(--ames-tx-slate-300);
    background: var(--ames-sf-1e293b-a90);
}

.wh-grid-row {
    min-height: 112px;
    color: var(--ames-tx-sky-100);
}

.wh-grid-slot {
    min-height: 112px;
    border-radius: 10px;
    border: 1px solid rgba(148,163,184,.16);
    background: rgba(15,23,42,.46);
    padding: 8px;
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.wh-grid-slot.empty {
    background: rgba(15,23,42,.24);
}

.wh-grid-empty {
    height: 100%;
    min-height: 88px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ames-tx-slate-400-a42);
    font-family: var(--ames-font-mono);
}

.wh-location-bin {
    width: 100%;
    min-height: 88px;
    border-radius: 8px;
    border: 1px solid rgba(148,163,184,.24);
    background: var(--ames-sf-1e293b-a82);
    color: var(--ames-tx-e5edf7);
    text-align: left;
    padding: 9px 10px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 4px;
}

.wh-location-bin:hover {
    border-color: rgba(147,197,253,.68);
    background: var(--ames-sf-1e293b-a96);
}

.wh-location-bin.empty { border-color: rgba(148,163,184,.22); }
.wh-location-bin.stocked { border-color: rgba(74,222,128,.48); background: rgba(21,128,61,.18); }
.wh-location-bin.mixed { border-color: rgba(251,191,36,.55); background: rgba(180,83,9,.17); }
.wh-location-bin.highlighted,
.wh-location-bin.search-hit {
    border-color: #facc15;
    background: rgba(202,138,4,.24);
    box-shadow: 0 0 0 2px rgba(250,204,21,.22), 0 0 22px rgba(250,204,21,.2);
}

.wh-location-bin-code {
    color: var(--ames-tx-blue-200);
    font-family: var(--ames-font-mono);
    font-weight: 900;
    font-size: .85rem;
}

.wh-location-bin-zone {
    color: var(--ames-tx-slate-400);
    font-size: .72rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.wh-location-bin-qty {
    color: var(--ames-tx-white);
    font-family: var(--ames-font-mono);
    font-size: .8rem;
    font-weight: 800;
    text-align: right;
}

.wh-map-area {
    padding: 12px 14px 16px;
    border-top: 1px solid var(--ames-bd-white-a06);
}

.wh-map-area-h {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
}

.wh-map-area-h strong {
    color: var(--ames-tx-e5edf7);
    font-size: 1rem;
    margin-right: 8px;
}

.wh-map-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(148px, 1fr));
    gap: 10px;
}

.wh-map-cell {
    min-height: 92px;
    text-align: left;
    border-radius: 8px;
    padding: 10px 12px;
    border: 1px solid rgba(148,163,184,.24);
    background: var(--ames-sf-0f172a-a72);
    color: var(--ames-tx-e5edf7);
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}

.wh-map-cell:hover {
    border-color: rgba(147,197,253,.62);
    background: var(--ames-sf-1e293b-a86);
}

.wh-map-cell.empty { border-color: rgba(148,163,184,.22); }
.wh-map-cell.stocked { border-color: rgba(74,222,128,.48); background: rgba(21,128,61,.16); }
.wh-map-cell.mixed { border-color: rgba(251,191,36,.55); background: rgba(180,83,9,.15); }

.wh-map-cell-code {
    font-family: var(--ames-font-mono);
    font-weight: 800;
    color: var(--ames-tx-blue-200);
}

.wh-map-cell-rack,
.wh-map-cell-qty {
    font-family: var(--ames-font-mono);
    color: var(--ames-tx-slate-400);
    font-size: .76rem;
}

.wh-map-cell-qty {
    color: var(--ames-tx-white);
    font-weight: 700;
}

.wh-detail-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 10px;
    padding: 14px;
}

.wh-detail-grid > div {
    border: 1px solid rgba(148,163,184,.16);
    background: rgba(255,255,255,.035);
    border-radius: 8px;
    padding: 10px 12px;
}

.wh-detail-grid span {
    display: block;
    color: var(--ames-tx-slate-400);
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    margin-bottom: 4px;
}

.wh-detail-grid strong {
    color: var(--ames-tx-e5edf7);
    font-family: var(--ames-font-mono);
}

@media (max-width: 900px) {
    .wh-form-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .wh-factory-plan {
        min-height: 440px;
    }

    .wh-map-workspace {
        grid-template-columns: 1fr;
    }

    .wh-location-map-workspace {
        padding-inline: 14px;
    }

    .wh-map-stock-panel {
        max-height: none;
    }

    .wh-map-stock-list {
        max-height: 320px;
    }
}

/* ── 화면 전환 로딩 표시 (좌측 메뉴 클릭 → 우측 콘텐츠 로딩) ───────────── */
#ames-nav-progress {
    position: fixed;
    top: 0;
    left: 0;
    height: 3px;
    width: 0;
    z-index: 100000;
    background: linear-gradient(90deg, #0ea5e9, #7dd3fc);
    box-shadow: 0 0 10px rgba(56, 189, 248, .7);
    opacity: 0;
    pointer-events: none;
}

#ames-nav-progress.active {
    opacity: 1;
    width: 85%;
    transition: width 8s cubic-bezier(.05, .7, .55, 1), opacity .15s ease;
}

#ames-nav-progress.done {
    width: 100%;
    opacity: 0;
    transition: width .2s ease, opacity .4s ease .15s;
}

.ames-navigating .ames-content {
    position: relative;
}

.ames-navigating .ames-content::after {
    content: "불러오는 중…";
    position: absolute;
    inset: 0;
    z-index: 40;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(2, 6, 23, .30);
    backdrop-filter: blur(1.5px);
    color: var(--ames-tx-slate-200);
    font-size: .9rem;
    letter-spacing: .3px;
    animation: ames-nav-fade .15s ease;
}

@keyframes ames-nav-fade {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* ════════════════════════════════════════════════════════════════════
   스케줄 세그먼트 색 토큰 — 다크 기본값. 라이트는 [data-theme=light] 재정의.
   간트/패턴 밴드가 이 변수를 통해 테마 반응. (배경/보더는 color-mix 로 반투명)
   ════════════════════════════════════════════════════════════════════ */
:root {
    --seg-operating: #86efac;
    --seg-downtime:  #fca5a5;
    --seg-break:     #fde68a;
    --seg-meal:      #93c5fd;
    --seg-inspect:   #22d3ee;
    --seg-pm:        #fdba74;
    --seg-idle:      #cbd5e1;
    --seg-btn-fg:    #0b1220;   /* 선택된 세그 버튼 글자색(파스텔 위 어두운 글자) */
}
/* 간트 밴드 클래스도 토큰 기반으로 (인라인 SegBandStyle 과 시각 일치) */
.pp-gantt-band--work    { background: color-mix(in srgb, var(--seg-operating) 13%, transparent); border: 1px solid  color-mix(in srgb, var(--seg-operating) 53%, transparent); color: var(--seg-operating); }
.pp-gantt-band--down    { background: color-mix(in srgb, var(--seg-downtime) 13%, transparent);  border: 1px solid  color-mix(in srgb, var(--seg-downtime) 53%, transparent);  color: var(--seg-downtime); }
.pp-gantt-band--break   { background: color-mix(in srgb, var(--seg-break) 13%, transparent);     border: 1px solid  color-mix(in srgb, var(--seg-break) 53%, transparent);     color: var(--seg-break); }
.pp-gantt-band--meal    { background: color-mix(in srgb, var(--seg-meal) 13%, transparent);      border: 1px solid  color-mix(in srgb, var(--seg-meal) 53%, transparent);      color: var(--seg-meal); }
.pp-gantt-band--idle    { background: color-mix(in srgb, var(--seg-idle) 13%, transparent);      border: 1px dashed color-mix(in srgb, var(--seg-idle) 53%, transparent);      color: var(--seg-idle); }
.pp-gantt-band--inspect { background: color-mix(in srgb, var(--seg-inspect) 13%, transparent);   border: 1px solid  color-mix(in srgb, var(--seg-inspect) 53%, transparent);   color: var(--seg-inspect); }
.pp-gantt-band--pm      { background: color-mix(in srgb, var(--seg-pm) 13%, transparent);        border: 1px solid  color-mix(in srgb, var(--seg-pm) 53%, transparent);        color: var(--seg-pm); }

/* ════════════════════════════════════════════════════════════════════
   LIGHT THEME  (html[data-theme="light"]) — 다크 규칙 위 오버라이드 레이어.
   기존 다크 규칙은 그대로 두고 색상만 재정의(특이도 우위). 목록/스케줄 시인성 우선.
   ════════════════════════════════════════════════════════════════════ */
html[data-theme="light"] {
    /* ── 아이보리 표면 토큰 (여기 값만 바꾸면 전체 라이트 톤 조정) ── */
    --ames-bg:          #eee7d6;   /* 페이지 배경(아이보리) */
    --ames-surface:     #faf6ec;   /* 카드/모달/탑바/사이드바(크림) */
    --ames-surface-2:   #f3ecdb;   /* 그라데이션 하단 */
    --ames-surface-3:   #e9e0cb;   /* 헤더 스트립(그리드헤더/테이블 th/kpi) */
    --ames-text:        #2c2721;   /* 본문(따뜻한 근검정) */
    --ames-text-dim:    #5f5747;   /* 보조/희미 — 아이보리 위 대비 5.8 (구 #726a58 은 4.3) */
    --ames-accent:      #1d4ed8;   /* 강조(브랜드 블루) */
    --ames-border:      rgba(120,98,52,.22);
    --ames-border-soft: rgba(120,98,52,.12);
    --ames-hover:       rgba(120,98,52,.08);
    /* ── 크롬(탑바·좌측메뉴) 전용 — 밝은 푸른색 계열 ── */
    --ames-chrome:        #b5ccf1;   /* 크롬 배경(진한 하늘색) */
    --ames-chrome-2:      #9dbaeb;   /* 그라데이션 하단 */
    --ames-chrome-text:   #1e3a5f;   /* 크롬 위 본문(네이비) */
    --ames-chrome-dim:    #344a72;   /* 크롬 위 보조 — 크롬 하단색 위 대비 4.5 (구 #4b6591 은 3.0) */
    --ames-chrome-border: rgba(37,99,235,.22);
    --ames-chrome-hover:  rgba(37,99,235,.10);
    /* Radzen 컴포넌트(그리드/입력/버튼) 변수 → 아이보리 매핑 */
    --rz-text-color: var(--ames-text);
    --rz-text-secondary-color: var(--ames-text-dim);
    --rz-base-background-color: var(--ames-bg);
    --rz-body-background-color: transparent;
    --rz-panel-background-color: var(--ames-surface);
    --rz-input-background-color: #fdfbf4;
    --rz-input-value-color: var(--ames-text);
    --rz-grid-background-color: var(--ames-surface);
    --rz-grid-header-background-color: var(--ames-surface-3);
    --rz-grid-cell-color: var(--ames-text);
    --rz-grid-stripe-background-color: #f4eede;
    /* 스케줄 세그먼트 — 흰 배경 대비 확보(채도↑·명도↓, WCAG 가독) */
    --seg-operating: #15803d;
    --seg-downtime:  #b91c1c;
    --seg-break:     #a16207;
    --seg-meal:      #1d4ed8;
    --seg-inspect:   #0e7490;
    --seg-pm:        #c2410c;
    --seg-idle:      #64748b;
    --seg-btn-fg:    #ffffff;   /* 라이트: 진한 세그색 위 흰 글자 */
    color-scheme: light;
}

/* ═══ THEME TOKENS (light) — 라이트에서 읽히는 색. 글자 = 같은 색상 700/800, 어두운 배경 = --ames-surface ═══ */
html[data-theme="light"] {
    --ames-bd-white-a04: rgba(120,98,52,0.2);
    --ames-bd-white-a05: rgba(120,98,52,0.23);
    --ames-bd-white-a06: rgba(120,98,52,0.25);
    --ames-bd-white-a07: rgba(120,98,52,0.28);
    --ames-bd-white-a08: rgba(120,98,52,0.3);
    --ames-bd-white-a10: rgba(120,98,52,0.35);
    --ames-bd-white-a12: rgba(120,98,52,0.35);
    --ames-bd-white-a14: rgba(120,98,52,0.35);
    --ames-bd-white-a15: rgba(120,98,52,0.35);
    --ames-bd-white-a25: rgba(120,98,52,0.35);
    --ames-bd-white-a45: rgba(120,98,52,0.35);
    --ames-sf-03251a: var(--ames-surface);
    --ames-sf-040e10-a92: var(--ames-surface);
    --ames-sf-040e10-a97: var(--ames-surface);
    --ames-sf-050a13: var(--ames-surface);
    --ames-sf-050a14-a92: var(--ames-surface);
    --ames-sf-050a14-a97: var(--ames-surface);
    --ames-sf-050d10: var(--ames-surface);
    --ames-sf-050d10-a85: var(--ames-surface);
    --ames-sf-050f12: var(--ames-surface);
    --ames-sf-052e1f: var(--ames-surface);
    --ames-sf-060b17: var(--ames-surface);
    --ames-sf-061a1c-a92: var(--ames-surface);
    --ames-sf-061a1c-a97: var(--ames-surface);
    --ames-sf-07101f: var(--ames-surface);
    --ames-sf-071a1c: var(--ames-surface);
    --ames-sf-080f1c-a72: var(--ames-surface);
    --ames-sf-080f1c-a98: var(--ames-surface);
    --ames-sf-090f1d: var(--ames-surface);
    --ames-sf-0a1426-a85: var(--ames-surface);
    --ames-sf-0a1426-a92: var(--ames-surface);
    --ames-sf-0a1426-a95: var(--ames-surface);
    --ames-sf-0a1426-a97: var(--ames-surface);
    --ames-sf-0b1220: var(--ames-surface);
    --ames-sf-0c182b: var(--ames-surface);
    --ames-sf-0d1a2e: var(--ames-surface);
    --ames-sf-0d1b2e: var(--ames-surface);
    --ames-sf-0e1a30: var(--ames-surface);
    --ames-sf-0f172a: var(--ames-surface);
    --ames-sf-0f172a-a62: var(--ames-surface);
    --ames-sf-0f172a-a64: var(--ames-surface);
    --ames-sf-0f172a-a70: var(--ames-surface);
    --ames-sf-0f172a-a72: var(--ames-surface);
    --ames-sf-0f172a-a76: var(--ames-surface);
    --ames-sf-0f172a-a78: var(--ames-surface);
    --ames-sf-0f172a-a82: var(--ames-surface);
    --ames-sf-0f172a-a84: var(--ames-surface);
    --ames-sf-0f172a-a86: var(--ames-surface);
    --ames-sf-0f172a-a88: var(--ames-surface);
    --ames-sf-0f172a-a90: var(--ames-surface);
    --ames-sf-0f172a-a98: var(--ames-surface);
    --ames-sf-0f1b2e: var(--ames-surface);
    --ames-sf-0f1d33-a85: var(--ames-surface);
    --ames-sf-0f1d33-a95: var(--ames-surface);
    --ames-sf-0f1d33-a98: var(--ames-surface);
    --ames-sf-0f3d3e: var(--ames-surface);
    --ames-sf-111827: var(--ames-surface);
    --ames-sf-111827-a95: var(--ames-surface);
    --ames-sf-111c30: var(--ames-surface);
    --ames-sf-16243b-a80: var(--ames-surface);
    --ames-sf-16243d: var(--ames-surface);
    --ames-sf-172238: var(--ames-surface);
    --ames-sf-182638: var(--ames-surface);
    --ames-sf-1e293b: var(--ames-surface);
    --ames-sf-1e293b-a60: var(--ames-surface);
    --ames-sf-1e293b-a62: var(--ames-surface);
    --ames-sf-1e293b-a68: var(--ames-surface);
    --ames-sf-1e293b-a70: var(--ames-surface);
    --ames-sf-1e293b-a72: var(--ames-surface);
    --ames-sf-1e293b-a75: var(--ames-surface);
    --ames-sf-1e293b-a82: var(--ames-surface);
    --ames-sf-1e293b-a86: var(--ames-surface);
    --ames-sf-1e293b-a88: var(--ames-surface);
    --ames-sf-1e293b-a90: var(--ames-surface);
    --ames-sf-1e293b-a92: var(--ames-surface);
    --ames-sf-1e293b-a96: var(--ames-surface);
    --ames-sf-252a32: var(--ames-surface);
    --ames-tx-93a4bd: var(--ames-text-dim);
    --ames-tx-amber-200: #92400e;
    --ames-tx-amber-300: #b45309;
    --ames-tx-amber-400: #b45309;
    --ames-tx-amber-500: #b45309;
    --ames-tx-blue-100: #1e40af;
    --ames-tx-blue-200: #1e40af;
    --ames-tx-blue-300: #1d4ed8;
    --ames-tx-blue-300-a35: rgba(29,78,216,0.55);
    --ames-tx-blue-300-a60: #1d4ed8;
    --ames-tx-blue-300-a65: #1d4ed8;
    --ames-tx-blue-300-a70: #1d4ed8;
    --ames-tx-blue-300-a85: #1d4ed8;
    --ames-tx-blue-400: #1d4ed8;
    --ames-tx-blue-400-a70: #1d4ed8;
    --ames-tx-blue-400-a80: #1d4ed8;
    --ames-tx-blue-600: #1d4ed8;
    --ames-tx-c4dafe: #1e40af;
    --ames-tx-cyan-400: #0e7490;
    --ames-tx-dbe5ef: var(--ames-text);
    --ames-tx-e5edf7: var(--ames-text);
    --ames-tx-emerald-300: #047857;
    --ames-tx-emerald-400: #047857;
    --ames-tx-emerald-500: #047857;
    --ames-tx-gray-200: #374151;
    --ames-tx-gray-400: #4b5563;
    --ames-tx-green-200: #166534;
    --ames-tx-green-300: #15803d;
    --ames-tx-green-400: #15803d;
    --ames-tx-indigo-200: #3730a3;
    --ames-tx-orange-300: #c2410c;
    --ames-tx-orange-400: #c2410c;
    --ames-tx-orange-500: #c2410c;
    --ames-tx-orange-600: #c2410c;
    --ames-tx-pink-400: #be185d;
    --ames-tx-purple-300: #7e22ce;
    --ames-tx-red-300: #b91c1c;
    --ames-tx-red-300-a70: #b91c1c;
    --ames-tx-red-300-a80: #b91c1c;
    --ames-tx-red-300-a85: #b91c1c;
    --ames-tx-red-400: #b91c1c;
    --ames-tx-red-500: #b91c1c;
    --ames-tx-red-600: #b91c1c;
    --ames-tx-rose-300: #be123c;
    --ames-tx-sky-100: #075985;
    --ames-tx-sky-300: #0369a1;
    --ames-tx-sky-400: #0369a1;
    --ames-tx-slate-200: #334155;
    --ames-tx-slate-200-a82: #334155;
    --ames-tx-slate-300: #334155;
    --ames-tx-slate-300-a86: #334155;
    --ames-tx-slate-400: #475569;
    --ames-tx-slate-400-a42: rgba(71,85,105,0.62);
    --ames-tx-slate-400-a60: #475569;
    --ames-tx-slate-400-a80: #475569;
    --ames-tx-slate-400-a90: #475569;
    --ames-tx-slate-50: var(--ames-text);
    --ames-tx-slate-500: #475569;
    --ames-tx-teal-100: #115e59;
    --ames-tx-teal-200: #115e59;
    --ames-tx-teal-300: #0f766e;
    --ames-tx-violet-300: #6d28d9;
    --ames-tx-violet-400: #6d28d9;
    --ames-tx-white: var(--ames-text);
    --ames-tx-white-a20: var(--ames-text-dim);
    --ames-tx-white-a35: var(--ames-text-dim);
    --ames-tx-white-a40: var(--ames-text-dim);
    --ames-tx-white-a45: var(--ames-text-dim);
    --ames-tx-white-a50: var(--ames-text-dim);
    --ames-tx-white-a55: var(--ames-text-dim);
    --ames-tx-white-a60: var(--ames-text-dim);
    --ames-tx-white-a70: var(--ames-text);
    --ames-tx-white-a75: var(--ames-text);
    --ames-tx-white-a78: var(--ames-text);
    --ames-tx-white-a80: var(--ames-text);
    --ames-tx-white-a88: var(--ames-text);
}
/* ═══ THEME TOKENS END ═══ */
/* Radzen 라이트 기본(humanistic-base.css) 위 보정 — App.razor 가 라이트일 때 이 테마를 켠다 */
html[data-theme="light"] {
    /* 회청색 기본 톤 → 아이보리 (날짜 선택기 머리글·대화상자 제목줄·기본 버튼·탭·칩) */
    --rz-base-50: #fdfbf4;
    --rz-base-100: #faf6ec;
    --rz-base-200: #f3ecdb;
    --rz-base-300: #e9e0cb;
    --rz-base: #e9e0cb;
    --rz-base-light: #f3ecdb;
    --rz-base-lighter: #fdfbf4;
    --rz-on-base: var(--ames-text);
    --rz-grid-filter-color: var(--ames-text-dim);   /* 기본은 비활성 글자색이라 아이보리 위 2.4 */
    /* 색 버튼은 흰 글자라 흰 글자 대비 4.5 이상인 진한 색으로 (Radzen 기본 #f9777f·#5dbf74 등은 2.4~2.6) */
    --rz-danger: #dc2626;  --rz-danger-light: #ef4444;  --rz-danger-dark: #b91c1c;  --rz-danger-darker: #991b1b;  --rz-danger-lighter: rgba(220,38,38,.14);
    --rz-success: #15803d; --rz-success-light: #16a34a; --rz-success-dark: #166534; --rz-success-darker: #14532d; --rz-success-lighter: rgba(21,128,61,.14);
    --rz-warning: #b45309; --rz-warning-light: #d97706; --rz-warning-dark: #92400e; --rz-warning-darker: #78350f; --rz-warning-lighter: rgba(180,83,9,.14);
    --rz-info: #0e7490;    --rz-info-light: #0891b2;    --rz-info-dark: #155e75;    --rz-info-darker: #164e63;    --rz-info-lighter: rgba(14,116,144,.14);
    --rz-secondary: #1d4ed8; --rz-secondary-light: #2563eb; --rz-secondary-dark: #1e40af; --rz-secondary-darker: #1e3a8a; --rz-secondary-lighter: rgba(29,78,216,.12);
}
/* 그리드 헤더·고정 열 — 다크는 불투명 남색(--ames-frozen-bg) 위 틴트라 라이트에서는 면 색으로 */
html[data-theme="light"] .ames-rz-grid { --ames-frozen-bg: var(--ames-bg); }
html[data-theme="light"] .ames-tabpanel .ames-rz-grid,
html[data-theme="light"] .ames-card .ames-rz-grid { --ames-frozen-bg: var(--ames-surface); }
html[data-theme="light"] .ames-rz-grid thead th,
html[data-theme="light"] .ames-rz-grid th.rz-frozen-cell { background: var(--ames-surface-3) !important; }
html[data-theme="light"] .ames-rz-grid .rz-column-header { border-bottom-color: var(--ames-border) !important; }
html[data-theme="light"] .ames-rz-grid .rz-pager .rz-dropdown { background: #fdfbf4 !important; border-color: var(--ames-border) !important; }
/* 메뉴 보조 언어 이름 — 크롬 위 대비 */
html[data-theme="light"] .ames-nav-alt { color: var(--ames-chrome-dim); }
/* 투명 배경 버튼(고스트 탭·자체 페이저) — 다크는 흰 반투명 글자라 라이트에서 사라진다 */
html[data-theme="light"] .ames-btn.ghost { color: var(--ames-text); border-color: var(--ames-border); }
html[data-theme="light"] .ames-btn.ghost:hover:not(:disabled) { background: var(--ames-hover); color: var(--ames-accent); border-color: rgba(29,78,216,.45); }
html[data-theme="light"] .ames-pager-btn { color: var(--ames-text); background: var(--ames-hover); border-color: var(--ames-border); }
html[data-theme="light"] .ames-pager-btn:hover:not(:disabled) { background: rgba(37,99,235,.12); color: var(--ames-accent); }
html[data-theme="light"] .ames-pager-btn.active { background: linear-gradient(135deg,#2563eb,#1d4ed8); border-color: transparent; color: #fff; }
html[data-theme="light"] body { background: var(--ames-bg); color: var(--ames-text); }
html[data-theme="light"] a { color: var(--ames-accent); }
html[data-theme="light"] a:hover { color: #1e40af; }
html[data-theme="light"] .ames-shell {
    background:
        radial-gradient(1200px 600px at 12% -10%, rgba(37,99,235,.05), transparent 60%),
        radial-gradient(900px 500px at 110% 10%, rgba(180,120,40,.06), transparent 60%),
        var(--ames-bg);
}
/* Topbar / brand / breadcrumb / user — 밝은 푸른 크롬 */
html[data-theme="light"] .ames-topbar { background: linear-gradient(180deg, var(--ames-chrome), var(--ames-chrome-2)); border-bottom: 1px solid var(--ames-chrome-border); }
html[data-theme="light"] .ames-loc-name { color: var(--ames-chrome-text); }
html[data-theme="light"] .ames-brand { border-right-color: var(--ames-chrome-border); }
html[data-theme="light"] .ames-brand-logo { color: var(--ames-chrome-text); }
html[data-theme="light"] .ames-brand-sub { color: var(--ames-accent); }
html[data-theme="light"] .ames-user { background: linear-gradient(180deg, rgba(37,99,235,.10), rgba(37,99,235,.03)); border-color: rgba(37,99,235,.28); }
html[data-theme="light"] .ames-user-name { color: var(--ames-chrome-text); }
/* 다크용 연파랑·연빨강·흰색 반투명은 밝은 크롬 위에서 사라진다 — 크롬 텍스트 토큰으로 재정의 */
html[data-theme="light"] .ames-loc-code { color: var(--ames-accent); background: rgba(37,99,235,.10); border-color: rgba(37,99,235,.35); }
html[data-theme="light"] .ames-user-role { color: var(--ames-chrome-dim); }
html[data-theme="light"] .ames-user-out { background: rgba(185,28,28,.08); border-color: rgba(185,28,28,.35); color: #991b1b; }
html[data-theme="light"] .ames-user-out:hover { background: rgba(185,28,28,.16); }
html[data-theme="light"] .culture-switcher .culture-sep { color: var(--ames-chrome-dim); }
html[data-theme="light"] .culture-switcher a { color: var(--ames-chrome-dim); }
html[data-theme="light"] .culture-switcher a.cur { color: var(--ames-accent); }
/* Sidebar / nav — 밝은 푸른 크롬 */
html[data-theme="light"] .ames-side { background: linear-gradient(180deg, var(--ames-chrome), var(--ames-chrome-2)); border-right: 1px solid var(--ames-chrome-border); }
html[data-theme="light"] .ames-side-toggle { background: var(--ames-chrome-hover); border-color: var(--ames-chrome-border); color: var(--ames-chrome-dim); }
html[data-theme="light"] .ames-side-toggle:hover { background: rgba(37,99,235,.18); color: var(--ames-chrome-text); }
html[data-theme="light"] .ames-nav-home { color: var(--ames-chrome-text); }
html[data-theme="light"] .ames-nav-home:hover { background: var(--ames-chrome-hover); color: var(--ames-chrome-text); }
html[data-theme="light"] .ames-nav-section { color: var(--ames-chrome-text); }
html[data-theme="light"] .ames-nav-section:hover { color: var(--ames-accent); }
html[data-theme="light"] .ames-nav-section-n { background: var(--ames-chrome-hover); color: var(--ames-chrome-dim); }
html[data-theme="light"] .ames-nav-link { color: var(--ames-chrome-dim); }
html[data-theme="light"] .ames-nav-link:hover { color: var(--ames-chrome-text); background: var(--ames-chrome-hover); }
html[data-theme="light"] .ames-nav-link .lid { background: var(--ames-chrome-hover); border-color: var(--ames-chrome-border); color: var(--ames-chrome-dim); }
html[data-theme="light"] .ames-nav-search { background: rgba(255,255,255,.5); border-color: var(--ames-chrome-border); }
html[data-theme="light"] .ames-nav-search input { color: var(--ames-chrome-text); }
html[data-theme="light"] .ames-nav-search input::placeholder { color: var(--ames-chrome-dim); opacity: .85; }
html[data-theme="light"] .ames-nav-search-ic { opacity: .8; }
html[data-theme="light"] .ames-nav-search-x { color: var(--ames-chrome-dim); }
html[data-theme="light"] .ames-nav-search-x:hover { color: var(--ames-chrome-text); }
html[data-theme="light"] .ames-nav-sub-t { color: var(--ames-chrome-text); }
html[data-theme="light"] .ames-nav-sub-s { color: var(--ames-chrome-dim); }
html[data-theme="light"] .ames-nav-sub-letter { color: #6d28d9; }
html[data-theme="light"] .ames-nav-empty { color: var(--ames-chrome-dim); }
html[data-theme="light"] .ames-nav-section.open { color: var(--ames-accent); font-weight: 700; box-shadow: inset 2px 0 0 var(--ames-accent); }
html[data-theme="light"] .ames-nav-section.open .ames-nav-section-n { background: rgba(37,99,235,.12); color: var(--ames-accent); }
/* 활성 메뉴(현재 화면) — 기본 흰 글자가 밝은 배경서 안 보이므로 블루로 재정의 */
html[data-theme="light"] .ames-nav-home.active { color: #1d4ed8; background: linear-gradient(90deg, rgba(37,99,235,.14), transparent); }
html[data-theme="light"] .ames-nav-link.active { color: #1e3a8a; background: linear-gradient(90deg, rgba(37,99,235,.16), rgba(37,99,235,.04)); box-shadow: inset 2px 0 0 #2563eb; }
html[data-theme="light"] .ames-nav-link.active .lid { background: rgba(37,99,235,.16); border-color: rgba(37,99,235,.35); color: #1e3a8a; }
/* Tiles / cards / tabs */
html[data-theme="light"] .ames-tile { background: linear-gradient(160deg, var(--ames-surface), var(--ames-surface-2)); border-color: var(--ames-border); color: var(--ames-text); }
html[data-theme="light"] .ames-tile:hover { color: var(--ames-text); }
html[data-theme="light"] .ames-tile-sub { color: var(--ames-text-dim); }
html[data-theme="light"] .ames-card { background: var(--ames-surface); border: 1px solid var(--ames-border); box-shadow: 0 1px 4px -2px rgba(80,60,20,.16); }
html[data-theme="light"] .ames-card-h { color: var(--ames-accent); border-bottom-color: var(--ames-border-soft); }
html[data-theme="light"] .ames-tab { color: var(--ames-text-dim); background: var(--ames-hover); border-color: var(--ames-border-soft); }
html[data-theme="light"] .ames-tab:hover { color: var(--ames-text); }
html[data-theme="light"] .ames-tab.on { color: var(--ames-text); background: var(--ames-surface); }
html[data-theme="light"] .ames-tabpanel { background: var(--ames-surface); border-color: var(--ames-border); }
/* KPI */
html[data-theme="light"] .ames-kpi { background: linear-gradient(180deg, var(--ames-surface), var(--ames-surface-3)); border-color: var(--ames-border); }
html[data-theme="light"] .ames-kpi-l { color: var(--ames-accent); }
html[data-theme="light"] .ames-kpi-v { color: var(--ames-text); }
html[data-theme="light"] .ames-kpi-s { color: var(--ames-text-dim); }
/* Tables / list */
html[data-theme="light"] .ames-table th { background: var(--ames-surface-3); color: var(--ames-accent); border-bottom-color: var(--ames-border); }
html[data-theme="light"] .ames-table td { color: var(--ames-text); border-bottom-color: var(--ames-border-soft); }
html[data-theme="light"] .ames-table tr:hover td { background: var(--ames-hover); }
html[data-theme="light"] .ames-table td.code { color: var(--ames-accent); }
html[data-theme="light"] .ames-table td.num  { color: var(--ames-text); }
html[data-theme="light"] .ames-table td.dim,
html[data-theme="light"] .ames-empty { color: var(--ames-text-dim); }
html[data-theme="light"] .ames-list-item { border-bottom-color: var(--ames-border-soft); }
html[data-theme="light"] .ames-list-item:hover { background: var(--ames-hover); }
html[data-theme="light"] .ames-list-item.selected { background: rgba(37,99,235,.10); border-left-color: var(--ames-accent); }
html[data-theme="light"] .ames-info-bar { background: var(--ames-surface-3); border-color: var(--ames-border); }
/* Status pills — 라이트에서 텍스트 진하게 */
html[data-theme="light"] .pill.ok     { background: rgba(22,163,74,.12);  color: #15803d; border-color: rgba(22,163,74,.35); }
html[data-theme="light"] .pill.warn   { background: rgba(217,119,6,.12);  color: #b45309; border-color: rgba(217,119,6,.35); }
html[data-theme="light"] .pill.bad    { background: rgba(220,38,38,.10);  color: #b91c1c; border-color: rgba(220,38,38,.35); }
html[data-theme="light"] .pill.info   { background: rgba(37,99,235,.10);  color: #1d4ed8; border-color: rgba(37,99,235,.35); }
html[data-theme="light"] .pill.mute,
html[data-theme="light"] .pill.idle,
html[data-theme="light"] .pill.ghost  { background: rgba(71,85,105,.10);  color: #475569; border-color: rgba(71,85,105,.35); }
html[data-theme="light"] .pill.orange { background: rgba(234,88,12,.14);  color: #c2410c; border-color: rgba(234,88,12,.45); }
/* Modal / inputs */
html[data-theme="light"] .ames-modal { background: var(--ames-surface); border-color: var(--ames-border); color: var(--ames-text); }
html[data-theme="light"] .ames-modal-h { color: var(--ames-accent); border-bottom-color: var(--ames-border-soft); }
html[data-theme="light"] .ames-modal label { color: var(--ames-text-dim); }
html[data-theme="light"] .ames-modal-footer { border-top-color: var(--ames-border-soft); }
html[data-theme="light"] .ames-input,
html[data-theme="light"] .ames-rz-input { background: #fdfbf4; color: var(--ames-text); border-color: var(--ames-border); }
html[data-theme="light"] select.ames-input option { background: var(--ames-surface); }
/* Gantt board shell (밴드 색은 --seg-* 토큰이 자동 반영) */
html[data-theme="light"] .ames-rz-grid ::-webkit-scrollbar-thumb,
html[data-theme="light"] .ames-main::-webkit-scrollbar-thumb { background: rgba(120,98,52,.28); }
html[data-theme="light"] .pp-gantt-ruler { border-bottom-color: var(--ames-border); }
html[data-theme="light"] .pp-gantt-tick { color: var(--ames-text-dim); }
html[data-theme="light"] .pp-gantt-tick.major { color: var(--ames-text); }
html[data-theme="light"] .pp-gantt-gridline { background: rgba(120,98,52,.10); }
html[data-theme="light"] .pp-gantt-gridline.major { background: rgba(120,98,52,.16); }
html[data-theme="light"] .pp-gantt-row { border-bottom-color: var(--ames-border-soft); }
html[data-theme="light"] .pp-gantt-row-lbl { color: var(--ames-text-dim); }
html[data-theme="light"] .pp-tl-t { color: var(--ames-accent); }
html[data-theme="light"] .pp-lgd { color: var(--ames-text-dim); }
html[data-theme="light"] .pp-gantt-wo { background: rgba(126,34,206,.14); border-color: rgba(126,34,206,.5); color: #6b21a8; }
html[data-theme="light"] .pp-gantt-pm { background: rgba(194,65,12,.14); border-color: rgba(194,65,12,.5); color: #9a3412; }
html[data-theme="light"] .pp-gantt-mc { background: rgba(109,40,217,.12); border-color: rgba(109,40,217,.5); color: #5b21b6; }
/* 테마 토글 버튼 */
.ames-theme-toggle {
    background: rgba(255,255,255,.06); border: 1px solid var(--ames-bd-white-a14);
    color: var(--ames-tx-e5edf7); border-radius: 8px; width: 34px; height: 34px;
    font-size: 15px; cursor: pointer; margin-right: 10px; line-height: 1;
    display: inline-flex; align-items: center; justify-content: center;
    transition: background .12s, border-color .12s;
}
.ames-theme-toggle:hover { background: rgba(255,255,255,.14); }
html[data-theme="light"] .ames-theme-toggle { background: var(--ames-chrome-hover); border-color: var(--ames-chrome-border); color: var(--ames-chrome-text); }
html[data-theme="light"] .ames-theme-toggle:hover { background: rgba(37,99,235,.18); }

/* Warehouse location hierarchy directory */
.wh-location-directory-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.wh-location-directory-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
    gap: 14px;
    padding: 0 14px 16px;
    align-items: start;
}

.wh-location-directory {
    min-width: 0;
    border: 1px solid rgba(148,163,184,.2);
    border-radius: 8px;
    background: rgba(15,23,42,.36);
    overflow: hidden;
}

.wh-location-directory-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 13px 15px;
    border-bottom: 1px solid rgba(148,163,184,.16);
    background: rgba(30,41,59,.55);
}

.wh-location-directory-head > div {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.wh-location-directory-head span:first-child {
    color: var(--ames-tx-blue-300);
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.wh-location-directory-head strong {
    color: var(--ames-tx-slate-50);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: .92rem;
}

.wh-location-directory-head > span {
    flex: 0 0 auto;
    color: var(--ames-tx-slate-300);
    font-family: var(--ames-font-mono);
    font-size: .74rem;
    font-weight: 700;
}

.wh-location-directory-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 12px;
    padding: 14px;
}

.wh-location-directory-card {
    position: relative;
    min-height: 164px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    width: 100%;
    padding: 16px 42px 16px 16px;
    color: var(--ames-tx-slate-200);
    font: inherit;
    text-align: left;
    border: 1px solid rgba(148,163,184,.23);
    border-radius: 8px;
    background: linear-gradient(145deg, var(--ames-sf-1e293b-a88), var(--ames-sf-0f172a-a78));
    cursor: pointer;
    transition: border-color .14s ease, background .14s ease, transform .14s ease;
}

.wh-location-directory-card:hover {
    border-color: rgba(96,165,250,.78);
    background: linear-gradient(145deg, rgba(30,64,175,.36), var(--ames-sf-0f172a-a84));
    transform: translateY(-1px);
}

.wh-location-directory-card.highlighted {
    border-color: #38bdf8;
    box-shadow: 0 0 0 2px rgba(56,189,248,.22);
}

.wh-location-directory-card.location.stocked { border-color: rgba(74,222,128,.52); }
.wh-location-directory-card.location.mixed { border-color: rgba(251,191,36,.62); }
.wh-location-directory-card.location.empty { border-color: rgba(148,163,184,.28); }

.wh-location-directory-code {
    color: var(--ames-tx-sky-300);
    font-family: var(--ames-font-mono);
    font-size: 1.02rem;
    font-weight: 900;
}

.wh-location-directory-card strong {
    min-width: 0;
    overflow: hidden;
    color: var(--ames-tx-slate-50);
    font-size: .92rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.wh-location-directory-summary {
    color: var(--ames-tx-slate-400);
    font-size: .77rem;
}

.wh-location-directory-qty {
    margin-top: auto;
    color: var(--ames-tx-slate-50);
    font-family: var(--ames-font-mono);
    font-size: .77rem;
    font-weight: 800;
}

.wh-location-directory-arrow {
    position: absolute;
    right: 14px;
    bottom: 14px;
    color: var(--ames-tx-sky-300);
    font-size: 1.15rem;
}

.wh-location-directory-status {
    position: absolute;
    top: 14px;
    right: 14px;
    padding: 3px 7px;
    border: 1px solid rgba(148,163,184,.26);
    border-radius: 999px;
    color: var(--ames-tx-slate-300);
    font-size: .67rem;
    font-weight: 800;
}

.wh-location-directory-card.location.stocked .wh-location-directory-status { color: var(--ames-tx-green-300); border-color: rgba(74,222,128,.4); }
.wh-location-directory-card.location.mixed .wh-location-directory-status { color: var(--ames-tx-amber-300); border-color: rgba(251,191,36,.46); }

html[data-theme="light"] .wh-location-directory { background: var(--ames-surface); border-color: var(--ames-border); }
html[data-theme="light"] .wh-location-directory-head { background: var(--ames-surface-3); border-bottom-color: var(--ames-border-soft); }
html[data-theme="light"] .wh-location-directory-head strong,
html[data-theme="light"] .wh-location-directory-card strong,
html[data-theme="light"] .wh-location-directory-qty { color: var(--ames-text); }
html[data-theme="light"] .wh-location-directory-head > span,
html[data-theme="light"] .wh-location-directory-summary { color: var(--ames-text-dim); }
html[data-theme="light"] .wh-location-directory-card { color: var(--ames-text); background: linear-gradient(145deg, var(--ames-surface), var(--ames-surface-2)); border-color: var(--ames-border); }
html[data-theme="light"] .wh-location-directory-card:hover { background: rgba(37,99,235,.08); }

@media (max-width: 980px) {
    .wh-location-directory-workspace { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
    .wh-location-directory-grid { grid-template-columns: 1fr; }
    .wh-location-directory-card { min-height: 142px; }
}

/* Finished goods web workspaces */
.fg-web-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.master-list-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
}

.master-list-toolbar > span { white-space: nowrap; }
.inventory-summary-grid .rz-data-row { cursor: pointer; }

.fg-web-form-grid,
.fg-return-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.fg-location-modal,
.fg-return-modal { width: min(720px, calc(100vw - 32px)); }

.fg-map-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
    gap: 14px;
    padding: 0 14px 16px;
    align-items: start;
}

.fg-map-board,
.fg-map-inventory {
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(148,163,184,.2);
    border-radius: 8px;
    background: rgba(15,23,42,.36);
}

.fg-map-board-head,
.fg-map-inventory-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 13px 15px;
    border-bottom: 1px solid rgba(148,163,184,.16);
    background: rgba(30,41,59,.55);
}

.fg-map-board-head > div,
.fg-map-inventory-head > div { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.fg-map-board-head span,
.fg-map-inventory-head span { color: var(--ames-tx-blue-300); font-size: .7rem; font-weight: 800; }
.fg-map-board-head strong,
.fg-map-inventory-head strong { overflow: hidden; color: var(--ames-tx-slate-50); font-size: .9rem; text-overflow: ellipsis; white-space: nowrap; }
.fg-map-board-head > span,
.fg-map-inventory-head > span { flex: 0 0 auto; color: var(--ames-tx-slate-300); font-family: var(--ames-font-mono); }

.fg-coordinate-scroll { overflow: auto; padding: 14px; }
.fg-coordinate-grid { display: grid; gap: 8px; min-width: max-content; }
.fg-axis-corner,
.fg-axis-label { display: flex; min-height: 34px; align-items: center; justify-content: center; color: var(--ames-tx-blue-300); font-size: .72rem; font-weight: 800; }

.fg-map-cell {
    position: relative;
    display: flex;
    min-height: 94px;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
    padding: 12px;
    color: var(--ames-tx-slate-200);
    font: inherit;
    text-align: left;
    border: 1px solid rgba(148,163,184,.25);
    border-radius: 8px;
    background: var(--ames-sf-1e293b-a72);
    cursor: pointer;
}
.fg-map-cell:hover { border-color: #60a5fa; background: rgba(30,64,175,.26); }
.fg-map-cell.occupied { border-color: rgba(74,222,128,.55); background: rgba(21,128,61,.16); }
.fg-map-cell.full { border-color: rgba(251,191,36,.62); background: rgba(180,83,9,.17); }
.fg-map-cell.inactive { opacity: .55; }
.fg-map-cell.selected { border-color: #38bdf8; box-shadow: 0 0 0 2px rgba(56,189,248,.25); }
.fg-map-cell.missing { border-style: dashed; background: transparent; cursor: default; }
.fg-map-cell strong { color: var(--ames-tx-sky-300); font-family: var(--ames-font-mono); font-size: .8rem; }
.fg-map-cell span { overflow: hidden; width: 100%; color: var(--ames-tx-slate-400); font-size: .72rem; text-overflow: ellipsis; white-space: nowrap; }
.fg-map-cell b { margin-top: auto; align-self: flex-end; color: var(--ames-tx-slate-50); font-family: var(--ames-font-mono); font-size: .8rem; }

.fg-stock-list { display: flex; max-height: 560px; flex-direction: column; gap: 8px; overflow: auto; padding: 12px; }
.fg-stock-row { display: flex; flex-direction: column; gap: 8px; padding: 11px 12px; border: 1px solid rgba(148,163,184,.2); border-radius: 8px; background: rgba(30,41,59,.55); }
.fg-stock-row > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.fg-stock-row strong { color: var(--ames-tx-slate-200); font-size: .8rem; }
.fg-stock-row span { min-width: 0; overflow: hidden; color: var(--ames-tx-slate-400); font-size: .72rem; text-overflow: ellipsis; white-space: nowrap; }
.fg-stock-row b { flex: 0 0 auto; color: var(--ames-tx-slate-50); font-family: var(--ames-font-mono); font-size: .76rem; }

.fg-empty-state { display: flex; min-height: 260px; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 24px; color: var(--ames-tx-slate-400); text-align: center; }
.fg-empty-state.small { min-height: 180px; }
.fg-empty-state .rzi { color: var(--ames-tx-blue-400); font-size: 2rem; }

.fg-return-grid .rz-data-row { cursor: pointer; }
.fg-return-detail-grid > div { display: flex; min-width: 0; flex-direction: column; gap: 5px; padding: 10px 12px; border: 1px solid rgba(148,163,184,.18); border-radius: 7px; background: rgba(15,23,42,.34); }
.fg-return-detail-grid span { color: var(--ames-tx-blue-300); font-size: .68rem; font-weight: 800; text-transform: uppercase; }
.fg-return-detail-grid strong { overflow-wrap: anywhere; color: var(--ames-tx-slate-50); font-size: .82rem; }
.fg-return-json { margin-top: 12px; }
.fg-return-json > span { color: var(--ames-tx-blue-300); font-size: .68rem; font-weight: 800; }
.fg-return-json pre { max-height: 180px; margin: 6px 0 0; overflow: auto; padding: 11px; color: var(--ames-tx-slate-300); font-size: .72rem; white-space: pre-wrap; border: 1px solid rgba(148,163,184,.18); border-radius: 7px; background: var(--ames-sf-07101f); }

html[data-theme="light"] .fg-map-board,
html[data-theme="light"] .fg-map-inventory { background: var(--ames-surface); border-color: var(--ames-border); }
html[data-theme="light"] .fg-map-board-head,
html[data-theme="light"] .fg-map-inventory-head { background: var(--ames-surface-3); border-bottom-color: var(--ames-border-soft); }
html[data-theme="light"] .fg-map-board-head strong,
html[data-theme="light"] .fg-map-inventory-head strong,
html[data-theme="light"] .fg-map-cell b,
html[data-theme="light"] .fg-stock-row strong,
html[data-theme="light"] .fg-stock-row b,
html[data-theme="light"] .fg-return-detail-grid strong { color: var(--ames-text); }
html[data-theme="light"] .fg-map-cell,
html[data-theme="light"] .fg-stock-row,
html[data-theme="light"] .fg-return-detail-grid > div { background: var(--ames-surface-2); border-color: var(--ames-border); }
html[data-theme="light"] .fg-map-cell.occupied { background: rgba(22,163,74,.09); }
html[data-theme="light"] .fg-map-cell.full { background: rgba(217,119,6,.1); }
html[data-theme="light"] .fg-return-json pre { color: var(--ames-text); background: var(--ames-surface-2); border-color: var(--ames-border); }

@media (max-width: 980px) {
    .fg-map-workspace { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
    .fg-web-form-grid,
    .fg-return-detail-grid { grid-template-columns: 1fr; }
    .fg-web-toolbar .rz-stack { width: 100%; }
}

/* ── PP-OEE 라이트 테마 ─────────────────────────────────────────── */
html[data-theme="light"] .pp-oee-track { background: rgba(80,60,20,.10); }
html[data-theme="light"] .pp-oee-loss-row { border-bottom-color: var(--ames-border-soft); }
html[data-theme="light"] .pp-oee-loss-cat { color: var(--ames-text-dim); }
html[data-theme="light"] .pp-oee-pill.wc { background: #d1fae5; color: #065f46; }
html[data-theme="light"] .pp-oee-pill.ok { background: #fef3c7; color: #92400e; }
html[data-theme="light"] .pp-oee-pill.lo { background: #fee2e2; color: #991b1b; }
html[data-theme="light"] .pp-oee-donut-wrap.wc { color: #059669; }
html[data-theme="light"] .pp-oee-donut-wrap.ok { color: #b45309; }
html[data-theme="light"] .pp-oee-donut-wrap.lo { color: #dc2626; }
html[data-theme="light"] .pp-oee-donut-track { stroke: rgba(80,60,20,.10); }

/* PP-OEE 그리드: 낮은 행 높이 (ames-rz-grid 테마 위 오버라이드) */
.ames-rz-grid.pp-oee-lines .rz-data-cell { padding: 4px 10px !important; font-size: 12px; }
.ames-rz-grid.pp-oee-lines .rz-column-title { font-size: calc(11px + var(--ames-fs-bump)); }
.pp-oee-lines .pp-oee-pill { padding: 1px 9px; font-size: calc(11px + var(--ames-fs-bump)); }

/* PP-OEE RadzenChart: 축·범례 글자, 격자선 (다크 기본 / 라이트 오버라이드) */
.pp-oee-chart .rz-tick-text, .mnt-oee-chart .rz-tick-text, .rpt-dp-chart .rz-tick-text,
.pp-oee-chart .rz-legend-item-text, .mnt-oee-chart .rz-legend-item-text, .rpt-dp-chart .rz-legend-item-text { fill: #94a3b8; font-size: calc(11px + var(--ames-fs-bump)); }
.pp-oee-chart .rz-grid-line, .mnt-oee-chart .rz-grid-line, .rpt-dp-chart .rz-grid-line { stroke: rgba(148,163,184,.25); }
html[data-theme="light"] .pp-oee-chart .rz-tick-text, html[data-theme="light"] .mnt-oee-chart .rz-tick-text, html[data-theme="light"] .rpt-dp-chart .rz-tick-text, .rpt-dp-chart .rz-tick-text,
html[data-theme="light"] .pp-oee-chart .rz-legend-item-text, html[data-theme="light"] .mnt-oee-chart .rz-legend-item-text, .rpt-dp-chart .rz-legend-item-text { fill: var(--ames-text-dim); }
html[data-theme="light"] .pp-oee-chart .rz-grid-line, html[data-theme="light"] .mnt-oee-chart .rz-grid-line, .rpt-dp-chart .rz-grid-line { stroke: rgba(80,60,20,.18); }

/* PP-DTL 비가동 이력 그리드: 낮은 행 높이 */
.ames-rz-grid.pp-dtl-grid .rz-data-cell { padding: 4px 10px !important; font-size: 12px; }
.ames-rz-grid.pp-dtl-grid .rz-column-title { font-size: calc(11px + var(--ames-fs-bump)); }

/* PP-ODM 모니터 보강: 유휴 상태 · 라인명 · 라이트 테마 */
.odm-line-name    { font-size: .72rem; color: var(--ames-tx-slate-400); }
.odm-badge-idle   { background: rgba(245,158,11,.16); color: var(--ames-tx-amber-400); }
.odm-tl-idle      { background: rgba(245,158,11,.6); }
a.odm-alert-chip  { text-decoration: none; }
html[data-theme="light"] .odm-card { background: var(--ames-surface); border-color: var(--ames-border); }
html[data-theme="light"] .odm-line-id { color: var(--ames-text); }
html[data-theme="light"] .odm-line-name,
html[data-theme="light"] .odm-day-stats,
html[data-theme="light"] .odm-tl-axis { color: var(--ames-text-dim); }
html[data-theme="light"] .odm-tl-wrap { border-color: var(--ames-border-soft); }
html[data-theme="light"] .odm-tl-empty { background: rgba(80,60,20,.06); }
html[data-theme="light"] .odm-tl-plan { background: rgba(80,60,20,.18); }
html[data-theme="light"] .odm-badge-unknown { background: rgba(80,60,20,.08); color: var(--ames-text-dim); }
html[data-theme="light"] .odm-edit-info { background: var(--ames-surface-3); color: var(--ames-text); }

/* PP-OTD 납기 준수율: 지연 행 강조 · 진척 막대 */
.ames-rz-grid tr.otd-row-late .rz-data-cell { background: rgba(239,68,68,.06) !important; }
.ames-rz-grid tr.otd-row-late .rz-data-cell:first-child { box-shadow: inset 2px 0 0 rgba(239,68,68,.55); }
.otd-fill-ok  { background: #22c55e; }
.otd-fill-bad { background: #ef4444; }
html[data-theme="light"] .ames-rz-grid tr.otd-row-late .rz-data-cell { background: rgba(220,38,38,.07) !important; }
/* Shared warehouse / finished-goods location explorer */
.location-explorer {
    height: calc(100dvh - 88px);
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid rgba(148,163,184,.22);
    border-radius: 8px;
    background: rgba(15,23,42,.36);
}

.location-explorer-topbar {
    min-height: 52px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 9px 12px;
    border-bottom: 1px solid rgba(148,163,184,.2);
    background: rgba(30,41,59,.55);
}

.location-explorer-breadcrumb,
.location-explorer-actions,
.location-map-tools,
.location-map-legend,
.location-map-zoom,
.location-search-row {
    display: flex;
    align-items: center;
}

.location-explorer-breadcrumb { min-width: 0; gap: 7px; overflow: auto; }
.location-explorer-breadcrumb > span { color: #475569; }
.location-explorer-breadcrumb button {
    flex: 0 0 auto;
    padding: 4px 7px;
    color: var(--ames-tx-slate-400);
    font: 800 .72rem var(--ames-font-mono);
    border: 0;
    background: transparent;
    cursor: pointer;
}
.location-explorer-breadcrumb button:hover:not(:disabled),
.location-explorer-breadcrumb button.active { color: var(--ames-tx-sky-300); }
.location-explorer-breadcrumb button:disabled { opacity: .42; cursor: default; }

.location-explorer-actions { flex: 0 0 auto; gap: 8px; }
.location-action,
.location-search-button,
.location-reset-button {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 0 12px;
    color: #f8fafc;
    font: 800 .7rem var(--ames-font-mono);
    letter-spacing: .04em;
    border: 1px solid #2563eb;
    border-radius: 5px;
    background: #1d4ed8;
    cursor: pointer;
}
.location-action:hover,
.location-search-button:hover { background: #2563eb; }
.location-action.secondary,
.location-reset-button { color: #cbd5e1; border-color: rgba(148,163,184,.32); background: rgba(30,41,59,.55); }

.location-explorer-workspace {
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 3fr) minmax(360px, 2fr);
}
.location-explorer-workspace.selection-only { grid-template-columns: minmax(0, 1fr); }
.location-explorer-workspace.selection-only .location-map-pane { border-right: 0; }
.location-explorer-workspace.selection-only .location-stage { display: grid; align-items: center; }
.location-explorer-workspace.selection-only .location-stage-grid {
    width: 100%;
    min-height: 0;
    grid-auto-rows: minmax(170px, 270px);
}

.location-map-pane,
.location-detail-pane { min-width: 0; min-height: 0; }
.location-map-pane { border-right: 1px solid rgba(148,163,184,.2); }
.location-stage { height: 100%; min-height: 0; padding: clamp(22px, 4vh, 48px); overflow: auto; }
.location-stage-grid {
    min-height: 100%;
    display: grid;
    grid-template-columns: repeat(var(--location-stage-columns), minmax(150px, 260px));
    grid-auto-rows: minmax(170px, 1fr);
    align-content: center;
    justify-content: center;
    gap: clamp(18px, 2.5vw, 34px);
}

.location-stage-card {
    min-width: 0;
    max-height: 270px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 9px;
    padding: 24px;
    color: var(--ames-tx-slate-200);
    text-align: left;
    border: 1px solid rgba(148,163,184,.28);
    border-radius: 7px;
    background: linear-gradient(145deg, var(--ames-sf-1e293b-a90), var(--ames-sf-0f172a-a82));
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease, transform .15s ease;
}
.location-stage-card:hover,
.location-stage-card:focus-visible {
    border-color: #60a5fa;
    background: linear-gradient(145deg, rgba(30,64,175,.34), var(--ames-sf-0f172a-a86));
    outline: 0;
    transform: translateY(-2px);
}
.location-stage-card > span { color: var(--ames-tx-sky-300); font: 900 .68rem var(--ames-font-mono); letter-spacing: .08em; text-transform: uppercase; }
.location-stage-card > strong { max-width: 100%; overflow: hidden; color: var(--ames-tx-slate-50); font-size: clamp(1rem, 1.5vw, 1.35rem); text-overflow: ellipsis; white-space: nowrap; }
.location-stage-card > small { color: var(--ames-tx-slate-400); font-size: .76rem; }
.location-stage-card > b { margin-top: 12px; color: var(--ames-tx-green-300); font: 900 1.15rem var(--ames-font-mono); }
.location-stage-card > b em { color: var(--ames-tx-slate-500); font-size: .62rem; font-style: normal; }

.location-map-view { height: 100%; min-height: 0; display: grid; grid-template-rows: auto minmax(0, 1fr); }
.location-map-heading {
    min-height: 58px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 13px;
    border-bottom: 1px solid rgba(148,163,184,.18);
}
.location-map-heading > div:first-child { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.location-map-heading > div:first-child span { overflow: hidden; color: var(--ames-tx-sky-300); font: 800 .7rem var(--ames-font-mono); text-overflow: ellipsis; white-space: nowrap; }
.location-map-heading > div:first-child strong { color: var(--ames-tx-slate-50); font-size: .82rem; }
.location-map-tools { gap: 16px; }
.location-map-legend { gap: 11px; color: var(--ames-tx-slate-400); font-size: .67rem; }
.location-map-legend span { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.location-map-legend i { width: 10px; height: 10px; border: 1px solid rgba(148,163,184,.35); background: var(--ames-sf-1e293b-a70); }
.location-map-legend i.stocked { border-color: #22c55e; background: rgba(22,163,74,.25); }
.location-map-legend i.matched { border-color: #f59e0b; background: rgba(217,119,6,.24); }
.location-map-zoom { overflow: hidden; border: 1px solid rgba(148,163,184,.28); border-radius: 5px; }
.location-map-zoom button { width: 31px; height: 31px; color: var(--ames-tx-slate-200); border: 0; background: var(--ames-sf-1e293b-a75); cursor: pointer; }
.location-map-zoom button:disabled { color: #475569; cursor: default; }
.location-map-zoom span { min-width: 48px; color: var(--ames-tx-slate-300); font: 800 .66rem var(--ames-font-mono); text-align: center; }

.location-map-scroll-shell { position: relative; min-height: 0; overflow: hidden; }
.location-coordinate-scroll { width: 100%; height: 100%; min-height: 0; overflow: auto; padding: 10px; scrollbar-color: #486076 #101827; scrollbar-width: thin; }
.location-map-scroll-arrow {
    position: absolute;
    z-index: 5;
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    color: var(--ames-tx-white);
    border: 1px solid rgba(125,211,252,.72);
    border-radius: 3px;
    background: var(--ames-sf-0f172a-a90);
    box-shadow: 0 6px 18px rgba(2,6,23,.35);
    cursor: pointer;
}
.location-map-scroll-arrow[hidden] { display: none !important; }
.location-map-scroll-arrow:hover { background: #1d4ed8; }
.location-map-scroll-arrow.left { left: 12px; top: 50%; transform: translateY(-50%); }
.location-map-scroll-arrow.right { right: 12px; top: 50%; transform: translateY(-50%); }
.location-map-scroll-arrow.up { top: 12px; left: 50%; transform: translateX(-50%); }
.location-map-scroll-arrow.down { bottom: 12px; left: 50%; transform: translateX(-50%); }
.location-coordinate-map {
    min-width: max-content;
    min-height: max-content;
    display: grid;
    grid-template-columns: 48px repeat(var(--location-columns), var(--location-cell-width));
    grid-auto-rows: var(--location-cell-height);
    gap: 4px;
}
.location-axis {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #93c5fd;
    font: 900 .7rem var(--ames-font-mono);
    border: 1px solid rgba(148,163,184,.16);
    background: rgba(30,41,59,.48);
}
.location-axis.corner { color: var(--ames-tx-slate-50); }
.location-axis.row { position: sticky; left: 0; z-index: 1; }
.location-map-cell {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 6px;
    color: var(--ames-tx-slate-400);
    font: 800 .68rem var(--ames-font-mono);
    border: 1px solid rgba(148,163,184,.25);
    border-radius: 4px;
    background: var(--ames-sf-1e293b-a62);
    cursor: pointer;
}
.location-map-cell > span { width: 100%; overflow: hidden; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.location-map-cell > small { color: var(--ames-tx-green-300); font-size: .66rem; }
.location-map-cell:hover,
.location-map-cell.selected { border-color: #38bdf8; box-shadow: inset 0 0 0 1px #38bdf8; }
.location-map-cell.stocked { color: var(--ames-tx-green-200); border-color: rgba(34,197,94,.65); background: rgba(21,128,61,.2); }
.location-map-cell.warning { color: var(--ames-tx-amber-200); border-color: rgba(245,158,11,.7); background: rgba(180,83,9,.2); }
.location-map-cell.matched { color: var(--ames-tx-amber-200); border-color: #f59e0b; background: rgba(180,83,9,.28); box-shadow: inset 0 0 0 1px #f59e0b; }
.location-map-cell.missing { border-style: dashed; opacity: .28; background: transparent; }

.location-detail-pane { display: grid; grid-template-rows: auto minmax(0, 1fr); background: rgba(8,15,28,.22); }
.location-search-panel,
.location-result-panel { min-width: 0; border-bottom: 1px solid rgba(148,163,184,.18); }
.location-search-panel { padding: 12px; }
.location-search-panel > label { display: block; margin-bottom: 7px; color: var(--ames-tx-blue-300); font: 900 .66rem var(--ames-font-mono); letter-spacing: .06em; }
.location-search-row { gap: 7px; }
.location-search-input { min-width: 0; flex: 1 1 auto; width: auto !important; }
.location-search-button,
.location-reset-button { flex: 0 0 auto; }
.location-search-notice { margin-top: 8px; padding: 7px 9px; color: var(--ames-tx-green-300); font-size: .72rem; border: 1px solid rgba(34,197,94,.28); background: rgba(21,128,61,.12); }
.location-search-notice.warning { color: var(--ames-tx-amber-300); border-color: rgba(245,158,11,.35); background: rgba(180,83,9,.12); }

.location-result-panel { min-height: 0; display: grid; grid-template-rows: 48px minmax(0, 1fr); overflow: hidden; }
.location-result-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 11px; border-bottom: 1px solid rgba(148,163,184,.16); }
.location-result-heading > div { display: flex; flex-direction: column; gap: 2px; }
.location-result-heading span { overflow: hidden; color: var(--ames-tx-slate-500); font-size: .65rem; text-overflow: ellipsis; white-space: nowrap; }
.location-result-heading > div span { color: var(--ames-tx-blue-300); font-weight: 900; }
.location-result-heading strong { color: var(--ames-tx-slate-50); font-size: .75rem; }
.location-result-table-wrap { min-height: 0; overflow: auto; scrollbar-color: #486076 #101827; scrollbar-width: thin; }
.location-result-table { width: 100%; border-collapse: collapse; table-layout: fixed; color: var(--ames-tx-dbe5ef); font-size: .67rem; }
.location-result-table th { position: sticky; top: 0; z-index: 2; padding: 8px 6px; color: var(--ames-tx-blue-300); background: var(--ames-sf-172238); text-align: left; text-transform: uppercase; }
.location-result-table td { padding: 7px 6px; overflow: hidden; border-bottom: 1px solid rgba(148,163,184,.13); text-overflow: ellipsis; white-space: nowrap; }
.location-result-table th:nth-child(1) { width: 22%; }
.location-result-table th:nth-child(2) { width: 20%; }
.location-result-table th:nth-child(3) { width: 20%; }
.location-result-table th:nth-child(4) { width: 25%; }
.location-result-table th:nth-child(5) { width: 13%; text-align: right; }
.location-result-table td:last-child { color: var(--ames-tx-green-300); font-weight: 900; text-align: right; }
.location-result-table tbody tr { cursor: pointer; }
.location-result-table tbody tr:hover { background: rgba(30,64,175,.2); }
.location-result-table tbody tr.selected { background: rgba(14,116,144,.24); box-shadow: inset 3px 0 #38bdf8; }
.location-empty,
.location-empty-result { color: var(--ames-tx-slate-500); text-align: center; }
.location-empty { display: flex; min-height: 240px; align-items: center; justify-content: center; padding: 24px; }
.location-empty-result { padding: 28px 10px !important; }

@keyframes location-panel-in {
    from { opacity: 0; transform: translateY(7px); }
    to { opacity: 1; transform: translateY(0); }
}
.location-panel-enter { animation: location-panel-in .2s ease-out; }

html[data-theme="light"] .location-explorer,
html[data-theme="light"] .location-map-pane,
html[data-theme="light"] .location-detail-pane { background: var(--ames-surface); border-color: var(--ames-border); }
html[data-theme="light"] .location-explorer-topbar,
html[data-theme="light"] .location-map-heading { background: var(--ames-surface-3); border-color: var(--ames-border-soft); }
html[data-theme="light"] .location-stage-card,
html[data-theme="light"] .location-axis,
html[data-theme="light"] .location-map-cell { color: var(--ames-text-dim); border-color: var(--ames-border); background: var(--ames-surface-2); }
html[data-theme="light"] .location-stage-card:hover { background: rgba(37,99,235,.08); }
html[data-theme="light"] .location-stage-card > strong,
html[data-theme="light"] .location-map-heading strong,
html[data-theme="light"] .location-result-heading strong { color: var(--ames-text); }
html[data-theme="light"] .location-map-cell.stocked { color: #15803d; border-color: rgba(22,163,74,.55); background: rgba(22,163,74,.1); }
html[data-theme="light"] .location-map-cell.warning,
html[data-theme="light"] .location-map-cell.matched { color: #b45309; border-color: rgba(217,119,6,.65); background: rgba(217,119,6,.12); }
html[data-theme="light"] .location-result-table { color: var(--ames-text); }
html[data-theme="light"] .location-result-table th { color: var(--ames-accent); background: var(--ames-surface-3); }
html[data-theme="light"] .location-result-table td { border-color: var(--ames-border-soft); }
html[data-theme="light"] .location-result-table tbody tr:hover { background: rgba(37,99,235,.08); }
html[data-theme="light"] .location-result-table tbody tr.selected { background: rgba(37,99,235,.12); }

.inventory-lookup {
    min-height: calc(100vh - 190px);
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 12px;
}
.inventory-filter-panel {
    display: grid;
    grid-template-columns: 160px 190px minmax(260px, 1fr) auto auto;
    align-items: end;
    gap: 10px;
    padding: 14px;
    border: 1px solid rgba(148,163,184,.22);
    background: rgba(15,23,42,.36);
}
.inventory-filter-field { min-width: 0; display: grid; gap: 6px; }
.inventory-filter-field label { color: var(--ames-tx-blue-300); font: 900 .68rem var(--ames-font-mono); letter-spacing: .05em; }
.inventory-filter-field input,
.inventory-filter-field select {
    width: 100%;
    height: 36px;
    padding: 0 10px;
    color: var(--ames-tx-slate-200);
    border: 1px solid rgba(148,163,184,.3);
    border-radius: 3px;
    outline: 0;
    background: var(--ames-sf-080f1c-a72);
}
.inventory-filter-field select { cursor: pointer; }
.inventory-filter-field input:focus,
.inventory-filter-field select:focus { border-color: #3b82f6; }
.inventory-filter-field input:disabled { color: #94a3b8; opacity: 1; background: rgba(30,41,59,.55); }
.inventory-search-button,
.inventory-reset-button {
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 0 15px;
    color: #fff;
    font: 800 .72rem var(--ames-font-mono);
    border: 1px solid #2563eb;
    border-radius: 3px;
    background: #1d4ed8;
    cursor: pointer;
}
.inventory-reset-button { color: var(--ames-tx-slate-300); border-color: rgba(148,163,184,.34); background: var(--ames-sf-1e293b-a60); }
.inventory-table-panel { min-width: 0; min-height: 0; border: 1px solid rgba(148,163,184,.22); background: rgba(15,23,42,.36); }
.inventory-table-panel > header { min-height: 40px; display: flex; align-items: center; justify-content: space-between; padding: 0 12px; border-bottom: 1px solid rgba(148,163,184,.2); }
.inventory-table-panel > header span { color: var(--ames-tx-blue-300); font: 900 .7rem var(--ames-font-mono); letter-spacing: .05em; }
.inventory-table-panel > header strong { color: var(--ames-tx-slate-400); font-size: .72rem; }
.inventory-table-scroll { min-height: 0; overflow: auto; }
.inventory-summary-panel { display: grid; grid-template-rows: auto minmax(0, 1fr); overflow: hidden; }
.inventory-lookup-table { width: 100%; min-width: 880px; border-collapse: collapse; color: var(--ames-tx-dbe5ef); font-size: .74rem; }
.inventory-lookup-table th { position: sticky; top: 0; z-index: 1; padding: 9px 10px; color: var(--ames-tx-blue-300); text-align: left; border-right: 1px solid rgba(148,163,184,.13); background: var(--ames-sf-172238); }
.inventory-lookup-table td { padding: 8px 10px; overflow: hidden; border-top: 1px solid rgba(148,163,184,.13); border-right: 1px solid rgba(148,163,184,.1); text-overflow: ellipsis; white-space: nowrap; }
.inventory-lookup-table tbody tr { cursor: pointer; }
.inventory-lookup-table tbody tr:hover { background: rgba(30,64,175,.18); }
.inventory-lookup-table tbody tr.selected { background: rgba(14,116,144,.24); box-shadow: inset 3px 0 #38bdf8; }
.inventory-lookup-table .number { text-align: right; font-family: var(--ames-font-mono); }
.inventory-status { display: inline-block; padding: 2px 7px; color: var(--ames-tx-green-300); border: 1px solid rgba(34,197,94,.45); background: rgba(21,128,61,.14); }
.inventory-no-results { padding: 28px !important; color: var(--ames-tx-slate-500); text-align: center; }
.inventory-detail-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: flex;
    justify-content: flex-end;
    background: rgba(2,6,23,.52);
    animation: inventory-fade-in .16s ease-out;
}
.inventory-detail-drawer {
    width: min(560px, 92vw);
    height: 100%;
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr);
    color: var(--ames-tx-dbe5ef);
    border-left: 1px solid rgba(96,165,250,.45);
    background: var(--ames-sf-111c30);
    box-shadow: -16px 0 38px rgba(2,6,23,.38);
    animation: inventory-drawer-in .2s ease-out;
}
.inventory-drawer-header {
    min-height: 104px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 22px;
    border-bottom: 1px solid rgba(148,163,184,.2);
}
.inventory-drawer-header > div { min-width: 0; display: grid; gap: 5px; }
.inventory-drawer-header span { color: var(--ames-tx-sky-300); font: 900 .68rem var(--ames-font-mono); letter-spacing: .07em; }
.inventory-drawer-header strong { color: var(--ames-tx-slate-50); font: 900 1.05rem var(--ames-font-mono); }
.inventory-drawer-header small { overflow: hidden; color: var(--ames-tx-slate-400); font-size: .8rem; text-overflow: ellipsis; white-space: nowrap; }
.inventory-drawer-header button {
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    color: var(--ames-tx-slate-300);
    border: 1px solid rgba(148,163,184,.32);
    border-radius: 3px;
    background: var(--ames-sf-1e293b-a72);
    cursor: pointer;
}
.inventory-drawer-summary { display: grid; grid-template-columns: repeat(3, 1fr); border-bottom: 1px solid rgba(148,163,184,.2); }
.inventory-drawer-summary.inventory-detail-summary { grid-template-columns: repeat(2, 1fr); }
.inventory-drawer-summary > div { display: grid; gap: 5px; padding: 16px 18px; border-right: 1px solid rgba(148,163,184,.16); }
.inventory-drawer-summary > div:last-child { border-right: 0; }
.inventory-drawer-summary span { color: var(--ames-tx-slate-500); font: 800 .62rem var(--ames-font-mono); }
.inventory-drawer-summary strong { color: var(--ames-tx-slate-200); font: 900 .86rem var(--ames-font-mono); }
.inventory-drawer-table-wrap { min-height: 0; overflow: auto; }
.inventory-drawer-table { min-width: 520px; }
.inventory-drawer-table th:nth-child(1) { width: 28%; }
.inventory-drawer-table th:nth-child(2) { width: 14%; }
.inventory-drawer-table th:nth-child(3) { width: 34%; }
.inventory-drawer-table th:nth-child(4) { width: 24%; text-align: right; }
.location-drawer-table { min-width: 520px; }
.location-drawer-table th:nth-child(1) { width: 24%; }
.location-drawer-table th:nth-child(2) { width: 24%; }
.location-drawer-table th:nth-child(3) { width: 34%; }
.location-drawer-table th:nth-child(4) { width: 18%; text-align: right; }
@keyframes inventory-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes inventory-drawer-in { from { transform: translateX(100%); } to { transform: translateX(0); } }

html[data-theme="light"] .inventory-filter-panel,
html[data-theme="light"] .inventory-table-panel { border-color: var(--ames-border); background: var(--ames-surface); }
html[data-theme="light"] .inventory-filter-field input,
html[data-theme="light"] .inventory-filter-field select { color: var(--ames-text); border-color: var(--ames-border); background: #fff; }
html[data-theme="light"] .inventory-filter-field input:disabled { color: var(--ames-text-dim); background: var(--ames-surface-3); }
html[data-theme="light"] .inventory-lookup-table { color: var(--ames-text); }
html[data-theme="light"] .inventory-lookup-table th { color: var(--ames-accent); background: var(--ames-surface-3); }
html[data-theme="light"] .inventory-lookup-table td { border-color: var(--ames-border-soft); }
html[data-theme="light"] .inventory-lookup-table tbody tr:hover { background: rgba(37,99,235,.08); }
html[data-theme="light"] .inventory-lookup-table tbody tr.selected { background: rgba(37,99,235,.12); }
html[data-theme="light"] .inventory-detail-backdrop { background: rgba(15,23,42,.3); }
html[data-theme="light"] .inventory-detail-drawer { color: var(--ames-text); border-color: rgba(37,99,235,.35); background: var(--ames-surface); }
html[data-theme="light"] .inventory-drawer-header,
html[data-theme="light"] .inventory-drawer-summary { border-color: var(--ames-border); }
html[data-theme="light"] .inventory-drawer-header strong,
html[data-theme="light"] .inventory-drawer-summary strong { color: var(--ames-text); }
html[data-theme="light"] .inventory-drawer-header button { color: var(--ames-text-dim); border-color: var(--ames-border); background: var(--ames-surface-3); }
html[data-theme="light"] .location-map-scroll-arrow { color: #1d4ed8; border-color: rgba(37,99,235,.5); background: rgba(255,255,255,.94); }
html[data-theme="light"] .location-map-scroll-arrow:hover { color: #fff; background: #2563eb; }

@media (max-width: 1100px) {
    .location-explorer-workspace { grid-template-columns: minmax(0, 1fr) 360px; }
    .location-map-legend { display: none; }
    .inventory-filter-panel { grid-template-columns: 1fr 1fr; }
    .inventory-filter-field:not(.compact) { grid-column: 1 / -1; }
}

@media (max-width: 850px) {
    .location-explorer { min-height: 0; }
    .location-explorer-workspace { min-height: auto; grid-template-columns: 1fr; }
    .location-map-pane { border-right: 0; border-bottom: 1px solid rgba(148,163,184,.2); }
    .location-stage,
    .location-map-view { min-height: 0; }
}

@media (max-width: 640px) {
    .location-explorer-topbar { align-items: flex-start; flex-direction: column; }
    .location-explorer-actions { align-self: flex-end; }
    .location-stage { padding: 18px; }
    .location-stage-grid { grid-template-columns: 1fr; grid-auto-rows: minmax(150px, auto); }
    .location-search-row { align-items: stretch; flex-wrap: wrap; }
    .location-search-input { flex-basis: 100%; }
    .location-search-button,
    .location-reset-button { flex: 1 1 0; }
    .location-panel-enter { animation: none; }
}

/* MNT-003 OEE 분석: 설비 행 스파크라인(최근 6구간 OEE) */
.mnt-oee-spark { display: inline-flex; align-items: flex-end; gap: 2px; height: 22px; width: 110px; vertical-align: middle; }
.mnt-oee-spark i { flex: 1; background: #6ee7b7; border-radius: 1px; min-height: 2px; opacity: .8; }
.mnt-oee-spark i.last { background: #059669; opacity: 1; }
.mnt-oee-spark i.empty { background: transparent; }

/* MNT-006 비가동 이력: 파레토/순위 막대 */
.mnt-dt-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 1100px) { .mnt-dt-grid2 { grid-template-columns: 1fr; } }
.mnt-dt-row { display: grid; grid-template-columns: 150px 1fr 110px; align-items: center; gap: 10px; padding: 6px 4px; border-bottom: 1px solid rgba(148,163,184,.15); font-size: 12px; }
.mnt-dt-row.link { cursor: pointer; }
.mnt-dt-row.link:hover { background: rgba(52,211,153,.08); }
.mnt-dt-row.sel { background: rgba(52,211,153,.14); }
.mnt-dt-row .lbl { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mnt-dt-row .sub { display: block; font-size: calc(10px + var(--ames-fs-bump)); opacity: .6; }
.mnt-dt-track { height: 14px; background: rgba(148,163,184,.18); border-radius: 3px; overflow: hidden; }
.mnt-dt-fill { height: 100%; border-radius: 3px; }
.mnt-dt-val { text-align: right; font-family: var(--ames-font-code); font-size: 11.5px; white-space: nowrap; }
html[data-theme="light"] .mnt-dt-row { border-bottom-color: rgba(80,60,20,.12); }
html[data-theme="light"] .mnt-dt-track { background: rgba(80,60,20,.10); }

/* MNT-009 대시보드 패널 (3열 그리드) */
.mnt-db-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 1400px) { .mnt-db-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 900px)  { .mnt-db-grid { grid-template-columns: minmax(0, 1fr); } }
.mnt-db-grid .ames-card { margin-bottom: 0; min-height: 230px; display: flex; flex-direction: column; }
.mnt-db-hint { font-size: calc(10px + var(--ames-fs-bump)); opacity: .6; white-space: nowrap; font-weight: 400; }
.mnt-db-donut-wrap { display: flex; align-items: center; gap: 22px; padding: 6px 4px; }
.mnt-db-donut { width: 150px; height: 150px; border-radius: 50%; position: relative; flex: 0 0 150px; }
.mnt-db-donut::after { content: ""; position: absolute; inset: 24px; border-radius: 50%; background: var(--ames-sf-0d1a2e); }
.mnt-db-donut .c { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; z-index: 1; }
.mnt-db-donut .c b { font-size: 26px; line-height: 1; }
.mnt-db-donut .c span { font-size: calc(10px + var(--ames-fs-bump)); opacity: .6; margin-top: 3px; }
.mnt-db-legend { flex: 1; display: flex; flex-direction: column; gap: 8px; font-size: 12.5px; }
.mnt-db-legend div { display: flex; align-items: center; gap: 8px; }
.mnt-db-legend i { width: 11px; height: 11px; border-radius: 2px; flex: 0 0 11px; }
.mnt-db-legend .v { margin-left: auto; font-family: var(--ames-font-code); font-size: 11.5px; white-space: nowrap; }
.mnt-db-list { display: flex; flex-direction: column; }
.mnt-db-row { display: flex; align-items: center; gap: 8px; padding: 7px 2px; border-bottom: 1px solid rgba(148,163,184,.15); font-size: 12.5px; }
.mnt-db-row:last-child { border-bottom: 0; }
.mnt-db-row .dot { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 8px; }
.mnt-db-row .t { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mnt-db-row .t small { opacity: .6; margin-left: 6px; }
.mnt-db-row .r { font-family: var(--ames-font-code); font-size: calc(11px + var(--ames-fs-bump)); opacity: .7; white-space: nowrap; }
a.mnt-db-row.link { color: inherit; text-decoration: none; border-radius: 4px; }
a.mnt-db-row.link:hover { background: rgba(148,163,184,.10); }
.mnt-db-row .pill { white-space: nowrap; }
/* MNT-002 고장 상세 — 대응 이력(발생 → 보전 도착 → ACK → 수리 완료/해결) */
.mnt-tl { margin-top: 10px; padding-top: 8px; border-top: 1px solid rgba(148,163,184,.2); }
.mnt-tl-h { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-weight: 700; margin-bottom: 6px; }
.mnt-tl-cap { margin-left: 8px; font-family: var(--ames-font-code); font-weight: 400; font-size: calc(11.5px + var(--ames-fs-bump)); opacity: .8; }
a.mnt-tl-cap { color: inherit; text-decoration: underline dotted; }
a.mnt-tl-cap:hover { opacity: 1; }
.mnt-tl-row { position: relative; display: grid; grid-template-columns: 12px 170px 130px 90px minmax(0, 1fr); align-items: center; column-gap: 8px; padding: 4px 0; font-size: 12.5px; }
.mnt-tl-row:not(:last-child)::before { content: ""; position: absolute; left: 4px; top: 15px; bottom: -6px; width: 2px; background: rgba(148,163,184,.3); }
.mnt-tl-dot { width: 10px; height: 10px; border-radius: 50%; background: #94a3b8; position: relative; z-index: 1; }
.mnt-tl-row.bad .mnt-tl-dot  { background: #dc2626; }
.mnt-tl-row.warn .mnt-tl-dot { background: #f59e0b; }
.mnt-tl-row.info .mnt-tl-dot { background: #3b82f6; }
.mnt-tl-row.ok .mnt-tl-dot   { background: #10b981; }
.mnt-tl-k { font-weight: 600; white-space: nowrap; }
.mnt-tl-at, .mnt-tl-min { font-family: var(--ames-font-code); font-size: calc(11px + var(--ames-fs-bump)); white-space: nowrap; }
.mnt-tl-min { opacity: .75; }
.mnt-tl-who { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mnt-tl-note { grid-column: 2 / -1; opacity: .8; white-space: pre-wrap; word-break: break-word; }
html[data-theme="light"] .mnt-tl { border-top-color: rgba(80,60,20,.12); }
html[data-theme="light"] a.mnt-db-row.link:hover { background: rgba(80,60,20,.06); }
.mnt-db-wo { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; padding: 6px 0 12px; }
.mnt-db-wo div { border-radius: 8px; padding: 12px 6px; text-align: center; background: rgba(148,163,184,.10); }
.mnt-db-wo b { display: block; font-size: 24px; line-height: 1; }
.mnt-db-wo span { display: block; font-size: calc(10.5px + var(--ames-fs-bump)); margin-top: 6px; opacity: .8; }
.mnt-db-wo .open  { background: rgba(148,163,184,.14); color: var(--ames-tx-slate-400); }
.mnt-db-wo .issued{ background: rgba(245,158,11,.16); color: var(--ames-tx-amber-400); }
.mnt-db-wo .prog  { background: rgba(59,130,246,.16); color: var(--ames-tx-blue-400); }
.mnt-db-wo .done  { background: rgba(16,185,129,.16); color: var(--ames-tx-emerald-400); }
.mnt-db-prog { display: flex; align-items: center; gap: 10px; font-size: 12px; }
.mnt-db-prog .mnt-dt-track { flex: 1; }
.mnt-db-empty { flex: 1; display: flex; align-items: center; justify-content: center; opacity: .5; font-size: 12px; padding: 18px 0; }
html[data-theme="light"] .mnt-db-donut::after { background: var(--ames-surface); }
html[data-theme="light"] .mnt-db-row { border-bottom-color: rgba(80,60,20,.12); }
html[data-theme="light"] .mnt-db-wo .open   { color: #475569; }
html[data-theme="light"] .mnt-db-wo .issued { color: #b45309; }
html[data-theme="light"] .mnt-db-wo .prog   { color: #1d4ed8; }
html[data-theme="light"] .mnt-db-wo .done   { color: #047857; }

/* MNT-004 금형 소진율 막대 (PP-OEE A/P/Q 막대와 같은 구조, 등급별 색) */
.mnt-mold-bar { display: flex; align-items: center; gap: 8px; min-width: 120px; }
.mnt-mold-track { flex: 1; height: 8px; border-radius: 5px; background: rgba(148,163,184,.18); overflow: hidden; }
.mnt-mold-track i { display: block; height: 100%; border-radius: 5px; transition: width .35s cubic-bezier(.4,0,.2,1); }
.mnt-mold-fill-ok   { background: #10b981; }
.mnt-mold-fill-warn { background: #f59e0b; }
.mnt-mold-fill-crit { background: #dc2626; }
.mnt-mold-bar-val { font-family: var(--ames-font-code); font-size: 11.5px; min-width: 46px; text-align: right; }
html[data-theme="light"] .mnt-mold-track { background: rgba(80,60,20,.10); }

/* MNT-005 PM 달력 칩 (PP 캘린더 .ames-cal-wo 변형: 완료·오늘·지연·예정) */
.ames-cal-wo.pm-done    { background: rgba(16,185,129,.16); color: var(--ames-tx-emerald-300); border-left: 2px solid #10b981; }
.ames-cal-wo.pm-today   { background: rgba(245,158,11,.18); color: var(--ames-tx-amber-300); border-left: 2px solid #f59e0b; }
.ames-cal-wo.pm-overdue { background: rgba(220,38,38,.18);  color: var(--ames-tx-red-300); border-left: 2px solid #dc2626; }
.ames-cal-wo.pm-planned { background: rgba(99,102,241,.16); color: var(--ames-tx-indigo-200); border-left: 2px solid #6366f1; }
html[data-theme="light"] .ames-cal-wo.pm-done    { background: #d1fae5; color: #065f46; }
html[data-theme="light"] .ames-cal-wo.pm-today   { background: #fef3c7; color: #92400e; }
html[data-theme="light"] .ames-cal-wo.pm-overdue { background: #fee2e2; color: #991b1b; }
html[data-theme="light"] .ames-cal-wo.pm-planned { background: #e0e7ff; color: #3730a3; }

/* RPT-001 일별 생산 실적: 시간대 차트(2) + 교대 요약(1), 교대 카드 */
.rpt-dp-grid2 { display: grid; grid-template-columns: 2fr 1fr; gap: 12px; margin-bottom: 8px; }
@media (max-width: 1100px) { .rpt-dp-grid2 { grid-template-columns: 1fr; } }
.rpt-dp-grid2 .ames-card { margin-bottom: 0; display: flex; flex-direction: column; }
.rpt-dp-shift { border: 1px solid rgba(148,163,184,.18); border-radius: 8px; padding: 10px 12px; margin-bottom: 8px; }
.rpt-dp-shift .h { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 6px; }
.rpt-dp-shift .h b { font-size: 13px; }
.rpt-dp-shift .h .v { font-family: var(--ames-font-code); font-size: 13px; font-weight: 700; color: var(--ames-tx-emerald-400); }
.rpt-dp-shift .f { display: flex; justify-content: space-between; font-size: calc(11px + var(--ames-fs-bump)); opacity: .7; margin-top: 5px; }
.rpt-dp-grid .rz-datatable-footer td, .rpt-dp-grid tfoot td { font-weight: 700 !important; background: rgba(52,211,153,.08) !important; }
html[data-theme="light"] .rpt-dp-shift { border-color: rgba(80,60,20,.14); }
html[data-theme="light"] .rpt-dp-shift .h .v { color: #047857; }

/* RPT-002 불량 파레토: 막대 + 누적선 오버레이, 순위 배지, 2단 그리드 */
.rpt-pa-grid2 { display: grid; grid-template-columns: 1fr 1.4fr; gap: 12px; }
@media (max-width: 1100px) { .rpt-pa-grid2 { grid-template-columns: 1fr; } }
.rpt-pa-grid2 .ames-card { margin-bottom: 0; }
.rpt-pa-wrap { position: relative; height: 230px; padding: 22px 8px 0; }
.rpt-pa-cols { position: absolute; left: 8px; right: 8px; top: 22px; bottom: 26px; display: flex; align-items: flex-end; gap: 10px; border-bottom: 2px solid rgba(148,163,184,.3); }
.rpt-pa-col { flex: 1; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; cursor: pointer; position: relative; }
.rpt-pa-col .val { font-family: var(--ames-font-code); font-size: calc(10px + var(--ames-fs-bump)); opacity: .75; margin-bottom: 3px; }
.rpt-pa-col .bar { width: 72%; background: linear-gradient(180deg, #34d399, #059669); border-radius: 3px 3px 0 0; min-height: 2px; transition: opacity .12s; }
.rpt-pa-col:hover .bar { opacity: .8; }
.rpt-pa-col.sel .bar { box-shadow: 0 0 0 2px #fbbf24; }
.rpt-pa-col .lbl { position: absolute; top: 100%; margin-top: 6px; font-size: calc(10.5px + var(--ames-fs-bump)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; opacity: .8; }
.rpt-pa-svg { position: absolute; left: 8px; right: 8px; top: 22px; bottom: 26px; width: calc(100% - 16px); height: calc(100% - 48px); pointer-events: none; overflow: visible; }
.rpt-pa-dot { position: absolute; width: 8px; height: 8px; border-radius: 50%; background: #3b82f6; border: 2px solid #fff; transform: translate(-50%, 50%); pointer-events: none; }
.rpt-pa-dotlbl { position: absolute; transform: translate(-50%, 100%); font-family: var(--ames-font-code); font-size: 9.5px; color: var(--ames-tx-blue-400); margin-top: -14px; pointer-events: none; white-space: nowrap; }
.rpt-pa-target { position: absolute; left: 8px; right: 8px; border-top: 1px dashed #ef4444; pointer-events: none; }
.rpt-pa-target span { position: absolute; right: 0; top: -14px; font-size: 9.5px; color: var(--ames-tx-red-400); font-family: var(--ames-font-code); }
.rpt-pa-rank { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; font-size: calc(11px + var(--ames-fs-bump)); font-weight: 700; background: rgba(148,163,184,.18); }
.rpt-pa-rank.r1 { background: rgba(220,38,38,.25); color: var(--ames-tx-red-300); }
.rpt-pa-rank.r2 { background: rgba(249,115,22,.25); color: var(--ames-tx-orange-300); }
.rpt-pa-rank.r3 { background: rgba(245,158,11,.25); color: var(--ames-tx-amber-300); }
html[data-theme="light"] .rpt-pa-cols { border-bottom-color: rgba(80,60,20,.25); }
html[data-theme="light"] .rpt-pa-rank.r1 { color: #991b1b; }
html[data-theme="light"] .rpt-pa-rank.r2 { color: #9a3412; }
html[data-theme="light"] .rpt-pa-rank.r3 { color: #92400e; }

/* RPT-003 일별 출하: 고객사별 누적 막대 · 운송사 박스 */
.rpt-sh-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 8px; }
@media (max-width: 1100px) { .rpt-sh-grid2 { grid-template-columns: 1fr; } }
.rpt-sh-grid2 .ames-card { margin-bottom: 0; }
.rpt-sh-cust { padding: 6px 2px 10px; }
.rpt-sh-cust .h { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 5px; }
.rpt-sh-cust .h .v { font-family: var(--ames-font-code); font-size: 12px; font-weight: 700; }
.rpt-sh-stack { display: flex; height: 16px; border-radius: 4px; overflow: hidden; background: rgba(148,163,184,.18); }
.rpt-sh-stack i { display: block; height: 100%; }
.rpt-sh-stack .on  { background: #10b981; }
.rpt-sh-stack .lt  { background: #dc2626; }
.rpt-sh-stack .pd  { background: #f59e0b; }
.rpt-sh-legend { display: flex; gap: 12px; font-size: calc(10.5px + var(--ames-fs-bump)); opacity: .75; margin-top: 5px; }
.rpt-sh-legend b { display: inline-block; width: 9px; height: 9px; border-radius: 2px; margin-right: 4px; vertical-align: middle; }
.rpt-sh-rounds { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; padding: 4px 0; }
.rpt-sh-round { border: 1px solid rgba(148,163,184,.18); border-radius: 8px; padding: 12px 10px; text-align: center; }
.rpt-sh-round .t { font-size: 12px; font-weight: 700; opacity: .85; }
.rpt-sh-round .v { font-family: var(--ames-font-code); font-size: 22px; font-weight: 700; color: var(--ames-tx-emerald-400); margin: 4px 0; }
.rpt-sh-round .s { font-size: calc(10.5px + var(--ames-fs-bump)); opacity: .6; }
html[data-theme="light"] .rpt-sh-round { border-color: rgba(80,60,20,.14); }
html[data-theme="light"] .rpt-sh-round .v { color: #047857; }

/* RPT-004 납기 준수율: 고객사 × 월 히트맵 */
.rpt-ot-heat { display: grid; gap: 6px; align-items: stretch; padding: 4px 0 6px; overflow-x: auto; }
.rpt-ot-heat .hd { font-size: calc(11px + var(--ames-fs-bump)); font-weight: 700; opacity: .75; text-align: center; padding: 4px 0; }
.rpt-ot-heat .hd.l { text-align: left; padding-left: 8px; }
.rpt-ot-heat .rl { display: flex; align-items: center; padding: 0 10px; font-size: 12px; font-weight: 700; border-radius: 6px; background: rgba(148,163,184,.12); min-height: 34px; }
.rpt-ot-heat .rl.ov { background: var(--ames-sf-052e1f); color: var(--ames-tx-emerald-300); }
.rpt-ot-cell { display: flex; align-items: center; justify-content: center; min-height: 34px; border-radius: 6px; font-family: var(--ames-font-code); font-size: 12.5px; font-weight: 700; color: var(--ames-tx-white); }
.rpt-ot-cell.ex   { background: #059669; }
.rpt-ot-cell.good { background: #65a30d; }
.rpt-ot-cell.caut { background: #f59e0b; }
.rpt-ot-cell.low  { background: #dc2626; }
.rpt-ot-cell.none { background: rgba(148,163,184,.12); color: var(--ames-tx-slate-400-a60); font-weight: 400; }
.rpt-ot-cell.avg  { background: var(--ames-sf-052e1f); color: var(--ames-tx-emerald-300); }
.rpt-ot-legend { display: flex; gap: 14px; flex-wrap: wrap; font-size: calc(10.5px + var(--ames-fs-bump)); opacity: .8; padding-top: 4px; }
.rpt-ot-legend i { display: inline-block; width: 12px; height: 12px; border-radius: 3px; margin-right: 5px; vertical-align: middle; }
html[data-theme="light"] .rpt-ot-heat .rl { background: rgba(80,60,20,.08); }

/* RPT-005 재고 현황: 창고 카드 */
.rpt-inv-wh { display: flex; align-items: center; gap: 12px; border: 1px solid rgba(148,163,184,.18); border-radius: 8px; padding: 10px 14px; margin-bottom: 8px; }
.rpt-inv-wh .ic { width: 38px; height: 38px; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 18px; background: rgba(16,185,129,.18); flex: 0 0 38px; }
.rpt-inv-wh .t { flex: 1; min-width: 0; }
.rpt-inv-wh .t b { display: block; font-size: 13px; }
.rpt-inv-wh .t span { font-size: calc(10.5px + var(--ames-fs-bump)); opacity: .65; }
.rpt-inv-wh .v { font-family: var(--ames-font-code); font-size: 15px; font-weight: 700; color: var(--ames-tx-emerald-400); white-space: nowrap; }
html[data-theme="light"] .rpt-inv-wh { border-color: rgba(80,60,20,.14); }
html[data-theme="light"] .rpt-inv-wh .v { color: #047857; }

/* RPT-006 설비 OEE: 월 추이 막대(선택 월 강조), 콜아웃 */
.rpt-eo-col .bar { background: rgba(148,163,184,.45); }
.rpt-eo-col.sel .bar { box-shadow: none; }
.rpt-eo-col.sel.hit .bar { background: linear-gradient(180deg, #34d399, #059669); }
.rpt-eo-col.sel.miss .bar { background: linear-gradient(180deg, #fbbf24, #d97706); }
.rpt-eo-grid2 { display: grid; grid-template-columns: 1.5fr 1fr; gap: 12px; margin-bottom: 8px; }
@media (max-width: 1100px) { .rpt-eo-grid2 { grid-template-columns: 1fr; } }
.rpt-eo-grid2 .ames-card { margin-bottom: 0; }
.rpt-eo-call { border-radius: 8px; padding: 12px 14px; margin-bottom: 10px; border: 1px solid; }
.rpt-eo-call.best  { background: rgba(16,185,129,.10); border-color: rgba(16,185,129,.35); }
.rpt-eo-call.worst { background: rgba(220,38,38,.10);  border-color: rgba(220,38,38,.35); }
.rpt-eo-call .h { font-size: calc(11px + var(--ames-fs-bump)); font-weight: 700; margin-bottom: 4px; }
.rpt-eo-call.best  .h { color: var(--ames-tx-emerald-400); }
.rpt-eo-call.worst .h { color: var(--ames-tx-red-400); }
.rpt-eo-call .n { font-size: 14px; font-weight: 700; }
.rpt-eo-call .v { font-family: var(--ames-font-code); font-size: 26px; font-weight: 700; line-height: 1.2; }
.rpt-eo-call.best  .v { color: var(--ames-tx-emerald-400); }
.rpt-eo-call.worst .v { color: var(--ames-tx-red-400); }
.rpt-eo-call .s { font-size: calc(10.5px + var(--ames-fs-bump)); opacity: .7; }
.rpt-eo-delta { font-family: var(--ames-font-code); font-size: 12px; font-weight: 700; }
.rpt-eo-delta.up { color: var(--ames-tx-emerald-400); }
.rpt-eo-delta.dn { color: var(--ames-tx-red-400); }
html[data-theme="light"] .rpt-eo-call.best  .h, html[data-theme="light"] .rpt-eo-call.best  .v, html[data-theme="light"] .rpt-eo-delta.up { color: #047857; }
html[data-theme="light"] .rpt-eo-call.worst .h, html[data-theme="light"] .rpt-eo-call.worst .v, html[data-theme="light"] .rpt-eo-delta.dn { color: #b91c1c; }

/* RPT-007 월간 KPI 스코어카드: 히어로 배너 · 카테고리 표 */
.rpt-mk-hero { display: flex; align-items: center; gap: 22px; border-radius: 10px; padding: 18px 24px; margin-bottom: 10px; background: linear-gradient(135deg, var(--ames-sf-03251a), var(--ames-sf-052e1f)); border: 1px solid rgba(52,211,153,.25); color: var(--ames-tx-white); }
.rpt-mk-donut { width: 110px; height: 110px; border-radius: 50%; position: relative; flex: 0 0 110px; }
.rpt-mk-donut::after { content: ""; position: absolute; inset: 12px; border-radius: 50%; background: var(--ames-sf-052e1f); }
.rpt-mk-donut .c { position: absolute; inset: 0; z-index: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.rpt-mk-donut .c b { font-family: var(--ames-font-code); font-size: 30px; line-height: 1; color: var(--ames-tx-emerald-400); }
.rpt-mk-donut .c span { font-size: calc(9px + var(--ames-fs-bump)); letter-spacing: 1px; color: var(--ames-tx-white-a55); margin-top: 3px; }
.rpt-mk-hero .t { font-size: 17px; font-weight: 800; }
.rpt-mk-hero .s { font-size: 12.5px; color: var(--ames-tx-white-a70); margin-top: 4px; }
.rpt-mk-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.rpt-mk-table th { text-align: center; font-size: calc(11px + var(--ames-fs-bump)); font-weight: 700; padding: 8px 8px; border-bottom: 1px solid rgba(148,163,184,.25); color: var(--ames-tx-blue-300); }
.rpt-mk-table th:first-child { text-align: left; }
.rpt-mk-table td { padding: 9px 8px; border-bottom: 1px solid rgba(148,163,184,.12); vertical-align: middle; }
.rpt-mk-table td.c { text-align: center; }
.rpt-mk-table td.r { text-align: right; font-family: var(--ames-font-code); }
.rpt-mk-table tr.cat td { background: var(--ames-sf-052e1f); color: var(--ames-tx-emerald-300); font-size: 11.5px; font-weight: 800; padding: 6px 10px; border-bottom: 0; }
.rpt-mk-table tr.row:hover td { background: rgba(147,197,253,.06); }
.rpt-mk-ach { display: inline-flex; align-items: center; gap: 8px; }
.rpt-mk-ach i { display: block; width: 64px; height: 8px; border-radius: 4px; }
.rpt-mk-ach span { font-family: var(--ames-font-code); font-size: 11.5px; font-weight: 700; }
html[data-theme="light"] .rpt-mk-table th { color: #1e3a5f; border-bottom-color: rgba(80,60,20,.25); }
html[data-theme="light"] .rpt-mk-table td { border-bottom-color: rgba(80,60,20,.12); }

/* RPT-008 계획 준수율: 일별 막대(달성 녹색 / 미달 주황) */
.rpt-sa-col .bar { background: linear-gradient(180deg, #fbbf24, #d97706); }
.rpt-sa-col.hit .bar { background: linear-gradient(180deg, #34d399, #059669); }
.rpt-sa-col.sel .bar { box-shadow: 0 0 0 2px #93c5fd; }

/* RPT-010 리포트 빌더: 좌 설정 패널 · 우 결과 · 하단 차트 3종 */
.rpt-rb-layout { display: grid; grid-template-columns: 300px 1fr; gap: 12px; align-items: start; }
@media (max-width: 1000px) { .rpt-rb-layout { grid-template-columns: 1fr; } }
.rpt-rb-layout .ames-card { margin-bottom: 0; }
.rpt-rb-step { font-size: calc(11px + var(--ames-fs-bump)); font-weight: 800; letter-spacing: .5px; text-transform: uppercase; color: var(--ames-tx-emerald-400); display: flex; align-items: center; gap: 8px; margin: 12px 0 6px; }
.rpt-rb-step:first-child { margin-top: 2px; }
.rpt-rb-step i { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; border-radius: 50%; background: #059669; color: #fff; font-size: calc(11px + var(--ames-fs-bump)); font-style: normal; }
.rpt-rb-measure { display: flex; align-items: center; gap: 8px; border: 1px solid rgba(148,163,184,.25); border-radius: 6px; padding: 6px 10px; margin-bottom: 6px; cursor: pointer; font-size: 12.5px; }
.rpt-rb-measure.on { border-color: #10b981; background: rgba(16,185,129,.10); font-weight: 700; }
.rpt-rb-measure span.u { opacity: .55; font-weight: 400; margin-left: 4px; }
.rpt-rb-title { font-size: 19px; font-weight: 800; }
.rpt-rb-meta { font-family: var(--ames-font-code); font-size: calc(11px + var(--ames-fs-bump)); opacity: .65; margin: 4px 0 10px; padding-bottom: 8px; border-bottom: 2px solid #059669; }
.rpt-rb-sums { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.rpt-rb-sum { border: 1px solid rgba(148,163,184,.22); border-radius: 8px; padding: 10px 16px; min-width: 130px; }
.rpt-rb-sum b { display: block; font-family: var(--ames-font-code); font-size: 20px; color: var(--ames-tx-emerald-400); }
.rpt-rb-sum span { font-size: calc(10.5px + var(--ames-fs-bump)); opacity: .65; }
.rpt-rb-charts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 12px; }
@media (max-width: 1200px) { .rpt-rb-charts { grid-template-columns: 1fr; } }
.rpt-rb-chart { border: 1px solid rgba(148,163,184,.18); border-radius: 8px; padding: 8px 10px; }
.rpt-rb-chart .h { font-size: 11.5px; font-weight: 700; opacity: .8; margin-bottom: 4px; }
html[data-theme="light"] .rpt-rb-step { color: #047857; }
html[data-theme="light"] .rpt-rb-sum b { color: #047857; }
html[data-theme="light"] .rpt-rb-measure, html[data-theme="light"] .rpt-rb-sum, html[data-theme="light"] .rpt-rb-chart { border-color: rgba(80,60,20,.16); }

/* ── 고정 페이저 그리드 (.ames-grid-fixed) ─────────────────────────────
   그리드 본문 높이를 "헤더 + 페이지 행 수 × 행 높이" 로 잡아, 목록이 페이지 크기보다 적어도 페이저가 같은 자리에 온다.
   페이지 크기는 --ames-page-rows(그리드 Style 로 바인딩, 25/50/100).
   섹션 flex 체인(콘텐츠 → 카드·탭 패널 → 그리드 → 본문) 안에서는 카드를 화면 바닥까지 늘리고(아래 여백 14px = KPI~카드 간격,
   카드 마진 8 + 콘텐츠 패딩 6) 행 높이를 "본문 높이 ÷ 페이지 행 수" 로 정해 한 페이지가 스크롤 없이 모두 보이게 한다(09-25, 기준 2560×1440).
   체인 밖(2단 래퍼 등)은 아래 고정 높이·행 높이 그대로다. */
.ames-grid-fixed { --ames-grid-head: 36px; --ames-grid-row: 40px; }
.ames-grid-fixed .rz-data-grid-data {
    /* +6px: 행 높이 소수점 누적으로 꽉 찬 페이지에 세로 스크롤바가 생기는 것을 막는 여유 */
    height: calc(var(--ames-grid-head) + var(--ames-page-rows, 25) * var(--ames-grid-row) + 6px);
    overflow: auto !important;
    /* 뷰포트가 모자라면 여기까지만 줄어든다(헤더 + 5행). 그 아래로는 페이지가 스크롤된다 — 위쪽 패널이 큰 화면(ReportBuilder)에서 본문이 0 으로 붕괴하는 것을 막는다 */
    flex: 1 1 auto; min-height: calc(var(--ames-grid-head) + 5 * var(--ames-grid-row) + 6px);
}
/* 합계(tfoot) 행이 있는 그리드는 그 높이만큼 더 준다 — 없으면 마지막 행이 스크롤 뒤로 밀린다 */
.ames-grid-fixed:has(tfoot) { --ames-grid-foot-h: var(--ames-grid-foot, 40px); }
.ames-grid-fixed:has(tfoot) .rz-data-grid-data {
    height: calc(var(--ames-grid-head) + var(--ames-page-rows, 25) * var(--ames-grid-row) + var(--ames-grid-foot, 40px) + 6px);
}
.ames-grid-fixed .rz-data-grid-data > table > tbody:empty,
.ames-grid-fixed .rz-datatable-emptymessage { height: auto; }
/* 콘텐츠 영역 → 그리드까지의 조상 중 카드·탭 패널만 세로 flex 로 만들어, 카드가 남은 높이를 채우고 그리드 본문이 그만큼 늘거나 준다.
   조상 전부(*)를 바꾸면 2단 grid/flex-row 래퍼(ReportBuilder .rpt-rb-layout 등)가 세로로 무너진다 — 그런 래퍼 안의 그리드는 고정 높이만 적용되고 축소 없이 페이지가 스크롤된다 */
.ames-content:is(.ames-sec-sys, .ames-sec-md, .ames-sec-mnt, .ames-sec-rpt, .ames-sec-pp, .ames-sec-wh, .ames-sec-fg, .ames-sec-scm, .ames-sec-portal):has(.ames-grid-fixed) { display: flex; flex-direction: column; height: 100%; box-sizing: border-box; min-height: 0; padding-bottom: 6px; }
.ames-content:is(.ames-sec-sys, .ames-sec-md, .ames-sec-mnt, .ames-sec-rpt, .ames-sec-pp, .ames-sec-wh, .ames-sec-fg, .ames-sec-scm, .ames-sec-portal):has(.ames-grid-fixed) :is(.ames-card, .ames-tabpanel):has(.ames-grid-fixed) { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; }
/* 탭 패널(기본 하단 마진 16px)도 카드처럼 8px — 탭 화면의 아래 여백도 14px 로 맞춘다 */
.ames-content:is(.ames-sec-sys, .ames-sec-md, .ames-sec-mnt, .ames-sec-rpt, .ames-sec-pp, .ames-sec-wh, .ames-sec-fg, .ames-sec-scm, .ames-sec-portal):has(.ames-grid-fixed) .ames-tabpanel:has(.ames-grid-fixed) { margin-bottom: 8px; }
.ames-content:is(.ames-sec-sys, .ames-sec-md, .ames-sec-mnt, .ames-sec-rpt, .ames-sec-pp, .ames-sec-wh, .ames-sec-fg, .ames-sec-scm, .ames-sec-portal) .ames-grid-fixed { display: flex !important; flex-direction: column; flex: 1 1 auto; min-height: 0; }
/* 행 높이 맞춤: 본문을 크기 컨테이너로 만들어 100cqh = 본문 높이. 위아래 여백 0·세로 가운데 — 내용(최대 20px)보다 작아질 수 없어 26px 가 하한이고,
   그보다 작아지는 뷰포트·50/100행은 하한 높이로 본문 안에서 스크롤된다. -6px 는 헤더가 36px 보다 큰 화면(SCM-003 40px)·행 높이 소수점 누적 여유. 2단 목록(top·rest)은 제외 */
.ames-content:is(.ames-sec-sys, .ames-sec-md, .ames-sec-mnt, .ames-sec-rpt, .ames-sec-pp, .ames-sec-wh, .ames-sec-fg, .ames-sec-scm, .ames-sec-portal) .ames-grid-fixed:not(.ames-grid-top):not(.ames-grid-rest) .rz-data-grid-data { container-type: size; }
.ames-content:is(.ames-sec-sys, .ames-sec-md, .ames-sec-mnt, .ames-sec-rpt, .ames-sec-pp, .ames-sec-wh, .ames-sec-fg, .ames-sec-scm, .ames-sec-portal) .ames-grid-fixed:not(.ames-grid-top):not(.ames-grid-rest) .rz-data-grid-data tbody > tr > td {
    height: max(26px, calc((100cqh - var(--ames-grid-head) - var(--ames-grid-foot-h, 0px) - 6px) / var(--ames-page-rows, 25)));
    padding-top: 0; padding-bottom: 0; vertical-align: middle; box-sizing: border-box;
}

/* ── 상·하 2단 목록 (MNT-004 금형·교체 이력, MNT-008 예비품·입출고 이력) ──
   상단(.ames-grid-top)·하단(.ames-grid-rest) 모두 선택한 페이지 행 수만큼의 높이를 정확히 지킨다(상단 기본 15행, 하단 기본 5행).
   행 높이를 --ames-grid-row(2단 목록은 39px) 로 고정해(실측 39.1~40.1px 로 내용에 따라 달라 행이 반쯤 남거나 잘린다) 본문 = 헤더 + 행 수 × 행 높이 — 마지막 행과 페이저 사이에 빈 자리가 없다.
   카드·그리드·본문 세 겹 모두 축소 금지 — 카드만 줄면 본문·페이저가 카드 밖으로 넘쳐 아래 카드에 가린다. 행 수를 늘려 뷰포트를 넘으면 페이지가 스크롤된다.
   열이 많아 가로 스크롤바가 생기는 좁은 화면에서는 그 높이(약 15px)만큼 본문이 세로로 스크롤된다(2560 기준 화면에서는 가로 스크롤 없음). */
/* 두 목록(15 + 5행)과 카드 머리줄·페이저가 2560×1440 화면(뷰포트 1305px)에 스크롤 없이 들어가도록 행 높이 39px — 40px 이면 3px 넘친다 */
.ames-grid-fixed:is(.ames-grid-top, .ames-grid-rest) { --ames-grid-row: 39px; }
.ames-grid-fixed:is(.ames-grid-top, .ames-grid-rest) .rz-data-grid-data { flex: 0 0 auto; min-height: 0; height: calc(var(--ames-grid-head) + var(--ames-page-rows, 15) * var(--ames-grid-row)); }
.ames-grid-fixed:is(.ames-grid-top, .ames-grid-rest) .rz-data-grid-data tbody > tr > td { height: var(--ames-grid-row); box-sizing: border-box; padding-top: 0; padding-bottom: 0; vertical-align: middle; }
.ames-content:is(.ames-sec-sys, .ames-sec-md, .ames-sec-mnt, .ames-sec-rpt, .ames-sec-pp, .ames-sec-wh, .ames-sec-fg, .ames-sec-scm, .ames-sec-portal):has(.ames-grid-fixed) .ames-card:has(.ames-grid-top, .ames-grid-rest) { flex: 0 0 auto; }
.ames-content:is(.ames-sec-sys, .ames-sec-md, .ames-sec-mnt, .ames-sec-rpt, .ames-sec-pp, .ames-sec-wh, .ames-sec-fg, .ames-sec-scm, .ames-sec-portal) .ames-grid-fixed:is(.ames-grid-top, .ames-grid-rest) { flex: 0 0 auto; }

/* ── 전체 높이 가상화 그리드 (.ames-page-fill · .ames-card-fill · .ames-grid-virtual) ──────────
   PP-001~006 처럼 가상화(AllowVirtualization) 그리드가 페이징 없이 화면 남은 세로 영역을 꽉 채운다.
   페이지 래퍼 = TopBar 60px + .ames-content 상단 12 / 하단 16 패딩(88px)을 뺀 높이.
   래퍼 안에 KPI·알림은 제 높이, 카드(또는 AmesTabs 패널 안 카드)가 남은 높이를 받고 그리드는 카드 안 남은 높이를 채운다. */
.ames-page-fill { display: flex; flex-direction: column; height: calc(100vh - 88px); min-height: 360px; }
.ames-page-fill > .ames-tabstrip { flex: 0 0 auto; }
.ames-page-fill > .ames-tabpanel { flex: 1 1 auto; min-height: 0; margin-bottom: 0; display: flex; flex-direction: column; overflow: hidden; }
.ames-card-fill { flex: 1 1 auto; min-height: 0; margin-bottom: 0; display: flex; flex-direction: column; }
.ames-grid-virtual { flex: 1 1 auto; min-height: 0; }
.ames-grid-virtual .rz-data-grid, .ames-grid-virtual .rz-datatable { height: 100%; }

/* ── 꽉 채우는 그리드 (.ames-grid-fill) ───────────────────────────────
   자체 100vh 분할 레이아웃(BOM 등)의 카드 안에서, 그리드가 래퍼 높이를 다 차지하고 본문만 스크롤해
   페이저가 항상 카드 바닥에 온다. 래퍼는 flex:1; min-height:0; overflow:hidden 이어야 한다. */
.ames-grid-fill { display: flex !important; flex-direction: column; height: 100%; min-height: 0; }
.ames-grid-fill .rz-data-grid-data { flex: 1 1 auto; min-height: 0; overflow: auto !important; scrollbar-gutter: stable; }
/* scrollbar-gutter: 카드 안쪽 폭이 소수점(예: 472.72px)이면 세로 스크롤바가 생기는 첫 레이아웃에서 Chromium 이
   실제 넘침 0 인데도 가로 스크롤바를 함께 그린다(재배치되면 사라지는 잔상). 세로 스크롤바 자리를 항상 확보해 막는다. */

/* ── 이미지 바이트 표시 (MD-026 예비품 이미지) ─────────────────────────── */
.ames-img-preview  { width: 320px; max-width: 100%; aspect-ratio: 16 / 9; display: flex; align-items: center; justify-content: center;
                     border: 1px dashed var(--ames-border, rgba(127,127,127,.35)); border-radius: 6px; background: rgba(127,127,127,.06); overflow: hidden; }
.ames-img-preview img { max-width: 100%; max-height: 100%; object-fit: contain; }

/* ── 홈 사이트맵: 대분류 타일(좌) + 화면 링크 칩(우), 권한 없는 화면은 비활성 ─────────── */
.ames-sitemap { display: flex; flex-direction: column; gap: 14px; margin-top: 20px; }
.ames-sitemap-h { display: flex; align-items: baseline; gap: 12px; margin-top: 22px; }
.ames-sitemap-h .t { font-family: var(--ames-font-display); font-size: 22px; letter-spacing: 2px; color: var(--ames-tx-blue-300); }
.ames-sitemap-h .s { font-family: var(--ames-font-mono); font-size: calc(11px + var(--ames-fs-bump)); color: var(--ames-tx-slate-400-a80); }
/* 좌 타일 폭 = 좌측 메뉴 폭(.ames-side 330px). 화면이 좁으면 타일 아래로 링크 칸이 내려간다 */
.ames-map-row { display: flex; flex-wrap: wrap; gap: 16px; align-items: stretch; }
.ames-map-tile { flex: 0 0 330px; max-width: 100%; }
.ames-map-links { flex: 1 1 520px; }
.ames-map-tile { padding: 16px 18px; gap: 10px; justify-content: space-between; text-decoration: none; cursor: default; }
.ames-map-tile:hover { transform: none; box-shadow: none; border-color: var(--ames-bd-white-a08); }
.ames-map-tile-top { display: flex; align-items: center; gap: 12px; min-width: 0; }
.ames-map-tile .ames-tile-ic { font-size: 28px; flex: 0 0 auto; }
.ames-map-tile .ames-tile-h  { font-size: 22px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ames-map-tile-cnt { text-align: right; }
.ames-tile.wh  { border-top: 3px solid #67e8f9; }
.ames-tile.fg  { border-top: 3px solid #f9a8d4; }
.ames-tile.portal { border-top: 3px solid #2dd4bf; }
/* 포탈 화면 ID(PORTAL-001)는 내부 ID 보다 길어 칩의 ID 칸을 넓힌다 */
.ames-sec-portal .ames-map-link .lid { flex-basis: 84px; width: 84px; color: var(--ames-tx-teal-300); }
.ames-map-row.is-locked .ames-map-tile { opacity: .5; cursor: default; }
.ames-map-row.is-locked .ames-map-tile:hover { transform: none; box-shadow: none; border-color: var(--ames-bd-white-a08); }
.ames-map-links {
    background: linear-gradient(180deg, var(--ames-sf-0f1d33-a85), var(--ames-sf-0a1426-a85));
    border: 1px solid var(--ames-bd-white-a06); border-radius: 14px;
    padding: 14px 16px; display: flex; flex-direction: column; gap: 10px; min-width: 0;
}
.ames-map-group-h { font-family: var(--ames-font-mono); font-size: calc(11px + var(--ames-fs-bump)); letter-spacing: 1.5px; color: var(--ames-tx-blue-300-a85); display: flex; align-items: center; gap: 8px; }
.ames-map-group-h .letter { display: inline-flex; width: 18px; height: 18px; align-items: center; justify-content: center; border-radius: 4px; background: rgba(59,130,246,.2); color: var(--ames-tx-blue-300); font-size: calc(10px + var(--ames-fs-bump)); font-weight: 700; }
/* 링크 칩은 250px 고정 — 열 수는 남는 폭만큼, 넘치면 다음 줄 */
.ames-map-chips { display: grid; grid-template-columns: repeat(auto-fill, 250px); gap: 8px; }
.ames-map-link {
    display: inline-flex; align-items: center; gap: 8px; width: 250px; box-sizing: border-box; min-width: 0;
    padding: 6px 11px; border-radius: 8px;
    border: 1px solid var(--ames-bd-white-a10); background: rgba(255,255,255,.04);
    color: var(--ames-tx-slate-200); text-decoration: none; font-size: 13px; line-height: 1.2;
    transition: border-color .12s, background .12s, transform .12s;
}
a.ames-map-link:hover { border-color: rgba(147,197,253,.55); background: rgba(59,130,246,.16); color: var(--ames-tx-white); transform: translateY(-1px); }
.ames-map-link .lid { font-family: var(--ames-font-mono); font-size: calc(10px + var(--ames-fs-bump)); letter-spacing: 1px; color: var(--ames-tx-blue-300); flex: 0 0 58px; width: 58px; white-space: nowrap; }   /* 화면 코드 폭 고정 — 코드 길이가 달라도 화면명 시작 위치가 같게 */
.ames-map-link .t { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ames-map-link.is-off { opacity: .42; cursor: not-allowed; }
.ames-map-link.is-off .rzi { font-size: 14px !important; color: var(--ames-tx-slate-400); flex: 0 0 auto; }
html[data-theme="light"] .ames-sitemap-h .t { color: var(--ames-accent); }
html[data-theme="light"] .ames-map-links { background: var(--ames-surface); border-color: var(--ames-border); }
html[data-theme="light"] .ames-map-link { background: rgba(37,99,235,.05); border-color: var(--ames-border); color: var(--ames-text); }
html[data-theme="light"] a.ames-map-link:hover { background: rgba(37,99,235,.12); color: var(--ames-text); }
html[data-theme="light"] .ames-map-link .lid { color: #1d4ed8; }
html[data-theme="light"] .ames-map-group-h { color: #1d4ed8; }

/* ── SYS-010 리소스 사용률: 머리줄(이름 좌 · 용량/퍼센트 우측 끝) + 막대 ─────────── */
.sh-res      { display: flex; flex-direction: column; gap: 16px; padding: 6px 0 2px; }
.sh-res-row  { display: flex; flex-direction: column; gap: 6px; }
.sh-res-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.sh-res-lbl  { font-family: var(--ames-font-mono); font-size: 12px; letter-spacing: 1.5px; color: var(--ames-tx-blue-300); }
.sh-res-val  { font-family: var(--ames-font-mono); font-size: calc(11px + var(--ames-fs-bump)); color: var(--ames-tx-slate-400-a90); white-space: nowrap; text-align: right; }
html[data-theme="light"] .sh-res-lbl { color: var(--ames-accent); }
html[data-theme="light"] .sh-res-val { color: var(--ames-text-dim); }

/* ── 한국어 타이포그래피 (html lang 은 App.razor 가 현재 UI 언어로 출력) ─────────────
   카드 제목·KPI 라벨·필 등에 걸린 영문용 자간(1~2px)은 한글을 "예 비 품" 처럼 벌려 놓는다 — 한국어에서만 걷어낸다.
   브랜드 로고 글자(A-MES)는 라틴 디자인 요소라 제외. 영어·스페인어는 기존 디자인(대문자 + 자간) 유지. */
html:lang(ko) { --ames-fs-bump: 1px; --ames-fs-hint: 12px; }
html:lang(ko) body *:not(.ames-brand, .ames-brand *) { letter-spacing: normal !important; }

/* ── MNT Spare Parts 100 × 50 mm serialized label ───────────────── */
.spare-label-modal { width: min(760px, calc(100vw - 32px)); }
.spare-label-preview { overflow: auto; padding: 18px; background: var(--ames-sf-090f1d); }
.spare-label-print-area { width: 100mm; margin: 0 auto; }
.spare-label-paper {
    box-sizing: border-box; width: 100mm; height: 50mm; padding: 1mm 2mm 2mm;
    overflow: hidden; background: #fff; color: #000; font-family: Arial, sans-serif;
}
.spare-label-top { display: grid; grid-template-columns: 34mm minmax(0, 1fr); gap: 2mm; height: 34mm; }
.spare-label-qr { width: 34mm; height: 34mm; }
.spare-label-info { display: grid; grid-template-rows: repeat(3, minmax(0, 1fr)); min-width: 0; font-size: 4.2mm; font-weight: 800; line-height: 1.05; }
.spare-label-info > div { display: flex; align-items: center; min-width: 0; overflow: hidden; overflow-wrap: anywhere; }
.spare-label-location { flex-direction: column; align-items: flex-start !important; justify-content: center; gap: 0; font-size: 3.7mm; line-height: 1; }
.spare-label-location span { width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.spare-label-bottom { height: 13mm; padding-top: .5mm; font-size: 4.8mm; font-weight: 900; line-height: 1.25; white-space: nowrap; overflow: hidden; }
.spare-label-bottom div { overflow: hidden; text-overflow: ellipsis; }
html[data-theme="light"] .spare-label-preview { background: #e5e7eb; }

@media print {
    @page { size: 100mm 50mm; margin: 0; }
    #spare-part-label-print,
    #spare-part-label-print * { visibility: visible !important; }
    #spare-part-label-print { position: absolute; inset: 0 auto auto 0; width: 100mm; margin: 0; padding: 0; }
}

/* ── 외부 포탈(/portal) 외부 사용자용 셸 — 내부 사용자는 MainLayout 안에서 같은 화면을 본다 ───────── */
.portal-shell { min-height: 100vh; display: flex; flex-direction: column; background: var(--ames-bg, var(--ames-sf-0b1220)); color: var(--ames-fg, var(--ames-tx-gray-200)); }
.portal-top { display: flex; align-items: center; gap: 24px; padding: 0 20px; height: 52px; border-bottom: 1px solid var(--ames-border, #1f2937); background: var(--ames-panel, var(--ames-sf-0f172a)); }
.portal-brand { display: flex; align-items: baseline; gap: 10px; }
.portal-logo { font-family: var(--ames-font-mono, monospace); font-weight: 800; letter-spacing: .12em; font-size: 15px; }
.portal-sub { font-size: var(--ames-fs-hint, 11px); letter-spacing: .18em; opacity: .7; }
.portal-nav { display: flex; gap: 6px; flex: 1; }
.portal-link { padding: 6px 12px; border-radius: 6px; text-decoration: none; color: inherit; font-size: 13px; opacity: .85; }
.portal-link:hover { background: rgba(255,255,255,.06); opacity: 1; }
.portal-link.active { background: rgba(59,130,246,.18); color: var(--ames-tx-blue-300); opacity: 1; }
.portal-user { display: flex; align-items: center; gap: 12px; font-size: 12px; }
.portal-user-name { opacity: .8; }
.portal-logout { color: var(--ames-tx-red-300); text-decoration: none; }
.portal-main { flex: 1; padding: 16px 20px; }
html[data-theme="light"] .portal-shell { background: #f3f4f6; color: #111827; }
html[data-theme="light"] .portal-top { background: #fff; border-color: #e5e7eb; }

/* ── 외부 포탈: 내부 사이트와 확실히 다른 인상 — 청록 계열 액센트·상단 탭 네비·별도 브랜드 배지 ─────── */
/* 외부 로그인: 구성(격자·두 모서리 빛·카드·하단 문구)은 내부 로그인과 같고 색만 청록 계열 */
.portal-auth {
    background:
        radial-gradient(900px 600px at 10% 0%, rgba(20,184,166,.22), transparent 60%),
        radial-gradient(900px 600px at 100% 100%, rgba(15,61,62,.6), transparent 60%),
        linear-gradient(180deg, #071a1c 0%, #050d10 100%) !important;
}
.portal-auth .ames-auth-bg-grid {
    background-image:
        linear-gradient(rgba(45,212,191,.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(45,212,191,.05) 1px, transparent 1px);
}
.portal-auth .ames-auth-card { border-color: rgba(45,212,191,.22); box-shadow: 0 30px 80px -20px rgba(0,0,0,.7), 0 0 0 1px rgba(45,212,191,.08) inset; }
.portal-auth .ames-auth-sub { color: var(--ames-tx-teal-300); text-transform: uppercase; }
.portal-auth .ames-auth-logo { background: linear-gradient(135deg, #99f6e4, #14b8a6); -webkit-background-clip: text; background-clip: text; }
.portal-auth .ames-auth-label { color: rgba(94,234,212,.85); }
.portal-auth { --ames-auth-input-fill: #06121a; --ames-auth-input-ring: rgba(45,212,191,.18); }
.portal-auth .ames-auth-input,
.portal-auth .ames-auth-input:-webkit-autofill { border-color: rgba(45,212,191,.2); caret-color: #5eead4; }
.portal-auth .ames-auth-input:focus { border-color: #5eead4; box-shadow: 0 0 0 3px rgba(45,212,191,.18); }
.portal-auth .ames-auth-submit { background: linear-gradient(90deg, #14b8a6, #0d9488); border-color: #0d9488; box-shadow: 0 10px 28px -10px rgba(13,148,136,.75); }
.portal-auth .ames-auth-submit:hover { filter: brightness(1.08); box-shadow: 0 14px 32px -10px rgba(20,184,166,.85); }
.portal-auth .ames-auth-hint { background: rgba(45,212,191,.06); border-color: rgba(45,212,191,.22); }
.portal-auth .ames-auth-hint code { color: #5eead4; }
.portal-auth .ames-auth-meta a { color: rgba(94,234,212,.85); }
.portal-auth .ames-auth-meta a:hover { color: #fff; }
.portal-error-card .ames-auth-error { margin: 12px 0; }
.portal-shell { background: radial-gradient(1400px 500px at 50% -20%, var(--ames-sf-0f3d3e) 0%, var(--ames-sf-071a1c) 40%, var(--ames-sf-050d10) 100%); color: #e6fffa; }
.portal-top { background: var(--ames-sf-050d10-a85); border-bottom: 2px solid #14b8a6; backdrop-filter: blur(6px); }
.portal-logo { color: var(--ames-tx-teal-200); }
.portal-sub { color: var(--ames-tx-teal-300); opacity: 1; letter-spacing: .22em; font-weight: 700; }
.portal-link { border: 1px solid transparent; }
.portal-link.active { background: rgba(20,184,166,.18); border-color: rgba(45,212,191,.45); color: var(--ames-tx-teal-100); }
.portal-logout { color: var(--ames-tx-rose-300); }
html[data-theme="light"] .portal-shell { background: linear-gradient(180deg, #ecfeff 0%, #f0fdfa 100%); color: #134e4a; }
html[data-theme="light"] .portal-top { background: #ffffffd9; border-bottom-color: #0d9488; }
html[data-theme="light"] .portal-logo, html[data-theme="light"] .portal-sub { color: #0f766e; }
html[data-theme="light"] .portal-link.active { background: rgba(13,148,136,.12); color: #0f766e; }

/* ── 외부 포탈 셸: 내부 셸 구조(상단바 + 좌측 메뉴)를 빌려 쓰되 색·메뉴 내용은 분리 ─────────────── */
.portal-shell { min-height: 100vh; height: 100vh; }
.portal-top { height: 60px; flex-shrink: 0; z-index: 100; }
.portal-top-spacer { flex: 1; }
.portal-link-internal { color: var(--ames-tx-teal-200); font-size: 12px; text-decoration: none; padding: 4px 10px; border: 1px solid rgba(45,212,191,.35); border-radius: 6px; }
.portal-link-internal:hover { background: rgba(20,184,166,.15); color: var(--ames-tx-teal-100); }
.portal-side .ames-nav-section.portal { color: var(--ames-tx-teal-300); cursor: default; }
.portal-side .ames-nav-link.active { background: rgba(20,184,166,.16); }
.portal-side .lid { color: var(--ames-tx-teal-300); border-color: rgba(45,212,191,.35); background: rgba(45,212,191,.08); }

/* ── 외부 포탈: 내부 셸(TopBar·NavMenu) 클래스를 그대로 쓰고 색만 청록으로 덮어쓴다 ─────────────── */
.portal-shell { background: radial-gradient(1200px 600px at 12% -10%, rgba(20,184,166,.20), transparent 60%), radial-gradient(900px 500px at 110% 10%, rgba(45,212,191,.10), transparent 60%), var(--ames-sf-050f12); }
.portal-shell .ames-topbar.portal-top { height: 60px; display: flex; align-items: center; padding: 0; gap: 0; background: linear-gradient(180deg, var(--ames-sf-061a1c-a97), var(--ames-sf-040e10-a97)); border-bottom: 1px solid rgba(45,212,191,.28); backdrop-filter: blur(6px); }
.portal-shell .ames-brand-logo { color: var(--ames-tx-teal-200); }
.portal-shell .ames-brand-sub { color: var(--ames-tx-teal-300); letter-spacing: .18em; }
.portal-shell .ames-loc-code { color: var(--ames-tx-teal-300); background: rgba(94,234,212,.10); border-color: rgba(94,234,212,.25); }
.portal-shell .ames-user-av--user { background: rgba(20,184,166,.18); color: var(--ames-tx-teal-300); }
.portal-shell .ames-side { border-right: 1px solid rgba(45,212,191,.18); background: linear-gradient(180deg, var(--ames-sf-061a1c-a92), var(--ames-sf-040e10-a92)); }
.portal-shell .ames-nav-section.portal.open, .portal-shell .ames-nav-section.portal { color: var(--ames-tx-teal-200); }
.portal-shell .ames-nav-section.portal .ames-nav-section-n { background: rgba(45,212,191,.15); color: var(--ames-tx-teal-300); }
.portal-shell .ames-nav-link.active { background: rgba(20,184,166,.16); color: var(--ames-tx-teal-100); }
.portal-shell .ames-nav-link .lid { color: var(--ames-tx-teal-300); border-color: rgba(45,212,191,.35); background: rgba(45,212,191,.08); }
.portal-shell .ames-nav-home.active { color: var(--ames-tx-teal-200); }
.portal-shell a { color: var(--ames-tx-sky-300); }
html[data-theme="light"] .portal-shell { background: linear-gradient(180deg, #ecfeff 0%, #f0fdfa 100%); }
html[data-theme="light"] .portal-shell .ames-topbar.portal-top { background: #ffffffe6; border-bottom-color: #0d9488; }
html[data-theme="light"] .portal-shell .ames-side { background: #ffffffcc; border-right-color: rgba(13,148,136,.25); }
html[data-theme="light"] .portal-shell .ames-brand-logo, html[data-theme="light"] .portal-shell .ames-brand-sub, html[data-theme="light"] .portal-shell .ames-nav-section.portal { color: #0f766e; }

/* ── DB 연결 장애 안내(SessionGuard 배너 · MainLayout 화면 대체) ── */
.ames-db-down {
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
    margin: 8px 16px 0; padding: 8px 12px; border-radius: 6px;
    border: 1px solid rgba(239, 68, 68, .45); background: rgba(239, 68, 68, .12);
    color: var(--ames-tx-red-400); font-size: calc(13px + var(--ames-fs-bump));
}
.ames-db-down span:last-child { color: var(--ames-tx-slate-300); }
.ames-db-down-icon { font-size: 1.1em; }
.ames-db-down-page {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px;
    min-height: 50vh; text-align: center;
}
.ames-db-down-page-t { font-size: 1.4rem; font-weight: 700; color: var(--ames-tx-red-400); }

/* ── 처리 중 버튼(js/busy-buttons.js) — 버튼 크기는 그대로 두고 내용만 스피너·문구로 바꾼다 ── */
.rz-button.ames-busy-btn { display: inline-flex !important; align-items: center; justify-content: center; gap: 6px; pointer-events: none; cursor: progress; }
.rz-button.ames-busy-btn > * { display: none !important; }
.rz-button.ames-busy-btn::before { content: ""; flex: none; width: 12px; height: 12px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: ames-busy-spin .7s linear infinite; }
.rz-button.ames-busy-btn::after { content: attr(data-busy-label); font-size: .92em; white-space: nowrap; }
@keyframes ames-busy-spin { to { transform: rotate(360deg); } }