:root{--bg:#f3f6fa;--surface:#fff;--surface-2:#eef3f8;--ink:#111827;--muted:#667085;--border:#d7e0ea;--navy:#082f63;--blue:#1e64c8;--green:#169b62;--amber:#f08a00;--red:#dc2626;--cyan:#0d9488;--shadow:0 8px 22px #0f172a0f}*{box-sizing:border-box}html,body{background:var(--bg);min-height:100%;color:var(--ink);margin:0;font-family:Arial,Malgun Gothic,sans-serif}body{overflow-x:hidden}.dashboard{width:min(1920px,100%);margin:0 auto;padding:14px 16px}.topbar{justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:10px;display:flex}.titleBlock{align-items:center;gap:14px;min-width:0;display:flex}.titleIcon{width:42px;height:42px;color:var(--ink);flex:none}h1{letter-spacing:0;margin:0;font-size:clamp(30px,2.45vw,46px);font-weight:900;line-height:1.05}.titleBlock p{color:#42526a;margin:6px 0 0;font-size:14px;font-weight:700}.timeBlock{text-align:right;color:#123c82;flex:none;gap:4px;display:grid}.timeBlock strong{font-size:22px}.timeBlock span{color:var(--muted);font-size:13px;font-weight:700}.kpiGrid{grid-template-columns:repeat(8,minmax(150px,1fr));gap:9px;margin-bottom:12px;display:grid}.kpiCard,.panel,.commentStrip{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow)}.kpiCard{border-radius:8px;align-content:space-between;gap:12px;min-height:138px;padding:16px 16px 13px;display:grid}.kpiLabel{color:#1f2937;white-space:nowrap;align-items:center;gap:10px;font-size:16px;font-weight:900;display:flex}.kpiLabel svg{width:27px;height:27px;color:var(--blue)}.kpiCard.red .kpiLabel svg,.kpiCard.red .kpiValue strong{color:var(--red)}.kpiCard.amber .kpiLabel svg,.kpiCard.amber .kpiValue strong{color:var(--amber)}.kpiCard.pending .kpiLabel svg,.kpiCard.pending .kpiValue strong{color:#64748b}.kpiValue{align-items:baseline;gap:9px;min-width:0;display:flex}.kpiValue strong{font-size:clamp(26px,2vw,42px);font-weight:900;line-height:1}.kpiValue span{color:#111827;white-space:nowrap;font-size:17px;font-weight:800}.delta{width:fit-content;color:var(--green);background:#e9f8f0;border-radius:999px;padding:5px 10px;font-size:13px;font-weight:900}.delta.down{color:var(--red);background:#fff1f2}.kpiFoot{flex-wrap:wrap;align-items:center;gap:7px;min-height:26px;display:flex}.kpiFoot small{color:var(--muted);font-size:12px;font-weight:800;line-height:1.3}.mainGrid{grid-template-columns:1.22fr 1.16fr .82fr;gap:12px;display:grid}.panel{border-radius:8px;min-width:0;overflow:hidden}.panel:nth-child(4),.panel:nth-child(5),.panel:nth-child(7),.panel:nth-child(8){grid-column:span 1}.panelTitle{background:var(--navy);color:#fff;justify-content:space-between;align-items:center;gap:12px;min-height:40px;padding:7px 13px;display:flex}.panelTitle h2{margin:0;font-size:17px;font-weight:900;line-height:1.15}.panelTitle span{white-space:nowrap;background:#ffffff24;border-radius:4px;padding:4px 8px;font-size:12px;font-weight:800}.tableWrap{padding:9px;overflow-x:auto}table{border-collapse:collapse;table-layout:fixed;width:100%;min-width:520px}th,td{text-align:center;vertical-align:middle;border:1px solid #e0e7ef;padding:8px 9px;font-size:14px}th{color:#2d3748;background:#f6f8fb;font-weight:900}td{font-weight:700}.strong{color:#111827;font-weight:900}.barCell{color:#fff;background:#e5e7eb;border-radius:5px;align-items:center;min-height:28px;display:grid;position:relative;overflow:hidden}.stockCell{color:#10233f;background:#edf2f7;border-radius:5px;align-items:center;min-height:28px;display:grid;position:relative;overflow:hidden}.stockCell span{opacity:.92;background:linear-gradient(90deg,#0b376d,#2b7de0);position:absolute;inset:0 auto 0 0}.stockCell b{z-index:1;color:#fff;text-shadow:0 1px 2px #00000047;position:relative}.barCell span{background:linear-gradient(90deg, var(--navy), var(--blue));position:absolute;inset:0 auto 0 0}.barCell b{z-index:1;text-shadow:0 1px 2px #00000040;position:relative}.statusPill,.sourceBadge{border-radius:999px;justify-content:center;align-items:center;min-width:70px;padding:5px 9px;font-size:12px;font-weight:900;display:inline-flex}.statusPill.ok,.sourceBadge.live{color:#087447;background:#ddf8e9}.statusPill.warn,.sourceBadge.sample,.sourceBadge.pending{color:#a15c00;background:#fff3d6}.statusPill.bad,.sourceBadge.error{color:#be123c;background:#ffe4e6}.legendRow{color:var(--muted);flex-wrap:wrap;align-items:center;gap:9px;padding:0 12px 12px;font-size:13px;font-weight:800;display:flex}.legend{border-radius:3px;width:16px;height:10px;display:inline-block}.legend.available{background:var(--green)}.legend.near{background:var(--amber)}.legend.blocked{background:var(--red)}.legend.order{background:#c3d2e6}.legend.ship{background:var(--blue)}.trendWrap{padding:12px 12px 4px}.trendEmpty{text-align:center;padding:28px 16px;font-weight:800}.trendSvg{width:100%;height:auto;display:block}.trendSvg .orderRect{fill:#c3d2e6}.trendSvg .shipRect{fill:var(--blue)}.trendSvg .rateLine{fill:none;stroke:var(--amber);stroke-width:2.5px;stroke-linejoin:round;stroke-linecap:round}.trendSvg .rateDot{fill:#fff;stroke:var(--amber);stroke-width:2px}.trendSvg .rateDot.low{fill:var(--amber);stroke:var(--red)}.trendSvg .targetLine{stroke:var(--green);stroke-width:1.5px;stroke-dasharray:5 4}.trendSvg .axisText{fill:var(--muted);font-size:9px;font-weight:800}.trendSvg .axisText.target{fill:var(--green)}.trendSvg .dateText{fill:var(--muted);font-size:9px;font-weight:800}.legend.rate{background:var(--amber)}.legend.targetLegend{background:repeating-linear-gradient(90deg, var(--green) 0 4px, transparent 4px 7px)}.reliList{gap:8px;padding:10px;display:grid}.reliRow{background:#fbfdff;border:1px solid #e0e7ef;border-radius:8px;padding:10px 12px}.reliHead{align-items:center;gap:8px;margin-bottom:6px;display:flex}.reliHead svg{width:18px;height:18px;color:var(--green);flex:none}.reliHead strong{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-size:14px;font-weight:900;overflow:hidden}.reliMeta{color:#344054;flex-wrap:wrap;gap:4px 10px;margin-bottom:5px;font-size:12px;font-weight:800;display:flex}.reliRow small{color:var(--muted);font-size:12px;font-weight:700;line-height:1.35}.topbarRight{flex:none;align-items:flex-start;gap:14px;display:flex}.kpiCard.clickable{font:inherit;text-align:left;cursor:pointer;transition:transform .18s,box-shadow .18s,border-color .18s}.kpiCard.clickable:hover{border-color:#b9c9dd;transform:translateY(-3px);box-shadow:0 12px 26px #0f172a1f}.adminButton{border:1px solid var(--border);background:var(--surface);color:var(--navy);cursor:pointer;box-shadow:var(--shadow);border-radius:8px;align-items:center;gap:7px;padding:9px 13px;font-size:13px;font-weight:900;transition:transform .18s,background .18s;display:inline-flex}.adminButton:hover{background:#f4f8ff;transform:translateY(-2px)}.adminButton svg{width:17px;height:17px}.modalOverlay{z-index:60;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#0914267a;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.modalCard{border:1px solid var(--border);background:var(--surface);border-radius:12px;width:min(720px,100%);max-height:min(80vh,640px);animation:.22s modalUp;overflow-y:auto;box-shadow:0 24px 60px #0914264d}@keyframes modalUp{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}.modalHead{background:var(--navy);color:#fff;justify-content:space-between;align-items:center;gap:12px;padding:14px 18px;display:flex;position:sticky;top:0}.modalHead strong{font-size:17px;font-weight:900}.modalClose{color:#fff;cursor:pointer;background:#ffffff24;border:0;border-radius:7px;justify-content:center;align-items:center;width:30px;height:30px;display:inline-flex}.modalClose svg{width:17px;height:17px}.modalGuide{color:#334155;background:#f4f8ff;border-bottom:1px solid #e5edf5;margin:0;padding:13px 18px;font-size:13px;font-weight:700;line-height:1.5}.modalTable{padding:12px}.modalTable table{min-width:100%}.modalEmpty{text-align:center;padding:26px;font-weight:800}.adminCard{width:min(560px,100%)}.adminFields{gap:10px;padding:14px 18px;display:grid}.adminField{grid-template-columns:1fr 130px;align-items:center;gap:10px;display:grid}.adminLabel{color:#1f2937;align-items:center;gap:6px;font-size:14px;font-weight:800;display:inline-flex}.adminInput{align-items:center;gap:7px;display:inline-flex}.adminInput input{border:1px solid var(--border);text-align:right;width:84px;color:var(--navy);border-radius:7px;padding:8px 10px;font-size:15px;font-weight:900}.adminInput em{color:var(--muted);font-size:13px;font-style:normal;font-weight:800}.adminActions{justify-content:flex-end;gap:9px;padding:6px 18px 18px;display:flex}.primaryButton,.ghostButton{cursor:pointer;border-radius:8px;align-items:center;gap:7px;padding:10px 15px;font-size:13px;font-weight:900;transition:transform .15s,opacity .15s;display:inline-flex}.primaryButton{background:var(--navy);color:#fff;border:0}.ghostButton{border:1px solid var(--border);color:#475467;background:#fff}.ghostButton svg{width:15px;height:15px}.primaryButton:hover,.ghostButton:hover{transform:translateY(-1px)}.primaryButton:disabled,.ghostButton:disabled{opacity:.6;cursor:default;transform:none}.tip{color:#94a3b8;display:inline-flex;position:relative}.tip svg{width:15px;height:15px}.tip .tipBody{z-index:30;color:#e6eefb;background:#10233f;border-radius:8px;width:240px;padding:9px 11px;font-size:12px;font-weight:700;line-height:1.45;display:none;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%);box-shadow:0 10px 24px #09142659}.tip:hover .tipBody,.tip:focus-within .tipBody{display:block}.riskList{padding:10px}.riskRow{border-bottom:1px solid #e5edf5;grid-template-columns:32px minmax(0,1fr) 60px 72px;align-items:center;gap:8px;min-height:40px;font-size:15px;display:grid}.riskRow span{text-align:center;font-weight:900}.riskRow strong{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.riskRow small{color:var(--muted);font-weight:800}.risk{font-size:12px;font-style:normal;font-weight:900}.risk.high{color:var(--red)}.risk.mid{color:var(--amber)}.risk.low{color:#64748b}.decisionBox{background:#f4f8ff;border:1px solid #c8d7ed;border-radius:8px;gap:10px;margin-top:10px;padding:12px;display:flex}.decisionBox svg{width:28px;height:28px;color:var(--navy);flex:none}.decisionBox strong{color:var(--navy);margin-bottom:5px;font-size:15px;display:block}.decisionBox p{color:#334155;margin:0;font-size:13px;font-weight:700;line-height:1.45}.progressLine{background:#dbe3ec;border-radius:999px;min-width:96px;height:12px;overflow:hidden}.progressLine span{background:linear-gradient(90deg, var(--blue), var(--cyan));height:100%;display:block}.miniGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:9px;display:grid}.miniTile{background:#fbfdff;border:1px solid #e0e7ef;border-radius:8px;min-height:104px;padding:12px}.miniTile div{justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:8px;display:flex}.miniTile strong{font-size:15px;font-weight:900}.miniTile p{color:#344054;margin:0 0 8px;font-size:13px;font-weight:800;line-height:1.35}.miniTile small{color:var(--muted);font-size:12px;font-weight:700;line-height:1.35}.rawBlock{padding:9px}.materialSummary{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:10px;display:grid}.materialCard{background:#fbfdff;border:1px solid #dfe8f2;border-radius:8px;min-width:0;padding:10px}.materialCard strong{color:var(--navy);margin-bottom:8px;font-size:16px;font-weight:900;display:block}.materialCard div{flex-wrap:wrap;gap:6px;margin-bottom:8px;display:flex}.materialCard span{border-radius:999px;padding:4px 7px;font-size:12px;font-weight:900}.materialCard .ok{color:#087447;background:#e4f8ed}.materialCard .warn{color:#a15c00;background:#fff3d6}.materialCard .bad{color:#be123c;background:#ffe4e6}.materialCard small{color:#475467;font-size:12px;font-weight:800}.metric{background:#fbfdff;border:1px solid #e0e7ef;border-radius:8px;grid-template-columns:28px 1fr;align-items:center;gap:2px 8px;padding:10px;display:grid}.metric span{color:var(--blue);grid-row:span 2}.metric svg{width:24px;height:24px}.metric small{color:var(--muted);font-size:12px;font-weight:800}.metric strong{font-size:20px;font-weight:900}.compact{padding:0}.truncate{text-overflow:ellipsis;white-space:nowrap;text-align:left;overflow:hidden}.empty{color:var(--muted);padding:20px}.deliveryList{gap:8px;padding:10px;display:grid}.deliveryItem{background:#fbfdff;border:1px solid #e0e7ef;border-radius:8px;grid-template-columns:30px 1fr auto;align-items:center;gap:10px;padding:11px 12px;display:grid}.deliveryItem svg{color:var(--blue)}.deliveryItem strong,.deliveryItem span{display:block}.deliveryItem strong{font-size:15px;font-weight:900}.deliveryItem span{color:var(--muted);margin-top:3px;font-size:12px;font-weight:800}.deliveryItem em{color:var(--amber);white-space:nowrap;font-size:13px;font-style:normal;font-weight:900}.commentStrip{border-radius:8px;grid-template-columns:280px repeat(3,1fr);align-items:center;gap:0;margin-top:12px;display:grid;overflow:hidden}.commentTitle,.commentStrip p{border-right:1px solid var(--border);align-items:center;gap:12px;min-height:90px;margin:0;padding:18px 22px;display:flex}.commentTitle{color:var(--navy);font-size:23px;font-weight:900}.commentTitle svg{width:42px;height:42px}.commentStrip p{color:#253044;font-size:16px;font-weight:800;line-height:1.5}.commentStrip p svg{width:22px;height:22px;color:var(--blue);flex:none}@media (max-width:1500px){.kpiGrid{grid-template-columns:repeat(4,minmax(160px,1fr))}.mainGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.commentStrip{grid-template-columns:1fr}.commentTitle,.commentStrip p{border-right:0;border-bottom:1px solid var(--border);min-height:auto}}@media (max-width:860px){.dashboard{padding:12px}.topbar{display:grid}.timeBlock{text-align:left}.kpiGrid,.mainGrid,.miniGrid,.materialSummary{grid-template-columns:1fr}.titleIcon{width:34px;height:34px}h1{font-size:28px}}