:root{--color-bg:oklch(16% .012 265);--color-surface:oklch(20% .014 265);--color-surface-2:oklch(24% .016 265);--color-border:oklch(30% .015 265);--color-border-strong:oklch(38% .02 265);--color-text:oklch(95% .005 265);--color-text-dim:oklch(72% .012 265);--color-text-faint:oklch(56% .012 265);--c-cph:oklch(70% .17 290);--c-cases:oklch(68% .16 285);--c-containers:oklch(66% .15 280);--c-volume:oklch(70% .15 275);--c-weight:oklch(70% .13 235);--c-carts:oklch(74% .15 165);--c-people:oklch(76% .16 150);--c-robots:oklch(78% .15 75);--font-sans:ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-mono:ui-monospace, "SF Mono", "Roboto Mono", Menlo, monospace;--text-kpi:1.55rem;--text-kpi-row:2.25rem;--text-section:1.35rem;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.5rem;--space-6:2rem;--radius:8px;--radius-lg:8px;--sidebar-w:232px;--duration-fast:.14s;--duration-normal:.26s;--ease-out-expo:cubic-bezier(.16, 1, .3, 1)}*{box-sizing:border-box}html,body,#root{height:100%}body{font-family:var(--font-sans);background:var(--color-bg);color:var(--color-text);-webkit-font-smoothing:antialiased;margin:0;font-size:13px}h1,h2,h3{margin:0;font-weight:600}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}.app{min-height:100%}.main{min-width:0;padding:var(--space-4) var(--space-5) var(--space-5)}.topbar{justify-content:space-between;align-items:center;gap:var(--space-4);margin-bottom:var(--space-4);display:flex}.topbar-main{align-items:center;gap:var(--space-4);min-width:0;display:flex}.topbar h1{font-size:var(--text-section);letter-spacing:0}.topbar .sub{color:var(--color-text-faint);margin-top:2px;font-size:.76rem}.brand-lockup{align-items:center;gap:var(--space-3);min-width:max-content;display:inline-flex}.brand-logo{object-fit:contain;display:block}.destro-logo{width:158px;height:auto}.yusen-logo{width:118px;height:auto}.brand-divider{background:var(--color-border-strong);width:1px;height:28px}.sidebar{background:var(--color-surface);border-right:1px solid var(--color-border);padding:var(--space-5) var(--space-3);gap:var(--space-5);flex-direction:column;height:100vh;display:flex;position:sticky;top:0}.brand{align-items:center;gap:var(--space-2);padding:0 var(--space-2);letter-spacing:0;font-size:1rem;font-weight:700;display:flex}.brand .mark{gap:2px;display:inline-flex}.brand .mark i{background:var(--color-text);border-radius:2px;width:3px;height:18px;display:inline-block}.brand .mark i:nth-child(2){align-self:flex-end;height:13px}.brand .mark i:nth-child(3){height:22px}.nav-label{padding:0 var(--space-2);text-transform:uppercase;letter-spacing:.08em;color:var(--color-text-faint);margin-bottom:var(--space-2);font-size:.68rem}.nav{flex-direction:column;gap:2px;display:flex}.nav button{text-align:left;padding:var(--space-2) var(--space-3);color:var(--color-text-dim);transition:background var(--duration-fast), color var(--duration-fast);background:0 0;border:0;border-radius:6px}.nav button:hover{background:var(--color-surface-2);color:var(--color-text)}.nav button.active{background:color-mix(in oklch, var(--c-cph) 22%, var(--color-surface-2));color:var(--color-text)}.panel-row{gap:var(--space-4);padding:var(--space-3) 0;border-top:1px solid var(--color-border);grid-template-columns:210px minmax(0,1fr);align-items:center;display:grid}.panel-row:first-child{border-top:0}.kpi .value{font-size:var(--text-kpi-row);letter-spacing:0;font-variant-numeric:tabular-nums;font-weight:650;line-height:1}.kpi .label{color:var(--color-text-dim);margin-top:6px;font-size:.76rem}.kpi .unit{color:var(--color-text-faint);margin-left:4px;font-size:.78rem}.chart-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);min-height:158px;padding:var(--space-3) var(--space-3) var(--space-2);position:relative}.chart-head{justify-content:space-between;align-items:baseline;gap:var(--space-3);margin-bottom:var(--space-2);display:flex}.chart-card .title{color:var(--color-text-dim);font-size:.82rem}.chart-meta{color:var(--color-text-faint);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:.72rem}.chart-empty{inset:44px var(--space-3) var(--space-3) var(--space-3);color:var(--color-text-faint);pointer-events:none;place-items:center;font-size:.78rem;display:grid;position:absolute}.range{align-items:center;gap:var(--space-2);display:flex}.range input,.field input,.field select{background:var(--color-surface-2);border:1px solid var(--color-border-strong);color:var(--color-text);font:inherit;border-radius:6px;padding:6px 8px}.btn{background:var(--color-surface-2);border:1px solid var(--color-border-strong);color:var(--color-text);transition:border-color var(--duration-fast), background var(--duration-fast);border-radius:6px;padding:6px 12px}.btn:hover{border-color:var(--c-cph)}.btn.primary{background:color-mix(in oklch, var(--c-cph) 30%, var(--color-surface-2));border-color:var(--c-cph)}.quick{gap:4px;display:inline-flex}.quick button{border:1px solid var(--color-border);color:var(--color-text-dim);background:0 0;border-radius:6px;padding:5px 9px;font-size:.8rem}.quick button.active{color:var(--color-text);border-color:var(--c-cph)}.ops{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:var(--space-4)}.ops-toolbar{gap:var(--space-2);margin-bottom:var(--space-4);flex-wrap:wrap;display:flex}table.ops-table{border-collapse:collapse;width:100%;font-size:.82rem}table.ops-table th,table.ops-table td{text-align:left;border-bottom:1px solid var(--color-border);white-space:nowrap;padding:8px 10px}table.ops-table th{color:var(--color-text-faint);text-transform:uppercase;letter-spacing:.06em;font-size:.68rem;font-weight:500}table.ops-table td.num{text-align:right;font-variant-numeric:tabular-nums}.field{flex-direction:column;gap:4px;display:flex}.field label{color:var(--color-text-faint);font-size:.72rem}.form-grid{gap:var(--space-3);margin-top:var(--space-3);grid-template-columns:repeat(auto-fit,minmax(120px,1fr));display:grid}.note{color:var(--color-text-faint);font-size:.78rem}.banner{background:color-mix(in oklch, var(--c-robots) 14%, var(--color-surface));border:1px solid color-mix(in oklch, var(--c-robots) 40%, var(--color-border));border-radius:var(--radius);padding:var(--space-3) var(--space-4);margin-bottom:var(--space-4);color:var(--color-text-dim);font-size:.82rem}@media (width<=880px){.app{grid-template-columns:1fr}.topbar,.topbar-main{flex-direction:column;align-items:flex-start}.brand-lockup{min-width:0}.destro-logo{width:132px}.yusen-logo{width:98px}.sidebar{height:auto;position:static}.panel-row{gap:var(--space-3);grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){*{transition:none!important}}.kpi-summary{gap:var(--space-3);margin-bottom:var(--space-5);grid-template-columns:repeat(auto-fit,minmax(150px,1fr));display:grid}.kpi-summary .kpi{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);min-height:92px;padding:var(--space-3)}.kpi-summary .kpi .value{font-size:var(--text-kpi);line-height:1.05}.kpi-summary .kpi .label{font-size:.74rem;line-height:1.25}
