/* Warehouse Operations: canonical Prism tokens, typography and shared primitives. */
:root{
  color-scheme:light;
  --surface:#fff;--surface-soft:#f1effc;--ink:#182347;--muted:#465273;
  --line:#dbe1f0;--line-dark:#8994b5;
  --accent:#5b50c6;--partial:#705496;--accent-soft:#f1effc;
  --completion:#246f9b;--completion-soft:#e4f5fc;
  /* Available-to-work is its own deep jade so it never reads as a completed shipment (blue). */
  --available:#17705a;--available-soft:#e6f3ee;
  --danger-ink:#8b2857;--danger-soft:#f8edf4;--danger-line:#d4a9c0;
  --amber:#805012;--amber-soft:#fff4e3;--amber-line:#dec9a3;
  --slate:#596481;--slate-soft:#eef1f8;
  --radius-panel:20px;--radius-control:16px;
  --shadow-panel:0 8px 24px #3d497810;
  --gradient-backlog:radial-gradient(ellipse at 92% 4%,#ffb79d 0%,#ffd5c3 24%,transparent 63%),radial-gradient(ellipse at 0% 64%,#b7adf1 0%,#ded3f7 42%,transparent 76%),radial-gradient(ellipse at 66% 100%,#f0bbdf 0%,transparent 64%),#ede5fa;
  --gradient-complete:radial-gradient(ellipse at 95% 6%,#84a0f7 0%,transparent 61%),radial-gradient(ellipse at 3% 91%,#63d5df 0%,transparent 66%),radial-gradient(ellipse at 8% 5%,#c6e8ff 0%,transparent 60%),#c5cff7;
  --gradient-issue:linear-gradient(120deg,#f4dfeb,#ede5fb);
  --chart-surface:#f7f9ff;--chart-grid:#d5ddec;--chart-schedule:#efeefa;
  --chart-schedule-edge:var(--slate);--chart-observed:#6576b4;
  --volume-1:#e2f3fa;--volume-2:#bfe5f2;--volume-3:#82c1dc;--volume-4:#246f9b;
  /* Compatibility aliases used by the live renderers and view modules. */
  --paper:var(--surface);--paper-2:var(--surface-soft);--white:var(--surface);
  --blue:var(--accent);--blue-soft:var(--accent-soft);
  --violet:var(--partial);--violet-soft:var(--accent-soft);
  --green:var(--completion);--green-deep:var(--completion);--green-soft:var(--completion-soft);
  --cyan:var(--completion);--cyan-soft:var(--completion-soft);
  --red:var(--danger-ink);--red-soft:var(--danger-soft);--issue-fill:var(--danger-ink);
  --backlog-fill:var(--accent);--completed-fill:var(--completion);--picking-fill:var(--accent);--packed-fill:var(--surface-soft);
  --focus:var(--accent);--radius:var(--radius-panel);--shadow:var(--shadow-panel);
  --night:var(--ink);--gold:var(--accent);--gold-soft:var(--accent-soft);--coral:var(--danger-ink);
  --logo-filter:none;
  --select-chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23465273' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  /* Existing effects centralized September 27; values and geometry unchanged.
     Pulse: September 22. Shipping/Horizon: September 23–25. Streak: September 27. */
  --backdrop:#18234780;
  --shadow-sheet:0 -12px 32px #18234724;
  --shadow-horizon:0 8px 16px -8px #3d4978b3,0 1px 2px #3d497826;
  --shadow-horizon-inset:inset 0 2px 5px #0c133259,inset 0 -1px 2px #ffffff80,inset 0 0 0 1px #18234714;
  --shadow-nav:0 1px 2px #18234729;
  --pulse-warm:linear-gradient(135deg,#ffb79d,#f0bbdf 45%,transparent 88%);
  --pulse-teal:linear-gradient(135deg,#63d5df,#84a0f7 45%,transparent 88%);
  --pulse-violet:linear-gradient(135deg,color-mix(in srgb,var(--accent) 40%,#fff),color-mix(in srgb,var(--accent) 16%,#fff) 45%,transparent 88%);
  --pulse-jade:linear-gradient(135deg,color-mix(in srgb,var(--available) 42%,#fff),color-mix(in srgb,var(--available) 18%,#fff) 45%,transparent 88%);
  --pulse-berry:linear-gradient(135deg,color-mix(in srgb,var(--danger-ink) 30%,#fff),var(--danger-soft) 45%,transparent 88%);
  --pulse-amber:linear-gradient(135deg,color-mix(in srgb,var(--amber) 34%,#fff),var(--amber-soft) 45%,transparent 88%);
  --pulse-sweep:linear-gradient(105deg,transparent 33%,#ffb79d 40%,#b7adf1 50%,#63d5df 58%,#fff 61.5%,transparent 62.5%);
  --pulse-sweep-reverse:linear-gradient(285deg,transparent 33%,#ffb79d 40%,#b7adf1 50%,#63d5df 58%,#fff 61.5%,transparent 62.5%);
  --shadow-popover:0 12px 32px #18234724;
  --backdrop-shipping:#18234788;
  --gradient-enroute:radial-gradient(ellipse at 92% 4%,#b3e0ea 0%,#d9f0f6 24%,transparent 63%),radial-gradient(ellipse at 0% 64%,var(--volume-3) 0%,var(--volume-2) 42%,transparent 76%),radial-gradient(ellipse at 66% 100%,#a1c1e4 0%,transparent 64%),var(--volume-1);
  --gradient-delivered:radial-gradient(ellipse at 92% 4%,#dcd1f4 0%,#ebe4fa 24%,transparent 63%),radial-gradient(ellipse at 0% 64%,#8c8cec 0%,#b7b7f3 42%,transparent 76%),radial-gradient(ellipse at 66% 100%,#b6c1f2 0%,transparent 64%),var(--accent-soft);
  --gradient-out-for-delivery:radial-gradient(ellipse at 92% 4%,#c3d5f8 0%,#dbe6fb 24%,transparent 63%),radial-gradient(ellipse at 0% 64%,#6999ef 0%,#9fbcf4 42%,transparent 76%),radial-gradient(ellipse at 66% 100%,#a0c4f2 0%,transparent 64%),var(--out-for-delivery-soft);
  --out-for-delivery:#3c6bd0;
  --out-for-delivery-soft:#e3ecfc;
  --streak-sky:#f5f6fe;
  --streak-sky-blue:radial-gradient(closest-side,#c6e8ffcc,#c6e8ff00);
  --streak-sky-violet:radial-gradient(closest-side,#d9d3f8b3,#d9d3f800);
  --streak-sky-teal:radial-gradient(closest-side,#bfe9ee99,#bfe9ee00);
  --streak-sweep:linear-gradient(100deg,#fff0 0%,#ffffffb3 50%,#fff0 100%);
  --streak-sweep-phone:linear-gradient(190deg,#fff0 0%,#ffffffb3 50%,#fff0 100%);
  --band-sheen:radial-gradient(ellipse at 10% 6%,#ffffff99 0%,#fff0 62%);
  --band-sky:radial-gradient(ellipse at 70% 10%,#c6e8ffcc 0%,#c6e8ff00 55%),radial-gradient(ellipse at 25% 30%,#d9d3f8b3 0%,#d9d3f800 55%),radial-gradient(ellipse at 60% 70%,#bfe9ee80 0%,#bfe9ee00 60%);
  --band-sky-mask:radial-gradient(closest-side,#000 35%,#0000 100%);
  --streak-check-early:#ffffffb3;
  --streak-day-1:#bfe7f3;
  --streak-day-2:#a6d6f2;
  --streak-day-3:#8fb0f5;
  --streak-day-4:#9ca4f4;
  --streak-day-5:#ab98ee;
  --streak-day-6:#c89ce0;
  --streak-day-7:#e2a8cf;
  --streak-day-8:#f5b8b2;
  --band-start:#f2a869;
  --streak-sheen:radial-gradient(ellipse at 8% 5%,#ffffff8c 0%,#fff0 60%);
  --font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  --font-body:16px;--line-body:24px;--font-detail:15px;--line-detail:22px;
  --font-title:36px;--line-title:40px;--font-section:28px;--line-section:34px;
  --font-panel:20px;--line-panel:26px;--font-stat:28px;--line-stat:34px;
  --font-metric:48px;--line-metric:50px;--font-freshness:24px;--line-freshness:28px;
  --font-order:18px;--line-order:26px;
  --weight-regular:400;--weight-medium:500;--weight-bold:700;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--surface);color:var(--ink);font-family:var(--font-family);font-size:var(--font-body);line-height:var(--line-body);font-weight:var(--weight-regular);letter-spacing:0;-webkit-font-smoothing:antialiased}
a{color:inherit;text-underline-offset:3px}
button,input,select,textarea{font:inherit;letter-spacing:0;color:inherit}
button,a,summary,input,select{touch-action:manipulation}
button{cursor:pointer;min-height:48px}
/* Disabled stays white with muted text and a light border; lavender fill is reserved for actual selection. */
button:disabled{cursor:default;opacity:1;color:var(--muted);background:var(--surface);border-color:var(--line)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
[hidden]{display:none!important}
strong,b{font-weight:var(--weight-bold)}
h1,h2,h3{margin:0;letter-spacing:0;font-weight:var(--weight-bold)}
h1{max-width:900px;font-size:var(--font-title);line-height:var(--line-title)}
h2,.section-title h2{font-size:var(--font-section);line-height:var(--line-section)}
h3,.panel-head h3,.source-status h3{font-size:var(--font-panel);line-height:var(--line-panel)}
.nav,.eyebrow,.kpi-label,.kpi-detail,.hero-meta,.panel-head p,.operations-table th,.operations-table td,.status-tag,.source-status,.source-status summary,footer{font-size:var(--font-detail);line-height:var(--line-detail);letter-spacing:0;text-transform:none}
.nav,.eyebrow,.kpi-label{font-weight:var(--weight-medium)}
.kpi-label,.kpi-detail,.muted{color:var(--muted)}
.panel-stat{font-size:var(--font-stat);line-height:var(--line-stat);font-weight:var(--weight-bold);color:var(--ink);white-space:nowrap}
.kpi-value{font-size:var(--font-metric);line-height:var(--line-metric);font-weight:var(--weight-bold);margin:12px 0 5px;max-width:100%;overflow-wrap:anywhere}
.tabular,.panel-stat,.kpi-value{font-variant-numeric:tabular-nums}
.order-number{font-size:var(--font-order);line-height:var(--line-order);text-decoration:underline;text-underline-offset:4px}
.order-reasons,.order-item-name{font-size:var(--font-body);line-height:var(--line-body)}
.order-reasons{font-weight:var(--weight-medium);color:var(--danger-ink)}
.order-chevron{font-size:var(--font-stat);line-height:var(--font-stat);font-weight:var(--weight-regular)}
.warehouse-cards .kpi-label{font-size:var(--font-body);line-height:var(--line-body)}
.warehouse-cards .kpi:nth-child(n+3) .kpi-value{font-size:var(--font-stat);line-height:var(--line-stat)}
.freshness-card .panel-stat{font-size:var(--font-freshness);line-height:var(--line-freshness)}
.section-title p{font-size:var(--font-detail);line-height:var(--line-detail);color:var(--muted);max-width:850px}
/* Approved October 4 work-tab palette. The shared report palette remains above. */
.work-tab{--stage-arrived:#646b78;--complete-base:#c5cff7}
/* Approved October 6 waiting-floor palette (Shipping): At warehouse amber, Picked up violet. The shared report palette remains above. */
.waiting-block,.floor-flows{--warehouse:#b06f1c;--warehouse-ink:#8a5410;--warehouse-wash:#f3d3a3;--picked:#9a4fa8;--picked-ink:#8a4199;--picked-wash:#e3cbee}
.positive{color:var(--completion);font-weight:var(--weight-bold)}
.negative{color:var(--danger-ink);font-weight:var(--weight-bold)}
.wrap{width:min(1420px,calc(100% - 48px));margin:0 auto}
.skip-link{position:fixed;top:-100px;left:16px;z-index:100;background:var(--surface);padding:12px 16px;border:1px solid var(--line);border-radius:var(--radius-control)}
.skip-link:focus{top:12px}
.masthead{position:sticky;top:0;z-index:20;background:var(--surface);color:var(--ink);border-bottom:1px solid var(--line)}
/* Equal outer tracks keep the report nav in the same centred place whether or not a page shows a status tag. */
.masthead-inner{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:28px;min-height:68px}
.masthead-inner>.nav{grid-column:2}.masthead-inner>.status-tag{grid-column:3;justify-self:end}
.masthead img{display:block;width:130px;height:34px;filter:var(--logo-filter)}
.nav{display:flex;align-items:center;gap:22px;color:var(--muted)}
.nav a{display:inline-flex;align-items:center;min-height:48px;text-decoration:none}
.nav a:hover{color:var(--accent)}
.nav a[aria-current=page]{color:var(--ink);box-shadow:inset 0 -2px 0 var(--accent)}
.hero{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:24px;padding:24px 0 16px}
.eyebrow{margin:0 0 8px;color:var(--accent)}
.hero-meta{color:var(--muted)}
.hero-meta p{margin:0 0 8px}
.hero-meta strong{display:block;color:var(--ink);margin-bottom:3px}
.freshness-card{min-width:250px;padding:14px 20px;border:1px solid var(--line);border-radius:var(--radius-panel);background:var(--slate-soft);color:var(--ink)}
.freshness-card p{margin:0}
.freshness-card .panel-stat{margin:2px 0 0}
.freshness-card .kpi-detail{display:block;color:var(--ink)}
.freshness-card>span:not([hidden]){display:block;margin-top:8px}
.freshness-card .source-link{display:block;margin-top:8px;color:var(--accent);text-decoration:underline}
.freshness-card .source-link:hover{color:var(--ink)}
section{padding:0 0 24px;scroll-margin-top:90px}
.section-bar{display:flex;align-items:end;justify-content:space-between;gap:20px;margin:24px 0 16px}
.section-bar h2,.section-bar h3,.section-bar p{margin:0}
.section-bar p{margin-top:6px}
.grid-2,.grid-3{display:grid;gap:18px;margin-bottom:18px}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.panel{scroll-margin-top:90px;border:1px solid var(--line);border-radius:var(--radius-panel);background:var(--surface);overflow:hidden}
.panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;padding:20px 24px;border-bottom:1px solid var(--line)}
.panel-head h3{margin:0}
.panel-head p{margin:6px 0 0;max-width:700px;color:var(--muted)}
.panel-body{padding:24px}
.kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.kpi{display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;gap:8px;min-height:190px;padding:24px;text-align:left;border:1px solid var(--line);border-radius:var(--radius-panel);background:var(--surface);color:var(--ink)}
.kpi.primary,.kpi.warning{color:var(--ink)}
.kpi.primary .kpi-label,.kpi.primary .kpi-detail,.kpi.warning .kpi-label,.kpi.warning .kpi-detail{color:inherit}
.summary-card,.ask{padding:24px;border:1px solid var(--line);border-radius:var(--radius-panel);background:var(--surface)}
.ask h3{margin:0 0 12px}
.ask p{margin:0;color:var(--muted)}
.bar-track{display:block;height:8px;overflow:hidden;border-radius:999px;background:var(--accent-soft)}
.bar{display:block;height:100%;min-width:0;border-radius:999px;background:var(--accent)}
label{display:grid;gap:6px;min-width:0}
select,input{width:100%;min-height:48px;padding:10px 14px;border:1px solid var(--line-dark);border-radius:var(--radius-control);background:var(--surface);color:var(--ink)}
select{appearance:none;-webkit-appearance:none;padding-right:44px;background-image:var(--select-chevron);background-repeat:no-repeat;background-position:right 14px center;background-size:16px}
input::placeholder{color:var(--muted);opacity:1}
/* Enabled actions: white field, visible border, accent text. Disabled: white field, light border, muted text. */
.detail-button,.toolbar>button,.pagination button,#all-stores{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:10px 16px;border:1px solid var(--line-dark);border-radius:var(--radius-control);background:var(--surface);color:var(--accent);text-decoration:none}
.detail-button:not(:disabled):hover,.toolbar>button:not(:disabled):hover,.pagination button:not(:disabled):hover,#all-stores:not(:disabled):hover{border-color:var(--accent)}
.pagination button:disabled{color:var(--muted);background:var(--surface);border-color:var(--line)}
.status-tag{display:inline-flex;align-items:center;gap:7px;padding:5px 10px;border:1px solid var(--completion);border-radius:var(--radius-control);background:var(--completion-soft);color:var(--completion)}
.status-tag::before{content:'';width:6px;height:6px;flex:none;border-radius:50%;background:currentColor}
.status-tag.amber{border-color:var(--amber-line);background:var(--amber-soft);color:var(--amber)}
.status-tag.neutral{border-color:var(--line);background:var(--slate-soft);color:var(--muted)}
.status-tag.red{border-color:var(--danger-line);background:var(--danger-soft);color:var(--danger-ink)}
.status-tag.red::before{content:'!';display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border:1px solid currentColor;background:transparent}
table{width:100%;border-collapse:collapse}
th,td{padding:16px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
th{color:var(--muted);font-weight:var(--weight-bold)}
.table-scroll{max-height:510px;overflow:auto;border:1px solid var(--line);border-radius:var(--radius-panel);background:var(--surface)}
.operations-table th{position:sticky;top:0;z-index:1;background:var(--surface-soft);white-space:normal;vertical-align:bottom}
.operations-table td{white-space:normal}
.operations-table .sub{display:block;margin-top:4px}
.operations-table tr.selected{background:var(--accent-soft)}
.store-button{padding:0;border:0;background:none;color:var(--accent);text-align:left;text-decoration:underline;text-underline-offset:3px}
.store-button:hover{color:var(--ink)}
.source-status{margin-top:30px;padding:20px 0 32px;border-top:1px solid var(--line-dark)}
.source-status>summary{min-height:48px;cursor:pointer}
.source-status .grid-2{gap:24px}
.source-status p{margin:12px 0}
footer{display:flex;justify-content:space-between;gap:20px;padding:30px 0 54px;border-top:1px solid var(--line);color:var(--muted)}
@media(max-width:1100px){.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){
  :root{--font-title:28px;--line-title:32px;--font-section:24px;--line-section:30px;--font-metric:40px;--line-metric:44px}
  .wrap{width:calc(100% - 32px)}
  section,.panel{scroll-margin-top:24px}
  .masthead{position:static}.masthead-inner{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;min-height:62px;padding:12px 0}.nav{order:3;width:100%;gap:20px}
  .hero{grid-template-columns:minmax(0,1fr);padding:20px 0 16px;gap:14px}
  .freshness-card{min-width:0;padding:12px 16px}
  .freshness-card p{display:flex;align-items:center;justify-content:space-between;gap:12px}
  .freshness-card p>strong{margin:0;font-weight:var(--weight-medium)}
  .freshness-card .panel-stat{margin:0}
  .section-bar{align-items:flex-start;flex-wrap:wrap;gap:14px}.section-bar>span{width:100%}
  .grid-2,.grid-3{grid-template-columns:1fr}
  .panel-head{flex-direction:column;padding:16px;gap:16px}.panel-body{padding:16px}
  .kpi-value{margin:4px 0}.warehouse-cards .kpi-label{font-size:var(--font-detail);line-height:var(--line-detail)}
  .dimension-tabs button{font-size:var(--font-detail);line-height:var(--line-detail)}
  .table-scroll{max-height:650px}
  .operations-table,.operations-table tbody,.operations-table tr,.operations-table td{display:block}
  .operations-table thead{display:none}.operations-table{min-width:0}
  .operations-table tr{padding:18px;border-bottom:1px solid var(--line)}
  .operations-table td{padding:5px 0;border:0;text-align:left;overflow-wrap:anywhere}
  .operations-table td[data-label]{display:grid;grid-template-columns:minmax(112px,44%) minmax(0,1fr);gap:12px}
  .operations-table td[data-label]::before{content:attr(data-label);color:var(--muted)}
  .operations-table td:first-child{padding-bottom:12px}
  .artist-table td:first-child .store-button{font-weight:var(--weight-bold)}
  .source-status .grid-2{gap:20px}.source-status p{overflow-wrap:anywhere}
  footer{flex-direction:column}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media print{
  body{background:#fff}.masthead{position:static}.nav{display:none}
  .wrap{width:100%;padding:0 20px}.panel,.kpi,.ask,.warehouse-order{break-inside:avoid;box-shadow:none}
  .table-scroll{max-height:none;overflow:visible}section{padding-bottom:24px}
}

/* Connection words use the existing body role; elapsed refresh values retain prominence. */
.freshness-card .panel-stat.freshness-pending{font-size:var(--font-body);line-height:var(--line-body);font-weight:var(--weight-regular)}

/* Header, September 26: source status lives in the dot and time, never the surface.
   The hero selector also supersedes the Aged pending-surface rule without changing its loading geometry. */
.hero .freshness-card,.hero .freshness-card.source-checks:has(.freshness-pending){background:var(--slate-soft);border:1px solid var(--line)}
.hero .freshness-card p>strong{display:flex;align-items:center;gap:8px}
.hero .freshness-card p>strong::before{content:'';flex:none;width:8px;height:8px;border-radius:50%;background:var(--available)}
.hero .freshness-card p:has(.freshness-pending)>strong::before{background:var(--slate)}
.hero .freshness-card .freshness-pending{color:var(--muted)}
body:has(#live-connection[data-connection=reconnecting]) .hero .freshness-card .panel-stat,
.hero .freshness-card[data-stale] .panel-stat{color:var(--amber)}
body:has(#live-connection[data-connection=reconnecting]) .hero .freshness-card p>strong::before,
.hero .freshness-card[data-stale] p>strong::before{background:var(--amber)}
.hero .freshness-pill{background:var(--slate-soft);border:1px solid var(--line)}
.hero .freshness-pill [data-pill-age]{color:var(--ink)}
.hero .freshness-pill .freshness-pending{color:var(--muted)}
.masthead-product{display:inline-flex;align-items:center;min-height:20px;padding-left:12px;border-left:1px solid var(--line);color:var(--muted)}

.masthead-brand{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
/* Matches the approved header lab's proposal.css (9b945c4b). */
@media(min-width:761px){.masthead-brand>img{width:156px;height:auto}}
@media(max-width:1199px){.masthead-product{display:none}}
/* Shipping's mirror and production route share the same header spacing. */
#report>.transport-toolbar.header-toolbar{margin-top:0;padding-top:0;border-bottom:0}
#report>.transport-toolbar.header-toolbar+.artist-picker-row{padding-top:24px}
