/* css bundle — built 2026-09-16 21:13Z from V2/console/index.html */
/* ==== ../ui-kit/glass.css ==== */
/* ═══════════════════════════════════════════════════════════════════════════════════════
   Aegis Liquid Glass Kit — glass.css
   GENERATED by V2/ui-kit/sync.py from V2/lab/apps/widgets/ui/livebar-probe.html
   (source bytes 26f23f27, 2026-09-16). Do not hand-edit: change the dock
   document, prove it on a real client, run sync.py. See README.md for the component index.

   Roots:  .glass            the kit scope — tokens, type, every component
           .glass.light      the light scheme (dark is the default; the dock boots Auto)
           .island           a glass surface (the bar's shell): hairline, float, liquid wallpaper
   ═══════════════════════════════════════════════════════════════════════════════════════ */
.glass{--font:'Poppins','Segoe UI',system-ui,-apple-system,sans-serif;
  --w-font:"Avenir Next","SF Pro Text","Segoe UI",system-ui,sans-serif;
  --w-ink:#fff;--w-dim:#c3d6e0;--w-soft:rgba(232,242,247,.84);--w-green:#5fe3a1;--w-amber:#f2c14e;
  --lg-navy:#031e2b;--lg-teal:#1E9DB8;--lg-cyan:#2ec8e8;--lg-lime:#d9ff7a;--lg-purple:#a795c7;
  --lg-spring:cubic-bezier(.3,1.25,.4,1);--lg-pop:cubic-bezier(.34,1.45,.64,1);--lg-glide:cubic-bezier(.32,1.25,.5,1);
  --lg-out:cubic-bezier(.4,0,.2,1);--lg-snap:cubic-bezier(.2,.9,.25,1);
  font-family:var(--w-font);color:var(--w-ink);line-height:1.45;-webkit-font-smoothing:antialiased}
.glass.light{--w-ink:#0c2836;--w-dim:#3f5d6c;--w-soft:#33505f;color:#0c2836}
.glass *,.glass *::before,.glass *::after{box-sizing:border-box}

/* ——— the dock's components, re-rooted (see sync.py) ——— */
.island{position:relative;border-radius:17px;color:var(--w-ink);font-family:var(--w-font);width:100%;max-width:420px;margin:0;opacity:0;transform:translateY(5px) scale(.985);transition:max-width .34s cubic-bezier(.32,1.25,.5,1),opacity .3s ease,transform .4s cubic-bezier(.3,1.25,.4,1),border-color .3s ease;background:linear-gradient(165deg,#ffffff26,#ffffff0d 40%,#ffffff1a);-webkit-backdrop-filter:blur(22px) saturate(1.75);backdrop-filter:blur(22px) saturate(1.75);border:1px solid #ffffff38;box-shadow:0 6px 18px #02101a52,0 1px 3px #02101a38,inset 0 -14px 28px -18px #1e9db859;overflow:hidden;user-select:none;-webkit-user-select:none;z-index:2}
.island.ready{opacity:1;transform:none}
.island[data-align="center"]{margin:0 auto}
.island[data-align="right"]{margin:0 0 0 auto}
.island.open{max-width:100%;border-color:#ffffff52}.island:not(.open) .moment{display:none}
.island:not(.open) .model small{display:none}
.island:not(.open) .z-bell{margin-left:auto}
.island:not(.open) .chev{margin-right:2px;flex:none}
.island:not(.open) .model .nm{display:inline-block;max-width:150px;overflow:hidden;text-overflow:ellipsis;vertical-align:bottom}
.island[data-health="cut"]:not(.open),.island[data-health="limited"]:not(.open){max-width:max-content}
.island[data-health="cut"] .moment,.island[data-health="limited"] .moment{display:flex}
.island[data-health="cut"]:not(.open) .z-bell,.island[data-health="limited"]:not(.open) .z-bell{margin-left:0}
.glass .liquid{position:absolute;inset:0;z-index:0;border-radius:inherit;overflow:hidden;background:#031e2b}
.glass .liquid i{position:absolute;border-radius:50%;filter:blur(36px)}
.glass .liquid .l1{width:280px;height:280px;left:-70px;top:-120px;background:#1e9db880;animation:drift1 13s ease-in-out infinite alternate}
.glass .liquid .l2{width:230px;height:230px;right:-50px;top:-90px;background:#a795c757;animation:drift2 17s ease-in-out infinite alternate}
.glass .liquid .l3{width:190px;height:190px;left:34%;bottom:-110px;background:#cdff4e33;animation:drift3 15s ease-in-out infinite alternate}
.glass .liquid .l4{width:160px;height:160px;right:26%;top:-80px;background:#6bc5d642;animation:drift1 19s ease-in-out infinite alternate-reverse}
.glass .liquid::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#02121c6b,#02121c29 45%,#02121c57)}
@keyframes drift1{to{transform:translate(52px,34px) scale(1.16)}}
@keyframes drift2{to{transform:translate(-44px,30px) scale(1.22)}}
@keyframes drift3{to{transform:translate(-34px,-28px) scale(1.14)}}
.glass .glare{position:absolute;left:0;right:0;top:-1px;height:40%;z-index:1;pointer-events:none;background:radial-gradient(120% 200% at 50% -80%,#fff3,#ffffff0a 42%,transparent 56%);border-radius:inherit}
.glass .row{position:relative;z-index:2;display:flex;align-items:center;gap:8px;height:34px;padding:0 6px 0 12px;cursor:pointer;outline:none}
.glass .row::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .22s ease;background:linear-gradient(100deg,#ffffff05,#ffffff14 45%,#ffffff05)}
.glass .row:hover::after{opacity:1}
.glass .row:focus-visible{box-shadow:inset 0 0 0 2px #6bc5d6b2}
.glass .row:hover .chev{color:var(--w-ink)}
.glass svg{fill:none;stroke-linecap:round;stroke-linejoin:round}
.glass .dot{position:relative;width:20px;height:20px;border-radius:50%;flex:none;display:grid;place-items:center;color:var(--w-green);animation:pulse 2.6s ease-in-out infinite;transition:color .45s ease}
.glass .dot:not([data-char]),.glass .dot[data-char=""]{width:7px;height:7px;background:currentColor;box-shadow:0 0 9px currentColor}
.glass .dot .ic{width:17px;height:17px;background:currentColor;-webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat;position:relative;z-index:1;filter:drop-shadow(0 0 4px currentColor)}
[data-char="brain"]{--m:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAQAAADZc7J/AAAD20lEQVR42m2VS4wUZRSFv6pqumVmlDDKQMyIbkl4iDxnCAHR4IYNMca40I0bV0pYkUxiorgwgAkJuhnUhe5IJMbHQhRYTHDnIyEoUXkF4jBsFGb6UVVd9bnov5vukb9WVfnPqXvvuffcSAZORETJI4xScAuJAIkYJ+Ef7hIjgxD7n8hYfNUfvOk1p10t4mqnveotz/qaGBv1YxYT4JSqhbl6zmGHPavmFqpOhVsPIIisGrvezNSGqU0X1A1uUOdt2LJuauYGY6v3SeJe7gkZJS+whJIqMRUqyAgjyBIqxCyhoMJeSjISog4wDnBo8yJrmeu9C0QYCtktcMQca3mJdrhFN/zId9QvXeVdtWXb3Ja6w0m1ZR7e77nSL9R3jTppICbiQXXepnt83ruWZgEw2SPILP3X59xt03n1YAfZkWWZVyxtqHM+62N+qzYHCJrqV466xzm1YekVlxkZx8TIepZTUCFljHO8z2hf5ob8ZQVHOMsYKRUKlrMeiStARAxElCRkwOtAm4R2X0ErFGxnOzmSBPqYiNCav7IAlEhCRIM0NDA9NQBaNIAEKIEFfkGMKRgCPiVBctrEVEkGpqN7KlSJaJNRkvAJEUMUWHPaGYc8oWoZJMvNbaqTTvRk7EqpesIhZzxpDd9S9bQr3ekhb/SuZ7bUiUCQmZmbqtc95E7HPK3qAbxqYV294TG3Oe6FHkVTnej1QduWesFxt3nM62rdwmuYDoR2wI1m4X+DKaSmpj7tm+FmiBNvm5uZm1lX7zjkBbXRi2B7SKGh/uiwc2o9JJR7O+ZDKqHaVQqGOcI4Zd+UdlWIKRnnAx6moBq+VjiBNY+bmpqFOmth838pZGY2zLUXb8vU49YwtuaMpU1zcxvWg5zZwCxkwZHqNszMbFo640PGMSV72UpOAhQsZYif+CbY533jjLnH1/zMEEsRiMnZyl7KGFhHlTYxBTXOs5t9TDFHMkCQcIcp9rGb81QpiWhTZV3HkZoAZNQ4xX628D3f8RRF3yzEtHmSM5xhC/s5RS0MWrPjSBNmLpj7uyucDiq3e0Wc1FCfzvnYMX+zbd3MyY6h4FFV33OjhamtoMjiWehUvnCzh1U9KsYVJOZtZnmDv9hMTBn6ojuHUd9cJhTEPMMf/Mk0HwUzCB6/2hFfNu/9v2uqO/qmMbNp21cc8YkuskuRiDjqJXXBlqkNF9Q1rgnqp7acVy/5qB0rjhZvpkTc5axaWqr6mTVrfh5aq1Rn3XUf/ODduMlpLzvrRQ87amTkqIe96KyXPemmxbsxWrTeEwoiHqdKk9t9O2oVS8n4G0ko+gH/AQInXUXMzM4mAAAAAElFTkSuQmCC)}
[data-char="bolt"]{--m:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAQAAADZc7J/AAACsklEQVR42p2VTYscVRSGn3urembi9EzIJk42oguJmOCAIf4CCQTNwk02LnQlSIgKIgrzB6IQECGLLISgi2QhJOAmREESEjdBRTe6UsGFQcH4kenu+nxcVHV3TeYj06lDQdWtc9573nPPeQuZyebEt8x8Rowis4Un4jHv+rdPPQxAIq76m/qZvSZ8FoBEPOAPqp4S09kAoqlzfq4O/cNnW8BdAwR74kfqv+pVFwyGWQAS8bQ6dKiuib3xt92E98QTjszMrPzLo1MCuwFIxVXvqCMz9WuDcUxAIjtfCTX7ucCjDEmogS+QiBOPtkibrVlPnPOKOrCwsDT3iMFk6kPntWvR2DL9QF23sHCkfue8wcRoNJoYUqRiD/WGxAMlJT0KXucdRqRAoAYukU8IREoI7uNtniYndAAiQ85zi2NcZm7CV1K+4ld6k+0KzuJLbn0d90l/t3RobmFhbmF2n0/hkZRvucphMiIBgUBFnw+5yTVW2vQbWhAZIRKogHle4ZvmpPe67N7Wmie82BYv72QwvYfWnhZTpi2xoXXPqAMzMzNHLUwD1ITru2JiGPdBHM+3iXjYYgPXehI8Dj8jpgYJdruu4SqLHCIFFpCU/3iPF8hJEClY5BxvkFAipECkZoWzHCQjQaAi5yfWuAvAEittgaFkkU94E6jalXZcXt7iIE8ZXDJ4Uh2ZWzpQr7homE5jClTAl3zMY5TtTtLjZy4TGNDjOFCRULCHa7zKoD3GzjA1orVs3yX79u27bNoW9An/tDJzXb3u/q4WdPUgTE5hCtgk+po6dKDe9vGpmG4WlO0G+rp6T/3Rg5vDd1akKK6aObL2Fw/dn/yDAVLxfWtL7/jcVrvvDBCMPuL36j8+L85v7fcgLV73ni92ZXy3AMFU/FQ9uV3yOwNEccEbrrW/9G3tf/c+ITtpnyjBAAAAAElFTkSuQmCC)}
[data-char="spark"]{--m:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAQAAADZc7J/AAACH0lEQVR42p2VzWoUQRRGT3X3TKIhuhITYiRZGEHjEDSJCm7FhS70BcQHENwoLn0icZFs9AlciEL+nOBGEMFF0KDE6fnpOS6mMxnJTCeTLuimqm6drvrurXuDFD5jyN8ig+iIuVlmiq2OAlS4enIABBaoEIpMkkKAXCPFkwEiMkaZo0WZFmEQJioAyE0mmeIGbeLhNQjAA04xxv28N+iYfVts8KLbZrbddNJg3N8yGvh/ecIcKSlXeIwD99CXm4i3/WXdhg3r7rgolvrZHh6KLImzVtXUpk1TdcNpsWRUBAgmlkVcdF2t2bRp04Y19ZMLIpZNDL2AYGRi0h0+7zN/5ssbOaBpTd3xqefyXSYmxkYS7HXpEnd5xHXaNEi6wnW+LcpEfOA17/jYo7ZnmGWeeea5zATjQI04X7oP2Ne7zSiwy3e22GKTKl8jICIQ8ndvGB2Eb8jnOv0yY5xlnNOMEPUeIWGZezykQkaLON+6OaBFQswGK7zlPfWDOAhdSToiTvnc3z0+6LSauusLL+T+ik1MjAz93XjL6n+Imrrhcn839g+kS35R691A+uyMWDp8IwaH8h13TbuhvJSPcjxAx/iVuuee+nLQcguv87RVMzPXnRj+OmckfGOFiIg3/KBENmxGElgl5Q+rQHtg4rIoJ46wRZ0KWee4w2XlNgkp26Q0SWidrC4E1qgVF8+jCssa6ckBbWCNVpGERSIes7z/A3zXDyCxGuINAAAAAElFTkSuQmCC)}

.glass .dot .halo{position:absolute;inset:-2px;border-radius:50%;background:radial-gradient(circle,currentColor 0%,transparent 68%);opacity:.32;filter:blur(3px);animation:halo 2.6s ease-in-out infinite}
.glass .dot[data-char="bolt"]{animation-duration:1.15s}.glass .dot[data-char="bolt"] .halo{animation-duration:1.15s}
.glass .dot[data-char="brain"]{animation-duration:3.4s}.glass .dot[data-char="brain"] .halo{animation-duration:3.4s}
.glass .dot[data-char="spark"]{animation-duration:2s}.glass .dot[data-char="spark"] .halo{animation-duration:2s}
@keyframes halo{0%,100%{transform:scale(.85);opacity:.22}50%{transform:scale(1.25);opacity:.45}}
.glass .dot::after,.glass .dot::before{content:"";position:absolute;inset:-3px;border-radius:50%;border:1.5px solid currentColor;opacity:0}
.glass .dot.ping::after{animation:ping .9s ease-out}
.glass .dot.ping::before{animation:ping 1s .18s ease-out}@keyframes ping{0%{transform:scale(.4);opacity:.9}100%{transform:scale(2.6);opacity:0}}
#moment{display:inline-block;transition:opacity .16s ease,transform .16s ease}
.glass .icobtn:active,.nread:active,.tgl:active,.seg span:active,.gbtn:active,.growbtn:active,.trypill:active,
.island.roomed .homepill:active,.pcell.clickable:active,.sf:active,.achip:active{transition-duration:.08s}
.homepill{position:absolute;left:50%;top:50%;z-index:3;display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 11px 0 9px;border-radius:99px;border:1px solid #fff6;font:600 10.5px var(--w-font);letter-spacing:.07em;text-transform:uppercase;color:var(--w-ink);background:linear-gradient(160deg,#ffffff47,#ffffff1a);-webkit-backdrop-filter:blur(14px) saturate(1.6);backdrop-filter:blur(14px) saturate(1.6);box-shadow:0 4px 14px #02101a4c;overflow:hidden;cursor:pointer;opacity:0;pointer-events:none;transform:translate(-50%,-50%) scale(.82);transition:opacity .18s ease,transform .22s var(--lg-out),background .2s ease}.homepill svg{width:12px;height:12px;stroke:currentColor;stroke-width:2}
.island.roomed .homepill{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1);transition:opacity .26s ease,transform .42s cubic-bezier(.3,1.35,.4,1),background .2s ease}.island.roomed .homepill:hover{background:linear-gradient(160deg,#ffffff61,#ffffff29);transform:translate(-50%,-50%) scale(1.05)}
.island.roomed .homepill:active{transform:translate(-50%,-50%) scale(.94)}
.homepill:focus-visible{outline:2px solid #6bc5d6bf;outline-offset:2px}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(.93)}}
.island[data-phase="waiting"] .dot,.island[data-phase="dry"] .dot{color:var(--w-amber);animation:none}
.glass .model{font-size:12.5px;font-weight:700;letter-spacing:.01em;text-shadow:0 1px 2px #000a104c;white-space:nowrap;min-width:0;overflow:hidden;text-overflow:ellipsis}
.glass .model small{display:inline-block;font-weight:600;color:var(--w-dim);font-size:9.5px;margin-left:6px;letter-spacing:.09em}
.glass .sep{width:1px;height:13px;background:#ffffff42;flex:none}
.glass .mn{font:700 11.5px/1.4 var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-ink);text-shadow:0 1px 2px #000a1040}
.glass .mn.dim{color:var(--w-dim);font-weight:500}
.glass .lbl{font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--w-dim)}
.glass .spend{display:flex;align-items:baseline;gap:5px;white-space:nowrap;flex:none}
.glass .spend .cap{font-weight:600;color:var(--w-dim)}
.island:not(.open) .spend .cap{display:none}
.island.open .model small{max-width:310px;overflow:hidden;text-overflow:ellipsis;vertical-align:bottom}
.glass .moment{margin-left:auto;display:flex;align-items:center;gap:8px;font-size:10.5px;color:var(--w-dim);white-space:nowrap}
.glass .icobtn{position:relative;width:24px;height:24px;border-radius:99px;flex:none;display:grid;place-items:center;background:linear-gradient(160deg,#fff3,#ffffff0f);border:1px solid #ffffff5c;box-shadow:none;cursor:pointer;transition:transform .18s ease,background .18s ease,border-color .18s ease,box-shadow .18s ease}
.glass .icobtn:hover{transform:translateY(-1px);border-color:#ffffff8c;box-shadow:0 3px 10px #02101a47}
.glass .icobtn:focus-visible,.nread:focus-visible,.growbtn:focus-visible,.gbtn:focus-visible,.seg span:focus-visible,
.tgl:focus-visible,.notice:focus-visible,.pcell.clickable:focus-visible,.trypill:focus-visible,.mrow:focus-visible{outline:2px solid #6bc5d6bf;outline-offset:2px}
.glass :focus:not(:focus-visible){outline:none}
.glass .icobtn.active{background:linear-gradient(160deg,#1e9db880,#1e9db840);border-color:#6bc5d68c}
.glass .icobtn svg{width:12px;height:12px;stroke:var(--w-ink);stroke-width:1.7;opacity:.92;transition:transform .5s var(--lg-spring)}
.glass .z-gear.active svg{transform:rotate(30deg)}.glass .z-bell svg{transform-origin:50% 18%}
.glass .icobtn.ring svg{animation:bellring .75s ease}@keyframes bellring{0%,100%{transform:rotate(0)}15%{transform:rotate(16deg)}35%{transform:rotate(-12deg)}55%{transform:rotate(8deg)}75%{transform:rotate(-4deg)}}
.glass .badge{position:absolute;top:-3px;right:-3px;min-width:13px;height:13px;border-radius:99px;background:linear-gradient(160deg,#ffd76a,#f2b83e);color:#3a2c07;font:700 8.5px/13px var(--w-font);text-align:center;padding:0 3px;box-shadow:0 2px 6px #f2c14e73}
.glass .badge[hidden]{display:none}
@keyframes badgepop{0%{transform:scale(.55)}60%{transform:scale(1.2)}100%{transform:scale(1)}}
.glass .badge.pop{animation:badgepop .38s cubic-bezier(.34,1.45,.64,1)}
.glass .chev{display:grid;place-items:center;width:14px;height:14px;color:var(--w-dim);margin:0 5px 0 1px;transition:transform .26s var(--lg-snap),color .2s ease}
.glass .chev svg{width:10px;height:10px;stroke:currentColor;stroke-width:2.2}
.island.open .chev{transform:rotate(180deg)}
.island.roomed .spend,.island.roomed .sep,.island.roomed .moment{visibility:hidden}
.island.roomed .model small{display:none}
.glass .space{position:relative;z-index:2;display:block;max-height:0;opacity:0;overflow:hidden;transform:translateY(-6px);padding:0 12px;transition:max-height .3s var(--lg-out),opacity .18s ease,padding .3s var(--lg-out),transform .25s var(--lg-out)}
.island.open .space{max-height:700px;opacity:1;padding:4px 12px 46px;transform:none;transition:max-height .42s cubic-bezier(.3,1.1,.4,1),opacity .3s ease,padding .3s ease,transform .42s var(--lg-spring)}
.island.open.tall .space{max-height:980px}
.glass .hairline{height:1px;background:linear-gradient(90deg,transparent,#ffffff38,transparent);margin:0 2px 12px}
.pcells{display:grid;grid-template-columns:1.35fr 1fr 1fr 1fr;gap:9px}
@media(max-width:640px){.pcells{grid-template-columns:1fr 1fr}}
.pcell{position:relative;border-radius:16px;padding:11px 13px;background:linear-gradient(160deg,#ffffff2b,#ffffff0f);border:1px solid #ffffff38;box-shadow:none;transition:border-color .22s ease,box-shadow .22s ease,transform .18s ease}
.pcell:hover{border-color:#ffffff57;box-shadow:0 8px 20px -10px #02101a8c}
.pcell.z-streak{display:flex;flex-direction:column}
.streakfoot{margin-top:auto;padding-top:9px;display:flex;gap:6px;flex-wrap:wrap}
.sf{display:inline-flex;align-items:baseline;gap:4px;border-radius:9px;padding:3px 8px;font:500 9.5px var(--w-font);color:var(--w-soft);background:linear-gradient(160deg,#ffffff1a,#ffffff0a);border:1px solid #ffffff29;box-shadow:none;transition:border-color .2s ease,transform .18s ease}
.sf b{font-weight:700;color:var(--w-ink);font-size:11px;font-variant-numeric:tabular-nums}
.sf:hover{border-color:#ffffff4c;transform:translateY(-1px)}
.pcell .lbl{display:block;margin-bottom:3px}
.pcell .mn{font-size:15px;font-weight:700}
.up{font-size:10px;color:var(--w-green);font-weight:600;margin-left:5px;white-space:nowrap}
.up svg{width:9px;height:9px;stroke:currentColor;stroke-width:2.6;margin-right:3px;vertical-align:-1px}
.tiny{font-size:10px;color:var(--w-soft);display:block;margin-top:3px;letter-spacing:.02em}
.chiprow{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap;align-items:center}
.achip{display:inline-flex;align-items:center;gap:7px;border-radius:99px;padding:5px 12px;font:600 10.5px var(--w-font);background:linear-gradient(160deg,#cdff4e38,#cdff4e14);border:1px solid #cdff4e66;color:#e7ffb0;box-shadow:none;transition:transform .18s ease,box-shadow .2s ease,border-color .2s ease}
.achip:hover{transform:translateY(-1px);border-color:#cdff4e99;box-shadow:0 4px 12px #02101a47}
.achip.teal{background:linear-gradient(160deg,#1e9db847,#1e9db81a);border-color:#6bc5d673;color:#c9ecf4}
.achip svg{width:12px;height:12px;stroke:currentColor;stroke-width:2;flex:none}
.notice{position:relative;display:block;border-radius:15px;padding:10px 12px;margin-bottom:8px;cursor:pointer;outline:none;transition:opacity .2s ease,background .2s ease,border-color .2s ease;background:linear-gradient(160deg,#ffffff21,#ffffff0d);border:1px solid #fff3;box-shadow:none;font-size:12px}
.notice:hover{background:linear-gradient(160deg,#ffffff2e,#ffffff14);border-color:#ffffff4c}
.notice:last-child{margin-bottom:0}
.notice.read{opacity:.48}
.notice.fresh:not(.read) .nt{text-shadow:0 0 12px #6bc5d659}
.nchev{display:grid;place-items:center;width:16px;height:16px;flex:none;color:var(--w-dim);transition:transform .26s var(--lg-snap),color .2s ease}
.nchev svg{width:10px;height:10px;stroke:currentColor;stroke-width:2.2}
.notice:hover .nchev{color:var(--w-ink)}
.notice.openN .nchev{transform:rotate(180deg)}
.notice .nrow{display:flex;align-items:center;gap:10px}
.notice .nd{width:8px;height:8px;border-radius:50%;flex:none}
.notice.info .nd{background:#6bc5d6;box-shadow:0 0 8px #6bc5d6b2}
.notice.hold .nd{background:#a795c7;box-shadow:0 0 8px #a795c7b2}
.notice.done .nd{background:var(--w-green);box-shadow:0 0 8px #5fe3a1b2}
.notice .nt{color:var(--w-ink);font-weight:600}
.notice .ns{color:var(--w-soft);font-size:10.5px;display:block;margin-top:1px}
.notice .when{margin-left:auto;color:var(--w-dim);font-size:10px;flex:none}
.nread{width:22px;height:22px;border-radius:99px;flex:none;display:grid;place-items:center;cursor:pointer;background:linear-gradient(160deg,#ffffff29,#ffffff0f);border:1px solid #ffffff3d;transition:transform .14s ease,background .2s}
.nread:active{transform:scale(.88)}
.nread svg{width:11px;height:11px;stroke:var(--w-dim);stroke-width:2}
.nread svg path{stroke-dasharray:24;stroke-dashoffset:0}
.notice.read .nread svg path{animation:draw .35s ease}@keyframes draw{from{stroke-dashoffset:24}}
.notice.released::after{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;animation:flash .7s ease}@keyframes flash{0%{box-shadow:0 0 0 0 #5fe3a18c}100%{box-shadow:0 0 0 14px #5fe3a100}}
.notice.read .nread{background:linear-gradient(160deg,#5fe3a159,#5fe3a126);border-color:#5fe3a180}
.notice.read .nread svg{stroke:var(--w-green)}
.ndetail{max-height:0;opacity:0;overflow:hidden;transition:max-height .36s cubic-bezier(.3,1.15,.4,1),opacity .28s ease}
.notice.openN .ndetail{max-height:320px;opacity:1;margin-top:9px;padding-top:9px;border-top:1px solid #ffffff1f}
.notice.openN .ndetail>*{animation:cellin .34s cubic-bezier(.3,1.2,.4,1) backwards}
.notice.openN .ndetail>*:nth-child(2){animation-delay:.05s}
.notice.openN .ndetail>*:nth-child(3){animation-delay:.1s}
.dtxt{font-size:11px;color:var(--w-soft);line-height:1.55;margin:3px 0}
.trypill{display:inline-flex;align-items:center;gap:6px;border-radius:99px;padding:5px 13px;margin-top:6px;font:600 10.5px var(--font);color:#0d2b1c;background:linear-gradient(160deg,#d9ff7a,#c3f23e);cursor:pointer;box-shadow:0 3px 10px #cdff4e40;transition:transform .14s ease}
.trypill:active{transform:scale(.94)}
.gbtn{position:relative;overflow:hidden;transition:transform .14s ease,box-shadow .2s ease;font:600 11px var(--font);color:#0d2b1c;background:linear-gradient(160deg,#d9ff7a,#c3f23e);border:0;border-radius:99px;padding:5px 14px;cursor:pointer;flex:none;box-shadow:0 3px 10px #cdff4e4c}
.gbtn:hover{transform:translateY(-1px);box-shadow:0 5px 14px #cdff4e6b}
.gbtn:active{transform:scale(.93)}
.setrow{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 8px;margin:0 -6px;border-radius:10px;font-size:12px;transition:background .2s ease}
.setrow:hover{background:#ffffff0a}
.setrow+.setrow{border-top:1px solid #ffffff1a}
.setrow .sl{color:var(--w-ink);font-weight:500}
.setrow .sl small{display:block;font-size:10px;color:var(--w-dim);font-weight:400;margin-top:1px}
.seg{position:relative;display:inline-flex;gap:3px;background:#ffffff1a;border:1px solid #ffffff47;border-radius:99px;padding:3px;box-shadow:none}
.seg span{position:relative;z-index:1;font:600 10px var(--w-font);letter-spacing:.04em;padding:4px 11px;border-radius:99px;color:var(--w-dim);cursor:pointer;transition:color .22s ease,transform .14s ease}
.seg span:hover{color:var(--w-ink)}
.seg span:active{transform:scale(.93)}
.seg span.on{color:#fff}
.segthumb{position:absolute;top:3px;bottom:3px;left:3px;width:0;border-radius:99px;z-index:0;background:linear-gradient(160deg,#1e9db8b8,#1e9db866);box-shadow:0 2px 8px #1e9db859;transition:left .24s var(--lg-snap),width .24s var(--lg-snap)}
@keyframes segpop{0%{transform:scale(.86,.78)}55%{transform:scale(1.06,1.1)}100%{transform:scale(1)}}
.tgl{width:34px;height:20px;border-radius:99px;background:linear-gradient(160deg,#5fe3a18c,#5fe3a14c);border:1px solid #5fe3a18c;position:relative;cursor:pointer;flex:none;box-shadow:none;transition:background .28s ease,border-color .28s ease,transform .14s ease,box-shadow .2s ease}
.tgl:hover{box-shadow:0 0 0 3px #5fe3a124}
.tgl.off:hover{box-shadow:0 0 0 3px #ffffff17}
.tgl:active{transform:scale(.94)}
.tgl::after{content:"";position:absolute;top:2px;left:16px;width:14px;height:14px;border-radius:99px;background:#fff;box-shadow:0 1px 3px #000a104c;transition:left .3s cubic-bezier(.34,1.56,.64,1),width .16s ease}
.tgl:active::after{width:17px}
.tgl.off:active::after{left:2px}
.tgl:not(.off):active::after{left:13px}
.tgl.off{background:#ffffff1f;border-color:#ffffff38}
.tgl.off::after{left:2px}
.ciq{font:700 30px/1.05 var(--font);letter-spacing:-.01em;color:#fff;display:inline-block;transform-origin:0 60%;text-shadow:0 0 18px #6bc5d673}
.ciq.landed{animation:landed .34s var(--lg-pop)}@keyframes landed{0%{transform:scale(1)}50%{transform:scale(1.04)}100%{transform:scale(1)}}
.spark path:not([stroke]){opacity:0;animation:fadein .7s .5s ease forwards}@keyframes fadein{to{opacity:1}}
.sparkwrap{position:relative;display:block;margin-top:6px}
.spark{display:block;width:100%;height:38px}
.sparkwrap{min-height:38px}
.sparkdot{position:absolute;right:-4px;top:7px;width:8px;height:8px;border-radius:99px;background:var(--spkdot,#d9ff7a);box-shadow:0 0 9px #d9ff7a8c;opacity:0;animation:dotin .3s 1.05s ease-out forwards}
.heat{display:grid;grid-template-columns:repeat(14,1fr);gap:3px;margin-top:8px}
.heat i{aspect-ratio:1;border-radius:3.5px;animation:cellpop .32s cubic-bezier(.3,1.3,.4,1) backwards}
@keyframes cellpop{from{opacity:0;transform:scale(.55)}to{opacity:1;transform:none}}
.heat i,.heatlegend i{background:#ffffff17}
.heat i.h1,.heatlegend i.h1{background:#1e9db861}
.heat i.h2,.heatlegend i.h2{background:#1e9db8ad}
.heat i.h3,.heatlegend i.h3{background:#2ec8e8}
.heat i.hx,.heatlegend i.hx{background:linear-gradient(160deg,#d9ff7a,#c3f23e);box-shadow:0 0 6px #cdff4e80}
.heat.q{grid-template-columns:repeat(21,1fr);gap:2.5px}
.heatlegend{display:flex;align-items:center;gap:4px;font-size:8.5px;color:var(--w-soft);margin-top:7px;letter-spacing:.06em;text-transform:uppercase}
.heatlegend i{width:8px;height:8px;border-radius:2.5px;flex:none}
.lq{position:relative;width:56px;height:56px;border-radius:50%;overflow:hidden;flex:none;background:#ffffff14;border:1px solid #ffffff40;box-shadow:none}
.lq .water{position:absolute;left:0;right:0;bottom:0;height:88%;background:linear-gradient(180deg,#2ec8e8d9,#1e9db8e6);animation:waterrise .85s .2s cubic-bezier(.3,1.1,.4,1) backwards}
.lq .wave{position:absolute;left:-55%;top:-84%;width:210%;height:100%;border-radius:42%;background:#031e2be6;animation:spinwave 7s linear infinite}
.lq .pct{position:absolute;inset:0;display:grid;place-items:center;font:700 13px var(--w-font);color:#fff;text-shadow:0 1px 3px #000a1080}
@keyframes spinwave{to{transform:rotate(360deg)}}
@keyframes waterrise{from{height:10%}70%{height:91%}to{height:88%}}.gaugecell{display:flex;align-items:center;gap:12px}
.gaugecell .gtxt .lbl{display:block;margin-bottom:2px}
.pcell.clickable{cursor:pointer}
.pcell.clickable:hover{transform:translateY(-1px);box-shadow:0 4px 14px #02101a4c}
.pcell.clickable:active{transform:scale(.99)}
.pcell.clickable{outline:none}
.cellhint{position:absolute;top:11px;right:13px;font-size:8.5px;color:var(--w-soft);opacity:.75;letter-spacing:.1em;text-transform:uppercase}
.pcell.openiq .iqmore{max-height:120px;opacity:1;margin-top:8px}
.meter{display:flex;align-items:center;gap:8px;padding:3px 0}
.meter .ml{font-size:10px;color:var(--w-soft);width:86px;flex:none}
.meter .track{flex:1;height:6px;border-radius:99px;background:#ffffff1a;overflow:hidden}
.meter .fill{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#1E9DB8,#2ec8e8 60%,#d9ff7a);transform-origin:left;animation:meterin .6s cubic-bezier(.3,1.2,.4,1) backwards}
@keyframes meterin{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.meter .mv{font:700 10.5px var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-ink);width:22px;text-align:right}
.nlist{max-height:172px;overflow-y:auto;padding-right:4px}
.nlist,.mlist{scrollbar-width:thin;scrollbar-color:#6bc5d673 transparent}
.nlist::-webkit-scrollbar,.mlist::-webkit-scrollbar{width:5px}
.nlist::-webkit-scrollbar-thumb,.mlist::-webkit-scrollbar-thumb{background:#6bc5d666;border-radius:99px}
.nlist::-webkit-scrollbar-track,.mlist::-webkit-scrollbar-track{background:transparent}
.island.tall .nlist{max-height:480px}
.growbtn{position:absolute;overflow:hidden;bottom:8px;left:50%;transform:translateX(-50%);z-index:4;display:flex;align-items:center;justify-content:center;gap:6px;width:fit-content;font:600 10px var(--font);letter-spacing:.14em;text-transform:uppercase;color:var(--w-ink);-webkit-backdrop-filter:blur(12px) saturate(1.6);backdrop-filter:blur(12px) saturate(1.6);background:linear-gradient(160deg,#ffffff42,#ffffff1a);border:1px solid #ffffff61;border-radius:99px;padding:6px 16px;cursor:pointer;box-shadow:0 6px 18px #02101a59;transition:background .2s,transform .18s}
.growbtn:hover{transform:translateX(-50%) translateY(-1px);background:linear-gradient(160deg,#ffffff2e,#ffffff14)}
.growbtn:active{transform:translateX(-50%) scale(.94)}
.growbtn svg{width:10px;height:10px;stroke:currentColor;stroke-width:2.4;transition:transform .26s var(--lg-snap)}
.growbtn .gl{transition:opacity .14s ease}
.island.tall .growbtn svg{transform:rotate(180deg)}
.icobtn:active{transform:scale(.9)!important}
.pcell.usage{grid-column:1/-1}
.urow{display:flex;align-items:center;gap:10px;padding:4px 0}
.urow .un{font:600 11px var(--w-font);color:var(--w-ink);width:74px;flex:none}
.urow .track{flex:1;height:8px;border-radius:99px;background:#ffffff1a;overflow:hidden;box-shadow:inset 0 1px 2px #000a104c}
.urow .fill{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#1E9DB8,#2ec8e8 60%,#d9ff7a);transform-origin:left;animation:meterin .7s .1s cubic-bezier(.3,1.2,.4,1) backwards}
.urow:nth-child(3) .fill{animation-delay:.18s}
.urow:nth-child(4) .fill{animation-delay:.26s}
.urow .upct{font:700 11px var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-dim);width:34px;text-align:right;flex:none}
.island.lowpower .dot{color:var(--w-amber)}
.island[data-health="limited"] .dot{color:var(--w-amber);animation:none}.island[data-health="limited"] .dot .halo{animation:none;opacity:.25}
.island[data-health="cut"] .dot{color:var(--w-red);animation:pulse 1.6s ease-in-out infinite}.island[data-health="cut"] .dot .halo{animation-duration:1.6s;opacity:.5}
.more{display:none}
.island.tall .more{display:block}
.hourly{display:flex;align-items:flex-end;gap:2.5px;height:34px;margin-top:8px}
.hourly i{flex:1;border-radius:2px 2px 0 0;background:#2ec8e880;min-height:2px;transform-origin:bottom;animation:barin .5s cubic-bezier(.3,1.2,.4,1) backwards}
@keyframes barin{from{transform:scaleY(0)}to{transform:none}}
.hourly i.pk{background:linear-gradient(180deg,#d9ff7a,#c3f23e)}
.donutwrap{display:flex;align-items:center;gap:12px}
.donut{width:56px;height:56px;flex:none;animation:donutin .6s .15s cubic-bezier(.3,1.2,.4,1) backwards}
.donut circle{stroke-width:4}
.donut circle:not(:first-of-type){animation:arc .9s cubic-bezier(.3,1,.4,1) backwards}.donut circle:nth-of-type(3){animation-delay:.16s}.donut circle:nth-of-type(4){animation-delay:.32s}
@keyframes arc{from{stroke-dasharray:0 100}}
@keyframes donutin{from{opacity:0;transform:rotate(-24deg) scale(.9)}to{opacity:1;transform:none}}
.dleg{font-size:10px;color:var(--w-dim);line-height:1.7}
.dleg b{color:var(--w-ink);font-weight:600}
.dleg i{display:inline-block;width:7px;height:7px;border-radius:2px;margin-right:6px}
.ministat .mn{font-size:17px;font-weight:700}
@keyframes cellin{from{opacity:0;transform:translateY(9px) scale(.985)}to{opacity:1;transform:none}}
.space .pcell,.space .notice,.space .setrow,.space .achip{animation:cellin .38s cubic-bezier(.3,1.2,.4,1) backwards}
.pcells>*:nth-child(2),.nlist>*:nth-child(2),.setrow:nth-of-type(2){animation-delay:.05s}
.pcells>*:nth-child(3),.nlist>*:nth-child(3),.setrow:nth-of-type(3){animation-delay:.1s}
.pcells>*:nth-child(4),.nlist>*:nth-child(4),.setrow:nth-of-type(4){animation-delay:.15s}
.pcells>*:nth-child(5),.nlist>*:nth-child(5),.setrow:nth-of-type(5){animation-delay:.2s}
.nlist>*:nth-child(6),.setrow:nth-of-type(6){animation-delay:.25s}
.nlist>*:nth-child(7){animation-delay:.3s}
.chiprow .achip:nth-child(1){animation-delay:.22s}
.chiprow .achip:nth-child(2){animation-delay:.28s}
.chiprow .achip:nth-child(3){animation-delay:.34s}
.spark path[stroke]{stroke-dasharray:100;stroke-dashoffset:100;animation:sparkdraw .9s .25s ease-out forwards}@keyframes sparkdraw{to{stroke-dashoffset:0}}
@keyframes dotin{to{opacity:1}}
@keyframes dashflow{to{background-position:10px 0}}
.mchip.to{border-color:#cdff4e8c;box-shadow:0 0 12px #cdff4e2e;color:#eaffc2}
.mchip.to svg{stroke:#d9ff7a}
@keyframes nudge{0%,100%{transform:translateX(0)}50%{transform:translateX(3px)}}
.weekchart .wc:nth-child(3) .wcb{animation-delay:.08s}
.weekchart .wc:nth-child(5) .wcb{animation-delay:.16s}
.weekchart .wc:nth-child(7) .wcb{animation-delay:.24s}
.weekchart .wc.today .wcb{background:linear-gradient(180deg,#d9ff7a,#b9d94a)}
.sthumb .tbar.g{background:#d9ff7ab2}
.sthumb .trow{position:absolute;left:8px;right:26px;height:2.5px;border-radius:2px;background:#ffffff2e}
.tokhead{display:flex;align-items:center}
.tokhead .seg{margin-left:auto}
.tokhead .seg span{padding:3px 8px;font-size:9px}
.tokrow{display:flex;align-items:baseline;gap:12px;margin-top:6px;flex-wrap:wrap}
.tokval{font:700 22px/1.1 var(--font);color:var(--w-ink);font-variant-numeric:tabular-nums;text-shadow:0 0 14px #6bc5d659}
.iolegend{font-size:10px;color:var(--w-soft)}
.tokval{display:inline-block;transition:opacity .14s ease,transform .14s ease}
.iolegend b{color:var(--w-ink);font-weight:600}
.iobar{display:flex;height:7px;border-radius:99px;overflow:hidden;background:#ffffff1a;margin-top:7px;box-shadow:inset 0 1px 2px #000a104c}
.ioin{background:linear-gradient(90deg,#1E9DB8,#2ec8e8);transition:width .35s cubic-bezier(.3,1.1,.4,1)}
.ioout{flex:1;background:linear-gradient(90deg,#b9d94a,#d9ff7a)}
.island.nospend .spend,.island.nospend .sep{display:none}
.rcptrow{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-top:10px;padding:0 2px;font-size:10px;color:var(--w-dim);animation:cellin .38s .3s var(--lg-spring) backwards}
.rcptrow .mnr{font:600 10.5px/1.4 var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-ink);word-break:break-all}
.glass.light .island{background:linear-gradient(165deg,#f8fdff,#ecf6faf0 42%,#f1f8fb);color:#0c2836;border-color:#04283829;box-shadow:0 6px 18px #17303e29,0 1px 3px #17303e1a,inset 0 -14px 28px -18px #1e9db82e}
.glass.light .row::after{background:linear-gradient(100deg,#04283803,#0428380d 45%,#04283803)}
.glass.light .setrow:hover{background:#0428380a}
.glass.light .pcell:hover{box-shadow:0 8px 20px -10px #17303e59}

.glass.light .notice.released::after{animation-name:flashlight}
@keyframes flashlight{0%{box-shadow:0 0 0 0 #1d7d4f73}100%{box-shadow:0 0 0 14px #1d7d4f00}}
.glass.light .row:hover .chev,.glass.light .notice:hover .nchev{color:#0c2836}
.glass.light .nchev{color:#3f5d6c}
.glass.light .seg span:hover{color:#0c2836}
.glass.light .notice:hover{background:#fff;border-color:#04283842}
.glass.light .notice.fresh:not(.read) .nt{text-shadow:none}
.glass.light .tgl:hover{box-shadow:0 0 0 3px #1d7d4f24}
.glass.light .tgl.off:hover{box-shadow:0 0 0 3px #04283814}
.glass.light .icobtn:hover{box-shadow:0 3px 10px #17303e29}
.glass.light .homepill{color:#0c2836;border-color:#04283833;background:linear-gradient(160deg,#fffffff0,#ffffffb8);box-shadow:0 4px 14px #17303e29}
.glass.light .island.roomed .homepill:hover{background:#fff}
.glass.light .pcell:hover{border-color:#0428384c}
.glass.light .sf{color:#33505f;background:linear-gradient(160deg,#fff,#ffffffb2);border-color:#04283829;box-shadow:none}
.glass.light .sf b{color:#0c2836}
.glass.light .sf:hover{border-color:#0428384c}

.glass.light .achip:hover{box-shadow:0 4px 12px #17303e24}
.glass.light .island.open{border-color:#0428383d}
.glass.light .liquid{background:#d8eaf2}
.glass.light .liquid i{opacity:.6}
.glass.light .liquid::after{background:linear-gradient(180deg,#f8fdff99,#f8fdff47 45%,#f8fdff80)}
.glass.light .glare{opacity:.45}
.glass.light .model,.glass.light .mn{color:#0c2836;text-shadow:none}
.glass.light .model small,.glass.light .mn.dim,.glass.light .lbl,.glass.light .moment,.glass.light .chev{color:#3f5d6c}
.glass.light .sep{background:#04283833}
.glass.light .dot{color:#1d7d4f}
.glass.light .island.lowpower .dot{color:#9a6b00}
.glass.light .island[data-phase="waiting"] .dot,.glass.light .island[data-phase="dry"] .dot{color:#9a6b00}
.glass.light .island[data-health="limited"] .dot{color:#9a6b00}
.glass.light .island[data-health="cut"] .dot{color:#c0392b}
.glass.light .icobtn{background:linear-gradient(160deg,#ffffffe6,#fff9);border-color:#0428382e;box-shadow:none}
.glass.light .icobtn svg{stroke:#0c2836}
.glass.light .icobtn.active{background:linear-gradient(160deg,#1e9db859,#1e9db82e);border-color:#1e9db880}
.glass.light .hairline{background:linear-gradient(90deg,transparent,#04283838,transparent)}
.glass.light .pcell{background:linear-gradient(160deg,#fff,#ffffffd1);border-color:#0428382e;box-shadow:0 3px 10px #17303e1a}
.glass.light .ciq{color:#0c2836;text-shadow:none}
.glass.light .tiny{color:#33505f}
.glass.light .up{color:#1d7d4f}
.glass.light .heat i,.glass.light .heatlegend i{background:#0428381f}
.glass.light .heat i.h1,.glass.light .heatlegend i.h1{background:#1e9db859}
.glass.light .heat i.h2,.glass.light .heatlegend i.h2{background:#1e9db899}
.glass.light .heat i.h3,.glass.light .heatlegend i.h3{background:#0f7d95}
.glass.light .urow .un{color:#0c2836}
.glass.light .urow .upct{color:#3f5d6c}
.glass.light .urow .track{background:#0428381a;box-shadow:inset 0 1px 2px #17303e26}
.glass.light .urow .fill{background:linear-gradient(90deg,#0f7d95,#1E9DB8 60%,#7ba81c)}
.glass.light .lq{background:#0428380f;border-color:#04283833}
.glass.light .lq .wave{background:#e6f1f6f2}
.glass.light .lq .water{background:linear-gradient(180deg,#118aa4eb,#0b6478f2)}
.glass.light .achip{background:linear-gradient(160deg,#a3cf3c40,#a3cf3c1a);border-color:#7aa01e80;color:#3f5a10}
.glass.light .achip.teal{background:linear-gradient(160deg,#1e9db829,#1e9db80f);border-color:#1e9db866;color:#11758C}
.glass.light .notice{background:linear-gradient(160deg,#fff,#ffffffd9);border-color:#04283829;box-shadow:0 2px 6px #17303e12}
.glass.light .notice .nt{color:#0c2836}
.glass.light .notice .ns,.glass.light .notice .when{color:#3f5d6c}
.glass.light .notice.openN .ndetail{border-top-color:#04283824}
.glass.light .nread{background:linear-gradient(160deg,#fff,#ffffffb2);border-color:#04283833}
.glass.light .nread svg{stroke:#3f5d6c}
.glass.light .drow{color:#0c2836}
.glass.light .dtxt,.glass.light .fcap,.glass.light .qlabels,.glass.light .weekchart .wcl,.glass.light .quietbar .qmoon svg{color:#3f5d6c;stroke:#3f5d6c}
.glass.light .fchip{color:#0c2836;background:#04283812;border-color:#04283829}
.glass.light .setrow .sl{color:#0c2836}
.glass.light .setrow .sl small{color:#3f5d6c}
.glass.light .setrow+.setrow{border-top-color:#0428381f}
.glass.light .seg{background:#04283812;border-color:#04283826}
.glass.light .seg span{color:#3f5d6c}
.glass.light .seg span.on{color:#fff}
.glass.light .segthumb{background:linear-gradient(160deg,#1E9DB8,#137a94);box-shadow:0 2px 8px #1e9db84c}
.glass.light .tgl{background:linear-gradient(160deg,#2fae74,#1d7d4f);border-color:#1d7d4fb2}
.glass.light .tgl.off{background:#04283824;border-color:#04283838}
.glass.light .growbtn{background:linear-gradient(160deg,#ffffffe6,#ffffffa6);border-color:#04283838;color:#0c2836;box-shadow:0 6px 16px #17303e26}
.glass.light .nlist{scrollbar-color:#1e9db880 transparent}
.glass.light .meter .track{background:#0428381a}
.glass.light .meter .fill{background:linear-gradient(90deg,#0f7d95,#1E9DB8 60%,#7ba81c)}
.glass.light .tokval{color:#0c2836;text-shadow:none}
.glass.light .iobar{background:#0428381a;box-shadow:inset 0 1px 2px #17303e26}
.glass.light .ioin{background:linear-gradient(90deg,#0f7d95,#1E9DB8)}
.glass.light .ioout{background:linear-gradient(90deg,#7ba81c,#9ac02c)}
.glass.light .nico{background:linear-gradient(160deg,#fff,#ffffffb2);border-color:#04283833}
.glass.light .nico svg{stroke:#0c2836}
.glass.light .fline{background:repeating-linear-gradient(90deg,#04283859 0 5px,transparent 5px 10px)}
.glass.light .avx i{border-color:#fff}
.glass.light .mchip{color:#0c2836;background:#0428380f;border-color:#0428382e}
.glass.light .mchip svg{stroke:#3f5d6c}
.glass.light .mchip.to{border-color:#5c8f0e99;box-shadow:0 0 10px #7aa81c33;color:#33500a}
.glass.light .mchip.to svg{stroke:#5c8f0e}
.glass.light .swarrow svg{stroke:#3f5d6c}
.glass.light .ttile{color:#0c2836;background:#0428380f;border-color:#04283826}
.glass.light .ttile svg{stroke:#0f7d95}
.glass.light .weekchart .wcb{background:linear-gradient(180deg,#0f7d95cc,#0f7d9580)}
.glass.light .weekchart .wc.today .wcb{background:linear-gradient(180deg,#9ac02c,#7ba81c)}
.glass.light .sthumb{border-color:#04283833}
.glass.light .quietbar{border-color:#0428382e}
.glass.light .hourly i{background:#0f7d958c}
.glass.light .hourly i.pk{background:linear-gradient(180deg,#9ac02c,#7ba81c)}
.glass.light .dleg{color:#3f5d6c}
.glass.light .dleg b{color:#0c2836}
.glass.light .donut circle:first-of-type{stroke:#0428381f}
.glass.light .rcptrow{color:#3f5d6c}
.glass.light .rcptrow .mnr{color:#0c2836}
.glass.light .iolegend{color:#3f5d6c}
.glass.light .iolegend b{color:#0c2836}
.glass.light .heatlegend{color:#3f5d6c}
.glass.light .cellhint{color:#3f5d6c}
.glass.light .lq .pct{color:#0c2836;text-shadow:0 1px 2px #ffffffbf}
.glass.light .island{--spk:#0f7d95;--spkdot:#5c8f0e;--w-soft:#33505f}
@media(max-width:720px){.glass .moment{display:none}.glass .z-bell{margin-left:auto}}
.island[data-ctx] .moment{display:flex}
@media(max-width:720px){.island[data-ctx]:not(.open) .spend,.island[data-ctx]:not(.open) .sep{display:none}}
@media(max-width:500px){.island[data-health="cut"] .spend,.island[data-health="cut"] .sep,
  .island[data-health="limited"] .spend,.island[data-health="limited"] .sep{display:none}}
@media(max-width:360px){.island[data-health="cut"] .chev,.island[data-health="cut"] .z-gear,
  .island[data-health="limited"] .chev,.island[data-health="limited"] .z-gear{display:none}}
@media(max-width:430px){.glass .model small{display:none}}
.glass .model .sw{display:none}
.island.dockseat .model{cursor:pointer;display:inline-flex;align-items:center;gap:6px;border-radius:99px;padding:2px 4px 2px 9px;margin-left:-2px;border:1px solid #fff3;background:#ffffff0f;transition:background .2s ease,border-color .2s ease}
.island.dockseat .model:hover{background:#ffffff1f;border-color:#d7ff7a80}
.island.dockseat .model .sw{display:inline-grid;place-items:center;width:16px;height:16px;border-radius:99px;flex:none;background:#d7ff7a38;transition:transform .2s ease,background .2s ease}
.island.dockseat .model:hover .sw{background:#d7ff7a66}
.glass.light .island.dockseat .model{border-color:#04283833;background:#0428380a}.glass.light .island.dockseat .model .sw{background:#1e9db82e}.glass.light .model .sw svg{stroke:#0c2836}
.island.dockseat .model:hover .sw{transform:translateY(1px)}
.glass .model .sw svg{width:10px;height:10px;stroke:#e7ffb0;stroke-width:2.6}
.island.dockseat .model small{color:#d5f59a}
.pkhead{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.pkhead .ttl{font-size:13px;font-weight:700;color:var(--w-ink)}
.pkhead .ttl b{color:#e7ffb0;font-weight:700}
.pkhead .tiny{margin:0}
.mlist{display:flex;flex-direction:column;gap:2px;max-height:480px;overflow-y:auto;padding:0 4px 20px 0;-webkit-mask-image:linear-gradient(#000 calc(100% - 40px),transparent);mask-image:linear-gradient(#000 calc(100% - 40px),transparent)}
.island.tall .mlist{-webkit-mask-image:none;mask-image:none;padding-bottom:0}
.island.tall .mlist{max-height:720px}
.mrow{display:grid;grid-template-columns:16px minmax(0,1fr) auto;align-items:center;gap:10px;padding:7px 9px;border-radius:11px;cursor:pointer;outline:none;border:1px solid transparent;transition:background .18s ease,border-color .2s ease;animation:cellin .34s cubic-bezier(.3,1.2,.4,1) backwards}
.mrow:hover{background:#ffffff12}
.mrow.on{background:linear-gradient(160deg,#1e9db84c,#1e9db81a);border-color:#6bc5d666}
.mrow.gone{display:none}
.mrow.lock{opacity:.55;cursor:default}.mrow.lock:hover{background:transparent}
.pkdef{margin:8px 0 0;animation:cellin .34s .12s cubic-bezier(.3,1.2,.4,1) backwards}
.pkmode{display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 9px;border-radius:99px;flex:none;font:600 10px var(--w-font);color:var(--w-soft);background:#ffffff14;border:1px solid #ffffff38}
.pkmode svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pkmode.pin{color:#f2c14e;background:#f2c14e1f;border-color:#f2c14e55}
.glass.light .pkmode{color:#1d3a4a;background:#ffffffa6;border-color:#04283838}
.mrow .tk{width:16px;height:16px;border-radius:50%;border:1.5px solid #fff6;display:grid;place-items:center;transition:background .2s ease,border-color .2s ease}
.mrow .tk::after{content:"";width:8px;height:8px;border-radius:50%;background:linear-gradient(160deg,#d9ff7a,#c3f23e);transform:scale(0);transition:transform .2s var(--lg-pop)}
.mrow.on .tk{border-color:#d9ff7a}
.mrow.on .tk::after{transform:scale(1)}
.mrow .nm{font-size:12px;font-weight:600;color:var(--w-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mrow .nm .ci{display:inline-grid;place-items:center;width:14px;height:14px;margin-right:6px;vertical-align:-2px;color:var(--w-soft)}.mrow .nm .ci .ic{width:13px;height:13px;background:currentColor;-webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat}.mrow.on .nm .ci{color:#d9ff7a}
.mrow .nm small{display:block;font-size:10px;font-weight:500;color:var(--w-dim);white-space:normal;line-height:1.3;margin-top:1px}
.mrow .nm small b{color:#d5f59a;font-weight:600}
.mrow .num{font:600 10.5px var(--w-font);color:var(--w-soft);text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.mrow .num small{display:block;font-size:9.5px;color:var(--w-dim);font-weight:500;white-space:normal;max-width:96px;margin-left:auto;line-height:1.25}
.setrow .sl small b,.chatcost .tiny b{color:#d5f59a;font-weight:600}
.seg span.sv::after{content:"";position:absolute;left:50%;bottom:1px;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:#d9ff7a}
.chatcost .ccrow{display:flex;align-items:flex-end;gap:14px;margin:4px 0 6px}
.chatcost .ccusd{font-size:28px;font-weight:800;letter-spacing:-.02em;color:#e7ffb0;font-variant-numeric:tabular-nums;line-height:1}
.chatcost .ccspark{display:flex;align-items:flex-end;gap:3px;height:34px;flex:1;max-width:220px}
.chatcost .ccspark i{display:block;flex:1;min-width:4px;max-width:12px;border-radius:3px 3px 1px 1px;background:linear-gradient(180deg,#2ec8e8,#1E9DB8);transform-origin:bottom;animation:ccbar .5s cubic-bezier(.3,1.2,.4,1) backwards}
.chatcost .ccspark i.now{background:linear-gradient(180deg,#d9ff7a,#c3f23e)}
@keyframes ccbar{from{transform:scaleY(0)}}
.glass.light .chatcost .ccusd{color:#0c2836}
.glass.light .setrow .sl small b,.glass.light .chatcost .tiny b{color:#0b6e86}
.glass.light .seg span.sv::after{background:#1E9DB8}
.pkband{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 9px;padding:9px 11px;border-radius:13px;background:linear-gradient(160deg,#e26a563d,#e26a5612);border:1px solid #e26a5670}
.pkband .bt{flex:1 1 150px;min-width:0;font-size:11.5px;font-weight:600;color:var(--w-ink)}
.pkband .bt b{color:#ffe3ce}
.glass .model .un{width:9px;height:9px;border-radius:50%;flex:none;border:2.5px solid #f2b04e}
.pcell[data-cache="warm"]{background:linear-gradient(160deg,#a3cf3c38,#a3cf3c12);border-color:#a3cf3c5c}
.pcell[data-cache="cold"]{background:linear-gradient(160deg,#7da3be3d,#7da3be14);border-color:#7da3be5c}
.qbtn{font:600 10.5px var(--w-font);color:var(--w-dim);background:none;border:1px solid transparent;border-radius:99px;padding:5px 11px;cursor:pointer;transition:color .2s ease,background .2s ease}
.qbtn:hover{color:var(--w-ink);background:#ffffff12}
.gbtn:disabled{opacity:.45;cursor:default;transform:none;box-shadow:none}
.ctxbar{height:6px;border-radius:99px;background:#ffffff1a;overflow:hidden;margin-top:7px}
.ctxbar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#1E9DB8,#2ec8e8 60%,#d9ff7a);transition:width .5s var(--lg-out)}
.ctxbar.hot i{background:linear-gradient(90deg,#f2c14e,#ff8a5b)}
.pknote{font-size:10.5px;color:var(--w-soft);line-height:1.45}
.pknote.ok{color:var(--w-green)}
.pknote.bad{color:#ffb3a7}
.pknote b{color:var(--w-ink);font-weight:600}
.ctxpct{font-size:10px;color:var(--w-dim);font-weight:600;margin-left:6px}
.ctxpct.hot{color:#ffb3a7}
.glass .space.still .mrow{animation:none}
.glass.light .island.dockseat .model:hover{background:#0428380d}
.glass.light .model .sw{background:linear-gradient(160deg,#a3cf3c4c,#a3cf3c1f);border-color:#7aa01e8c}
.glass.light .model .sw svg{stroke:#3f5a10}
.glass.light .island.dockseat .model small,.glass.light .mrow .nm small b{color:#4a6a12}
.glass.light .pkhead .ttl,.glass.light .mrow .nm,.glass.light .pknote b{color:#0c2836}
.glass.light .pkhead .ttl b{color:#4a6a12}
.glass.light .mrow:hover{background:#0428380d}
.glass.light .mrow.on{background:linear-gradient(160deg,#1e9db82e,#1e9db80f);border-color:#1e9db866}
.glass.light .mrow .tk{border-color:#0428384c}
.glass.light .mrow.on .tk{border-color:#0b6e86}
.glass.light .mrow .tk::after{background:linear-gradient(160deg,#1e9db8,#0b6e86)}
.glass.light .mrow small,.glass.light .qbtn{color:#3f5d6c}
.glass.light .mrow .num,.glass.light .pknote{color:#33505f}
.glass.light .pknote.ok{color:#1d7d4f}
.glass.light .pknote.bad,.glass.light .ctxpct.hot{color:#b23a2a}
.glass.light .ctxpct{color:#3f5d6c}
.glass.light .qbtn:hover{color:#0c2836;background:#0428380d}
.glass.light .ctxbar{background:#04283814}
.glass.light .pkband{background:linear-gradient(160deg,#c2483233,#c2483212);border-color:#c2483280}
.glass.light .pkband .bt{color:#0c2836}.glass.light .pkband .bt b{color:#0c2836}
.glass.light .model .un{border-color:#b5760a}
.glass.light .pcell[data-cache="warm"]{background:linear-gradient(160deg,#7aa01e2b,#7aa01e0d);border-color:#7aa01e5c}
.glass.light .pcell[data-cache="cold"]{background:linear-gradient(160deg,#34688826,#3468880d);border-color:#34688852}
@media (prefers-reduced-motion:reduce){.mrow{animation:none}.ctxbar i,.mrow .tk::after{transition:none}.island.dockseat .model:hover .sw{transform:none}}
.glass .space.still .pcell,.glass .space.still .notice,.glass .space.still .setrow,.glass .space.still .achip,
.glass .space.still .spark path[stroke],.glass .space.still .sparkdot,.glass .space.still .lq .water,.glass .space.still .donut,
.glass .space.still .meter .fill,.glass .space.still .fline,.glass .space.still .swarrow svg,.glass .space.still .heat i,
.glass .space.still .hourly i,.glass .space.still .weekchart .wcb,.glass .space.still .urow .fill,.glass .space.still .ciq.landed,
.glass .space.still .spark path:not([stroke]),.glass .space.still .donut circle,.glass .space.still .rcptrow,.glass .space.still .rcptrow .mnr::after{animation:none}
.glass .space.still .spark path:not([stroke]){opacity:1}
.island.open .space.fade{opacity:0;transition-duration:.12s}
@media (prefers-reduced-motion:reduce){
  .glass .liquid,.glass .liquid i,.glass .liquid i:is(.l1,.l2,.l3,.l4),.glass .dot,.island[data-health="cut"] .dot,.space .pcell,.space .notice,.space .setrow,.space .achip,.spark path[stroke],.sparkdot,.lq .water,.donut,.meter .fill,.fline,.swarrow svg,.heat i,.hourly i,.weekchart .wcb,.urow .fill,.glass .badge.pop{animation:none}.island{transition:none}  .homepill,.island.roomed .homepill{transition:opacity .2s ease;transform:translate(-50%,-50%)}.glass .dot.ping::after,.glass .dot.ping::before,.glass .dot.ping,.notice.openN .ndetail>*,.homepill:hover::before,.growbtn:hover::before,.gbtn:hover::before,.ciq.landed,.spark path:not([stroke]),.heat i.hx,.hourly i.pk,.weekchart .wc.today .wcb,.donut circle,.notice.read .nread svg path,.notice.released,.seg span.picked,.tgl.flip,.achip:hover svg,.rcptrow,.rcptrow .mnr::after,.glass .icobtn.ring svg,.island.roomed .homepill::before{animation:none}.spark path:not([stroke]){opacity:1}.spark path[stroke]{stroke-dashoffset:0}.sparkdot{opacity:1}.glass .space,.island.open .space{transform:none}.island.open .space.fade{opacity:1}}


.fchip{display:inline-flex;align-items:center;gap:5px;border-radius:8px;padding:4px 9px;margin:3px 4px 0 0;font:600 10px var(--w-font);color:var(--w-ink);background:#ffffff1a;border:1px solid #fff3}
.iqmore{max-height:0;opacity:0;overflow:hidden;transition:max-height .34s cubic-bezier(.3,1.15,.4,1),opacity .26s ease}
.nico{width:30px;height:30px;border-radius:99px;flex:none;display:grid;place-items:center;background:linear-gradient(160deg,#ffffff2e,#ffffff12);border:1px solid #ffffff42;box-shadow:none}
.nico svg{width:14px;height:14px;stroke:var(--w-ink);stroke-width:1.8}
.nico.gate{border-color:#a795c799;box-shadow:0 0 12px #a795c759}
.nico.gate svg{stroke:#cdbfe8}
.flowmini{display:flex;align-items:center;gap:8px;padding:4px 0 2px}
.fline{flex:1;height:2px;border-radius:2px;background:repeating-linear-gradient(90deg,#ffffff59 0 5px,transparent 5px 10px);animation:dashflow 1.2s linear infinite}
.fcap{font-size:9px;color:var(--w-dim);text-align:center;margin-top:3px;letter-spacing:.06em;text-transform:uppercase}
.avx{display:flex}
.avx i{width:26px;height:26px;border-radius:99px;display:grid;place-items:center;font:700 10px var(--w-font);color:#04222f;border:2px solid #0a2432d9;margin-left:-7px}
.avx i:first-child{margin-left:0}
.avx i:nth-child(1){background:linear-gradient(160deg,#7fd4e6,#2ec8e8)}
.avx i:nth-child(2){background:linear-gradient(160deg,#d9ff7a,#b9d94a)}
.avx i:nth-child(3){background:linear-gradient(160deg,#cdbfe8,#a795c7)}
.modelswap{display:flex;align-items:center;gap:10px;padding:4px 0 2px}
.mchip{display:inline-flex;align-items:center;gap:7px;border-radius:12px;padding:6px 11px;font:600 11px var(--w-font);color:var(--w-ink);background:#ffffff17;border:1px solid #fff3}
.mchip svg{width:13px;height:13px;stroke:var(--w-dim);stroke-width:1.8}
.swarrow{flex:none;width:20px;height:14px}
.swarrow svg{width:100%;height:100%;stroke:var(--w-dim);stroke-width:2;animation:nudge 1.6s ease-in-out infinite}
.toolgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;padding-top:2px}
.ttile{display:flex;align-items:center;gap:7px;border-radius:11px;padding:7px 9px;font:600 10px var(--w-font);color:var(--w-ink);background:#ffffff17;border:1px solid #ffffff2e}
.ttile svg{width:12px;height:12px;stroke:#7fd4e6;stroke-width:1.8;flex:none}
.weekchart{display:flex;align-items:flex-end;gap:6px;height:44px;padding:4px 0 0}
.weekchart .wc{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px}
.weekchart .wcb{width:100%;border-radius:4px 4px 0 0;background:linear-gradient(180deg,#2ec8e8bf,#1e9db880);transform-origin:bottom;animation:barin .5s cubic-bezier(.3,1.2,.4,1) backwards}
.weekchart .wc:nth-child(2) .wcb{animation-delay:.04s}.weekchart .wc:nth-child(4) .wcb{animation-delay:.12s}.weekchart .wc:nth-child(6) .wcb{animation-delay:.2s}.weekchart .wcl{font-size:8px;color:var(--w-dim);letter-spacing:.04em}
.skillcard{display:flex;gap:11px;align-items:stretch}
.sthumb{width:86px;flex:none;border-radius:10px;overflow:hidden;position:relative;background:linear-gradient(165deg,#0a3346,#052636);border:1px solid #ffffff38;box-shadow:none}
.sthumb .tbar{position:absolute;left:8px;right:8px;height:4px;border-radius:2px;background:#7fd4e68c}
.sthumb .tdot{position:absolute;width:14px;height:14px;border-radius:50%;right:7px;bottom:7px;background:conic-gradient(#2ec8e8 0 62%,#d9ff7a 62% 84%,#fff3 84%)}
.skillbody{flex:1;min-width:0}
.quietbar{position:relative;height:22px;border-radius:99px;overflow:hidden;margin:6px 0 3px;background:linear-gradient(90deg,#0a1e2ce6,#1e3c54b2 55%,#f2c14e47);border:1px solid #ffffff29}
.quietbar .qmoon{position:absolute;left:8px;top:3px;width:15px;height:15px}
.quietbar .qmoon svg{width:100%;height:100%;stroke:#9db8c4;stroke-width:1.6}
.quietbar .qdot{position:absolute;top:8px;width:6px;height:6px;border-radius:50%;background:#f2c14e;box-shadow:0 0 6px #f2c14eb2}
.qlabels{display:flex;justify-content:space-between;font-size:8.5px;color:var(--w-dim);letter-spacing:.06em}

/* ——— kit-only additions ——— */
.island.capsule{max-width:300px}          /* the dock's idle width; islands are fluid by default */
.island.still{opacity:1;transform:none}   /* skip the rise-in for a static showcase */

/* ==== ../ui-kit/console.css ==== */
/* ═══════════════════════════════════════════════════════════════════════════════════════
   Aegis Liquid Glass Kit — console.css (hand-authored; the console layer)
   Components that a console needs and the live bar doesn't: navigation, tables, inputs,
   feedback, overlays. Same roots as glass.css (.glass / .glass.light), same tokens, same
   doctrine: one transition list per element, entrances use fill-mode backwards, no filter
   animations, focus rings only for the keyboard, everything collapses under reduced motion.
   ═══════════════════════════════════════════════════════════════════════════════════════ */

/* ——— shared bits ——— */
/* A SECOND step up the type scale, 2026-09-15 (Sam, on the console in front of him: "fonts are
   too small throughout, and icons are too small in the navigation menu"). 12.5 px is the floor for
   every word on a console surface now — only the sidebar's group caption sits under it — and the
   glyph is 18 px at a 1.7 stroke: a bigger box at the old 1.75 reads heavier, so the weight stays
   where the eye had it. Control heights move with their type; nothing gets tighter. */
.glass .gicon{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.glass .gbtn2{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:36px;padding:0 15px;border-radius:99px;cursor:pointer;
  font:600 15px var(--w-font);color:var(--w-ink);
  background:linear-gradient(160deg,rgba(255,255,255,.18),rgba(255,255,255,.06));
  border:1px solid rgba(255,255,255,.3);box-shadow:inset 0 1px 0 rgba(255,255,255,.4);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease}
.glass .gbtn2:hover{transform:translateY(-1px);border-color:rgba(255,255,255,.48);box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 4px 12px rgba(2,16,26,.28)}
.glass .gbtn2:active{transform:scale(.97);transition-duration:.08s}
.glass .gbtn2.primary{color:#0d2b1c;background:linear-gradient(160deg,#d9ff7a,#c3f23e);border-color:rgba(217,255,122,.7);box-shadow:0 3px 10px rgba(205,255,78,.3),inset 0 1px 0 rgba(255,255,255,.6)}
.glass .gbtn2.quiet{background:transparent;border-color:transparent;box-shadow:none}
.glass .gbtn2.quiet:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2)}
.glass .gbtn2[disabled]{opacity:.45;pointer-events:none}
.glass.light .gbtn2{color:#0c2836;background:linear-gradient(160deg,#fff,rgba(255,255,255,.7));border-color:rgba(4,40,56,.2);box-shadow:inset 0 1px 0 #fff}
.glass.light .gbtn2:hover{border-color:rgba(4,40,56,.34);box-shadow:inset 0 1px 0 #fff,0 4px 12px rgba(23,48,62,.14)}
.glass.light .gbtn2.primary{color:#0d2b1c;background:linear-gradient(160deg,#d9ff7a,#c3f23e);border-color:rgba(122,168,28,.6)}
.glass.light .gbtn2.quiet{background:transparent;border-color:transparent;box-shadow:none}
.glass.light .gbtn2.quiet:hover{background:rgba(4,40,56,.06)}
.glass .gbtn2:focus-visible,.glass .tabs [role=tab]:focus-visible,.glass .sidenav a:focus-visible,.glass .gtable th:focus-visible,
.glass .chk:focus-visible,.glass .radio:focus-visible,.glass .gsearch input:focus-visible,.glass .pager button:focus-visible,
.glass .acc summary:focus-visible,.glass .menu [role=menuitem]:focus-visible,.glass .holdbtn:focus-visible,.glass .slider input:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:2px}
.glass .gbtn2:focus:not(:focus-visible),.glass .tabs [role=tab]:focus:not(:focus-visible){outline:none}

/* ——— Tabs: a hairline indicator glides between labels; panels crossfade ——— */
.tabs{position:relative;display:flex;gap:2px;padding:3px;border-radius:12px;width:fit-content;max-width:100%;
  background:linear-gradient(160deg,rgba(255,255,255,.1),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.22);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),inset 0 -1px 0 rgba(160,220,235,.08);-webkit-backdrop-filter:blur(12px) saturate(1.4);backdrop-filter:blur(12px) saturate(1.4)}
.tabs [role=tab]{position:relative;z-index:1;padding:8px 15px;border-radius:9px;border:0;background:transparent;cursor:pointer;white-space:nowrap;
  font:600 15px var(--w-font);color:var(--w-dim);transition:color .14s ease,transform .1s ease}
.tabs [role=tab]:active{transform:scale(.97)}
.tabs [role=tab]:hover{color:var(--w-ink)}
.tabs [role=tab][aria-selected=true]{color:var(--w-ink)}
.tabs .tabline{position:absolute;top:3px;bottom:3px;left:3px;width:0;border-radius:9px;z-index:0;
  background:linear-gradient(160deg,rgba(255,255,255,.28),rgba(255,255,255,.1));border:1px solid rgba(255,255,255,.4);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 -1px 0 rgba(160,220,235,.14),0 3px 10px rgba(2,16,26,.3);
  transition:left .24s var(--lg-snap),width .24s var(--lg-snap)}
.tabpanels{position:relative;margin-top:12px}
.tabpanels [role=tabpanel]{display:none}
.tabpanels [role=tabpanel].on{display:block;animation:cellin .3s var(--lg-spring) backwards}
.glass.light .tabs{background:linear-gradient(160deg,rgba(255,255,255,.7),rgba(255,255,255,.4));border-color:rgba(4,40,56,.16);box-shadow:inset 0 1px 0 #fff}
.glass.light .tabs .tabline{background:linear-gradient(160deg,#fff,rgba(255,255,255,.75));border-color:rgba(4,40,56,.18);box-shadow:inset 0 1px 0 #fff,0 2px 6px rgba(23,48,62,.1)}

/* ——— Sidebar nav: an active pill that glides; collapses to icons ——— */
.sidenav{position:relative;display:flex;flex-direction:column;gap:2px;width:208px;padding:6px;border-radius:16px;
  background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.2);
  transition:width .28s var(--lg-snap)}
.sidenav.collapsed{width:54px}
.sidenav a{position:relative;z-index:1;display:flex;align-items:center;gap:11px;height:40px;padding:0 10px;border-radius:10px;
  color:var(--w-dim);text-decoration:none;font:600 15px var(--w-font);white-space:nowrap;overflow:hidden;cursor:pointer;transition:color .12s ease,transform .1s ease}
.sidenav a:active{transform:scale(.985)}
.sidenav a:hover,.sidenav a.on{color:var(--w-ink)}
.sidenav a .lab{transition:opacity .2s ease}
.sidenav.collapsed a .lab{opacity:0}
.sidenav a .cnt{margin-left:auto;font:700 13px var(--w-font);color:var(--w-dim);background:rgba(255,255,255,.1);border-radius:99px;padding:2px 7px}
.sidenav .navpill{position:absolute;left:6px;right:6px;top:0;height:40px;border-radius:10px;z-index:0;opacity:0;
  background:linear-gradient(160deg,rgba(30,157,184,.45),rgba(30,157,184,.2));border:1px solid rgba(107,197,214,.45);box-shadow:inset 0 1px 0 rgba(255,255,255,.28);
  transition:top .24s var(--lg-snap),opacity .16s ease}
.sidenav .navpill.on{opacity:1}
.sidenav .navhead{font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--w-dim);padding:11px 10px 5px;white-space:nowrap;overflow:hidden;transition:opacity .2s}
.sidenav.collapsed .navhead{opacity:0}
.glass.light .sidenav{background:linear-gradient(160deg,#fff,rgba(255,255,255,.7));border-color:rgba(4,40,56,.14);box-shadow:inset 0 1px 0 #fff}
.glass.light .sidenav a.on,.glass.light .sidenav a:hover{color:#0c2836}
.glass.light .sidenav .navpill{background:linear-gradient(160deg,rgba(30,157,184,.28),rgba(30,157,184,.12));border-color:rgba(30,157,184,.4)}
.glass.light .sidenav a .cnt{background:rgba(4,40,56,.08)}

/* ——— Status pill ——— */
/* a status is a DOT and a WORD — never a capsule (console RULES §3 · §11; the 2026-09-14 owed list,
   closed 2026-09-15: thirteen `priced` pills in one column of Spend › Models) */
.status{display:inline-flex;align-items:center;gap:7px;height:26px;padding:0;font:600 15px var(--w-font);letter-spacing:.02em;color:var(--w-ink)}
.status i{width:6px;height:6px;border-radius:50%;background:var(--w-dim);flex:none}
.status.ok i{background:var(--w-green);box-shadow:0 0 6px rgba(95,227,161,.7)}
.status.warn i{background:var(--w-amber);box-shadow:0 0 6px rgba(242,193,78,.7)}
.status.err i{background:#ff7a8a;box-shadow:0 0 6px rgba(255,122,138,.7)}
.status.info i{background:#6bc5d6;box-shadow:0 0 6px rgba(107,197,214,.7)}
.status.live i{animation:pulse 2.6s ease-in-out infinite}
.glass.light .status{color:#0c2836}
.glass.light .status.ok i{background:#1d7d4f;box-shadow:none}.glass.light .status.warn i{background:#9a6b00;box-shadow:none}
.glass.light .status.err i{background:#c8384c;box-shadow:none}.glass.light .status.info i{background:#0f7d95;box-shadow:none}

/* ——— read check + chevron, standalone (the notice's own rules still apply inside a notice) ——— */
.glass .nread.on{background:linear-gradient(160deg,rgba(95,227,161,.35),rgba(95,227,161,.15));border-color:rgba(95,227,161,.5)}
.glass .nread.on svg{stroke:var(--w-green)}
.glass .nread.on svg path{animation:draw .35s ease}
.glass .nchev.open{transform:rotate(180deg)}
.glass .nread:hover{border-color:rgba(255,255,255,.4)}

/* ——— Kbd + breadcrumb ——— */
.kbd{display:inline-flex;align-items:center;height:24px;padding:0 7px;border-radius:6px;font:600 13px var(--w-font);letter-spacing:.04em;color:var(--w-ink);
  background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.26);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 1px 0 rgba(0,10,16,.35)}
.glass.light .kbd{color:#0c2836;background:linear-gradient(180deg,#fff,#eef4f7);border-color:rgba(4,40,56,.22);box-shadow:inset 0 1px 0 #fff,0 1px 0 rgba(23,48,62,.18)}
.crumbs{display:flex;align-items:center;gap:9px;font:500 15px/20px var(--w-font);color:var(--w-dim)}
.crumbs .crumb,.crumbs .ancestor{min-width:0;color:var(--w-dim);text-decoration:none;padding:3px 2px;border:0;border-radius:7px;background:transparent;
  font:inherit;line-height:inherit;white-space:nowrap;transition:color .18s ease,background .18s ease}
.crumbs button.crumb{cursor:pointer}
/* a GROUP crumb (Observe · Govern · Policy · Knowledge) names a section, not a page: it is plain
   text and it must LOOK plain — no pointer, no hover, nothing that promises a destination it does
   not have (Sam, 2026-09-15: "just be more cognizant of what those buttons do") */
.crumbs .group{cursor:default}
/* an ancestor answers hover with COLOUR only — a fill under every crumb turns the trail into a row
   of chips, and the fill is what marks the page you are on */
.crumbs a.crumb:hover,.crumbs button.crumb:hover,.crumbs a.ancestor:hover{color:var(--w-ink)}
.crumbs a.crumb:focus-visible,.crumbs button.crumb:focus-visible,.crumbs a.ancestor:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:1px;color:var(--w-ink)}
/* the current page is the loudest thing in the trail (Vadim, 2026-09-14: "Current page should be
   highlighted"): ink, weight 600 and a soft filled highlight. Background only, radius 7 — a
   navigation highlight, not a data pill (RULES §11). */
.crumbs .cur{color:var(--w-ink);font-weight:600;padding:3px 8px;border-radius:7px;background:rgba(255,255,255,.15)}
.crumbs .crhome{display:inline-flex;align-items:center;padding:3px 4px}
/* the separator is the trail's grammar — an unmistakable ">", sized to the word beside it and
   muted (same feedback). It was an 11 px box painting nothing until 2026-09-14; nav.js says why. */
/* stroke 1.7, not 2: the trail's glyphs sit beside a 1.6-stroke sidebar and 1.7-stroke bar controls,
   and the home mark at 18/2 was visibly heavier than the trail it heads (icon census, 2026-09-15) */
.crumbs svg{width:14px;height:14px;flex:none;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;opacity:.65}
.crumbs .crhome svg{width:16px;height:16px;opacity:.85}
.glass.light .crumbs .cur,.glass.light .crumbs a.crumb:hover,.glass.light .crumbs button.crumb:hover,.glass.light .crumbs a.ancestor:hover{color:#0c2836}
/* the highlight has to be SEEN in light too: at .08 it measured 1.20:1 against the page head, so the
   box Vadim asked for was there in dark and effectively absent in light. .24 measures ≥1.5:1 on the
   head in both schemes and still carries #0c2836 at 8:1 (2026-09-15). */
.glass.light .crumbs .cur{background:rgba(4,40,56,.24)}
.glass.light .crumbs svg{opacity:.55}
.glass.light .crumbs .crhome svg{opacity:.8}

/* ——— Data table ——— */
.gtable{width:100%;border-collapse:separate;border-spacing:0;font:500 15px var(--w-font);color:var(--w-ink);
  border-radius:14px;overflow:hidden;background:linear-gradient(160deg,rgba(255,255,255,.08),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.14)}
/* a header is 12.5 px now, and the tracking comes DOWN to .06em as it grows: uppercase at .12em on
   a bigger word eats the column width the cell under it needs (Astra's read, 2026-09-15) */
.gtable th{position:sticky;top:0;z-index:1;text-align:left;font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--w-dim);
  padding:11px 12px;background:rgba(6,30,42,.85);border-bottom:1px solid rgba(255,255,255,.14);cursor:pointer;user-select:none;white-space:nowrap;transition:color .18s ease}
.gtable th:hover,.gtable th[aria-sort]{color:var(--w-ink)}
.gtable th .sortico{display:inline-block;width:12px;height:12px;margin-left:5px;vertical-align:-1px;opacity:0;transition:opacity .18s ease,transform .3s var(--lg-spring)}
.gtable th .sortico svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.gtable th[aria-sort] .sortico{opacity:1}
.gtable th[aria-sort=descending] .sortico{transform:rotate(180deg)}
.gtable td{padding:11px 12px;border-bottom:1px solid rgba(255,255,255,.07);font-variant-numeric:tabular-nums;transition:background .18s ease}
.gtable tr:last-child td{border-bottom:0}
.gtable tbody tr{cursor:default}
.gtable tbody tr:hover td{background:rgba(255,255,255,.05)}
.gtable tbody tr.sel td{background:rgba(30,157,184,.16)}
.gtable td.num{text-align:right}
.gtable .dimc{color:var(--w-dim)}
.gtable tbody tr{animation:cellin .3s var(--lg-spring) backwards}
.gtable tbody tr:nth-child(2){animation-delay:.04s}.gtable tbody tr:nth-child(3){animation-delay:.08s}.gtable tbody tr:nth-child(4){animation-delay:.12s}.gtable tbody tr:nth-child(5){animation-delay:.16s}.gtable tbody tr:nth-child(6){animation-delay:.2s}
.glass.light .gtable{color:#0c2836;background:linear-gradient(160deg,#fff,rgba(255,255,255,.8));border-color:rgba(4,40,56,.14)}
.glass.light .gtable th{background:rgba(238,244,247,.95);border-bottom-color:rgba(4,40,56,.12)}
.glass.light .gtable th:hover,.glass.light .gtable th[aria-sort]{color:#0c2836}
.glass.light .gtable td{border-bottom-color:rgba(4,40,56,.08)}
.glass.light .gtable tbody tr:hover td{background:rgba(4,40,56,.04)}
.glass.light .gtable tbody tr.sel td{background:rgba(30,157,184,.12)}

/* ——— Checkbox + radio: the check draws, the dot pops ——— */
.chk,.radio{display:inline-flex;align-items:center;gap:8px;cursor:pointer;font:500 15px var(--w-font);color:var(--w-ink);user-select:none}
.chk i,.radio i{position:relative;width:18px;height:18px;flex:none;border-radius:5px;
  background:linear-gradient(160deg,rgba(255,255,255,.14),rgba(255,255,255,.05));border:1px solid rgba(255,255,255,.32);box-shadow:inset 0 1px 0 rgba(255,255,255,.3);
  transition:background .2s ease,border-color .2s ease,transform .14s ease}
.radio i{border-radius:50%}
.chk:hover i,.radio:hover i{border-color:rgba(255,255,255,.5)}
.chk:active i,.radio:active i{transform:scale(.92);transition-duration:.08s}
.chk i svg{position:absolute;inset:3px;width:12px;height:12px;stroke:#0d2b1c;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:20;stroke-dashoffset:20;transition:stroke-dashoffset .22s ease}
.chk.on i{background:linear-gradient(160deg,#d9ff7a,#c3f23e);border-color:rgba(217,255,122,.8)}
.chk.on i svg{stroke-dashoffset:0}
.radio i::after{content:"";position:absolute;inset:4px;border-radius:50%;background:linear-gradient(160deg,#d9ff7a,#c3f23e);transform:scale(0);transition:transform .2s var(--lg-snap)}
.radio.on i{border-color:rgba(217,255,122,.8)}
.radio.on i::after{transform:scale(1)}
.glass.light .chk,.glass.light .radio{color:#0c2836}
.glass.light .chk i,.glass.light .radio i{background:linear-gradient(160deg,#fff,rgba(255,255,255,.7));border-color:rgba(4,40,56,.28);box-shadow:inset 0 1px 0 #fff}
.glass.light .chk.on i{background:linear-gradient(160deg,#d9ff7a,#c3f23e);border-color:rgba(122,168,28,.7)}

/* ——— Search field ——— */
.gsearch{position:relative;display:flex;align-items:center;gap:8px;height:40px;padding:0 10px 0 12px;border-radius:12px;
  background:linear-gradient(160deg,rgba(255,255,255,.1),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.22);
  transition:border-color .2s ease,box-shadow .25s ease}
.gsearch:focus-within{border-color:rgba(107,197,214,.7);box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 0 0 3px rgba(107,197,214,.18)}
.gsearch .gicon{color:var(--w-dim)}
.gsearch input{flex:1;min-width:0;background:transparent;border:0;outline:none;color:var(--w-ink);font:500 15px var(--w-font)}
.gsearch input::placeholder{color:var(--w-dim)}
.gsearch .clr{width:22px;height:22px;border-radius:99px;border:0;display:grid;place-items:center;cursor:pointer;color:var(--w-dim);background:rgba(255,255,255,.1);
  opacity:0;transform:scale(.7);transition:opacity .18s ease,transform .22s var(--lg-pop),background .18s ease;pointer-events:none}
.gsearch.has .clr{opacity:1;transform:scale(1);pointer-events:auto}
.gsearch .clr:hover{background:rgba(255,255,255,.2);color:var(--w-ink)}
.gsearch .clr svg{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round}
.gsearch .kbd{margin-left:2px}
.glass.light .gsearch{background:linear-gradient(160deg,#fff,rgba(255,255,255,.75));border-color:rgba(4,40,56,.2);box-shadow:inset 0 1px 0 #fff}
.glass.light .gsearch input{color:#0c2836}.glass.light .gsearch .clr{background:rgba(4,40,56,.08);color:#3f5d6c}

/* ——— Progress bar + ring ——— */
.pbar{position:relative;height:8px;border-radius:99px;overflow:hidden;background:rgba(255,255,255,.1);box-shadow:inset 0 1px 2px rgba(0,10,16,.3)}
.pbar i{position:absolute;inset:0;right:auto;width:0;border-radius:99px;background:linear-gradient(90deg,#1E9DB8,#2ec8e8 60%,#d9ff7a);transition:width .6s var(--lg-spring)}
.pbar.busy i{background:linear-gradient(90deg,rgba(46,200,232,.2),#2ec8e8 50%,rgba(46,200,232,.2));background-size:200% 100%;width:100%;animation:pbusy 1.4s linear infinite}
@keyframes pbusy{from{background-position:200% 0}to{background-position:-200% 0}}
.pring{position:relative;width:64px;height:64px;display:grid;place-items:center}
.pring svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.pring circle{fill:none;stroke-width:5;stroke-linecap:round}
.pring .track{stroke:rgba(255,255,255,.12)}
.pring .arc{stroke:url(#pringGrad);stroke-dasharray:100;stroke-dashoffset:100;transition:stroke-dashoffset .8s var(--lg-spring)}
.pring .val{position:relative;font:700 18px var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-ink)}
.glass.light .pbar{background:rgba(4,40,56,.1);box-shadow:inset 0 1px 2px rgba(23,48,62,.15)}
.glass.light .pring .track{stroke:rgba(4,40,56,.12)}.glass.light .pring .val{color:#0c2836}

/* ——— Skeleton shimmer ——— */
.skel{display:block;border-radius:8px;background:rgba(255,255,255,.08);position:relative;overflow:hidden}
.skel::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.12),transparent);transform:translateX(-100%);animation:shimmer 1.4s ease-in-out infinite}
@keyframes shimmer{to{transform:translateX(100%)}}
.skel.line{height:11px}.skel.title{height:15px;width:55%}.skel.circle{width:34px;height:34px;border-radius:50%}
.glass.light .skel{background:rgba(4,40,56,.08)}.glass.light .skel::after{background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent)}

/* ——— Empty state ——— */
.empty{display:flex;flex-direction:column;align-items:center;gap:8px;padding:26px 18px;text-align:center;border-radius:16px;border:1px dashed rgba(255,255,255,.18)}
.empty .eico{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;color:var(--w-dim);
  background:linear-gradient(160deg,rgba(255,255,255,.12),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.2)}
.empty .eico svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round}
.empty .et{font:600 16px var(--w-font);color:var(--w-ink)}
.empty .es{font:400 15px var(--w-font);color:var(--w-soft);max-width:34ch}
.glass.light .empty{border-color:rgba(4,40,56,.2)}.glass.light .empty .et{color:#0c2836}.glass.light .empty .eico{background:#fff;border-color:rgba(4,40,56,.16);color:#3f5d6c}

/* ——— Pagination ——— */
.pager{display:inline-flex;align-items:center;gap:4px}
.pager button{height:33px;min-width:33px;padding:0 10px;border-radius:9px;border:1px solid transparent;background:transparent;cursor:pointer;
  font:600 15px var(--w-font);color:var(--w-dim);transition:color .18s ease,background .18s ease,border-color .18s ease,transform .14s ease}
.pager button:hover{color:var(--w-ink);background:rgba(255,255,255,.08)}
.pager button:active{transform:scale(.94);transition-duration:.08s}
.pager button.on{color:var(--w-ink);background:linear-gradient(160deg,rgba(30,157,184,.45),rgba(30,157,184,.2));border-color:rgba(107,197,214,.45)}
.pager button[disabled]{opacity:.35;pointer-events:none}
.pager button svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.glass.light .pager button:hover{color:#0c2836;background:rgba(4,40,56,.06)}
.glass.light .pager button.on{color:#0c2836;background:linear-gradient(160deg,rgba(30,157,184,.28),rgba(30,157,184,.12));border-color:rgba(30,157,184,.4)}

@media (prefers-reduced-motion:reduce){
  .tabs .tabline,.sidenav,.sidenav .navpill,.pbar i,.pring .arc,.chk i svg,.radio i::after,.step .sc,.step .sc svg,.step::before{transition:none}
  .tabpanels [role=tabpanel].on,.gtable tbody tr,.pbar.busy i,.skel::after,.status.live i,.lq .wave,.ticker .live{animation:none}   /* .lq .wave + .ticker .live: kit audit 2026-09-06 */
}

/* ═══════════════════════ batch 2: feedback + overlays ═══════════════════════ */

/* ——— Toast stack: bottom-right, slides in, progress hairline, hover pauses ——— */
.toasts{position:fixed;right:18px;bottom:18px;z-index:60;display:flex;flex-direction:column;gap:8px;width:min(340px,calc(100vw - 36px));pointer-events:none}
.toast{position:relative;overflow:hidden;pointer-events:auto;display:flex;gap:10px;align-items:flex-start;padding:11px 12px 12px;border-radius:14px;
  color:var(--w-ink);background:linear-gradient(160deg,rgba(9,36,50,.92),rgba(6,28,40,.9));
  -webkit-backdrop-filter:blur(18px) saturate(1.6);backdrop-filter:blur(18px) saturate(1.6);
  border:1px solid rgba(255,255,255,.22);box-shadow:0 10px 30px rgba(2,16,26,.45),inset 0 1px 0 rgba(255,255,255,.3);
  transform:translateX(24px);opacity:0;transition:transform .34s var(--lg-spring),opacity .22s ease}
.toast.in{transform:none;opacity:1}
.toast.out{transform:translateX(24px);opacity:0;transition:transform .2s var(--lg-out),opacity .18s ease}
.toast .nd{width:8px;height:8px;border-radius:50%;flex:none;margin-top:5px;background:#6bc5d6;box-shadow:0 0 8px rgba(107,197,214,.7)}
.toast.ok .nd{background:var(--w-green);box-shadow:0 0 8px rgba(95,227,161,.7)}
.toast.warn .nd{background:var(--w-amber);box-shadow:0 0 8px rgba(242,193,78,.7)}
.toast.err .nd{background:#ff7a8a;box-shadow:0 0 8px rgba(255,122,138,.7)}
.toast .tt{font:600 15px var(--w-font)}
.toast .ts{font:400 15px var(--w-font);color:var(--w-soft);margin-top:1px}
.toast .tx{margin-left:auto;width:24px;height:24px;border-radius:99px;border:0;background:rgba(255,255,255,.08);color:var(--w-dim);display:grid;place-items:center;cursor:pointer;flex:none;transition:background .18s ease,color .18s ease}
.toast .tx:hover{background:rgba(255,255,255,.18);color:var(--w-ink)}
.toast .tx svg{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round}
.toast .tbar{position:absolute;left:0;bottom:0;height:2px;width:100%;transform-origin:left;background:linear-gradient(90deg,#1E9DB8,#2ec8e8 60%,#d9ff7a);transform:scaleX(1);transition:transform linear}
.toast.hold .tbar{transition-duration:0s!important}
.glass.light .toast{color:#0c2836;background:linear-gradient(160deg,rgba(255,255,255,.96),rgba(244,248,251,.94));border-color:rgba(4,40,56,.18);box-shadow:0 10px 30px rgba(23,48,62,.2),inset 0 1px 0 #fff}
.glass.light .toast .tx{background:rgba(4,40,56,.07);color:#3f5d6c}

/* ——— Sheet: a glass panel over a dimmed, blurred ground; from the right or the centre ——— */
.sheetwrap{position:fixed;inset:0;z-index:50;display:none}
.sheetwrap.on{display:block}
.sheetwrap .scrim{position:absolute;inset:0;background:rgba(2,16,26,.45);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;transition:opacity .28s ease}
.sheetwrap.in .scrim{opacity:1}
.sheet{position:absolute;top:0;right:0;bottom:0;width:min(420px,92vw);padding:20px 20px 18px;overflow:auto;color:var(--w-ink);
  background:linear-gradient(165deg,rgba(9,36,50,.96),rgba(5,26,38,.96));border-left:1px solid rgba(255,255,255,.18);box-shadow:-16px 0 40px rgba(2,16,26,.5),inset 1px 0 0 rgba(255,255,255,.2);
  transform:translateX(100%);opacity:1;transition:transform .36s var(--lg-spring),opacity .22s ease}
.sheetwrap.in .sheet{transform:none}
.sheetwrap.out .sheet{transform:translateX(100%);transition:transform .22s var(--lg-out),opacity .16s ease}
.sheet.center{top:50%;left:50%;right:auto;bottom:auto;width:min(460px,92vw);max-height:80vh;border-radius:20px;border:1px solid rgba(255,255,255,.22);
  box-shadow:0 24px 60px rgba(2,16,26,.55),inset 0 1px 0 rgba(255,255,255,.3);transform:translate(-50%,-46%) scale(.96);opacity:0;transition:transform .36s var(--lg-spring),opacity .22s ease}
.sheetwrap.in .sheet.center{transform:translate(-50%,-50%) scale(1);opacity:1}
.sheetwrap.out .sheet.center{transform:translate(-50%,-46%) scale(.96);opacity:0;transition:transform .2s var(--lg-out),opacity .16s ease}
.sheet .sh{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.sheet .sh .st{font:600 18px var(--font)}
.sheet .sh .tx{margin-left:auto;width:28px;height:28px;border-radius:99px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);color:var(--w-dim);display:grid;place-items:center;cursor:pointer}
.sheet .sh .tx svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round}
.sheet .sb{font:400 15px var(--w-font);color:var(--w-soft);line-height:1.55}
.sheet .sf{display:flex;gap:8px;justify-content:flex-end;margin-top:16px}
.glass.light .sheetwrap .scrim{background:rgba(23,48,62,.28)}
.glass.light .sheet{color:#0c2836;background:linear-gradient(165deg,#fff,#f2f7fa);border-color:rgba(4,40,56,.18);box-shadow:-16px 0 40px rgba(23,48,62,.22)}
.glass.light .sheet .sh .tx{border-color:rgba(4,40,56,.18);background:rgba(4,40,56,.05);color:#3f5d6c}

/* ——— Dropdown menu: anchored, keyboard-walkable ——— */
.menuwrap{position:relative;display:inline-flex;align-items:center;vertical-align:top}
.menu{position:absolute;top:calc(100% + 6px);left:0;min-width:200px;padding:5px;border-radius:13px;z-index:40;
  background:linear-gradient(160deg,rgba(9,36,50,.96),rgba(6,28,40,.95));-webkit-backdrop-filter:blur(16px) saturate(1.6);backdrop-filter:blur(16px) saturate(1.6);
  border:1px solid rgba(255,255,255,.22);box-shadow:0 12px 30px rgba(2,16,26,.5),inset 0 1px 0 rgba(255,255,255,.3);
  opacity:0;transform:translateY(-4px) scale(.98);transform-origin:top left;pointer-events:none;transition:opacity .14s ease,transform .2s var(--lg-snap)}
.menu.on{opacity:1;transform:none;pointer-events:auto}
.menu.right{left:auto;right:0;transform-origin:top right}
.menu [role=menuitem]{display:flex;align-items:center;gap:9px;height:38px;padding:0 11px;border-radius:9px;cursor:pointer;color:var(--w-ink);font:500 15px var(--w-font);
  transition:background .14s ease}
.menu [role=menuitem]:hover,.menu [role=menuitem].hl{background:rgba(255,255,255,.1)}
.menu [role=menuitem].danger{color:#ff9aa6}
.menu [role=menuitem] .kbd{margin-left:auto;height:22px;font-size:13px}
.menu .msep{height:1px;margin:5px 6px;background:rgba(255,255,255,.12)}
/* a menu's section heading is a caption, but 12.5 is the floor for every caption on a console
   surface — only the sidebar's group caption is allowed under it (Sam, 2026-09-15) */
.menu .mhead{font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--w-dim);padding:8px 11px 4px}
.glass.light .menu{background:linear-gradient(160deg,#fff,#f4f8fb);border-color:rgba(4,40,56,.18);box-shadow:0 12px 30px rgba(23,48,62,.2),inset 0 1px 0 #fff}
.glass.light .menu [role=menuitem]{color:#0c2836}.glass.light .menu [role=menuitem]:hover,.glass.light .menu [role=menuitem].hl{background:rgba(4,40,56,.06)}
.glass.light .menu [role=menuitem].danger{color:#c8384c}.glass.light .menu .msep{background:rgba(4,40,56,.1)}

/* ——— Tooltip: data-tip, shows after a pause on hover or focus ——— */
.tip{position:fixed;z-index:70;padding:7px 10px;border-radius:9px;max-width:260px;pointer-events:none;
  font:500 13px/1.45 var(--w-font);color:#fff;background:rgba(6,28,40,.96);border:1px solid rgba(255,255,255,.2);box-shadow:0 8px 20px rgba(2,16,26,.4);
  opacity:0;transform:translateY(3px);transition:opacity .14s ease,transform .18s var(--lg-snap)}
.tip.on{opacity:1;transform:none}
.glass.light .tip{color:#fff;background:rgba(12,40,54,.96)}

/* ——— Command palette ——— */
.palettewrap{position:fixed;inset:0;z-index:55;display:none}
.palettewrap.on{display:block}
.palettewrap .scrim{position:absolute;inset:0;background:rgba(2,16,26,.4);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);opacity:0;transition:opacity .22s ease}
.palettewrap.in .scrim{opacity:1}
.palette{position:absolute;left:50%;top:14vh;width:min(560px,92vw);transform:translate(-50%,-8px) scale(.98);opacity:0;border-radius:18px;overflow:hidden;color:var(--w-ink);
  background:linear-gradient(165deg,rgba(9,36,50,.97),rgba(5,26,38,.96));border:1px solid rgba(255,255,255,.22);box-shadow:0 30px 70px rgba(2,16,26,.6),inset 0 1px 0 rgba(255,255,255,.3);
  transition:transform .3s var(--lg-spring),opacity .2s ease}
.palettewrap.in .palette{transform:translate(-50%,0) scale(1);opacity:1}
.palettewrap.out .palette{transform:translate(-50%,-8px) scale(.98);opacity:0;transition:transform .18s var(--lg-out),opacity .15s ease}
.palette .pin{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid rgba(255,255,255,.12)}
.palette .pin .gicon{color:var(--w-dim)}
.palette .pin input{flex:1;background:transparent;border:0;outline:none;color:var(--w-ink);font:500 16px var(--w-font)}
.palette .pin input::placeholder{color:var(--w-dim)}
.palette .plist{max-height:min(46vh,380px);overflow:auto;padding:6px}
.palette .pgroup{font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--w-dim);padding:8px 10px 4px}
.palette .pitem{display:flex;align-items:center;gap:10px;height:39px;padding:0 10px;border-radius:10px;cursor:pointer;color:var(--w-ink);font:500 15px var(--w-font);transition:background .14s ease}
.palette .pitem .gicon{color:var(--w-dim)}
.palette .pitem .ph{margin-left:auto;display:flex;gap:4px}
.palette .pitem.hl{background:rgba(30,157,184,.22)}
.palette .pitem mark{background:transparent;color:#d9ff7a;font-weight:700}
.palette .pfoot{display:flex;gap:14px;padding:8px 14px;border-top:1px solid rgba(255,255,255,.12);font:500 13px var(--w-font);color:var(--w-dim)}
.palette .pfoot span{display:inline-flex;align-items:center;gap:5px}
.palette .pempty{padding:22px;text-align:center;font:500 15px var(--w-font);color:var(--w-soft)}
.glass.light .palettewrap .scrim{background:rgba(23,48,62,.25)}
.glass.light .palette{color:#0c2836;background:linear-gradient(165deg,#fff,#f2f7fa);border-color:rgba(4,40,56,.18);box-shadow:0 30px 70px rgba(23,48,62,.28),inset 0 1px 0 #fff}
.glass.light .palette .pin{border-bottom-color:rgba(4,40,56,.1)}.glass.light .palette .pin input{color:#0c2836}
.glass.light .palette .pitem{color:#0c2836}.glass.light .palette .pitem.hl{background:rgba(30,157,184,.16)}.glass.light .palette .pitem mark{color:#5c8f0e}
.glass.light .palette .pfoot{border-top-color:rgba(4,40,56,.1)}

/* ——— Accordion: grid-rows 0fr→1fr, the honest height animation ——— */
.acc{display:flex;flex-direction:column;gap:6px}
.acc details{border-radius:13px;background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.2);overflow:hidden}
.acc summary{list-style:none;display:flex;align-items:center;gap:10px;padding:12px 13px;cursor:pointer;font:600 15px var(--w-font);color:var(--w-ink);user-select:none}
.acc summary::-webkit-details-marker{display:none}
.acc summary .nchev{margin-left:auto}
.acc details[open] summary .nchev{transform:rotate(180deg)}
.acc .abody{display:grid;grid-template-rows:0fr;transition:grid-template-rows .32s var(--lg-spring)}
.acc details[open] .abody{grid-template-rows:1fr}
.acc .abody>div{overflow:hidden;padding:0 13px;font:400 15px/1.55 var(--w-font);color:var(--w-soft)}
.acc details[open] .abody>div{padding-bottom:12px}
.glass.light .acc details{background:linear-gradient(160deg,#fff,rgba(255,255,255,.75));border-color:rgba(4,40,56,.14);box-shadow:inset 0 1px 0 #fff}
.glass.light .acc summary{color:#0c2836}

@media (prefers-reduced-motion:reduce){
  .toast,.toast.out,.sheetwrap .scrim,.sheet,.sheet.center,.sheetwrap.out .sheet,.menu,.tip,.palettewrap .scrim,.palette,.palettewrap.out .palette,.acc .abody{transition:none}
}

/* ═══════════════════════ batch 3: actions, time, streams ═══════════════════════ */

/* ——— Hold-to-confirm: press and hold; a ring fills; release early cancels ——— */
.holdbtn{position:relative;display:inline-flex;align-items:center;gap:9px;height:42px;padding:0 18px 0 14px;border-radius:99px;cursor:pointer;user-select:none;
  font:600 15px var(--w-font);color:#ffb3bd;background:linear-gradient(160deg,rgba(255,122,138,.16),rgba(255,122,138,.06));
  border:1px solid rgba(255,122,138,.45);box-shadow:inset 0 1px 0 rgba(255,255,255,.2);transition:transform .14s ease,background .2s ease,border-color .2s ease}
.holdbtn:hover{border-color:rgba(255,122,138,.7)}
.holdbtn.disabled,.holdbtn[aria-disabled=true]{opacity:.42;cursor:not-allowed;box-shadow:none}
.holdbtn.disabled:hover,.holdbtn[aria-disabled=true]:hover{border-color:rgba(255,122,138,.45)}
.holdbtn.holding{transform:scale(.98);transition-duration:.08s}
.holdbtn .ring{position:relative;width:22px;height:22px;flex:none}
.holdbtn .ring svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.holdbtn .ring circle{fill:none;stroke-width:2.6;stroke-linecap:round}
.holdbtn .ring .rt{stroke:rgba(255,122,138,.28)}
.holdbtn .ring .rf{stroke:#ff7a8a;stroke-dasharray:100;stroke-dashoffset:100;transition:stroke-dashoffset .2s var(--lg-out)}
.holdbtn.holding .ring .rf{transition:stroke-dashoffset var(--hold,900ms) linear;stroke-dashoffset:0}
.holdbtn.done{color:#0d2b1c;background:linear-gradient(160deg,#ff9aa6,#ff7a8a);border-color:rgba(255,122,138,.9)}
.holdbtn.done .ring .rt,.holdbtn.done .ring .rf{stroke:#3a1017}
.holdbtn .hl2{transition:opacity .15s ease}
.glass.light .holdbtn{color:#a52434;background:linear-gradient(160deg,rgba(255,122,138,.14),rgba(255,122,138,.05));border-color:rgba(200,56,76,.45)}
.glass.light .holdbtn.done{color:#fff;background:linear-gradient(160deg,#e05467,#c8384c)}
.glass.light .holdbtn.done .ring .rt,.glass.light .holdbtn.done .ring .rf{stroke:#fff}

/* ——— Timeline / event log: dots on a rail, new items enter at the top ——— */
.timeline{position:relative;display:flex;flex-direction:column;gap:0;padding-left:22px}
.timeline::before{content:"";position:absolute;left:7px;top:8px;bottom:8px;width:2px;border-radius:2px;background:linear-gradient(180deg,rgba(107,197,214,.55),rgba(107,197,214,.08))}
.tl{position:relative;padding:6px 0 10px 8px;animation:cellin .34s var(--lg-spring) backwards}
.tl .td{position:absolute;left:-19px;top:11px;width:9px;height:9px;border-radius:50%;background:#6bc5d6;box-shadow:0 0 0 3px rgba(6,28,40,1),0 0 8px rgba(107,197,214,.6)}
.tl.ok .td{background:var(--w-green);box-shadow:0 0 0 3px rgba(6,28,40,1),0 0 8px rgba(95,227,161,.6)}
.tl.warn .td{background:var(--w-amber);box-shadow:0 0 0 3px rgba(6,28,40,1),0 0 8px rgba(242,193,78,.6)}
.tl.err .td{background:#ff7a8a;box-shadow:0 0 0 3px rgba(6,28,40,1),0 0 8px rgba(255,122,138,.6)}
.tl .tt{font:600 15px var(--w-font);color:var(--w-ink)}
.tl .ts{font:400 15px var(--w-font);color:var(--w-soft);margin-top:1px}
.tl .tw{position:absolute;right:0;top:7px;font:500 13px var(--w-font);color:var(--w-dim);font-variant-numeric:tabular-nums}
.tl .tt .mnr{font:600 13px var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-dim);margin-left:6px}
.glass.light .timeline::before{background:linear-gradient(180deg,rgba(15,125,149,.5),rgba(15,125,149,.08))}
.glass.light .tl .td{box-shadow:0 0 0 3px #f7fbfd}
.glass.light .tl.ok .td{background:#1d7d4f;box-shadow:0 0 0 3px #f7fbfd}.glass.light .tl.warn .td{background:#9a6b00;box-shadow:0 0 0 3px #f7fbfd}.glass.light .tl.err .td{background:#c8384c;box-shadow:0 0 0 3px #f7fbfd}
.glass.light .tl .tt{color:#0c2836}

/* ——— Log stream: monospace by right (it is code-shaped), autoscroll, pause on hover ——— */
.logs{position:relative;width:100%;min-width:0;border-radius:13px;overflow:hidden;background:rgba(2,16,26,.7);border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
.logs .lhead{display:flex;align-items:center;gap:8px;min-width:0;padding:8px 10px;border-bottom:1px solid rgba(255,255,255,.1);font:600 13px var(--w-font);letter-spacing:.06em;text-transform:uppercase;color:var(--w-dim)}
.logs .lhead>span:first-child{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.logs .lhead .status{margin-left:auto;height:24px;font-size:13px}
.logs .lbody{height:150px;overflow:auto;padding:8px 10px;font:15px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace;color:#c9ecf4;scrollbar-width:thin;scrollbar-color:rgba(107,197,214,.4) transparent}
.logs .lbody::-webkit-scrollbar{width:5px}.logs .lbody::-webkit-scrollbar-thumb{background:rgba(107,197,214,.35);border-radius:99px}
.logs .ln{display:flex;gap:10px;align-items:baseline;animation:cellin .26s var(--lg-spring) backwards}
.logs .ln>span:last-child{flex:1;min-width:0;white-space:pre-wrap;word-break:break-word}
.logs .ln .lt{color:var(--w-dim);flex:none;font-variant-numeric:tabular-nums}
.logs .ln .lk{flex:none;width:50px;font-weight:700}
.logs .ln.info .lk{color:#6bc5d6}.logs .ln.ok .lk{color:var(--w-green)}.logs .ln.warn .lk{color:var(--w-amber)}.logs .ln.err .lk{color:#ff7a8a}
.logs .paused{position:absolute;right:10px;bottom:8px;font:600 13px var(--w-font);letter-spacing:.08em;text-transform:uppercase;color:var(--w-dim);opacity:0;transition:opacity .2s ease}
.logs.hold .paused{opacity:1}
.glass.light .logs{background:#0c2836;border-color:rgba(4,40,56,.3)}
/* the log panel stays dark in the light scheme: give it dark-scheme ink explicitly */
.glass.light .logs .lhead,.glass.light .logs .ln .lt,.glass.light .logs .paused{color:#9db8c4}
.glass.light .logs .status{color:#fff}
.glass.light .logs .status.ok i{background:#5fe3a1;box-shadow:0 0 6px rgba(95,227,161,.7)}
.glass.light .logs .lhead>span:first-child{color:#9db8c4}

/* ——— Stepper: done · current · todo, with the connector filling ——— */
.steps{display:flex;align-items:flex-start;gap:0;width:100%}
.step{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;font:600 15px var(--w-font);color:var(--w-dim)}
.step .sc{position:relative;z-index:1;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font:700 15px var(--w-font);color:var(--w-dim);
  background:linear-gradient(160deg,rgba(255,255,255,.12),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.26);box-shadow:inset 0 1px 0 rgba(255,255,255,.3);
  transition:background .24s ease,border-color .24s ease,color .24s ease,transform .24s var(--lg-snap)}
.step .sc .n,.step .sc svg{grid-area:1/1}
.step .sc svg{width:13px;height:13px;stroke:#0d2b1c;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:20;stroke-dashoffset:20;opacity:0;transition:stroke-dashoffset .26s ease .08s,opacity .1s ease}
.step.done .sc svg{opacity:1}
.step:not(:last-child)::after{content:"";position:absolute;top:14px;left:calc(50% + 15px);right:calc(-50% + 15px);height:2px;border-radius:2px;background:rgba(255,255,255,.12)}
.step:not(:last-child)::before{content:"";position:absolute;top:14px;left:calc(50% + 15px);right:calc(-50% + 15px);height:2px;border-radius:2px;z-index:0;
  background:linear-gradient(90deg,#1E9DB8,#2ec8e8);transform:scaleX(0);transform-origin:left;transition:transform .32s var(--lg-snap)}
.step.done:not(:last-child)::before{transform:scaleX(1)}
.step.done .sc{background:linear-gradient(160deg,#d9ff7a,#c3f23e);border-color:rgba(217,255,122,.8);color:#0d2b1c}
.step.done .sc svg{stroke-dashoffset:0}
.step.done .sc .n{display:none}
.step.cur .sc{background:linear-gradient(160deg,rgba(30,157,184,.6),rgba(30,157,184,.3));border-color:rgba(107,197,214,.7);color:#fff;transform:scale(1.1);box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 0 0 4px rgba(107,197,214,.15)}
.step.cur{color:var(--w-ink)}.step.done{color:var(--w-soft)}
.step .sl{max-width:100px}
.glass.light .step:not(:last-child)::after{background:rgba(4,40,56,.12)}
.glass.light .step .sc{background:linear-gradient(160deg,#fff,rgba(255,255,255,.7));border-color:rgba(4,40,56,.24);color:#3f5d6c}
.glass.light .step.cur .sc{background:linear-gradient(160deg,#1E9DB8,#137a94);border-color:#137a94;color:#fff}
.glass.light .step.cur{color:#0c2836}.glass.light .step.done{color:#33505f}

/* ——— Slider: a glass thumb on a filled track ——— */
.slider{position:relative;display:flex;align-items:center;gap:12px;width:100%}
.slider .track{position:relative;flex:1;height:8px;border-radius:99px;background:rgba(255,255,255,.1);box-shadow:inset 0 1px 2px rgba(0,10,16,.3)}
.slider .fill{position:absolute;left:0;top:0;bottom:0;border-radius:99px;background:linear-gradient(90deg,#1E9DB8,#2ec8e8 60%,#d9ff7a);width:0}
.slider input{position:absolute;inset:-8px 0;width:100%;margin:0;opacity:0;cursor:pointer}
.slider .thumb{position:absolute;top:50%;left:0;width:18px;height:18px;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;
  background:linear-gradient(160deg,#fff,#dbeef5);border:1px solid rgba(255,255,255,.7);box-shadow:0 2px 8px rgba(2,16,26,.45),inset 0 1px 0 #fff;transition:transform .14s ease,box-shadow .2s ease}
.slider.active .thumb{transform:translate(-50%,-50%) scale(1.15);box-shadow:0 2px 8px rgba(2,16,26,.45),0 0 0 5px rgba(107,197,214,.2),inset 0 1px 0 #fff}
.slider .sv{font:700 15px var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-ink);width:46px;text-align:right}
.glass.light .slider .track{background:rgba(4,40,56,.1);box-shadow:inset 0 1px 2px rgba(23,48,62,.15)}
.glass.light .slider .sv{color:#0c2836}

/* ——— Ticker: one line at a time, the next rolls up ——— */
.ticker{position:relative;height:22px;overflow:hidden;font:500 15px var(--w-font);color:var(--w-soft)}
.ticker span{position:absolute;left:0;top:0;white-space:nowrap;transition:transform .34s var(--lg-spring),opacity .22s ease}
.ticker span.out{transform:translateY(-110%);opacity:0;transition:transform .22s var(--lg-out),opacity .16s ease}
.ticker span.in{transform:translateY(110%);opacity:0;transition:none}
.ticker .live{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--w-green);margin-right:6px;vertical-align:1px;animation:pulse 2.6s ease-in-out infinite}

/* ——— Avatars ——— */
.avatar{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;font:700 13px var(--w-font);color:#04222f;
  background:linear-gradient(160deg,#7fd4e6,#2ec8e8);border:2px solid rgba(10,36,50,.85);box-shadow:inset 0 1px 0 rgba(255,255,255,.4)}
.avatar.lime{background:linear-gradient(160deg,#d9ff7a,#b9d94a)}.avatar.purple{background:linear-gradient(160deg,#cdbfe8,#a795c7)}
.avatar.lg{width:38px;height:38px;font-size:16px}
img.avatar{object-fit:cover;background:none;padding:0;color:transparent;display:inline-block;vertical-align:middle}
.avatars{display:flex}.avatars .avatar{margin-left:-8px}.avatars .avatar:first-child{margin-left:0}
.avatars .more{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;margin-left:-8px;font:700 13px var(--w-font);color:var(--w-dim);background:rgba(255,255,255,.1);border:2px solid rgba(10,36,50,.85)}
.glass.light .avatar,.glass.light .avatars .more{border-color:#fff}

@media (prefers-reduced-motion:reduce){
  .holdbtn.holding .ring .rf{transition-duration:var(--hold,900ms)}
  .tl,.logs .ln{animation:none}
  .step .sc,.step .sc svg,.step::before,.ticker span,.slider .thumb{transition:none}
}

/* ═══════════════════════ batch 4a: callouts, pickers, fields, bars ═══════════════════════ */

/* ——— Alert / callout ——— */
.alert{position:relative;display:grid;grid-template-columns:auto 1fr auto;gap:10px 12px;align-items:start;padding:12px 14px;border-radius:14px;
  color:var(--w-ink);background:linear-gradient(160deg,rgba(255,255,255,.1),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.18);box-shadow:inset 0 1px 0 rgba(255,255,255,.22);
  animation:cellin .3s var(--lg-spring) backwards}
.alert .aico{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;color:#6bc5d6;background:rgba(107,197,214,.14);border:1px solid rgba(107,197,214,.3)}
.alert .aico svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.85;stroke-linecap:round;stroke-linejoin:round}
.alert .at{font:600 16px var(--w-font)}
.alert .ad{font:400 15px/1.5 var(--w-font);color:var(--w-soft);margin-top:2px}
.alert .aact{display:flex;gap:6px;align-items:center}
.alert.ok{border-color:rgba(95,227,161,.35)}.alert.ok .aico{color:var(--w-green);background:rgba(95,227,161,.14);border-color:rgba(95,227,161,.35)}
.alert.warn{border-color:rgba(242,193,78,.35)}.alert.warn .aico{color:var(--w-amber);background:rgba(242,193,78,.14);border-color:rgba(242,193,78,.35)}
.alert.err{border-color:rgba(255,122,138,.4)}.alert.err .aico{color:#ff9aa6;background:rgba(255,122,138,.14);border-color:rgba(255,122,138,.4)}
.alert .tx{width:24px;height:24px;border-radius:99px;border:0;background:rgba(255,255,255,.08);color:var(--w-dim);display:grid;place-items:center;cursor:pointer;transition:background .18s ease,color .18s ease}
.alert .tx:hover{background:rgba(255,255,255,.18);color:var(--w-ink)}
.alert .tx svg{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round}
.alert.out{opacity:0;transform:translateY(-4px);transition:opacity .18s ease,transform .2s var(--lg-out)}
.glass.light .alert{color:#0c2836;background:linear-gradient(160deg,#fff,rgba(255,255,255,.75));border-color:rgba(4,40,56,.14);box-shadow:inset 0 1px 0 #fff}
.glass.light .alert .aico{color:#0f7d95;background:rgba(15,125,149,.1);border-color:rgba(15,125,149,.25)}
.glass.light .alert.ok .aico{color:#1d7d4f;background:rgba(29,125,79,.1);border-color:rgba(29,125,79,.3)}
.glass.light .alert.warn .aico{color:#9a6b00;background:rgba(154,107,0,.1);border-color:rgba(154,107,0,.3)}
.glass.light .alert.err .aico{color:#c8384c;background:rgba(200,56,76,.1);border-color:rgba(200,56,76,.3)}
.glass.light .alert .tx{background:rgba(4,40,56,.06);color:#3f5d6c}

/* ——— Select ——— */
.select{position:relative;display:inline-block;min-width:194px}
.select .strig,.combo .strig{display:flex;align-items:center;gap:8px;width:100%;height:40px;padding:0 10px 0 12px;border-radius:11px;cursor:pointer;text-align:left;
  font:500 15px var(--w-font);color:var(--w-ink);background:linear-gradient(160deg,rgba(255,255,255,.1),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.22);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22);transition:border-color .18s ease,box-shadow .2s ease}
.select .strig:hover,.combo .strig:hover{border-color:rgba(255,255,255,.36)}
.select.open .strig,.combo.open .strig,.select .strig:focus-visible,.combo .strig:focus-visible{border-color:rgba(107,197,214,.7);box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 0 0 3px rgba(107,197,214,.18);outline:none}
.select .strig .sval,.combo .strig .sval{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.select .strig .sval.ph,.combo .strig .sval.ph{color:var(--w-dim)}
.select .strig .schev,.combo .strig .schev{width:15px;height:15px;display:grid;place-items:center;color:var(--w-dim);transition:transform .22s var(--lg-snap)}
.select .strig .schev svg,.combo .strig .schev svg{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.select.open .strig .schev,.combo.open .strig .schev{transform:rotate(180deg)}
.select .menu{min-width:100%;max-height:240px;overflow:auto}
.select .menu [role=option],.combo .menu [role=option]{display:flex;align-items:center;gap:9px;height:38px;padding:0 11px;border-radius:9px;cursor:pointer;color:var(--w-ink);font:500 15px var(--w-font);transition:background .12s ease}
.select .menu [role=option]:hover,.select .menu [role=option].hl,.combo .menu [role=option]:hover,.combo .menu [role=option].hl{background:rgba(255,255,255,.1)}
.select .menu [role=option][aria-selected=true],.combo .menu [role=option][aria-selected=true]{color:#d9ff7a}
.select .menu [role=option] .ck,.combo .menu [role=option] .ck{width:13px;height:13px;margin-left:auto;opacity:0;transition:opacity .14s ease}
.select .menu [role=option][aria-selected=true] .ck,.combo .menu [role=option][aria-selected=true] .ck{opacity:1}
.select .menu [role=option] .ck svg,.combo .menu [role=option] .ck svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.select .menu [role=option][aria-disabled=true]{opacity:.4;pointer-events:none}
.glass.light .select .strig,.glass.light .combo .strig{color:#0c2836;background:linear-gradient(160deg,#fff,rgba(255,255,255,.7));border-color:rgba(4,40,56,.2);box-shadow:inset 0 1px 0 #fff}
.glass.light .select .strig .sval.ph,.glass.light .select .strig .schev,.glass.light .combo .strig .sval.ph,.glass.light .combo .strig .schev{color:#3f5d6c}
.glass.light .select .menu [role=option],.glass.light .combo .menu [role=option]{color:#0c2836}.glass.light .select .menu [role=option]:hover,.glass.light .select .menu [role=option].hl,.glass.light .combo .menu [role=option]:hover,.glass.light .combo .menu [role=option].hl{background:rgba(4,40,56,.06)}
.glass.light .select .menu [role=option][aria-selected=true],.glass.light .combo .menu [role=option][aria-selected=true]{color:#5c8f0e}

/* ——— Combobox: search inside the panel; chips for multi ——— */
.combo{position:relative;display:inline-block;min-width:236px}
.combo .strig{height:auto;min-height:40px;padding-top:4px;padding-bottom:4px}
.combo .menu{min-width:100%;padding:0;overflow:hidden}
.combo .cin{display:flex;align-items:center;gap:8px;padding:8px 10px;border-bottom:1px solid rgba(255,255,255,.12)}
.combo .cin input{flex:1;min-width:0;background:transparent;border:0;outline:none;color:var(--w-ink);font:500 15px var(--w-font)}
.combo .cin input::placeholder{color:var(--w-dim)}
.combo .clist{max-height:230px;overflow:auto;padding:5px}
.combo .cempty{padding:14px;text-align:center;font:500 15px var(--w-font);color:var(--w-soft)}
.combo .strig .chips{display:flex;gap:4px;flex-wrap:wrap;flex:1;min-width:0}
.chip{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 5px 0 10px;border-radius:99px;font:600 15px var(--w-font);color:var(--w-ink);
  background:linear-gradient(160deg,rgba(30,157,184,.45),rgba(30,157,184,.2));border:1px solid rgba(107,197,214,.45);animation:cellpop .22s var(--lg-snap) backwards}
.chip .cx{width:15px;height:15px;border-radius:99px;display:grid;place-items:center;color:var(--w-dim);cursor:pointer;transition:background .14s ease,color .14s ease}
.chip .cx:hover{background:rgba(255,255,255,.18);color:var(--w-ink)}
.chip .cx svg{width:9px;height:9px;stroke:currentColor;fill:none;stroke-width:2.6;stroke-linecap:round}
.combo .menu [role=option] mark{background:transparent;color:#d9ff7a;font-weight:700}
.glass.light .combo .cin{border-bottom-color:rgba(4,40,56,.1)}.glass.light .combo .cin input{color:#0c2836}
.glass.light .chip{color:#0c2836;background:linear-gradient(160deg,rgba(30,157,184,.25),rgba(30,157,184,.1));border-color:rgba(30,157,184,.4)}
.glass.light .combo .menu [role=option] mark{color:#5c8f0e}

/* ——— Popover + hover card ——— */
.popwrap{position:relative;display:inline-block}
.popwrap .pop{position:absolute;top:calc(100% + 8px);left:0;width:260px;padding:14px;border-radius:14px;z-index:45;color:var(--w-ink);
  background:linear-gradient(160deg,rgba(9,36,50,.96),rgba(6,28,40,.95));-webkit-backdrop-filter:blur(16px) saturate(1.6);backdrop-filter:blur(16px) saturate(1.6);
  border:1px solid rgba(255,255,255,.22);box-shadow:0 12px 30px rgba(2,16,26,.5),inset 0 1px 0 rgba(255,255,255,.3);
  opacity:0;transform:translateY(-4px) scale(.98);transform-origin:top left;pointer-events:none;transition:opacity .14s ease,transform .2s var(--lg-snap)}
.popwrap .pop.on{opacity:1;transform:none;pointer-events:auto}
.popwrap .pop.center{left:50%;transform:translate(-50%,-4px) scale(.98);transform-origin:top center}.popwrap .pop.center.on{transform:translate(-50%,0)}
.popwrap .pop.end{left:auto;right:0;transform-origin:top right}
.popwrap .pop .pt{font:600 16px var(--w-font);margin-bottom:2px}
.popwrap .pop .pd{font:400 15px/1.5 var(--w-font);color:var(--w-soft);margin-bottom:10px}
.popwrap .pop .prow{display:grid;grid-template-columns:84px 1fr;gap:8px;align-items:center;margin-bottom:6px;font:500 15px var(--w-font);color:var(--w-soft)}
.hovercard{width:296px}
.hovercard .hc{display:flex;gap:12px;align-items:flex-start}
.hovercard .hn{font:600 16px var(--w-font)}.hovercard .hr{font:500 15px var(--w-font);color:var(--w-dim)}
.hovercard .hd{font:400 15px/1.5 var(--w-font);color:var(--w-soft);margin-top:6px}
.hovercard .hm{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap}
.glass.light .popwrap .pop{color:#0c2836;background:linear-gradient(160deg,#fff,#f4f8fb);border-color:rgba(4,40,56,.18);box-shadow:0 12px 30px rgba(23,48,62,.2),inset 0 1px 0 #fff}

/* ——— Field · input group · textarea ——— */
.field{display:flex;flex-direction:column;gap:6px;width:100%}
.field .flab{font:600 15px var(--w-font);color:var(--w-ink);display:flex;align-items:center;gap:6px}
.field .flab .req{color:#ff9aa6}
.field .fhint{font:400 15px var(--w-font);color:var(--w-dim)}
.field .ferr{font:500 15px var(--w-font);color:#ff9aa6;display:none;align-items:center;gap:5px}
.field .ferr svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round}
.field.err .ferr{display:flex;animation:cellin .22s var(--lg-snap) backwards}
.igroup{position:relative;display:flex;align-items:center;gap:6px;min-height:40px;padding:0 6px 0 10px;border-radius:11px;
  background:linear-gradient(160deg,rgba(255,255,255,.1),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.22);
  transition:border-color .18s ease,box-shadow .2s ease}
.igroup:focus-within{border-color:rgba(107,197,214,.7);box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 0 0 3px rgba(107,197,214,.18)}
.field.err .igroup{border-color:rgba(255,122,138,.6)}
.field.err .igroup:focus-within{box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 0 0 3px rgba(255,122,138,.18)}
.igroup input,.igroup textarea{flex:1;min-width:0;background:transparent;border:0;outline:none;color:var(--w-ink);font:500 15px var(--w-font);padding:8px 0}
.igroup textarea{resize:none;line-height:1.5;padding:9px 0 6px}
.igroup input::placeholder,.igroup textarea::placeholder{color:var(--w-dim)}
.igroup .addon{display:inline-flex;align-items:center;gap:5px;font:500 15px var(--w-font);color:var(--w-dim);white-space:nowrap}
.igroup .addon .gicon{width:16px;height:16px}
.igroup .addon.sep{padding-right:8px;border-right:1px solid rgba(255,255,255,.14)}
.igroup .gbtn2{height:32px;padding:0 12px;font-size:15px}
.igroup.block{flex-direction:column;align-items:stretch;padding:0}
.igroup.block textarea{padding:10px 12px 6px}
.igroup.block .brow{display:flex;align-items:center;gap:8px;padding:6px 8px 8px 12px;border-top:1px solid rgba(255,255,255,.1)}
.igroup .cnt{font:500 13px var(--w-font);color:var(--w-dim);font-variant-numeric:tabular-nums;margin-left:auto}
.glass.light .field .flab{color:#0c2836}.glass.light .field .fhint,.glass.light .igroup .addon,.glass.light .igroup .cnt{color:#3f5d6c}
.glass.light .igroup{background:linear-gradient(160deg,#fff,rgba(255,255,255,.75));border-color:rgba(4,40,56,.2);box-shadow:inset 0 1px 0 #fff}
.glass.light .igroup input,.glass.light .igroup textarea{color:#0c2836}
.glass.light .igroup .addon.sep{border-right-color:rgba(4,40,56,.12)}.glass.light .igroup.block .brow{border-top-color:rgba(4,40,56,.1)}
.glass.light .field .ferr{color:#c8384c}.glass.light .field.err .igroup{border-color:rgba(200,56,76,.5)}

/* ——— Button group · split button ——— */
.btngroup{display:inline-flex;align-items:stretch;border-radius:11px;overflow:hidden;
  background:linear-gradient(160deg,rgba(255,255,255,.14),rgba(255,255,255,.05));border:1px solid rgba(255,255,255,.28);box-shadow:inset 0 1px 0 rgba(255,255,255,.4)}
.btngroup>button,.btngroup>.gsep{border:0;border-radius:0;box-shadow:none;background:transparent;height:38px}
.btngroup>button{display:inline-flex;align-items:center;gap:6px;padding:0 14px;cursor:pointer;font:600 15px var(--w-font);color:var(--w-ink);transition:background .14s ease,transform .1s ease}
.btngroup>button:hover{background:rgba(255,255,255,.1)}
.btngroup>button:active{transform:scale(.97)}
.btngroup>button.on{background:linear-gradient(160deg,rgba(30,157,184,.45),rgba(30,157,184,.2))}
.btngroup>button.ico{padding:0 9px}
.btngroup>button .gicon{width:15px;height:15px}
.btngroup>.gsep{width:1px;background:rgba(255,255,255,.2)}
.btngroup.primary{background:linear-gradient(160deg,#d9ff7a,#c3f23e);border-color:rgba(217,255,122,.7);box-shadow:0 3px 10px rgba(205,255,78,.3),inset 0 1px 0 rgba(255,255,255,.6)}
.btngroup.primary>button{color:#0d2b1c}.btngroup.primary>button:hover{background:rgba(255,255,255,.22)}.btngroup.primary>.gsep{background:rgba(13,43,28,.25)}
.btngroup>button:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:-2px}
.glass.light .btngroup{background:linear-gradient(160deg,#fff,rgba(255,255,255,.7));border-color:rgba(4,40,56,.2);box-shadow:inset 0 1px 0 #fff}
.glass.light .btngroup>button{color:#0c2836}.glass.light .btngroup>button:hover{background:rgba(4,40,56,.06)}.glass.light .btngroup>.gsep{background:rgba(4,40,56,.14)}
.glass.light .btngroup>button.on{background:linear-gradient(160deg,rgba(30,157,184,.28),rgba(30,157,184,.12))}

/* ——— Menubar ——— */
.menubar{display:inline-flex;align-items:center;gap:2px;padding:3px;border-radius:12px;
  background:linear-gradient(160deg,rgba(255,255,255,.1),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.22)}
.menubar .mb{position:relative}
.menubar .mb>button{height:34px;padding:0 13px;border:0;border-radius:9px;background:transparent;cursor:pointer;font:600 15px var(--w-font);color:var(--w-dim);transition:color .12s ease,background .14s ease}
.menubar .mb>button:hover,.menubar .mb.open>button{color:var(--w-ink);background:rgba(255,255,255,.1)}
.menubar .mb .menu{top:calc(100% + 6px)}
.menu [role=menuitem] .chk2{width:13px;height:13px;display:grid;place-items:center;color:#d9ff7a;opacity:0;flex:none}
.menu [role=menuitem][aria-checked=true] .chk2{opacity:1}
.menu [role=menuitem] .chk2 svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.glass.light .menubar{background:linear-gradient(160deg,#fff,rgba(255,255,255,.7));border-color:rgba(4,40,56,.16);box-shadow:inset 0 1px 0 #fff}
.glass.light .menubar .mb>button{color:#3f5d6c}.glass.light .menubar .mb>button:hover,.glass.light .menubar .mb.open>button{color:#0c2836;background:rgba(4,40,56,.06)}
.glass.light .menu [role=menuitem] .chk2{color:#5c8f0e}

/* ——— Spinner · loading buttons ——— */
.spinner{display:inline-block;width:16px;height:16px;border-radius:50%;flex:none;
  border:2px solid rgba(255,255,255,.16);border-top-color:#2ec8e8;border-right-color:rgba(46,200,232,.55);animation:spin .8s linear infinite}
.spinner.lg{width:26px;height:26px;border-width:3px}.spinner.sm{width:12px;height:12px;border-width:2px}
@keyframes spin{to{transform:rotate(360deg)}}
.gbtn2.loading{pointer-events:none;color:var(--w-dim)}
.gbtn2.loading .spinner{width:12px;height:12px;border-width:2px}
.gbtn2.primary.loading{color:rgba(13,43,28,.65)}.gbtn2.primary .spinner{border-color:rgba(13,43,28,.2);border-top-color:#0d2b1c;border-right-color:rgba(13,43,28,.5)}
.glass.light .spinner{border-color:rgba(4,40,56,.14);border-top-color:#0f7d95;border-right-color:rgba(15,125,149,.5)}

/* ——— Scroll area: the kit's scrollbar on any box ——— */
.scroll{overflow:auto;scrollbar-width:thin;scrollbar-color:rgba(107,197,214,.4) transparent}
.scroll::-webkit-scrollbar{width:6px;height:6px}.scroll::-webkit-scrollbar-thumb{background:rgba(107,197,214,.35);border-radius:99px}.scroll::-webkit-scrollbar-track{background:transparent}

@media (prefers-reduced-motion:reduce){
  .alert,.chip,.field.err .ferr{animation:none}
  .select .strig .schev,.popwrap .pop,.alert.out{transition:none}
  .spinner{animation-duration:1.6s}
}

/* ═══════════════════════ batch 4b: charts, KPI, split, table toolbar, dashboard ═══════════════════════ */

/* ——— Charts (SVG drawn at host width; crosshair + glass tooltip; legend toggles) ——— */
.chart{position:relative;width:100%;min-width:0}
.chart svg{display:block;width:100%;overflow:visible}
.chart .grid line{stroke:rgba(255,255,255,.08);stroke-width:1}
/* an axis label is a scale, not a series — but 11 px is under the floor Sam set for every word on
   a console surface, so the scale moves to 12.5 with the rest (2026-09-15) */
.chart .axis text{font:500 13px var(--w-font);fill:var(--w-dim)}
.chart .cline{fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:100;stroke-dashoffset:100;animation:sparkdraw 1s .1s ease-out forwards}
.chart .cline.dim{opacity:.18}
.chart .carea{opacity:0;animation:fadein .7s .6s ease forwards}
.chart .carea.dim{animation:none;opacity:0}
.chart .cx{stroke:rgba(255,255,255,.3);stroke-width:1;stroke-dasharray:3 3;opacity:0;transition:opacity .12s ease}
.chart.hover .cx{opacity:1}
.chart .cdot{stroke-width:2;fill:#031e2b;opacity:0;transition:opacity .12s ease}
.chart.hover .cdot{opacity:1}
.chart .bar{transform-box:fill-box;transform-origin:bottom;animation:barin .5s var(--lg-spring) backwards;transition:opacity .14s ease}
.chart.hover .bar:not(.on){opacity:.35}
.ctip{position:absolute;z-index:5;pointer-events:none;min-width:120px;padding:8px 10px;border-radius:11px;color:var(--w-ink);
  background:linear-gradient(160deg,rgba(9,36,50,.96),rgba(6,28,40,.95));border:1px solid rgba(255,255,255,.22);box-shadow:0 8px 22px rgba(2,16,26,.45),inset 0 1px 0 rgba(255,255,255,.3);
  opacity:0;transform:translateY(3px);transition:opacity .12s ease,transform .16s var(--lg-snap)}
.chart.hover .ctip{opacity:1;transform:none}
.ctip .tl{font:600 13px var(--w-font);letter-spacing:.06em;text-transform:uppercase;color:var(--w-dim);margin-bottom:4px}
.ctip .tr{display:flex;align-items:center;gap:7px;font:500 15px var(--w-font);padding:2px 0}
.ctip .tr i{width:8px;height:8px;border-radius:2px;flex:none}
.ctip .tr b{margin-left:auto;font-weight:700;font-variant-numeric:tabular-nums}
.clegend{display:flex;gap:12px;flex-wrap:wrap;margin-top:8px}
.clegend button{display:inline-flex;align-items:center;gap:6px;border:0;background:transparent;padding:2px 4px;border-radius:6px;cursor:pointer;font:500 15px var(--w-font);color:var(--w-soft);transition:color .14s ease,opacity .14s ease}
.clegend button i{width:9px;height:9px;border-radius:3px}
.clegend button.off{opacity:.4}
.clegend button:hover{color:var(--w-ink)}
.chartcard{display:flex;flex-direction:column;gap:12px;width:100%;padding:14px 16px 12px;border-radius:16px;
  background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.22)}
.chartcard .ch{display:flex;align-items:flex-start;gap:14px;flex-wrap:wrap}
.chartcard .ch .ct{font:600 16px var(--w-font);color:var(--w-ink)}
.chartcard .ch .cs{font:400 15px var(--w-font);color:var(--w-soft);margin-top:2px}
.chartcard .ch .cstats{margin-left:auto;display:flex;gap:2px}
.chartcard .ch .cstat{display:flex;flex-direction:column;gap:2px;padding:6px 12px;border-radius:10px;cursor:pointer;border:1px solid transparent;transition:background .14s ease,border-color .14s ease}
.chartcard .ch .cstat:hover{background:rgba(255,255,255,.06)}
.chartcard .ch .cstat.on{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18)}
.chartcard .ch .cstat .lbl{font-size:13px}
.chartcard .ch .cstat .mn{font-size:20px;font-weight:700}
.glass.light .chart .grid line{stroke:rgba(4,40,56,.1)}.glass.light .chart .axis text{fill:#3f5d6c}
.glass.light .chart .cx{stroke:rgba(4,40,56,.35)}.glass.light .chart .cdot{fill:#fff}
.glass.light .ctip{color:#0c2836;background:linear-gradient(160deg,#fff,#f4f8fb);border-color:rgba(4,40,56,.18);box-shadow:0 8px 22px rgba(23,48,62,.18),inset 0 1px 0 #fff}
.glass.light .ctip .tl{color:#3f5d6c}.glass.light .clegend button{color:#33505f}.glass.light .clegend button:hover{color:#0c2836}
.glass.light .chartcard{background:linear-gradient(160deg,#fff,rgba(255,255,255,.75));border-color:rgba(4,40,56,.14);box-shadow:inset 0 1px 0 #fff}
.glass.light .chartcard .ch .ct{color:#0c2836}.glass.light .chartcard .ch .cstat:hover{background:rgba(4,40,56,.05)}.glass.light .chartcard .ch .cstat.on{background:rgba(4,40,56,.06);border-color:rgba(4,40,56,.14)}

/* ——— KPI card ——— */
@keyframes cellfade{from{opacity:0}to{opacity:1}}
.kpi{display:flex;flex-direction:column;gap:6px;padding:13px 15px 12px;border-radius:16px;min-width:0;
  background:linear-gradient(160deg,rgba(255,255,255,.12),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.18);box-shadow:inset 0 1px 0 rgba(255,255,255,.26);
  transition:border-color .22s ease,box-shadow .22s ease,transform .18s ease;animation:cellfade .28s ease backwards}
.kpi:hover{border-color:rgba(255,255,255,.3);transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.34),0 8px 20px -10px rgba(2,16,26,.55)}
.kpi .kh{display:flex;align-items:center;justify-content:space-between;gap:8px}
.kpi .kd{display:inline-flex;align-items:center;gap:4px;height:24px;padding:0 9px 0 7px;border-radius:99px;font:700 13px var(--w-font);font-variant-numeric:tabular-nums;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);color:var(--w-soft)}
.kpi .kd svg{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.kpi .kd.up{color:#bff5d6;background:rgba(95,227,161,.14);border-color:rgba(95,227,161,.35)}
.kpi .kd.down{color:#ffc3cb;background:rgba(255,122,138,.14);border-color:rgba(255,122,138,.35)}
.kpi .kv{font:700 30px/1.1 var(--font);letter-spacing:-.01em;color:var(--w-ink);font-variant-numeric:tabular-nums}
.kpi .kv small{font:600 15px var(--w-font);color:var(--w-dim);margin-left:4px}
.kpi .kf{display:flex;align-items:center;gap:6px;font:600 15px var(--w-font);color:var(--w-ink);margin-top:2px}
.kpi .kf svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.kpi .ks{font:400 15px var(--w-font);color:var(--w-soft)}
.kpi .sparkwrap{margin-top:4px}
.kpirow{display:grid;grid-template-columns:repeat(auto-fit,minmax(182px,1fr));gap:10px;width:100%}
.kpirow .kpi:nth-child(2){animation-delay:.05s}.kpirow .kpi:nth-child(3){animation-delay:.1s}.kpirow .kpi:nth-child(4){animation-delay:.15s}
.glass.light .kpi{background:linear-gradient(160deg,#fff,rgba(255,255,255,.78));border-color:rgba(4,40,56,.14);box-shadow:inset 0 1px 0 #fff}
.glass.light .kpi:hover{border-color:rgba(4,40,56,.28);box-shadow:inset 0 1px 0 #fff,0 8px 20px -10px rgba(23,48,62,.35)}
.glass.light .kpi .kv,.glass.light .kpi .kf{color:#0c2836}.glass.light .kpi .kd{color:#33505f;background:rgba(4,40,56,.05);border-color:rgba(4,40,56,.14)}
.glass.light .kpi .kd.up{color:#1d7d4f;background:rgba(29,125,79,.1);border-color:rgba(29,125,79,.3)}.glass.light .kpi .kd.down{color:#c8384c;background:rgba(200,56,76,.1);border-color:rgba(200,56,76,.3)}

/* ——— Resizable split ——— */
.split{display:flex;width:100%;min-height:150px;border-radius:14px;overflow:hidden;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.14)}
.split .pane{min-width:96px;overflow:auto;padding:12px 14px;font:400 15px/1.5 var(--w-font);color:var(--w-soft)}
.split .pane:first-child{flex:0 0 50%}
.split .pane:last-child{flex:1}
.split .pane .pt{font:600 15px var(--w-font);color:var(--w-ink);margin-bottom:6px}
.split .handle{position:relative;flex:none;width:12px;cursor:col-resize;touch-action:none;outline:none}
.split .handle::before{content:"";position:absolute;left:5px;top:0;bottom:0;width:2px;background:rgba(255,255,255,.12);transition:background .16s ease}
.split .handle::after{content:"";position:absolute;left:3px;top:50%;width:6px;height:26px;margin-top:-13px;border-radius:99px;background:rgba(255,255,255,.28);border:1px solid rgba(255,255,255,.35);transition:background .16s ease,transform .16s var(--lg-snap)}
.split .handle:hover::before,.split.dragging .handle::before,.split .handle:focus-visible::before{background:rgba(107,197,214,.7)}
.split .handle:hover::after,.split.dragging .handle::after{background:rgba(107,197,214,.85);transform:scaleY(1.15)}
.split.dragging{user-select:none}
.split.dragging .pane{pointer-events:none}
.glass.light .split{background:rgba(255,255,255,.5);border-color:rgba(4,40,56,.14)}
.glass.light .split .pane .pt{color:#0c2836}.glass.light .split .handle::before{background:rgba(4,40,56,.14)}.glass.light .split .handle::after{background:#fff;border-color:rgba(4,40,56,.25)}

/* ——— Table toolbar + footer ——— */
.tablewrap{display:flex;flex-direction:column;gap:10px;width:100%;min-width:0}
.ttool{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ttool .gsearch{flex:1;min-width:190px}
.tfoot{display:flex;align-items:center;justify-content:space-between;gap:10px;font:500 15px var(--w-font);color:var(--w-dim)}
.gtable td.sel-col,.gtable th.sel-col{width:36px;padding-right:0}
.gtable .chk i{width:16px;height:16px;border-radius:4px}
.gtable .chk i svg{inset:2px;width:11px;height:11px}
.gtable td.hidecol,.gtable th.hidecol{display:none}
.glass.light .tfoot{color:#3f5d6c}

/* ——— Dashboard block ——— */
.dash{display:grid;grid-template-columns:214px 1fr;grid-template-rows:auto 1fr;width:100%;height:600px;border-radius:18px;overflow:hidden;
  background:linear-gradient(165deg,rgba(6,28,40,.75),rgba(3,20,30,.8));border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.14)}
.dash .dside{grid-row:1/3;padding:12px 10px;border-right:1px solid rgba(255,255,255,.1);display:flex;flex-direction:column;gap:10px;min-height:0}
.dash .dbrand{display:flex;align-items:center;gap:9px;padding:4px 6px 10px;font:700 16px var(--w-font);color:var(--w-ink)}
.dash .dbrand i{width:22px;height:22px;border-radius:7px;background:linear-gradient(160deg,#7fd4e6,#1E9DB8);box-shadow:inset 0 1px 0 rgba(255,255,255,.45)}
.dash .dside .sidenav{width:100%;background:transparent;border:0;box-shadow:none;padding:0}
.dash .dhead{display:flex;align-items:center;gap:12px;padding:10px 16px;border-bottom:1px solid rgba(255,255,255,.1)}
.dash .dhead .crumbs{flex:1}
.dash .dhead .gsearch{width:240px}
.dash .dmain{overflow:auto;padding:14px 16px 16px;display:flex;flex-direction:column;gap:12px;min-height:0}
.dash .drow{display:grid;grid-template-columns:1.6fr 1fr;gap:12px;min-width:0}
.dash .dpanel{padding:12px 14px;border-radius:14px;min-width:0;background:linear-gradient(160deg,rgba(255,255,255,.08),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.2)}
.dash .dpanel .pt{font:600 15px var(--w-font);color:var(--w-ink);margin-bottom:8px;display:flex;align-items:center;gap:8px}
.dash .dpanel .pt .status{margin-left:auto}
.glass.light .dash{background:linear-gradient(165deg,#f6fafc,#eef3f6);border-color:rgba(4,40,56,.14);box-shadow:inset 0 1px 0 #fff}
.glass.light .dash .dside,.glass.light .dash .dhead{border-color:rgba(4,40,56,.1)}
.glass.light .dash .dbrand{color:#0c2836}
.glass.light .dash .dpanel{background:linear-gradient(160deg,#fff,rgba(255,255,255,.75));border-color:rgba(4,40,56,.14);box-shadow:inset 0 1px 0 #fff}
.glass.light .dash .dpanel .pt{color:#0c2836}
@media(max-width:820px){.dash{grid-template-columns:1fr}.dash .dside{display:none}.dash .drow{grid-template-columns:1fr}}

@media (prefers-reduced-motion:reduce){
  .chart .cline{animation:none;stroke-dashoffset:0}.chart .carea{animation:none;opacity:1}.chart .bar,.kpi{animation:none}
  .ctip,.split .handle::after,.split .handle::before{transition:none}
}

/* ==== ../ui-kit/parts/charts.css ==== */
/* ═══════════════════════════════════════════════════════════════════════════════════════
   Aegis Liquid Glass Kit — parts/charts.css  (hand-authored; the charts & data-viz layer)
   Everything a governed-AI dashboard needs to draw: spend over time, cost per person and
   per model, token mix, tool calls, latency, budgets against ceilings, refusals and kill
   events on a timeline, and an OpenTelemetry trace.

   Loads AFTER glass.css and console.css and depends on both: it reuses `.chart` (the host),
   `.ctip` (the glass tooltip), `.grid`/`.axis` (SVG chrome), `.skel`, `.empty`, `.avatar`,
   and the keyframes `fadein · cellin · cellpop · barin · meterin · arc · sparkdraw`.

   Same doctrine as the rest of the kit: one transition list per element, entrances use
   `animation-fill-mode: backwards`, no filter animations, focus rings only for the keyboard,
   everything collapses under `prefers-reduced-motion`.

   SERIES COLOUR IS A CSS VARIABLE (`--ch0` … `--ch7`), never a baked hex. A chart writes
   `style="fill:var(--ch2)"` on its shapes, so flipping `.glass.light` recolours every series
   with no redraw — and the light values are chosen to be legible on white, which raw lime
   and raw cyan are not.
   ═══════════════════════════════════════════════════════════════════════════════════════ */

/* ——— the series palette + the semantic three ——— */
.glass{--ch0:#2ec8e8;--ch1:#d9ff7a;--ch2:#a795c7;--ch3:#f2c14e;--ch4:#5fe3a1;--ch5:#ff9aa8;--ch6:#7fb3ff;--ch7:#e8a0e0;
  --ch-ok:#5fe3a1;--ch-warn:#f2c14e;--ch-err:#ff7a8a;
  --ch-track:rgba(255,255,255,.09);--ch-edge:rgba(255,255,255,.16);--ch-plate:rgba(255,255,255,.05);--ch-sep:rgba(2,16,26,.38);
  --ch-ghost:rgba(195,222,232,.38)}
.glass.light{--ch0:#0f7d95;--ch1:#6f9412;--ch2:#6b57a3;--ch3:#b07a06;--ch4:#1d7d4f;--ch5:#c8384c;--ch6:#2c5fbf;--ch7:#a3379a;
  --ch-ok:#1d7d4f;--ch-warn:#b07a06;--ch-err:#c8384c;
  --ch-track:rgba(4,40,56,.09);--ch-edge:rgba(4,40,56,.14);--ch-plate:rgba(4,40,56,.035);--ch-sep:rgba(255,255,255,.85);
  --ch-ghost:rgba(63,93,108,.42)}

/* ——— shared chart chrome ——— */
.chart .zero{stroke:var(--ch-edge);stroke-width:1}
/* the type step of 2026-09-14 capped a chart at 11.5 px: an axis label is a scale, and a scale that
   competes with the series is noise. Sam's second pass sets a hard 12.5 px floor for every word on
   a console surface (2026-09-15), so the cap moves with it — a chart is not an exception. */
.chart .axis text.big{font-size:15px;font-weight:600;fill:var(--w-ink)}
.chart .cval{font:700 13px var(--w-font);fill:var(--w-ink);font-variant-numeric:tabular-nums}
.cnum{font-variant-numeric:tabular-nums}
.ctip .tt{font:400 13px var(--w-font);color:var(--w-dim);margin-top:4px}
.ctip .tr.tot{margin-top:3px;padding-top:5px;border-top:1px solid var(--ch-edge)}

/* header stat tabs and a shadcn-style trend footer for .chartcard */
.chartcard .crange{margin-left:auto}
.cfoot{display:flex;flex-direction:column;gap:3px;padding-top:2px}
.cfoot .cft{display:flex;align-items:center;gap:6px;font:600 15px var(--w-font);color:var(--w-ink)}
.cfoot .cft svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.cfoot .cft.up{color:var(--ch-ok)}.cfoot .cft.down{color:var(--ch-err)}
.cfoot .cfs{font:400 15px var(--w-font);color:var(--w-soft)}

/* ——— the unified legend: a colour dot, a label, an optional value; click toggles ——— */
.cleg{display:flex;gap:14px;flex-wrap:wrap;margin-top:9px}
.cleg button{display:inline-flex;align-items:center;gap:7px;height:27px;padding:0;border:0;cursor:pointer;
  font:600 15px var(--w-font);color:var(--w-soft);font-variant-numeric:tabular-nums;
  background:transparent;text-decoration:none;
  transition:color .14s ease,opacity .14s ease}
.cleg button i{width:10px;height:10px;border-radius:50%;flex:none;background:var(--w-dim)}
.cleg button b{font-weight:700;color:var(--w-ink)}
.cleg button:hover{color:var(--w-ink);text-decoration:underline;text-underline-offset:3px}
.cleg button.off{opacity:.42}
.cleg button:active{transition-duration:.08s}
.cleg button:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:2px}
.cleg button:focus:not(:focus-visible){outline:none}
.cleg.iso button:not(.on){opacity:.42}

/* ——— 1 · area (+ threshold / event annotations) ——— */
/* the console layer's line/area entrance runs 1.3 s end to end — too slow for the kit's own
   doctrine (entrances ≤ .45 s) and long enough that the fill reads as missing. Re-time it. */
.charea .cline{animation-duration:.55s;animation-delay:.02s}
.charea .carea{animation-duration:.3s;animation-delay:.2s}
.charea .cthr{stroke:var(--ch-warn);stroke-width:1.4;stroke-dasharray:5 4;opacity:.85}
.charea .cthrc{fill:var(--ch-warn);opacity:.16}
.charea .cthrt{font:700 13px var(--w-font);fill:var(--ch-warn);letter-spacing:.04em;text-transform:uppercase}
.charea .cmk{stroke:var(--ch-err);stroke-width:1;stroke-dasharray:3 3;opacity:.7}
.charea .cmkd{r:3.5;stroke:none}
.charea .cmkt{font:600 13px var(--w-font);fill:var(--w-dim)}

/* ——— 2 · stacked area (spend by model over time) ——— */
.cstack .sband{opacity:0;animation:fadein .5s ease forwards;transition:fill-opacity .16s ease}
.cstack.iso .sband:not(.on){fill-opacity:.2}
.cstack .sedge{fill:none;stroke-width:1.2;opacity:.55}

/* ——— 3 · stacked bars (tokens in / out / cache-read per day) ——— */
.cbars .sseg{transform-box:fill-box;transform-origin:bottom;animation:barin .5s var(--lg-spring) backwards;transition:opacity .14s ease}
.cbars .sline{fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:100;stroke-dashoffset:100;animation:sparkdraw .8s .25s ease-out forwards}
.cbars .sdot{stroke:rgba(3,30,43,.6);stroke-width:1;opacity:0;animation:fadein .3s .9s ease forwards}
.cbars.hover .sseg:not(.on){opacity:.42}
.cbars.iso .sseg:not(.on){opacity:.24}

/* ——— 4 · horizontal ranked bars (cost per person / model / tool) ——— */
.chb{display:flex;flex-direction:column;gap:3px;width:100%;min-width:0}
.chb .hbrow{display:grid;align-items:center;gap:10px;grid-template-columns:minmax(0,142px) minmax(42px,1fr) var(--hbv-w,80px);
  padding:5px 8px;border-radius:11px;border:1px solid transparent;cursor:pointer;text-align:left;background:transparent;font:inherit;
  transition:background .16s ease,border-color .16s ease,transform .16s var(--lg-snap)}
.chb.av .hbrow{grid-template-columns:28px minmax(0,130px) minmax(42px,1fr) var(--hbv-w,80px)}
.chb .hbrow:hover{background:var(--ch-plate);border-color:var(--ch-edge);transform:translateX(2px)}
.chb .hbrow.sel{background:rgba(46,200,232,.12);border-color:rgba(46,200,232,.4)}
.chb .hbrow:active{transition-duration:.08s}
.chb .hbrow:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:1px}
.chb .hbrow:focus:not(:focus-visible){outline:none}
.chb .hbav{width:28px;height:28px;font-size:13px}
.chb .hbn{min-width:0;display:flex;flex-direction:column;gap:1px}
.chb .hbn span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;font:600 15px var(--w-font);color:var(--w-ink)}
.chb .hbn small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;font:400 13px var(--w-font);color:var(--w-soft)}
.chb .hbt{position:relative;height:14px;border-radius:99px;background:var(--ch-track);min-width:0;overflow:hidden}
/* the track's own rounding clips the fills: segments sit flush, only the outer ends are round */
.chb .hbf{position:absolute;inset:0 auto 0 0;border-radius:0;transform-origin:left center;
  animation:meterin .55s var(--lg-spring) backwards;transition:opacity .16s ease}
.chb .hbf+.hbf{box-shadow:inset 1px 0 0 var(--ch-sep)}
.chb .hbrow.iso .hbf:not(.on){opacity:.28}
.chb .hbv{display:block;min-width:0;justify-self:stretch;text-align:right;overflow:hidden;text-overflow:ellipsis;
  font:700 15px var(--w-font);color:var(--w-ink);font-variant-numeric:tabular-nums;white-space:nowrap;pointer-events:none}
.chb .hbmax{display:grid;align-items:center;gap:10px;grid-template-columns:minmax(0,142px) minmax(42px,1fr) var(--hbv-w,80px);
  font:600 13px var(--w-font);letter-spacing:.06em;text-transform:uppercase;color:var(--w-dim);padding:0 8px 4px}
.chb .hbmax span:first-child{grid-column:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chb .hbmax span:last-child{grid-column:3;min-width:0;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chb.av .hbmax{grid-template-columns:28px minmax(0,130px) minmax(42px,1fr) var(--hbv-w,80px)}
.chb.av .hbmax span:first-child{grid-column:2}
.chb.av .hbmax span:last-child{grid-column:4}

/* ——— 5 · donut ——— */
.cdonut{position:relative;display:flex;align-items:center;gap:18px;flex-wrap:wrap;width:100%;min-width:0}
.cdonut .dring{position:relative;flex:none}
.cdonut svg{display:block;overflow:visible;animation:donutin .55s .1s var(--lg-glide) backwards}
.cdonut circle.seg{fill:none;stroke-linecap:butt;animation:arc .8s var(--lg-glide) backwards;transition:opacity .16s ease}
.cdonut circle.trk{fill:none;stroke:var(--ch-track)}
.cdonut.iso circle.seg:not(.on){opacity:.22}
.cdonut .dc{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;pointer-events:none}
.cdonut .dnum{font:700 24px/1 var(--font);letter-spacing:-.01em;color:var(--w-ink);font-variant-numeric:tabular-nums}
.cdonut .dsub{font:600 13px var(--w-font);letter-spacing:.06em;text-transform:uppercase;color:var(--w-dim)}
.cdonut .dside{flex:1;min-width:162px}
.cdonut .dside .cleg{margin-top:0;flex-direction:column;gap:3px;align-items:stretch}
.cdonut .dside .cleg button{justify-content:flex-start;width:100%}
.cdonut .dside .cleg button b{margin-left:auto}

/* ——— 6 · radial (budget used vs a ceiling) ——— */
.cradial{position:relative;display:flex;align-items:center;gap:18px;flex-wrap:wrap;width:100%;min-width:0}
.cradial .rring{position:relative;flex:none}
.cradial svg{display:block;overflow:visible}
.cradial circle.trk{fill:none;stroke:var(--ch-track);stroke-linecap:round}
.cradial circle.val{fill:none;stroke-linecap:round;animation:arc .9s var(--lg-glide) backwards}
.cradial .rc{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;pointer-events:none}
.cradial .rnum{font:700 24px/1 var(--font);color:var(--w-ink);font-variant-numeric:tabular-nums}
.cradial .rsub{font:600 13px var(--w-font);letter-spacing:.06em;text-transform:uppercase;color:var(--w-dim)}
.cradial .rrows{flex:1;min-width:184px;display:flex;flex-direction:column;gap:6px}
.cradial .rrow{display:grid;grid-template-columns:10px minmax(0,1fr) auto;align-items:center;gap:8px;font:600 15px var(--w-font);color:var(--w-soft)}
.cradial .rrow i{width:10px;height:10px;border-radius:3px}
.cradial .rrow span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cradial .rrow b{color:var(--w-ink);font-weight:700;font-variant-numeric:tabular-nums}

/* ——— 7 · radar (per-model profile) ——— */
.cradar .rgridline{fill:none;stroke:var(--ch-edge);stroke-width:1}
.cradar .rspoke{stroke:var(--ch-edge);stroke-width:1}
.cradar .rax{font:600 13px var(--w-font);fill:var(--w-dim)}
.cradar .rpoly{stroke-width:2;stroke-linejoin:round;fill-opacity:.14;
  transform-box:fill-box;transform-origin:center;animation:cellpop .5s var(--lg-spring) backwards;transition:fill-opacity .16s ease}
.cradar.iso .rpoly:not(.on){fill-opacity:.02;stroke-opacity:.25}
.cradar .rdot{r:3;stroke:none;opacity:0;animation:fadein .4s .35s ease forwards}

/* ——— 8 · heat grid (hour × weekday) ——— */
.cheat{width:100%;min-width:0}
.cheat .chg{display:grid;gap:3px;min-width:0}
.cheat .chc{aspect-ratio:1;border-radius:3.5px;background:var(--ch-track);animation:cellpop .3s var(--lg-pop) backwards}
.cheat .chc.l1{background:rgba(30,157,184,.4)}
.cheat .chc.l2{background:rgba(30,157,184,.68)}
.cheat .chc.l3{background:#2ec8e8}
.cheat .chc.l4{background:linear-gradient(160deg,#d9ff7a,#c3f23e)}
.cheat .chy{font:600 13px var(--w-font);color:var(--w-dim);display:flex;align-items:center;justify-content:flex-end;padding-right:3px;letter-spacing:.02em}
.cheat .chx{font:600 13px var(--w-font);color:var(--w-dim);text-align:center;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.cheat .chfoot{display:flex;align-items:center;gap:5px;margin-top:9px;font:600 13px var(--w-font);letter-spacing:.06em;
  text-transform:uppercase;color:var(--w-soft)}
.cheat .chfoot i{width:11px;height:11px;border-radius:3px;background:var(--ch-track)}
.cheat .chfoot i.l1{background:rgba(30,157,184,.4)}.cheat .chfoot i.l2{background:rgba(30,157,184,.68)}
.cheat .chfoot i.l3{background:#2ec8e8}.cheat .chfoot i.l4{background:linear-gradient(160deg,#d9ff7a,#c3f23e)}

/* ——— 9 · bullet (actual vs ceiling, warn at 80 %) ——— */
.cbullet{display:flex;flex-direction:column;gap:11px;width:100%;min-width:0}
.cbullet .blrow{display:flex;flex-direction:column;gap:5px;min-width:0}
.cbullet .blh{display:flex;align-items:baseline;gap:8px;min-width:0}
.cbullet .bln{font:600 15px var(--w-font);color:var(--w-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.cbullet .blv{margin-left:auto;font:700 15px var(--w-font);color:var(--w-ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.cbullet .blv small{font:600 13px var(--w-font);color:var(--w-soft);margin-left:4px}
.cbullet .blt{position:relative;height:15px;border-radius:6px;background:var(--ch-track);overflow:hidden}
.cbullet .blf{position:absolute;inset:0 auto 0 0;border-radius:6px;background:var(--ch0);transform-origin:left center;
  animation:meterin .6s var(--lg-spring) backwards}
.cbullet .blf.warn{background:var(--ch-warn)}
.cbullet .blf.over{background:var(--ch-err)}
.cbullet .blk{position:absolute;top:-3px;bottom:-3px;width:2px;border-radius:2px;background:var(--w-ink);opacity:.75}
.cbullet .blfoot{display:flex;justify-content:space-between;font:600 13px var(--w-font);letter-spacing:.06em;
  text-transform:uppercase;color:var(--w-dim)}

/* ——— 10 · latency histogram with p50 / p95 ——— */
.chist .hb{transform-box:fill-box;transform-origin:bottom;animation:barin .45s var(--lg-spring) backwards;transition:opacity .14s ease}
.chist.hover .hb:not(.on){opacity:.35}
.chist .pline{stroke-width:1.6;stroke-dasharray:4 3}
.chist .pchip{rx:5}
.chist .ptxt{font:700 13px var(--w-font);letter-spacing:.04em}

/* ——— 11 · treemap (cost by model → person) ——— */
.ctree{position:relative;width:100%;min-width:0;border-radius:12px;overflow:hidden}
.ctree .tmc{position:absolute;border-radius:9px;overflow:hidden;padding:7px 9px;cursor:default;
  border:1px solid rgba(255,255,255,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.24);
  animation:cellfade .32s ease backwards;transition:transform .18s var(--lg-snap),box-shadow .18s ease,z-index 0s}
.ctree .tmc:hover{transform:translateY(-2px);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 8px 20px -8px rgba(2,16,26,.6);z-index:3}
.ctree .tmn{position:relative;display:block;font:700 15px var(--w-font);color:#04222f;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ctree .tmv{position:relative;display:block;font:600 13px var(--w-font);color:rgba(4,34,47,.72);font-variant-numeric:tabular-nums;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ctree .tmc.sm{padding:4px 6px}
.ctree .tmc.sm .tmv{display:none}
.ctree .tmc.tiny .tmn{display:none}
/* a parent cell is a tinted plate its children sit on, so nesting reads without a second palette */
.ctree .tmc.grp{border-color:var(--ch-edge);box-shadow:none}
.ctree .tmc.grp::before{content:"";position:absolute;inset:0;background:var(--tc);opacity:.17}
.ctree .tmc.grp > .tmn{color:var(--w-ink);font-size:13px;letter-spacing:.06em;text-transform:uppercase}
.ctree .tmc.grp > .tmv{color:var(--w-soft)}

/* ——— 12 · event counts by period (stacked by kind) ——— */
.cev{position:relative;width:100%;min-width:0}
.cev .evgrid line{stroke:var(--ch-edge);stroke-width:1;shape-rendering:crispEdges}
.cev .evgrid text{font:600 13px var(--w-font);fill:var(--w-dim);font-variant-numeric:tabular-nums}
.cev .evunit{font:600 13px var(--w-font);fill:var(--w-dim)}
.cev .evtick{stroke:var(--ch-edge);stroke-width:1}
.cev .evt{font:600 13px var(--w-font);fill:var(--w-dim);font-variant-numeric:tabular-nums}
.cev .evtot{font:700 13px var(--w-font);fill:var(--w-soft);font-variant-numeric:tabular-nums;pointer-events:none}
.cev .evm{transform-box:fill-box;transform-origin:center bottom;animation:evgrow .42s var(--lg-spring) backwards}
.cev .evm[role=button]{cursor:pointer}
.cev .evm > .evseg{stroke:rgba(3,30,43,.55);stroke-width:.75;transition:opacity .14s ease}
.cev.hover .evm:not(.on) > .evseg{opacity:.22}
.cev .evm:focus{outline:none}
.cev .evm:focus-visible > .evseg{stroke:rgba(217,255,122,.95);stroke-width:2}
@keyframes evgrow{from{opacity:.32;transform:scaleY(0)}to{opacity:1;transform:scaleY(1)}}

/* ——— 13 · compare (this period vs last) ——— */
.ccmp{display:flex;flex-direction:column;gap:9px;width:100%;min-width:0}
.ccmp .cmrow{display:grid;grid-template-columns:minmax(0,134px) minmax(0,1fr) auto;align-items:center;gap:10px}
.ccmp .cmn{font:600 15px var(--w-font);color:var(--w-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.ccmp .cmb{display:flex;flex-direction:column;gap:3px;min-width:0}
.ccmp .cmt{position:relative;height:11px;border-radius:5px;background:var(--ch-track);overflow:hidden}
.ccmp .cmf{position:absolute;inset:0 auto 0 0;border-radius:5px;transform-origin:left center;
  animation:meterin .55s var(--lg-spring) backwards}
.ccmp .cmt.prev{height:7px}
.ccmp .cmf.prev{background:var(--ch-ghost)}
.dpill{display:inline-flex;align-items:center;gap:4px;height:24px;padding:0 9px 0 7px;border-radius:99px;
  font:700 13px var(--w-font);font-variant-numeric:tabular-nums;white-space:nowrap;
  color:var(--w-dim);background:var(--ch-plate);border:1px solid var(--ch-edge)}
.dpill svg{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.dpill.up{color:#bff5d6;background:rgba(95,227,161,.14);border-color:rgba(95,227,161,.35)}
.dpill.down{color:#ffc3cb;background:rgba(255,122,138,.14);border-color:rgba(255,122,138,.35)}
.ccmp .cmk2{display:flex;gap:12px;font:600 13px var(--w-font);letter-spacing:.06em;text-transform:uppercase;color:var(--w-dim);padding-bottom:2px}
.ccmp .cmk2 i{width:10px;height:10px;border-radius:3px;margin-right:5px;display:inline-block;vertical-align:-1px}

/* ——— 14 · brush (a range selector under an area chart) ——— */
.cbrush{position:relative;width:100%;height:56px;min-width:0;border-radius:11px;overflow:hidden;
  background:var(--ch-plate);border:1px solid var(--ch-edge);touch-action:none;user-select:none;-webkit-user-select:none}
.cbrush svg{position:absolute;inset:0;display:block;width:100%;height:100%}
.cbrush .bmask{position:absolute;top:0;bottom:0;background:rgba(3,20,30,.66);pointer-events:none}
.cbrush .bwin{position:absolute;top:0;bottom:0;cursor:grab;border-left:1px solid rgba(46,200,232,.75);border-right:1px solid rgba(46,200,232,.75);
  background:rgba(46,200,232,.13);transition:background .16s ease}
.cbrush .bwin:hover{background:rgba(46,200,232,.2)}
.cbrush.drag .bwin{cursor:grabbing}
.cbrush .bh{position:absolute;top:0;bottom:0;width:12px;cursor:col-resize;display:flex;align-items:center;justify-content:center}
.cbrush .bh.l{left:-6px}.cbrush .bh.r{right:-6px}
.cbrush .bh::after{content:"";width:6px;height:28px;border-radius:99px;background:#2ec8e8;
  border:1px solid rgba(255,255,255,.7);box-shadow:0 2px 6px rgba(2,16,26,.5);transition:transform .16s var(--lg-snap)}
.cbrush .bh:hover::after{transform:scaleY(1.18)}
.cbrush .bh:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:-1px}
.cbrush .bh:focus:not(:focus-visible){outline:none}
.cbrush .blab{position:absolute;left:0;right:0;bottom:4px;text-align:center;font:600 13px var(--w-font);
  letter-spacing:.06em;text-transform:uppercase;color:var(--w-ink);pointer-events:none;white-space:nowrap;overflow:hidden}

/* ——— 15 · OpenTelemetry span waterfall ——— */
.cspans{display:flex;flex-direction:column;gap:1px;width:100%;min-width:0}
.cspans .sphead{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.1fr) 76px;gap:10px;
  font:600 13px var(--w-font);letter-spacing:.06em;text-transform:uppercase;color:var(--w-dim);padding:0 8px 5px}
.cspans .sprow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.1fr) 76px;gap:10px;align-items:center;
  padding:4px 8px;border-radius:9px;border:1px solid transparent;
  transition:background .14s ease,border-color .14s ease}
.cspans .sprow:hover{background:var(--ch-plate);border-color:var(--ch-edge)}
.cspans .spn{display:flex;align-items:center;gap:5px;min-width:0}
.cspans .spcar{width:15px;height:15px;flex:none;display:grid;place-items:center;border:0;background:transparent;padding:0;
  cursor:pointer;color:var(--w-dim);border-radius:4px;transition:color .14s ease,transform .18s var(--lg-snap)}
.cspans .spcar svg{width:10px;height:10px;stroke:currentColor;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.cspans .spcar:hover{color:var(--w-ink)}
.cspans .spcar.closed{transform:rotate(-90deg)}
.cspans .spcar.leaf{visibility:hidden}
.cspans .spcar:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:1px}
.cspans .spcar:focus:not(:focus-visible){outline:none}
.cspans .spnm{font:500 15px var(--w-font);color:var(--w-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.cspans .spt{position:relative;height:16px;min-width:0}
.cspans .spt::before{content:"";position:absolute;left:0;right:0;top:7px;height:1px;background:var(--ch-edge)}
.cspans .spb{position:absolute;top:2px;height:11px;border-radius:4px;transform-origin:left center;
  animation:meterin .5s var(--lg-spring) backwards;box-shadow:inset 0 1px 0 rgba(255,255,255,.3)}
.cspans .spb.err{background:var(--ch-err)}
.cspans .spd{font:600 13px var(--w-font);color:var(--w-soft);text-align:right;font-variant-numeric:tabular-nums}
.cspans .sprow.hid{display:none}
.cspans .spax{display:flex;justify-content:space-between;font:600 13px var(--w-font);color:var(--w-dim);
  font-variant-numeric:tabular-nums;padding:5px 8px 0}

/* ——— 16 · small multiples ——— */
.csmall{display:grid;grid-template-columns:repeat(auto-fit,minmax(142px,1fr));gap:9px;width:100%;min-width:0}
.csmall .smc{display:flex;flex-direction:column;gap:3px;padding:9px 11px 7px;border-radius:13px;min-width:0;
  background:var(--ch-plate);border:1px solid var(--ch-edge);box-shadow:inset 0 1px 0 rgba(255,255,255,.16);
  animation:cellfade .32s ease backwards;transition:transform .18s var(--lg-snap),border-color .18s ease}
.csmall .smc:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.3)}
.csmall .smn{font:600 13px var(--w-font);letter-spacing:.06em;text-transform:uppercase;color:var(--w-dim);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.csmall .smh{display:flex;align-items:baseline;gap:7px}
.csmall .smv{font:700 20px/1.15 var(--font);color:var(--w-ink);font-variant-numeric:tabular-nums}
.csmall .smd{margin-left:auto;font:700 13px var(--w-font);color:var(--w-dim);font-variant-numeric:tabular-nums}
.csmall .smd.up{color:var(--ch-ok)}.csmall .smd.down{color:var(--ch-err)}
.csmall .sms{position:relative;height:30px;margin-top:2px}
.csmall .sms svg{display:block;width:100%;height:30px;overflow:visible}
.csmall .sms path.l{fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:100;stroke-dashoffset:100;animation:sparkdraw .9s .12s ease-out forwards}
.csmall .sms path.f{opacity:0;animation:fadein .6s .5s ease forwards}

/* ——— 19 · skeleton + empty, shaped like the chart ——— */
.cskel{position:relative;width:100%;min-width:0;display:flex;flex-direction:column;gap:8px}
.cskel .csbody{display:flex;align-items:flex-end;gap:6px;width:100%}
.cskel .csbody .skel{flex:1;border-radius:7px 7px 3px 3px}
.cskel .csrow{display:flex;align-items:center;gap:10px}
.cskel .csrow .skel.nm{width:112px;flex:none;height:12px}
.cskel .csrow .skel.tk{flex:1;height:18px;border-radius:7px}
.cskel .csring{display:flex;align-items:center;gap:16px}
.cskel .csring .skel.ring{width:112px;height:112px;border-radius:50%;flex:none}
.cskel .csring .csbars{flex:1;display:flex;flex-direction:column;gap:7px}
.cskel .csfoot{display:flex;gap:8px}
.cskel .csfoot .skel{height:9px;width:58px;border-radius:99px}
.cempty .eact{margin-top:4px}

/* ——— a redraw is not an entrance ———
   Every chart rebuilds its SVG on resize, and a rebuilt element replays its one-shot. `nofx`
   is stamped on every animated shape from the SECOND paint onward, so widening a panel does
   not re-run the whole gallery. Declared late on purpose: it must outrank the component rules
   above it at equal specificity. */
.chart .nofx{animation:none;opacity:1}
/* a drawn line's offset goes to 0 (fully drawn); a donut / radial arc's offset is its DATUM (where the
   arc starts), so those keep their inline value — zeroing it stacked every arc at 12 o'clock (2026-09-04) */
.chart .nofx:not(circle.seg):not(circle.val){stroke-dashoffset:0}

/* ═══════════ the light scheme — every label, gridline, plate and tooltip on white ═══════════ */
.glass.light .chart .cval{fill:#0c2836}
.glass.light .chart .axis text.big{fill:#0c2836}
.glass.light .ctip .tt{color:#3f5d6c}
.glass.light .cfoot .cfs{color:#33505f}
.glass.light .cfoot .cft{color:#0c2836}
.glass.light .cleg button{color:#33505f}
.glass.light .cleg button:hover{color:#0c2836}
.glass.light .cleg button b{color:#0c2836}
.glass.light .chb .hbn span{color:#0c2836}
.glass.light .chb .hbn small{color:#33505f}
.glass.light .chb .hbv{color:#0c2836}
.glass.light .chb .hbrow.sel{background:rgba(15,125,149,.1);border-color:rgba(15,125,149,.4)}
.glass.light .chb .hbmax{color:#3f5d6c}
.glass.light .cdonut .dnum{color:#0c2836}.glass.light .cdonut .dsub{color:#3f5d6c}
.glass.light .cradial .rnum{color:#0c2836}.glass.light .cradial .rsub{color:#3f5d6c}
.glass.light .cradial .rrow{color:#33505f}.glass.light .cradial .rrow b{color:#0c2836}
.glass.light .cradar .rax{fill:#3f5d6c}
.glass.light .cheat .chc{background:rgba(4,40,56,.09)}
.glass.light .cheat .chc.l1{background:rgba(30,157,184,.34)}
.glass.light .cheat .chc.l2{background:rgba(30,157,184,.62)}
.glass.light .cheat .chc.l3{background:#0f7d95}
.glass.light .cheat .chc.l4{background:linear-gradient(160deg,#7f9d18,#5f7a0c)}
.glass.light .cheat .chy,.glass.light .cheat .chx{color:#3f5d6c}
.glass.light .cheat .chfoot{color:#33505f}
.glass.light .cheat .chfoot i{background:rgba(4,40,56,.09)}
.glass.light .cheat .chfoot i.l1{background:rgba(30,157,184,.34)}.glass.light .cheat .chfoot i.l2{background:rgba(30,157,184,.62)}
.glass.light .cheat .chfoot i.l3{background:#0f7d95}.glass.light .cheat .chfoot i.l4{background:linear-gradient(160deg,#7f9d18,#5f7a0c)}
.glass.light .cbullet .bln,.glass.light .cbullet .blv{color:#0c2836}
.glass.light .cbullet .blv small{color:#33505f}
.glass.light .cbullet .blk{background:#0c2836}
.glass.light .cbullet .blfoot{color:#3f5d6c}
.glass.light .ctree .tmc{border-color:rgba(4,40,56,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.5)}
.glass.light .ctree .tmc:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 8px 20px -8px rgba(23,48,62,.35)}
/* the light palette is dark ink on white, so a filled tile needs white type — the plate keeps ours */
.glass.light .ctree .tmn{color:#fff}.glass.light .ctree .tmv{color:rgba(255,255,255,.82)}
.glass.light .ctree .tmc.grp > .tmn{color:#0c2836}.glass.light .ctree .tmc.grp > .tmv{color:#33505f}
.glass.light .cev .evt,.glass.light .cev .evunit,.glass.light .cev .evgrid text{fill:#3f5d6c}
.glass.light .cev .evtot{fill:#33505f}
.glass.light .cev .evm > .evseg{stroke:#fff}
.glass.light .cev .evm:focus-visible > .evseg{stroke:#0c2836}
.glass.light .ccmp .cmn{color:#0c2836}
.glass.light .ccmp .cmk2{color:#3f5d6c}
.glass.light .dpill{color:#33505f}
.glass.light .dpill.up{color:#1d7d4f;background:rgba(29,125,79,.1);border-color:rgba(29,125,79,.3)}
.glass.light .dpill.down{color:#c8384c;background:rgba(200,56,76,.1);border-color:rgba(200,56,76,.3)}
.glass.light .cbrush{background:rgba(255,255,255,.6)}
.glass.light .cbrush .bmask{background:rgba(224,234,238,.82)}
.glass.light .cbrush .bwin{background:rgba(15,125,149,.13);border-left-color:rgba(15,125,149,.75);border-right-color:rgba(15,125,149,.75)}
.glass.light .cbrush .bwin:hover{background:rgba(15,125,149,.2)}
.glass.light .cbrush .bh::after{background:#0f7d95;border-color:#fff;box-shadow:0 2px 6px rgba(23,48,62,.3)}
.glass.light .cbrush .blab{color:#3f5d6c}
.glass.light .cspans .sphead,.glass.light .cspans .spd,.glass.light .cspans .spax{color:#33505f}
.glass.light .cspans .spnm{color:#0c2836}
.glass.light .cspans .spcar{color:#3f5d6c}
.glass.light .cspans .spcar:hover{color:#0c2836}
.glass.light .csmall .smc{background:rgba(255,255,255,.7);border-color:rgba(4,40,56,.13);box-shadow:inset 0 1px 0 #fff}
.glass.light .csmall .smc:hover{border-color:rgba(4,40,56,.28)}
.glass.light .csmall .smn{color:#3f5d6c}
.glass.light .csmall .smv{color:#0c2836}
.glass.light .csmall .smd{color:#33505f}

/* ═══════════ motion is a courtesy: everything collapses ═══════════ */
@media (prefers-reduced-motion:reduce){
  .cstack .sband{animation:none;opacity:1}
  .cbars .sseg,.chist .hb,.cradar .rpoly,.ctree .tmc,.csmall .smc,.cheat .chc,.cev .evm{animation:none}
  .cradar .rdot,.csmall .sms path.f{animation:none;opacity:1}
  .csmall .sms path.l{animation:none;stroke-dashoffset:0}
  .chb .hbf,.cbullet .blf,.ccmp .cmf,.cspans .spb{animation:none}
  .cdonut svg,.cdonut circle.seg,.cradial circle.val{animation:none}
  .chb .hbrow,.cspans .sprow,.cspans .spcar,.csmall .smc,.ctree .tmc,.cbrush .bwin,.cbrush .bh::after,.cleg button,.cev .evm > .evseg{transition:none}
}

/* ==== ../ui-kit/parts/data.css ==== */
/* ═══════════════════════════════════════════════════════════════════════════════════════
   Aegis Liquid Glass Kit — parts/data.css  (hand-authored; the DATA DISPLAY part)
   Tables, cells, lists, detail views, streams — everything the V2 admin dashboard needs to
   put a number, a name or an event on screen. Same roots as glass.css / console.css
   (.glass / .glass.light), same tokens, same doctrine:
     · one transition list per element; a state class never swaps the property set
     · entrances use animation-fill-mode: backwards (a `both` fill kills later hovers)
     · no filter animations, no sweeps, no glows, no wiggles
     · focus rings only for the keyboard; everything collapses under reduced motion
     · status is never colour alone — a dot and a word, always
     · density is a defect: the comfortable row is the default, compact is a choice
   Supersedes (does not replace) `.gtable` / Glass.table + `.tablewrap` / Glass.tableTools.
   ═══════════════════════════════════════════════════════════════════════════════════════ */

/* ——— part-local tokens: the hairlines, and the opaque grounds a sticky cell needs ———
   Scoped to .glass (not .dwrap) so the detail pieces — .kv, .diff, .statlist, .traces,
   .tree — get a hairline that survives the light scheme outside a table. */
.glass{--dbg:#0a2432;--dbg-h:#0e2c3c;--dbg-s:#0f3243;--dhead:#071f2c;
  --dline:rgba(255,255,255,.08);--dedge:rgba(255,255,255,.14)}
.glass.light{--dbg:#fff;--dbg-h:#f2f7fa;--dbg-s:#e6f2f6;--dhead:#eef4f7;
  --dline:rgba(4,40,56,.08);--dedge:rgba(4,40,56,.14)}

/* ═══════════ 1 · the data table ═══════════ */
.glass .dwrap{position:relative;display:flex;flex-direction:column;gap:10px;width:100%;min-width:0}
.glass .dxhint{display:inline-flex;align-items:center;gap:5px;margin:0 auto 0 4px;
  align-self:flex-end;padding:2px 0;border:0;background:transparent;cursor:pointer;
  font:600 13px var(--w-font);color:var(--w-dim);letter-spacing:.02em}
.glass .dxhint[hidden]{display:none}
.glass .dxhint .gicon{width:14px;height:14px}
.glass .dxhint:hover{color:var(--w-ink)}
.glass .dxhint:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:2px;border-radius:5px}

/* the toolbar: text filter · facets · spacer · columns · density */
.glass .dtool{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.glass .dtool .gsearch{flex:1 1 200px;min-width:158px;max-width:340px}
.glass .dtool .dspacer{flex:1 1 0;min-width:0}

/* ═══ the filter bar (2026-09-15) — search · the active filters as chips · Add filter · Clear all ═══
   Vadim (through Sam): "a more standard filter for tables with lots of data … take a look through
   NME" and "each filter should be searchable since there could be lots of values". NME's grid is
   search · Add Filter (a field picker) · Columns · paging, and its own audit asks for chips on the
   active criteria. A chip is FIELD · is / is not · VALUE with its own ×; the picker is one popover
   (`.fpop`, below) with two panes that slide. Nothing is drawn for a facet until it holds a value. */
.glass .fchips{display:flex;flex-wrap:wrap;align-items:center;gap:8px;flex:1 0 100%;min-width:0}
.glass .fchips[hidden]{display:none}
.glass .fchips .fclear{margin-left:2px}
.glass .fchip{display:inline-flex;align-items:stretch;height:36px;border-radius:99px;overflow:hidden;white-space:nowrap;font-size:15px;
  background:linear-gradient(160deg,rgba(30,157,184,.34),rgba(30,157,184,.18));box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 2px 8px -4px rgba(2,16,26,.5)}
.glass .fchip.new{animation:cellpop .22s var(--lg-snap) backwards}
.glass .fchip .fcb,.glass .fchip .fx{border:0;background:transparent;color:var(--w-ink);cursor:pointer;font:500 15px var(--w-font);
  display:inline-flex;align-items:center;transition:background .16s ease,color .16s ease}
.glass .fchip .fcb{gap:6px;padding:0 6px 0 13px}
.glass .fchip .fcb:hover{background:rgba(255,255,255,.1)}
.glass .fchip .fcb:focus-visible,.glass .fchip .fx:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:-2px}
.glass .fchip .fck{color:var(--w-soft)}
.glass .fchip .fco{color:var(--w-dim);font-size:13px}
.glass .fchip.not .fco{font-weight:700;color:var(--w-ink)}
.glass .fchip .fcv{font-weight:700;max-width:180px;overflow:hidden;text-overflow:ellipsis}
.glass .fchip .fx{width:30px;justify-content:center;color:var(--w-soft)}
.glass .fchip .fx:hover{background:rgba(255,255,255,.14);color:#fff}
.glass .fchip .fx svg{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round}
/* the picker button is quiet until a filter is on, then it takes the chip's own tint so the row reads as one family */
.glass .fadd{display:inline-flex;align-items:center;gap:7px;height:36px;padding:0 14px 0 11px;border-radius:99px;cursor:pointer;white-space:nowrap;
  font:600 15px var(--w-font);color:var(--w-soft);background:rgba(255,255,255,.07);border:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);
  transition:color .18s ease,background .18s ease,box-shadow .18s ease,transform .14s ease}
.glass .fadd svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.glass .fadd:hover{color:var(--w-ink);background:rgba(255,255,255,.12);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)}
.glass .fadd:active{transform:scale(.97);transition-duration:.08s}
.glass .fadd:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:2px}
.glass .fadd[aria-expanded=true]{color:var(--w-ink);background:rgba(30,157,184,.22);box-shadow:inset 0 0 0 1px rgba(107,197,214,.4)}
.glass .fclear{border:0;background:transparent;color:var(--w-dim);cursor:pointer;font:600 15px var(--w-font);height:36px;padding:0 8px;border-radius:99px;
  transition:color .16s ease,background .16s ease}
.glass .fclear:hover{color:var(--w-ink);background:rgba(255,255,255,.08)}
.glass .fclear:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:2px}
.glass .fclear[hidden]{display:none}
.glass.light .fchip{background:linear-gradient(160deg,rgba(30,157,184,.2),rgba(30,157,184,.1));box-shadow:inset 0 1px 0 #fff,0 2px 8px -4px rgba(23,48,62,.35)}
.glass.light .fchip .fcb,.glass.light .fchip .fx{color:#0c2836}
.glass.light .fchip .fcb:hover{background:rgba(4,40,56,.06)}
.glass.light .fchip .fck{color:#33505f}
.glass.light .fchip .fco{color:#3f5d6c}
.glass.light .fchip.not .fco{font-weight:700;color:#0c2836}
.glass.light .fchip .fx{color:#3f5d6c}
.glass.light .fchip .fx:hover{background:rgba(4,40,56,.1);color:#0c2836}
.glass.light .fadd{color:#33505f;background:rgba(4,40,56,.05);box-shadow:inset 0 0 0 1px rgba(4,40,56,.14)}
.glass.light .fadd:hover{color:#0c2836;background:rgba(4,40,56,.08);box-shadow:inset 0 0 0 1px rgba(4,40,56,.22)}
.glass.light .fadd[aria-expanded=true]{color:#0c2836;background:rgba(30,157,184,.16);box-shadow:inset 0 0 0 1px rgba(30,157,184,.45)}
.glass.light .fclear{color:#3f5d6c}
.glass.light .fclear:hover{color:#0c2836;background:rgba(4,40,56,.06)}

/* the picker popover: two panes that slide — the fields, then that field's values. Body-level and
   fixed like `.dmenu`, so a scroller cannot clip it; the same glass, the same entrance. */
.glass .fpop{position:fixed;width:min(292px,92vw);padding:0;border-radius:14px;z-index:80;overflow:hidden;
  background:linear-gradient(160deg,rgba(9,36,50,.97),rgba(6,28,40,.96));-webkit-backdrop-filter:blur(16px) saturate(1.6);backdrop-filter:blur(16px) saturate(1.6);
  box-shadow:0 14px 34px rgba(2,16,26,.5),inset 0 1px 0 rgba(255,255,255,.22),0 0 0 1px rgba(255,255,255,.1);
  opacity:0;transform:translateY(-4px) scale(.98);transform-origin:top left;pointer-events:none;transition:opacity .14s ease,transform .2s var(--lg-snap)}
.glass .fpop.on{opacity:1;transform:none;pointer-events:auto}
.glass .fpop .fpanes{position:relative}
.glass .fpop .fpane{padding:6px}
.glass .fpop .fpane:not(.on){position:absolute;top:0;left:0;right:0;height:0;overflow:hidden;visibility:hidden;opacity:0;pointer-events:none;
  transition:opacity .18s ease,transform .22s var(--lg-snap),visibility 0s .22s}
.glass .fpop .fpane.on{position:relative;visibility:visible;opacity:1;transform:none;transition:opacity .18s ease,transform .22s var(--lg-snap)}
.glass .fpop .fpanes[data-dir=fwd] .fpf:not(.on){transform:translateX(-22px)}
.glass .fpop .fpanes[data-dir=fwd] .fpv.on{animation:fpin .22s var(--lg-snap)}
.glass .fpop .fpanes[data-dir=back] .fpv:not(.on){transform:translateX(22px)}
.glass .fpop .fpanes[data-dir=back] .fpf.on{animation:fpback .22s var(--lg-snap)}
@keyframes fpin{from{opacity:0;transform:translateX(22px)}to{opacity:1;transform:none}}
@keyframes fpback{from{opacity:0;transform:translateX(-22px)}to{opacity:1;transform:none}}
.glass .fpop .fph{display:flex;align-items:center;gap:6px;height:36px;padding:0 6px 0 10px}
.glass .fpop .fpt{font:700 13px var(--w-font);letter-spacing:.06em;text-transform:uppercase;color:var(--w-dim);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.glass .fpop .fpback{width:26px;height:26px;margin-left:-6px;border:0;border-radius:8px;background:transparent;color:var(--w-soft);cursor:pointer;display:grid;place-items:center;transition:background .14s ease,color .14s ease}
.glass .fpop .fpback:hover{background:rgba(255,255,255,.1);color:var(--w-ink)}
.glass .fpop .fpback:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:-2px}
.glass .fpop .fpback svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
/* the search inside the pane: the kit's search field, one step smaller */
.glass .fpop .fps{display:flex;align-items:center;gap:8px;height:36px;margin:2px 4px 6px;padding:0 10px;border-radius:10px;
  background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);transition:box-shadow .16s ease,background .16s ease}
.glass .fpop .fps:focus-within{background:rgba(255,255,255,.09);box-shadow:inset 0 0 0 1px rgba(107,197,214,.7),0 0 0 3px rgba(107,197,214,.16)}
.glass .fpop .fps svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;color:var(--w-dim);flex:none}
.glass .fpop .fps input{flex:1;min-width:0;border:0;outline:none;background:transparent;color:var(--w-ink);font:500 15px var(--w-font)}
.glass .fpop .fps input::placeholder{color:var(--w-dim)}
/* include · exclude: a two-cell segmented with the tray's sliding thumb */
.glass .fpop .fpop2{position:relative;display:grid;grid-template-columns:1fr 1fr;margin:0 4px 6px;padding:3px;border-radius:99px;background:rgba(255,255,255,.08)}
.glass .fpop .fpop2 button{position:relative;z-index:1;height:26px;border:0;border-radius:99px;background:transparent;color:var(--w-dim);cursor:pointer;font:600 13px var(--w-font);transition:color .18s ease}
.glass .fpop .fpop2 button.on{color:var(--w-ink)}
.glass .fpop .fpop2 button:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:-2px}
.glass .fpop .fpop2 .fpthumb{position:absolute;top:3px;bottom:3px;left:3px;width:calc(50% - 3px);border-radius:99px;
  background:linear-gradient(160deg,rgba(30,157,184,.72),rgba(30,157,184,.4));box-shadow:0 2px 8px rgba(30,157,184,.35);transition:transform .22s var(--lg-snap),background .22s ease}
.glass .fpop .fpop2.not .fpthumb{transform:translateX(100%)}
.glass .fpop .fpl{max-height:min(38vh,300px);overflow:auto;overscroll-behavior:contain}
.glass .fpop .fpl::-webkit-scrollbar{width:5px}
.glass .fpop .fpl::-webkit-scrollbar-thumb{background:rgba(107,197,214,.42);border-radius:99px}
.glass .fpop .fpi{display:flex;align-items:center;gap:9px;height:37px;padding:0 10px;border-radius:9px;cursor:pointer;color:var(--w-ink);font:500 15px var(--w-font);
  transition:background .12s ease}
.glass .fpop .fpi:hover,.glass .fpop .fpi:focus-visible{background:rgba(255,255,255,.1);outline:none}
.glass .fpop .fpi .fpit{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.glass .fpop .fpi .fpin{min-width:20px;height:20px;padding:0 6px;border-radius:99px;display:grid;place-items:center;font:700 13px var(--w-font);color:#04212c;background:var(--lg-cyan)}
.glass .fpop .fpi .fpichev{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;color:var(--w-dim);flex:none}
.glass .fpop .fpi .dmc{width:16px;height:16px;flex:none;display:grid;place-items:center;border-radius:4px;border:1.5px solid rgba(255,255,255,.4);transition:background .16s ease,border-color .16s ease}
.glass .fpop .fpi .dmc svg{width:11px;height:11px;stroke:#0d2b1c;fill:none;stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:20;stroke-dashoffset:20;transition:stroke-dashoffset .2s var(--lg-snap)}
.glass .fpop .fpi[aria-selected=true] .dmc{background:linear-gradient(160deg,#d9ff7a,#c3f23e);border-color:rgba(217,255,122,.8)}
.glass .fpop .fpi[aria-selected=true] .dmc svg{stroke-dashoffset:0}
.glass .fpop .fpi .fpdot{width:7px;height:7px;border-radius:50%;flex:none}
.glass .fpop .fpi .dmn{margin-left:auto;font:600 13px var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-dim)}
.glass .fpop .fpempty{padding:16px 10px 18px;text-align:center;font:500 15px var(--w-font);color:var(--w-dim)}
.glass .fpop .fpfoot{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:34px;padding:4px 4px 0 10px;margin-top:2px;box-shadow:inset 0 1px 0 rgba(255,255,255,.1)}
.glass .fpop .fpfoot .fpn{font:500 13px var(--w-font);color:var(--w-dim)}
.glass .fpop .fpfoot .gbtn2{height:30px;padding:0 10px;font-size:15px}
.glass .fpop .fpfoot .gbtn2[hidden],.glass .fpop .fpfoot[hidden]{display:none}
.glass.light .fpop{background:linear-gradient(160deg,#fff,#f4f8fb);box-shadow:0 14px 34px rgba(23,48,62,.2),inset 0 1px 0 #fff,0 0 0 1px rgba(4,40,56,.14)}
.glass.light .fpop .fpt,.glass.light .fpop .fps svg,.glass.light .fpop .fps input::placeholder,.glass.light .fpop .fpi .dmn,.glass.light .fpop .fpi .fpichev,.glass.light .fpop .fpempty,.glass.light .fpop .fpfoot .fpn{color:#3f5d6c}
.glass.light .fpop .fpback{color:#3f5d6c}
.glass.light .fpop .fpback:hover{background:rgba(4,40,56,.07);color:#0c2836}
.glass.light .fpop .fps{background:rgba(4,40,56,.05);box-shadow:inset 0 0 0 1px rgba(4,40,56,.14)}
.glass.light .fpop .fps:focus-within{background:#fff;box-shadow:inset 0 0 0 1px rgba(15,125,149,.7),0 0 0 3px rgba(15,125,149,.14)}
.glass.light .fpop .fps input,.glass.light .fpop .fpi{color:#0c2836}
.glass.light .fpop .fpi:hover,.glass.light .fpop .fpi:focus-visible{background:rgba(4,40,56,.06)}
.glass.light .fpop .fpi .dmc{border-color:rgba(4,40,56,.3);background:#fff}
.glass.light .fpop .fpop2{background:rgba(4,40,56,.07)}
.glass.light .fpop .fpop2 button.on{color:#fff}
.glass.light .fpop .fpop2 .fpthumb{background:linear-gradient(160deg,#157f9a,#0e6075);box-shadow:0 2px 8px rgba(15,125,149,.3)}
.glass.light .fpop .fpfoot{box-shadow:inset 0 1px 0 rgba(4,40,56,.1)}

/* the floating menu (row actions, facets, columns) — body-level so a scroller cannot clip it.
   A MENU IS NEVER TALLER THAN THE SPACE IT HAS. The Columns menu on Spend › Users and on Migration
   is 449 px of column list; its button sits at y 765 (Migration 846) in a 900 px viewport, so the
   kit's placer — which prefers below and flips up when the menu does not fit — opened it 450 px
   ABOVE the button, over the chart it filters and over the CACHE WRITE card (A1 #17, 2026-09-15).
   The cap makes the menu fit: it opens below wherever the space below can hold 340 px, and where it
   still has to flip it now hugs its button instead of covering half the room. The list scrolls.
   (The placement itself is `G.dropdown`'s `place()` in parts/data.js, which this wave does not own;
   its right-edge alignment was already correct — measured, menu.right − button.right = 0.) */
.glass .dmenu{position:fixed;min-width:206px;max-width:min(320px,92vw);padding:5px;border-radius:13px;z-index:80;
  max-height:min(42vh,340px);overflow-y:auto;overscroll-behavior:contain;
  scrollbar-width:thin;scrollbar-color:rgba(107,197,214,.45) transparent;
  background:linear-gradient(160deg,rgba(9,36,50,.97),rgba(6,28,40,.96));-webkit-backdrop-filter:blur(16px) saturate(1.6);backdrop-filter:blur(16px) saturate(1.6);
  border:1px solid rgba(255,255,255,.22);box-shadow:0 12px 30px rgba(2,16,26,.5),inset 0 1px 0 rgba(255,255,255,.3);
  opacity:0;transform:translateY(-4px) scale(.98);transform-origin:top left;pointer-events:none;
  transition:opacity .14s ease,transform .2s var(--lg-snap)}
.glass .dmenu.on{opacity:1;transform:none;pointer-events:auto}
.glass .dmenu::-webkit-scrollbar{width:5px}
.glass .dmenu::-webkit-scrollbar-thumb{background:rgba(107,197,214,.42);border-radius:99px}
.glass.light .dmenu{scrollbar-color:rgba(15,125,149,.4) transparent}
.glass.light .dmenu::-webkit-scrollbar-thumb{background:rgba(15,125,149,.38)}
.glass .dmenu .dmi{display:flex;align-items:center;gap:9px;height:37px;padding:0 11px;border-radius:9px;cursor:pointer;color:var(--w-ink);
  font:500 15px var(--w-font);transition:background .14s ease}
.glass .dmenu .dmi:hover,.glass .dmenu .dmi.hl{background:rgba(255,255,255,.1)}
.glass .dmenu .dmi.danger{color:#ff9aa6}
.glass .dmenu .dmi .dmc{width:15px;height:15px;flex:none;display:grid;place-items:center;border-radius:4px;
  border:1px solid rgba(255,255,255,.34);background:rgba(255,255,255,.06)}
.glass .dmenu .dmi .dmc svg{width:11px;height:11px;stroke:#0d2b1c;fill:none;stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:24;stroke-dashoffset:24;transition:stroke-dashoffset .22s ease}
.glass .dmenu .dmi[aria-checked=true] .dmc{background:linear-gradient(160deg,#d9ff7a,#c3f23e);border-color:rgba(217,255,122,.8)}
.glass .dmenu .dmi[aria-checked=true] .dmc svg{stroke-dashoffset:0}
.glass .dmenu .dmi .dmn{margin-left:auto;font:600 13px var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-dim)}
.glass .dmenu .dmi .dmt{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.glass .dmenu .dmsep{height:1px;margin:5px 6px;background:rgba(255,255,255,.12)}
/* the column / filter menu's heading — a caption, but 12.5 is the floor for every caption on a
   console surface (Sam, 2026-09-15); only the sidebar's group caption sits under it */
.glass .dmenu .dmh{font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--w-dim);padding:8px 11px 4px}
.glass.light .dmenu{background:linear-gradient(160deg,#fff,#f4f8fb);border-color:rgba(4,40,56,.18);box-shadow:0 12px 30px rgba(23,48,62,.2),inset 0 1px 0 #fff}
.glass.light .dmenu .dmi{color:#0c2836}
.glass.light .dmenu .dmi:hover,.glass.light .dmenu .dmi.hl{background:rgba(4,40,56,.06)}
.glass.light .dmenu .dmi.danger{color:#c8384c}
.glass.light .dmenu .dmi .dmc{border-color:rgba(4,40,56,.3);background:#fff}
.glass.light .dmenu .dmi .dmn{color:#3f5d6c}
.glass.light .dmenu .dmsep{background:rgba(4,40,56,.1)}
.glass.light .dmenu .dmh{color:#3f5d6c}

/* the scroller: wide tables scroll INSIDE their own box, never the page */
.glass .dscroll{width:100%;min-width:0;overflow-x:auto;overflow-y:auto;border-radius:14px;
  background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.03));border:1px solid var(--dedge);
  scrollbar-width:thin;scrollbar-color:rgba(107,197,214,.4) transparent;
  transition:padding-bottom .28s var(--lg-snap)}
.glass .dscroll:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:2px}
.glass .dscroll.can-left{box-shadow:inset 18px 0 18px -20px rgba(46,200,232,.9)}
.glass .dscroll.can-right{box-shadow:inset -18px 0 18px -20px rgba(46,200,232,.9)}
.glass .dscroll.can-left.can-right{box-shadow:inset 18px 0 18px -20px rgba(46,200,232,.9),inset -18px 0 18px -20px rgba(46,200,232,.9)}
/* the bulk bar floats — so the table makes room for it rather than letting it cover a row */
.glass .dwrap.hassel .dscroll{padding-bottom:44px}
.glass .dscroll::-webkit-scrollbar{width:7px;height:7px}
.glass .dscroll::-webkit-scrollbar-thumb{background:rgba(107,197,214,.35);border-radius:99px}
.glass .dscroll::-webkit-scrollbar-track{background:transparent}
.glass.light .dscroll{background:linear-gradient(160deg,#fff,rgba(255,255,255,.8))}

.glass .dtable{width:100%;border-collapse:separate;border-spacing:0;font:500 15px var(--w-font);color:var(--w-ink);table-layout:auto}
/* 12.5 px is the floor for a table header — it is a word on the surface, not a group caption — and
   the tracking comes DOWN from .12em to .06em as the word grows, so the column keeps the width the
   cell under it needs (Sam's second pass + Astra's read, 2026-09-15) */
.glass .dtable th{position:sticky;top:0;z-index:2;text-align:left;white-space:nowrap;user-select:none;
  font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--w-dim);
  padding:11px 14px;background:var(--dhead);border-bottom:1px solid var(--dedge);transition:color .18s ease,padding .26s var(--lg-snap)}
.glass .dtable th.sortable{cursor:pointer}
.glass .dtable th.sortable:hover,.glass .dtable th[aria-sort]{color:var(--w-ink)}
.glass .dtable th:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:-2px}
.glass .dtable th .dsort{display:inline-grid;place-items:center;width:12px;height:12px;margin-left:5px;vertical-align:-1px;opacity:0;
  transition:opacity .18s ease,transform .3s var(--lg-spring)}
.glass .dtable th .dsort svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.glass .dtable th.sortable:hover .dsort{opacity:.4}
.glass .dtable th[aria-sort] .dsort{opacity:1}
.glass .dtable th[aria-sort=descending] .dsort{transform:rotate(180deg)}
.glass .dtable td{padding:11px 14px;line-height:26px;border-bottom:1px solid var(--dline);vertical-align:middle;font-variant-numeric:tabular-nums;
  transition:background .18s ease,padding .26s var(--lg-snap)}
/* one axis for everything in a row: the 26 px line box matches the avatar, the chips and the
   status pill, and every inline piece hangs from its middle rather than the text baseline
   (22 px until the 2026-09-14 type step, 24 until the second step on 2026-09-15) */
.glass .dtable td>*,.glass .dtable td>.cellw>*{vertical-align:middle}
.glass .dtable tbody tr:last-child>td{border-bottom:0}
.glass .dtable td.num,.glass .dtable th.num{text-align:right}
.glass .dtable td.dim{color:var(--w-dim)}
/* a cell's width budget: an explicit max-width here is what lets .trunc actually truncate
   inside an auto-layout table — the td alone would grow to fit the content */
/* --cw is the column's cap, --cwx what the browser allotted the cell beyond it (data.js fitNow) */
.glass .cellw{display:block;min-width:0;max-width:calc(var(--cw,100%) + var(--cwx,0px))}
/* caps lifted: the table measured that it fits its scroller with nothing clamped */
.glass .dwrap.relax .cellw{max-width:none}
.glass .dtable td.stick .cellw{max-width:var(--cw,100%)}

/* the rows: soft entrance, staggered by the renderer */
.glass .dtable tbody tr.drow{animation:cellin .28s var(--lg-spring) backwards}
.glass .dtable tbody tr.drow:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:-2px}
.glass .dtable tbody tr.drow:hover>td{background:var(--dbg-h)}
.glass .dtable tbody tr.sel>td{background:var(--dbg-s)}
.glass .dtable tbody tr.clickable{cursor:pointer}

/* sticky first column: an opaque ground of its own, or the scrolled cells show through */
.glass .dtable th.stick,.glass .dtable td.stick{position:sticky;left:0;background:var(--dbg)}
.glass .dtable th.stick{z-index:3;background:var(--dhead)}
.glass .dtable td.stick::after{content:"";position:absolute;top:0;right:0;bottom:0;width:1px;background:var(--dline)}
.glass .dtable tbody tr.drow:hover>td.stick{background:var(--dbg-h)}
.glass .dtable tbody tr.sel>td.stick{background:var(--dbg-s)}
.glass .dtable td.selcol,.glass .dtable th.selcol{width:40px;padding-right:0}
.glass .dtable td.expcol,.glass .dtable th.expcol{width:34px;padding-right:0;padding-left:10px}
.glass .dtable td.actcol,.glass .dtable th.actcol{width:46px;text-align:right;padding-left:0}
.glass .dtable td.gripcol,.glass .dtable th.gripcol{width:28px;padding-right:0;padding-left:10px}
.glass .dtable td.hidec,.glass .dtable th.hidec{display:none}
.glass .dtable .chk i{width:16px;height:16px;border-radius:4px}
/* the console's dasharray of 20 is a shade shorter than the check path — at this size the
   leftover nub shows as a dot inside an "empty" box. Overshoot the dash instead. */
.glass .dtable .chk i svg{inset:2px;width:11px;height:11px;stroke-dasharray:24;stroke-dashoffset:24}
.glass .dtable .chk.on i svg{stroke-dashoffset:0}
/* the check-all's indeterminate state is DRAWN — a bar, not a half-check */
.glass .chk.ind i{background:linear-gradient(160deg,#d9ff7a,#c3f23e);border-color:rgba(217,255,122,.8)}
.glass .chk.ind i::before{content:"";position:absolute;left:3px;right:3px;top:50%;height:2px;margin-top:-1px;border-radius:2px;background:#0d2b1c}
.glass .chk.ind i svg{stroke-dashoffset:20}
.glass.light .chk.ind i{border-color:rgba(122,168,28,.7)}

/* density: comfortable is the default; compact is a deliberate choice */
.glass .dwrap.compact .dtable td{padding:8px 12px}
.glass .dwrap.compact .dtable th{padding:8px 12px}
.glass .dwrap.compact .dtable .avatar{width:22px;height:22px;font-size:13px}

/* the footer: count on the left, rows-per-page + pager on the right */
.glass .dfoot{display:flex;align-items:center;gap:12px;flex-wrap:wrap;min-height:36px;font:500 15px var(--w-font);color:var(--w-dim)}
.glass .dfoot .dcount{flex:1 1 auto;min-width:0;font-variant-numeric:tabular-nums}
.glass .dfoot .drpp{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.glass .dfoot .dpage{white-space:nowrap;font-variant-numeric:tabular-nums}
.glass.light .dfoot{color:#3f5d6c}

/* the bulk bar: rises out of the table's foot the moment a row is selected */
.glass .dbulk{position:absolute;left:50%;bottom:40px;z-index:7;display:flex;align-items:center;gap:10px;padding:7px 8px 7px 14px;border-radius:99px;
  color:var(--w-ink);background:linear-gradient(160deg,rgba(9,36,50,.96),rgba(6,28,40,.95));
  -webkit-backdrop-filter:blur(16px) saturate(1.6);backdrop-filter:blur(16px) saturate(1.6);
  border:1px solid rgba(255,255,255,.24);box-shadow:0 12px 30px rgba(2,16,26,.5),inset 0 1px 0 rgba(255,255,255,.3);
  opacity:0;transform:translate(-50%,14px);pointer-events:none;
  transition:opacity .2s ease,transform .34s var(--lg-spring)}
.glass .dwrap.hassel .dbulk{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.glass .dbulk .dbn{font:700 15px var(--w-font);font-variant-numeric:tabular-nums;white-space:nowrap}
.glass .dbulk .dbn small{font:500 15px var(--w-font);color:var(--w-dim);margin-left:4px}
.glass .dbulk .dbsep{width:1px;height:22px;background:rgba(255,255,255,.2)}
.glass .dbulk .gbtn2{height:32px;padding:0 13px;font-size:15px}
.glass.light .dbulk{color:#0c2836;background:linear-gradient(160deg,#fff,#f2f7fa);border-color:rgba(4,40,56,.18);box-shadow:0 12px 30px rgba(23,48,62,.22),inset 0 1px 0 #fff}
.glass.light .dbulk .dbn small{color:#3f5d6c}
.glass.light .dbulk .dbsep{background:rgba(4,40,56,.14)}

/* ═══════════ 2 · row expand ═══════════ */
.glass .dtable tr.dexp>td{padding:0;border-bottom:1px solid var(--dline);background:rgba(255,255,255,.03)}
.glass .dtable tr.dexp .dexpg{display:grid;grid-template-rows:0fr;transition:grid-template-rows .32s var(--lg-spring)}
.glass .dtable tr.dexp.open .dexpg{grid-template-rows:1fr}
.glass .dtable tr.dexp .dexpg>div{overflow:hidden;min-height:0}
.glass .dtable tr.dexp .dexpb{padding:0 16px;font:400 15px/1.55 var(--w-font);color:var(--w-soft)}
.glass .dtable tr.dexp.open .dexpb{padding:12px 16px 14px}
.glass .dchev{width:20px;height:20px;display:inline-grid;place-items:center;border-radius:6px;border:0;padding:0;cursor:pointer;flex:none;
  color:var(--w-dim);background:transparent;transition:transform .26s var(--lg-snap),color .16s ease,background .16s ease}
.glass .dchev svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.glass .dchev:hover{color:var(--w-ink);background:rgba(255,255,255,.1)}
.glass .dchev:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:1px}
.glass .dchev.open{transform:rotate(90deg)}
.glass.light .dtable tr.dexp>td{background:rgba(4,40,56,.03)}
.glass.light .dchev:hover{color:#0c2836;background:rgba(4,40,56,.07)}

/* ═══════════ 3 · group rows ═══════════ */
.glass .dtable tr.dgrp>td{padding:0;border-bottom:1px solid var(--dline);background:var(--dhead)}
.glass .dtable tr.dgrp .dgh{display:flex;align-items:center;gap:9px;width:100%;padding:8px 14px;border:0;background:transparent;cursor:pointer;text-align:left;
  font:700 13px var(--w-font);letter-spacing:.06em;text-transform:uppercase;color:var(--w-dim);transition:color .16s ease}
.glass .dtable tr.dgrp .dgh:hover{color:var(--w-ink)}
.glass .dtable tr.dgrp .dgh:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:-2px}
.glass .dtable tr.dgrp .dgn{margin-left:auto;letter-spacing:0;text-transform:none;font-size:15px;font-variant-numeric:tabular-nums;color:var(--w-dim)}
.glass.light .dtable tr.dgrp .dgh:hover{color:#0c2836}

/* ═══════════ 4 · cell types ═══════════ */
/* every cell type carries its own type size — a cell must read the same inside a table,
   inside a drawer and on its own in a card */
.glass .cperson{display:flex;align-items:center;gap:8px;min-width:0;font:500 15px var(--w-font)}
/* the initial inside a cell avatar is text like any other: 12.5 is the floor, so the disc grows
   with it and the row's line box grew to 26 to match (2026-09-15) */
.glass .cperson .avatar{width:26px;height:26px;font-size:13px;border-width:1px;flex:none;transition:width .26s var(--lg-snap),height .26s var(--lg-snap)}
.glass .cmodel{display:inline-flex;align-items:center;gap:7px;height:26px;max-width:100%;padding:0 10px 0 9px;border-radius:99px;min-width:0;
  font:600 15px var(--w-font);color:var(--w-ink);background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16)}
.glass .cmodel i{width:6px;height:6px;border-radius:50%;flex:none;background:var(--mc,#2ec8e8)}
.glass .cmodel span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.glass.light .cmodel{color:#0c2836;background:rgba(4,40,56,.05);border-color:rgba(4,40,56,.14)}
.glass .cnum{font:600 15px var(--w-font);font-variant-numeric:tabular-nums;white-space:nowrap}
.glass .cnum small{font:500 13px var(--w-font);color:var(--w-dim);margin-left:3px}
.glass .cusd::before{content:"$";color:var(--w-dim);margin-right:1px}
.glass .cprog{display:flex;align-items:center;gap:9px;min-width:110px}
.glass .cprog .ptrack{position:relative;flex:1;min-width:34px;height:6px;border-radius:99px;overflow:hidden;
  background:rgba(255,255,255,.11);box-shadow:inset 0 1px 2px rgba(0,10,16,.3)}
.glass .cprog .ptrack i{position:absolute;left:0;top:0;bottom:0;border-radius:99px;background:linear-gradient(90deg,#1E9DB8,#2ec8e8 65%,#d9ff7a);
  transform-origin:left;animation:meterin .5s var(--lg-spring) backwards}
.glass .cprog b{font:700 15px var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-ink);width:40px;text-align:right;flex:none}
.glass.light .cprog .ptrack{background:rgba(4,40,56,.1);box-shadow:inset 0 1px 2px rgba(23,48,62,.15)}
.glass.light .cprog b{color:#0c2836}
.glass .cspark{display:inline-block;width:64px;height:20px;vertical-align:middle;line-height:0}
.glass .cspark svg{display:block;width:64px;height:20px;overflow:visible}
.glass .cspark .csl{fill:none;stroke:var(--spk,#2ec8e8);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.glass .cspark .csd{fill:var(--spk,#2ec8e8)}
.glass .status.off i{background:var(--w-dim);box-shadow:none}
.glass .cdelta{display:inline-flex;align-items:center;gap:3px;height:23px;padding:0 8px 0 6px;border-radius:99px;
  font:700 13px var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-soft);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16)}
.glass .cdelta svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.glass .cdelta.up{color:#bff5d6;background:rgba(95,227,161,.14);border-color:rgba(95,227,161,.35)}
.glass .cdelta.down{color:#ffc3cb;background:rgba(255,122,138,.14);border-color:rgba(255,122,138,.35)}
.glass.light .cdelta{color:#33505f;background:rgba(4,40,56,.05);border-color:rgba(4,40,56,.14)}
.glass.light .cdelta.up{color:#1d7d4f;background:rgba(29,125,79,.1);border-color:rgba(29,125,79,.3)}
.glass.light .cdelta.down{color:#c8384c;background:rgba(200,56,76,.1);border-color:rgba(200,56,76,.3)}
.glass .ctime{font:500 15px var(--w-font);white-space:nowrap;color:var(--w-dim);font-variant-numeric:tabular-nums;
  border-bottom:1px dotted rgba(255,255,255,.24);cursor:help}
.glass.light .ctime{color:#3f5d6c;border-bottom-color:rgba(4,40,56,.24)}
.glass .ctags{display:flex;align-items:center;gap:4px;min-width:0;flex-wrap:nowrap;overflow:hidden}
.glass .ctags .tag{display:inline-flex;align-items:center;height:23px;padding:0 9px;border-radius:99px;white-space:nowrap;flex:none;
  font:600 13px var(--w-font);color:var(--w-soft);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15)}
.glass .ctags .tag.more{color:var(--w-ink);background:rgba(30,157,184,.22);border-color:rgba(107,197,214,.4);cursor:default}
.glass.light .ctags .tag{color:#33505f;background:rgba(4,40,56,.05);border-color:rgba(4,40,56,.13)}
.glass.light .ctags .tag.more{color:#0c2836;background:rgba(30,157,184,.16);border-color:rgba(30,157,184,.38)}
.glass .cact{width:30px;height:30px;border-radius:8px;border:0;padding:0;display:inline-grid;place-items:center;cursor:pointer;
  color:var(--w-dim);background:transparent;transition:color .16s ease,background .16s ease,transform .12s ease}
.glass .cact svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round}
.glass .cact:hover{color:var(--w-ink);background:rgba(255,255,255,.12)}
.glass .cact:active{transform:scale(.9);transition-duration:.08s}
.glass .cact:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:1px}
.glass.light .cact:hover{color:#0c2836;background:rgba(4,40,56,.07)}
.glass .dgrip{width:24px;height:26px;border-radius:6px;border:0;padding:0;display:inline-grid;place-items:center;cursor:grab;touch-action:none;
  color:var(--w-dim);background:transparent;transition:color .16s ease,background .16s ease}
.glass .dgrip svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round}
.glass .dgrip:hover{color:var(--w-ink);background:rgba(255,255,255,.1)}
.glass .dgrip:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:1px}
.glass .dtable tbody tr.dragging{opacity:.55;cursor:grabbing}
.glass .dtable tbody tr.gliding>td{transition:background .18s ease,padding .26s var(--lg-snap)}
.glass.light .dgrip:hover{color:#0c2836;background:rgba(4,40,56,.07)}

/* ═══════════ 5 · truncation ═══════════ */
.glass .trunc{display:block;min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.glass .trunc2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-width:0;max-width:100%;line-height:1.45}

/* ═══════════ 6 · key–value block ═══════════ */
.glass .kv{display:grid;grid-template-columns:minmax(110px,auto) 1fr;gap:0;width:100%;min-width:0;font:500 15px var(--w-font)}
.glass .kv .kvk{padding:8px 14px 8px 0;color:var(--w-dim);border-bottom:1px solid var(--dline,rgba(255,255,255,.08));white-space:nowrap}
.glass .kv .kvv{display:flex;align-items:center;gap:8px;min-width:0;padding:8px 0;color:var(--w-ink);border-bottom:1px solid var(--dline,rgba(255,255,255,.08));
  font-variant-numeric:tabular-nums}
.glass .kv>:nth-last-child(-n+2){border-bottom:0}
.glass .kvcopy{width:24px;height:24px;border-radius:7px;border:0;padding:0;flex:none;display:grid;place-items:center;cursor:pointer;opacity:0;
  color:var(--w-dim);background:rgba(255,255,255,.08);transition:opacity .16s ease,color .16s ease,background .16s ease}
.glass .kvv:hover .kvcopy,.glass .kvcopy:focus-visible{opacity:1}
.glass .kvcopy:hover{color:var(--w-ink);background:rgba(255,255,255,.18)}
.glass .kvcopy:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:1px}
.glass .kvcopy svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.glass .kvcopy .ck2{stroke-dasharray:20;stroke-dashoffset:20}
.glass .kvcopy.done{color:#0d2b1c;background:linear-gradient(160deg,#d9ff7a,#c3f23e);opacity:1}
.glass .kvcopy.done .ck2{stroke-dashoffset:0;transition:stroke-dashoffset .26s ease}
.glass .kvcopy.done svg:not(.ck2){opacity:0}
.glass.light .kv .kvk{color:#3f5d6c}
.glass.light .kv .kvv{color:#0c2836}
.glass.light .kvcopy{color:#3f5d6c;background:rgba(4,40,56,.07)}
.glass.light .kvcopy:hover{color:#0c2836;background:rgba(4,40,56,.13)}

/* ═══════════ 7 · stat list ═══════════ */
.glass .statlist{display:flex;flex-direction:column;width:100%;min-width:0}
.glass .statlist .slr{display:flex;align-items:center;gap:12px;padding:9px 0;border-bottom:1px solid var(--dline,rgba(255,255,255,.08));min-width:0;
  animation:cellin .28s var(--lg-spring) backwards}
.glass .statlist .slr:last-child{border-bottom:0}
.glass .statlist .sll{flex:1;min-width:0;font:500 15px var(--w-font);color:var(--w-soft)}
.glass .statlist .slv{font:700 20px/1 var(--font);font-variant-numeric:tabular-nums;letter-spacing:-.01em;color:var(--w-ink);white-space:nowrap}
.glass .statlist .slv small{font:600 15px var(--w-font);color:var(--w-dim);margin-left:3px}
.glass.light .statlist .slv{color:#0c2836}

/* ═══════════ 8 · diff ═══════════ */
.glass .diff{display:flex;flex-direction:column;border-radius:12px;overflow:hidden;border:1px solid var(--dedge,rgba(255,255,255,.14));width:100%;min-width:0}
.glass .diff .dfl{display:flex;align-items:center;gap:10px;padding:8px 12px 8px 9px;font:500 15px var(--w-font);color:var(--w-soft);
  border-bottom:1px solid var(--dline,rgba(255,255,255,.07));min-width:0}
.glass .diff .dfl:last-child{border-bottom:0}
.glass .diff .dfs{width:15px;height:15px;flex:none;display:grid;place-items:center;color:var(--w-dim)}
.glass .diff .dfs svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.6;stroke-linecap:round}
.glass .diff .dfk{flex:0 0 40%;min-width:0;color:var(--w-dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.glass .diff .dfv{flex:1;min-width:0;font-variant-numeric:tabular-nums;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--w-ink)}
.glass .diff .dfl.add{background:rgba(205,255,78,.1)}
.glass .diff .dfl.add .dfs{color:#d9ff7a}
.glass .diff .dfl.del{background:rgba(167,149,199,.14)}
.glass .diff .dfl.del .dfs{color:#cdbfe8}
.glass .diff .dfl.del .dfv{text-decoration:line-through;text-decoration-thickness:1px;color:var(--w-soft)}
.glass.light .diff .dfl{color:#33505f}
.glass.light .diff .dfk{color:#3f5d6c}
.glass.light .diff .dfv{color:#0c2836}
.glass.light .diff .dfl.add{background:rgba(150,196,40,.16)}
.glass.light .diff .dfl.add .dfs{color:#5c8f0e}
.glass.light .diff .dfl.del{background:rgba(167,149,199,.2)}
.glass.light .diff .dfl.del .dfs{color:#6d5a92}

/* ═══════════ 9 · JSON / attribute tree ═══════════ */
.glass .tree{font:500 15px/1.7 var(--w-font);color:var(--w-ink);min-width:0;width:100%}
.glass .tree .tnode{padding-left:14px;border-left:1px solid var(--dline,rgba(255,255,255,.08));margin-left:5px}
.glass .tree>.tnode{padding-left:0;border-left:0;margin-left:0}
.glass .tree .trow{display:flex;align-items:baseline;gap:6px;min-width:0;border-radius:6px;padding:1px 4px;transition:background .14s ease}
.glass .tree .trow:hover{background:rgba(255,255,255,.06)}
.glass .tree .tt{display:flex;align-items:center;gap:6px;min-width:0;border:0;background:transparent;padding:1px 4px;border-radius:6px;cursor:pointer;
  color:inherit;font:inherit;text-align:left;transition:background .14s ease}
.glass .tree .tt:hover{background:rgba(255,255,255,.06)}
.glass .tree .tt:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:1px}
.glass .tree .tk{color:var(--w-dim);flex:none}
.glass .tree .tv{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-variant-numeric:tabular-nums}
.glass .tree .tv.str{color:#9fe8c4}
.glass .tree .tv.num{color:#7fd4e6}
.glass .tree .tv.bool{color:#d9ff7a}
.glass .tree .tv.null{color:var(--w-dim);font-style:italic}
.glass .tree .tmeta{color:var(--w-dim);font-size:13px}
.glass .tree .tnode[hidden]{display:none}
.glass.light .tree .trow:hover,.glass.light .tree .tt:hover{background:rgba(4,40,56,.05)}
.glass.light .tree .tv.str{color:#12694a}
.glass.light .tree .tv.num{color:#0f7d95}
.glass.light .tree .tv.bool{color:#5c8f0e}

/* ═══════════ 10 · log stream v2 ═══════════ */
.glass .logs2{position:relative;display:flex;flex-direction:column;width:100%;min-width:0;border-radius:13px;overflow:hidden;
  background:rgba(2,16,26,.72);border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
.glass .logs2 .l2head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:7px 10px;border-bottom:1px solid rgba(255,255,255,.1);min-width:0}
.glass .logs2 .l2t{font:700 13px var(--w-font);letter-spacing:.06em;text-transform:uppercase;color:#9db8c4;margin-right:2px;white-space:nowrap}
.glass .logs2 .l2f{display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 11px 0 9px;border-radius:99px;cursor:pointer;
  font:600 13px var(--w-font);color:#9db8c4;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);
  transition:color .16s ease,background .16s ease,border-color .16s ease,transform .12s ease}
.glass .logs2 .l2f i{width:6px;height:6px;border-radius:50%;background:#6bc5d6;flex:none}
.glass .logs2 .l2f.warn i{background:#f2c14e}.glass .logs2 .l2f.err i{background:#ff7a8a}.glass .logs2 .l2f.ok i{background:#5fe3a1}
.glass .logs2 .l2f.redact i{background:var(--ch2)}
.glass .logs2 .l2f.all i{background:#9db8c4}
.glass .logs2 .l2f:hover{color:#fff;border-color:rgba(255,255,255,.3)}
.glass .logs2 .l2f:active{transform:scale(.96);transition-duration:.08s}
.glass .logs2 .l2f:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:2px}
.glass .logs2 .l2f.on{color:#fff;background:rgba(30,157,184,.4);border-color:rgba(107,197,214,.5)}
.glass .logs2 .l2follow{margin-left:auto;display:inline-flex;align-items:center;gap:7px;font:600 13px var(--w-font);letter-spacing:.06em;text-transform:uppercase;color:#9db8c4}
.glass .logs2 .l2body{height:190px;overflow:auto;padding:4px 0 6px;scrollbar-width:thin;scrollbar-color:rgba(107,197,214,.4) transparent}
.glass .logs2 .l2body::-webkit-scrollbar{width:6px}
.glass .logs2 .l2body::-webkit-scrollbar-thumb{background:rgba(107,197,214,.35);border-radius:99px}
.glass .logs2 .l2r{display:flex;align-items:baseline;gap:9px;padding:3px 10px;min-width:0;font:500 15px var(--w-font);color:#dceef4;
  animation:cellin .24s var(--lg-spring) backwards;transition:background .14s ease}
.glass .logs2 .l2r:hover{background:rgba(255,255,255,.05)}
.glass .logs2 .l2r .l2ts{flex:none;width:68px;color:#7d9aa8;font-variant-numeric:tabular-nums;font-size:15px}
.glass .logs2 .l2r .l2lv{flex:none;display:inline-flex;align-items:center;gap:5px;width:80px;font:700 13px var(--w-font);letter-spacing:.06em;text-transform:uppercase}
.glass .logs2 .l2r .l2lv i{width:6px;height:6px;border-radius:50%;flex:none}
.glass .logs2 .l2r.info .l2lv{color:#6bc5d6}.glass .logs2 .l2r.info .l2lv i{background:#6bc5d6}
.glass .logs2 .l2r.redact .l2lv{color:#c7afe8}.glass .logs2 .l2r.redact .l2lv i{background:var(--ch2);box-shadow:0 0 8px rgba(167,149,199,.45)}
.glass .logs2 .l2r.redact{background:linear-gradient(90deg,rgba(167,149,199,.1),transparent 44%)}
.glass .logs2 .l2r.ok .l2lv{color:#5fe3a1}.glass .logs2 .l2r.ok .l2lv i{background:#5fe3a1}
.glass .logs2 .l2r.warn .l2lv{color:#f2c14e}.glass .logs2 .l2r.warn .l2lv i{background:#f2c14e}
.glass .logs2 .l2r.err .l2lv{color:#ff7a8a}.glass .logs2 .l2r.err .l2lv i{background:#ff7a8a}
.glass .logs2 .l2r .l2m{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.glass .logs2 .l2r .dchev{color:#7d9aa8;align-self:center}
.glass .logs2 .l2r .dchev:hover{color:#fff;background:rgba(255,255,255,.12)}
.glass .logs2 .l2p{padding:0 10px 0 98px}
.glass .logs2 .l2pg{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s var(--lg-spring)}
.glass .logs2 .l2p.open .l2pg{grid-template-rows:1fr}
.glass .logs2 .l2pg>div{overflow:hidden;min-height:0}
.glass .logs2 .l2pb{margin:2px 0 6px;padding:8px 10px;border-radius:9px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);
  font:500 15px/1.6 var(--w-font);color:#c9ecf4;white-space:pre-wrap;word-break:break-word}
.glass .logs2 .l2empty{padding:20px;text-align:center;font:500 15px var(--w-font);color:#7d9aa8}
.glass .logs2 .l2paused{position:absolute;right:10px;bottom:8px;font:700 13px var(--w-font);letter-spacing:.08em;text-transform:uppercase;color:#9db8c4;
  opacity:0;transition:opacity .2s ease}
.glass .logs2.hold .l2paused{opacity:1}
/* the stream stays dark in the light scheme — it is a console; give it dark ink explicitly */
.glass.light .logs2{background:#0c2836;border-color:rgba(4,40,56,.3)}

/* ═══════════ 11 · trace / span list ═══════════ */
.glass .traces{display:flex;flex-direction:column;width:100%;min-width:0}
.glass .traces .trr{display:flex;align-items:center;gap:10px;padding:6px 0;min-width:0;border-bottom:1px solid var(--dline,rgba(255,255,255,.07));
  animation:cellin .28s var(--lg-spring) backwards}
.glass .traces .trr:last-child{border-bottom:0}
.glass .traces .trn{flex:0 0 34%;min-width:0;font:600 15px var(--w-font);color:var(--w-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.glass .traces .trn small{display:block;font:500 13px var(--w-font);color:var(--w-dim);overflow:hidden;text-overflow:ellipsis}
.glass .traces .trt{position:relative;flex:1;min-width:60px;height:15px;border-radius:5px;background:rgba(255,255,255,.06)}
.glass .traces .trb{position:absolute;top:3px;height:8px;border-radius:99px;background:linear-gradient(90deg,#1E9DB8,#2ec8e8);
  transform-origin:left;animation:meterin .46s var(--lg-spring) backwards}
.glass .traces .trb.warn{background:linear-gradient(90deg,#c79a2c,#f2c14e)}
.glass .traces .trb.err{background:linear-gradient(90deg,#c8384c,#ff7a8a)}
.glass .traces .trb.tool{background:linear-gradient(90deg,#8a76b5,#cdbfe8)}
.glass .traces .trd{flex:none;width:72px;text-align:right;font:600 15px var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-dim)}
.glass.light .traces .trt{background:rgba(4,40,56,.07)}
.glass.light .traces .trn{color:#0c2836}
.glass.light .traces .trd,.glass.light .traces .trn small{color:#3f5d6c}

/* ═══════════ 12 · avatar group ═══════════ */
.glass .agroup{position:relative;display:inline-flex;align-items:center}
.glass .agroup .avatars .avatar,.glass .agroup .avatars .more{cursor:default;transition:transform .18s var(--lg-snap)}
.glass .agroup:hover .avatars .avatar,.glass .agroup:hover .avatars .more{transform:translateY(-2px)}
.glass .agroup .hovercard{position:absolute;top:calc(100% + 8px);left:0;width:246px;padding:11px 13px;z-index:46}
.glass .agroup .hcr{display:flex;align-items:center;gap:9px;padding:4px 0;font:500 15px var(--w-font);min-width:0}
.glass .agroup .hcr .hcn{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.glass .agroup .hcr .hcv{font:600 15px var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-dim);white-space:nowrap}

/* ═══════════ 13 · count pill ═══════════ */
.glass .count{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:23px;padding:0 8px;border-radius:99px;
  font:700 13px var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-ink);background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18)}
.glass .count.teal{background:rgba(30,157,184,.32);border-color:rgba(107,197,214,.45)}
.glass .count.lime{color:#0d2b1c;background:linear-gradient(160deg,#d9ff7a,#c3f23e);border-color:rgba(217,255,122,.7)}
.glass .count.bump{animation:countpop .34s var(--lg-pop)}
@keyframes countpop{0%{transform:scale(.6)}58%{transform:scale(1.18)}100%{transform:scale(1)}}
.glass.light .count{color:#0c2836;background:rgba(4,40,56,.08);border-color:rgba(4,40,56,.14)}
.glass.light .count.teal{background:rgba(30,157,184,.2);border-color:rgba(30,157,184,.4)}

/* ═══════════ 14 · rank list ═══════════ */
.glass .ranklist{display:flex;flex-direction:column;gap:2px;width:100%;min-width:0}
.glass .ranklist .rr{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:10px;min-width:0;
  animation:cellin .3s var(--lg-spring) backwards;transition:background .16s ease}
.glass .ranklist .rr:hover{background:rgba(255,255,255,.06)}
.glass .ranklist .rn{flex:none;width:24px;height:24px;border-radius:6px;display:grid;place-items:center;
  font:700 13px var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-dim);background:rgba(255,255,255,.08)}
.glass .ranklist .rr:nth-child(1) .rn{color:#0d2b1c;background:linear-gradient(160deg,#d9ff7a,#c3f23e)}
.glass .ranklist .rr:nth-child(2) .rn{color:#04222f;background:linear-gradient(160deg,#7fd4e6,#2ec8e8)}
.glass .ranklist .rr:nth-child(3) .rn{color:#241b36;background:linear-gradient(160deg,#cdbfe8,#a795c7)}
.glass .ranklist .rname{flex:0 0 32%;min-width:0;font:600 15px var(--w-font);color:var(--w-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.glass .ranklist .rt{position:relative;flex:1;min-width:40px;height:7px;border-radius:99px;overflow:hidden;background:rgba(255,255,255,.09)}
.glass .ranklist .rt i{position:absolute;left:0;top:0;bottom:0;border-radius:99px;background:linear-gradient(90deg,#1E9DB8,#2ec8e8 70%,#d9ff7a);
  transform-origin:left;animation:meterin .5s var(--lg-spring) backwards}
.glass .ranklist .rv{flex:none;width:80px;text-align:right;font:700 15px var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-ink);white-space:nowrap}
.glass.light .ranklist .rr:hover{background:rgba(4,40,56,.05)}
.glass.light .ranklist .rn{color:#3f5d6c;background:rgba(4,40,56,.08)}
.glass.light .ranklist .rname,.glass.light .ranklist .rv{color:#0c2836}
.glass.light .ranklist .rt{background:rgba(4,40,56,.09)}

/* ═══════════ 15 · activity feed ═══════════ */
.glass .feed{display:flex;flex-direction:column;gap:2px;width:100%;min-width:0}
.glass .feed .fhd{font:700 13px var(--w-font);letter-spacing:.1em;text-transform:uppercase;color:var(--w-dim);padding:12px 2px 5px}
.glass .feed .fhd:first-child{padding-top:2px}
.glass .feed .fr{display:flex;align-items:flex-start;gap:10px;padding:8px;border-radius:11px;min-width:0;
  animation:cellin .3s var(--lg-spring) backwards;transition:background .16s ease}
.glass .feed .fr:hover{background:rgba(255,255,255,.06)}
.glass .feed .fi{flex:none;width:28px;height:28px;border-radius:9px;display:grid;place-items:center;color:#6bc5d6;
  background:rgba(107,197,214,.14);border:1px solid rgba(107,197,214,.3)}
.glass .feed .fi svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.glass .feed .fr.ok .fi{color:#5fe3a1;background:rgba(95,227,161,.14);border-color:rgba(95,227,161,.32)}
.glass .feed .fr.warn .fi{color:#f2c14e;background:rgba(242,193,78,.14);border-color:rgba(242,193,78,.32)}
.glass .feed .fr.err .fi{color:#ff9aa6;background:rgba(255,122,138,.14);border-color:rgba(255,122,138,.36)}
.glass .feed .fb{flex:1;min-width:0}
.glass .feed .fp{font:600 15px var(--w-font);color:var(--w-ink)}
.glass .feed .fs{font:400 15px var(--w-font);color:var(--w-soft);margin-top:2px}
.glass .feed .fv{flex:none;text-align:right;font:700 15px var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-ink);white-space:nowrap}
.glass .feed .fv small{display:block;font:500 13px var(--w-font);color:var(--w-dim);margin-top:2px}
.glass.light .feed .fr:hover{background:rgba(4,40,56,.05)}
.glass.light .feed .fp,.glass.light .feed .fv{color:#0c2836}
.glass.light .feed .fi{color:#0f7d95;background:rgba(15,125,149,.1);border-color:rgba(15,125,149,.26)}
.glass.light .feed .fr.ok .fi{color:#1d7d4f;background:rgba(29,125,79,.1);border-color:rgba(29,125,79,.28)}
.glass.light .feed .fr.warn .fi{color:#9a6b00;background:rgba(154,107,0,.1);border-color:rgba(154,107,0,.28)}
.glass.light .feed .fr.err .fi{color:#c8384c;background:rgba(200,56,76,.1);border-color:rgba(200,56,76,.28)}

/* ═══════════ 16 · empty state v2 + table skeleton ═══════════ */
.glass .empty2{display:flex;flex-direction:column;align-items:center;gap:10px;padding:30px 20px;text-align:center;border-radius:16px;
  border:1px dashed rgba(255,255,255,.18);width:100%;min-width:0;animation:cellin .34s var(--lg-spring) backwards}
.glass .empty2 .eill{width:96px;height:64px;color:var(--w-dim);opacity:.9}
.glass .empty2 .eill svg{width:96px;height:64px;stroke:currentColor;fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.glass .empty2 .eill .fillx{fill:rgba(107,197,214,.14);stroke:none}
.glass .empty2 .et2{font:600 16px var(--font);color:var(--w-ink)}
.glass .empty2 .es2{font:400 15px/1.55 var(--w-font);color:var(--w-soft);max-width:38ch}
.glass.light .empty2{border-color:rgba(4,40,56,.2)}
.glass.light .empty2 .et2{color:#0c2836}
.glass .dskel{display:flex;flex-direction:column;gap:0;width:100%;border-radius:14px;overflow:hidden;
  border:1px solid var(--dedge,rgba(255,255,255,.14));background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.02))}
.glass .dskel .dsr{display:flex;align-items:center;gap:14px;padding:12px 14px;border-bottom:1px solid var(--dline,rgba(255,255,255,.07))}
.glass .dskel .dsr:last-child{border-bottom:0}
.glass .dskel .dsr.head{background:rgba(255,255,255,.05)}
.glass .dskel .skel{flex:1}
.glass .dskel .skel.w1{flex:0 0 18%}.glass .dskel .skel.w2{flex:0 0 12%}.glass .dskel .skel.w3{flex:0 0 26%}
.glass.light .dskel{background:linear-gradient(160deg,#fff,rgba(255,255,255,.75))}
.glass.light .dskel .dsr.head{background:rgba(4,40,56,.04)}

/* ═══════════ 17 · inline row edit ═══════════ */
.glass .dtable td.editable{cursor:text}
.glass .dedit{display:flex;align-items:center;gap:6px;min-width:0}
.glass .dedit input{flex:1;min-width:0;width:100%;height:30px;padding:0 8px;border-radius:7px;outline:none;
  font:600 15px var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-ink);
  background:rgba(255,255,255,.1);border:1px solid rgba(107,197,214,.7);box-shadow:0 0 0 3px rgba(107,197,214,.18)}
.glass .dsaved{display:inline-grid;place-items:center;width:15px;height:15px;flex:none;color:#5fe3a1}
.glass .dsaved svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:24;animation:draw .34s ease backwards}
.glass.light .dedit input{color:#0c2836;background:#fff;border-color:rgba(30,157,184,.75)}
.glass.light .dsaved{color:#1d7d4f}

/* ═══════════ reduced motion ═══════════ */
@media (prefers-reduced-motion:reduce){
  .glass .dtable tbody tr.drow,.glass .cprog .ptrack i,.glass .statlist .slr,.glass .traces .trr,.glass .traces .trb,
  .glass .ranklist .rr,.glass .ranklist .rt i,.glass .feed .fr,.glass .empty2,.glass .logs2 .l2r,.glass .count.bump,.glass .dsaved svg{animation:none}
  .glass .dbulk,.glass .dchev,.glass .dtable tr.dexp .dexpg,.glass .logs2 .l2pg,.glass .dtable td,.glass .dtable th,
  .glass .cperson .avatar,.glass .agroup .avatars .avatar,.glass .agroup .avatars .more,.glass .dmenu,
  .glass .dmenu .dmi .dmc svg,.glass .kvcopy.done .ck2,.glass .fpop,.glass .fpop .fpane,.glass .fpop .fpop2 .fpthumb,.glass .fpop .fpi .dmc svg{transition:none}
  .glass .fchip.new,.glass .fpop .fpv.on,.glass .fpop .fpf.on{animation:none}
}

/* ==== ../ui-kit/parts/forms.css ==== */
/* ═══════════════════════════════════════════════════════════════════════════════════════
   Aegis Liquid Glass Kit — parts/forms.css (hand-authored; the FORMS & POLICY-FLOW layer)
   The controls an admin uses to SET a policy, and the flows that make that simple:
   the ceiling flow, the kill switch, hook assignment, content-control dials, denies.
   Same roots as glass.css / console.css (.glass / .glass.light), same tokens, same
   doctrine: one transition list per element, entrances use fill-mode backwards, no filter
   animations, focus rings only for the keyboard, everything collapses under reduced motion.

   Load order:  glass.css → console.css → parts/forms.css
   ═══════════════════════════════════════════════════════════════════════════════════════ */

/* ——— shared bits ——— */

/* ═══════════════════════ 19 · form layout primitives ═══════════════════════ */
.form{display:flex;flex-direction:column;gap:14px;width:100%;min-width:0}
.fsection{display:flex;flex-direction:column;gap:9px;width:100%;min-width:0}
.fsection .fhead{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--w-dim);white-space:nowrap}
.fsection .fhead::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(255,255,255,.16),transparent)}
.frow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;width:100%;min-width:0}
.frow.one{grid-template-columns:minmax(0,1fr)}
.frow.lead{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}
.frow .span{grid-column:1/-1;min-width:0}
.fcol{display:flex;flex-direction:column;gap:6px;min-width:0}
.fcol .flab{display:flex;align-items:center;gap:6px;font:600 15px var(--w-font);color:var(--w-ink)}
.fcol .flab .req{color:#ff9aa6}
.fcol .flab .fnote{margin-left:auto;font:500 13px var(--w-font);letter-spacing:.06em;text-transform:uppercase;color:var(--w-dim)}
.fcol .fhint{font:400 15px var(--w-font);color:var(--w-dim)}
.fcol .fhint:empty,.pfheading .sb:empty{display:none}
.fcol .ferr{display:none;align-items:center;gap:5px;font:500 15px var(--w-font);color:#ff9aa6}
.fcol .ferr svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;flex:none}
.fcol.err .ferr{display:flex;animation:cellin .22s var(--lg-snap) backwards}
.fsep{height:1px;width:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.16),transparent)}
@media(max-width:560px){.frow,.frow.lead{grid-template-columns:minmax(0,1fr)}}
.glass.light .fsection .fhead::after{background:linear-gradient(90deg,rgba(4,40,56,.16),transparent)}
.glass.light .fcol .flab{color:#0c2836}
.glass.light .fcol .fhint,.glass.light .fcol .flab .fnote{color:#3f5d6c}
.glass.light .fcol .ferr{color:#c8384c}
.glass.light .fsep{background:linear-gradient(90deg,transparent,rgba(4,40,56,.16),transparent)}

/* ═══════════════════════ 20 · picker search input + result list ═══════════════════════ */
.pickin{display:flex;align-items:center;gap:8px;padding:9px 11px;border-bottom:1px solid rgba(255,255,255,.12)}
.pickin .gicon{color:var(--w-dim)}
.pickin input{flex:1;min-width:0;background:transparent;border:0;outline:none;color:var(--w-ink);font:500 15px var(--w-font)}
.pickin input::placeholder{color:var(--w-dim)}
.pickin .kbd{height:22px;font-size:13px;flex:none}
.pklist{max-height:250px;overflow:auto;padding:5px;scrollbar-width:thin;scrollbar-color:rgba(107,197,214,.4) transparent}
.pklist::-webkit-scrollbar{width:5px}
.pklist::-webkit-scrollbar-thumb{background:rgba(107,197,214,.35);border-radius:99px}
.pkgroup{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--w-dim);padding:9px 9px 4px}
.pkgroup b{margin-left:auto;font-weight:700;font-variant-numeric:tabular-nums;opacity:.7}
.pkitem{display:flex;align-items:center;gap:9px;min-height:38px;padding:6px 10px;border-radius:9px;cursor:pointer;color:var(--w-ink);font:500 15px var(--w-font);transition:background .12s ease}
.pkitem:hover,.pkitem.hl{background:rgba(30,157,184,.2)}
.pkitem .pkn{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pkitem .pks{margin-left:auto;font:500 13px var(--w-font);color:var(--w-dim);white-space:nowrap;flex:none;font-variant-numeric:tabular-nums}
.pkitem mark{background:transparent;color:#d9ff7a;font-weight:700}
.pkitem .ck{width:15px;height:15px;flex:none;color:#d9ff7a;opacity:0;transition:opacity .14s ease}
.pkitem[aria-selected=true] .ck{opacity:1}
/* .pkico and .pkdot are TOP-LEVEL: the same glyph rides a list row and a picker's own trigger.
   An unsized inline <svg> falls back to 300x150 and shreds whatever contains it. */
.pkico{width:17px;height:17px;flex:none;color:var(--w-dim);display:grid;place-items:center}
.pkitem .ck svg,.pkico svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.pkdot{width:9px;height:9px;border-radius:50%;flex:none;box-shadow:inset 0 0 0 1px rgba(0,0,0,.18)}
.pkempty{padding:20px;text-align:center;font:500 15px var(--w-font);color:var(--w-soft)}
.glass.light .pickin{border-bottom-color:rgba(4,40,56,.1)}
.glass.light .pickin input{color:#0c2836}
.glass.light .pkitem{color:#0c2836}
.glass.light .pkitem:hover,.glass.light .pkitem.hl{background:rgba(30,157,184,.16)}
.glass.light .pkitem mark,.glass.light .pkitem .ck{color:#5c8f0e}
.glass.light .pkitem .pks,.glass.light .pkitem .pkico,.glass.light .pkgroup{color:#3f5d6c}

/* ═══════════════════════ 4 · radio cards ═══════════════════════ */
.radiocards{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:8px;width:100%;min-width:0}
.rcard{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:0;padding:11px 12px 10px;border-radius:14px;cursor:pointer;text-align:left;
  color:var(--w-ink);background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.035));border:1px solid rgba(255,255,255,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.2);
  transition:transform .2s var(--lg-snap),border-color .18s ease,box-shadow .22s ease,background .2s ease}
.rcard:hover{border-color:rgba(255,255,255,.36)}
.rcard[aria-checked=true]{transform:translateY(-2px);border-color:rgba(107,197,214,.62);
  background:linear-gradient(160deg,rgba(30,157,184,.3),rgba(30,157,184,.1));box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 0 0 3px rgba(107,197,214,.16)}
.rcard:active{transform:scale(.985);transition-duration:.08s}
.rcard .rico{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;flex:none;color:#6bc5d6;background:rgba(107,197,214,.14);border:1px solid rgba(107,197,214,.3)}
.rcard .rico svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.85;stroke-linecap:round;stroke-linejoin:round}
.rcard .rn{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:600 15px var(--w-font)}
.rcard .rs{font:400 15px var(--w-font);color:var(--w-soft)}
.rcard .rtag{display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 9px;border-radius:99px;font:700 13px var(--w-font);letter-spacing:.04em;
  color:var(--w-dim);background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.18)}
.rcard .rck{position:absolute;top:10px;right:10px;width:14px;height:14px;color:#d9ff7a;opacity:0;transition:opacity .16s ease}
.rcard[aria-checked=true] .rck{opacity:1}
.rcard .rck svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.glass.light .rcard{color:#0c2836;background:linear-gradient(160deg,#fff,rgba(255,255,255,.72));border-color:rgba(4,40,56,.14);box-shadow:inset 0 1px 0 #fff}
.glass.light .rcard:hover{border-color:rgba(4,40,56,.3)}
.glass.light .rcard[aria-checked=true]{border-color:rgba(30,157,184,.55);background:linear-gradient(160deg,rgba(30,157,184,.16),rgba(30,157,184,.06));box-shadow:inset 0 1px 0 #fff,0 0 0 3px rgba(30,157,184,.14)}
.glass.light .rcard .rico{color:#0f7d95;background:rgba(15,125,149,.1);border-color:rgba(15,125,149,.25)}
.glass.light .rcard .rtag{color:#3f5d6c;background:rgba(4,40,56,.06);border-color:rgba(4,40,56,.14)}
.glass.light .rcard .rck{color:#5c8f0e}

/* ═══════════════════════ 5 · toggle group (single with a gliding thumb, or multi) ═══════════════════════ */
.tglgroup{position:relative;display:flex;gap:2px;padding:3px;border-radius:12px;width:100%;min-width:0;
  background:linear-gradient(160deg,rgba(255,255,255,.1),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.22);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22),inset 0 -1px 0 rgba(160,220,235,.08)}
.tglgroup.tgwrap{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.tglgroup.tgwrap.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.tglgroup .tgi[hidden]{display:none}
.tglgroup .tgthumb{position:absolute;left:3px;top:3px;width:0;height:0;border-radius:9px;z-index:0;pointer-events:none;
  background:linear-gradient(160deg,rgba(255,255,255,.28),rgba(255,255,255,.1));border:1px solid rgba(255,255,255,.4);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 3px 10px rgba(2,16,26,.3);
  transition:left .24s var(--lg-snap),top .24s var(--lg-snap),width .24s var(--lg-snap),height .24s var(--lg-snap)}
.tglgroup .tgi{position:relative;z-index:1;flex:1;min-width:0;display:flex;align-items:center;justify-content:center;gap:6px;min-height:34px;padding:5px 12px;
  border:0;border-radius:9px;background:transparent;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  font:600 15px var(--w-font);color:var(--w-dim);transition:color .14s ease,background .16s ease,transform .1s ease}
.tglgroup .tgi:hover{color:var(--w-ink)}
.tglgroup .tgi.on{color:var(--w-ink)}
.tglgroup .tgi:active{transform:scale(.97);transition-duration:.08s}
.tglgroup .tgi svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.tglgroup .tgi small{font:500 13px var(--w-font);opacity:.72}
.tglgroup[data-multi] .tgthumb{display:none}
.tglgroup[data-multi] .tgi.on{background:linear-gradient(160deg,rgba(217,255,122,.28),rgba(217,255,122,.1));color:var(--w-ink)}
.tglgroup .tgi:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:-2px}
.glass.light .tglgroup{background:linear-gradient(160deg,rgba(255,255,255,.75),rgba(255,255,255,.45));border-color:rgba(4,40,56,.16);box-shadow:inset 0 1px 0 #fff}
.glass.light .tglgroup .tgthumb{background:linear-gradient(160deg,#fff,rgba(255,255,255,.78));border-color:rgba(4,40,56,.18);box-shadow:inset 0 1px 0 #fff,0 2px 6px rgba(23,48,62,.12)}
.glass.light .tglgroup .tgi{color:#3f5d6c}
.glass.light .tglgroup .tgi:hover,.glass.light .tglgroup .tgi.on{color:#0c2836}
.glass.light .tglgroup[data-multi] .tgi.on{background:linear-gradient(160deg,rgba(160,210,40,.3),rgba(160,210,40,.12))}

/* ═══════════════════════ 6 · scope picker (segment reveals its target) ═══════════════════════ */
.scope{display:flex;flex-direction:column;width:100%;min-width:0}
.scopetarget{display:grid;grid-template-rows:0fr;transition:grid-template-rows .32s var(--lg-spring)}
.scope.open .scopetarget{grid-template-rows:1fr}
/* the gap rides a MARGIN inside the clipped box, never padding on the grid item: padding is
   added outside a stretched item's 0-height content box, so a collapsed target stays 8 px tall */
.scopetarget>.st{overflow:hidden;min-height:0}
/* once the target has grown the clip comes off, so a picker's menu can hang below it; the base
   rule (no transition) puts the clip straight back for the collapse */
.scope.open .scopetarget>.st{overflow:visible;transition:overflow 0s linear .34s;transition-behavior:allow-discrete}
.scopetarget [data-for]{margin-top:8px}
.scopetarget .combo{width:100%;display:block}
.glass.light .scopetarget .combo{display:block}

/* ═══════════════════════ 7 · people / group picker ═══════════════════════ */
.people{width:100%;display:block}
.people .strig{width:100%}
.people .menu{min-width:100%;padding:0;overflow:hidden}
.people .strig .chips{display:flex;gap:4px;flex-wrap:wrap;flex:1;min-width:0;align-items:center}
.people .strig .sval{display:flex;align-items:center;gap:7px;flex:1;min-width:0}
.people .strig .sval .cn{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.people .strig .sval .av{margin-left:0}
.chip .av{width:16px;height:16px;border-radius:50%;display:grid;place-items:center;flex:none;margin-left:-3px;
  font:700 8.5px var(--w-font);color:#04222f;background:linear-gradient(160deg,#7fd4e6,#2ec8e8)}
.chip.grp .av{border-radius:5px;background:linear-gradient(160deg,#cdbfe8,#a795c7)}
.chip .cn{max-width:144px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.moreN{display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:99px;flex:none;
  font:700 13px var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-dim);background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2)}
.pkav{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;flex:none;
  font:700 13px var(--w-font);color:#04222f;background:linear-gradient(160deg,#7fd4e6,#2ec8e8);box-shadow:inset 0 1px 0 rgba(255,255,255,.4)}
.pkav.lime{background:linear-gradient(160deg,#d9ff7a,#b9d94a)}
.pkav.purple{background:linear-gradient(160deg,#cdbfe8,#a795c7)}
.pkav.grp{border-radius:7px;background:linear-gradient(160deg,#cdbfe8,#a795c7)}
.glass.light .moreN{color:#3f5d6c;background:rgba(4,40,56,.07);border-color:rgba(4,40,56,.16)}

/* ═══════════════════════ 8 · amount input · 9 · number stepper ═══════════════════════ */
.amount{display:flex;flex-direction:column;gap:8px;width:100%;min-width:0}
.amount .igroup{padding:0 6px 0 12px;min-height:44px;border-radius:13px}
.amount .cur{min-width:10px;font:700 18px var(--w-font);color:var(--w-dim);text-align:center;flex:none}
.amount input{font:700 18px var(--w-font);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.amount .uwrap{position:relative;display:grid;height:26px;min-width:86px;overflow:hidden;flex:none}
.amount .uwrap span{grid-area:1/1;align-self:center;justify-self:end;display:inline-flex;align-items:center;justify-content:center;min-height:26px;padding:0 9px;border-radius:8px;text-align:center;white-space:nowrap;
  font:600 15px var(--w-font);color:var(--w-dim);background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);
  transition:opacity .18s ease,transform .24s var(--lg-snap)}
.amount .uwrap span.out{opacity:0;transform:translateY(-80%)}
.amount .uwrap span.in{opacity:0;transform:translateY(80%)}
.amount.err .igroup{border-color:rgba(255,122,138,.6);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 0 0 3px rgba(255,122,138,.14)}
.presets{display:flex;gap:6px;flex-wrap:wrap;align-items:center;min-height:32px}
.presets .plab{font:600 13px var(--w-font);color:var(--w-dim);margin-right:2px}
.pchip{display:inline-flex;align-items:center;justify-content:center;height:32px;padding:0 12px;border-radius:99px;cursor:pointer;flex:none;text-align:center;
  font:600 15px var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-soft);
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.2);
  transition:color .14s ease,background .16s ease,border-color .16s ease,transform .12s ease}
.pchip:hover{color:var(--w-ink);border-color:rgba(255,255,255,.38)}
.pchip.on{color:#0d2b1c;background:linear-gradient(160deg,#d9ff7a,#c3f23e);border-color:rgba(217,255,122,.78)}
.pchip:active{transform:scale(.94);transition-duration:.08s}
.pchip:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:2px}
.stepper{display:inline-flex;align-items:center;gap:2px;flex:none}
.stepper .sbtn{width:33px;height:33px;border-radius:9px;display:grid;place-items:center;cursor:pointer;flex:none;
  color:var(--w-dim);background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.2);
  transition:color .14s ease,background .16s ease,border-color .16s ease,transform .12s ease}
.stepper .sbtn:hover{color:var(--w-ink);background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.36)}
.stepper .sbtn:active{transform:scale(.9);transition-duration:.08s}
.stepper .sbtn[disabled]{opacity:.35;pointer-events:none}
.stepper .sbtn svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round}
.stepper .sbtn:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:2px}
.stepper .sin{width:76px;height:32px;text-align:center;background:transparent;border:0;outline:none;min-width:0;
  color:var(--w-ink);font:700 16px var(--w-font);font-variant-numeric:tabular-nums}
.stepper.solo{padding:3px;border-radius:11px;background:linear-gradient(160deg,rgba(255,255,255,.1),rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.22)}
.stepper.solo:focus-within{border-color:rgba(107,197,214,.7);box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 0 0 3px rgba(107,197,214,.18)}
.glass.light .amount .cur,.glass.light .amount .uwrap span,.glass.light .presets .plab{color:#3f5d6c}
.glass.light .amount .uwrap span{background:rgba(4,40,56,.05);border-color:rgba(4,40,56,.12)}
.glass.light .amount.err .igroup{border-color:rgba(200,56,76,.5);box-shadow:inset 0 1px 0 #fff,0 0 0 3px rgba(200,56,76,.12)}
.glass.light .pchip{color:#33505f;background:rgba(4,40,56,.05);border-color:rgba(4,40,56,.18)}
.glass.light .pchip:hover{color:#0c2836;border-color:rgba(4,40,56,.34)}
.glass.light .pchip.on{color:#0d2b1c;background:linear-gradient(160deg,#d9ff7a,#c3f23e);border-color:rgba(122,168,28,.6)}
.glass.light .stepper .sbtn{color:#3f5d6c;background:rgba(4,40,56,.05);border-color:rgba(4,40,56,.18)}
.glass.light .stepper .sbtn:hover{color:#0c2836;background:rgba(4,40,56,.1);border-color:rgba(4,40,56,.32)}
.glass.light .stepper .sin{color:#0c2836}
.glass.light .stepper.solo{background:linear-gradient(160deg,#fff,rgba(255,255,255,.75));border-color:rgba(4,40,56,.2);box-shadow:inset 0 1px 0 #fff}

/* ═══════════════════════ 10 · level dial (snap stops with a word per stop) ═══════════════════════ */
.dial{position:relative;width:100%;min-width:0;padding:4px 0 2px}
.dial .dtrack{position:relative;height:8px;border-radius:99px;margin:10px 24px 0;background:rgba(255,255,255,.1);box-shadow:inset 0 1px 2px rgba(0,10,16,.3)}
.dial .dfill{position:absolute;left:0;top:0;bottom:0;width:0;border-radius:99px;background:linear-gradient(90deg,#1E9DB8,#2ec8e8 60%,#d9ff7a);transition:width .26s var(--lg-snap)}
.dial .dstop{position:absolute;top:50%;width:4px;height:4px;margin:-2px 0 0 -2px;border-radius:50%;background:rgba(255,255,255,.45)}
.dial .dknob{position:absolute;top:50%;left:0;width:18px;height:18px;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;
  background:linear-gradient(160deg,#fff,#dbeef5);border:1px solid rgba(255,255,255,.7);box-shadow:0 2px 8px rgba(2,16,26,.45),inset 0 1px 0 #fff;
  transition:left .26s var(--lg-snap),transform .16s ease,box-shadow .2s ease}
.dial.active .dknob{transform:translate(-50%,-50%) scale(1.14);box-shadow:0 2px 8px rgba(2,16,26,.45),0 0 0 5px rgba(107,197,214,.2),inset 0 1px 0 #fff}
.dial input{position:absolute;left:9px;right:9px;top:4px;width:auto;height:26px;margin:0;opacity:0;cursor:pointer}
.dial .dlabels{position:relative;height:22px;margin:8px 24px 0;padding:0}
/* each label is centred under its stop (the knob and the stop share the same left %) */
.dial .dlabels span{position:absolute;top:0;transform:translateX(-50%);padding:2px 6px;border-radius:7px;cursor:pointer;white-space:nowrap;
  font:600 13px var(--w-font);color:var(--w-dim);transition:color .16s ease,background .16s ease}
.dial .dlabels span:hover{color:var(--w-ink)}
.dial .dlabels span.on{color:var(--w-ink);background:rgba(255,255,255,.1)}
.dial .dcap{margin-top:7px;font:400 15px var(--w-font);color:var(--w-soft)}
.glass.light .dial .dtrack{background:rgba(4,40,56,.1);box-shadow:inset 0 1px 2px rgba(23,48,62,.15)}
.glass.light .dial .dstop{background:rgba(4,40,56,.3)}
.glass.light .dial .dknob{background:linear-gradient(160deg,#fff,#e6f1f6);border-color:rgba(4,40,56,.2);box-shadow:0 2px 8px rgba(23,48,62,.25),inset 0 1px 0 #fff}
.glass.light .dial .dlabels span{color:#3f5d6c}
.glass.light .dial .dlabels span:hover,.glass.light .dial .dlabels span.on{color:#0c2836}
.glass.light .dial .dlabels span.on{background:rgba(4,40,56,.07)}

/* ═══════════════════════ 11 · switch row (a list of these is the content-controls screen) ═══════════════════════ */
.switchlist{display:flex;flex-direction:column;gap:2px;width:100%;min-width:0}
.switchrow{display:flex;align-items:center;gap:12px;min-height:50px;padding:8px 12px;border-radius:12px;cursor:pointer;min-width:0;user-select:none;
  background:transparent;border:1px solid transparent;transition:background .2s ease,border-color .2s ease}
.switchrow:hover{background:rgba(255,255,255,.05)}
.switchrow.on{background:linear-gradient(160deg,rgba(30,157,184,.16),rgba(30,157,184,.05));border-color:rgba(107,197,214,.3)}
.switchrow .srm{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.switchrow .srl{font:600 15px var(--w-font);color:var(--w-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.switchrow .srs{font:400 15px var(--w-font);color:var(--w-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.switchrow .src{flex:none;padding:3px 9px;border-radius:99px;font:700 13px var(--w-font);font-variant-numeric:tabular-nums;
  color:var(--w-dim);background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16)}
.switchrow .tgl{flex:none;pointer-events:none}   /* the ROW is the control — one tab stop, one click target */
.switchrow:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:-2px}
.glass.light .switchrow:hover{background:rgba(4,40,56,.04)}
.glass.light .switchrow.on{background:linear-gradient(160deg,rgba(30,157,184,.12),rgba(30,157,184,.04));border-color:rgba(30,157,184,.32)}
.glass.light .switchrow .srl{color:#0c2836}
.glass.light .switchrow .src{color:#3f5d6c;background:rgba(4,40,56,.06);border-color:rgba(4,40,56,.14)}

/* ═══════════════════════ 12 · date range · 13 · time range ═══════════════════════ */
.pop.cal{width:auto;padding:0;overflow:hidden}
.cal .calbody{display:flex;align-items:stretch;min-width:0}
.calpre{display:flex;flex-direction:column;gap:2px;padding:11px 9px;min-width:138px;border-right:1px solid rgba(255,255,255,.12)}
.calpre .plab{font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--w-dim);padding:2px 8px 5px}
.cpre{height:33px;padding:0 11px;border-radius:9px;border:1px solid transparent;background:transparent;cursor:pointer;text-align:left;white-space:nowrap;
  font:600 15px var(--w-font);color:var(--w-dim);transition:color .14s ease,background .16s ease,border-color .16s ease}
.cpre:hover{color:var(--w-ink);background:rgba(255,255,255,.08)}
.cpre.on{color:var(--w-ink);background:linear-gradient(160deg,rgba(30,157,184,.42),rgba(30,157,184,.18));border-color:rgba(107,197,214,.45)}
.cpre:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:-2px}
.calms{display:flex;gap:16px;padding:12px 14px;min-width:0}
.calm{width:212px;min-width:0}
.calm .cmh{display:flex;align-items:center;gap:6px;height:28px;margin-bottom:8px;font:600 15px var(--w-font);color:var(--w-ink)}
.calm .cmh .cmt{flex:1;text-align:center}
.cnav{width:24px;height:24px;border-radius:7px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.07);color:var(--w-dim);
  display:grid;place-items:center;cursor:pointer;flex:none;transition:color .14s ease,background .16s ease,border-color .16s ease}
.cnav:hover{color:var(--w-ink);background:rgba(255,255,255,.16)}
.cnav svg{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.cnav[disabled]{opacity:.3;pointer-events:none}
.cdow{display:grid;grid-template-columns:repeat(7,1fr);margin-bottom:3px}
.cdow span{text-align:center;font:700 13px var(--w-font);letter-spacing:.02em;text-transform:uppercase;color:var(--w-dim)}
.cdays{display:grid;grid-template-columns:repeat(7,1fr);gap:2px 0}
.cd{position:relative;height:31px;border:0;background:transparent;cursor:pointer;border-radius:8px;
  font:500 15px var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-ink);transition:background .14s ease,color .14s ease}
.cd.mute{color:var(--w-dim);opacity:.4}
.cd:hover{background:rgba(255,255,255,.14)}
.cd.pv{background:rgba(30,157,184,.14);border-radius:0}
.cd.in{background:rgba(30,157,184,.2);border-radius:0}
.cd.s,.cd.e{color:#fff;background:linear-gradient(160deg,#2ec8e8,#137a94);border-radius:8px;font-weight:700}
.cd.today::after{content:"";position:absolute;left:50%;bottom:2px;width:3px;height:3px;margin-left:-1.5px;border-radius:50%;background:var(--w-amber)}
.cd:focus-visible{outline:2px solid rgba(107,197,214,.85);outline-offset:-2px}
.calfoot{display:flex;align-items:center;gap:8px;padding:9px 14px;border-top:1px solid rgba(255,255,255,.12)}
.calfoot .cfv{font:600 15px var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-ink);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.range{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.range .tglgroup{width:auto}
.range .tglgroup .tgi{flex:none}
.range .rval{font:600 15px var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-dim);white-space:nowrap}
.glass.light .calpre{border-right-color:rgba(4,40,56,.1)}
.glass.light .calpre .plab,.glass.light .cdow span,.glass.light .cd.mute,.glass.light .range .rval{color:#3f5d6c}
.glass.light .cpre{color:#3f5d6c}
.glass.light .cpre:hover{color:#0c2836;background:rgba(4,40,56,.06)}
.glass.light .cpre.on{color:#0c2836;background:linear-gradient(160deg,rgba(30,157,184,.26),rgba(30,157,184,.1));border-color:rgba(30,157,184,.4)}
.glass.light .calm .cmh,.glass.light .cd,.glass.light .calfoot .cfv{color:#0c2836}
.glass.light .cnav{color:#3f5d6c;background:rgba(4,40,56,.05);border-color:rgba(4,40,56,.16)}
.glass.light .cnav:hover{color:#0c2836;background:rgba(4,40,56,.1)}
.glass.light .cd:hover{background:rgba(4,40,56,.07)}
.glass.light .cd.pv{background:rgba(30,157,184,.12)}
.glass.light .cd.in{background:rgba(30,157,184,.18)}
.glass.light .cd.s,.glass.light .cd.e{color:#fff;background:linear-gradient(160deg,#1E9DB8,#0f6d85)}
.glass.light .calfoot{border-top-color:rgba(4,40,56,.1)}

/* ═══════════════════════ 14 · inline edit ═══════════════════════ */
.iedit{display:inline-flex;align-items:center;gap:7px;min-height:32px;padding:2px 8px;border-radius:9px;cursor:text;max-width:100%;
  border:1px solid transparent;background:transparent;color:var(--w-ink);font:600 15px var(--w-font);font-variant-numeric:tabular-nums;
  transition:background .16s ease,border-color .16s ease,box-shadow .2s ease}
.iedit:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22)}
.iedit.edit{background:rgba(255,255,255,.08);border-color:rgba(107,197,214,.7);box-shadow:0 0 0 3px rgba(107,197,214,.18)}
.iedit .iv{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.iedit .ipen{width:12px;height:12px;flex:none;color:var(--w-dim);opacity:0;transition:opacity .16s ease}
.iedit:hover .ipen{opacity:1}
.iedit.edit .ipen{opacity:0}
.iedit .ipen svg,.iedit .iok svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.iedit input{width:92px;min-width:0;padding:0;background:transparent;border:0;outline:none;color:var(--w-ink);font:600 15px var(--w-font);font-variant-numeric:tabular-nums}
.iedit .iok{width:12px;height:12px;flex:none;color:var(--w-green)}
.iedit .iok svg path{stroke-dasharray:20;stroke-dashoffset:20;animation:draw .34s ease forwards}
.iedit:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:2px}
.glass.light .iedit{color:#0c2836}
.glass.light .iedit:hover{background:rgba(4,40,56,.06);border-color:rgba(4,40,56,.18)}
.glass.light .iedit.edit{background:#fff;border-color:rgba(30,157,184,.7)}
.glass.light .iedit input{color:#0c2836}
.glass.light .iedit .ipen{color:#3f5d6c}
.glass.light .iedit .iok{color:#1d7d4f}

/* ═══════════════════════ 15 · confirm dialog ═══════════════════════ */
.sheet.confirm{width:min(408px,92vw)}
.confirm .ch{display:flex;align-items:flex-start;gap:12px}
.confirm .cico{width:37px;height:37px;border-radius:11px;display:grid;place-items:center;flex:none;
  color:#6bc5d6;background:rgba(107,197,214,.14);border:1px solid rgba(107,197,214,.32)}
.confirm.danger .cico{color:#ff9aa6;background:rgba(255,122,138,.14);border-color:rgba(255,122,138,.4)}
.confirm .cico svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.85;stroke-linecap:round;stroke-linejoin:round}
.confirm .ct{font:600 18px var(--font);color:var(--w-ink)}
.confirm .cd2{font:400 15px/1.55 var(--w-font);color:var(--w-soft);margin-top:4px}
.glass.light .confirm .ct{color:#0c2836}
.glass.light .confirm .cico{color:#0f7d95;background:rgba(15,125,149,.1);border-color:rgba(15,125,149,.28)}
.glass.light .confirm.danger .cico{color:#c8384c;background:rgba(200,56,76,.1);border-color:rgba(200,56,76,.3)}

/* ═══════════════════════ 16 · pending changes bar ═══════════════════════ */
.pendingbar{position:sticky;bottom:10px;z-index:6;display:flex;flex:none;align-items:center;gap:10px;margin-top:12px;padding:9px 10px 9px 14px;border-radius:14px;min-width:0;
  color:var(--w-ink);background:linear-gradient(160deg,rgba(9,36,50,.95),rgba(6,28,40,.93));
  -webkit-backdrop-filter:blur(16px) saturate(1.6);backdrop-filter:blur(16px) saturate(1.6);
  border:1px solid rgba(255,255,255,.22);box-shadow:0 14px 34px rgba(2,16,26,.5),inset 0 1px 0 rgba(255,255,255,.3);
  transform:translateY(150%);opacity:0;pointer-events:none;transition:transform .36s var(--lg-spring),opacity .22s ease}
.pendingbar.on{transform:none;opacity:1;pointer-events:auto}
.pendingbar .pbn{display:inline-grid;place-items:center;min-width:26px;height:26px;padding:0 7px;border-radius:99px;flex:none;
  font:700 15px var(--w-font);font-variant-numeric:tabular-nums;color:#0d2b1c;background:linear-gradient(160deg,#d9ff7a,#c3f23e)}
.pendingbar .pbt{font:600 15px var(--w-font);white-space:nowrap}
.pendingbar .pbsp{flex:1;min-width:8px}
.glass.light .pendingbar{color:#0c2836;background:linear-gradient(160deg,rgba(255,255,255,.97),rgba(243,248,251,.95));border-color:rgba(4,40,56,.18);box-shadow:0 14px 34px rgba(23,48,62,.22),inset 0 1px 0 #fff}

/* ═══════════════════════ 17 · key–value editor (the advanced rule surface) ═══════════════════════ */
.kv{display:flex;flex-direction:column;gap:8px;width:100%;min-width:0}
.kvhead{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr) 32px;gap:7px;padding:0 2px;
  font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--w-dim)}
.kvrows{display:flex;flex-direction:column;gap:7px;min-width:0}
.kvrow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr) 32px;gap:7px;align-items:start;min-width:0;
  animation:cellin .26s var(--lg-spring) backwards}
.kvrow .select{min-width:0;width:100%;display:block}
.kvrow .igroup{min-width:0}
.kvrow .kvx{width:32px;height:40px;border-radius:9px;display:grid;place-items:center;cursor:pointer;
  border:1px solid transparent;background:transparent;color:var(--w-dim);transition:color .16s ease,background .16s ease,border-color .16s ease}
.kvrow .kvx:hover{color:#ff9aa6;background:rgba(255,122,138,.12);border-color:rgba(255,122,138,.32)}
.kvrow .kvx svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round}
.kvrow .kve{grid-column:1/-1;display:flex;align-items:center;gap:5px;font:500 15px var(--w-font);color:#ff9aa6}
.kvrow .kve svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;flex:none}
.kvrow.out{opacity:0;transform:translateY(-4px);transition:opacity .16s ease,transform .18s var(--lg-out)}
.glass.light .kvhead{color:#3f5d6c}
.glass.light .kvrow .kvx{color:#3f5d6c}
.glass.light .kvrow .kvx:hover{color:#c8384c;background:rgba(200,56,76,.1);border-color:rgba(200,56,76,.28)}
.glass.light .kvrow .kve{color:#c8384c}

/* ═══════════════════════ 18 · tag input ═══════════════════════ */
.taginput{display:flex;align-items:center;gap:5px;flex-wrap:wrap;min-height:42px;padding:5px 8px;border-radius:11px;cursor:text;min-width:0;
  background:linear-gradient(160deg,rgba(255,255,255,.1),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.22);
  transition:border-color .18s ease,box-shadow .2s ease}
.taginput:focus-within{border-color:rgba(107,197,214,.7);box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 0 0 3px rgba(107,197,214,.18)}
.taginput input{flex:1;min-width:96px;padding:3px 2px;background:transparent;border:0;outline:none;color:var(--w-ink);font:500 15px var(--w-font)}
.taginput input::placeholder{color:var(--w-dim)}
.taginput .chip{max-width:100%}
.glass.light .taginput{background:linear-gradient(160deg,#fff,rgba(255,255,255,.75));border-color:rgba(4,40,56,.2);box-shadow:inset 0 1px 0 #fff}
.glass.light .taginput input{color:#0c2836}

/* ═══════════════════════ chip tones the review line and the pickers use ═══════════════════════ */
.chip.lime{color:#0d2b1c;background:linear-gradient(160deg,#d9ff7a,#c3f23e);border-color:rgba(217,255,122,.8)}
.chip.dim{color:var(--w-ink);background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.22)}
.chip.red{color:#ffb3bd;background:linear-gradient(160deg,rgba(255,122,138,.32),rgba(255,122,138,.12));border-color:rgba(255,122,138,.5)}
.chip.num{font-variant-numeric:tabular-nums}
.chip.big{height:28px;padding:0 12px;font-size:15px}
.glass.light .chip.lime{color:#0d2b1c;background:linear-gradient(160deg,#d9ff7a,#c3f23e);border-color:rgba(122,168,28,.6)}
.glass.light .chip.dim{color:#0c2836;background:rgba(4,40,56,.06);border-color:rgba(4,40,56,.16)}
.glass.light .chip.red{color:#a52434;background:linear-gradient(160deg,rgba(255,122,138,.22),rgba(255,122,138,.08));border-color:rgba(200,56,76,.42)}

/* ═══════════════════════ the review line (chips only — never a sentence) ═══════════════════════ */
.review{display:flex;align-items:center;flex-wrap:wrap;gap:6px;min-height:50px;padding:10px 12px;border-radius:13px;min-width:0;
  background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.16)}
.review .rlbl{font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--w-dim);margin-right:3px;flex:none}
.review .rsep{width:12px;height:12px;flex:none;color:var(--w-dim);opacity:.6}
.review .rsep svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.review .chip{animation:none}
.review .rw{font:600 15px var(--w-font);color:var(--w-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.review .rw.dim{font-weight:500;color:var(--w-soft)}
.review .rw.num{font-variant-numeric:tabular-nums}
.glass.light .review .rw{color:#0c2836}.glass.light .review .rw.dim{color:#3f5d6c}
.glass.light .review{background:linear-gradient(160deg,#fff,rgba(255,255,255,.7));border-color:rgba(4,40,56,.14);box-shadow:inset 0 1px 0 #fff}
.glass.light .review .rlbl,.glass.light .review .rsep{color:#3f5d6c}

/* ═══════════════════════ 1 · the ceiling sheet · 2 · the kill sheet · 3 · the hook sheet ═══════════════════════ */
/* The sheet footer, under its own name. `.sheet .sf` (console.css) collides with glass.css's
   `.sf` — the streak-footer stat pill — so every sheet footer in the kit is painting a glass
   capsule behind its buttons. That is the generated file's bug to fix, not this part's. */
.sheet .sfoot{display:flex;align-items:center;gap:8px;justify-content:flex-end;margin-top:16px}
.sheet.pform{width:min(560px,calc(100vw - 24px));padding:22px 22px 18px}
.sheet.center.pform{max-height:calc(100vh - 24px);scrollbar-width:thin;scrollbar-color:rgba(107,197,214,.36) transparent}
.sheet.center.pform::-webkit-scrollbar{width:5px}
.sheet.center.pform::-webkit-scrollbar-thumb{background:rgba(107,197,214,.34);border-radius:99px}
.sheet.killform,.sheet.hookform{width:min(468px,94vw)}
.pform .form{gap:12px}
.killform .form,.hookform .form{gap:13px}
.pform .pfhead{align-items:flex-start;margin-bottom:14px}
.pform .pfheading{display:flex;flex:1;min-width:0;flex-direction:column;gap:4px;padding-top:1px}
.pform .pfheading .st{font-size:20px}
.pform .pfheading .sb{max-width:48ch;font:400 15px/1.5 var(--w-font);color:var(--w-soft)}
.pform .pstage{position:relative;gap:0}
.pform .pstage:not(.last)::after{content:"";position:absolute;left:12px;top:30px;bottom:-16px;width:1px;
  background:linear-gradient(180deg,rgba(107,197,214,.38),rgba(255,255,255,.08))}
.pform .pfmeta{position:relative;z-index:1;display:grid;grid-template-columns:25px minmax(0,1fr);align-items:start;gap:11px;min-width:0}
.pform .pstep{width:27px;height:27px;border-radius:8px;display:grid;place-items:center;flex:none;
  font:700 13px var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-dim);
  background:linear-gradient(160deg,rgba(255,255,255,.12),rgba(255,255,255,.05));border:1px solid rgba(255,255,255,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.2);
  transition:color .16s ease,background .2s ease,border-color .18s ease,transform .18s var(--lg-snap)}
.pform .pstage:focus-within .pstep{color:#d9f8ff;background:linear-gradient(160deg,rgba(30,157,184,.42),rgba(30,157,184,.15));border-color:rgba(107,197,214,.6);transform:scale(1.06)}
.pform .amount.err .pstep{color:#ffb3bd;background:rgba(255,122,138,.14);border-color:rgba(255,122,138,.42)}
.pform .pfcopy{display:flex;min-width:0;align-items:baseline;gap:8px;padding-top:1px}
.pform .pfcopy .flab{font-size:15px;line-height:1.3}
.pform .pfcopy .fhint{font-size:13px;line-height:1.4}
.pform .pfcopy .fhint::before{content:"·";margin-right:7px;color:var(--w-dim)}
.pform .pcontrol{min-width:0;margin:6px 0 0 36px}
.pform .strig{min-height:46px;border-radius:13px}
.pform .kindgroup .tgi{min-height:44px;padding:5px 8px;flex-direction:column;gap:1px;line-height:1.05}
.pform .kindgroup .kindname{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;font-size:15px;text-align:center}
.pform .kindgroup .kindcadence{display:block;font:500 13px var(--w-font);color:var(--w-dim);opacity:1;text-align:center}
/* the selected tile sits on the group's FILLED thumb (a teal fill in both schemes, app.css), so its second
   line inherits the tile's white and never the dim grey — grey on teal is the "you can't see what it says
   underneath" Sam saw in light mode (2026-09-16). Hover, on an unfilled tile, keeps the soft grey. */
.pform .kindgroup .tgi:hover .kindcadence{color:var(--w-soft)}
.pform .kindgroup .tgi.on .kindcadence{color:inherit;opacity:.82}
.pform .amount .pcontrol{display:flex;flex-direction:column;gap:8px}
.pform .amount .igroup{min-height:52px}
.pform .amount input{font-size:20px}
.pform .scope>.tglgroup .tgi{min-height:40px;justify-content:center;text-align:center}
.pform .pfreview{display:block;min-height:0;padding:10px 12px;border-radius:15px}
.pform .pfreview .rhead{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}
.pform .pfreview .rlbl{margin:0;font-size:13px;letter-spacing:.08em}
.pform .pfreview .rstate{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:26px;padding:0 10px;border-radius:99px;flex:none;
  font:600 13px var(--w-font);color:var(--w-dim);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14)}
.pform .pfreview .rstate i{width:6px;height:6px;border-radius:50%;flex:none;background:var(--w-dim)}
.pform .pfreview .rstate.ready{color:#d9ff7a;background:rgba(217,255,122,.08);border-color:rgba(217,255,122,.24)}
.pform .pfreview .rstate.ready i{background:#d9ff7a;box-shadow:0 0 7px rgba(217,255,122,.55)}
.pform .pfreview .rgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr) minmax(0,1fr);min-width:0;
  animation:cellin .2s var(--lg-snap) backwards}
.pform .pfreview .ritem{display:flex;min-width:0;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;padding:0 10px}
.pform .pfreview .ritem:first-child{padding-left:0}
.pform .pfreview .ritem:last-child{padding-right:0}
.pform .pfreview .ritem+.ritem{border-left:1px solid rgba(255,255,255,.12)}
.pform .pfreview .rkey{font:500 13px var(--w-font);color:var(--w-dim)}
.pform .pfreview .rval{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font:600 15px var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-ink)}
.pform .pfreview .ritem.missing .rval{color:var(--w-dim);font-weight:500}
.pform .pfreview .ritem.bad .rval{color:#ffb3bd}
.pform #pfErr{min-height:0;margin-top:-8px}
.pform #pfErr.err{min-height:21px}
.pform .sfoot{margin-top:12px;padding-top:11px;border-top:1px solid rgba(255,255,255,.11)}
.pform .sfoot .gbtn2{min-height:40px;justify-content:center}
.pform .sfoot [data-save]{min-width:134px}
.pform .sfoot [data-save][data-state=ready]{box-shadow:0 4px 14px rgba(205,255,78,.26),inset 0 1px 0 rgba(255,255,255,.6)}
.pform .sfoot [data-save][disabled]{opacity:.42;box-shadow:none}
.pform .subjline{display:flex;align-items:center;gap:8px;min-width:0}
.pform .subjline .pkdot{margin-left:1px}
.glass.light .pform .pfheading .sb{color:#3f5d6c}
.glass.light .pform .pstage:not(.last)::after{background:linear-gradient(180deg,rgba(30,157,184,.3),rgba(4,40,56,.07))}
.glass.light .pform .pstep{color:#3f5d6c;background:linear-gradient(160deg,#fff,rgba(255,255,255,.68));border-color:rgba(4,40,56,.16);box-shadow:inset 0 1px 0 #fff}
.glass.light .pform .pstage:focus-within .pstep{color:#0f687c;background:linear-gradient(160deg,rgba(30,157,184,.2),rgba(30,157,184,.07));border-color:rgba(30,157,184,.48)}
.glass.light .pform .amount.err .pstep{color:#a52434;background:rgba(200,56,76,.09);border-color:rgba(200,56,76,.3)}
.glass.light .pform .kindgroup .tgi:hover .kindcadence{color:#3f5d6c}
.glass.light .pform .kindgroup .tgi.on .kindcadence,.glass.light .pform .kindgroup .tgi.on:hover .kindcadence{color:inherit}
.glass.light .pform .pfreview .rstate{color:#3f5d6c;background:rgba(4,40,56,.04);border-color:rgba(4,40,56,.12)}
.glass.light .pform .pfreview .rstate.ready{color:#4f790f;background:rgba(160,210,40,.1);border-color:rgba(122,168,28,.25)}
.glass.light .pform .pfreview .rstate.ready i{background:#78a91d;box-shadow:0 0 6px rgba(120,169,29,.38)}
.glass.light .pform .pfreview .ritem+.ritem{border-left-color:rgba(4,40,56,.1)}
.glass.light .pform .pfreview .rkey,.glass.light .pform .pfreview .ritem.missing .rval{color:#3f5d6c}
.glass.light .pform .pfreview .rval{color:#0c2836}
.glass.light .pform .pfreview .ritem.bad .rval{color:#a52434}
.glass.light .pform .sfoot{border-top-color:rgba(4,40,56,.1)}
@media(max-width:480px){
  .sheet.pform{width:calc(100vw - 16px);padding:18px 14px 14px}
  .pform .pfhead{margin-bottom:14px}
  .pform .pfheading .sb{max-width:38ch}
  .pform .pstage:not(.last)::after{left:11px}
  .pform .pfmeta{grid-template-columns:23px minmax(0,1fr);gap:9px}
  .pform .pstep{width:23px;height:23px;border-radius:7px}
  .pform .pfcopy{align-items:flex-start;flex-direction:column;gap:1px}
  .pform .pfcopy .fhint::before{content:none}
  .pform .pcontrol{margin-left:32px}
  .pform .kindgroup{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pform .pfreview .rgrid{grid-template-columns:minmax(0,1fr)}
  .pform .pfreview .ritem{padding:8px 0;gap:2px}
  .pform .pfreview .ritem:first-child{padding-top:1px}
  .pform .pfreview .ritem:last-child{padding-bottom:1px}
  .pform .pfreview .ritem+.ritem{border-left:0;border-top:1px solid rgba(255,255,255,.12)}
  .glass.light .pform .pfreview .ritem+.ritem{border-top-color:rgba(4,40,56,.1)}
  .pform .pfreview .rval{white-space:normal;overflow:visible;text-overflow:clip}
  .pform .sfoot{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr)}
  .pform .sfoot .gbtn2{width:100%;min-height:36px}
}
.killdone{display:flex;flex-direction:column;gap:13px;animation:cellin .34s var(--lg-spring) backwards}
.killbanner{display:flex;align-items:center;gap:13px;padding:14px;border-radius:16px;min-width:0;
  color:#ffb3bd;background:linear-gradient(160deg,rgba(255,122,138,.24),rgba(255,122,138,.07));border:1px solid rgba(255,122,138,.5);box-shadow:inset 0 1px 0 rgba(255,255,255,.16)}
.killbanner .kbi{width:41px;height:41px;border-radius:12px;display:grid;place-items:center;flex:none;background:rgba(255,122,138,.2);border:1px solid rgba(255,122,138,.45)}
.killbanner .kbi svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.85;stroke-linecap:round;stroke-linejoin:round}
.killbanner .kbm{min-width:0;display:flex;flex-direction:column;gap:3px}
.killbanner .kbt{font:700 18px var(--font);color:#ff9aa6}
.killbanner .kbs{font:400 15px var(--w-font);color:var(--w-soft)}
.glass.light .killbanner{color:#a52434;background:linear-gradient(160deg,rgba(255,122,138,.2),rgba(255,122,138,.06));border-color:rgba(200,56,76,.45)}
.glass.light .killbanner .kbi{background:rgba(200,56,76,.12);border-color:rgba(200,56,76,.35)}
.glass.light .killbanner .kbt{color:#a52434}
/* [hidden] has to beat the display each of these blocks sets — a UA `[hidden]{display:none}`
   rule never outranks an author `display:flex`, and the whole "landed" half shows through. */
.pform [hidden],.killform [hidden],.hookform [hidden],.confirm [hidden],.scopetarget [hidden]{display:none}

/* ═══════════════════════ reduced motion ═══════════════════════ */
@media (prefers-reduced-motion:reduce){
  .tglgroup .tgthumb,.scopetarget,.dial .dfill,.dial .dknob,.amount .uwrap span,.pendingbar,.kvrow.out,.rcard{transition:none}
  .fcol.err .ferr,.kvrow,.killdone,.pform .pfreview .rgrid{animation:none}
  .pform .pstep{transition:none}
  .pform .pstage:focus-within .pstep{transform:none}
  .iedit .iok svg path{animation:none;stroke-dashoffset:0}
}

/* ==== ../ui-kit/parts/nav.css ==== */
/* ═══════════════════════════════════════════════════════════════════════════════════════
   Aegis Liquid Glass Kit — parts/nav.css  (hand-authored; the navigation / app-shell /
   feedback part). Same roots as glass.css + console.css (.glass / .glass.light), same
   tokens, same doctrine: one transition list per element, entrances use fill-mode
   backwards, no filter animations, focus rings only for the keyboard, everything
   collapses under prefers-reduced-motion.

   Load order:  glass.css → console.css → parts/nav.css
   ═══════════════════════════════════════════════════════════════════════════════════════ */

/* ——— the brand mark: the real Nerdio icon, base64'd (never a styled letter) ——— */
.glass .brandicon{display:block;width:30px;height:14px;flex:none;
  background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAdIAAADLCAYAAADazhLRAAAnTElEQVR4nO3dB9hnw/UH8O/qfbFWN4sgCIvoJQnRBkF0EmIZkSB6L5GEqEGIFmVkI3onyui9JUEQ5b9RR40SXYLF/zmcN95sdte7+/5+95yZez7Pcx9CvHf2/t77O3fmnjlnAIwxxnSdi2kGAOsBWAXAUABzAZiU//VrAEYAuBvAVQBuzcF/Yh9LGQZID8AYY2rmYvoqgP0AbAZg4j7+Z88COALA6Tn4j7o8RNNPFkiNMaYLXEwTATgQwN4AJhnPH/MYgGE5+D91eHimgyyQGmNMh7mYpgNwOYBvdODH0Yz0Jzn4Uzvws0wXWCA1xpgOcjFNT+84ASzU4Qu7Zw7+qA7/TNMBFkiNMaZDXEz0DvRmAMt36aJumoM/v0s/24ynCcb3PzTGGPM/Du5iECWnu5jmtuuuiwVSY4zpABcTLeXu0eWLORWA47t8DjOOLJAaY0xn/BzAhA1czDVdTMs2cB7TRxZIjTGmn1xMcwBYv8ELuUuD5zJfwgKpMcb036YNJ2+u42KiZV6jgAVSY4zpv9UavoiTAVih4XOaMbBAaowx/fd1gYu4uMA5zWhYIDXGmH5wMU0NgIowNI2K3hsFqBakUcLFRBl/swGgfWJzAhgCYCYAg/gYDGAggMm5awQ9CNFNTD4E8C/++3cAvAvgdQD/5M4SrwDIXAz7syMHT/8/Y0z/0L0pgcoQGgUskApxMTkAi/CxMLdVmqcfn8kkvQpjD+zjGJ4D8CgffwNwH/01B//xeI7BGNOcJrbamD6wQNpcF4hFODlgeS5kPTPkzcHH6r3+2Xsupr8AuAfAHQBuycHT7NYYY8xoWCDtEhfTrAA8bZ7mRr59miUqMCWAb/FB7Z9GupgoqN4AIAH4Uw7+U+lBGmOMFhZIO8jF9BUAmwDYCMCiqOd3ZAU+qHLLiy6mywBcAuA2azpsjGk7C6SdmXluxkcb0tHpz7s9H6+5mM4FcGYOnpaDjTGmdSyQjgcX0wS8bLstgO+0+KX/DAB2pMPF9BiAM+jIwVOmsDHGtIIF0nHgYqI09+04gFKSjvnCAgB+BeAgnqWekIN/wC6QMaZ2Fkj7wMVEG593A7A1gCm6/7EUbXK+Tlu7mG4FcHgOnpKUjDGmShZIx8LFRLOsnwHYsMXLt/3xWfavi+l+AIcCuDQH/4n0oIwxppOsROBoUAd6F9NwAA9zFq4F0f7XIb0IwAMuprX6+bOMMUYVm5H24mIazFs8fghgYrmPpVpUvelKF9PttEc1B3+39ICMMaa/LJB+UXnoJ7yMO22/r6r5MlTZ6S5OStozB/+CXTJjTKlav7TrYqKqQw8B+LUF0cbR3tvHXUx7uZh66gQbY0xRJmjzVhZ+D3o9b90wMqYCcASAB11My9iHYIwpTSsDqYuJSvg9AmBL6bGY/5gfwJ0upmNcTLbFyBhTjFYFUhfTdC6mCwBcwH0+jb7fx115drqc9GCMMaYvWhNIXUzf4nehNBs1ulFf1ttcTAdws3NjjFGr+kBKX8QupkMA3ARgdunxmD6jAHowgBtdTPa5GWPUmqAF+0Kpj+Z+tf9ZK/YtLuSwkvRAjDFmdKoNLi6mJQHcB2BF6bGYjnSZucHFtLtdS2OMNlUGUhcTZeNS9Rzr0FLX7+pRLqZzXExUGN8YY1SoKpC6mAa4mA4CQPtDJ5Uej+laEYcbeNneGGPEVVMikCvjnAbgB9JjMV23HJcYXCsHP8KutzHyXEw0MVscwPK8L3xmnqx9ACDzrolbcvDPojJVBFIX00AAlwD4tvRYTKNbZHqC6b123cvG25won8EDWALA3ADovibvAHgKwJ8AXAvg5hz8x8JDNszFRAFzRwBbAZjlyy6Mi4k+x5MAnJuD/7CGCzkAdQTR6wAsJT0WI+JtAOvk4KmJuCmMi2lKbhhBX8Sz9fE/ewnACQCOy8G/B2EupjkBPC1w6stz8N+FEBcTdcjaC8D+AMYnb+EJADvk4On7u2hFvyPl92S3WRBttWkAXONiWl16IGbcuJjWBPAogMPHIYiCZz20N3yEi2ltu+7NczHNxt+9vxzPINqzqnSti+mo0guvFBtIXUwzcZEF6nFp2o1u5D+6mNaRHojpc1IgFdu4iv5nP67ZrACucDEdQT/Trn0zXEwUAKmXcKeaTOxOZVtL7gBVZCB1MX22rxDAQtJjMWrQMtN5LiZ7T64YBzx6P3ZAB38sLS9GC6bd52KahTtmdXpr4foAzip1ZjpBoe9E6UnWgqgZ3cz0ShcTNQ43Oh0N4Mdd+Llb8XKv6W5W7tkA6J1wN2xEOy9KfCAqKmuX22td1pJ3ov8G8BhnK9LxDIBXALwK4DUAlGQxEsC7/P+flAMJLY8M4mNGfnKci3/5FwQwuCXBdMUc/APSgzFfcDHtz919umVfF9OtOXjK7DWd9yMA3S7VuRVnae+MghQT+XnKfxEAsSy1LqJUfvrSvwPAPbzfakQ3Uvw5VX0obzGgmduyvbYZ1IQyO5etcc9aiVxM2/A+726jB84Fc/D/QkPakLXrYpqKry09oDdhvxz8YShESTPSIysLovQFfw0fNzaVxp+DfxkAHdf1Wq5ZFABlUK7BCQTFLfmPxiyczbtcDv5N6cG0GWdU/7ah083JM6djGzpfWwxrMIiSQ11MT+bgqXe0ekXMSF1M23GCQumeo03IlKGWg6eC+uq4mGg5eGMAm3CFkiJ+R8aC9peumoP/SHogbeRiWpAzPGmbUlNodviVHPynTZysJTPSv3DVoqZfb307B0+/P6qpn3m4mFblzdeloi/wCwGsAmBIDn5vrUGU5OBfycGfkIOnZV9Kc6fllX+g7DZsv5YeRBtxdv3VDQdRcE4AlZE0nXsd1HQQJZPRwwI/qKimOpC6mIbQlgbt4xyD1wFQAf3Zc/Ab5+BvbOoJuVNy8E/l4KmX6+xcLF7tA8CX2MHFFKQH0Sac00D3Lt3DEugB3HQG5VFIGUzlX11MFFTVUhug+MJdDGB6lOVlLnfmcvA/oxkeCpeDH5mDPy8HvwTPrEssx3eSi2lp6UG0CG1FWVnw/PS7ajpjPuELuZj2VUm1gZQvnMRyQn9moFShY25eGn0fFeKZNRUXX42LiJeCtgWd72KaTnogtXMxrQtg75Z/+deEqshJCy6mraGUykDqYqJlxFKW4mgv53H0PjEHf0yTafeScvDXc4bv5gBeRBmGNLQFo7VcTPQa4HfS46h0S1fb48RJLqaFoZCWCzTqe9GTUQZa4hyag9+ljVss6J1vDv5sfvqnwuMltLbawMXUjco6rcdbqf4AQMOsv/Rsc020TA4m5TKC9FdVJlCYoHBmAU+TVHmDvoxXysFT9aFWoz2wOfh9ASzJhSW0O9bFRI2HTWfRci4t+2vQugfbLnoeegzljjOqqAqkAPYE8E3oRq2DvpaDP6W0LNxu45J8S/Ev+ifQi55oh5daIFsjFxPVvv459KAqPKYzHlR2IXenEqBQRE0gdTF9VdmNOCpattyfNwhTYQUz5gzfn/LMRPN1ogze3aQHUQMXE1VIG84JXVqUulVLo79wcQQtBvCDMDWFV0FFIOVq/6fyTEEj2sKycg7+0G7Uv61RDv52TlundndaHcwPcKZ/dlOYYU/JcKYDcvAURK9QdjGHAPgFlFARSAFso3hJl7Z4LJ6DL3HvpKgcPG0J8gB+BZ0m1b4/TTsX01yavtAYVeKy+7WzToE+u7iY6GFdnHggdTHNpPiL9hJOKNL0sr0oNIPPwe/F25k01rtdxcVEdYXN+KGtX9qqzpxoK0edlYO/CcCd0GVCWsnUkOsgHkg5MWWg0i+IjWstrNC0HPwZAL4D4G3oc4yLaWrpQZTGxbQWgLWhC/Xr/Y30ICq1I++b12QJXtFsbyB1MS2qtPDCgbw31N6HdlAO/jquiKRta8KsnEhm+sjFNAk/bGpD9+1b0oOoOCufEgm1OcjF1HRjBFUz0mMVbpzeJwd/sPQgapWDv5ffh78GXXZ2Mc0hPYiC0D7qr0CX4Tn4c6QHUbkjOENbkxkB0D729gVSrsdJLa60BVH6RTFdlIN/mLYRAXhD0YWm93z2ANUHLiZ6FXMgdLmBG3qbLuK989sozOLdRbLd2gSCpcSoxZgmtLXFgmizwXQNrhKlxQ9cTFQ5xYwdJY8NUpZZv14O/kPpgbQBv/LaSNnWtskk6xBIzUg35lJPWlCVIntHJrPMu4GibN4BCh/wNDbr3hl6PE5JbDn4d6UH0ib80LIuF2vQYnMX0zytCKQ8G9W0LHQtNX6WHkRbcReZ7aDHulr2pim1BwAtFWVon/KaOXjK1DUN4x0Na9PfKrn4tA3mgLbMSGk2ugB0eIS3uFh2rqAcfOQkBi2ke2mq5GKaFsD20IFWMb6bg39aeiBtloN/GQBtg3q3zbPSCYTer2hA+xnXz8Fr3NfYRvsreueysYtpQelBKN1HqGW/7Q45+DukB2E+C6Z/AzBM0ayUmp/UG0hdTJSpqWXZbMsc/AjpQZjP8arApkqWiehd6a7Sg9CEe0D+BDqcnYO3Bu2K5OAvBnA09CQNDqp5Rro7dPhNDv4y6UGY0dbm3UxJCzZaItKUmSptM96vJ436/9o2F532AXCPkgxe2udcXyDlRsprQsd7UXsHplQO/i4Ahyi5GbeVHoQiGlrOUXm6zamRvPRAzOhbKALYAoCGz2d7rr5V3Yy00SeEMaAP+vvcFsjodZCStPoduNdmq7mYlgOwsPQ4qGBGDv5+6UGYMcvBP6HkoYvKfq5fVSDl9yv0pCLt8By8tm7vZvRPtkFBgezZuGhE2/1QegAA/kpFU6QHYfrkNADULUZaqG1GSk8G00PWCCVLhqYPcvAPAThKwcXaCi3GxcBpy5okKkv3Y37AMmWUEdwOwAfCQ1nZxUQNwKsJpOJtbijj0JZ0i1zifVZ4DGu7mAaj3UlGUyioPEZVsEwh8uc7Ig5TkH0/rIpAyh01VoKsP3IFHVOQHPy/FCSG0TvSzdHuQCrpLalqNabfjgTwgvB1HOZiGlDDjHRj4VZpH3FZM1OmCwDcKTyGTdBCLqZZueWdpEN4W5Qp80F4X+FhUEeYpWsIpNQlQNIZVnih+Pct0jOSpV1MDu2zqfBD8HMAjhc8v+m/szhRTNJ3iw6k/OXT9aeBL5mNWqZf4XLwtygoHyj9QCiBOvNItza0rWrlPwj/ovZ7d4LKb8RTc/AaSs6Z/pPuGLQhWoQTrJYRHAK9WztD8Pymcy4XnpXO7WJavORASl0BpHyiqPaj6acc/N0AqOqR5PIu9eJsi7UE+xWTY6xRd1Wz0iOFh9HVWNS1G8XFRCnzK0DOJdZiqTqSD0b0rnBVtAf1mZRCLblOFzy/6byLhDN4V+vmD+/mEyd1eqGKRlKOFTy36Q5qNCDZf9KjBVxMEwpvWfudtTesSw6e8lVOEBzCMi6mgSUG0tUh55EcvPSWCdNhOfhPhGcqqzWxJ00BanU4neD5TxI8t+meMwTLfk7Ik7siZ6RSbFmoXsMBUO9SCTMDWAD1W1Hw3Pfk4B8XPL/pkhz8KwCuFLzAKxcVSF1M0wp+4dATzx+Ezm26LAf/IoAkeKGXR/0kH4J/J3hu031nCF5k6mJU1Ix0WcGN3DdaJZTqnV/jzajI0oIPwZSUYuqVuOyjhKEupilLCqSS2boXCp7bNOMKAB8KXeyqZ6QupnkFOzXRQ/A/hc5tmks6+qPge9IlSwqkUhu56d3ZpULnNg3JwdMTrVQTgnldTINQr6WEs7JN/S4UPDetlhYTSBeBXKKCPdG2w1WC5x6KenXlib2PpGYqplk3CK4ofb2IQModI6Se2CWTUEyzrhW84FIPik1YWOi8j+bgpVtumQbk4N8X7Oj0tVJmpFI3ovSXq2lQDv4pAE8KXfSaA2lXvmj6QLopgWnW9UIXfD4X0ySd/qE1BVJ6ynlA6NxGxu1C55V8WOwaFxMlGc0kdHrq8GPa41bBhKP5O/1DJ+r0DwSwIGTcm4OXqpphZFAR+2EC552nkz/MxUT34VQAaP81pedPDGDyUUpsjuQatFQAnJKt3gHwXofbjEndu+QewXOb5t3PbS7pd11i1eUh7YGUOpJLoO4gpl2k3rMMpNlbXxLbXEyTcuClY24As/PhOJdghv6U43MxvQeAKsa8BuAlWvUG8DyAZwA8QQdnOfcFjU9CzsHT2E1L5OD/7WJ6QChLvOMxqqZAKt2F3TTv/wB8INQcgYLOfwVSFxMFyyV46ZeOhQDM1eVxTMnnGON5XEz/APA3PuhJ/D6uRz1Syb1L4ymZVPNxeogq2QNCgXSI6kDKXSPmgIyHhc5rhOTgP3YxPcpF1pu2kItpagDf4AIkSwgXeh+bmfjoXWuUZgT380rOHQBuayDojwkF+JLRasDILk1MxuZllO0RofOqn5HOJvDLBJ6V/F3gvEbeQ0KBtPSasJNxuUM6dud/JrW3jx6GikUzexfT3wXqiz+Gsj0sdN4h2rN2Z4GMp2h2InRuI4veA5rO6Pi2gHFYoi8dzeibVnqm89+Fzku1DlQHUqlCDJRYYdrJPvvyPYvyNV2a9LEcfOkPkS9x5m7TpuFMebWBVKrYtX2Ztpd99mV7r5KynlRQ4rkGzxdRuBz8J5xlLmF6zYF0MGRQj0rTTrZtomy0Vad4/GrpsAaTm05BHV4SOu8gzYFUKmvxdaHzGnn0pWLKVcNstMdpDSXQ7JeDp+IcNXhN6LyqZ6TTQIYF0pbiYgNW0apc1QRS3pe7Be8i6JYrAZyOerwudN6JS2ij1jQLpO1W+sb0NqsmkJIc/IMAtuRSjt3Yb7t5Dr4bP1vKu0LnpXKcagMpVVmRYFtf2q2vJfCMPpRwUpUc/PkAtu7wn432S682DuUeS/EOKtDpQCpRgFhyI7nRoaYn9Lap4ot0VDn44QBWBUDlGfvrIqqgVWk94o+FztvRsqK1LO1SCzVjTHmqXU3Kwd/EHXVOG88/J23t2jgHv1EO/u0uDLHNJu/kD5vIxXRZB3/e1yFjCqHzGmP6R6KkaGN4j+y2LqZDAPwYwKZfUuv1I+7VSSUoL7DWkF2zk4vpux36Wd+nX+J1UT6p0mZGhwHSAzDjjfqwVi8HT9Wb9qXDxfQVAEO5ld60nOVLCZMjAPw5B9+mFbaJhM67WAdrdE9cy9MgdZ0x7TVQegBmvLXuISgH/yQAOgzqeJCq5R2pVI1fo4Mt7ZfL7t12mwoVqCWQStX4NcK4J6hUtrjpP7t3220QKlBLIK3iwzDjZUa7bkWze7fdBqMCtQRSqT6oRt5M0gMw/WL3brvNjArUEkjnlh6AEWOffdmmdjHZ8m4LuZgm4Mzl4tUSSMe2L8vUzT778tnDUDvNWkt+Qy2BdC4Xk22BaSfak2fKZp9hO82DStQSSCezm7G1FpYegOk3+wzbaSgqUUsgJXYztgyvQnxNehym3+zebaeFUYmaAumi0gMwjZuPVyNM2ezebadFUImaAumy0gMwjbPPvA7OxUSJJ6YlXEyTd7DWrbiaAukylnDUOstLD8B0jH2W7bJkTZ1/qvmDAJiSl4jukx6IacwKFV7rf/Zqdv1mr39OpRDpnTA9yU9f2b3bE0gvlB6EacwKNV3r2m7G1SyQtoOLaQi/Iy0JBchHATwO4AkAz1EzEADPUxst7l05LjWGB3FloCF80J7aBTgBawaUZXXpAZjGv6urUVsgXQPAYdKDMI3wyq/zewDupf6S/Nf7cvAUNDsiB09BmY5nANw96r93MQ3mZI6l+V3yUsrrms7vYpozB09/HlMxF9M0tS3l1xZIl3UxDczBvyU9ENPIQ5MmHwO4E8ANAG6i4JmDHyk1mBz8qzwWOj7jYqKZ6ip8rKiwhRV9pidLD8J03cq1xZ6q/jD851kHwB+kB2K6x8U0lZKlwPcBJACXAbhqXJZmJeTgHwFAx3EupkkBrApgPb5nNCwFb2iBtBU2RGVqC6RkYwuk1fuO4P7RT3jGeRaAi3Pw76JAOfgPAFxJB2e70zurLQGsK3htV3QxzZiDf0Xo/KaZbS/r1nahawykq7mYpsvBvyE9ENM13xO8tjvl4E9ERXLwtCx9DR30aoRn2LT0K7EdbwOblVZtLd5hUZWa9pH2mATA5tKDMN3hYppZ+P3o9agY5xdcLjiErQTPbbpvyxovco2BlGwjPQDT1RtRaiXlhRz8CNTvPwlKApZ0MVVTOs58wcU0O4A1UaFaA+lQFxOl/Zv6GgH/UHAIt6AdKCHpNcHzbyt4btM9W9cac6r8Q7FdpQdguvJ+RbJ35bVogRz8pwCuExzClpTnIHh+02Hu8yzx7Wu9sDUH0g25+o2pxx6C56Zs3avQHn8UPDclo/xI8Pym874PYKZaL2zNgZRS+m1WWgkX0zIAvik4hDu07xPtMMriFSsoAWBn3iph6nglswcqVnMgJT9yMVEtUlO+nwufn/ZctgZn794mOATKzrZZaT17+xdAxWoPpLSxfD/pQZiOzEalKxldhPaR7sayt81Ky+Y+L/ZxICo3UQP7tr7B2VqSs9Jf5+CfEhyD6Z/DhS8g1c19Gu1DDw/HC243olnpLtaIomjDFMxGdx2lJWGnvT8AzWygf0F49ntpDn59wfOb8eRios/tYuELSNWMKKC0jovpauECGFSCcd4c/MuCYzDjwX3e6u/vwklGD+Tgv97tk3Q9uPENIJlKT9ZzMUmUPDP9T5k/SvgifqxgiVPSOcLnpwYFhwqPwYyf/RRk6p7ZxEmamiVq6MZyEn8xm3LsD2Au4TFc2fLZ0CUApNsSDnMxVdW/snYupgUB7KbgIfjcmgIp3YyvQxat0+8jPAbTR9w7U8PndTpaLAf/voIHYXoFdZo9CBe13eU0rnsu6fIc/D+qCaQ5+H8DGA55+/EXtNGf6RcBTCw8lOd5P2XbnSo9AH4Qtgz8MmwHYDnpQTTZRajJBKDfAqDSY5LoCelse7JVb18AGmoln8ItxlotB/8wgLs1LPXzViijlIvpqwB+JT0OTnK6sbpAmoN/AkCCPOos8UvpQZjRczEtBeBnCq4PraKcIj0IRY5RUq3sLBcTJSAZZVxME/M7SQ0VqU7gmtGNaHpLioYnFbK7i6nKdj4l40Ll5ylpOH9WDv5V6UEocimAZ6QHwU0LNCw1m9F/vy+m4MK8AeCMJk/YaCDNwd8M4D7IG8BLvHNLD8R8zsVEn8lZCrJ0e/xaegCa8BL3cdBhMxfTTtKDMF9wMW1K9ZGVXJOTc/C0/7gxEkUStMxKp6VsYhcTdZow8mg5V8sqAWX7PSo9CIVOV5B93+NoF5NkEwPDXExDFWW30yuZxounSARS2tz+GHSg96XncpaoEeJi2lzJe9Eev5AegEb8lC9dIKMHLf9f6mKaT3ogbcZNQa7k1ndQkiD4cvWBNAdPfR0Pgh5rK0mkaCUX0zeafp/Rh9noA9KDUOwERbPS6elL3MU0WHogbcSreVcBmAN6ZqNHSJxYqv7tBQAegR47uZioio5pkItpMX6ald4v2uNTBe3aSpiVHgk95qUvcxfTQOmBtImLaRJu/r4Y9PhtDv6l1gRSnpXuDV1+aQkMjZcQoxrM00CPs3Pwf5UeRAGO52IVWiwJ4AoX0xTSA2nRNhfqDLQS9HhLclujWEeWHDwtCdwEXY5zMW0vPYjauZgWBnA9gBmgBy0LHSA9iBLk4P/FdZA1+SYv81ow7f5M9Hx+JabJoTn419va2HtPBdWORnWii0lDjdeaM/zoAWpW6HJ8Dv5Z6UEUhLYqPQhdaIZ0gy3zdgc3WaeZ6HrQ5VkAv5EcgGggzcHfzzVVtTnMxXQ47200HcLbFW5XNhMllOVn1a7G/fXMjtBnWQA3czap6RAX07RcmU7bTJTsyfXc0dYZaU9dVapEoQ29wz2HlzJMP7mYvkezBWXvRHvsloN/W3oQpcnB366gM8zoUALMPfwe3vSTi2kIgLt4+Vyba3Pw4v2CxQNpDv41hYlHPTblp9uZpQdSckslFxNlwp6tKDu3t5tz8I30LKwUvZ7R+BDi6MvfxbSG9EBK5mJagR5KuPuONh9qWRURD6SMlnfvgE7UDug+FxMtGZlxXw66Qlmxhd4+AGDJZf3A/R615hQM5K0xP7XXNOPOxbQD5zNonUgckoOnLi/i1LwDdDHRfjBq1zQpdPqI+yEe3WRXgVK5mKgN2jkANNcz3isHr6VkZbE4SNEX7orQ62oAW+XgX5EeiHacrEW9PDeDXg/StqccPH0vi1MTSImLaU9lm71Hh/Y+DpPa+Ksdl1vcm8vsaejiMiZ/psQU6zfaGS6mufhBWEupuNF5he9da9Y+Bi6m5fgBmN6LavUxgKU4WVWFAQq/hG8BQOvymv2TE1R+Lz0QTVxMC3Hxag1NuceGMvwWt8L0neVi2g7ASdCPXiXtkYN/U3ogWvD+24MB7KLold+Y/DwHr6oetqpA2itD7CGl2Z2joqIC2+Xgn0SL8f6yffgoIct5hxx8CV/4JS7xXgZgHehHK0o75eBpX2SruZhWo/J6iloYjs1n2cPaVpLUBdJeWyUoy7MEH3LRe6qs8Q5axsW0AXcEmRNluCIHv670IGrlYpqB319pK7gxJtQjeeccPC1Lt4qLiZqkHw2glPvhHerYlYN/GsqoDKTExXQagG1Qjp5N/afl4Cm4tqFryyEA6K+loPqwi0qWEmsDF9O3ebVG+xJhD5rdDKeuVDn4jMrxdj5aPdqukBWkHhtpXUHQHEgn42m8pu4CffEct4k7s8aAyskIBwJYHWX5kJeE7pUeSBtwmc3DUJaPeInzqBoDqotpJgC7AviJ8qSw0Tk2B09jV0ltICUuJto6cR8A2o9Ympe5S8bJOXiNlZvGqagCL//swftqS/TjHPwp0oNo2fvSixXWZe3rDPU8DqjFdwNyMX0VwO4AtgBAE5TS3El1lLVsdSkukBIX0ypc45EyektEnTKohNXpXFKtGC4mes8VeImdKsWUKubgS3pNUAUX09S8zYi+yEt1N4BTqYdyDv59FMLFNCk/xPwQAC21lyrzVhcq/KGW+kBKuLXZiSjfCG5qfl4OXlNj8/9wMU3PN+CmfAOW8p5rTGg71eo1LrOXgFeV7lXYqGB8El0u55nqdRpnR7x9kIpibAJgQwDToWzvAVg+B6+ty1CZgZS4mE6gbQuox+MAruGKK3dIdi/g/Z8ewJqcPKS5kMK4PrhQ0QXa92uEuJiWB3Cj4qpl4+pNLsxyDRdNFyvO4mIaBIC2r6zBR+kPLD2ou9AGOXjaTqVeSYF0Ql4iLfGdS19qvv6F6w1Tgei/5uCf6WL920UALEFPe1z8YjDq8xoH0SekB2I++73bhGdzNRrB7/HooGo7j+bg6Z7uKBcTNX2YnxMwl+OH3gVK+h6vda/3gAI3/l9XQOWjTi0l/Q3AU3w8ywlMr/PxLr9/JSN5FknHVAAG9Tocb7Sei2/Ckt919tXbnJygpoSY+ez+3VG6AXODyUr/B4AKqj/Nx4sAXuUHPLp33xrl3gUXoem5f2fkYvE99+48HDQ1dlDqtINz8LQzoBhFBdJeBZVvAzBUeixGJXq4WDMHT+9GjTIuJuoERG31jBkd2n60fWmNQYoLpMTFNJi7TdC7PWN6UALIhjl4at1mlHIxHa64B7GR83vu0FNUEC02kPYKpnfxkocxFkQLYsHUjII6zvxAWw3dvip2a0MO/lV+4U7vEU27WRAtTA6eKh8dIT0Oo8KZJQfRogNpr2BKex3/JD0WI4Y2yX/HlnOLDabUusu0+53osJKDaPGBtFcwpX1UllzSPpQB+e0cPGVymwJxdubO0uMwIg4pMbGoqneko3IxTcJLBLRfzdTvOa5Y9Jj0QEz/uZg25fu3Dds72u4TKpyfgz8ZlSh+RtqDS8Btxr0xTd3+zPU3LYhWIgdPxRqorrZVoar/VcwGNQXRqmakvbmYhgE4pbBee6ZvLuR3KsUUEDfj3Gz6qsIL3ZsxF6Bft4aOOtXOSHvLwQ/n4s2qOwaYcV4Oos38m1gQrVcO/kkAy3ANalOPO3gVqbogWu2MdJQ2YOdSQ2fpsZh+oeW+7+Xgr7Xr2Kp+pvsD+EWtD/wtchyAPTV2zOmUqgMpcTFRHctfWiWVYt3Ls1CqNWxaxsW0KoCzK22s0Iaa11vl4C9B5aoPpD1cTKsD+B2AWaTHYvq8lHsY1WXNwVNhb9NSLqaZAAznVn+mDHcB2CIHTw03qteaQEpcTDNwt/saW7HVlpSweQ7+dumBGFVLvTtwVn4tfU1rNJKbEhxeepGFcdGqQNrDxbQFgGMBTC89FvM/qAfhPjl4aiNnzH9xMc0HILaklWJpHgQQcvD3oWVaGUh7Fb0/3go4qEENuLe2Waj5Mi4mSj7ajmY93L/TyPoAwEEAjmzra5jWBtIeLqY1uNmwdZGR8W9+F0o3If29MX3iYpqdl3qtmpmcBGCnHDw1MW+t1gdS4mKidy67AvgpgCmkP5QWuZSuu2Xkmv5wMa3Eq0tfsyvZmGeoRrI1i/icBdJeXEyz8IvyAGDC3v/OdBR169krB3+rXVfTwW1uW/G+U8vM7+6ebio2f2IOnpZ0jQXS0XMxzQ/gUMvu7bjHARwA4JIaOj4YfVxMk/Pq0l4ABkqPpyLv8az/iBz8m9KD0cZmpGPhYhoKYD8AG9u16pfHOBnhghw87Q81pqtcTNPydhkKqoPscvcrgJ5A76Jz8NS20IyGBdI+cDEtCGA32mBshfDHyT30BAvgcpuBGgkupqk4w3dHAHPYp9Bnr/AM9LcWQL+cBdJxr7BCT7nbAqC/N/9rJHdoOTYHT+9CjdHyDnV9biK+nPR4lO8FpV0MZ9s70L6zQDoeXEzUfHgdAD/iHop2HT/fB0ob5X+fg39pfK6rMU1wMS3GCYXfB0BLwG1HLQmpH+wp9vA7fiwA9JOLaU7qTMI3JS0Bt8kbvIXl9wBut+VbUxIX02ScUPgDfiCmWWtbUK7CTQDOAXBxDp4KzJvxZIG0g1xMi1L3d2peC2Bh1Jv+fjV35Lix5tZIpj1cTNNzUN0IAO1LnQR1vnahLWeXceb8i9IDqoUF0i5xMc0NYG0Aq3KT8SlRpk/5vcnVfNzTpmLUprUJSjRDXRMAVT6jCkqlomB5A4Dr6P7NwdMqkukwC6TNvVNdlgttLw9gGcUF8+mp9a/c0Z6eXm/LwdMs1JhWcjHNw/fuinz/ai4n+jSAuwHcCeCWHPyj0gNqAwukci2h5gWwKB9DubyZA0AFuZvyKhdJoON+ANS14SHL1jNmzFxMVOhhcT7o/l0AwHwNrzp9CIDq2z5M9yw//N6fg/9Hg2MwzAKpIi4mei8zNwfZ2fmgcmezcnYhHXQTTz6Wqi2UNEBLr2/0OmhG+TwfL3KdzBG2zGNMR+/fOXi22nPv0oPxjABm4Ht3OgDTAJh4DDW9R3IBBGohSNWD3uJ79wU+XuYZJ2XIP2fFTaDG/wOSRqI31qyPNgAAAABJRU5ErkJggg==) center/contain no-repeat}
/* line-height 1.3, not 1: the word sits in a box that clips (overflow:hidden carries the rail's
   max-width collapse), and at 1 the box was the cap height — the descender of the g was cut off
   along the bottom (Sam, 2026-09-15: "a tad bit of its text cut off on the bottom") */
.glass .brandword{font:600 15.5px/1.3 var(--font);letter-spacing:.01em;color:var(--w-ink);white-space:nowrap}

/* ═══════════════════════ 1 · the shell ═══════════════════════ */
.shell{position:relative;display:grid;grid-template-columns:var(--sbw,256px) minmax(0,1fr);
  height:100%;min-height:0;min-width:0;overflow:hidden;border-radius:18px;isolation:isolate;
  transition:grid-template-columns .3s var(--lg-snap)}
.shell.fill{height:100dvh;border-radius:0}
.shell.m-rail{--sbw:78px}
.shell.m-drawer{--sbw:0px;grid-template-columns:minmax(0,1fr)}
.shellbg{position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(62% 62% at 10% 6%,rgba(30,157,184,.18),transparent 62%),
             radial-gradient(54% 54% at 90% 26%,rgba(167,149,199,.12),transparent 60%),
             radial-gradient(74% 74% at 50% 112%,rgba(205,255,78,.06),transparent 62%),#0b1a24}
.glass.light .shellbg{background:radial-gradient(62% 62% at 10% 6%,rgba(30,157,184,.12),transparent 62%),
             radial-gradient(54% 54% at 90% 26%,rgba(167,149,199,.1),transparent 60%),#eef3f6}
.shellmain{position:relative;z-index:1;display:flex;flex-direction:column;min-width:0;min-height:0;padding:10px 10px 10px 0}
.shell.m-drawer .shellmain{padding:10px}
.shellbody{flex:1;min-height:0;min-width:0;overflow:hidden auto;overscroll-behavior:contain;margin-top:10px;
  border-radius:16px}
.shellbody>.pages{padding:0 2px 40px}
/* the drawer scrim, only under the narrow breakpoint */
.shellscrim{position:absolute;inset:0;z-index:3;background:rgba(2,16,26,.5);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
  opacity:0;pointer-events:none;transition:opacity .26s ease}
.shell.m-drawer.sbopen .shellscrim{opacity:1;pointer-events:auto}
.glass.light .shellscrim{background:rgba(23,48,62,.32)}

/* ═══════════════════════ 2 · sidebar v2 ═══════════════════════ */
.sidebar{position:relative;z-index:4;display:flex;flex-direction:column;width:calc(100% - 20px);min-height:0;margin:10px;
  border-radius:16px;overflow:hidden;
  background:linear-gradient(165deg,rgba(255,255,255,.13),rgba(255,255,255,.05) 46%,rgba(255,255,255,.09));
  -webkit-backdrop-filter:blur(22px) saturate(1.7);backdrop-filter:blur(22px) saturate(1.7);
  border:1px solid rgba(255,255,255,.2);
  box-shadow:0 6px 18px rgba(2,16,26,.3),inset 0 1px 0 rgba(255,255,255,.4),inset 0 -14px 28px -18px rgba(30,157,184,.3);
  transition:width .24s var(--lg-snap),transform .3s var(--lg-snap),box-shadow .24s ease}
/* one width for every expanded state — full, hovered rail and drawer all read the same panel token
   (--sbpanel = the shell's column minus its 2 x 10 px margin), so they cannot drift apart
   (Sam, 2026-09-15: "Overview is a little cut off" while hovering) */
.shell.m-drawer .sidebar{position:absolute;left:0;top:0;bottom:0;width:var(--sbpanel,244px);transform:translateX(calc(-100% - 14px))}
.shell.m-drawer.sbopen .sidebar{transform:none;box-shadow:0 18px 46px rgba(2,16,26,.5),inset 0 1px 0 rgba(255,255,255,.4)}
.glass.light .sidebar{background:linear-gradient(165deg,#fbfeff,rgba(240,247,251,.94) 44%,#f4fafc);
  border-color:rgba(4,40,56,.14);box-shadow:0 6px 18px rgba(23,48,62,.12),inset 0 1px 0 #fff}

/* no hairline under the brand any more: the row's own height is the separation (Sam, 2026-09-15:
   "fewer lines" — a border here sits one pixel above the scroller's first caption) */
.sbbrand{display:flex;align-items:center;gap:10px;height:50px;padding:0 12px;flex:none}
.sbbrand .brandword{max-width:132px;overflow:hidden;transition:opacity .14s ease,max-width .22s var(--lg-snap)}
/* the collapsed rail centres the 30 px mark inside the 60 px panel by CENTRING it with no padding
   and no gap: the hidden word still owned its 10 px flex gap, which is the 5 px the rail census
   measured the mark as sitting left of the rail's centre (2026-09-15) */
.shell.m-rail .sbbrand{padding:0;gap:0;justify-content:center}
.shell.m-rail .sbbrand .brandword{opacity:0;max-width:0}
.sbtog{margin-left:auto}
.shell.m-rail .sbtog{display:none}

/* The group list is the part that scrolls; the brand and the account block are pinned. With the
   Policy tree open the four groups are taller than a 760 px laptop viewport, so the overflow has
   to READ as overflow — a row cut flat by the account block reads as a broken sidebar, which is
   exactly how it was reported (2026-09-14). Two cues: the thumb is always drawn (the
   ::-webkit-scrollbar rules opt out of macOS overlay scrollbars), and the last 14 px of the box
   fade. The scroller's own 14 px of bottom padding sits in that band when nothing overflows, so
   the fade only ever eats empty space unless there is more list below it.
   `scroll-padding` is the second half of the same promise: the account block is NEVER drawn over a
   row, so a row that has to be scrolled back into view (app.js `revealNavItem`) must land clear of
   both the fade band and the pinned block under it, never flush against either. */
.sbscroll{position:relative;flex:1;min-height:0;overflow:hidden auto;padding:6px 8px 14px;
  scroll-padding:6px 0 16px;
  scrollbar-width:thin;scrollbar-color:rgba(107,197,214,.45) transparent;
  -webkit-mask-image:linear-gradient(180deg,#000 calc(100% - 14px),transparent);
  mask-image:linear-gradient(180deg,#000 calc(100% - 14px),transparent)}
.sbscroll::-webkit-scrollbar{width:5px}
.sbscroll::-webkit-scrollbar-thumb{background:rgba(107,197,214,.42);border-radius:99px}
/* the rows grew 4 px each with the type step, so the space BETWEEN groups gives some of it
   back — the whole nav still wants to stand on one screen (2026-09-14) */
.sbgroup{margin-bottom:2px}
/* a caption, not an item: uppercase (RULES §2 locks the wording), one step up the scale, and
   quiet at 70 % so the group heading never competes with the rows under it (2026-09-14) */
.sbcap{font:700 12px var(--w-font);letter-spacing:.14em;text-transform:uppercase;color:var(--w-dim);opacity:.7;
  padding:10px 10px 5px;white-space:nowrap;overflow:hidden;transition:opacity .18s ease}
/* the rail hides the WORD and keeps the SLOT. The 12 px box this used to impose was 9 px shorter
   than the caption's own line, so OBSERVE · GOVERN · KNOWLEDGE · SETTINGS were cut off flat —
   including in the hovered rail, where they are meant to be read (Sam, 2026-09-15: "Observers is
   cut off, Governance is cut off … when the observe mode is collapsed"). No divider replaces the
   word: the reserved height is the separation, and Sam asked for fewer lines. */
.shell.m-rail .sbcap{opacity:0}
.glass.light .sbcap{color:#3f5d6c}

.sbitem{position:relative;z-index:1;display:flex;align-items:center;gap:10px;width:100%;height:40px;padding:0 10px;
  border:0;border-radius:10px;background:transparent;text-align:left;text-decoration:none;cursor:pointer;
  font:600 16px var(--w-font);color:var(--w-dim);white-space:nowrap;overflow:hidden;
  transition:color .14s ease,background .16s ease,transform .1s ease}
.sbitem:hover{color:var(--w-ink);background:rgba(255,255,255,.07)}
/* the active row is the pill's soft fill + ink + 600 — no accent bar, no ring (2026-09-14) */
.sbitem.on{color:var(--w-ink);background:transparent;font-weight:600}
.sbitem:active{transform:scale(.985);transition-duration:.08s}
.sbitem:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:-2px}
/* the nav glyph is the one icon Vadim named, and 20 px still read small to Sam on the third pass:
   22 px — a clear step above the 15 px label, never equal to it — at the same 1.6 stroke, so the
   bigger box does not read as a bolder stroke (2026-09-15) */
.sbitem .gicon{width:22px;height:22px;stroke-width:1.6;color:currentColor;opacity:.95}
.sbitem .lab{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;transition:opacity .18s ease}
.sbitem .cnt{flex:none;font:600 13px var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-dim);
  text-align:right;transition:opacity .18s ease}
.sbitem.sub{height:36px;padding-left:40px;font-weight:500;font-size:15px}
/* the rail is structure — the indent guide a sub-row hangs from — so it stays the same hairline
   whether the row is active or not: the active state is the pill's fill, nothing else */
.sbitem.sub::before{content:"";position:absolute;left:22px;top:9px;bottom:9px;width:1.5px;border-radius:2px;background:rgba(255,255,255,.16)}
.sbchev{flex:none;display:grid;place-items:center;width:16px;height:16px;color:var(--w-dim);
  transition:transform .24s var(--lg-snap),color .16s ease}
/* 12 px at stroke 2 — at 11/2.2 it was the smallest box and the heaviest stroke in a sidebar where
   every other glyph is 22/1.6, so the one control that opens a tree read as debris (2026-09-15) */
.sbchev svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.sbtree.open>.sbitem .sbchev{transform:rotate(180deg)}
.sbsub{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s var(--lg-snap)}
.sbtree.open .sbsub{grid-template-rows:1fr}
.sbsub>div{overflow:hidden}
.shell.m-rail .sbitem{padding:0;gap:0;justify-content:center}
.shell.m-rail .sbitem.sub{padding:0}
.shell.m-rail .sbitem.sub::before{display:none}
.shell.m-rail .sbitem .lab,.shell.m-rail .sbitem .cnt,.shell.m-rail .sbchev{opacity:0;pointer-events:none;
  flex:0 0 0;width:0;min-width:0;padding:0;margin:0;border:0;overflow:hidden}
/* entering the rail collapses every open tree. Letting that collapse ANIMATE means the active
   pill is measured mid-flight and lands one sub-tree's height too low on a first paint straight
   into rail mode — the pill sat 160 px below Harness until the next route change (measured
   2026-09-14). The rail's own width change is the one cue this state gets. */
.shell.m-rail .sbtree .sbsub{grid-template-rows:0fr;transition-duration:0s}
/* The hovered rail is the expanded panel: the SAME width token as full mode, the same caption
   height, the same 30 px mark at the same x (padding 15 = the centred mark's own left edge in the
   60 px rail, so the brand does not slide when the panel opens). Nothing else changes.
   Every word waits for the width to LAND before it fades in (transition-delay on the way in, none
   on the way out): the rail census caught 16 of 16 labels drawn at full length inside a 58 px
   panel for the first ~200 ms, which is the "Overview is a little cut off" Sam saw while hovering
   (2026-09-15). */
/* the hovered rail is an OVERLAY over live content, not a column beside it: at 1100 on Overview the
   bright cyan area chart came straight through the panel as a shapeless smear behind SETTINGS ·
   Harness · Models · Platform, gridlines and all (A1 #14, 2026-09-15). One more stop of white (+.10)
   over the rail's own gradient was not enough on its own — measured on the panel's own empty pixels
   it took the spread from 9.36 to 8.44, and the smear was still there. The white sits on a ground
   of the panel's own colour instead, and THAT is what lands it on the full sidebar's texture:
   spread 4.13 against the full sidebar's own 4.19 at 1440 (before: 9.36). The resting rail and the
   full sidebar keep the lighter fill, so nothing else on the console changes. */
.shell.m-rail .sidebar:hover,.shell.m-rail .sidebar:focus-within,.shell.m-rail .sidebar.flyopen{width:var(--sbpanel,244px);
  background:linear-gradient(165deg,rgba(255,255,255,.23),rgba(255,255,255,.15) 46%,rgba(255,255,255,.19)),
             linear-gradient(165deg,rgba(9,36,50,.62),rgba(6,28,40,.6));
  box-shadow:0 16px 40px rgba(2,16,26,.48),inset 0 1px 0 rgba(255,255,255,.4),inset 0 -14px 28px -18px rgba(30,157,184,.3)}
.glass.light .shell.m-rail .sidebar:hover,.glass.light .shell.m-rail .sidebar:focus-within,.glass.light .shell.m-rail .sidebar.flyopen{
  background:linear-gradient(165deg,#fbfeff,#f1f7fb 44%,#f4fafc)}
.shell.m-rail .sidebar:hover .sbbrand,.shell.m-rail .sidebar:focus-within .sbbrand,.shell.m-rail .sidebar.flyopen .sbbrand{padding:0 14px;gap:10px;justify-content:flex-start}
.shell.m-rail .sidebar:hover .sbbrand .brandword,.shell.m-rail .sidebar:focus-within .sbbrand .brandword,.shell.m-rail .sidebar.flyopen .sbbrand .brandword{opacity:1;max-width:132px;transition-delay:.22s,0s}
.shell.m-rail .sidebar:hover .sbcap,.shell.m-rail .sidebar:focus-within .sbcap,.shell.m-rail .sidebar.flyopen .sbcap{opacity:.7;transition-delay:.22s}
.shell.m-rail .sidebar:hover .sbitem,.shell.m-rail .sidebar:focus-within .sbitem,.shell.m-rail .sidebar.flyopen .sbitem{padding:0 10px;gap:10px;justify-content:flex-start}
.shell.m-rail .sidebar:hover .sbitem .lab,.shell.m-rail .sidebar:focus-within .sbitem .lab,.shell.m-rail .sidebar.flyopen .sbitem .lab{opacity:1;pointer-events:auto;flex:1 1 auto;width:auto;min-width:0;transition-delay:.22s}
.shell.m-rail .sidebar:hover .sbitem .cnt,.shell.m-rail .sidebar:focus-within .sbitem .cnt,.shell.m-rail .sidebar.flyopen .sbitem .cnt{opacity:1;pointer-events:none;flex:none;width:auto;transition-delay:.22s}
.shell.m-rail .sidebar:hover .sbchev,.shell.m-rail .sidebar:focus-within .sbchev,.shell.m-rail .sidebar.flyopen .sbchev{opacity:1;pointer-events:none;flex:none;width:16px;min-width:16px}
.glass.light .sbitem{color:#3f5d6c}
.glass.light .sbitem:hover{color:#0c2836;background:rgba(4,40,56,.05)}
.glass.light .sbitem.on{color:#0c2836}
.glass.light .sbitem .cnt{color:#3f5d6c}
.glass.light .sbchev{color:#3f5d6c}
.glass.light .sbitem.sub::before{background:rgba(4,40,56,.16)}

/* the active pill — an indicator, so it uses --lg-snap (a spring here reads as lag).
   A soft full-width fill and nothing else: the 1 px ring and the drop shadow it used to carry
   read as a second, competing accent beside the row's own ink (2026-09-14). */
.sbpill{position:absolute;left:8px;top:0;width:0;height:40px;border-radius:10px;z-index:0;opacity:0;pointer-events:none;
  background:linear-gradient(160deg,rgba(30,157,184,.42),rgba(30,157,184,.26));
  border:1px solid transparent;box-shadow:inset 0 1px 0 rgba(255,255,255,.14);
  transition:top .24s var(--lg-snap),left .24s var(--lg-snap),width .24s var(--lg-snap),height .24s var(--lg-snap),opacity .16s ease}
.sbpill.on{opacity:1}
/* `hold` is the frame-by-frame ride under an opening or closing tree (nav.js `follow`): the pill is
   placed every frame, so its own transition would only trail the row it is following */
.sbpill.hold{transition:none}
/* light carried .2/.13 of the accent and read as a grey wash — the active room was the one thing on
   the sidebar you could not find. Same WEIGHT as dark, in the accent family (audited 2026-09-14). */
.glass.light .sbpill{background:linear-gradient(160deg,rgba(30,157,184,.34),rgba(30,157,184,.2));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5)}

/* no hairline over the account block either: the scroller's own 14 px mask fade already ends the
   list above it, and two separations in 14 px is the "lot of lines" Sam named (2026-09-15) */
.sbfoot{flex:none;padding:7px 8px}
.sbuser{display:flex;align-items:center;gap:10px;width:100%;height:44px;padding:0 8px;border:0;border-radius:11px;
  background:transparent;cursor:pointer;text-align:left;color:var(--w-ink);transition:background .16s ease,transform .1s ease}
.sbuser:hover{background:rgba(255,255,255,.08)}
.sbuser:active{transform:scale(.985);transition-duration:.08s}
.sbuser:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:-2px}
.sbuser .un{flex:1;min-width:0;overflow:hidden;transition:opacity .18s ease}
.sbuser .un b{display:block;font:600 15px var(--w-font);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sbuser .un span{display:block;font:500 13px var(--w-font);color:var(--w-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* the avatar is centred on the rail's axis like every glyph above it: the name block must give up
   its flex GROW as well as its width, or it keeps pushing the avatar left (2026-09-15) */
.shell.m-rail .sbuser{padding:0;gap:0;justify-content:center}
.shell.m-rail .sbuser .un{opacity:0;flex:0 0 0;width:0;min-width:0;overflow:hidden}
.shell.m-rail .sidebar:hover .sbuser,.shell.m-rail .sidebar:focus-within .sbuser,.shell.m-rail .sidebar.flyopen .sbuser{padding:0 8px;gap:10px;justify-content:flex-start}
.shell.m-rail .sidebar:hover .sbuser .un,.shell.m-rail .sidebar:focus-within .sbuser .un,.shell.m-rail .sidebar.flyopen .sbuser .un{opacity:1;flex:1 1 auto;width:auto;transition-delay:.22s}
.glass.light .sbuser{color:#0c2836}
.glass.light .sbuser:hover{background:rgba(4,40,56,.05)}
.glass.light .sbuser .un span{color:#3f5d6c}

/* the rail's hover flyout — the labels the rail hides, beside the rail */
.flyout{position:fixed;z-index:48;min-width:206px;padding:6px;border-radius:13px;pointer-events:none;
  background:linear-gradient(160deg,rgba(9,36,50,.97),rgba(6,28,40,.96));
  -webkit-backdrop-filter:blur(16px) saturate(1.6);backdrop-filter:blur(16px) saturate(1.6);
  border:1px solid rgba(255,255,255,.22);box-shadow:0 12px 30px rgba(2,16,26,.5),inset 0 1px 0 rgba(255,255,255,.3);
  opacity:0;transform:translateX(-4px) scale(.985);transform-origin:left top;transition:opacity .14s ease,transform .2s var(--lg-snap)}
.flyout.on{opacity:1;transform:none;pointer-events:auto}
.flyout .fyh{font:700 13px var(--w-font);letter-spacing:.14em;text-transform:uppercase;color:var(--w-dim);padding:7px 9px 5px}
.flyout .sbitem{height:36px;font-size:15px}
.flyout .sbitem .lab,.flyout .sbitem .cnt{opacity:1}
.flyout .sbitem:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:-2px;background:rgba(30,157,184,.2);color:var(--w-ink)}
.glass.light .flyout{background:linear-gradient(160deg,#fff,#f4f8fb);border-color:rgba(4,40,56,.18);
  box-shadow:0 12px 30px rgba(23,48,62,.2),inset 0 1px 0 #fff}
.glass.light .flyout .fyh{color:#3f5d6c}

/* ═══════════════════════ 3 · top bar ═══════════════════════ */
.topbar{position:relative;z-index:8;display:flex;align-items:center;gap:10px;flex:none;min-width:0;height:52px;padding:0 12px;
  border-radius:16px;
  background:linear-gradient(165deg,rgba(255,255,255,.13),rgba(255,255,255,.05) 50%,rgba(255,255,255,.09));
  -webkit-backdrop-filter:blur(22px) saturate(1.7);backdrop-filter:blur(22px) saturate(1.7);
  border:1px solid rgba(255,255,255,.2);
  box-shadow:0 6px 18px rgba(2,16,26,.28),inset 0 1px 0 rgba(255,255,255,.4),inset 0 -14px 28px -18px rgba(30,157,184,.28)}
.glass.light .topbar{background:linear-gradient(165deg,#fbfeff,rgba(240,247,251,.94) 46%,#f4fafc);
  border-color:rgba(4,40,56,.14);box-shadow:0 6px 18px rgba(23,48,62,.12),inset 0 1px 0 #fff}
.glass .icobtn.tb{width:30px;height:30px}
/* 16 px in a 30 px box: the bar's glyphs were 14 and read small beside a 40 px field (type scale,
   2026-09-15) */
.glass .icobtn.tb svg{width:16px;height:16px}
/* three parts: toggle · command surface · controls, and NOTHING else — the trail moved into the
   page head (Sam, 2026-09-15). Both tracks carry 30 px buttons alone now, so equal `flex:1 1 0`
   puts the field on the bar's centre line by construction; app.js `fitField` writes only its width.
   (Equal tracks used to centre the field by STARVING the trail — that trade is gone with it.) */
.tbleft{display:flex;align-items:center;gap:10px;flex:1 1 0;min-width:0}
.tbspace{flex:1;min-width:8px}
.tbright{display:flex;align-items:center;gap:7px;flex:1 1 0;min-width:min-content;justify-content:flex-end}
.tbright .menuwrap{width:30px;height:30px;flex:0 0 30px}
.tbpark{display:none}
/* `.tbsep`, the hairline between the toggle and the trail, is GONE with the trail it separated
   (Sam, 2026-09-15: "fewer lines"). Nothing replaces it — spacing does the work. */
/* THE command surface (Vadim, 2026-09-14: "Search or ask should be wider, more prominent and
   somehow highlighted. Add a UI-indicator on it"; Sam, 2026-09-15: "I don't know if it needs to
   have a bubble around it … fitting into the UI style", "fewer lines … very nice liquid glass …
   maybe a very frosted surrounding"). It is a FROSTED CAPSULE with NO border line: the surface is
   the blur, a fill one tone above the bar, an inner top highlight and a soft drop shadow — a glass
   edge, not a hairline. Prominence is bought with width; the indicator is the rim below. */
.tbsearch{position:relative;display:flex;align-items:center;gap:10px;flex:0 0 auto;width:640px;height:40px;padding:0 14px;border-radius:999px;cursor:pointer;
  font:500 16px var(--w-font);color:var(--w-soft);border:0;
  background:linear-gradient(160deg,rgba(255,255,255,.2),rgba(255,255,255,.1));
  -webkit-backdrop-filter:blur(14px) saturate(1.4);backdrop-filter:blur(14px) saturate(1.4);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 4px 14px -8px rgba(2,16,26,.6);
  transition:color .16s ease,background .2s ease}
/* 16 px, the same box every other glyph on this bar wears — 17 was a seventh icon size on one
   screen and read as a mistake beside the 16 px toggle and bell (icon census, 2026-09-15) */
.tbsearch .gicon{width:16px;height:16px;color:var(--w-ink);opacity:.6;transition:opacity .16s ease}
.tbsearch:hover{color:var(--w-ink);background:linear-gradient(160deg,rgba(255,255,255,.26),rgba(255,255,255,.14))}
.tbsearch:hover .gicon{opacity:.85}
/* keyboard focus is the kit's own 2 px outline, NOT a brighter rim: the rim says "this surface
   acts" and says it at rest, so it cannot also be the focus ring a keyboard user needs (2026-09-15) */
.tbsearch:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:2px;color:var(--w-ink)}
.tbsearch .st{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}
/* the shortcut is a HINT, not furniture: no ⌘K chips at rest, one quiet word on hover and on
   keyboard focus (Sam: "it shouldn't need to say Command K") */
/* it fades 0 → 1 and carries its dimness in the COLOUR, not in a half-opacity: a 12.5 px word at
   opacity .7 on the light tint measured 3.6:1, under the 4.5:1 the rules ask of text (§8) */
.tbsearch .tbhint{flex:none;font:600 13px var(--w-font);letter-spacing:.04em;color:var(--w-dim);opacity:0;transition:opacity .16s ease}
.tbsearch:hover .tbhint,.tbsearch:focus-visible .tbhint{opacity:1}
/* THE indicator: one gradient rim hugging the capsule — teal → cyan → teal, drawn as a masked ring
   so it is a rim and not a fill. It is the ONLY coloured line on this bar and the only thing on the
   console that carries colour at rest. Two stops of alpha (a 1.5 px ring, and a fainter one just
   outside it) make it read SOFT rather than as the crisp hairline Sam asked us to take off the
   field; `filter:blur()` would do the same and costs a second raster over a backdrop-filtered
   surface. It never turns and never pulses — the palette's morph is this surface's one cue (§6).
   NO LIME, IN EITHER SCHEME (2026-09-15): teal → cyan → lime swung 101° of hue across 640 px and
   left the right half of the field 1.9× brighter than the left — measured 7.70:1 against the bar on
   hover, the loudest object on the console where Sam asked for quiet. Teal → cyan → teal is the
   Nerdio pair and holds the spread under 30°. */
.tbsearch::before,.tbsearch::after{content:'';position:absolute;border-radius:inherit;pointer-events:none;
  background:conic-gradient(from 210deg,var(--lg-teal),var(--lg-cyan),var(--lg-teal));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;
  transition:opacity .2s ease}
/* quieter at rest (Sam, 2026-09-15: "make the line around it less prominent"): a 1 px ring at .3
   and the outer ring off; interaction is where it says what it is — hover .6, open .9 with the
   outer ring back as a soft halo. The tint carries the capsule's boundary, the rim carries intent. */
.tbsearch::before{inset:-1px;padding:1px;opacity:.3}
.tbsearch::after{inset:-3px;padding:2px;opacity:0}
.tbsearch:hover::before{opacity:.6}
.tbsearch:hover::after{opacity:.12}
/* while the palette is open the rim holds at full — app.js puts `.act` on the field, because CSS
   cannot see an overlay that is not this element's ancestor */
.tbsearch.act::before{opacity:1}
.tbsearch.act::after{opacity:.26}
/* In light the bar is already near-white, so a WHITE field on it is not a field — it is a hole you
   cannot see (audited 2026-09-14). The field goes the other way: a cool tint one step DARKER than
   the bar. There is no hairline to carry the boundary any more, so the tint and the rim carry it
   between them (measured: the placeholder reads 6.9:1 on the tint, well over the 4.5:1 §8 asks).
   LIME IS DROPPED IN LIGHT: #d9ff7a on a near-white bar is invisible, and a rim with a hole in it
   is worse than no rim — the light rim runs teal → cyan → teal (2026-09-15). */
.glass.light .tbsearch{color:#33505f;background:linear-gradient(160deg,#e6eef3,#dce8ef);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 4px 12px -8px rgba(23,48,62,.5)}
/* the same three-stop construction as dark, on the darker teal set light needs to clear 3:1 against
   a near-white bar: #0f7d95 → #12849d → #0f7d95, hue spread 2° (measured 2026-09-15) */
.glass.light .tbsearch::before,.glass.light .tbsearch::after{
  background:conic-gradient(from 210deg,#0f7d95,#12849d,#0f7d95)}
/* and it is carried LOUDER in light: with no border left, the rim is the capsule's boundary, and a
   .45-alpha teal on a near-white bar measured 1.3–1.6:1 against it — under the 3:1 a boundary owes
   (§8). At .85 over the same bar every stop of the gradient measures ≥ 3.4:1 (2026-09-15). The
   fainter outer ring is what keeps it reading as a rim rather than as the hairline that was here. */
/* …and in light the same step down: the field's tint is a step darker than the bar, so the
   boundary no longer needs a .85 line — .42 at rest reads as a soft edge, .7 on hover, .9 open */
.glass.light .tbsearch::before{opacity:.58}
.glass.light .tbsearch::after{opacity:0}
.glass.light .tbsearch:hover::before{opacity:.82}
.glass.light .tbsearch.act::before{opacity:1}
.glass.light .tbsearch:hover::after{opacity:.16}
.glass.light .tbsearch.act::after{opacity:.34}
.glass.light .tbsearch:hover{color:#0c2836;background:linear-gradient(160deg,#eef4f8,#e4eef4)}
.glass.light .tbsearch:focus-visible{color:#0c2836;outline-color:rgba(15,125,149,.9)}
.glass.light .tbsearch .gicon{color:#0c2836;opacity:.62}
.glass.light .tbsearch:hover .gicon{opacity:.8}
.glass.light .tbsearch .tbhint{color:#33505f}

/* the sun/moon that morphs: the bite slides off and the rays open.
   16 px like every other glyph in a `.icobtn.tb` box — at 15 it was the ONE odd size on the bar,
   sitting between two 16 px neighbours (icon census, 2026-09-15) */
.glass .icobtn.tb .sunmoon{width:16px;height:16px}
.sunmoon{display:block;overflow:visible}
.glass .sunmoon .orb{fill:currentColor;stroke:none;transform-box:fill-box;transform-origin:50% 50%;
  transition:transform .34s var(--lg-snap)}
.glass .sunmoon .bite{fill:#000;stroke:none;transform:translate(5px,-5px);transition:transform .36s var(--lg-snap)}
.glass .sunmoon .rays{stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;transform-box:fill-box;transform-origin:50% 50%;
  opacity:0;transform:scale(.4) rotate(-40deg);transition:opacity .22s ease,transform .36s var(--lg-snap)}
.glass.light .sunmoon .orb{transform:scale(.74)}
.glass.light .sunmoon .bite{transform:translate(13px,-11px)}
.glass.light .sunmoon .rays{opacity:1;transform:none}
/* the scheme flip crossfades the whole page through its destination ground.
   It lives on <body>, outside the .glass scope, so its light variant is a bare class. */
.schemewipe{position:fixed;inset:0;z-index:90;pointer-events:none;opacity:0;background:#0b1a24;transition:opacity .16s ease}
.schemewipe.on{opacity:1}
.schemewipe.light{background:#eef3f6}

/* ═══════════════════════ 4 · pages + page header ═══════════════════════ */
.pages{position:relative;min-width:0}
.page{display:none;min-width:0}
 /* ONE stack at a time, opacity only (2026-09-04, Sam: "it sort of glitches around a little bit").
   The leaving page used to overlay the entering one for 160 ms: two stacks of translucent glass
   crossfading over each other pulse in brightness. And the entrance used to translate the whole
   page 10 px: a transform on the page re-rasterises every backdrop-filter under it and snaps the
   sticky header when it lands. The rooms' own reveal stagger carries the motion now. */
.page.on{display:block;animation:pagein .24s ease-out backwards}
.page.out{display:none}
@keyframes pagein{from{opacity:0}to{opacity:1}}

/* TWO ROWS (Sam, 2026-09-15: "breadcrumbs are above the page title … should they be below the top
   bar … 'Overview' at the top and then 'Observe Overview' below"):
     row 1  `.phtrail` — the trail, alone, with the page's full width. It competes with nothing, so
            it never sheds a level at any width this console is used at.
     row 2  `.phrow` — `.phl` (the title, and under it the small "as of" line) on the left, `.phact`
            (the room's own actions, Day · Week · Month on the four Observe rooms, refresh) right.
   No border anywhere on this block: the stuck state's hairline is the only line here (§11). */
/* The head costs what it is worth and no more: 104 px of a 900 px viewport was 46 px more than the
   one-row bar it replaced, and it pushed Overview's first panel from y 294 to y 340 (A1 #12,
   2026-09-15). The TYPE does not shrink — the padding, the row gap and the title's leading do:
   10 px of padding, 2 px between the trail and the name it labels (they are one block), 1.12 on a
   24 px title. Measured 90.9 px on Overview at 1440. */
.pagehead{position:sticky;top:0;z-index:6;display:flex;flex-direction:column;align-items:stretch;gap:2px;min-width:0;
  padding:10px 14px 10px;margin:0 0 12px;border-radius:14px;
  background:linear-gradient(180deg,rgba(6,28,40,.55),rgba(6,28,40,.16));
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  box-shadow:0 0 0 0 rgba(255,255,255,0);transition:box-shadow .24s ease,background .24s ease}
.pagehead.stuck{background:linear-gradient(180deg,rgba(6,28,40,.94),rgba(6,28,40,.86));
  box-shadow:0 1px 0 0 rgba(255,255,255,.16),0 10px 24px -18px rgba(2,16,26,.9)}
/* the trail row is 22 px tall: 14 px words in a 22 px line, and the crumbs carry their padding
   sideways only — the 3 px above and below every crumb made a 26 px row out of a 20 px line and was
   6 of the 46 px the head had put on (2026-09-15). The current crumb's highlight keeps its box: it
   is the line box now, not a padding box. */
.pagehead .phtrail{min-width:0;overflow:hidden;line-height:22px}
.pagehead .phtrail>*{flex:none}
.pagehead .phtrail .crumb,.pagehead .phtrail .ancestor,.pagehead .phtrail .crhome{padding-top:0;padding-bottom:0}
.pagehead .phrow{display:flex;align-items:center;gap:12px;flex-wrap:wrap;min-width:0}
/* the title row is the page head's second line, on its own since 2026-09-16: the "as of" stamp
   under the name is gone (Sam: "we can remove 'as of the last time' and then center the word …
   down a little bit"), the row keeps a 36 px minimum so the name sits centred on the same axis
   as the refresh button beside it, and it stands 6 px clear of the trail instead of 2 */
.pagehead{gap:6px}
.pagehead .phrow{min-height:36px}
.pagehead .phl{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:2px}
.pagehead .pht{min-width:0;font:600 24px/1.12 var(--font);letter-spacing:-.01em;color:var(--w-ink);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* the room's freshness, one line under its name and one step quieter (Sam: "maybe the date can be
   on the other side … or that can be right under, in small letters") */
.pagehead .phs{display:block;font:500 13px/18px var(--w-font);color:var(--w-soft);letter-spacing:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pagehead .phact{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.glass.light .pagehead{background:linear-gradient(180deg,rgba(238,243,246,.6),rgba(238,243,246,.14))}
.glass.light .pagehead.stuck{background:linear-gradient(180deg,rgba(244,249,251,.97),rgba(244,249,251,.9));
  box-shadow:0 1px 0 0 rgba(4,40,56,.12),0 10px 24px -18px rgba(23,48,62,.6)}
.glass.light .pagehead .pht{color:#0c2836}

/* ═══════════════════════ 5 · capsule expander (the tray's signature) ═══════════════════════ */
.podgrid{position:relative;display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;min-width:0;
  transition:height .42s var(--lg-glide)}
.pod{position:relative;min-width:0;border-radius:16px;overflow:hidden;
  background:linear-gradient(160deg,rgba(255,255,255,.14),rgba(255,255,255,.05));
  border:1px solid rgba(255,255,255,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.3);
  transition:left .42s var(--lg-glide),top .42s var(--lg-glide),width .42s var(--lg-glide),height .42s var(--lg-glide),opacity .22s ease,border-color .22s ease,box-shadow .22s ease}
/* the expanded pod is glass — the row's other capsules would read straight through it */
.podgrid.podopen .pod:not(.flip){opacity:0;pointer-events:none}
.pod.flip{position:absolute;z-index:7;margin:0}
.pod.wide{grid-column:1/-1}          /* the no-FLIP path: reduced motion, and pods outside a .podgrid */
.pod.open{border-color:rgba(107,197,214,.5);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 18px 44px -18px rgba(2,16,26,.8)}
/* the ghost only holds the grid cell — it must not be seen THROUGH the glass above it */
.podghost{display:block;visibility:hidden}
.podface{display:flex;flex-direction:column;gap:3px;width:100%;padding:12px 14px;border:0;background:transparent;
  text-align:left;cursor:pointer;color:var(--w-ink)}
.podface:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:-2px}
.podface .podv{font:700 24px/1.1 var(--font);letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.podface .podk{display:flex;align-items:center;gap:7px}
.podface .podk .gicon{width:13px;height:13px;color:var(--w-dim)}
.podhint{position:absolute;top:11px;right:12px;display:grid;place-items:center;width:17px;height:17px;color:var(--w-dim);
  transition:transform .24s var(--lg-snap),color .16s ease}
.podhint svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.pod:hover .podhint{color:var(--w-ink)}
.pod.open .podhint{transform:rotate(180deg)}
.poddetail{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .38s var(--lg-glide),opacity .2s ease}
.pod.open .poddetail{grid-template-rows:1fr;opacity:1}
.poddetail>div{overflow:hidden;min-height:0}
.pod.open .poddetail>div{padding:0 14px 14px}
.glass.light .pod{background:linear-gradient(160deg,#fff,rgba(255,255,255,.8));border-color:rgba(4,40,56,.16);box-shadow:inset 0 1px 0 #fff,0 3px 10px rgba(23,48,62,.09)}
.glass.light .pod.open{border-color:rgba(30,157,184,.5);box-shadow:inset 0 1px 0 #fff,0 18px 44px -18px rgba(23,48,62,.55)}
.glass.light .podface{color:#0c2836}
.glass.light .podhint{color:#3f5d6c}

/* ═══════════════════════ 6 · hover manners ═══════════════════════ */
.spot{position:relative;isolation:isolate}
.spot::before{content:"";position:absolute;inset:0;z-index:0;border-radius:inherit;pointer-events:none;opacity:0;
  background:radial-gradient(240px 240px at var(--mx,50%) var(--my,50%),rgba(255,255,255,.16),transparent 68%);
  transition:opacity .26s ease}
.spot:hover::before{opacity:1}
.glass.light .spot::before{background:radial-gradient(240px 240px at var(--mx,50%) var(--my,50%),rgba(30,157,184,.14),transparent 68%)}

.cardhover{position:relative;overflow:hidden;
  transition:transform .18s ease,border-color .22s ease,box-shadow .22s ease}
.cardhover::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;border-radius:inherit;
  background:linear-gradient(100deg,rgba(255,255,255,.02),rgba(255,255,255,.09) 45%,rgba(255,255,255,.02));
  transition:opacity .22s ease}
.cardhover:hover::after{opacity:1}
.cardhover:hover{transform:translateY(-1px);border-color:rgba(255,255,255,.36);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 10px 24px -12px rgba(2,16,26,.7)}
.cardhover:active{transform:scale(.985);transition-duration:.08s}
.glass.light .cardhover::after{background:linear-gradient(100deg,rgba(4,40,56,.01),rgba(4,40,56,.05) 45%,rgba(4,40,56,.01))}
.glass.light .cardhover:hover{border-color:rgba(4,40,56,.3);box-shadow:inset 0 1px 0 #fff,0 10px 24px -12px rgba(23,48,62,.45)}

/* ═══════════════════════ 7 · overlays: drawer, command, shortcuts ═══════════════════════ */
.ovl{position:fixed;inset:0;z-index:58;display:none}
.ovl.on{display:block}
.ovl .oscrim{position:absolute;inset:0;background:rgba(2,16,26,.45);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  opacity:0;transition:opacity .26s ease}
.ovl.in .oscrim{opacity:1}
.glass.light .ovl .oscrim{background:rgba(23,48,62,.28)}

.drawer{position:absolute;top:0;right:0;bottom:0;display:flex;flex-direction:column;width:min(440px,94vw);color:var(--w-ink);
  background:linear-gradient(165deg,rgba(9,36,50,.97),rgba(5,26,38,.97));
  border-left:1px solid rgba(255,255,255,.2);box-shadow:-16px 0 44px rgba(2,16,26,.5),inset 1px 0 0 rgba(255,255,255,.2);
  transform:translateX(100%);
  transition:transform .38s var(--lg-spring),width .34s var(--lg-glide)}
.ovl.in .drawer{transform:none}
.ovl.out .drawer{transform:translateX(100%);transition:transform .2s var(--lg-out),width .2s var(--lg-out)}
.ovl.max .drawer{width:min(1080px,96vw)}
.drawer .dwhead{display:flex;align-items:center;gap:10px;flex:none;padding:14px 14px 12px;border-bottom:1px solid rgba(255,255,255,.12)}
.drawer .dwhead .crumbs{flex:1;min-width:0;overflow:hidden}
.drawer .dwbody{flex:1;min-height:0;overflow:auto;padding:14px}
.drawer .dwfoot{display:flex;align-items:center;gap:8px;justify-content:flex-end;flex:none;padding:12px 14px;
  border-top:1px solid rgba(255,255,255,.12);background:rgba(2,16,26,.35)}
.glass.light .drawer{color:#0c2836;background:linear-gradient(165deg,#fff,#f2f7fa);border-left-color:rgba(4,40,56,.16);
  box-shadow:-16px 0 44px rgba(23,48,62,.2)}
.glass.light .drawer .dwhead{border-bottom-color:rgba(4,40,56,.1)}
.glass.light .drawer .dwfoot{border-top-color:rgba(4,40,56,.1);background:rgba(238,244,247,.7)}

/* The card the field morphs into wears the FIELD'S RIM, not a border. Two things went wrong with the
   white hairline that was here (A1 #6, 2026-09-15): the one indicator this console has disappeared
   at the exact moment it matters — the card covers the field pixel for pixel, so `.tbsearch.act`'s
   rim is behind it and measured 1.12–2.54:1 through the scrim — and the 1 px line Sam asked us to
   take off the field came back one frame later as the palette's own. The rim is drawn INSIDE the
   box (the card clips, so an `inset:-1px` ring would be cut) at the field's open alpha. */
.cmdk{position:absolute;left:50%;top:12vh;width:min(600px,94vw);border-radius:18px;overflow:hidden;color:var(--w-ink);
  background:linear-gradient(165deg,rgba(9,36,50,.97),rgba(5,26,38,.96));
  border:0;box-shadow:0 30px 70px rgba(2,16,26,.6),inset 0 1px 0 rgba(255,255,255,.3);
  opacity:0;transform:translate(-50%,-8px) scale(.98);
  transition:opacity .2s ease,transform .3s var(--lg-spring)}
.cmdk::before,.cmdk::after{content:'';position:absolute;inset:0;z-index:3;border-radius:inherit;pointer-events:none;
  background:conic-gradient(from 210deg,var(--lg-teal),var(--lg-cyan),var(--lg-teal));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude}
.cmdk::before{padding:1px;opacity:.9}
.cmdk::after{inset:1px;padding:1px;opacity:.2}
.ovl.in .cmdk{opacity:1;transform:translate(-50%,0) scale(1)}
.ovl.out .cmdk{opacity:0;transform:translate(-50%,-8px) scale(.98);transition:opacity .15s ease,transform .18s var(--lg-out)}
.cmdk .ckin{display:flex;align-items:center;gap:10px;padding:13px 15px;border-bottom:1px solid rgba(255,255,255,.12)}
.cmdk .ckin .gicon{color:var(--w-dim)}
/* The palette is on the SAME type scale as the rooms behind it (A1 #1, 2026-09-15: it painted 52
   elements under 12.5 px — the floor this wave set — and its rows at 13.5). Rows 14, meta and group
   heads and the footer 12.5, the input 15. Nothing in this component is under the floor. */
.cmdk .ckin input{flex:1;min-width:0;background:transparent;border:0;outline:none;color:var(--w-ink);font:500 16px var(--w-font)}
.cmdk .ckin input::placeholder{color:var(--w-dim)}
.cmdk .cklist{position:relative;max-height:min(48vh,400px);overflow:auto;padding:6px}
/* ONE highlight that slides between rows (nav.js `seat`): the tray's segmented thumb, stood on
   end. Rows sit above it and carry no fill of their own; `.jump` re-seats it without motion when
   the list is rebuilt. Never a second cue beside the morph — it moves only when the choice does. */
.cmdk .ckthumb{position:absolute;left:0;top:0;width:0;height:0;border-radius:11px;pointer-events:none;z-index:0;
  background:linear-gradient(160deg,rgba(30,157,184,.3),rgba(30,157,184,.18));box-shadow:inset 0 1px 0 rgba(255,255,255,.12);
  transition:transform .16s var(--lg-snap),width .16s var(--lg-snap),height .16s var(--lg-snap)}
.cmdk .ckthumb.jump{transition:none}
.cmdk .ckthumb[hidden]{display:none}
.cmdk .ckg{font:700 13px var(--w-font);letter-spacing:.14em;text-transform:uppercase;color:var(--w-dim);padding:9px 10px 4px}
.cmdk .cki{position:relative;z-index:1;display:flex;align-items:center;gap:11px;height:42px;padding:0 9px;border-radius:11px;cursor:pointer;
  color:var(--w-ink);font:500 15px var(--w-font)}
/* the glyph sits in a soft 28 px tile, so a row reads as icon · word · meta and not as a bare line */
.cmdk .cki .gicon{width:28px;height:28px;padding:6px;box-sizing:border-box;border-radius:8px;flex:none;color:var(--w-dim);
  background:rgba(255,255,255,.07);transition:color .16s ease,background .16s ease}
.cmdk .cki.hl .gicon{color:var(--w-ink);background:rgba(255,255,255,.12)}
.cmdk .cki .ckt{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cmdk .cki .ckm{font:500 13px var(--w-font);color:var(--w-dim);flex:0 1 auto;max-width:42%;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cmdk .cki .ckk{display:flex;gap:4px;flex:none}
.cmdk .cki.hl{background:transparent}
.cmdk .cki mark{background:transparent;color:#d9ff7a;font-weight:700}
.cmdk .ckempty{padding:24px;text-align:center;font:500 15px var(--w-font);color:var(--w-soft)}
.glass.light .cmdk{color:#0c2836;background:linear-gradient(165deg,#fff,#f2f7fa);border:0;
  box-shadow:0 30px 70px rgba(23,48,62,.28),inset 0 1px 0 #fff}
.glass.light .cmdk::before,.glass.light .cmdk::after{background:conic-gradient(from 210deg,#0f7d95,#12849d,#0f7d95)}
.glass.light .cmdk::after{opacity:.24}
.glass.light .cmdk .ckin{border-bottom-color:rgba(4,40,56,.1)}
.glass.light .cmdk .ckin input{color:#0c2836}
.glass.light .cmdk .cki{color:#0c2836}
.glass.light .cmdk .cki.hl{background:transparent}
.glass.light .cmdk .ckthumb{background:linear-gradient(160deg,rgba(30,157,184,.3),rgba(30,157,184,.18));box-shadow:inset 0 1px 0 #fff}
.glass.light .cmdk .cki .gicon{background:rgba(4,40,56,.06);color:#3f5d6c}
.glass.light .cmdk .cki.hl .gicon{background:rgba(4,40,56,.1);color:#0c2836}
.glass.light .cmdk .cki mark{color:#5c8f0e}
.glass.light .cmdk .ckg,.glass.light .cmdk .cki .ckm{color:#3f5d6c}

.keysheet{position:absolute;left:50%;top:50%;width:min(560px,94vw);max-height:78vh;overflow:auto;padding:18px 20px 20px;
  border-radius:20px;color:var(--w-ink);
  background:linear-gradient(165deg,rgba(9,36,50,.97),rgba(5,26,38,.96));
  border:1px solid rgba(255,255,255,.22);box-shadow:0 24px 60px rgba(2,16,26,.55),inset 0 1px 0 rgba(255,255,255,.3);
  opacity:0;transform:translate(-50%,-46%) scale(.96);
  transition:opacity .2s ease,transform .34s var(--lg-spring)}
.ovl.in .keysheet{opacity:1;transform:translate(-50%,-50%) scale(1)}
.ovl.out .keysheet{opacity:0;transform:translate(-50%,-46%) scale(.96);transition:opacity .15s ease,transform .18s var(--lg-out)}
.keysheet .kst{font:600 18px var(--font);margin-bottom:2px}
.keysheet .ksg{font:700 13px var(--w-font);letter-spacing:.14em;text-transform:uppercase;color:var(--w-dim);margin:16px 0 6px}
.keysheet .ksr{display:flex;align-items:center;gap:10px;padding:6px 0;font:500 15px var(--w-font);border-bottom:1px solid rgba(255,255,255,.07)}
.keysheet .ksr:last-child{border-bottom:0}
.keysheet .ksr .ksk{margin-left:auto;display:flex;gap:4px;flex:none}
.glass.light .keysheet{color:#0c2836;background:linear-gradient(165deg,#fff,#f2f7fa);border-color:rgba(4,40,56,.18);
  box-shadow:0 24px 60px rgba(23,48,62,.24),inset 0 1px 0 #fff}
.glass.light .keysheet .ksg{color:#3f5d6c}
.glass.light .keysheet .ksr{border-bottom-color:rgba(4,40,56,.08)}

/* ═══════════════════════ 8 · toast stack v2 (fans, drags, acts) ═══════════════════════ */
.tstack{position:fixed;right:18px;bottom:18px;z-index:62;width:min(348px,calc(100vw - 36px));height:0;pointer-events:none}
.tst{position:absolute;right:0;bottom:0;display:flex;gap:10px;align-items:flex-start;width:100%;padding:11px 12px 12px;
  border-radius:14px;pointer-events:auto;cursor:grab;touch-action:pan-y;color:var(--w-ink);
  background:linear-gradient(160deg,rgba(9,36,50,.94),rgba(6,28,40,.92));
  -webkit-backdrop-filter:blur(18px) saturate(1.6);backdrop-filter:blur(18px) saturate(1.6);
  border:1px solid rgba(255,255,255,.22);box-shadow:0 10px 30px rgba(2,16,26,.45),inset 0 1px 0 rgba(255,255,255,.3);
  opacity:0;transform:translateY(14px) scale(.96);transform-origin:50% 0;
  transition:opacity .22s ease,transform .38s var(--lg-spring)}
/* --f is measured per toast so exactly 14px of each older card shows above the newest one;
   a fixed offset hid them all the moment the front toast was the tallest */
.tst.in{opacity:1;transform:translateY(var(--f,0px)) scale(calc(1 - var(--i,0) * .04))}
.tst.out{opacity:0;transform:translate(var(--dx,26px),0) scale(.97);transition:opacity .18s ease,transform .2s var(--lg-out)}
.tst.deep{opacity:0}
.tstack.spread .tst.in{transform:translateY(var(--y,0px)) scale(1)}
.tstack.spread .tst.deep{opacity:1}
.tst.drag{transition:none;cursor:grabbing}
.tst .nd{width:8px;height:8px;border-radius:50%;flex:none;margin-top:5px;background:#6bc5d6;box-shadow:0 0 8px rgba(107,197,214,.7)}
.tst.ok .nd{background:var(--w-green);box-shadow:0 0 8px rgba(95,227,161,.7)}
.tst.warn .nd{background:var(--w-amber);box-shadow:0 0 8px rgba(242,193,78,.7)}
.tst.err .nd{background:#ff7a8a;box-shadow:0 0 8px rgba(255,122,138,.7)}
.tst .tsm{flex:1;min-width:0}
.tst .tt{font:600 15px var(--w-font)}
.tst .ts{font:400 13px var(--w-font);color:var(--w-soft);margin-top:1px}
.tst .ta{margin-top:8px}
.tst .ta .gbtn2{height:29px;padding:0 11px;font-size:13px}
.tst .tx{flex:none;width:24px;height:24px;border-radius:99px;border:0;display:grid;place-items:center;cursor:pointer;
  color:var(--w-dim);background:rgba(255,255,255,.08);transition:background .18s ease,color .18s ease}
.tst .tx:hover{background:rgba(255,255,255,.2);color:var(--w-ink)}
.tst .tx svg{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round}
.glass.light .tst{color:#0c2836;background:linear-gradient(160deg,rgba(255,255,255,.97),rgba(244,248,251,.95));
  border-color:rgba(4,40,56,.18);box-shadow:0 10px 30px rgba(23,48,62,.2),inset 0 1px 0 #fff}
.glass.light .tst .tx{background:rgba(4,40,56,.07);color:#3f5d6c}

/* ═══════════════════════ 9 · bell panel · user menu · side tabs ═══════════════════════ */
.bellpanel{position:fixed;z-index:47;width:min(330px,92vw);padding:6px;border-radius:15px;
  background:linear-gradient(160deg,rgba(9,36,50,.97),rgba(6,28,40,.96));
  -webkit-backdrop-filter:blur(16px) saturate(1.6);backdrop-filter:blur(16px) saturate(1.6);
  border:1px solid rgba(255,255,255,.22);box-shadow:0 14px 34px rgba(2,16,26,.5),inset 0 1px 0 rgba(255,255,255,.3);
  opacity:0;transform:translateY(-6px) scale(.98);transform-origin:top right;pointer-events:none;
  transition:opacity .14s ease,transform .22s var(--lg-snap)}
.bellpanel.on{opacity:1;transform:none;pointer-events:auto}
.bellpanel .bph{display:flex;align-items:center;gap:8px;padding:8px 10px 8px}
.bellpanel .bph b{font:600 15px var(--w-font);color:var(--w-ink)}
.bellpanel .bph .gbtn2{margin-left:auto;height:27px;padding:0 10px;font-size:13px}
.bellpanel .bplist{max-height:280px;overflow:auto;padding:2px}
.bnrow{display:flex;align-items:flex-start;gap:9px;padding:9px 10px;border-radius:11px;cursor:pointer;
  transition:background .16s ease,opacity .3s ease}
.bnrow:hover{background:rgba(255,255,255,.07)}
.bnrow.read{opacity:.42}
.bnrow .bnd{width:7px;height:7px;border-radius:50%;flex:none;margin-top:5px;background:#6bc5d6;box-shadow:0 0 7px rgba(107,197,214,.7)}
.bnrow.ok .bnd{background:var(--w-green);box-shadow:0 0 7px rgba(95,227,161,.7)}
.bnrow.warn .bnd{background:var(--w-amber);box-shadow:0 0 7px rgba(242,193,78,.7)}
.bnrow.err .bnd{background:#ff7a8a;box-shadow:0 0 7px rgba(255,122,138,.7)}
.bnrow .bnb{flex:1;min-width:0}
.bnrow .bnt{font:600 15px var(--w-font);color:var(--w-ink)}
.bnrow .bns{font:400 13px var(--w-font);color:var(--w-soft);margin-top:1px}
.bnrow .bnw{flex:none;font:500 13px var(--w-font);color:var(--w-dim);font-variant-numeric:tabular-nums}
.glass.light .bellpanel{background:linear-gradient(160deg,#fff,#f4f8fb);border-color:rgba(4,40,56,.18);
  box-shadow:0 14px 34px rgba(23,48,62,.2),inset 0 1px 0 #fff}
.glass.light .bellpanel .bph b,.glass.light .bnrow .bnt{color:#0c2836}
.glass.light .bnrow:hover{background:rgba(4,40,56,.05)}
.glass.light .bnrow .bnw{color:#3f5d6c}

.usermenu{min-width:216px}
.tbright .usermenu{top:calc(100% + 12px)}
.usermenu [data-profile]{font-weight:600;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08)}
.usermenu .uhead{display:flex;align-items:center;gap:10px;min-height:54px;padding:8px 9px 9px;margin-bottom:4px;border-radius:9px 9px 6px 6px;
  color:var(--w-ink);background:linear-gradient(150deg,rgba(255,255,255,.09),rgba(255,255,255,.025));border-bottom:1px solid rgba(255,255,255,.12)}
.usermenu .uhead .un{flex:1;min-width:0;overflow:hidden}
.usermenu .uhead .un b{display:block;font:600 15px var(--w-font);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.usermenu .uhead .un span{display:block;font:500 13px var(--w-font);color:var(--w-dim)}
.rolechip{display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:99px;flex:none;
  font:700 13px var(--w-font);letter-spacing:.1em;text-transform:uppercase;color:#c9ecf4;
  background:rgba(30,157,184,.24);border:1px solid rgba(107,197,214,.4)}
.glass.light .usermenu .uhead{color:#0c2836;background:linear-gradient(150deg,rgba(255,255,255,.8),rgba(238,244,247,.7));border-bottom-color:rgba(4,40,56,.1)}
.glass.light .usermenu .uhead .un span{color:#3f5d6c}
.glass.light .usermenu [data-profile]{background:rgba(4,40,56,.035);border-color:rgba(4,40,56,.08)}
.glass.light .rolechip{color:#11758c;background:rgba(30,157,184,.14);border-color:rgba(30,157,184,.4)}

.vtabs{position:relative;display:flex;flex-direction:column;gap:2px;min-width:188px;padding:5px;border-radius:14px;
  background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22)}
.vtabs [role=tab]{position:relative;z-index:1;display:flex;align-items:center;gap:9px;height:35px;padding:0 11px;
  border:0;border-radius:10px;background:transparent;cursor:pointer;text-align:left;white-space:nowrap;
  font:600 15px var(--w-font);color:var(--w-dim);transition:color .14s ease,transform .1s ease}
.vtabs [role=tab]:hover{color:var(--w-ink)}
.vtabs [role=tab][aria-selected=true]{color:var(--w-ink)}
.vtabs [role=tab]:active{transform:scale(.985);transition-duration:.08s}
.vtabs [role=tab]:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:-2px}
/* the same teal indicator as the nav pill — it is a navigation indicator, and white-on-white
   in the light scheme was all but invisible */
.vtabs .vline{position:absolute;left:5px;right:5px;top:5px;height:35px;border-radius:10px;z-index:0;opacity:0;
  background:linear-gradient(160deg,rgba(30,157,184,.5),rgba(30,157,184,.22));border:1px solid rgba(107,197,214,.5);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 3px 10px -4px rgba(2,16,26,.5);
  transition:top .24s var(--lg-snap),opacity .16s ease}
.vtabs .vline.on{opacity:1}
.glass.light .vtabs{background:linear-gradient(160deg,#fff,rgba(255,255,255,.7));border-color:rgba(4,40,56,.14);box-shadow:inset 0 1px 0 #fff}
.glass.light .vtabs [role=tab]{color:#3f5d6c}
.glass.light .vtabs [role=tab]:hover,.glass.light .vtabs [role=tab][aria-selected=true]{color:#0c2836}
.glass.light .vtabs .vline{background:linear-gradient(160deg,rgba(30,157,184,.3),rgba(30,157,184,.13));
  border-color:rgba(30,157,184,.45);box-shadow:inset 0 1px 0 #fff,0 2px 6px rgba(23,48,62,.08)}

/* the context menu borrows the console menu's skin and anchors at the pointer */
.menu.ctx{position:fixed;top:auto;left:auto;z-index:64;min-width:190px}

/* ═══════════════════════ 10 · route progress · skeleton page · reveal · separators ═══════════════════════ */
.topprog{position:absolute;left:0;top:0;right:0;height:2px;z-index:9;border-radius:0 2px 2px 0;pointer-events:none;
  background:linear-gradient(90deg,#1E9DB8,#2ec8e8 55%,#d9ff7a);transform:scaleX(0);transform-origin:left;opacity:0;
  transition:transform .3s ease,opacity .3s ease}
.topprog.run{opacity:1}
.topprog.done{transform:scaleX(1);opacity:0;transition:transform .2s ease,opacity .34s ease .12s}

.skelpage{display:flex;flex-direction:column;gap:14px;min-width:0}
.skelpage .skrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}
.skelpage .skcard{border-radius:16px;padding:14px;display:flex;flex-direction:column;gap:9px;
  background:linear-gradient(160deg,rgba(255,255,255,.08),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.14)}
.skelpage .skchart{height:180px;border-radius:16px}
.skelpage .sktable{display:flex;flex-direction:column;gap:8px;padding:14px;border-radius:16px;
  background:linear-gradient(160deg,rgba(255,255,255,.08),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.14)}
.glass.light .skelpage .skcard,.glass.light .skelpage .sktable{background:linear-gradient(160deg,#fff,rgba(255,255,255,.75));border-color:rgba(4,40,56,.12)}

/* the hide is applied BY Glass.reveal, never by the stylesheet — a .rv that the observer
   never reaches must still be readable (headless virtual time skipped one, and it vanished) */
.rv.rvpre{opacity:0}
.rv.rvin{opacity:1;animation:cellin .42s var(--lg-spring) backwards}

.sepl{display:flex;align-items:center;gap:10px;margin:16px 0 12px;
  font:700 13px var(--w-font);letter-spacing:.14em;text-transform:uppercase;color:var(--w-dim)}
.sepl::before,.sepl::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent)}
.sepl.start::before{display:none}
.glass.light .sepl{color:#3f5d6c}
.glass.light .sepl::before,.glass.light .sepl::after{background:linear-gradient(90deg,transparent,rgba(4,40,56,.22),transparent)}
.kbd.khint{height:19px;padding:0 5px;font-size:13px;margin-left:2px}

/* ═══════════════════════ reduced motion ═══════════════════════ */
@media (prefers-reduced-motion:reduce){
  .shell,.sidebar,.sbbrand .brandword,.sbpill,.sbsub,.sbchev,.sbcap,.sbitem .lab,.sbitem .cnt,.sbuser .un,.flyout,.shellscrim,
  .sunmoon .bite,.sunmoon .rays,.schemewipe,.pagehead,.podgrid,.pod,.poddetail,.podhint,.spot::before,
  .cardhover,.cardhover::after,.ovl .oscrim,.drawer,.ovl.out .drawer,.cmdk,.ovl.out .cmdk,.keysheet,.ovl.out .keysheet,
  .tst,.tst.out,.bellpanel,.bnrow,.vtabs .vline,.topprog,.tbsearch,
  .tbsearch::before,.tbsearch::after,.tbsearch .gicon,.tbsearch .tbhint,.crumbs .crumb,.crumbs .ancestor{transition:none}
  .page.on,.page.out,.rv.rvin{animation:none}
  .rv.rvpre{opacity:1}
  .spot::before{display:none}
}

/* ==== app.css ==== */
/* V2 admin console wireframe — page-level layout only.
   Components come from the kit (glass.css → console.css → parts/*.css); this file lays rooms out:
   panels on the aurora, grids, the stat rows, the capsule faces, drawer bodies. Nothing here
   restyles a kit component except through its own documented classes. */

html,body{margin:0;height:100%;background:#0b1a24}
body.light{background:#eef3f6}
.glass{--dpad:14px}

/* ——— the room: a glass panel on the aurora (the tray's island, grown into a page) ——— */
.glass .panel{position:relative;min-width:0;padding:13px var(--dpad) 14px;border-radius:16px;
  background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.15);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22)}
.glass.light .panel{background:linear-gradient(160deg,#fff,rgba(255,255,255,.76));border-color:rgba(4,40,56,.14);box-shadow:inset 0 1px 0 #fff}
.glass .panel .ph{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0;margin-bottom:10px}
.glass .panel .ph .pt{font:600 15px var(--w-font);color:var(--w-ink);white-space:nowrap}
/* the right slot SHRINKS before the row overflows: a 236 px people picker landing beside a three-way
   toggle used to push the panel past its column, and the scroller then slid the whole page 10 px left
   to show the focused control — "the whole top shifts when I click user" (Sam, 2026-09-16) */
.glass .panel .ph .pr{margin-left:auto;display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0;flex:0 1 auto}
.glass .panel .ph .pr .combo{flex:1 1 150px;min-width:0;max-width:236px}
/* `clip`, not `hidden`: a hidden overflow still scrolls when focus lands in a control past the edge —
   which is exactly how the page slid; clip cannot scroll at all */
.glass .shellbody{overflow-x:clip}
/* a picker's dropdown is wider than its trigger; opened at the right edge of a panel head it used to
   hang past the column and pull the scroller with it — it opens leftwards there */
.glass .scopepick .combo .menu,.glass .dwhead2 .combo .menu{left:auto;right:0}
.glass .drawer .dwbody{overflow-x:clip}
.glass .panel .ph .stamp{font:500 13px var(--w-font);color:var(--w-dim);font-variant-numeric:tabular-nums;white-space:nowrap}
.glass .panel.tight{padding-top:10px}

/* ——— grids ——— */
/* 16 px between a room's blocks — at 12 the stat tiles and the panel under them read as touching
   (Sam, 2026-09-16: "the instructions bubble and the one on the top and the one below are kind of
   touching") — and the grids inside a room keep the same 16 so every gap on a page is one gap */
.glass .room{display:flex;flex-direction:column;gap:16px;min-width:0}
.glass .g2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;min-width:0}
.glass .g2.wide{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}
.glass .g3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;min-width:0}
.glass .gside{display:grid;grid-template-columns:200px minmax(0,1fr);gap:14px;align-items:start;min-width:0}
.glass .gside.noside{grid-template-columns:minmax(0,1fr)}.glass .gside.noside>.vtabs{display:none}
@media (max-width:980px){.glass .g2,.glass .g2.wide,.glass .g3{grid-template-columns:minmax(0,1fr)}}
@media (max-width:720px){.glass .gside{grid-template-columns:minmax(0,1fr)}.glass .gside .vtabs{flex-direction:row;flex-wrap:wrap;min-width:0}.glass .gside .vtabs .vline{display:none}}

/* Preserve the current destination on a narrow trail. The trail is the PAGE HEAD's first row now
   (Sam, 2026-09-15), with the page's full width to itself, so these two rules follow it there: what
   gives way when even that is not enough is the MIDDLE — the levels between ⌂ and the page you are
   on collapse into one "…" crumb named for what it hides. It walks to the deepest of them when that
   level is a page and is plain text when every level it hides is a section (app.js `shedModel`). */
.glass .pagehead .crmore{padding:3px 6px;letter-spacing:.08em;line-height:1}
/* the leaf is the one crumb allowed to shrink — with everything shed and the trail still too wide
   the nav's own `overflow:hidden` cut "Content checks" to "Content c" with no ellipsis and no way
   to tell it was cut. It ellipsises inside its own box instead, and app.js gives it the full name
   as a tooltip when it does (RULES §7). */
.glass .pagehead .phtrail .cur{flex:0 1 auto;min-width:4ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* app.js `fitField` is the authority on the field's width and writes it inline on every fit; these
   two are the paint BEFORE its first fit and carry exactly the same numbers, so a narrow window
   never opens on a 640 px field hanging off the end of its bar. Change them together or not at all. */
@media (max-width:1340px){.glass .tbsearch{width:520px}}
@media (max-width:1000px){.glass .tbsearch{width:max(300px,44vw)}}
/* ≤520 the command surface is its icon alone — the trigger survives, the words go */
@media (max-width:520px){
  .glass .tbsearch{width:36px;padding:0;justify-content:center}
  .glass .tbsearch .st,.glass .tbsearch .tbhint{display:none}
  .glass .tbsearch .gicon{opacity:.78}
  .glass .topbar{gap:6px;padding-inline:8px}.glass .tbright{gap:5px}
}

/* ——— a settled page: its entrances have played; a revisit is the page crossfade only ———
   (display:none → block replays every CSS entrance on the page — the reveal stagger, the
   table rows, the chart shapes — over the crossfade: the "whole screen glitches") */
.glass .page.settled .rv.rvin,.glass .page.settled .dtable tbody tr.drow,.glass .page.settled .kpicard,
.glass .page.settled .hbf,.glass .page.settled .blf,.glass .page.settled .cmf,.glass .page.settled .spb,.glass .page.settled .chc,.glass .page.settled .hb,
.glass .page.settled .sseg,.glass .page.settled .cline,.glass .page.settled .carea,.glass .page.settled .sband,.glass .page.settled .sline,.glass .page.settled .sdot,
.glass .page.settled .smc,.glass .page.settled .sms path,.glass .page.settled .tmc,.glass .page.settled .evm,.glass .page.settled .rpoly,.glass .page.settled .rdot,
.glass .page.settled .dring svg,.glass .page.settled circle.seg,.glass .page.settled circle.val,.glass .page.settled .cprog .ptrack i,.glass .page.settled .cspark path,
.glass .page.settled .dlegend,.glass .page.settled .dside,.glass .page.settled .killdone,.glass .page.settled .chip,.glass .page.settled .tabpanels [role=tabpanel].on,
.glass .page.settled .gtable tbody tr,.glass .page.settled .tl,.glass .page.settled .statlist .slr,.glass .page.settled .logs2 .l2r,.glass .page.settled .traces .trr,.glass .page.settled .ranklist .rr,.glass .page.settled .feed .fr,.glass .page.settled .empty2,.glass .page.settled .kvrow{animation:none}
.glass .page.settled .rv.rvpre{opacity:1}

/* ——— stat cells (the verdict line): Label + Value, nothing else ——— */
.glass .statrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(162px,1fr));gap:12px;min-width:0}
.glass .statrow.four{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:820px){.glass .statrow.four{grid-template-columns:repeat(2,minmax(0,1fr))}}
.glass .stat{display:flex;flex-direction:column;gap:4px;min-width:0}
.glass .stat .val{display:block;font:700 24px/1.1 var(--font);letter-spacing:-.01em;color:var(--w-ink);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.glass .stat.big .val{font-size:30px}
.glass .stat .val.landed,.glass .ciq.landed{animation:none}
.glass .stat .sub{display:flex;align-items:center;gap:6px;min-height:20px;flex-wrap:wrap}
.glass .stat .sub .code{max-width:100%}
.glass.light .stat .val{color:#0c2836}
.glass .headstrip{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1.3fr) repeat(4,minmax(0,1fr));gap:10px;min-width:0}
@media (max-width:1100px){.glass .headstrip{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){.glass .headstrip{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ——— Shadcn-style KPI selectors: quiet cards, one useful chart below ——— */
.glass .kpigrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;min-width:0}
.glass .kpicard{position:relative;display:flex;flex-direction:column;gap:9px;min-width:0;min-height:140px;padding:14px 15px;border-radius:16px;text-align:left;cursor:pointer;color:var(--w-ink);
  background:linear-gradient(160deg,rgba(255,255,255,.1),rgba(255,255,255,.035));border:1px solid rgba(255,255,255,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.22);
  transition:transform .14s ease,border-color .18s ease,background .18s ease,box-shadow .2s ease}
.glass .kpicard::before{content:"";position:absolute;left:14px;right:14px;top:-1px;height:2px;border-radius:0 0 2px 2px;background:var(--ch0);opacity:0;transform:scaleX(.45);transition:opacity .16s ease,transform .2s var(--lg-snap)}
.glass .kpicard:hover{transform:translateY(-1px);border-color:rgba(255,255,255,.3)}
.glass .kpicard:active{transform:scale(.985);transition-duration:.08s}
.glass .kpicard:focus-visible{outline:2px solid rgba(107,197,214,.78);outline-offset:2px}
.glass .kpicard.on{border-color:rgba(107,197,214,.5);background:linear-gradient(160deg,rgba(30,157,184,.14),rgba(255,255,255,.04));box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 8px 22px -18px rgba(46,200,232,.7)}
.glass .kpicard.on::before{opacity:1;transform:scaleX(1)}
.glass .kpihead{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0}
.glass .kpihead .lbl{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.glass .kpimeta{display:flex;justify-content:flex-end;min-height:20px;flex:none}
.glass .kpiv{display:block;font:700 30px/1.05 var(--font);letter-spacing:-.015em;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.glass .kpicontext{margin-top:auto;font:500 13px var(--w-font);color:var(--w-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.glass.light .kpicard{color:#0c2836;background:linear-gradient(160deg,#fff,rgba(255,255,255,.78));border-color:rgba(4,40,56,.13);box-shadow:inset 0 1px 0 #fff,0 3px 12px rgba(23,48,62,.06)}
.glass.light .kpicard:hover{border-color:rgba(4,40,56,.25)}
.glass.light .kpicard.on{border-color:rgba(15,125,149,.42);background:linear-gradient(160deg,rgba(15,125,149,.08),#fff)}
.glass #ovTrendChart.metricswap{animation:metricswap .18s ease-out backwards}
@keyframes metricswap{from{opacity:.35;transform:translateY(2px)}to{opacity:1;transform:none}}
@media (max-width:1100px){.glass .kpigrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.glass .kpigrid{grid-template-columns:minmax(0,1fr)}.glass .kpicard{min-height:116px}}

/* ——— tabs as a main-line element ——— */
.glass .tabs.lg [role=tab]{padding:9px 17px;font-size:15px}
.glass .tabs.lg [role=tab] .cnt{margin-left:7px;font:700 13px var(--w-font);color:var(--w-dim);font-variant-numeric:tabular-nums}
/* a tab with no count still carried the count span's 7 px of margin, so its label sat 3.5 px
   left of centre while the tabs beside it (which do carry a count) were centred. */
.glass .tabs.lg [role=tab] .cnt:empty,.glass .sessiontabs .cnt:empty{margin-left:0}
.glass .tabhead{display:flex;align-items:center;gap:12px;flex-wrap:wrap;min-width:0}
.glass .tabhead .tr{margin-left:auto;display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0;justify-content:flex-end}
/* Activity's one strip control — the `By module` label and the kit toggle beside it. The wrapper
   was a bare <span>: as a flex item of `.tr` it blockified, but the `.tgl` inside it did not, and
   glass.css gives the toggle a 34 px width with no `display` (it is written for a <button>). An
   inline toggle ignores width, so it drew 2 px of itself hanging past the strip's right edge and
   the shell clipped the rest (measured 1440 and 1100, 2026-09-14). A flex row gives the toggle its
   box back; the pair then ends on the panel's own right edge and wraps with `.tr` when it cannot. */
.glass .tabhead .tr #acByMod{display:inline-flex;align-items:center;gap:8px;flex:none;min-width:0}
.glass .tabhead .tr #acByMod .tgl{flex:none}

/* ——— the code chip (rule strings, shas, addresses) — the one mono surface ——— */
.glass .code{display:inline-block;box-sizing:border-box;max-width:100%;min-width:0;height:22px;padding:0 7px;border-radius:7px;
  font:600 13px/20px ui-monospace,Menlo,Consolas,monospace;letter-spacing:0;color:var(--w-ink);
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:middle}
  /* inline-block, not inline-flex: text-overflow only ellipsises a block container's own text — a flex container clips hard */
.glass .code.blk{display:block;height:auto;padding:8px 10px;white-space:pre-wrap;word-break:break-all;line-height:1.5}
.glass.light .code{color:#0c2836;background:rgba(4,40,56,.06);border-color:rgba(4,40,56,.14)}
.glass .abs{color:var(--w-dim);font-variant-numeric:tabular-nums}

/* ——— rule 11 (pill budget): what replaced the capsules ———
   A model is its colour dot + its name (rule 3). A category, a scope word, a count, an
   overflow "+N" and a KPI delta are plain text in the row's secondary style. Nothing here
   draws a border or a fill — that is the whole point. */
.glass .mdl{display:inline-flex;align-items:center;gap:6px;min-width:0;max-width:100%;white-space:nowrap;
  font:500 15px var(--w-font);color:var(--w-ink)}
.glass .mdl i{width:6px;height:6px;border-radius:50%;flex:none}
.glass .mdl span{min-width:0;overflow:hidden;text-overflow:ellipsis}
.glass.light .mdl{color:#0c2836}
.glass .sw{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font:500 15px var(--w-font);color:var(--w-dim);font-variant-numeric:tabular-nums}
.glass .kdt,.glass .effv{font:600 13px var(--w-font);color:var(--w-dim);font-variant-numeric:tabular-nums;white-space:nowrap}
.glass .ctags{gap:9px}
.glass .cellrow{display:flex;align-items:center;gap:6px;min-width:0}
.glass .cellrow>*{min-width:0}
.glass .cellrow .status{flex:none}

/* ——— ONE selected treatment (2026-09-14) ———
   The kit ships two thumbs: `.seg`'s filled teal one and `.tglgroup`'s raised white-glass one.
   Settings › Harness put both on the SAME ROW — Org · Group · User raised and white beside
   Basic · Advanced filled and teal — so the console was telling an administrator that two
   identical controls were different kinds of thing. The teal thumb wins: it is what every other
   segmented in the console already draws, and the selected word on it is white in both schemes.
   `[data-multi]` keeps its lime fill — that is a different STATE (many chosen), not a style. */
.glass .tglgroup:not([data-multi]) .tgthumb{border-color:transparent;
  background:linear-gradient(160deg,rgba(30,157,184,.72),rgba(30,157,184,.4));
  box-shadow:0 2px 8px rgba(30,157,184,.35)}
.glass .tglgroup:not([data-multi]) .tgi.on{color:#fff}
.glass.light .tglgroup:not([data-multi]) .tgthumb{border-color:transparent;
  background:linear-gradient(160deg,#1E9DB8,#137a94);box-shadow:0 2px 8px rgba(30,157,184,.3)}
.glass.light .tglgroup:not([data-multi]) .tgi.on{color:#fff}
/* every second line on a filled selection reads in the selection's own ink, both schemes: a `small`, a
   cadence, a sub-word — never a scheme grey that vanishes on the teal thumb (Sam, 2026-09-16) */
.glass .tglgroup:not([data-multi]) .tgi.on small,.glass .tglgroup:not([data-multi]) .tgi.on .sw,.glass .seg span.on small{color:inherit;opacity:.82}

/* ——— the mini state segmented (Watch · On · Off) that lives in a table cell ——— */
.glass .seg.mini span{padding:3px 8px;font-size:13px}
.glass .seg.mini{padding:2px}
.glass .seg.mini .segthumb{top:2px;bottom:2px}
.glass .dtable td .seg{vertical-align:middle}
/* the belt to `segThumb`'s braces (app.js): the kit's sliding thumb is sized from the selected
   span's offsetWidth at wire time, so a segment wired inside a table redraw — or drawn into a
   page that is not on screen yet — can be left `width:0`, and `.seg span.on{color:#fff}` then
   puts a white word on the bare track. Unreadable in light, invisible in dark. When the
   measurement really is zero the selected word paints the thumb's own gradient itself; when the
   thumb IS sized the class is off and nothing here applies. */
.glass .seg.nothumb span.on{background:linear-gradient(160deg,rgba(30,157,184,.72),rgba(30,157,184,.4));box-shadow:0 2px 8px rgba(30,157,184,.35)}
.glass.light .seg.nothumb span.on{background:linear-gradient(160deg,#1E9DB8,#137a94);box-shadow:0 2px 8px rgba(30,157,184,.3)}
/* a second-axis line's legend entry — the kit builds `.cleg` from `series` only (app.js legendLine) */
.glass .cleg .clegline{display:inline-flex;align-items:center;gap:7px;height:25px;font:600 13px var(--w-font);color:var(--w-soft);font-variant-numeric:tabular-nums}
.glass .cleg .clegline i{width:10px;height:10px;border-radius:50%;flex:none}
.glass.light .cleg .clegline{color:#33505f}

/* ——— door strip (Health) ——— */
.glass .doors{display:flex;flex-direction:column;gap:0;min-width:0}
.glass .door{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:10px;padding:8px 2px;border-bottom:1px solid rgba(255,255,255,.08);font:600 15px var(--w-font);color:var(--w-ink)}
.glass .door:last-child{border-bottom:0}
.glass .door .dn{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.glass .door .dn small{display:block;font:500 13px var(--w-font);color:var(--w-dim)}
.glass.light .door{border-bottom-color:rgba(4,40,56,.1);color:#0c2836}

/* ——— the kill matrix ——— */
.glass .kmatrix{width:100%;border-collapse:separate;border-spacing:0;font:500 15px var(--w-font);color:var(--w-ink)}
.glass .kmatrix th{text-align:left;font:700 13px var(--w-font);letter-spacing:.12em;text-transform:uppercase;color:var(--w-dim);padding:7px 8px;border-bottom:1px solid rgba(255,255,255,.12);white-space:nowrap}
.glass .kmatrix td{padding:8px 8px;border-bottom:1px solid rgba(255,255,255,.07);vertical-align:middle;white-space:nowrap}
.glass .kmatrix tr:last-child td{border-bottom:0}
.glass .kmatrix td.c{text-align:center}
.glass .kmatrix .who{display:flex;align-items:center;gap:8px;min-width:0}
.glass.light .kmatrix th{border-bottom-color:rgba(4,40,56,.12)}
.glass.light .kmatrix td{border-bottom-color:rgba(4,40,56,.08);color:#0c2836}
.glass .kscroll{overflow-x:auto;min-width:0}

/* ——— the cut composer: one sentence, the two choices are its words (2026-09-04 — Sam: the form had
   "too many pills" and "a lot of lines"; the rule under review is now plain emphasised words) ——— */
.glass .policycompact .pcell{padding:9px 11px;border-radius:14px}
.glass .policycompact .stat .val{font-size:20px}
.glass .cutpanel .pb{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:150px}
.glass .cutline{display:flex;flex-direction:column;align-items:center;gap:14px;width:100%;max-width:520px;padding:4px 0 2px}
.glass .cutsay{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:4px 6px;font:500 18px/1.35 var(--font);letter-spacing:-.012em;color:var(--w-soft)}
.glass .csword{display:inline-flex;align-items:center;gap:5px;margin:0;padding:1px 7px 2px;border:0;border-radius:9px;background:transparent;cursor:pointer;color:var(--w-ink);font:inherit;font-weight:700;
  box-shadow:inset 0 -1.5px 0 rgba(107,197,214,.55);transition:background .16s ease,box-shadow .16s ease,transform .08s ease}
.glass .csword:hover{background:rgba(255,255,255,.08);box-shadow:inset 0 -1.5px 0 rgba(107,197,214,1)}
.glass .csword:active{transform:scale(.97)}
.glass .csword:focus-visible{outline:2px solid rgba(107,197,214,.78);outline-offset:1px}
.glass .csword.empty{font-weight:600;color:var(--w-dim);box-shadow:inset 0 -1.5px 0 rgba(255,159,166,.55)}
.glass .cutsay .menuwrap>.csword{display:inline-flex;flex-direction:row;flex-wrap:nowrap;white-space:nowrap;width:auto;height:auto;min-height:0}   /* a kit button rule stacks children in a column */
.glass .csword svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;color:var(--w-dim);transition:transform .2s var(--lg-snap)}
.glass .csword[aria-expanded=true] svg{transform:rotate(180deg)}
.glass .cutsay .menuwrap{display:inline-flex}
.glass .cutsay .menu{top:calc(100% + 8px);left:50%;transform:translateX(-50%) translateY(-4px) scale(.98);transform-origin:top center;min-width:170px}
.glass .cutsay .menu.on{transform:translateX(-50%)}
.glass .cutsay .menu [role=menuitem]{font-size:15px}
.glass .cstargets{display:flex;flex-direction:column;gap:8px;width:min(100%,320px)}
.glass .cstargets [data-for]{min-width:0;animation:cellin .26s var(--lg-spring) backwards}
.glass .cstargets .combo{width:100%;display:block}
.glass .csfoot{display:flex;justify-content:center;align-items:center;gap:8px}
/* the cut composer's name + Cut|Watch row — a system cut is an ordinary named policy row; the
   org-wide kill has neither and the block is hidden for it (Phase 3, 2026-09-07) */
.glass .csextra{display:flex;flex-direction:column;align-items:center;gap:8px;width:min(100%,320px)}
.glass .csextra[hidden]{display:none}
.glass .csextra .csname{width:100%}
/* the limit composer's Mode stage: the sentence naming every ceiling the per-subject `__mode`
   governs, and the confirm switch that gates a flip (I-1, 2026-09-07) */
.glass .lfgoverns{margin-top:8px;font:400 15px/1.5 var(--w-font);color:var(--w-soft)}
.glass .lfgoverns:empty{display:none}
.glass .switchrow.lfack{margin-top:8px}
.glass .switchrow.lfack[hidden]{display:none}
.glass .csfoot .holdbtn{min-width:162px;justify-content:center}
.glass .csdone{display:flex;flex-direction:column;align-items:center;gap:12px;width:100%;animation:cellin .34s var(--lg-spring) backwards}
.glass .csdonerow{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px;font:600 18px var(--font);color:var(--w-ink)}
.glass .csdonerow .cssent{color:var(--w-soft);font-weight:500}
.glass .cutsay[hidden],.glass .cstargets[hidden],.glass .csfoot[hidden],.glass .csdone[hidden],.glass .cstargets [data-for][hidden]{display:none}
.glass.light .cutsay{color:#3f5d6c}
.glass.light .csword{color:#0c2836;box-shadow:inset 0 -1.5px 0 rgba(30,157,184,.55)}
.glass.light .csword:hover{background:rgba(4,40,56,.06)}
.glass.light .csword.empty{color:#3f5d6c}
.glass.light .csdonerow{color:#0c2836}.glass.light .csdonerow .cssent{color:#3f5d6c}

/* ——— the hook composer: sentence lines inside the sheet ——— */
.glass .sheet.hookform{width:min(640px,94vw)}
.glass .hookform-body{display:flex;flex-direction:column;gap:12px}
.glass .hsline{display:flex;align-items:center;flex-wrap:wrap;gap:8px 8px;min-width:0;font:500 18px/1.35 var(--font);letter-spacing:-.01em;color:var(--w-soft)}
.glass .hsline .csw{white-space:nowrap}
.glass .hsline .combo{width:auto;min-width:200px;max-width:100%;display:inline-block}
.glass .hsline .cutsay,.glass .hsline .csword{font-size:18px}
.glass .hsline .menuwrap{display:inline-flex}
.glass .hsline .menuwrap>.csword{display:inline-flex;flex-direction:row;flex-wrap:nowrap;white-space:nowrap;width:auto;height:auto;min-height:0;padding:1px 6px 2px;font-weight:700;color:var(--w-ink);box-shadow:inset 0 -1.5px 0 rgba(107,197,214,.55)}
.glass .hsline .menu{top:calc(100% + 8px);left:0;min-width:210px;max-width:min(480px,calc(100vw - 200px))}
/* a long option truncates inside the sheet instead of widening the menu to 855 px and scrolling the sheet sideways (ui-interact 2026-09-06) */
.glass .hsline .menu [role=option]{max-width:100%}
.glass .hsline .menu [role=option]>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.glass .hsline .menu [role=menuitem]{justify-content:space-between;gap:14px}
.glass .hsline .menu .hkabs{font-size:13px}
.glass .hsdetail{padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08)}
.glass .hsdetail[hidden]{display:none}
.glass .hspick{display:inline-flex;align-items:center;gap:6px;min-width:0;max-width:100%}
.glass .hspick .taginput{min-width:220px;max-width:100%}
.glass .hspick .combo{min-width:180px}
.glass .hspick .stepper.solo .sin{width:64px}
.glass .hsdays .tgi{padding:4px 9px;min-height:29px;font-size:13px;text-transform:uppercase;letter-spacing:.04em}
.glass .hstargets [data-for]{display:inline-block;min-width:220px;max-width:100%}
.glass .hstargets [data-for][hidden]{display:none}
.glass .hsreason{flex:1;min-width:220px}
.glass .hsreason input{width:100%;min-width:0;background:transparent;border:0;outline:none;color:var(--w-ink);font:500 15px var(--w-font);padding:6px 4px}
.glass .hkdefault{font-size:15px;color:var(--w-dim)}
.glass .hkdefault:empty{display:none}
.glass .hsid .iedit{font:600 15px ui-monospace,Menlo,Consolas,monospace}
.glass .hsid .iedit input{width:236px;font:600 15px ui-monospace,Menlo,Consolas,monospace}
.glass .hsabsent .switchrow.mini{min-height:33px;padding:3px 10px;gap:8px}
.glass .hsabsent .switchrow.mini .srl{font-size:13px;font-weight:500;color:var(--w-soft)}
.glass .hsrow{align-items:flex-start}
.glass .hsrow .code.blk{flex:1;min-width:0;font-size:13px;line-height:1.5}
/* "Adjust the rule" — the kit's own accordion (console.css .acc), whose body is styled for a text
   block; here it holds the composer's form lines, so only the layout is restated. */
.glass .hsadj .abody>div{display:flex;flex-direction:column;gap:12px;padding:2px 12px 12px;font:inherit;color:inherit}
.glass .hsadj details:not([open]) .abody>div{padding-bottom:0}
.glass .hstemplate .hk-tpl{flex:1;min-width:180px}
.glass .hstemplate .strig .sval{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.glass .hkreview{padding:14px 16px;border-radius:12px;background:rgba(107,197,214,.055);box-shadow:inset 0 1px rgba(255,255,255,.07);color:var(--w-ink)}
.glass .hkreview p{margin:6px 0 0;font-size:15px;line-height:1.5;overflow-wrap:anywhere}
.glass .hkreview #hkCoverage{color:var(--w-dim);font-size:15px}
.glass .hkaudience{font-size:15px;font-weight:600;color:var(--w-ink)}
.glass .hookform [aria-invalid="true"]{outline:2px solid var(--w-amber,#e7ba79);outline-offset:2px}
.glass .hookform #hkErr:focus{outline:2px solid var(--w-amber,#e7ba79);outline-offset:4px;border-radius:5px}
.glass .hookform .hsreason input:focus-visible{outline:2px solid var(--w-teal,#6bc5d6);outline-offset:2px;border-radius:5px}
.glass .hookform[aria-busy="true"] .hookform-body{opacity:.65}
.glass .hookform .hsline .csw{white-space:normal}
.glass .hookform .hsadj .code{overflow-wrap:anywhere;white-space:pre-wrap}
.glass .hookform .hsabsent{max-width:100%}
.glass.light .hkreview{background:rgba(30,157,184,.055);box-shadow:inset 0 1px rgba(4,40,56,.08);color:#0c2836}
.glass.light .hkreview #hkCoverage{color:#3f5d6c}
.glass.light .hkaudience{color:#0c2836}
@media(max-width:600px){.glass .hookform .hsline .menu{max-width:calc(100vw - 72px);min-width:min(210px,calc(100vw - 72px))}.glass .hookform .hstemplate .hk-tpl{flex-basis:100%}.glass .hookform .hsdays{flex-wrap:wrap}}
.glass.light .hsline{color:#3f5d6c}
.glass.light .hsline .menuwrap>.csword{color:#0c2836;box-shadow:inset 0 -1.5px 0 rgba(30,157,184,.55)}
.glass.light .hsdetail{background:rgba(4,40,56,.03);border-color:rgba(4,40,56,.1)}
.glass.light .hsreason input{color:#0c2836}

/* ——— the account menu lives on the sidebar's profile button and opens upward (2026-09-04 — the
   top-right avatar duplicated it) ——— */
.glass .sbfoot .menuwrap{display:block;width:100%}
/* the menu is portalled to the glass root (the sidebar clips) and placed from the button's rect on open */
.glass .menu.usermenu.portal{position:fixed;top:auto;right:auto;z-index:60;min-width:240px;transform:translateX(-6px) scale(.98);transform-origin:bottom left}
.glass .menu.usermenu.portal.on{transform:none}
.glass .menu.usermenu .uhead .avatar{flex:none}
.glass .combo[hidden]{display:none}

/* ——— content checks ——— */
/* the three columns' MINIMUMS must fit a .g2 half (490 px at 1440): 140+220+100 + gaps + padding = 508 pushed the EFFECTIVE column 26 px past the panel at every width (ui-walk 2026-09-06) */
.glass .dialrow{display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,300px) minmax(64px,auto);gap:12px;align-items:center;padding:12px;border-radius:12px;border:1px solid transparent;min-width:0;text-align:center}
/* THE PANEL is what the row has to fit in, never the window. The two viewport breakpoints that used
   to do this read the window and got 820 badly wrong: under 860 the sidebar is a drawer, so the
   `.g2` is one column and the panel is 748 px wide — and the row stacked into a centred ribbon down
   the left with the right half of the panel empty (audited 2026-09-14). `#ccRows` is a container
   like `.hsrows`, and the same two steps now key off the width the row actually gets. */
.glass #ccRows{container-type:inline-size}
@container (max-width:620px){.glass .dialrow{grid-template-columns:minmax(0,1fr) minmax(180px,300px)}.glass .dialrow .eff{grid-column:1 / -1}}
.glass .dialrow+.dialrow{border-top-color:rgba(255,255,255,.08)}
.glass .dialrow .drl{font:600 15px var(--w-font);color:var(--w-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.glass .dialrow .drs{display:block;font:500 13px var(--w-font);color:var(--w-dim);margin-top:2px}
.glass .dialrow .ownstate{display:inline-block;margin-left:7px;color:var(--w-soft)}
.glass .dialrow .eff{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:0;max-width:100%}
/* the EFFECTIVE value truncates inside its column instead of pushing the row past the window (ui-walk 2026-09-06: clipped off the right edge at every width) */
.glass .dialrow .effv{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.glass .dialrow .eff .lbl{font-size:13px}
.glass .dialrow .dial{padding:0;justify-self:center;width:100%;max-width:300px;min-width:0}
.glass .dialrow .dial .dcap{display:none}
.glass .dialrow .inherit{height:24px;padding:0 9px;font-size:13px}
.glass .dialrow .switchrow{justify-self:center;width:100%;max-width:300px;justify-content:center}
.glass .dialrow .switchrow .srm{flex:0 1 auto;text-align:center}
.glass.light .dialrow .drl{color:#0c2836}
.glass.light .dialrow+.dialrow{border-top-color:rgba(4,40,56,.1)}
.glass .scopepick{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0;justify-content:flex-end}
.glass .scopepick .combo{flex:1 1 150px;width:auto;min-width:0;max-width:236px}
.glass .tglgroup.fit{width:auto;display:inline-flex}

/* ——— drawer bodies ——— */
.glass .dwsec{display:flex;flex-direction:column;gap:9px;min-width:0;margin-bottom:16px}
.glass .dwsec:last-child{margin-bottom:0}
.glass .dwsec .lbl{display:block}
.glass .dwhead2{display:flex;align-items:center;gap:12px;min-width:0;margin-bottom:14px}
.glass .dwhead2 .avatar.lg{width:42px;height:42px;font-size:15px}
.glass .dwhead2 .dwt{min-width:0}
.glass .dwhead2 .dwt b{display:block;font:600 18px var(--font);color:var(--w-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.glass .dwhead2 .dwt .dws{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:3px;font:500 13px var(--w-font);color:var(--w-dim)}
.glass.light .dwhead2 .dwt b{color:#0c2836}
.glass .detailhero{padding:14px;border-radius:15px;margin-bottom:14px;background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.025));border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.18)}
.glass.light .detailhero{background:linear-gradient(160deg,#fff,rgba(255,255,255,.72));border-color:rgba(4,40,56,.13);box-shadow:inset 0 1px 0 #fff}
.glass .detailhero .dwhead2{margin-bottom:12px}
/* four fixed columns fitted `Chargeable tokens` and `$104.08` into 63 px inside the 440 px
   drawer and clipped both — `CHARGEAB...` over `$104....`, with no tooltip to recover the cents
   from (RULES §7). The row wraps instead: two across in the compact drawer, four when it is
   maximised, and `auto-fit` collapses the empty tracks so four cells still fill the width. */
.glass .personstats{display:grid;grid-template-columns:repeat(auto-fit,minmax(142px,1fr));gap:8px}
.glass .personstats>div{min-width:0;padding:10px 11px;border-radius:11px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.08)}
.glass .personstats span{display:block;font:700 13px var(--w-font);letter-spacing:.09em;text-transform:uppercase;color:var(--w-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.glass .personstats b{display:block;margin-top:4px;font:700 18px/1.1 var(--font);color:var(--w-ink);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.glass .sessionhero .personstats{gap:0;border-top:1px solid rgba(255,255,255,.09)}
.glass .sessionhero .personstats>div{padding:9px 12px 4px;border:0;border-left:1px solid rgba(255,255,255,.09);border-radius:0;background:transparent}
.glass .sessionhero .personstats>div:first-child{border-left:0}
.glass.light .personstats>div{background:rgba(4,40,56,.035);border-color:rgba(4,40,56,.08)}
.glass.light .sessionhero .personstats{border-top-color:rgba(4,40,56,.09)}
.glass.light .sessionhero .personstats>div{background:transparent;border-left-color:rgba(4,40,56,.09)}
.glass.light .personstats b{color:#0c2836}
.glass .detailgrid{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin-bottom:12px}
.glass .ovl.max .detailgrid{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
.glass .detailsection{min-width:0;padding:13px;border-radius:14px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.1)}
.glass.light .detailsection{background:rgba(4,40,56,.025);border-color:rgba(4,40,56,.09)}
.glass .detailtitle{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;font:600 15px var(--w-font);color:var(--w-ink)}
.glass .detailtitle small{font:500 13px var(--w-font);color:var(--w-dim);white-space:nowrap}
.glass.light .detailtitle{color:#0c2836}
.glass .actiongroup{display:inline-flex;align-items:center;isolation:isolate}
.glass .actiongroup .gbtn2{position:relative;border-radius:8px;margin-left:-1px}
.glass .actiongroup .gbtn2:first-child{margin-left:0;border-radius:99px 8px 8px 99px}
.glass .actiongroup .gbtn2:last-child{border-radius:8px 99px 99px 8px}
.glass .actiongroup .gbtn2:focus-visible,.glass .actiongroup .gbtn2:hover{z-index:1}
.glass .sessioncards{display:flex;flex-direction:column;gap:5px}
.glass .sessioncard{display:grid;grid-template-columns:minmax(0,1fr) auto 16px;align-items:center;gap:10px;width:100%;min-width:0;padding:9px 10px;border-radius:11px;text-align:left;cursor:pointer;color:var(--w-ink);background:transparent;border:1px solid transparent;transition:background .16s ease,border-color .16s ease,transform .12s ease}
.glass .sessioncard:hover{background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.13);transform:translateX(2px)}
.glass .sessioncard:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:1px}
.glass .sessioncard .scmain{display:flex;align-items:center;gap:9px;min-width:0}.glass .sessioncard .scmain>b{font:600 13px var(--w-font);min-width:54px}
.glass .sessioncard .scmeta{display:flex;align-items:center;gap:10px;white-space:nowrap;font:500 13px var(--w-font);color:var(--w-dim)}
.glass .sessioncard .scmeta strong{color:var(--w-ink);font-variant-numeric:tabular-nums}
.glass .sessioncard .schev{transform:rotate(-90deg);color:var(--w-dim)}.glass .sessioncard .schev svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2}
.glass.light .sessioncard{color:#0c2836}.glass.light .sessioncard:hover{background:rgba(4,40,56,.04);border-color:rgba(4,40,56,.1)}.glass.light .sessioncard .scmeta strong{color:#0c2836}
.glass .emptyline{display:block;padding:18px;text-align:center;font:500 13px var(--w-font);color:var(--w-dim)}
.glass .sessiontabs{width:max-content;margin:0 0 10px;padding:3px}
.glass .sessiontabs [role=tab]{padding:8px 15px;font-size:15px}.glass .sessiontabs .cnt{margin-left:6px;font:700 13px var(--w-font);color:var(--w-dim)}
.glass .sessionpanels{min-width:0}
.glass .sessionpanels>[role=tabpanel]{display:none;max-height:calc(100vh - 290px);overflow:auto;scrollbar-width:thin;scrollbar-color:rgba(107,197,214,.35) transparent}
.glass .sessionpanels>[role=tabpanel].on{display:block;animation:sessionpane .16s ease-out backwards}
@keyframes sessionpane{from{opacity:.35;transform:translateY(2px)}to{opacity:1;transform:none}}
@media (max-width:820px){.glass .personstats{grid-template-columns:repeat(2,minmax(0,1fr))}.glass .sessionhero .personstats>div:nth-child(3){border-left:0}.glass .ovl.max .detailgrid{grid-template-columns:minmax(0,1fr)}.glass .sessioncard{grid-template-columns:minmax(0,1fr) 16px}.glass .sessioncard .scmeta{grid-column:1}.glass .sessioncard .schev{grid-column:2;grid-row:1/-1}.glass .sessionpanels>[role=tabpanel]{max-height:calc(100vh - 330px)}}
.glass .dwgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;min-width:0}
.glass .ovl:not(.max) .dwgrid{grid-template-columns:minmax(0,1fr)}
.glass .turnhead,.glass .turnrow{display:grid;grid-template-columns:30px 48px 160px minmax(0,1fr) 62px 70px 102px 18px;align-items:center;gap:10px;min-width:0}
.glass .turnhead{padding:0 10px 6px;font:700 13px var(--w-font);letter-spacing:.12em;text-transform:uppercase;color:var(--w-dim);border-bottom:1px solid rgba(255,255,255,.1)}
.glass .turnhead .r,.glass .turnrow .r{text-align:right}
.glass .turns{display:flex;flex-direction:column;min-width:0}
.glass .turn{border-bottom:1px solid rgba(255,255,255,.08);min-width:0}
.glass .turn:last-child{border-bottom:0}
.glass .turnrow{width:100%;padding:8px 10px;border:0;border-radius:10px;background:transparent;cursor:pointer;text-align:left;color:var(--w-ink);font:500 15px var(--w-font);transition:background .16s ease}
.glass .turnrow:hover{background:rgba(255,255,255,.05)}
.glass .turnrow:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:-2px}
.glass .turnrow .turnno{display:grid;place-items:center;width:26px;height:24px;border-radius:7px;background:rgba(255,255,255,.07);color:var(--w-dim);font:700 13px var(--w-font);font-variant-numeric:tabular-nums}
.glass .turnrow .turnat{color:var(--w-dim);font-variant-numeric:tabular-nums}
.glass .turnrow .turnmodel{min-width:0;overflow:hidden}
.glass .turnrow .turntext{display:flex;flex-direction:column;gap:2px;min-width:0}
.glass .turnrow .tq,.glass .turnrow .ta{display:flex;align-items:center;gap:6px;min-width:0;font:500 15px/1.35 var(--w-font)}
.glass .turnrow .ta{color:var(--w-soft)}
.glass .turnrow .tq i,.glass .turnrow .ta i{display:grid;place-items:center;width:13px;height:13px;flex:none;color:var(--w-dim)}
.glass .turnrow .tq i svg,.glass .turnrow .ta i svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.glass .turnrow .turnchev{display:grid;place-items:center;color:var(--w-dim);transition:transform .22s var(--lg-snap)}
.glass .turnrow .turnchev svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.glass .turn.open .turnrow .turnchev{transform:rotate(180deg)}
.glass .turnbody{display:grid;grid-template-rows:0fr;transition:grid-template-rows .28s var(--lg-spring)}
.glass .turn.open .turnbody{grid-template-rows:1fr}
.glass .turnbody .turnin{overflow:hidden;min-height:0}
.glass .turn.open .turnbody .turnin{padding:2px 10px 12px 88px;display:flex;flex-direction:column;gap:7px}
.glass .turn .tcall{display:grid;grid-template-columns:minmax(0,1fr) 62px auto auto;gap:10px;align-items:center;padding:6px 10px;border-radius:9px;background:rgba(255,255,255,.04);font:500 13px var(--w-font)}
.glass .turn .tcall.none{grid-template-columns:minmax(0,1fr);color:var(--w-dim)}
.glass.light .turnhead{border-bottom-color:rgba(4,40,56,.1)}
.glass.light .turn{border-bottom-color:rgba(4,40,56,.09)}
.glass.light .turnrow{color:#0c2836}
.glass.light .turnrow:hover{background:rgba(4,40,56,.035)}
.glass.light .turnrow .turnno{background:rgba(4,40,56,.06);color:#3f5d6c}
.glass.light .turnrow .turnat,.glass.light .turnrow .tq i,.glass.light .turnrow .ta i,.glass.light .turnrow .turnchev{color:#3f5d6c}
.glass.light .turnrow .ta{color:#33505f}
.glass.light .turn .tcall{background:rgba(4,40,56,.04)}
@media (max-width:820px){.glass .turnhead{display:none}.glass .turnrow{grid-template-columns:30px minmax(0,1fr) 70px 18px}.glass .turnrow>span:nth-child(2),.glass .turnrow>span:nth-child(3),.glass .turnrow>span:nth-child(5),.glass .turnrow>span:nth-child(7){display:none}.glass .turn.open .turnbody .turnin{padding-left:10px}}
.glass .stripprev{display:flex;flex-direction:column;justify-content:center;gap:10px;min-width:0;min-height:184px}
.glass .stripprev .widgetpreview{position:relative;width:100%;min-width:0;background:transparent}
.glass .stripprev .island{opacity:1;transform:none;max-width:300px}
.glass .stripprev .island.open{max-width:100%}
.glass .stripprev .island .row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:4px;width:100%;border:0;background:transparent;color:inherit;font:inherit;text-align:left}
.glass .stripprev .z-summary{display:flex;align-items:center;gap:9px;min-width:0;padding:0;border:0;background:transparent;color:inherit;font:inherit;text-align:left;cursor:pointer}
.glass .stripprev .z-summary:focus-visible,.glass .stripprev .z-bell:focus-visible,.glass .stripprev .z-gear:focus-visible{outline:2px solid rgba(107,197,214,.8);outline-offset:2px}
.glass .stripprev .z-summary .model{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.glass .stripprev .z-summary .chev{margin-left:auto}
.glass .stripprev .z-bell,.glass .stripprev .z-gear{position:relative;z-index:2;flex:none}
.glass .stripprev .island .space{color:var(--w-ink)}
.glass .stripprev .island .pcells{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.glass .stripprev .island .pcell{min-width:0}
@media (max-width:640px){.glass .stripprev .island .pcells{grid-template-columns:repeat(2,minmax(0,1fr))}}
.glass .widgetnotice{position:absolute;z-index:8;right:8px;top:calc(50% + 22px);display:flex;flex-direction:column;width:min(292px,calc(100% - 16px));padding:6px;border-radius:14px;pointer-events:none;opacity:0;transform:translateY(-6px) scale(.98);transform-origin:top right;color:var(--w-ink);background:linear-gradient(160deg,rgba(9,36,50,.98),rgba(6,28,40,.97));border:1px solid rgba(255,255,255,.2);box-shadow:0 18px 40px rgba(2,16,26,.48),inset 0 1px 0 rgba(255,255,255,.28);transition:opacity .15s ease,transform .22s var(--lg-snap)}
.glass .widgetnotice.on{pointer-events:auto;opacity:1;transform:none}
.glass .widgetnotice button{display:flex;align-items:flex-start;gap:9px;width:100%;padding:9px 10px;border:0;border-radius:10px;text-align:left;cursor:pointer;color:inherit;background:transparent;transition:background .14s ease,transform .1s ease}
.glass .widgetnotice button:hover{background:rgba(255,255,255,.07)}.glass .widgetnotice button:active{transform:scale(.985)}.glass .widgetnotice button:focus-visible{outline:2px solid rgba(107,197,214,.78);outline-offset:-2px}
.glass .widgetnotice button>span:nth-child(2){min-width:0}.glass .widgetnotice b{display:block;font:600 13px var(--w-font)}.glass .widgetnotice small{display:block;margin-top:2px;font:400 13px var(--w-font);color:var(--w-soft)}
.glass .widgetnotice .wnd{width:7px;height:7px;border-radius:50%;flex:none;margin-top:4px;background:var(--ch0);box-shadow:0 0 7px rgba(46,200,232,.55)}.glass .widgetnotice .wnd.ok{background:var(--ch-ok)}.glass .widgetnotice .wnd.warn{background:var(--ch-warn)}.glass .widgetnotice .wnd.err{background:var(--ch-err)}
.glass .widgetpreview.light .widgetnotice{color:#0c2836;background:linear-gradient(160deg,#fff,#f2f7fa);border-color:rgba(4,40,56,.16);box-shadow:0 18px 40px rgba(23,48,62,.22),inset 0 1px 0 #fff}.glass .widgetpreview.light .widgetnotice small{color:#3f5d6c}.glass .widgetpreview.light .widgetnotice button:hover{background:rgba(4,40,56,.05)}
.glass .ptgroup{display:flex;flex-direction:column;gap:2px;min-width:0}.glass .ptgroup .ptsub{font:400 13px/1.35 var(--w-font);color:var(--w-soft);white-space:normal;max-width:62ch}
.glass #stSettingsPanel.attention{animation:settingscue .42s var(--lg-snap)}
@keyframes settingscue{45%{border-color:rgba(107,197,214,.65);box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 0 0 4px rgba(46,200,232,.13)}to{border-color:rgba(255,255,255,.15);box-shadow:inset 0 1px 0 rgba(255,255,255,.22)}}

/* ——— Settings › Harness: the settings picker on the content-checks row grammar ——— */
.glass .harnesshead{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;min-width:0}
.glass .harnesshead .tiles{flex:1;min-width:236px;max-width:380px}
.glass .hsrows{display:flex;flex-direction:column;min-width:0;container-type:inline-size}
/* audit 2026-09-06 (console): a harness panel is a HALF of the settings column (the vertical tabs take the
   rest), so at 1280 with the sidebar open its body is ~375 px while a three-column row needs ~440 — the row
   overflowed the panel and the shell body clipped it (RULES §7). Below that width the row stacks, the way the
   820 px viewport rule already stacks it; the panel is the measure, not the viewport. */
@container (max-width:500px){.glass .dialrow{grid-template-columns:minmax(0,1fr)}.glass .dialrow .dial,.glass .dialrow .switchrow,.glass .dialrow .hctl,.glass .dialrow .eff{grid-column:1;justify-self:center}.glass .dialrow .eff{min-width:0}}
.glass .dialrow .hctl{display:flex;align-items:center;justify-content:center;gap:8px;min-width:0}
.glass .dialrow.wide{grid-template-columns:minmax(160px,240px) minmax(0,1fr);text-align:left}
.glass .dialrow.wide .hctl{justify-content:flex-start;align-items:stretch}
.glass .dialrow.wide .drs{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.glass .dialrow.wide .drs .ownstate{margin-left:0}
.glass .dialrow .hctl .taginput,.glass .dialrow .hctl .kvwrap,.glass .dialrow .hctl .igroup.block{width:100%;min-width:0}
.glass .dialrow .hctl .kvwrap{display:flex;flex-direction:column;gap:8px}
.glass .dialrow .hctl .stepper.solo .sin{width:64px}
.glass .dialrow .hctl .iedit{max-width:100%;min-width:0;overflow:hidden}
.glass .dialrow .hctl .iedit .iv{max-width:100%}
.glass .dialrow .hctl .iedit input{width:216px;max-width:100%}
/* a key in a row's sub-line is quiet mono, not a capsule (30 capsules on one Harness page otherwise) */
.glass .dialrow .drs .code{background:transparent;border-color:transparent;padding:0;color:var(--w-dim)}
.glass.light .dialrow .drs .code{color:#3f5d6c}
/* RULES §11: in a table cell a code value is quiet type, never a bordered capsule — thirty of them read as pills (ui-walk 2026-09-06) */
.glass td .code:not(.blk){background:transparent;border-color:transparent;padding:0}
.glass .tglgroup.fit .tgi{flex:none}
.glass .chb .hbf{min-width:3px}
.glass .dialrow .hctl .switchrow{width:100%;max-width:300px;justify-content:center}
.glass .dialrow .hctl .igroup.block textarea{width:100%;min-height:78px;resize:vertical;background:transparent;border:0;outline:none;color:var(--w-ink);font:500 15px/1.45 var(--w-font)}
.glass .dialrow .hctl .igroup.block .cnt{align-self:flex-end;padding:0 10px 6px;font:500 13px var(--w-font);color:var(--w-dim);font-variant-numeric:tabular-nums}
.glass.light .dialrow .hctl .igroup.block textarea{color:#0c2836}
.glass #hsPending{margin-top:0}
.glass .hsadd{width:216px;max-width:100%}
@media (max-width:820px){.glass .dialrow.wide{grid-template-columns:minmax(0,1fr)}}

/* ——— tiles (Settings › Harness) ——— */
.glass .tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(236px,1fr));gap:12px;min-width:0}
.glass .tile{display:flex;flex-direction:column;gap:6px;padding:14px;border-radius:16px;cursor:pointer;text-align:left;color:var(--w-ink);
  background:linear-gradient(160deg,rgba(255,255,255,.1),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.18)}
.glass .tile .tn{font:600 15px var(--w-font)}
.glass .tile.on{border-color:rgba(107,197,214,.55)}
.glass.light .tile{color:#0c2836;background:linear-gradient(160deg,#fff,rgba(255,255,255,.8));border-color:rgba(4,40,56,.16)}
.glass .kv .kvv .code{max-width:100%}
.glass .chips{display:flex;gap:6px;flex-wrap:wrap;min-width:0}

/* ——— reduced motion ——— */
@media (prefers-reduced-motion:reduce){
  .glass #ovTrendChart.metricswap,.glass .sessionpanels>[role=tabpanel].on,.glass #stSettingsPanel.attention{animation:none}
  .glass .kpicard,.glass .kpicard::before,.glass .sessioncard,.glass .widgetnotice,.glass .widgetnotice button,.glass #rangeSeg,.glass .turnbody,.glass .turnrow .turnchev,.glass .csword,.glass .csword svg{transition:none}
  .glass .csdone,.glass .cstargets [data-for]{animation:none}
}

/* ── top bar wave (2026-09-14) ── */
/* The hand-off from the field to the palette is a MORPH, not a modal: the palette opens AT the
   field — same left, same top, same width — and the list grows downward out of it, over a blurred
   and dimmed page (the overlay's own scrim already does that). app.js measures the field and writes
   --ckx / --cky / --ckw when the overlay turns on and on every resize while it is open. */
.glass #cmdWrap .cmdk{left:var(--ckx,50%);top:var(--cky,12vh);width:var(--ckw,min(600px,94vw));border-radius:12px;
  transform:translateY(-3px) scaleY(.94);transform-origin:top center;
  transition:opacity .18s ease,transform .3s var(--lg-spring)}
.glass #cmdWrap.in .cmdk{opacity:1;transform:none}
.glass #cmdWrap.out .cmdk{opacity:0;transform:translateY(-3px) scaleY(.97);transition:opacity .12s ease,transform .16s var(--lg-out)}
/* the input row is the field, eight pixels taller and with the field's own left inset — that jump is
   the "you are in it now" cue, and the inset is what makes the glyph stay put through the morph */
.glass #cmdWrap .cmdk .ckin{height:48px;padding:0 5px 0 14px;gap:10px}
.glass #cmdWrap .cmdk .ckin .gicon{width:16px;height:16px;color:var(--w-ink);opacity:.5}
/* The palette is a room surface, on the room scale: rows 14, meta · group heads · the footer and
   the Esc chip 12.5, the input 15. It was painting 52 elements under the 12.5 px floor this wave
   set — the floor's own gate missed it because the route census loads with the palette closed
   (A1 #1, 2026-09-15). */
.glass #cmdWrap .cmdk .ckin input{font:500 16px var(--w-font)}
.glass #cmdWrap .cmdk .ckin .kbd{height:22px;min-width:22px;justify-content:center;font-size:13px;padding:0 6px}
.glass #cmdWrap .cmdk .cklist{max-height:min(300px,42vh);padding:6px}
/* a group heading is a quiet sentence-case line, not a caps label */
.glass #cmdWrap .cmdk .ckg{font:500 13px var(--w-font);letter-spacing:0;text-transform:none;color:var(--w-dim);padding:10px 10px 5px}
/* rows 42 with the glyph in its tile; the highlight is the kit's sliding thumb (parts/nav.css §7),
   one surface for the keyboard's row and the pointer's row alike */
.glass #cmdWrap .cmdk .cki{height:42px;border-radius:11px;gap:11px;padding:0 9px}
@media (prefers-reduced-motion:reduce){
  .glass #cmdWrap .cmdk,.glass #cmdWrap.in .cmdk,.glass #cmdWrap.out .cmdk{transform:none;transition:opacity .12s ease}
  .glass .cmdk .ckthumb{transition:none}
}
/* Day · Week · Month sits in the page head of the four windowed rooms and nowhere else. It is the
   head's first action, left of the `as of` stamp and the refresh, and it holds its shape when the
   head is stuck to the top of the scroller (both schemes). */
.glass .pagehead .phact #rangeSeg{flex:none;margin-right:2px}
/* padding only — Day · Week · Month keeps the segmented's own 11.5 px, the floor for a word on a
   room's surface. It was stepped down to 11 with the rest of the head and read small (2026-09-14). */
.glass .pagehead .phact #rangeSeg span:not(.segthumb){padding:5px 12px}

/* ── the shell, wave 2 (2026-09-15) ── */
/* Sam's first-impressions list: the trail out of the top bar and into the page head, the command
   surface widened into a frosted capsule with ONE gradient rim for an indicator, the "as of" stamp
   under the room's name instead of beside its refresh, and fewer lines everywhere. The pieces that
   are not the kit's own live here; the capsule and the two-row head are in parts/nav.css. */

/* The palette comes out of a CAPSULE now, so its top corners have to BE the capsule's: a 999 px
   field opening into a 12 px card is two objects, not one morph. The field is 40 px tall, so its
   ends are 20 px round; the list keeps 12 px at the bottom (the Raycast shape). */
/* …and the card's boundary is the FIELD's rim at the open alpha, not a white hairline: the rim is
   the one indicator this bar has, and it was being covered by the surface it turns into (A1 #6).
   The construction lives with the component, in parts/nav.css §7. */
.glass #cmdWrap .cmdk{border-radius:20px 20px 12px 12px}

/* The trail's row STRETCHES to the head's full width, and that is load-bearing, not cosmetic: the
   shed ladder measures the row's `clientWidth`, so a shrink-to-fit row would report its own content
   width, shed a level, shrink again and shed the next — at 1440 the trail came out as "⌂ › … ›
   Platform" with 1,300 px of empty row beside it (measured 2026-09-15). */
.glass .pagehead .phtrail{align-self:stretch;max-width:100%}
/* Day · Week · Month and the refresh keep the head's second row; the stamp left this cluster for
   the line under the title (Sam: "maybe the date can be … right under, in small letters") */
.glass .pagehead .phact{flex:none}

/* ── type scale (2026-09-14) ── */
/* Vadim: "Fonts are too small throughout and icons are too small in nav menu." One consistent
   step (+1.5 px from 9 through 14; the page title 17 → 20) applied across the hand-authored
   layers. These last rules are the pieces whose size lives in the GENERATED glass.css, which
   sync.py owns and nothing may hand-edit — so the console overrides them here, at equal or
   higher specificity, and the tray document they are generated from keeps its own scale. */
/* 12.5 px is the FLOOR for anything that carries a word on a room's surface — a KPI tile's label,
   a stat cell's label, a table header, a menu's section heading. ONE exception survives Sam's
   second pass (2026-09-15): the sidebar's own group caption, at 11.5. Nothing else on a console
   surface sits under 12.5, and the Status › Bar preview keeps the widget's scale (RULES §11). */
/* the tracking comes DOWN as the word grows: .12em on a 12.5 px uppercase label wrapped
   "TOKENS · CHARGEABLE" onto two lines at 1280 and pushed that cell's number off the row's
   baseline (measured 2026-09-15). Same rule as the table header — bigger word, tighter track. */
.glass .lbl{font-size:13px;letter-spacing:.08em}
.glass .tiny{font-size:13px}
.glass .mn{font-size:15px}
.glass .seg span{font:600 15px var(--w-font);padding:6px 13px}
.glass .setrow{font-size:16px}
.glass .setrow .sl small{font-size:13px}
.glass .notice .nt{font-size:16px}
.glass .notice .ns{font-size:15px}
.glass .notice .when{font-size:13px}
.glass .meter .ml{font-size:13px;width:104px}
.glass .meter .mv{font-size:15px;width:32px}
.glass .moment{font-size:15px}
/* .seg.mini is the in-table state control and stays a step under the full segmented — it is
   re-declared AFTER `.seg span` above, which shares its specificity and would otherwise win.
   It stops AT the floor: 12.5 with tighter padding, not a smaller word. */
.glass .seg.mini span{padding:3px 9px;font-size:13px}
/* the in-table state control keeps the floor; its thumb has to be re-measured after the step */
/* Status › Bar draws the live widget, not a console surface: RULES §11 says the preview must
   render the widget's own contract, so the type step stops at the preview's edge. */
.glass .widgetpreview .lbl{font-size:9px}
.glass .widgetpreview .tiny{font-size:10px}
.glass .widgetpreview .mn{font-size:11.5px}
.glass .widgetpreview .pcell .mn{font-size:15px}
.glass .widgetpreview .setrow{font-size:12px}
.glass .widgetpreview .setrow .sl small{font-size:10px}
.glass .widgetpreview .seg span{font:600 10px var(--w-font);padding:4px 11px}
.glass .widgetpreview .moment{font-size:10.5px}
.glass .widgetpreview .model{font-size:12.5px}

/* ── type scale, second step (2026-09-15) ── */
/* Sam, looking at the console: "fonts are too small throughout, and icons are too small in the
   navigation menu … a lot of work there … done perfectly." The kit layers carry the step in place
   (console.css · parts/*.css · harness.css). These rules are the pieces whose size lives EARLIER
   in this file, or in a kit section this wave's owner may not edit in place — so they are restated
   here, at the end, at equal-or-higher specificity. The `.widgetpreview` block above still wins
   inside the Status › Bar preview: every rule there is one class deeper than its counterpart. */

/* the shell column: ONE token, so the full sidebar and the hovered rail can never drift apart.
   The kit reads --sbw (nav.css §1, not editable from here); --sbpanel is the visible panel =
   column minus the sidebar's own 2 x 10 px margin. */
.glass .shell{--sbcol:264px;--sbrail:80px;--sbpanel:calc(var(--sbcol) - 20px);--sbw:var(--sbcol)}
.glass .shell.m-rail{--sbw:var(--sbrail)}
.glass .shell.m-drawer{--sbw:0px}
.glass .sbbrand .brandword{font-size:16px}

/* a non-top-bar icon button: the glyph goes up one step and the box with it. `.icobtn.tb` keeps
   its own size (nav.css §3) — that one is the top bar's, not this wave's. */
.glass .icobtn{width:28px;height:28px}
.glass .icobtn svg{width:14px;height:14px}

/* panel furniture */
.glass .panel .ph .pt{font-size:16px}
.glass .panel .ph .stamp{font-size:13px}
.glass .code{height:26px;font:600 15px/24px ui-monospace,Menlo,Consolas,monospace}
/* …except where a code chip is the SUB-line of a row that is itself 12.5: a 14 px mono value inside
   a 12.5 px sentence is louder than the sentence it belongs to */
.glass .drs .code,.glass .dws .code,.glass .sw .code{height:22px;font-size:13px;line-height:20px}
.glass .mdl{font-size:15px}
.glass .sw{font-size:15px}
.glass .kdt,.glass .effv{font-size:15px}
.glass .tabs.lg [role=tab] .cnt{font-size:13px}
.glass .stat .val{font-size:24px}
/* ONE KPI number size. The same four-tile strip rendered its headline at four sizes room to room —
   Overview 30, Status › Bar and Migration 24, Kill switch 22 — so clicking Overview → Kill switch
   shrank the number by a third for no reason a reader could see (A1 #5, 2026-09-15). Every
   four-tile strip is 30; the six-cell `.headstrip` keeps its own two-tier shape, which is a
   hierarchy inside one strip rather than the same strip disagreeing with itself. */
.glass .statrow.four .stat .val{font-size:30px}
/* the two lead cells carry the longest labels ("Tokens · chargeable", "Cost") and now need the
   width the bigger type asks for, or the label wraps and the row's numbers stop lining up.
   Bounded by min-width on purpose: the strip's own 1100 and 640 breakpoints are declared EARLIER
   in this file, and a later unconditional rule at the same specificity would beat both. */
@media (min-width:1101px){
  .glass .headstrip{grid-template-columns:minmax(0,1.5fr) minmax(0,1.5fr) repeat(4,minmax(0,1fr))}
}
.glass .kpiv{font-size:30px}
.glass .kpicontext{font-size:15px}
.glass .policycompact .stat .val{font-size:30px}
.glass .door{font-size:15px}
.glass .door .dn small{font-size:13px}
.glass .kmatrix{font-size:15px}
.glass .kmatrix th{font:700 13px var(--w-font);letter-spacing:.06em}

/* the cut / hook composers — sentences, so they sit a step above body copy */
.glass .cutsay{font-size:20px}
.glass .cutsay .menu [role=menuitem]{font-size:15px}
.glass .csdonerow{font-size:20px}
.glass .lfgoverns{font-size:15px}
.glass .hsline,.glass .hsline .cutsay,.glass .hsline .csword{font-size:20px}
.glass .hsline .menu .hkabs{font-size:13px}
.glass .hsdays .tgi{font-size:15px}
.glass .hsabsent .switchrow.mini .srl{font-size:15px}
.glass .hsrow .code.blk{font-size:15px}
.glass .hsid .iedit,.glass .hsid .iedit input{font-size:16px}
.glass .hsreason input{font-size:16px}
.glass .hkdefault,.glass .hkreview p,.glass .hkaudience{font-size:16px}
.glass .hkreview #hkCoverage{font-size:15px}

/* content checks + settings rows */
.glass .dialrow .drl{font-size:16px}
.glass .dialrow .drs{font-size:13px}
.glass .dialrow .eff .lbl{font-size:13px}
.glass .dialrow .inherit{height:26px;font-size:13px}
.glass .cleg .clegline{font-size:13px;height:27px}

/* drawer bodies */
.glass .dwhead2 .dwt b{font-size:20px}
.glass .dwhead2 .dwt .dws{font-size:13px}
.glass .dwhead2 .avatar.lg{width:44px;height:44px;font-size:18px}
.glass .personstats span{font-size:13px;letter-spacing:.06em}
.glass .personstats b{font-size:20px}
.glass .detailtitle{font-size:16px}
.glass .detailtitle small{font-size:13px}
.glass .sessioncard .scmain>b{font-size:15px;min-width:60px}
.glass .sessioncard .scmeta{font-size:13px}
.glass .emptyline{font-size:15px}
.glass .sessiontabs [role=tab]{font-size:15px}
.glass .sessiontabs .cnt{font-size:13px}
.glass .turnhead{font-size:13px;letter-spacing:.06em}
.glass .turnrow{font-size:15px}
.glass .turnrow .turnno{font-size:15px;width:30px;height:26px}
.glass .turnrow .tq,.glass .turnrow .ta{font-size:15px}
.glass .turn .tcall{font-size:15px}
.glass .ptgroup .ptsub{font-size:13px}
.glass .tile .tn{font-size:18px}

/* kit surfaces whose rules live in a nav.css section this wave does not own (overlays · the user
   menu): the floor and the body step reach them from here instead. */
.glass .usermenu .uhead .un b{font-size:16px}
.glass .usermenu .uhead .un span{font-size:13px}
.glass .rolechip{font-size:13px;height:22px;letter-spacing:.06em}
.glass .vtabs [role=tab]{font-size:15px;height:38px}
.glass .vtabs .vline{height:38px}
.glass .bellpanel .bph b{font-size:16px}
.glass .bellpanel .bph .gbtn2{height:30px;font-size:15px}
.glass .bnrow .bnt{font-size:15px}
.glass .bnrow .bns{font-size:15px}
.glass .bnrow .bnw{font-size:13px}
.glass .tst .tt{font-size:16px}
.glass .tst .ts{font-size:15px}
.glass .tst .ta .gbtn2{height:32px;font-size:15px}
.glass .keysheet .kst{font-size:20px}
.glass .keysheet .ksg{font-size:13px;letter-spacing:.1em}
.glass .keysheet .ksr{font-size:15px}
.glass .kbd.khint{height:21px;font-size:13px}
.glass .sepl{font-size:13px;letter-spacing:.1em}
.glass .podface .podv{font-size:24px}

/* ══ the LOCKED type scale (2026-09-15) ══
   THIRD STEP, the same afternoon (Sam: "lets make the fonts even a tad bigger, specifically inside
   of pages seems small at times"): {12 · 13 · 15 · 16 · 18 · 20 · 24 · 30} — body 15, secondary 13,
   the sidebar caption 12; 20 · 24 · 30 did not move (Astra's ruling: a title and a KPI were already
   prominent). Every size below was re-cut in place by role across the kit layers and this file;
   the numbers in the older comments are the scale they were written against.
   The first LOCKED cut: {11.5 · 12.5 · 14 · 15 · 16 · 20 · 24 · 30}, 11.5 the sidebar's group caption alone.
   Sam's second pass left 15 distinct painted sizes on the 23 routes and 16 in the open states
   (A1 #11/#16/#29, A2's open-state census): 13, 13.5, 14.5, 15.5, 18, 19 and 22 have no place on
   the scale, and a half-pixel difference between two toggles on the same Harness row reads as a
   mistake rather than as hierarchy. The rules below pin the remaining offenders. Each one lives in
   a kit part (console.css · parts/data.css · parts/forms.css · parts/charts.css) or earlier in
   this file, so it is restated here, last, at equal-or-higher specificity — `.widgetpreview` keeps
   the widget's own scale (RULES §11) because every rule in that block is one class deeper. */
/* → 14: body-weight text that was 13 or 13.5 */
.glass .facet .fl,.glass .dfoot,.glass .dpage,.glass .dcount,.glass .tree,.glass .tgi,.glass .chip.big,
.glass .logs2 .l2r,.glass .logs2 .l2ts,.glass .logs2 .l2body,.glass .logs2 .l2empty,
.glass .traces .trn,.glass .traces .trd,.glass .agroup .hcr .hcv,.glass .statlist .slv small,
.glass .dbulk .gbtn2,.glass .dbulk .dbn small,.glass .cprog b,.glass .status,
.glass .step,.glass .step .sc,.glass .ticker,.glass .chip,.glass .igroup .addon,.glass .igroup .gbtn2,
.glass .field .flab,.glass .field .fhint,.glass .field .ferr,.glass .fcol .flab,.glass .fcol .fhint,.glass .fcol .ferr,
.glass .switchrow .srs,.glass .dial .dcap,.glass .range .rval,.glass .kvrow .kve,
.glass .toast .ts,.glass .tl .ts,.glass .feed .fs,.glass .popwrap .pop .pd,.glass .popwrap .pop .prow,
.glass .hovercard .hr,.glass .hovercard .hd,.glass .ctip .tr,.glass .cspans .spnm,.glass .cradial .rrow,
.glass .cfoot .cfs,.glass .kpi .kf,.glass .kpi .ks,.glass .tfoot,.glass .rcard .rs,.glass .palette .pitem,
.glass .palette .pempty,.glass .acc .abody,.glass .sheet .sb,.glass .confirm .cd2,
.glass .facet,.glass .pager button,.glass .cmodel,.glass .pendingbar .pbn,.glass .chb .hbv,
.glass .chartcard .ch .cs,.glass .vtabs [role=tab],.glass .pchip,.glass .amount .uwrap span{font-size:15px}
/* → 12.5: the secondary line under a value, and chart furniture (axis · legend · in-chart values) */
.glass .chart .axis text.big,.glass .clegend button,.glass .cleg button,.glass .cleg button b,
.glass .dtable tr.dgrp .dgn,.glass .ctip .tv,.glass .ctree .tmn{font-size:13px}
/* → 15: a row's own name, a panel's own name, an editable value */
.glass .switchrow .srl,.glass .iedit,.glass .iedit input,.glass .acc summary,.glass .review .rw,
.glass .rcard .rn,.glass .split .pane .pt,.glass .dash .dpanel .pt,.glass .kpi .kv small,
.glass .toast .tt,.glass .hovercard .hn,.glass .palette .pin input,.glass .holdbtn,
.glass .dialrow .hctl .igroup.block textarea{font-size:16px}
/* → 16 · 20 · 24: headline type that was 15.5 · 18 · 19 */
.glass .empty2 .et2,.glass .empty .et,.glass .chartcard .ch .ct,.glass .avatar.lg{font-size:18px}
.glass .killbanner .kbt,.glass .pform .pfheading .st,.glass .pform .amount input{font-size:20px}
.glass .statlist .slv,.glass .csmall .smv,.glass .chartcard .ch .cstat .mn,.glass .cradial .rnum{font-size:24px}
/* the palette's old (pre-`.cmdk`) shape still ships in the kit; it keeps the floor too.
   `.chip .av` (8.5 px initials in a 16 px disc) is deliberately NOT on this list: it is a glyph in
   a fixed circle, not a word on a surface, and it paints on none of the 23 routes or the open
   states (A2's census). Raising it would break the disc it sits in. */
.glass .palette .pgroup{font-size:13px}
/* Activity's coverage stamp floated between the tab strip and the table at 16 px weight 400 —
   larger than every panel title on the page and than the table it introduces (A1 #16) */
.glass .tabhead .tr .stamp{font:500 15px var(--w-font)}

/* a status word in a KPI value slot takes the slot's size and baseline — Kill switch › ORG CUT read
   "• Off" in a 15 px capsule beside three 30 px numerals (A1 #7, 2026-09-15) */
.glass .statrow .val .status{font:inherit;height:auto;gap:12px;letter-spacing:0}
.glass .statrow .val .status i{width:10px;height:10px}

/* the bell's unread count: the tray's 13 px badge carries an 8.5 px numeral — the one element the
   2026-09-15 census found under the floor on every route. On the console it is a word on a surface:
   a 20 px disc with the 13 px floor. glass.css is generated; this is the override. */
.glass .icobtn.tb .badge{min-width:20px;height:20px;top:-6px;right:-6px;font:700 13px/20px var(--w-font);padding:0 5px}

/* ══ two contrasts the light scheme owed (2026-09-15) ══ */
/* The selected range chip: white on `#1a90ab` measured 3.73:1 at 600 weight — under the 4.5:1 §8
   asks of text, and it is the one control on the page head that says which window you are looking
   at. The darker teal pair measures 4.6:1 at its lightest point. The toggle group carries the SAME
   thumb by the "one selected treatment" rule above, so it takes the same colours or the two drift
   apart again. glass.css is generated; this is the override. */
.glass.light .seg .segthumb,.glass.light .seg.nothumb span.on,
.glass.light .tglgroup:not([data-multi]) .tgthumb{
  background:linear-gradient(160deg,#157f9a,#0e6075);box-shadow:0 2px 8px rgba(15,125,149,.3);border-color:transparent}
.glass.light .seg span.on,.glass.light .tglgroup:not([data-multi]) .tgi.on{color:#fff}

/* ── Knowledge › Context (2026-09-16) ── */
/* the text of an instruction, as the model reads it: prose on a glass sheet — the same surface a
   panel stands on, one step quieter — never a flat grey box (Sam: "all these white boxes") */
.glass .ctxtext{white-space:pre-wrap;overflow-wrap:anywhere;font:400 15px/1.55 var(--w-font);color:var(--w-ink);
  max-height:520px;overflow:auto;padding:14px 16px;border-radius:14px;
  background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.14)}
.glass .ctxtext.wire{max-height:380px;font-size:13px;line-height:1.5;color:var(--w-soft)}
.glass.light .ctxtext{color:#0c2836;background:linear-gradient(160deg,#fff,rgba(255,255,255,.7));border-color:rgba(4,40,56,.12);box-shadow:inset 0 1px 0 #fff}
.glass.light .ctxtext.wire{color:#2a4552}
.glass .ovl.max .ctxgrid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
/* the drawer while the next bundle composes: the last one stays, dimmed */
.glass #dwBody.busy .detailsection,.glass #dwBody.busy .wiremeter{opacity:.55;transition:opacity .2s ease}
/* the session meter: the bundle's estimate against the composer's ceiling — the one bar in the preview */
.glass .wiremeter{display:flex;align-items:center;gap:12px;margin:2px 0 16px;min-height:22px}
.glass .wiremeter .ml{flex:none;font:600 13px var(--w-font);letter-spacing:.08em;text-transform:uppercase;color:var(--w-dim)}
.glass .wiremeter .track{flex:1;height:6px;border-radius:99px;background:rgba(255,255,255,.1);overflow:hidden}
.glass .wiremeter .fill{display:block;height:100%;border-radius:99px;transform-origin:left;background:linear-gradient(90deg,#1E9DB8,#2ec8e8);transition:transform .45s var(--lg-glide)}
.glass .wiremeter .fill.over{background:linear-gradient(90deg,#ff7a8a,#ffb3bc)}
.glass .wiremeter .mv{flex:none;font:600 15px var(--w-font);font-variant-numeric:tabular-nums;color:var(--w-ink)}
.glass.light .wiremeter .track{background:rgba(4,40,56,.1)}
.glass.light .wiremeter .ml{color:#3f5d6c}.glass.light .wiremeter .mv{color:#0c2836}
/* the preview's own picker sits in the drawer head, right of the title */
.glass .dwhead2 .combo{margin-left:auto;flex:0 1 236px;min-width:150px}
/* the editor: one column of fields, every choice row hugging its words, the text tall */
.glass .ctxform{display:flex;flex-direction:column;gap:14px;max-width:820px}
.glass .ctxform .field{align-items:flex-start}
.glass .ctxform .field .igroup{align-self:stretch}
.glass .ctxform .field[hidden]{display:none}
.glass .ctxform .switchrow{align-self:stretch;max-width:520px}
.glass .ctxform .igroup.block textarea{min-height:240px;font-size:15px;line-height:1.55}
.glass .ctxform .igroup.block .brow .gbtn2{height:30px;padding:0 10px;font-size:13px}
.glass .ctxform .cnt.over{color:#ff9aa6}
.glass.light .ctxform .cnt.over{color:#c8384c}
.glass .ctxform .ferr{display:none;font:500 15px var(--w-font);color:#ff9aa6;align-items:center}
.glass.light .ctxform .ferr{color:#c8384c}

/* ── text size (2026-09-16) — ONE knob for the whole console. Every size in the kit is a px on the
   locked eight-step scale, so the console scales as a unit: `zoom` on the root multiplies every
   font, gap and control together and the proportions Sam signed off stay exactly as they are.
   Set by the account menu's Text size row (100 · 112 · 125 %), kept per browser. */
.glass{zoom:var(--ui-zoom,1)}
/* the shell is 100dvh of the zoomed box: at 112 % that is 12 % taller than the window, the account
   block (and the Text size row itself) fell below the fold on a short screen and the sidebar has
   no scroll of its own (audit, 2026-09-16) — the height is divided back by the zoom */
.glass .shell.fill{height:calc(100dvh / var(--ui-zoom,1))}
/* the drawer's first title sits 2 px clear of the sticky header's edge */
.glass .dwbody .dwhead2{padding-top:2px}
/* a scope picker never wraps: the trigger shrinks and its word truncates (Group wrapped to a
   second line and grew the panel head by 51 px — audit 2026-09-16) */
.glass .panel .ph .pr.scopepick,.glass .scopepick{flex-wrap:nowrap}
.glass .scopepick .combo .strig{min-width:0;max-width:100%}
.glass .scopepick .combo .strig .sval{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ==== harness.css ==== */
/* harness.css — Settings › Harness (2026-09-09). Room-level layout on the kit's glass: the harness
   tiles, the scope band, the settings grammar (label + line · control · where the value comes from),
   the picker editor, the section jump, the preview/versions diff. Components come from the kit;
   nothing here restyles one except through its own classes. Motion follows the kit doctrine: one cue
   per state change, entrances ≤ .45 s with `backwards`, exits faster, `--lg-snap` on indicators. */

/* ——— tiles: the list of harnesses (one today) ——— */
.glass .htiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,520px),1fr));gap:12px;min-width:0}
.glass .htile{position:relative;display:grid;grid-template-columns:minmax(180px,1fr) auto;grid-template-rows:auto auto auto;column-gap:22px;row-gap:2px;align-items:center;min-width:0;padding:13px 16px 11px;border-radius:16px;text-align:left;cursor:pointer;color:var(--w-ink);
  background:linear-gradient(160deg,rgba(255,255,255,.1),rgba(255,255,255,.035));border:1px solid rgba(255,255,255,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.22);
  transition:transform .14s ease,border-color .18s ease,background .18s ease,box-shadow .2s ease}
.glass .htile::before{content:"";position:absolute;left:16px;right:16px;top:-1px;height:2px;border-radius:0 0 2px 2px;background:var(--lg-cyan);opacity:0;transform:scaleX(.45);transition:opacity .16s ease,transform .22s var(--lg-snap)}
.glass .htile:hover{transform:translateY(-1px);border-color:rgba(255,255,255,.3)}
.glass .htile:active{transform:scale(.99);transition-duration:.08s}
.glass .htile:focus-visible{outline:2px solid rgba(107,197,214,.78);outline-offset:2px}
.glass .htile.on{border-color:rgba(107,197,214,.5);background:linear-gradient(160deg,rgba(30,157,184,.14),rgba(255,255,255,.04));box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 8px 22px -18px rgba(46,200,232,.7)}
.glass .htile.on::before{opacity:1;transform:scaleX(1)}
.glass .htile .hth{grid-column:1;grid-row:1;display:flex;align-items:center;gap:10px}
/* the LOCKED type scale {11.5 · 12.5 · 14 · 15 · 16 · 20 · 24 · 30} reaches this room too
   (RULES §2, 2026-09-15): 18 · 19 · 15.5 · 14.5 · 13.5 · 13 are off it, and this room carried the
   worst of them — three sizes in one control row, Basic/Advanced at 13, Org/Group/User at 13.5 and
   "Find a setting" at 14, all on the same y (A1 #11). */
.glass .htile .htn{grid-column:1;grid-row:2;font:600 20px var(--font);letter-spacing:-.01em;line-height:1.2}
.glass .htile .htsub{grid-column:1;grid-row:3;font:500 15px var(--w-font);color:var(--w-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.glass .htile .htstats{grid-column:2;grid-row:1 / span 3;display:grid;grid-template-columns:repeat(4,auto);gap:22px;align-self:center}
.glass .htile .htstats span{display:flex;flex-direction:column;gap:2px;min-width:0;text-align:right}
/* 24, not 30: these four are INLINE header stats on a tile, not a four-tile KPI strip — the strip's
   number is 30 everywhere (app.css `.statrow.four .stat .val`, A1 #5) */
.glass .htile .htstats b{font:700 24px/1.1 var(--font);letter-spacing:-.01em;font-variant-numeric:tabular-nums;color:var(--w-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.glass .htile .htstats b.flash{animation:hflash .9s var(--lg-out)}
@keyframes hflash{0%{color:var(--lg-lime);text-shadow:0 0 12px rgba(217,255,122,.55)}100%{color:var(--w-ink);text-shadow:none}}
.glass .htile .htstats small{font:500 13px var(--w-font);color:var(--w-dim);white-space:nowrap}
.glass .htile .htfoot{grid-column:1 / -1;font:500 15px var(--w-font);color:var(--w-soft);margin-top:6px;padding-top:8px;border-top:1px solid rgba(255,255,255,.1)}
.glass .htile .hdot{display:inline-flex;align-items:center;gap:6px;font:600 15px var(--w-font);color:var(--w-soft)}
.glass .htile .hdot i{width:7px;height:7px;border-radius:50%;background:var(--w-green);box-shadow:0 0 8px rgba(95,227,161,.7)}
@media (max-width:760px){.glass .htile{grid-template-columns:minmax(0,1fr)}.glass .htile .htstats{grid-column:1;grid-row:4;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:8px}.glass .htile .htstats span{text-align:left}}
.glass.light .htile{color:#0c2836;background:linear-gradient(160deg,#fff,rgba(255,255,255,.78));border-color:rgba(4,40,56,.13);box-shadow:inset 0 1px 0 #fff,0 3px 12px rgba(23,48,62,.06)}
.glass.light .htile.on{border-color:rgba(15,125,149,.42);background:linear-gradient(160deg,rgba(15,125,149,.08),#fff)}
.glass.light .htile .htfoot{border-top-color:rgba(4,40,56,.1)}
.glass.light .htile .htstats b{color:#0c2836}

/* ——— the scope band: who is being edited, how much is shown ——— */
.glass .hstick{position:sticky;top:0;z-index:6;display:flex;flex-direction:column;gap:6px;min-width:0}
.glass .hband{display:flex;align-items:center;justify-content:space-between;gap:10px 14px;flex-wrap:wrap;min-width:0;padding:8px 10px 8px 12px;border-radius:14px;
  background:linear-gradient(160deg,rgba(9,36,50,.9),rgba(6,28,40,.86));border:1px solid rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 10px 26px -18px rgba(2,16,26,.7);
  -webkit-backdrop-filter:blur(14px) saturate(1.4);backdrop-filter:blur(14px) saturate(1.4);transition:border-color .24s ease,background .24s ease}
.glass .hband.person{border-color:rgba(217,255,122,.38);background:linear-gradient(160deg,rgba(40,70,38,.82),rgba(9,36,50,.88))}
.glass .hband.group{border-color:rgba(167,149,199,.45);background:linear-gradient(160deg,rgba(52,42,80,.8),rgba(9,36,50,.88))}
.glass .hband .hbl,.glass .hband .hbr{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0}
.glass .hband .hbr{margin-left:auto}
/* a wrapped band wraps on purpose: the second row starts at the left edge, never after a hole */
.glass .hband.person .hbr,.glass .hband.group .hbr{flex:1 1 100%;margin-left:0;justify-content:flex-start}
@media (max-width:1280px){.glass .hband .hbr{flex:1 1 100%;margin-left:0;justify-content:flex-start}}
.glass .hband .hkeys[hidden]{display:inline-flex;visibility:hidden}
.glass .hband .tglgroup.fit{width:auto;display:inline-flex}
.glass .hband .tglgroup .tgi{padding:2px 13px;min-height:32px;font-size:15px}
.glass .hband .tglgroup{padding:2px}
.glass .hband .hwho .strig{height:36px;min-height:36px}
.glass .hband .hkeys.on{background:rgba(107,197,214,.16);border-color:rgba(107,197,214,.45)}
.glass .hband .hkeys[hidden]{display:none}
.glass .hband .hwho{width:236px;max-width:100%}
.glass .hband .hwho[hidden]{display:none}
.glass .hoid{display:inline-flex;align-items:center;gap:8px;min-width:0}
.glass .hoid[hidden]{display:none}
.glass .hoid .iedit{font:600 15px ui-monospace,Menlo,Consolas,monospace}
.glass .hoid .iedit input{width:320px;max-width:100%;font:600 15px ui-monospace,Menlo,Consolas,monospace}
.glass .hwhoword{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.glass .hfind{display:inline-flex;align-items:center;gap:7px;height:36px;padding:0 8px 0 10px;border-radius:10px;min-width:0;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);transition:border-color .18s ease,box-shadow .18s ease}
.glass .hfind:focus-within{border-color:rgba(107,197,214,.7);box-shadow:0 0 0 3px rgba(107,197,214,.16)}
.glass .hfind svg{width:15px;height:15px;stroke:var(--w-dim);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.glass .hfind input{width:140px;min-width:0;background:transparent;border:0;outline:none;color:var(--w-ink);font:500 15px var(--w-font)}
.glass .hfind input::placeholder{color:var(--w-dim)}
.glass .hfind .hfindx{display:grid;place-items:center;width:22px;height:22px;border:0;border-radius:99px;background:rgba(255,255,255,.1);cursor:pointer;color:var(--w-ink)}
.glass .hfind .hfindx[hidden]{display:none}
.glass .hfind .hfindx svg{width:11px;height:11px;stroke:currentColor}
.glass .hband .gbtn2 svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.85;stroke-linecap:round;stroke-linejoin:round}
.glass.light .hband{background:linear-gradient(160deg,rgba(255,255,255,.96),rgba(244,248,251,.92));border-color:rgba(4,40,56,.14);box-shadow:inset 0 1px 0 #fff,0 10px 26px -18px rgba(23,48,62,.3)}
.glass.light .hband.person{border-color:rgba(122,168,34,.5);background:linear-gradient(160deg,rgba(236,247,214,.96),rgba(255,255,255,.95))}
.glass.light .hband.group{border-color:rgba(120,100,170,.5);background:linear-gradient(160deg,rgba(236,231,247,.96),rgba(255,255,255,.95))}
.glass.light .hfind{background:rgba(4,40,56,.05);border-color:rgba(4,40,56,.14)}
.glass.light .hfind input{color:#0c2836}
.glass.light .hfind .hfindx{background:rgba(4,40,56,.08);color:#0c2836}

/* the search glyph inside every picker this room draws — sized here, the kit's own icon carries a class */
.glass .hroom .pickin>svg,.glass .hroom .hfind>svg{width:18px;height:18px;flex:none;stroke:var(--w-dim);fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}

/* ——— the section jump (Advanced): plain words, a moving line ——— */
.glass .hjump{min-width:0;overflow-x:auto;scrollbar-width:none;animation:cellin .3s var(--lg-spring) backwards}
.glass .hjump::-webkit-scrollbar{display:none}
.glass .hjump[hidden]{display:none}
.glass .hjumpin{position:relative;display:flex;width:100%;box-sizing:border-box;gap:2px;padding:2px 4px 6px;border-radius:10px;
  background:linear-gradient(160deg,rgba(9,36,50,.82),rgba(6,28,40,.8));border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.glass .hjumpin button{position:relative;border:0;background:transparent;cursor:pointer;padding:8px 12px;border-radius:8px;color:var(--w-dim);font:600 15px var(--w-font);white-space:nowrap;transition:color .16s ease,background .16s ease}
.glass .hjumpin button:hover{color:var(--w-ink);background:rgba(255,255,255,.06)}
.glass .hjumpin button.on{color:var(--w-ink)}
.glass .hjumpin button[hidden]{display:none}
.glass .hjumpin button:focus-visible{outline:2px solid rgba(107,197,214,.75);outline-offset:1px}
.glass .hjline{position:absolute;bottom:3px;height:2px;border-radius:2px;background:var(--lg-cyan);transition:left .26s var(--lg-snap),width .26s var(--lg-snap)}
.glass.light .hjumpin{background:linear-gradient(160deg,rgba(255,255,255,.95),rgba(244,248,251,.9));border-color:rgba(4,40,56,.12)}
.glass.light .hjumpin button{color:#3f5d6c}.glass.light .hjumpin button:hover,.glass.light .hjumpin button.on{color:#0c2836}
.glass.light .hjline{background:#1E9DB8}

/* ——— the body and its grid ——— */
.glass .hbody{min-width:0;padding-bottom:72px}   /* the pending bar floats over the last row otherwise (review 2026-09-10) */
.glass .hbody.hswap .hgrid{animation:hswap .28s var(--lg-out) backwards}
.glass .hbody.nobody .hrow .hc,.glass .hbody.nobody .hrow .hreset{opacity:.45;pointer-events:none}
@keyframes hswap{from{opacity:.25;transform:translateY(4px)}to{opacity:1;transform:none}}
.glass .hgrid{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;min-width:0}
.glass .hgrid.adv{grid-template-columns:minmax(0,1fr);align-items:start}
.glass .hgrid .hsec.wide{grid-column:1 / -1}
.glass .hgrid:not(.adv){grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}
.glass .hgrid:not(.adv) .hsec:not([data-sec="models"]):not([data-sec="tools"]) .hrow{grid-template-columns:minmax(0,1.4fr) minmax(160px,1fr)}
.glass .hgrid:not(.adv) .hsec[data-sec="models"],.glass .hgrid:not(.adv) .hsec[data-sec="tools"]{grid-column:1 / -1}
@media (max-width:1100px){.glass .hgrid:not(.adv){grid-template-columns:minmax(0,1fr)}}
.glass .hsec[hidden]{display:none}
.glass .hsec .ph{align-items:baseline}
.glass .hsec .hblurb{font-size:15px}
.glass .hsec .hsecn{font-size:15px;color:var(--lg-cyan)}
.glass .hsec .hsecn:empty{display:none}
.glass .hrows{display:flex;flex-direction:column;min-width:0;container-type:inline-size}
.glass .hempty{padding:28px;text-align:center;font:600 18px var(--font);color:var(--w-dim)}

/* ——— one setting: label + line · control · source ——— */
.glass .hrow{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(216px,58%);grid-template-rows:auto auto;gap:4px 16px;align-items:center;padding:12px 10px;border-radius:12px;min-width:0;
  border:1px solid transparent;transition:background .16s ease,border-color .16s ease}
.glass .hrow .hl{grid-column:1;grid-row:1 / span 2}
.glass .hrow .hc{grid-column:2;grid-row:1;justify-content:flex-start}
.glass .hrow .hc>*{max-width:100%;min-width:0}
.glass .hrow .hs{grid-column:2;grid-row:2;justify-content:flex-start}
.glass .hrow+.hrow{border-top-color:rgba(255,255,255,.07)}
.glass .hrow:hover{background:rgba(255,255,255,.035)}
.glass .hrow[hidden]{display:none}
.glass .hrow.tall,.glass .hrow.models{grid-template-columns:minmax(0,1fr) minmax(216px,58%);grid-template-rows:auto auto}
.glass .hrow.tall .hl,.glass .hrow.models .hl{grid-column:1;grid-row:1}
.glass .hrow.tall .hs,.glass .hrow.models .hs{grid-column:2;grid-row:1;justify-content:flex-start}
.glass .hrow.tall .hc,.glass .hrow.models .hc{grid-column:1 / -1;grid-row:2;justify-content:flex-start;margin-top:6px}
.glass .hrow.draft{background:linear-gradient(90deg,rgba(217,255,122,.06),transparent 60%)}
.glass .hrow.draft::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:2px;border-radius:2px;background:var(--lg-lime);animation:cellin .26s var(--lg-spring) backwards}
.glass .hrow.own .hstate{color:var(--lg-lime)}
.glass .hrow.orgonly .hc{opacity:.5;pointer-events:none}
.glass .hrow.nudge{animation:nudge .5s ease}
.glass .hrow .hl{display:flex;flex-direction:column;gap:2px;min-width:0}
.glass .hrow .hlab{font:600 16px var(--w-font);color:var(--w-ink)}
.glass .hrow .hdesc{font:400 15px/1.45 var(--w-font);color:var(--w-soft)}
.glass .hrow .hnote{font:400 13px/1.4 var(--w-font);color:var(--w-dim);font-style:italic}
.glass .hrow .hkey{font:500 13px ui-monospace,Menlo,Consolas,monospace;color:var(--w-dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* the version gate: a key the reference added after the fleet's build — quiet, always visible, one line */
.glass .hrow .hsince{display:inline-flex;align-items:center;gap:5px;align-self:flex-start;margin-top:2px;padding:3px 9px;border-radius:99px;font:600 13px var(--w-font);color:var(--w-soft);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);white-space:nowrap}
.glass .hrow .hsince::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--w-amber);opacity:.8}
.glass .hrow .hsince.hot::before{background:var(--w-green)}
.glass .hrow .hsinces{display:flex;flex-wrap:wrap;gap:4px 6px;margin-top:2px}
.glass .hrow .hsinces .hsince{margin-top:0}
.glass.light .hrow .hsince{color:#3f5d6c;background:rgba(4,40,56,.05);border-color:rgba(4,40,56,.12)}
.glass .hrow .hc{display:flex;align-items:center;justify-content:flex-start;gap:8px;min-width:0}
.glass .hrow .hs{display:flex;align-items:center;justify-content:flex-start;gap:6px;min-width:0}
.glass .hrow .hstate{font:600 15px var(--w-font);color:var(--w-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant-numeric:tabular-nums;transition:color .2s ease}
.glass .hrow .hstate.landed{animation:hland .5s var(--lg-pop)}
@keyframes hland{0%{transform:translateY(3px);opacity:.4}60%{transform:translateY(-1px)}100%{transform:none;opacity:1}}
.glass .hrow .hreset{width:26px;height:26px;flex:none}
.glass .hrow .hreset[hidden]{display:none}
.glass .hrow .hreset svg{width:14px;height:14px;transition:transform .3s var(--lg-snap)}
.glass .hrow .hreset:hover svg{transform:rotate(-70deg)}
.glass .hrow .hwarn,.glass .hrow .hbad{grid-column:1 / -1;grid-row:3;display:flex;align-items:flex-start;gap:7px;padding:8px 10px;border-radius:9px;font:500 15px/1.45 var(--w-font);animation:cellin .26s var(--lg-spring) backwards}
.glass .hrow .hwarn{color:var(--w-amber);background:rgba(242,193,78,.08);border:1px solid rgba(242,193,78,.2)}
.glass .hrow .hwarn svg{width:15px;height:15px;flex:none;margin-top:1px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.glass .hrow .hbad{color:#ff9aa6;background:rgba(255,122,138,.08);border:1px solid rgba(255,122,138,.25)}
.glass .hrow .hwarn[hidden],.glass .hrow .hbad[hidden]{display:none}
.glass.light .hrow+.hrow{border-top-color:rgba(4,40,56,.08)}
.glass.light .hrow:hover{background:rgba(4,40,56,.03)}
.glass.light .hrow .hlab{color:#0c2836}
.glass.light .hrow.own .hstate{color:#5c8a12}
.glass.light .hrow.draft{background:linear-gradient(90deg,rgba(122,168,34,.09),transparent 60%)}
.glass.light .hrow.draft::before{background:#7aa822}
.glass.light .hrow .hwarn{color:#8a5a00;background:rgba(242,193,78,.14);border-color:rgba(200,140,0,.3)}
.glass.light .hrow .hbad{color:#b0293c;background:rgba(200,56,76,.08);border-color:rgba(200,56,76,.25)}
@container (max-width:430px){.glass .hrow,.glass .hrow.tall,.glass .hrow.models{grid-template-columns:minmax(0,1fr)}.glass .hrow .hl,.glass .hrow .hc,.glass .hrow .hs{grid-column:1;grid-row:auto}.glass .hrow .hc,.glass .hrow .hs{justify-content:flex-start}}
/* the wire path is Advanced's business; Basic reads as a settings page, not a schema */
.glass .hrow .hkey{display:none}
.glass .hbody.showkeys .hgrid.adv .hrow .hkey{display:block}

/* controls inside a row */
.glass .hrow .tgl.unset{opacity:.55;background:rgba(255,255,255,.08);border-style:dashed}
.glass .hrow .seg.unset .segthumb{opacity:0}
.glass .hrow .seg.unset span{color:var(--w-dim)}
.glass .hrow .select{min-width:170px}
.glass .hrow .iedit{display:inline-flex;align-items:center;gap:6px;max-width:100%;min-width:0;font:500 15px var(--w-font)}
.glass .hrow .iedit .iv{display:block;min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.glass .hrow .iedit .ipen,.glass .hmrow .iedit .ipen{opacity:.45}
.glass .hrow .iedit:hover .ipen,.glass .hmrow .iedit:hover .ipen{opacity:1}
.glass .hrow .iedit.ph .iv{color:var(--w-dim)}
.glass .hrow .iedit input{width:276px;max-width:100%}
.glass .hrow .hswatch{width:18px;height:18px;border-radius:5px;border:1px solid rgba(255,255,255,.35);flex:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.3)}
.glass .hrow .igroup.block{width:100%;min-width:0}
.glass .hrow .igroup.block textarea{width:100%;min-height:82px;resize:vertical;background:transparent;border:0;outline:none;color:var(--w-ink);font:500 16px/1.45 var(--w-font)}
.glass .hrow .igroup.block textarea::placeholder{color:var(--w-dim)}
.glass .hrow .igroup.block .cnt{align-self:flex-end;padding:0 10px 6px;font:500 13px var(--w-font);color:var(--w-dim);font-variant-numeric:tabular-nums}
.glass .hrow .stepper.solo .sin{width:98px}
.glass .hrow .hsunit{font-size:15px}
.glass .hrow .taginput{width:100%;min-width:0}
.glass .hrow .hmulti{width:auto;display:inline-flex;flex-wrap:wrap}
.glass .hrow .hmulti .tgi{flex:none;font-size:15px}
.glass .hrow .hset{height:34px;font-size:15px}
.glass .hrow .hc .code{background:transparent;border-color:transparent;padding:0;color:var(--w-soft)}
.glass .hwho .pklist{max-height:238px}
.glass.light .hrow .igroup.block textarea{color:#0c2836}
.glass.light .hrow .hswatch{border-color:rgba(4,40,56,.25)}
.glass.light .hrow .tgl.unset{background:rgba(4,40,56,.08);border-color:rgba(4,40,56,.35);opacity:.8}

/* key → value pairs */
.glass .hpairs{display:flex;flex-direction:column;gap:6px;width:100%;min-width:0}
.glass .hprows{display:flex;flex-direction:column;gap:6px}
.glass .hprows:empty{display:none}
.glass .hprow{display:grid;grid-template-columns:minmax(0,1fr) auto 24px;gap:8px;align-items:center;transition:opacity .18s ease,transform .18s ease}   /* no entrance keyframe: the exit transitions the same two properties (lint) */
.glass .hprow.free{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) 24px}   /* header → value: two text fields */
.glass .hprow.out{opacity:0;transform:translateX(6px)}
.glass .hprow .igroup{min-width:0}
.glass .hprow .igroup input{width:100%;min-width:0;background:transparent;border:0;outline:none;color:var(--w-ink);font:500 15px var(--w-font);padding:6px 8px}
.glass .hprow .hpx{width:26px;height:26px}
.glass .hprow .hpx svg{width:12px;height:12px}
.glass .hpadd{align-self:flex-start;height:34px;font-size:15px}
.glass.light .hprow .igroup input{color:#0c2836}

/* ——— the picker editor ——— */
.glass .hmodels{display:flex;flex-direction:column;gap:8px;width:100%;min-width:0}
.glass .hmlist{display:flex;flex-direction:column;min-width:0}
.glass .hmrow{position:relative;display:grid;grid-template-columns:16px 28px minmax(166px,1fr) 212px 106px 252px 32px;   /* fixed columns: each row is its own grid, so `auto` re-ragged the list per row (review 2026-09-10); each widened with the 2026-09-15 type step */gap:10px;align-items:center;min-width:0;padding:9px 8px;border-radius:10px;
  border-bottom:1px solid rgba(255,255,255,.07);transition:background .16s ease}
/* no `will-change:transform` on a row: it made every row its own stacking context, so the rows BELOW an open
   row menu painted over it and took its clicks (found with a real pointer, 2026-09-10). The reorder's FLIP sets
   an inline transform for .32 s, which is stacking enough; the row whose menu is open rises above its siblings. */
.glass .hmrow:has(.menu.on){z-index:7}
.glass .hmrow:last-child{border-bottom:0}
.glass .hmrow:hover{background:rgba(255,255,255,.04)}
.glass .hmrow.in{animation:cellin .3s var(--lg-spring) backwards}
.glass .hmrow .hmgrip{display:grid;place-items:center;color:var(--w-dim);opacity:.6}
.glass .hmrow .hmgrip svg{width:15px;height:15px;fill:currentColor;stroke:none}
.glass .hmrow .hmno{font:700 15px var(--w-font);color:var(--w-dim);font-variant-numeric:tabular-nums;text-align:right}
.glass .hmrow .mdl{min-width:0}
.glass .hmrow .mdl i{flex:none}
.glass .hmrow .hmlabel{font:600 16px var(--w-font);min-width:0;max-width:100%}
.glass .hmrow .hmlabel input{width:196px;max-width:100%;font:600 16px var(--w-font)}
/* the id and the legend are the row's SECONDARY line — the floor, not the body step */
.glass .hmrow .hmid{background:transparent;border-color:transparent;padding:0;color:var(--w-dim);height:22px;line-height:20px;font-size:13px}
.glass .hmrow .hmleg,.glass .hmrow .hmdef{font-size:13px}
.glass .hmrow .hmdef{color:var(--lg-cyan);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.glass .hmrow .hmdef .hmoff{color:var(--w-amber)}
/* the 1M-context row a model offers (supports1m): a small tag, lime when new sessions start on it */
.glass .hm1m{display:inline-flex;align-items:center;margin-left:6px;padding:1px 8px;border-radius:99px;font:700 13px var(--w-font);letter-spacing:.02em;color:var(--lg-cyan);background:rgba(107,197,214,.12);border:1px solid rgba(107,197,214,.35);white-space:nowrap;vertical-align:middle}
.glass .hmrow .hmdef .hm1m:first-child{margin-left:0}
.glass.light .hm1m{color:#137a94;background:rgba(19,122,148,.08);border-color:rgba(19,122,148,.3)}
.glass .hmrow .hmmenu{width:28px;height:28px;background:transparent;border-color:transparent;box-shadow:none}
.glass .hmrow .hmmenu:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.3)}
.glass .hmrow[hidden]{display:none}
.glass .hmfoot .hmfl{display:inline-flex;align-items:center;gap:10px;min-width:0;flex-wrap:wrap}
.glass .hmmore{height:34px;font-size:15px}
.glass .hmmore[hidden]{display:none}
.glass .combo[aria-disabled=true] .strig{opacity:.55;cursor:default}
.glass .hmrow .hmmenu svg{width:15px;height:15px;fill:currentColor;stroke:none}
.glass .hmrow .menu{left:auto;right:0;min-width:206px}
.glass .hmrow .menu .mhead{padding:7px 11px 4px;font:700 13px var(--w-font);letter-spacing:.08em;text-transform:uppercase;color:var(--w-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.glass .hmrow .menu .msep{height:1px;margin:4px 6px;background:rgba(255,255,255,.1)}
.glass .hmfoot{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;min-width:0;padding-top:4px}
.glass .hmfoot .hsadd{width:236px;max-width:100%}
/* Basic is the handful of things an admin changes: the wire id and the leg are Advanced's columns */
.glass .hgrid:not(.adv) .hmrow{grid-template-columns:16px 28px minmax(166px,1fr) 252px 32px}
.glass .hgrid:not(.adv) .hmrow .hmid,.glass .hgrid:not(.adv) .hmrow .hmleg{display:none}
.glass.light .hmrow{border-bottom-color:rgba(4,40,56,.08)}
.glass.light .hmrow:hover{background:rgba(4,40,56,.03)}
.glass.light .hmrow .hmdef{color:#137a94}
@media (max-width:900px){.glass .hmrow{grid-template-columns:16px 28px minmax(0,1fr) 32px}.glass .hmrow .hmid,.glass .hmrow .hmleg,.glass .hmrow .hmdef{display:none}}

/* ——— preview and versions: the diff ——— */
.glass .hpvlist{display:flex;flex-wrap:wrap;gap:6px 12px;min-width:0}
.glass .hdiff{display:flex;flex-direction:column;min-width:0}
.glass .hdrow{display:grid;grid-template-columns:minmax(136px,1fr) minmax(0,1fr) 15px minmax(0,1fr);gap:8px;align-items:center;padding:9px 4px;border-bottom:1px solid rgba(255,255,255,.08);font:500 15px var(--w-font);animation:cellin .26s var(--lg-spring) backwards}
.glass .hdrow:last-child{border-bottom:0}
.glass .hdrow .hdk{color:var(--w-ink);font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.glass .hdrow .hdv{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-variant-numeric:tabular-nums}
.glass .hdrow .hdv.from{color:var(--w-dim);text-decoration:line-through;text-decoration-color:rgba(255,255,255,.35)}
.glass .hdrow .hdv.to{color:var(--lg-lime)}
.glass .hdrow .hdarrow{color:var(--w-dim);text-align:center}
.glass.light .hdrow{border-bottom-color:rgba(4,40,56,.08)}
.glass.light .hdrow .hdk{color:#0c2836}
.glass.light .hdrow .hdv.to{color:#5c8a12}
.glass #hsPending{margin-top:0}
.glass .dwsec[hidden]{display:none}

@media (prefers-reduced-motion:reduce){
  .glass .htile,.glass .htile::before,.glass .hband,.glass .hjline,.glass .hrow,.glass .hrow .hreset svg,.glass .hmrow,.glass .hprow{transition:none}
  .glass .hbody.hswap .hgrid,.glass .hjump,.glass .hrow.draft::before,.glass .hrow .hstate.landed,.glass .hrow .hwarn,.glass .hrow .hbad,.glass .hrow.nudge,.glass .hmrow.in,.glass .hdrow,.glass .htile .htstats b.flash{animation:none}
}

