:root{
    /* Vanspeed brand: slate blue primary + brass/tan secondary, earthy status */
    --bg:#0c1216; --panel:#161f26; --panel2:#111a20; --line:#2a3a44;
    --txt:#eef2f5; --muted:#9fb2bf; --faint:#6f8593;
    --muted2:#7a8f9c;
    --brand:#5b7e96; --brand2:#9fbdd0;        /* Vanspeed slate blue */
    --premium:#c79a5e; --premium2:#e0b47f;     /* brass / tan */
    --green:#4fae86; --blue:#5b7e96; --amber:#d9a24e; --red:#cf6b63;
    --greenbg:#12291f; --bluebg:#16252e; --amberbg:#31281a; --redbg:#301c1a;
    --radius:14px;
  }
  *{box-sizing:border-box}
  html,body{margin:0;height:100%}
  body{
    background:radial-gradient(1200px 700px at 80% -10%, #1b2c35 0%, var(--bg) 55%) fixed;
    color:var(--txt);
    font-family:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    -webkit-font-smoothing:antialiased;
    overflow:hidden;
  }
  .app{display:flex;flex-direction:column;height:100vh}
  /* Branded display type — condensed grotesque for wordmark, headers, and numbers */
  .brand h1,.clock .t,.kpi .val,.bcell .nm,.dhead .nm,.rcard .v,.rsec h4,.mhead h3{
    font-family:'Oswald','Inter',sans-serif;letter-spacing:.4px}

  /* ---------- Top bar ---------- */
  .topbar{display:flex;align-items:center;gap:20px;padding:14px 22px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,#18242c,#0e161b);box-shadow:inset 0 -2px 0 rgba(199,154,94,.35)}
  .brand{display:flex;align-items:center;gap:12px}
  .logo{width:42px;height:42px;border-radius:9px;background:linear-gradient(150deg,#3f5f74,#5b7e96);display:flex;align-items:center;justify-content:center;font-weight:700;font-family:'Oswald',sans-serif;color:#fff;font-size:22px;border:1.5px solid var(--premium);box-shadow:0 4px 16px rgba(12,18,22,.6)}
  .brand h1{font-size:22px;margin:0;letter-spacing:1.5px;font-weight:700;line-height:1}
  .brand .sub{font-size:11px;color:var(--premium2);letter-spacing:3px;text-transform:uppercase;margin-top:3px;font-weight:600}
  .clock{margin-left:6px;text-align:left}
  .clock .t{font-size:22px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:.5px}
  .clock .d{font-size:12px;color:var(--muted)}
  .spacer{flex:1}
  .btn{border:1px solid var(--line);background:#16223400;color:var(--txt);padding:10px 16px;border-radius:10px;font-size:13.5px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:.15s;background:#152131}
  .btn:hover{border-color:#3a557e;background:#1b2a3f}
  .btn.brand{background:linear-gradient(135deg,#6a90a8,#456070);border-color:transparent;color:#fff;font-weight:700}
  .btn.ghost{background:transparent}
  .userchip{display:flex;align-items:center;gap:10px;padding:7px 12px 7px 8px;border:1px solid var(--line);border-radius:30px;cursor:pointer;background:#152131;transition:.15s}
  .userchip:hover{border-color:#3a557e;background:#1b2a3f}
  .avatar{width:30px;height:30px;border-radius:50%;background:#26374f;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#cfe0f5}
  .avatar.mgr{background:linear-gradient(135deg,var(--premium2),#a9752f);color:#201703}
  .userchip .nm{font-size:13px;font-weight:650;line-height:1.1}
  .userchip .rl{font-size:10.5px;color:var(--muted)}

  /* ---------- KPI strip ---------- */
  .kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding:16px 22px 4px}
  .kpi{background:linear-gradient(180deg,var(--panel),var(--panel2));border:1px solid var(--line);border-radius:var(--radius);padding:14px 18px;position:relative;overflow:hidden}
  .kpi .lab{font-size:11.5px;color:var(--muted);text-transform:uppercase;letter-spacing:1.4px;font-weight:600}
  .kpi .val{font-size:32px;font-weight:780;margin-top:4px;font-variant-numeric:tabular-nums;line-height:1}
  .kpi .note{font-size:11.5px;color:var(--muted2);margin-top:5px}
  .kpi .strip{position:absolute;left:0;top:0;bottom:0;width:4px}
  .s-green{background:var(--green)} .s-blue{background:var(--blue)} .s-amber{background:var(--amber)} .s-red{background:var(--red)}

  /* ---------- Board ---------- */
  .boardwrap{flex:1;overflow:auto;padding:14px 22px 22px}
  table.board{width:100%;border-collapse:separate;border-spacing:0;min-width:1420px}
  table.board th{position:sticky;top:0;z-index:3;background:#101a20;color:var(--muted);font-size:11.5px;text-transform:uppercase;letter-spacing:1.2px;font-weight:650;padding:12px 10px;text-align:center;border-bottom:1px solid var(--line)}
  table.board th.bcol{text-align:left;left:0;z-index:4;min-width:250px;padding-left:16px}
  .buildrow{cursor:pointer}
  .buildrow td{border-bottom:1px solid #17222f;padding:0}
  .buildrow:hover .bcell{background:#182335}
  .bcell{position:sticky;left:0;z-index:2;background:var(--panel2);padding:13px 14px 13px 16px;min-width:250px;border-right:1px solid var(--line)}
  .bcell .nm{font-size:15.5px;font-weight:720;display:flex;align-items:center;gap:9px}
  .bcell .meta{font-size:11.5px;color:var(--muted);margin-top:3px}
  .bcell .del{font-size:11.5px;margin-top:5px;display:flex;align-items:center;gap:6px}
  .hbadge{font-size:10px;font-weight:800;padding:3px 8px;border-radius:20px;text-transform:uppercase;letter-spacing:.6px}
  .h-ontrack{background:var(--greenbg);color:var(--green)} .h-risk{background:var(--amberbg);color:var(--amber)}
  .h-behind{background:var(--redbg);color:var(--red)} .h-done{background:#1b2b3d;color:var(--blue)}
  .h-blocked{background:var(--redbg);color:var(--red)}
  .cell{padding:9px 8px;text-align:center;vertical-align:middle}
  .stagebox{border-radius:10px;padding:8px 6px;min-height:52px;display:flex;flex-direction:column;justify-content:center;gap:5px;border:1px solid transparent;margin:3px}
  .stagebox.done{background:var(--greenbg);border-color:#1d543b}
  .stagebox.active{background:var(--bluebg);border-color:#22456e}
  .stagebox.todo{background:#101927;border-color:#1b2637}
  .stagebox .frac{font-size:13px;font-weight:750;font-variant-numeric:tabular-nums}
  .stagebox.done .frac{color:var(--green)} .stagebox.active .frac{color:var(--blue)} .stagebox.todo .frac{color:var(--muted2)}
  .bar{height:5px;border-radius:4px;background:#0c1420;overflow:hidden}
  .bar>i{display:block;height:100%;border-radius:4px}
  .stagebox.done .bar>i{background:var(--green)} .stagebox.active .bar>i{background:var(--blue)}
  .curdot{width:7px;height:7px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 3px rgba(90,169,255,.2)}
  .legend{display:flex;gap:20px;align-items:center;margin-top:14px;font-size:11.5px;color:var(--muted);flex-wrap:wrap}
  .legend span{display:inline-flex;align-items:center;gap:7px}
  .dot{width:11px;height:11px;border-radius:3px}

  /* ---------- Drawer ---------- */
  .scrim{position:fixed;inset:0;background:rgba(4,8,14,.6);backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:.2s;z-index:30}
  .scrim.on{opacity:1;pointer-events:auto}
  .drawer{position:fixed;top:0;right:0;height:100vh;width:460px;max-width:94vw;background:linear-gradient(180deg,#111a27,#0c141f);border-left:1px solid var(--line);transform:translateX(102%);transition:transform .25s cubic-bezier(.4,0,.2,1);z-index:40;display:flex;flex-direction:column;box-shadow:-20px 0 60px rgba(0,0,0,.5)}
  .drawer.on{transform:translateX(0)}
  .dhead{padding:20px 22px 16px;border-bottom:1px solid var(--line)}
  .dhead .nm{font-size:20px;font-weight:770}
  .dhead .meta{font-size:12.5px;color:var(--muted);margin-top:5px;line-height:1.6}
  .dhead .close{position:absolute;top:16px;right:18px;font-size:22px;color:var(--muted);cursor:pointer;line-height:1;background:none;border:none}
  .dbody{flex:1;overflow:auto;padding:8px 18px 22px}
  .stagegrp{margin-top:14px}
  .stagegrp h4{margin:0 0 6px;font-size:12.5px;text-transform:uppercase;letter-spacing:1.2px;color:var(--muted);display:flex;align-items:center;gap:9px}
  .stagegrp h4 .pill{font-size:10px;font-weight:800;padding:2px 8px;border-radius:20px}
  .stagegrp h4 .signoff{margin-left:auto;font-size:11px;font-weight:700;color:var(--premium2);cursor:pointer;border:1px solid #4a3a22;background:#241d12;padding:3px 9px;border-radius:7px}
  .task{display:flex;align-items:center;gap:11px;padding:9px 8px;border-radius:9px}
  .task:hover{background:#141f2e}
  .chk{width:22px;height:22px;border-radius:6px;border:2px solid #38537a;flex-shrink:0;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.12s}
  .chk.on{background:var(--green);border-color:var(--green)}
  .chk.on::after{content:"✓";color:#06231a;font-size:14px;font-weight:900}
  .task .tn{font-size:14px;flex:1}
  .task.done .tn{color:var(--muted);text-decoration:line-through;text-decoration-color:#3d557a}
  .task .by{font-size:11px;color:var(--muted2);text-align:right;line-height:1.35}
  .task .by b{color:var(--muted);font-weight:650}

  /* ---------- Modal ---------- */
  .modal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;z-index:50}
  .modal.on{display:flex}
  .mbox{background:linear-gradient(180deg,#131d2b,#0e1723);border:1px solid var(--line);border-radius:18px;width:520px;max-width:94vw;max-height:90vh;overflow:auto;box-shadow:0 30px 80px rgba(0,0,0,.6)}
  .mhead{padding:20px 24px 6px;display:flex;align-items:center}
  .mhead h3{margin:0;font-size:18px;font-weight:750}
  .mhead .close{margin-left:auto;font-size:22px;color:var(--muted);cursor:pointer;background:none;border:none}
  .mbody{padding:12px 24px 24px}
  .msub{font-size:12.5px;color:var(--muted);margin:0 24px 8px}

  /* people grid */
  .deptlab{font-size:11px;text-transform:uppercase;letter-spacing:1.2px;color:var(--muted2);margin:14px 0 7px;font-weight:650}
  .pgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}
  .ptile{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:11px;cursor:pointer;background:#152131;transition:.13s}
  .ptile:hover{border-color:var(--brand);background:#1c2a3d}
  .ptile .nm{font-size:13.5px;font-weight:650}
  .ptile .rl{font-size:10.5px;color:var(--muted)}
  .ptile .mgrtag{margin-left:auto;font-size:9px;font-weight:800;color:var(--premium2);border:1px solid #4a3a22;padding:2px 6px;border-radius:6px}
  .ptile:hover{border-color:var(--premium)}

  /* keypad */
  .kp{display:flex;flex-direction:column;align-items:center;padding:8px 0 4px}
  .kp .who{font-size:16px;font-weight:700;margin-bottom:2px}
  .kp .whor{font-size:12px;color:var(--muted);margin-bottom:16px}
  .dots{display:flex;gap:14px;margin-bottom:20px}
  .dots i{width:15px;height:15px;border-radius:50%;border:2px solid #40597e;transition:.12s}
  .dots i.f{background:var(--brand);border-color:var(--brand)}
  .dots.err i{border-color:var(--red);animation:shake .4s}
  @keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-8px)}75%{transform:translateX(8px)}}
  .pad{display:grid;grid-template-columns:repeat(3,86px);gap:12px}
  .key{height:74px;border-radius:14px;border:1px solid var(--line);background:#161f2e;font-size:26px;font-weight:600;color:var(--txt);cursor:pointer;transition:.1s}
  .key:hover{background:#1e2b3f;border-color:#3a557e}
  .key:active{transform:scale(.95)}
  .key.fn{font-size:15px;color:var(--muted);background:transparent}

  /* form */
  .field{margin-bottom:14px}
  .field label{display:block;font-size:12px;color:var(--muted);margin-bottom:6px;font-weight:600}
  .field input,.field select{width:100%;padding:11px 13px;border-radius:10px;border:1px solid var(--line);background:#0e1723;color:var(--txt);font-size:14px;font-family:inherit}
  .field input:focus,.field select:focus{outline:none;border-color:var(--brand)}
  .frow{display:grid;grid-template-columns:1fr 1fr;gap:12px}

  /* report */
  .rsum{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:18px}
  .rcard{background:#0f1825;border:1px solid var(--line);border-radius:12px;padding:12px 14px}
  .rcard .l{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:1px}
  .rcard .v{font-size:26px;font-weight:750;margin-top:3px}
  .rsec h4{font-size:12.5px;text-transform:uppercase;letter-spacing:1.2px;color:var(--brand2);margin:18px 0 8px;border-bottom:1px solid var(--line);padding-bottom:6px}
  .rrow{display:flex;align-items:center;gap:10px;padding:7px 4px;font-size:13.5px;border-bottom:1px solid #16222f}
  .rrow .rn{font-weight:650;min-width:150px}
  .rrow .rmeta{color:var(--muted);font-size:12px;flex:1}
  .rrow .rb{font-size:10px;font-weight:800;padding:2px 8px;border-radius:20px}
  .empty{color:var(--muted2);font-size:13px;font-style:italic;padding:6px 4px}

  .toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(30px);background:#152131;border:1px solid var(--line);padding:12px 20px;border-radius:12px;font-size:13.5px;font-weight:600;opacity:0;transition:.25s;z-index:70;box-shadow:0 10px 30px rgba(0,0,0,.4)}
  .toast.on{opacity:1;transform:translateX(-50%) translateY(0)}
  .toast .ic{color:var(--green);margin-right:8px}

  .demo{position:fixed;bottom:14px;left:14px;z-index:20;font-size:11px}
  .demo summary{color:var(--muted2);cursor:pointer;list-style:none}
  .demo summary::-webkit-details-marker{display:none}
  .demo .card{margin-top:8px;background:#0f1825;border:1px solid var(--line);border-radius:10px;padding:12px 14px;max-width:290px;color:var(--muted);line-height:1.7}
  .demo b{color:var(--txt)}
  .scrollhint{scrollbar-width:thin;scrollbar-color:#2a3b54 transparent}
  ::-webkit-scrollbar{width:9px;height:9px}
  ::-webkit-scrollbar-thumb{background:#243550;border-radius:6px}
  ::-webkit-scrollbar-track{background:transparent}

  /* ---- Stage 5-column additions ---- */
  .thsub{font-size:9.5px;letter-spacing:.4px;color:var(--muted2);font-weight:500;text-transform:none;margin-top:3px}
  .grouprow td{background:#0d151b;padding:9px 16px !important;font-size:11px;font-weight:800;letter-spacing:2px;color:var(--muted);border-bottom:1px solid var(--line);position:sticky;left:0}
  .grouprow td span{display:inline-block;margin-left:8px;background:#1a2730;color:var(--brand2);border-radius:20px;padding:1px 9px;font-size:10px;letter-spacing:.5px}
  .bcell .nm .mdl{font-size:12.5px;font-weight:500;color:var(--muted);font-family:'Inter',sans-serif;letter-spacing:0}
  .h-queued{background:#1c2831;color:var(--brand2)}
  .note-flag{font-size:10.5px;color:var(--muted2);margin-top:5px;max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .note-flag.warn{color:var(--amber)}
  .note-flag .owner{background:#2a2114;color:var(--premium2);border-radius:20px;padding:0 7px;font-size:9.5px;font-weight:800;margin-left:4px;letter-spacing:.3px}
  .stagegrp h4 .ssub{font-weight:500;color:var(--muted2);text-transform:none;letter-spacing:.2px;font-size:11px;margin-left:-3px}
  /* Ready-for-delivery panel */
  .readywrap{margin-top:16px;border:1px solid var(--line);border-radius:12px;background:var(--panel2);overflow:hidden}
  .readywrap summary{list-style:none;cursor:pointer;padding:12px 16px;font-size:13px;font-weight:700;letter-spacing:.5px;color:var(--green);display:flex;align-items:center;gap:10px}
  .readywrap summary::-webkit-details-marker{display:none}
  .readywrap .rcount{background:var(--greenbg);color:var(--green);border-radius:20px;padding:1px 10px;font-size:12px}
  .readywrap .rhint{color:var(--muted2);font-weight:500;font-size:11.5px;letter-spacing:0}
  .readylist{padding:4px 12px 14px;display:grid;grid-template-columns:repeat(2,1fr);gap:6px}
  .readychip{display:flex;align-items:center;gap:10px;padding:8px 12px;border:1px solid #1c2833;border-radius:9px;background:#0f1821;font-size:12.5px}
  .readychip .rt{font-weight:800;color:var(--brand2);font-family:'Oswald',sans-serif;min-width:42px}
  .readychip .rc{font-weight:600;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .readychip .rm{color:var(--muted);font-size:11px}
  .readychip .rf{color:var(--muted2);font-size:11px;font-variant-numeric:tabular-nums}
  .readychip .rn2{color:var(--muted2);font-size:10.5px;font-style:italic;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .readychip .rn2.warn{color:var(--amber);font-style:normal}


/* ---- block ---- */


  .pbadge{font-size:9.5px;font-weight:800;padding:2px 7px;border-radius:20px;text-transform:uppercase;letter-spacing:.4px;white-space:nowrap}
  .pb-ok{background:var(--greenbg);color:var(--green)}
  .pb-mid{background:var(--amberbg);color:var(--amber)}
  .pb-no{background:#1c2831;color:var(--muted2)}


/* ---- block ---- */


  .viewtabs{display:flex;gap:6px;padding:14px 22px 0}
  .vtab{background:transparent;border:1px solid var(--line);color:var(--muted);padding:8px 16px;border-radius:9px;font-size:13.5px;font-weight:650;cursor:pointer;font-family:inherit}
  .vtab:hover{border-color:#3a557e;color:var(--txt)}
  .vtab.active{background:#152131;color:var(--txt);border-color:#3a557e;box-shadow:inset 0 -2px 0 var(--premium)}
  #briefView{flex:1;overflow:auto;padding:18px 22px 34px}
  .brief{max-width:1000px}
  .briefhead{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:14px;margin-bottom:6px}
  .brief h2{font-family:'Oswald','Inter',sans-serif;font-size:24px;margin:0;letter-spacing:.5px}
  .briefsub{font-size:12.5px;color:var(--muted);margin-top:4px}
  .briefkpis{display:flex;gap:10px;flex-wrap:wrap}
  .bk{background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:8px 15px;text-align:center;min-width:86px}
  .bk .n{font-family:'Oswald',sans-serif;font-size:23px;font-weight:750;line-height:1}
  .bk .l{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:1px;margin-top:4px}
  .brief section{margin-top:22px}
  .brief section h3{font-size:13px;text-transform:uppercase;letter-spacing:1.2px;color:var(--brand2);margin:0 0 6px;border-bottom:1px solid var(--line);padding-bottom:7px}
  .brief section h3.sec-behind{color:var(--red)} .brief section h3.sec-risk{color:var(--amber)}
  .brow{display:flex;align-items:center;gap:12px;padding:10px 6px;border-bottom:1px solid #16222f}
  .brow .btag{font-family:'Oswald',sans-serif;font-weight:800;color:var(--brand2);min-width:54px;font-size:15px}
  .brow .bmain{flex:1;font-size:14px;line-height:1.35}
  .brow .bmain .bsub{font-size:12px;color:var(--muted);margin-top:2px}
  .brow .bbadge{font-size:10px;font-weight:800;padding:3px 9px;border-radius:20px;white-space:nowrap}
  .brief .empty{color:var(--muted2);font-size:13.5px;font-style:italic;padding:9px 4px}


/* ---- block ---- */


  /* ---- Brighten faint text on the dark cards for legibility on the shop TV ---- */
  :root{ --muted:#d3dde5; --muted2:#c4cfd8; --faint:#b6c3cd; }

  /* ---- Off-white canvas, keep dark cards ---- */
  /* Default text stays LIGHT (most content sits on dark cards). Only the
     off-white canvas containers get dark text, set on the container below. */
  body{ background:#f2efe8 !important; color:var(--txt); }
  .boardwrap, #briefView, .viewtabs{ background:transparent; }

  /* Off-white canvas areas -> dark text by default, but dark chips inside stay light */
  #briefView{ color:#1b2530; }
  #briefView .bk, #briefView .bk .n{ color:var(--txt); }   /* dark KPI chips keep light text */
  .vtab{ color:#3b4a57 !important; border-color:#c8ccc4 !important; }
  .vtab:hover{ color:#123049 !important; border-color:#8fa7bb !important; }
  .vtab.active{ color:#eef2f5 !important; }            /* active tab keeps its dark chip */
  .legend{ color:#41525f !important; }
  #briefView .brief h2{ color:#1b2530 !important; }
  #briefView .briefsub{ color:#4a5a66 !important; }
  #briefView .brow{ border-bottom-color:#dcdccf !important; }
  #briefView .brow .bmain{ color:#1b2530 !important; }
  #briefView .brow .bmain .bsub{ color:#4a5a66 !important; }
  #briefView .empty{ color:#5a6b78 !important; }
  #briefView .briefsub, #briefView .briefsub span{ color:#4a5a66 !important; }

  /* ---- Completion % on each build row ---- */
  .bcell .nm{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
  .pctdone{ margin-left:auto; font-family:'Oswald','Inter',sans-serif; font-weight:700;
    font-size:16px; color:var(--brand2); letter-spacing:.3px; }

  /* ---- Font bump (~+2pt) on the most-read text ---- */
  .bcell .nm{ font-size:19px; }
  .bcell .meta, .bcell .nm .mdl{ font-size:13.5px; }
  .bcell .del{ font-size:13px; }
  table.board th{ font-size:13px; }
  table.board th .thsub{ font-size:11px; }
  .frac{ font-size:15px; }
  .kpi .lab{ font-size:13px; }
  .kpi .val{ font-size:34px; }
  .kpi .note{ font-size:13px; }
  .vtab{ font-size:15px; }
  .stagegrp h4{ font-size:14px; }
  .task .tn{ font-size:15px; }
  .brow .btag{ font-size:17px; }
  .brow .bmain{ font-size:16px; }
  .brow .bmain .bsub{ font-size:13px; }
  .bk .l{ font-size:11.5px; }


/* ---- block ---- */


  #vm-gate{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;
    background:radial-gradient(1200px 700px at 80% -10%, #1b2c35 0%, #0c1216 55%);
    font-family:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;padding:24px}
  #vm-gate .vm-card{background:linear-gradient(180deg,#161f26,#111a20);border:1px solid #2a3a44;border-radius:16px;
    padding:38px 34px;max-width:360px;width:100%;text-align:center;box-shadow:0 24px 70px rgba(0,0,0,.55),inset 0 -2px 0 rgba(199,154,94,.35)}
  #vm-gate .vm-logo{width:52px;height:52px;border-radius:11px;margin:0 auto 16px;
    background:linear-gradient(150deg,#3f5f74,#5b7e96);display:flex;align-items:center;justify-content:center;
    font-family:'Oswald','Inter',sans-serif;font-weight:700;color:#fff;font-size:28px;border:1.5px solid #c79a5e}
  #vm-gate .vm-brand{font-family:'Oswald','Inter',sans-serif;font-size:26px;font-weight:700;letter-spacing:2px;color:#eef2f5;line-height:1}
  #vm-gate .vm-sub{font-size:11px;color:#e0b47f;letter-spacing:3px;text-transform:uppercase;margin-top:5px;font-weight:600;margin-bottom:24px}
  #vm-gate input{width:100%;padding:13px 15px;font-size:16px;border-radius:11px;border:1px solid #2a3a44;
    background:#0e1723;color:#eef2f5;margin-bottom:12px;font-family:inherit}
  #vm-gate input:focus{outline:none;border-color:#5b7e96}
  #vm-gate button{width:100%;padding:13px;font-size:15px;font-weight:700;border:none;border-radius:11px;
    background:linear-gradient(135deg,#6a90a8,#456070);color:#fff;cursor:pointer}
  #vm-gate button:hover{filter:brightness(1.06)}
  #vm-gate .vm-err{color:#cf6b63;font-size:13px;height:18px;margin-top:10px}


/* ============================================================
   Additions — queued group header, move buttons, issue list.
   Appended deliberately so the original stylesheet above stays
   as it was lifted from the single-file page.
   ============================================================ */

/* LOADING / QUEUED header: white ground, larger type (11px -> 13px) */
.grouprow.gr-queued td{
  background:#ffffff !important;
  color:#16232e !important;
  font-size:13px !important;
  letter-spacing:1.6px;
  border-bottom:1px solid #c8ccc4;
}
.grouprow.gr-queued td span{
  background:#16232e;
  color:#ffffff;
  font-size:12px;
}

/* move between queue and production */
.movebtn{
  appearance:none;cursor:pointer;font:inherit;
  margin-top:9px;padding:6px 11px;border-radius:8px;
  font-size:12.5px;font-weight:600;letter-spacing:.2px;
  background:var(--brand);color:#fff;border:1px solid var(--brand);
  transition:filter .15s,border-color .15s;
}
.movebtn:hover{filter:brightness(1.12)}
.movebtn:focus-visible{outline:2px solid var(--brand2);outline-offset:2px}
.movebtn.ghost{
  background:transparent;color:var(--muted2);border-color:var(--line);font-weight:500;
}
.movebtn.ghost:hover{color:var(--txt);border-color:var(--brand)}

/* missing items / back-ordered parts, inside the build drawer */
.issues{margin-top:6px}
.issues h4{
  margin:0 0 8px;font-size:12px;letter-spacing:1.6px;text-transform:uppercase;color:var(--muted2);
}
.issue{
  display:flex;gap:10px;align-items:flex-start;justify-content:space-between;
  padding:10px 12px;border:1px solid var(--line);border-radius:10px;
  background:var(--panel2);margin-bottom:8px;
}
.issue.done{opacity:.55}
.issue .it{font-size:14px;color:var(--txt);line-height:1.35}
.issue.done .it{text-decoration:line-through}
.issue .eta{font-size:12px;color:var(--amber);margin-top:3px;font-variant-numeric:tabular-nums}
.issue .eta.late{color:var(--red)}
.issue .who{font-size:11px;color:var(--faint);margin-top:3px}
.issue button{
  appearance:none;cursor:pointer;font:inherit;font-size:11.5px;
  background:transparent;border:1px solid var(--line);color:var(--muted2);
  border-radius:7px;padding:4px 9px;white-space:nowrap;
}
.issue button:hover{border-color:var(--brand);color:var(--txt)}
.issue-add{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}
.issue-add input{
  background:var(--bg);border:1px solid var(--line);color:var(--txt);
  border-radius:9px;padding:9px 11px;font:inherit;font-size:13.5px;
}
.issue-add input[type="text"]{flex:1 1 190px;min-width:150px}
.issue-add input[type="date"]{flex:0 0 auto;color-scheme:dark}
.issue-add input:focus{outline:none;border-color:var(--brand)}
.issue-add button{
  appearance:none;cursor:pointer;font:inherit;font-size:13px;font-weight:600;
  background:var(--brand);color:#fff;border:1px solid var(--brand);border-radius:9px;padding:9px 14px;
}
.issue-empty{font-size:13px;color:var(--faint);padding:4px 0 10px}