/* watchtower-units.css — Unit Status board (Dispatch - Unit Status.dc.html).
   Ported from the locked design surface; uses the global command-dark tokens
   (--bg-*, --l-*, --t-*, --sky/gold/red/green/violet, --label/--mono/--sans).
   Every uppercase rule sets font-family:var(--label) (Oswald lock). No raw hex. */

.wtu { display:flex; flex-direction:column; height:100%; min-height:0; overflow:hidden; color:var(--t-0); font-family:var(--sans); }
.wtu * { box-sizing:border-box; }
.wtu button { color:inherit; font-family:inherit; cursor:pointer; }

.wtu-top { display:flex; align-items:center; gap:13px; padding:13px 24px; background:var(--bg-1); border-bottom:1px solid var(--l-2); flex-wrap:wrap; }
.wtu-wm { font-family:var(--label); font-weight:700; font-size:16px; letter-spacing:0.14em; }
.wtu-sub { font-family:var(--label); font-size:9px; letter-spacing:0.13em; color:var(--sky); text-transform:uppercase; margin-top:2px; }

.wtu-ribbon { margin-left:auto; display:flex; gap:8px; flex-wrap:wrap; }
.wtu-rc { display:flex; align-items:center; gap:8px; border:1px solid var(--l-2); border-radius:7px; padding:7px 12px; cursor:pointer; background:transparent; }
.wtu-rc.on { background:var(--bg-2); }
.wtu-rc .d { width:9px; height:9px; border-radius:50%; background:var(--c); flex:0 0 auto; }
.wtu-rc .n { font-family:var(--mono); font-size:17px; font-weight:700; color:var(--c); }
.wtu-rc .l { font-family:var(--label); font-size:8.5px; letter-spacing:0.07em; text-transform:uppercase; color:var(--t-3); }

.wtu-toolbar { display:flex; align-items:center; gap:9px; padding:11px 24px; border-bottom:1px solid var(--l-2); background:var(--bg-0); flex-wrap:wrap; }
.wtu-seg { display:flex; gap:2px; background:var(--bg-1); border:1px solid var(--l-2); border-radius:7px; padding:3px; }
.wtu-seg button { padding:6px 12px; border:0; border-radius:5px; background:transparent; color:var(--t-2); font-family:var(--label); font-size:11px; letter-spacing:0.05em; text-transform:uppercase; }
.wtu-seg button.on { background:var(--bg-2); color:var(--t-0); }
.wtu-spacer { flex:1; }
.wtu-hint { font-family:var(--mono); font-size:11px; color:var(--t-3); }
.wtu-clear { border:1px solid var(--l-2); border-radius:6px; padding:6px 11px; background:var(--bg-1); font-family:var(--mono); font-size:11px; color:var(--t-2); }

.wtu-stage { overflow:auto; padding:0 24px 40px; flex:1; min-height:0; }
.wtu-grp { margin-top:18px; }
.wtu-gh { font-family:var(--label); font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--t-2); display:flex; align-items:center; gap:10px; margin-bottom:9px; }
.wtu-gh .gc { font-family:var(--mono); font-size:10px; color:var(--t-3); }
.wtu-gh::after { content:""; flex:1; height:1px; background:var(--l-1); }

.wtu-tbl { border:1px solid var(--l-2); border-radius:9px; overflow:visible; background:var(--bg-1); }
.wtu-hd, .wtu-row { display:grid; grid-template-columns:96px 1.5fr 150px 1.4fr 80px 92px 40px; gap:12px; align-items:center; }
.wtu-hd { padding:10px 15px; background:var(--bg-2); border-bottom:1px solid var(--l-2); font-family:var(--label); font-size:9.5px; letter-spacing:0.1em; text-transform:uppercase; color:var(--t-3); border-radius:9px 9px 0 0; }
.wtu-row { padding:10px 15px; border-bottom:1px solid var(--l-1); font-size:13.5px; position:relative; }
.wtu-row:last-child { border-bottom:0; }
.wtu-row:hover { background:var(--bg-2); }
.wtu-cs { display:inline-flex; align-items:center; gap:7px; font-family:var(--mono); font-size:14px; font-weight:500; }
.wtu-cs .ld { width:8px; height:8px; border-radius:50%; background:var(--ut); flex:0 0 auto; }
.wtu-uname { font-weight:600; }
.wtu-urole { font-size:11.5px; color:var(--t-3); margin-top:1px; }
.wtu-stbtn { display:inline-flex; align-items:center; gap:7px; font-family:var(--label); font-size:10px; letter-spacing:0.05em; text-transform:uppercase; padding:6px 11px; border-radius:5px; border:1px solid var(--ut); color:var(--ut); background:color-mix(in oklab, var(--ut) 11%, transparent); width:100%; justify-content:flex-start; }
.wtu-stbtn .d { width:7px; height:7px; border-radius:50%; background:currentColor; }
.wtu-stbtn:hover:not(:disabled) { background:color-mix(in oklab, var(--ut) 20%, transparent); }
.wtu-stbtn:disabled { cursor:default; opacity:0.78; }
.wtu-assign { color:var(--t-1); }
.wtu-assign .az { font-family:var(--mono); font-size:11.5px; color:var(--t-3); margin-top:1px; }
.wtu-ch { font-family:var(--mono); font-size:12px; color:var(--sky); }
.wtu-since { font-family:var(--mono); font-size:11.5px; color:var(--t-3); }
.wtu-since.stale { color:var(--gold); }
.wtu-kebab { border:0; background:transparent; color:var(--t-3); font-size:18px; line-height:1; padding:4px 6px; border-radius:5px; }
.wtu-kebab:hover { background:var(--l-2); color:var(--t-0); }

.wtu-menu { position:absolute; right:46px; top:8px; z-index:20; background:var(--bg-2); border:1px solid var(--l-2); border-radius:8px; padding:5px; box-shadow:0 14px 34px rgba(0,0,0,0.55); width:180px; }
.wtu-menu .mt { font-family:var(--label); font-size:9px; letter-spacing:0.1em; text-transform:uppercase; color:var(--t-3); padding:6px 9px 4px; }
.wtu-menu button { display:flex; align-items:center; gap:9px; width:100%; text-align:left; padding:8px 9px; border:0; border-radius:6px; background:transparent; color:var(--t-1); font-size:13px; }
.wtu-menu button:hover { background:var(--bg-1); }
.wtu-menu button .d { width:9px; height:9px; border-radius:50%; background:var(--mc); flex:0 0 auto; }

.wtu-empty { padding:40px 24px; color:var(--t-3); font-family:var(--mono); font-size:12.5px; }
.wtu-scrim { position:fixed; inset:0; z-index:15; }
.wtu-toast { position:fixed; left:50%; bottom:22px; transform:translateX(-50%); background:var(--bg-2); border:1px solid var(--sky); border-radius:7px; padding:11px 18px; font-size:13px; z-index:50; box-shadow:0 10px 30px rgba(0,0,0,0.5); }
