:root{--bg: #0a0f1a;--surface: #121a2a;--card: #18233a;--card-top: #1d2a44;--line: #2a3958;--line-soft: #1f2c46;--text: #f1f5fb;--muted: #8a98b4;--muted-dim: #5f6d8a;--live: #34d27f;--soon: #f5b441;--late: #ff5d5d;--queue: #5b8def;--display: "Saira Condensed", "Arial Narrow", sans-serif;--body: "Inter", system-ui, -apple-system, sans-serif;--radius: 14px;--gap: 19px}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}html,body{overflow:hidden;background:radial-gradient(1200px 700px at 80% -10%,#16213a,#16213a00 60%),var(--bg);color:var(--text);font-family:var(--body);font-size:20px;-webkit-font-smoothing:antialiased}#fit{position:fixed;top:0;left:0;height:1080px;width:calc(100vw / var(--fit, 1));transform:scale(var(--fit, 1));transform-origin:top left}#app{height:100%;display:grid;grid-template-rows:auto 1fr auto;grid-template-columns:minmax(0,1fr);padding:23px;gap:var(--gap)}header{display:flex;align-items:center;justify-content:space-between;padding:13px 19px;background:linear-gradient(180deg,var(--card-top),var(--surface));border:1px solid var(--line);border-radius:var(--radius)}.brand{display:flex;align-items:baseline;gap:.7em;min-width:0}.mark{font-family:var(--display);font-weight:700;letter-spacing:.06em;font-size:1.5rem;color:var(--text)}.mark .v{color:var(--bg);background:var(--live);border-radius:6px;padding:0 .32em;margin-right:.18em}.site-name{font-family:var(--display);font-weight:600;font-size:1.7rem;letter-spacing:.04em;text-transform:uppercase;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.site-name .tag{color:var(--muted);font-weight:500}.head-right{display:flex;align-items:center;gap:27px}.live-chip{display:flex;align-items:center;gap:.5em;font-family:var(--display);font-weight:600;letter-spacing:.14em;font-size:.95rem;color:var(--live);text-transform:uppercase}.live-chip.is-demo{color:var(--soon)}.live-chip.is-error{color:var(--late)}.dot{width:.7em;height:.7em;border-radius:50%;background:currentColor;box-shadow:0 0 0 0 currentColor;animation:pulse 2s infinite}@keyframes pulse{0%{box-shadow:0 0 color-mix(in srgb,currentColor 60%,transparent)}70%{box-shadow:0 0 0 .7em color-mix(in srgb,currentColor 0%,transparent)}to{box-shadow:0 0 color-mix(in srgb,currentColor 0%,transparent)}}.clock{font-family:var(--display);font-weight:600;font-size:1.7rem;letter-spacing:.05em;font-variant-numeric:tabular-nums;color:var(--text)}main{display:grid;grid-template-rows:1fr auto;grid-template-columns:minmax(0,1fr);gap:var(--gap);min-height:0}.lane{display:flex;flex-direction:column;min-height:0}.prod-row{display:flex;gap:var(--gap);min-height:0;min-width:0}.prod-lane{flex:1 1 0;min-width:0;display:flex;flex-direction:column;min-height:0;container-type:inline-size}.prod-lane .lane-rail{background:var(--live)}.prod-lane .card{gap:clamp(8px,1.4cqi,22px);justify-content:space-between}.prod-lane .card-foot{margin-top:0}.prod-lane .device,.prod-lane .card-foot,.prod-lane .card-foot .chips{min-height:0}.prod-lane .foot-main{flex-shrink:0}.prod-lane .lane-title{font-size:2rem}.prod-lane .customer{font-size:clamp(1.6rem,6.3cqi,8.5rem);-webkit-line-clamp:2}.prod-lane .stat .num{font-size:clamp(1.3rem,5.6cqi,6.8rem)}.prod-lane .stat .lbl{font-size:clamp(.68rem,1.2cqi,1.3rem)}.prod-lane .device{font-size:clamp(.9rem,2.4cqi,2.4rem);-webkit-line-clamp:3}.prod-lane .chips{max-height:5.4em}.prod-lane .chip{font-size:clamp(.72rem,1.7cqi,1.7rem)}.prod-lane .badge{font-size:clamp(.78rem,1.6cqi,1.5rem)}.prod-lane .progress .bar{height:clamp(.6em,1cqi,1.3em)}.prod-lane .progress .meta{font-size:clamp(.72rem,1.5cqi,1.5rem)}.prod-lane .date-item .val{font-size:clamp(1.1rem,2.7cqi,2.8rem);line-height:1.15}.prod-lane .date-item .lbl{font-size:clamp(.66rem,1.1cqi,1.1rem)}.prod-lane .so-pill{font-size:clamp(.95rem,2.2cqi,2.2rem)}.prod-row:has(>.prod-lane:only-child) .prod-lane .card{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto auto 1fr auto;grid-template-areas:"top    top" "cust   stats" "device stats" ".      ." "foot   foot";column-gap:clamp(24px,4cqi,90px);row-gap:clamp(6px,1cqi,14px);align-content:start}.prod-row:has(>.prod-lane:only-child) .prod-lane .card-top{grid-area:top}.prod-row:has(>.prod-lane:only-child) .prod-lane .customer{grid-area:cust;font-size:clamp(1.8rem,3.2cqi,3.6rem);-webkit-line-clamp:1;align-self:end}.prod-row:has(>.prod-lane:only-child) .prod-lane .stats{grid-area:stats;align-self:center}.prod-row:has(>.prod-lane:only-child) .prod-lane .stat .num{font-size:clamp(1.6rem,4.6cqi,5.4rem)}.prod-row:has(>.prod-lane:only-child) .prod-lane .device{grid-area:device;font-size:clamp(1rem,1.9cqi,2rem);-webkit-line-clamp:1}.prod-row:has(>.prod-lane:only-child) .prod-lane .card-foot{grid-area:foot;align-self:end}.prod-row:has(>.prod-lane:nth-child(3)) .prod-lane .customer{font-size:clamp(1.6rem,7.6cqi,5rem)}.prod-row:has(>.prod-lane:nth-child(3)) .prod-lane .stat .num{font-size:clamp(1.3rem,6.2cqi,4.2rem)}.prod-row:has(>.prod-lane:nth-child(4)) .prod-lane .customer{font-size:clamp(1.6rem,9.2cqi,4.4rem)}.prod-row:has(>.prod-lane:nth-child(4)) .prod-lane .stat .num{font-size:clamp(1.3rem,7.4cqi,3.4rem)}.queue-row{display:flex;flex-direction:column;min-height:0;height:346px}.lane-queue .card{gap:7px;padding:13px 18px}.queue-row .lane-rail{background:var(--queue)}.marquee{position:relative;flex:1;min-height:0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 2.5%,#000 97.5%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 2.5%,#000 97.5%,transparent 100%)}.marquee-track{display:flex;height:100%;width:max-content;animation-name:marquee;animation-timing-function:linear;animation-iteration-count:infinite;will-change:transform}.marquee:hover .marquee-track{animation-play-state:paused}.marquee-item{flex:0 0 auto;width:442px;height:100%;margin-right:var(--gap);display:flex}.marquee-item .card{flex:1}.marquee-start{flex:0 0 auto;height:100%;margin-right:var(--gap);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5em;padding:0 13px;border-radius:var(--radius);border:1px solid color-mix(in srgb,var(--live) 45%,transparent);background:linear-gradient(180deg,color-mix(in srgb,var(--live) 20%,transparent),color-mix(in srgb,var(--live) 6%,transparent))}.marquee-start-label{font-family:var(--display);font-weight:700;font-size:1.25rem;letter-spacing:.22em;text-transform:uppercase;color:var(--live);writing-mode:vertical-rl;transform:rotate(180deg)}.marquee-start-arrow{font-size:1.9rem;line-height:1;color:var(--live)}@keyframes marquee{0%{transform:translate(0)}to{transform:translate(-50%)}}.lane-head{display:flex;align-items:center;gap:.7em;padding:0 .2em 13px}.lane-title{font-family:var(--display);font-weight:700;font-size:1.55rem;letter-spacing:.1em;text-transform:uppercase}.lane-rail{width:.32em;align-self:stretch;border-radius:3px}.lane-active .lane-rail{background:var(--live)}.lane-queue .lane-rail{background:var(--queue)}.count-pill{font-family:var(--display);font-weight:600;font-size:1rem;letter-spacing:.04em;padding:.1em .6em;border-radius:999px;background:var(--card);border:1px solid var(--line);color:var(--muted)}.more-pill{margin-left:auto;font-size:.85rem;color:var(--muted);letter-spacing:.03em}.cards{display:flex;flex-direction:column;gap:var(--gap);min-height:0;flex:1}.card{position:relative;flex:1;min-height:0;background:linear-gradient(180deg,var(--card-top),var(--card));border:1px solid var(--line);border-left:4px solid var(--line);border-radius:var(--radius);padding:17px 21px;display:flex;flex-direction:column;gap:10px;overflow:hidden}.card.state-overdue{border-left-color:var(--late)}.card.state-soon{border-left-color:var(--soon)}.card.state-ontrack{border-left-color:var(--live)}.lane-queue .card.state-ontrack{border-left-color:var(--queue)}.card-top{display:flex;align-items:center;gap:.55em;flex-wrap:wrap}.badge{font-family:var(--display);font-weight:600;font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;padding:.12em .62em;border-radius:6px;border:1px solid transparent}.badge-priority,.badge-state-overdue{color:var(--late);border-color:color-mix(in srgb,var(--late) 45%,transparent);background:color-mix(in srgb,var(--late) 14%,transparent)}.badge-state-soon{color:var(--soon);border-color:color-mix(in srgb,var(--soon) 45%,transparent);background:color-mix(in srgb,var(--soon) 14%,transparent)}.so-pill{margin-left:auto;font-family:var(--display);font-weight:600;letter-spacing:.06em;font-size:1rem;color:var(--muted);font-variant-numeric:tabular-nums}.customer{font-family:var(--display);font-weight:700;line-height:1.02;font-size:1.85rem;letter-spacing:.01em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.lane-queue .customer{font-size:1.3rem;-webkit-line-clamp:1;line-height:1.18;flex-shrink:0}.stats{display:flex;align-items:stretch;gap:15px}.stat{display:flex;flex-direction:column;gap:.1em}.stat .num{font-family:var(--display);font-weight:700;font-size:1.5rem;line-height:1;font-variant-numeric:tabular-nums}.lane-queue .stat .num{font-size:1.1rem}.stat .lbl{font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}.stat-divider{width:1px;background:var(--line-soft)}.device{font-size:.92rem;color:var(--muted);line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.lane-queue .device{-webkit-line-clamp:1;min-height:0}.device .sku-missing{color:var(--muted-dim)}.chips{display:flex;flex-wrap:wrap;gap:.4em;overflow:hidden;max-height:2.6em}.lane-queue .chips{max-height:none;min-height:0}.lane-queue .foot-main{flex-shrink:0}.chip{font-size:.72rem;font-weight:700;letter-spacing:.03em;padding:.18em .55em;border-radius:6px;background:color-mix(in srgb,var(--queue) 12%,transparent);border:1px solid var(--line-soft);color:#aebfe0;white-space:nowrap}.card-foot{margin-top:auto;display:flex;flex-direction:column;gap:9px}.foot-main{display:flex;align-items:center;gap:17px}.card-foot .chips{flex:0 0 auto;overflow-y:auto;overflow-x:hidden}.card-foot .chips::-webkit-scrollbar{width:6px}.card-foot .chips::-webkit-scrollbar-thumb{background:var(--line-soft);border-radius:999px}.progress{flex:1;min-width:0}.progress .bar{height:.62em;border-radius:999px;background:var(--line-soft);overflow:hidden}.progress .fill{height:100%;border-radius:999px;background:var(--live);transition:width .8s ease}.progress .meta{display:flex;justify-content:space-between;margin-top:.3em;font-size:.74rem;color:var(--muted);font-variant-numeric:tabular-nums}.dates{display:flex;gap:19px;margin-left:auto}.date-item{display:flex;flex-direction:column;align-items:flex-end;gap:.1em}.date-item .lbl{font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}.date-item .val{font-family:var(--display);font-weight:600;font-size:1.15rem;font-variant-numeric:tabular-nums}.date-item .val.is-overdue{color:var(--late)}.date-item .val.is-soon{color:var(--soon)}.empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3em;border:1px dashed var(--line);border-radius:var(--radius);color:var(--muted)}.empty .big{font-family:var(--display);font-weight:600;font-size:1.5rem;letter-spacing:.05em;color:var(--muted)}.empty .sub{font-size:.85rem}footer{display:flex;align-items:center;justify-content:space-between;padding:10px 17px;border-top:1px solid var(--line-soft);color:var(--muted);font-size:.82rem}.sites{display:flex;gap:.4em}.site-btn{font-family:var(--display);font-weight:600;letter-spacing:.08em;font-size:.9rem;color:var(--muted);background:transparent;border:1px solid var(--line);border-radius:8px;padding:.2em .7em;cursor:pointer}.site-btn:hover{color:var(--text);border-color:var(--muted)}.site-btn.active{color:var(--bg);background:var(--live);border-color:var(--live)}.site-btn:focus-visible{outline:2px solid var(--live);outline-offset:2px}.foot-note{display:flex;align-items:center;gap:1.2em}.demo-flag{color:var(--soon);border:1px solid color-mix(in srgb,var(--soon) 40%,transparent);border-radius:6px;padding:.1em .5em;letter-spacing:.06em}.signin{height:100%;display:flex;align-items:center;justify-content:center;padding:24px}.signin-card{display:flex;flex-direction:column;align-items:center;gap:.7em;text-align:center;max-width:420px;padding:clamp(28px,4vw,56px);background:linear-gradient(180deg,var(--card-top),var(--card));border:1px solid var(--line);border-radius:var(--radius)}.signin-card .mark{font-size:1.7rem;margin-bottom:.2em}.signin-title{font-family:var(--display);font-weight:700;letter-spacing:.05em;text-transform:uppercase;font-size:1.6rem;margin:0}.signin-sub{color:var(--muted);line-height:1.5;margin:0 0 .6em}.signin-btn{font-family:var(--display);font-weight:700;letter-spacing:.06em;font-size:1.05rem;text-decoration:none;color:var(--bg);background:var(--live);border-radius:10px;padding:.7em 1.6em;transition:filter .15s ease}.signin-btn:hover{filter:brightness(1.08)}.signin-btn:focus-visible{outline:2px solid var(--live);outline-offset:3px}@media(prefers-reduced-motion:reduce){.dot{animation:none}.progress .fill{transition:none}.marquee-track{animation:none}}
