/* Warehouse working surface. Admin keeps its separate graphite/gold identity. */
:root {
  --bg: #f3f5f7; --surface: #fff; --surface2: #f7f9fc; --surface3: #edf2f7;
  --rail: #192631; --line: #dce3eb; --text: #243447; --muted: #627186;
  --gold: #2c5d8c; --gold2: #244f79; --green: #22724f; --red: #b1343d;
  --display: "Segoe UI", Arial, sans-serif; --shadow: 0 8px 28px rgba(23,42,65,.08);
  color-scheme: light;
}
body { font-size: 1rem; line-height: 1.45; }
button, input, select { font-size: .875rem; }
button { transition: background .15s; }
button:disabled { opacity: .55; cursor: not-allowed; }
button:focus-visible, summary:focus-visible, a:focus-visible { outline: 3px solid #6ca2d2; outline-offset: 3px; }
.shell { grid-template-columns: 246px minmax(0,1fr); }
.rail { border-color: #31414f; color: #dae2eb; padding: 16px 12px; }
.brand.compact { min-height: 72px; padding: 0 12px 18px; margin-bottom: 12px; }
.brand.compact img { width: 190px; filter: none; }
.operator { background: #22323f; border-color: #344654; margin: 0 4px 14px; }
.operator span, .operator small { font-size: .75rem; color: #b6c4d0; text-transform: none; letter-spacing: normal; }
.operator b { font-size: .875rem; }
.menu { gap: 4px; }
.menu p { font-size: .75rem; color: #a5b7c7; letter-spacing: .06em; margin: 18px 12px 5px; }
.menu button { color: #cfdae4; padding: 11px 12px; grid-template-columns: 20px 1fr; }
.menu button span { font-size: .75rem; color: #9db1c3; }
.menu button em { font-size: .875rem; }
.menu button:hover, .menu button.active { background: #30495e; color: #fff; }
.menu button.active span { color: #fff; }
.rail-footer { font-size: .75rem; color: #b5c4d1; border-color: #344654; padding: 14px 8px 0; gap: 12px; }
.rail-footer button { font-size: .875rem; color: #edf3fa; padding: 6px; }
.stage { padding: 24px; }
.topline { align-items: center; padding-bottom: 20px; }
.topline h1 { font-size: 1.75rem; font-weight: 600; }
.topline small, .topline p { font-size: .875rem; }
.topline small b { letter-spacing: .03em; }
.online span, .online b { font-size: .75rem; }
.command-bar { margin-top: 18px; gap: 12px; }
.control-card, .range-toggle { padding: 12px; border-radius: 8px; }
.control-card { gap: 12px; }
.control-card label, .range-toggle label, .operation-form > label, .form-grid label { font-size: .875rem; text-transform: none; font-weight: 500; gap: 7px; }
.control-card select, .range-toggle input, .operation-form input, .operation-form select, .form-grid input, .form-grid select {
  min-width: 0; height: 42px; background: #fff; color: var(--text); border: 1px solid #cbd5e1; border-radius: 6px;
}
.operation-form input:focus, .operation-form select:focus { border-color: #2c5d8c; box-shadow: 0 0 0 3px #e2ecf7; }
.control-card button, .range-toggle button, .operation-form button, .form-grid button { height: 42px; color: #fff; background: #2c5d8c; border-radius: 6px; }
.range-toggle summary { font-size: .875rem; color: var(--text); }
.range-toggle form { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 10px; }
.range-toggle form > div { grid-template-columns: minmax(0,1fr); }
.range-toggle form > button { grid-column: 1/-1; }
.quickbar { gap: 8px; margin: 14px 0; flex-wrap: wrap; }
.quickbar button { font-size: .875rem; padding: 8px 14px; background: #fff; color: #51657a; }
.quickbar button.selected { background: #e7eff8; border-color: #b9cde2; color: #224c75; }
.stock-mode .quickbar, .stock-mode .range-toggle, .stock-mode .control-card > label:nth-child(2) { display: none; }
.stock-mode .command-bar { grid-template-columns: minmax(280px,560px); margin-bottom: 18px; }
.stock-mode .control-card { grid-template-columns: minmax(0,1fr) auto; }
.content { gap: 18px; }
.kpi-wall { gap: 12px; grid-template-columns: repeat(auto-fit,minmax(170px,1fr)); }
.kpi { background: #fff; padding: 18px; min-height: 120px; gap: 10px; border-radius: 8px; }
.kpi span { font-size: .875rem; }
.kpi small { font-size: .75rem; }
.kpi strong { font-size: 1.6rem; font-weight: 600; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.kpi.value-main strong { color: var(--text); }
.owner-intel { background: #fff; padding: 18px; border-radius: 8px; }
.intel-head span { font-size: .75rem; letter-spacing: .04em; }
.intel-head h2 { font-size: 1.125rem; }
.intel-head p { font-size: .875rem; }
.intel-grid { gap: 12px; }
.intel-card { padding: 14px; background: #f7f9fc; }
.intel-card span { font-size: .875rem; }
.intel-card small { font-size: .75rem; }
.intel-card b { font-size: 1.125rem; font-weight: 600; }
.workspace-grid { gap: 18px; }
.glass-panel { padding: 18px; border-radius: 8px; background: #fff; }
.panel-head { margin-bottom: 16px; flex-wrap: wrap; }
.panel-head h2 { font-size: 1.125rem; font-weight: 600; }
.panel-head span, .section-note { font-size: .875rem; }
.section-note { line-height: 1.5; }
.branch-grid { gap: 12px; }
.branch { background: #f7f9fc; padding: 14px; }
.branch header strong { display: block; }
.branch dt, .branch small { font-size: .75rem; }
.branch dd { font-size: .875rem; font-variant-numeric: tabular-nums; }
.badge { font-size: .75rem; line-height: 1.3; color: #256e50; border-color: #bcdecf; background: #eef8f3; }
.badge.off { color: #a33840; border-color: #e8c5c9; background: #fff2f3; }
.badge.out { color: #945b24; border-color: #ead4b8; background: #fcf5ea; }
.table-wrap { border-radius: 6px; }
table { min-width: 780px; }
th, td { font-size: .875rem; padding: 12px 14px; line-height: 1.4; color: var(--text); }
th { color: #4e6176; background: #eef2f7; font-weight: 600; }
tbody tr:hover td { background: #f4f8fc; }
tbody tr:last-child td { border-bottom: 0; }
.numeric { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cell-meta { display: block; color: var(--muted); font-size: .75rem; margin-top: 3px; }
.operation-form { grid-template-columns: repeat(auto-fit,minmax(180px,1fr)); gap: 16px; margin-top: 18px; }
.operation-form .form-actions { gap: 10px; }
.operation-form .soft-button, .table-button { background: #f6f8fb; color: #2f506e; border: 1px solid #ccd8e5; }
.table-button, .danger { height: auto; min-height: 36px; padding: 7px 12px; font-size: .875rem; }
.danger { background: #fff1f2; color: #b1343d; border: 1px solid #efc6cb; }
.table-button.gold { background: #eaf1f9; border-color: #c0d1e3; color: #244f79; }
.table-actions { flex-wrap: wrap; min-width: 160px; gap: 8px; }
.flow-summary > div { padding: 14px; background: #f7f9fc; }
.flow-summary span, .flow-summary b { font-size: .875rem; }
.editor > summary { cursor: pointer; font-size: .9375rem; font-weight: 600; color: #2c5d8c; }
.editor[open] > summary { padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.pagination { display: flex; justify-content: flex-end; align-items: center; gap: 12px; padding-top: 16px; flex-wrap: wrap; }
.pagination > span { margin-right: auto; font-size: .875rem; color: var(--muted); }
.ops-panel { min-width: 0; max-width: 100%; }
.ops-form { display: block; }
.ops-form fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.ops-form label { display: grid; gap: 6px; font-size: .875rem; margin-bottom: 12px; }
.ops-form input, .ops-form select, .ops-form textarea { max-width: 100%; color: var(--text); background: #fff; border: 1px solid #cbd5e1; border-radius: 6px; padding: 10px; font: inherit; }
.ops-form textarea { min-height: 70px; resize: vertical; }
.ops-picker { display: flex; align-items: end; gap: 10px; flex-wrap: wrap; margin: 16px 0; }
.ops-picker label { flex: 1 1 190px; margin: 0; min-width: 0; }
.ops-picker p { flex-basis: 100%; }
.ops-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.ops-form .table-wrap { max-width: 100%; overflow-x: auto; }
.ops-form td input { min-width: 120px; width: 150px; }
.ops-warning { padding: 12px; border-left: 3px solid #a36a22; background: #fff8e9; color: #754709; }
#ops-error { color: #a12836; white-space: pre-wrap; }
.ops-form button:disabled, .ops-form fieldset:disabled { opacity: .65; }
.toast { max-width: min(430px,calc(100vw - 32px)); font-size: .875rem; background: #eef8f3; border-color: #adcfbc; color: #215b3c; }
.toast.error { background: #fff1f2; border-color: #e5b5bb; color: #992d36; }
footer { color: #627186; font-size: .75rem; padding-top: 24px; }
.login-shell { display: grid; grid-template-columns: 1fr; place-items: center; background: var(--bg); padding: 24px; }
.showcase { display: none; }
.auth { background: transparent; padding: 0; width: min(100%,440px); }
.login-card { background: #fff; padding: 32px; max-width: none; width: 100%; box-shadow: var(--shadow); }
.login-card h2 { font-size: 1.75rem; font-weight: 600; }
.login-card label { font-size: .875rem; color: var(--text); }
.login-card input { background: #fff; border-color: #cbd5e1; color: var(--text); }
.login-card button { background: #2c5d8c; color: #fff; }
.login-card .kicker { font-size: .75rem; letter-spacing: .06em; }
.back-link { font-size: .875rem; margin-bottom: 24px; }
.login-foot { font-size: .75rem; }
@media(max-width:1150px) {
  .shell { grid-template-columns: 220px minmax(0,1fr); }
  .stage { padding: 18px; }
  .workspace-grid, .command-bar { grid-template-columns: 1fr; }
}
@media(max-width:780px) {
  .shell { display: block; }
  .rail { position: static; height: auto; padding: 10px 12px; }
  .menu { display: flex; overflow-x: auto; gap: 6px; }
  .menu button { flex: 0 0 auto; white-space: nowrap; padding: 10px 14px; }
  .menu button em { font-size: .875rem; }
  .rail-footer { padding-top: 8px; margin-top: 8px; }
  .stage { padding: 16px; }
  .stock-mode .control-card { grid-template-columns: minmax(0,1fr) auto; }
  .stock-mode .control-card button { grid-column: auto; }
  .operation-form { grid-template-columns: 1fr 1fr; }
  .login-shell { padding: 16px; }
  .auth { min-height: auto; }
}
@media(max-width:460px) {
  .stage { padding: 12px; }
  .glass-panel, .owner-intel { padding: 14px; }
  .operation-form, .intel-grid { grid-template-columns: 1fr; }
  .kpi-wall { grid-template-columns: 1fr; }
  .login-card { padding: 24px; }
  .topline h1 { font-size: 1.5rem; }
}