/* Pairs OS (2026-10-14). Loaded always; every rule is namespaced (.os-, .pn-)
   and only does anything when js/pairsos.js renders, behind SQFlags.pairsOS.
   Built on the console's own tokens, so every theme and light mode apply.
   Ported from superq-internal/pairs-v2-2026-10-14 (os.css + network.css). */
.pn-sr,.pn-live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}
/* The console styles bare <nav> as its top bar; Pairs OS's tab strips are navs too. */
.pn-os-host nav{position:static;top:auto;display:flex;height:auto;grid-template-columns:none;background:none;border:0;backdrop-filter:none;-webkit-backdrop-filter:none;z-index:auto;}
@media (prefers-reduced-motion:reduce){ .os *{transition:none !important;animation:none !important;} }
/* Demo controls (fixture mode only; not part of the design) */
.pn-ctl{position:fixed;right:16px;bottom:16px;z-index:90;font:400 12.5px/1.4 ui-sans-serif,system-ui,sans-serif;color:#e8e6ea;}
.pn-ctl-btn{background:#1d1b20;color:#e8e6ea;border:1px solid #3a3740;border-radius:8px;padding:8px 12px;font:600 12px ui-sans-serif,system-ui;cursor:pointer;}
.pn-ctl-panel{position:absolute;right:0;bottom:44px;width:300px;background:#161419;border:1px solid #3a3740;border-radius:10px;padding:12px 14px;box-shadow:0 18px 50px rgba(0,0,0,.5);}
.pn-ctl-h{margin:0 0 8px;font-weight:700;font-size:13px;}
.pn-ctl-h small{display:block;font-weight:400;color:#a29daa;font-size:11.5px;}
.pn-ctl fieldset{border:1px solid #2e2b33;border-radius:8px;margin:0 0 10px;padding:8px 10px 10px;}
.pn-ctl legend{padding:0 4px;color:#c9a46e;font-weight:600;font-size:11.5px;}
.pn-ctl label{display:block;margin:6px 0 0;color:#cbc6d1;}
.pn-ctl select{display:block;width:100%;margin-top:3px;background:#0e0d10;color:#eee;border:1px solid #3a3740;border-radius:6px;padding:5px 6px;font:inherit;}
.pn-ctl-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px;}
.pn-ctl-row button{background:#24212a;color:#eee;border:1px solid #3a3740;border-radius:6px;padding:5px 8px;font:inherit;cursor:pointer;}

/* Pairs OS (SPEC-os.md). Namespaced os-; shell + controls from network.css.
   Accent rule: plum = needs you / primary. Everything else is ink. */
.os [hidden],.os-pal-wrap[hidden],.os-tray[hidden],.os-card[hidden],.os-scrim[hidden],.os-pane[hidden]{display:none !important;}
:root{--bar:64px;--os-ease:cubic-bezier(.22,1,.36,1);--pn-ease:cubic-bezier(.22,1,.36,1);}
.os-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}
.os-k{display:flex;align-items:center;gap:7px;margin:0 0 10px;font:600 11.5px/1.3 var(--disp);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);}
.os-p{margin:0;font:400 15px/1.6 var(--sans);color:var(--ink-soft);}
.os-soft{margin:12px 0 0;font-size:13px;line-height:1.5;color:var(--ink-faint);}
.os-link{all:unset;cursor:pointer;color:var(--plum-bright);font-weight:600;text-decoration:underline;text-underline-offset:3px;}
.os-flag,.os-flagbox{margin:12px 0 0;padding:9px 12px;border:1px dashed rgba(210,149,74,.55);border-radius:10px;font:500 12.5px/1.5 var(--sans);color:var(--ink-soft);}
.os-flag::before{content:"Open decision \00b7 ";font-weight:700;color:var(--amber-bright);}
[data-theme="light"] .os-flag::before{color:#80501E;}
.os-ico{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;}

/* avatars */
.os-av{width:44px;height:44px;border-radius:50%;flex:none;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;position:relative;
  font:700 13.5px var(--disp);color:var(--ink);background:var(--elev);border:1.6px solid var(--line-hard);transition:transform .2s var(--os-ease),border-color .2s,box-shadow .2s;}
.os-av.sm{width:34px;height:34px;font-size:11.5px;}
.os-av.xs{width:22px;height:22px;font-size:8.5px;border-width:1.2px;}
.os-av.lg{width:66px;height:66px;font-size:18px;}
.os-av.me{background:linear-gradient(135deg,var(--plum),#6b2c58);color:#fff;border-color:var(--plum-bright);}
.os-av.needs{border:2px solid var(--plum-bright);}
.os-av.needs::after{content:"";position:absolute;right:-3px;top:-3px;width:11px;height:11px;border-radius:50%;background:var(--plum-bright);border:2px solid var(--bg);}
.os-av.sm.needs::after{width:9px;height:9px;}
.os-av.xs.needs::after{width:7px;height:7px;right:-2px;top:-2px;border-width:1.5px;}

/* ============================================================ bar */
.os-bar{position:sticky;top:0;z-index:40;height:var(--bar);box-sizing:border-box;display:flex;align-items:center;gap:16px;padding:0 clamp(16px,2.4vw,36px);
  border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--bg) 86%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);}
.os-bar-l{display:flex;align-items:center;gap:14px;flex:none;}
.os-bar-t{font:700 19px var(--disp);letter-spacing:-.02em;}
.os-need{display:inline-flex;align-items:center;gap:8px;cursor:pointer;border:1px solid var(--line);background:none;color:var(--ink-soft);border-radius:999px;padding:7px 12px 7px 11px;font:600 13px var(--disp);}
.os-need svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.os-need-dot{width:8px;height:8px;border-radius:50%;background:var(--ink-faint);}
.os-need.on{color:var(--ink);border-color:rgba(184,96,145,.55);background:rgba(162,78,129,.12);}
.os-need.on .os-need-dot{background:var(--plum-bright);box-shadow:0 0 10px rgba(184,96,145,.8);}
.os-cmd{flex:1;max-width:460px;display:flex;align-items:center;gap:10px;cursor:pointer;border:1px solid var(--line);background:var(--field);color:var(--ink-faint);border-radius:12px;padding:9px 12px;font:500 14px var(--sans);text-align:left;}
.os-cmd:hover{border-color:var(--line-hard);color:var(--ink-soft);}
.os-cmd svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;flex:none;}
.os-cmd span{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.os kbd,.os-pal-wrap kbd{font:600 11px var(--disp);color:var(--ink-faint);border:1px solid var(--line);border-radius:6px;padding:2px 6px;background:var(--glass);}
.os-tabs{display:flex;align-items:center;gap:4px;margin-left:auto;min-width:0;overflow-x:auto;scrollbar-width:none;}
.os-tabs::-webkit-scrollbar{display:none;}
.os-tab{display:inline-flex;align-items:center;gap:2px;border-radius:10px;border:1px solid transparent;color:var(--ink-soft);font:600 13px var(--disp);text-decoration:none;white-space:nowrap;flex:none;}
a.os-tab,.os-tab > a{display:inline-flex;align-items:center;gap:7px;padding:7px 10px;color:inherit;text-decoration:none;}
.os-tab.on{background:var(--glass-2);border-color:var(--line);color:var(--ink);}
.os-tab:hover{color:var(--ink);}
.os-tab-x{all:unset;cursor:pointer;display:inline-flex;padding:6px 7px 6px 2px;color:var(--ink-faint);}
.os-tab-x:hover{color:var(--ink);}
.os-tab-x svg,.os-x svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;}

/* tray */
.os-tray{position:fixed;z-index:60;top:calc(var(--bar) + 8px);left:calc(var(--side) + 20px);width:min(520px,calc(100vw - 32px));max-height:min(70vh,560px);overflow-y:auto;
  padding:16px;border:1px solid var(--line-hard);border-radius:16px;background:var(--elev);box-shadow:0 24px 70px rgba(0,0,0,.55);animation:osDrop .18s var(--os-ease);}
[data-theme="light"] .os-tray{box-shadow:0 24px 60px rgba(80,60,92,.25);}
.os-calm{margin:4px 0;color:var(--ink-soft);}
@keyframes osDrop{from{opacity:0;transform:translateY(-6px);}to{opacity:1;transform:none;}}

/* command bar */
.os-pal-wrap{position:fixed;inset:0;z-index:80;background:rgba(4,3,7,.5);backdrop-filter:blur(3px);display:flex;justify-content:center;align-items:flex-start;padding-top:12vh;}
[data-theme="light"] .os-pal-wrap{background:rgba(58,44,66,.28);}
.os-pal{width:min(620px,calc(100vw - 24px));border:1px solid var(--line-hard);border-radius:18px;background:var(--elev);box-shadow:0 30px 90px rgba(0,0,0,.6);overflow:hidden;animation:osDrop .18s var(--os-ease);}
.os-pal-in{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid var(--line);}
.os-pal-in svg{width:18px;height:18px;fill:none;stroke:var(--ink-faint);stroke-width:1.8;stroke-linecap:round;flex:none;}
.os-pal-in input{flex:1;border:0;background:none;outline:none;color:var(--ink);font:500 17px var(--sans);}
.os-pal-l{list-style:none;margin:0;padding:8px;max-height:min(52vh,420px);overflow-y:auto;}
.os-pal-l li{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;cursor:pointer;}
.os-pal-l li span{display:flex;flex-direction:column;min-width:0;}
.os-pal-l li b{font:600 14.5px var(--disp);}
.os-pal-l li small{font-size:12.5px;color:var(--ink-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.os-pal-l li.on{background:rgba(162,78,129,.16);}
.os-pal-none{color:var(--ink-soft);cursor:default !important;}
.os-pal-h{margin:0;padding:10px 18px;border-top:1px solid var(--line);font-size:12px;color:var(--ink-faint);display:flex;gap:6px;align-items:center;}

/* ============================================================ home */
.os-stage{position:relative;}
.os-page{max-width:1500px;margin:0 auto;padding:28px clamp(16px,2.4vw,40px) 96px;}
.os-h{font:700 13px var(--disp);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);margin:0 0 12px;outline:none;}
.os-h2{font:700 19px var(--disp);letter-spacing:-.015em;margin:0;}
.os-sec-h{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin:0 0 14px;}
.os-note{margin:0;font-size:12.5px;color:var(--ink-faint);}

/* queue items (next action, tray) */
.os-q{list-style:none;margin:0;padding:0;}
.os-qi{position:relative;display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:16px;padding:16px 18px 16px 20px;}
.os-qi::before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:3px;border-radius:0 3px 3px 0;background:var(--plum-bright);}
.os-qi.hl{background:var(--field);}
.os-qs{margin:0;font:500 16px/1.4 var(--sans);color:var(--ink);}
.os-qs b{font-weight:700;}
.os-qsub{margin:4px 0 0;font:400 14px/1.5 var(--sans);color:var(--ink-soft);}
.os-qsub.needs{margin-top:1px;color:var(--plum-bright);font:600 12.5px var(--sans);}
.os-age{margin-left:10px;font:500 12.5px var(--sans);color:var(--ink-faint);white-space:nowrap;}
.os-qa{display:flex;gap:8px;justify-content:flex-end;}
.os-qa .primary,.os-qa .quiet,.os-acts .primary,.os-acts .quiet,.os-row-a .primary,.os-row-a .quiet{white-space:nowrap;text-decoration:none;display:inline-flex;align-items:center;}
.os-qi.busy .primary{opacity:.7;cursor:progress;}
.os-qi.done{background:linear-gradient(90deg,rgba(162,78,129,.12),rgba(162,78,129,0) 60%);}
.os-qi.done::before{background:var(--ink-faint);}
.os-qi.done .os-qs::before{content:"";display:inline-block;width:16px;height:16px;margin:0 8px -2px 0;border-radius:50%;
  background:var(--plum) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.3l2.2 2.2 4.8-5' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat;}
.os-q.compact .os-qi{grid-template-columns:34px minmax(0,1fr) auto;padding:10px 4px 10px 14px;gap:12px;}
.os-q.compact .os-qi .os-av{width:34px;height:34px;font-size:11.5px;}
.os-q.compact .os-qs{font-size:14.5px;}
.os-q.compact .os-qi::before{top:12px;bottom:12px;}
.os-q.compact .os-qi + .os-qi{border-top:1px solid var(--line);}

.os-next-grid{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(360px,1fr);gap:20px;align-items:stretch;}
.os-q.hero{display:flex;flex-direction:column;justify-content:center;}
.os-q.hero{border:1px solid rgba(162,78,129,.4);border-radius:18px;background:linear-gradient(135deg,rgba(162,78,129,.16),rgba(162,78,129,.02) 70%);overflow:hidden;}
.os-q.hero .os-qi{padding:22px 24px 22px 26px;}
.os-q.hero .os-qs{font-size:17px;}
.os-next-more{border:1px solid var(--line);border-radius:18px;padding:14px 16px 6px;}
.os-next-more .os-link{display:inline-block;margin:6px 0 8px 14px;font-size:13px;}
.os-next-main{border:1px solid var(--line);border-radius:18px;padding:20px 24px;}
.os-next-main.skel{display:grid;gap:10px;}
.os-next-main.skel i,.os-row-skel{display:block;height:14px;border-radius:7px;background:var(--glass-2);}
.os-next-main.skel i:last-child{width:50%;}

.os-split{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(360px,1fr);gap:20px;margin-top:28px;align-items:start;}

/* the network */
.os-net{border:1px solid var(--line);border-radius:22px;padding:20px 20px 14px;background:linear-gradient(160deg,rgba(255,255,255,.035),rgba(255,255,255,0) 50%),rgba(255,255,255,.012);}
[data-theme="light"] .os-net{background:var(--elev);}
.os-field{position:relative;aspect-ratio:1000/790;width:100%;}
.os-net-skel{position:absolute;inset:12% 18%;border-radius:50%;border:1px dashed var(--line-hard);}
.os-net-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;}
.os-g0{stop-color:var(--plum);stop-opacity:.15;}
.os-g1{stop-color:var(--plum);stop-opacity:0;}
[data-theme="light"] .os-g0{stop-opacity:.08;}
.os-orbit{fill:none;stroke:var(--line-hard);stroke-dasharray:2 7;vector-effect:non-scaling-stroke;}
.os-arc{fill:none;stroke:var(--line-hard);stroke-width:2;stroke-linecap:round;vector-effect:non-scaling-stroke;}
.os-arc.hot{stroke:var(--plum-bright);opacity:.75;}
.os-link-l{fill:none;stroke-width:1.6;vector-effect:non-scaling-stroke;transition:opacity .2s,stroke-width .2s;}
.os-link-l.st-none{opacity:0;}
.os-link-l.st-agree{stroke:rgba(var(--ink-rgb),.42);stroke-dasharray:4 6;}
.os-link-l.st-both{stroke:rgba(var(--ink-rgb),.5);stroke-dasharray:10 5;}
.os-link-l.st-read,.os-link-l.st-deeper{stroke:rgba(var(--ink-rgb),.48);}
.os-link-l.st-deeper{stroke-width:2.4;}
.os-link-l.needs{stroke:var(--plum-bright);opacity:1;}
.os-link-l.hl{stroke-width:3;opacity:1 !important;}
.os-link-l.st-none.hl{stroke:var(--line-hard);stroke-dasharray:2 5;}
.os-me{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:6px;pointer-events:none;}
.os-me .os-av{box-shadow:0 0 0 9px rgba(162,78,129,.12),0 0 46px rgba(162,78,129,.5);}
.os-me b{font:600 13px var(--disp);color:var(--ink-soft);}
.os-sl{position:absolute;transform:translate(-50%,-50%);text-align:center;width:136px;pointer-events:none;}
.os-sl.s-r{transform:translate(0,-50%);text-align:left;width:auto;max-width:150px;}
.os-sl.s-l{transform:translate(-100%,-50%);text-align:right;width:auto;max-width:150px;}
.os-sl b{display:block;font:700 13px var(--disp);color:var(--ink);}
.os-sl b span{color:var(--ink-faint);font-weight:600;margin-left:3px;}
.os-sl small{display:block;font-size:11.5px;color:var(--ink-faint);margin-top:2px;white-space:nowrap;}
.os-sl.hot b{color:var(--plum-bright);}
.os-more{pointer-events:auto;all:unset;cursor:pointer;display:inline-block;margin-top:4px;font:600 12px var(--disp);color:var(--plum-bright);text-decoration:underline;text-underline-offset:3px;}
.os-sl .os-more{pointer-events:auto;}
.os-node{position:absolute;display:flex;align-items:center;gap:8px;color:inherit;text-decoration:none;border-radius:999px;padding:3px;transition:opacity .2s;z-index:2;}
/* the avatar's centre sits exactly on the seat; the name hangs off it, inward */
.os-node.in-r{transform:translate(-25px,-50%);}
.os-node.in-l{flex-direction:row-reverse;text-align:right;transform:translate(calc(-100% + 25px),-50%);}
.os-node.in-b{flex-direction:column;text-align:center;gap:4px;transform:translate(-50%,-25px);}
.os-node.in-t{flex-direction:column-reverse;text-align:center;gap:4px;transform:translate(-50%,calc(-100% + 25px));}
.os-node-t{padding:1px 6px;border-radius:7px;background:color-mix(in srgb,var(--elev) 78%,transparent);}
.os-node-t b{font-size:13px;}
.os-node-t{display:flex;flex-direction:column;line-height:1.25;white-space:nowrap;}
.os-node-t b{font:600 13.5px var(--disp);}
.os-node-t small{font:500 11.5px var(--sans);color:var(--ink-faint);}
.os-node.needs .os-node-t small{color:var(--plum-bright);font-weight:700;}
.os-node.st-none .os-av{border-style:dashed;color:var(--ink-soft);}
.os-node.st-agree .os-av{border-style:dashed;border-color:rgba(var(--ink-rgb),.55);}
.os-node.st-deeper .os-av{box-shadow:0 0 0 3px var(--bg),0 0 0 4.5px rgba(var(--ink-rgb),.35);}
.os-node.needs .os-av{border-style:solid;border-color:var(--plum-bright);}
.os-node.hl .os-av{transform:scale(1.1);}
.os-node.rec,.os-link-l.rec{opacity:.32;}
.os-node.arrived .os-av{animation:osArrive 1.2s ease;}
@keyframes osArrive{0%,40%{box-shadow:0 0 0 6px rgba(184,96,145,.35);}100%{box-shadow:none;}}
.os-node:focus-visible{outline:2px solid var(--plum-bright);outline-offset:3px;}
.os-card{position:fixed;z-index:70;max-width:260px;padding:12px 14px;border-radius:12px;border:1px solid var(--line-hard);background:var(--elev);box-shadow:0 16px 40px rgba(0,0,0,.45);pointer-events:none;}
.os-card b{display:block;font:600 14px var(--disp);}
.os-card small{display:block;font-size:12px;color:var(--ink-faint);}
.os-card p{margin:6px 0 0;font-size:13px;line-height:1.45;color:var(--ink-soft);}

/* your people */
.os-people{border:1px solid var(--line);border-radius:22px;padding:20px 18px 10px;background:rgba(255,255,255,.012);}
[data-theme="light"] .os-people{background:var(--elev);}
.os-search{display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:12px;padding:0 12px;background:var(--field);}
.os-search:focus-within{border-color:var(--plum);}
.os-search svg{width:16px;height:16px;fill:none;stroke:var(--ink-faint);stroke-width:1.8;stroke-linecap:round;flex:none;}
.os-search input{flex:1;min-width:0;border:0;background:none;outline:none;color:var(--ink);font:500 14px var(--sans);padding:11px 0;}
.os-filters{display:flex;align-items:center;gap:10px;margin:10px 0 8px;}
.os-sel select{appearance:none;-webkit-appearance:none;border:1px solid var(--line);border-radius:10px;background:var(--glass) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%238A7F93' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") right 10px center/14px no-repeat;
  color:var(--ink);font:600 13px var(--disp);padding:8px 32px 8px 12px;cursor:pointer;}
.os-filter-n{margin-left:auto;font:600 12.5px var(--disp);color:var(--plum-bright);}
.os-rows{list-style:none;margin:0;padding:0;}
.os-row{display:flex;align-items:center;gap:10px;border-top:1px solid var(--line);}
.os-row:first-child{border-top:0;}
.os-row-main{flex:1;min-width:0;display:flex;align-items:center;gap:12px;padding:11px 6px;border-radius:10px;color:inherit;text-decoration:none;}
.os-row.hl .os-row-main,.os-row-main:hover{background:var(--field);}
.os-row-t{display:flex;flex-direction:column;min-width:0;line-height:1.3;}
.os-row-t b{font:600 14.5px var(--disp);}
.os-row-t small{font-size:12.5px;line-height:1.4;color:var(--ink-faint);}
.os-row.needs .os-row-t small{color:var(--plum-bright);font-weight:600;}
.os-row-a{flex:none;}
.os-row-skel{margin:14px 6px;}
.os-nohit{padding:14px 6px;color:var(--ink-soft);font-size:14px;}
.os-empty{max-width:640px;margin:40px 0;padding:32px;border:1px dashed var(--line-hard);border-radius:18px;}
.os-empty h1{font:700 24px var(--disp);margin:0 0 8px;}
.os-empty p{margin:0;color:var(--ink-soft);line-height:1.6;}
.os-fine{margin:48px auto 0;max-width:620px;text-align:center;font-size:12px;line-height:1.55;color:var(--ink-faint);}

/* ============================================================ pane */
.os-scrim{position:fixed;z-index:30;top:var(--bar);left:var(--side);right:0;bottom:0;background:rgba(4,3,7,.42);opacity:0;transition:opacity .28s ease;}
.os-scrim.in{opacity:1;}
[data-theme="light"] .os-scrim{background:rgba(58,44,66,.18);}
.os-pane{position:fixed;z-index:35;top:var(--bar);right:0;bottom:0;width:min(760px,60vw);display:flex;flex-direction:column;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,0) 30%),var(--elev);border-left:1px solid var(--line-hard);border-radius:18px 0 0 0;
  box-shadow:-30px 0 90px -20px rgba(0,0,0,.7);transform:translateX(104%);transition:transform .34s var(--os-ease);}
[data-theme="light"] .os-pane{box-shadow:-30px 0 80px -20px rgba(80,60,92,.3);}
.os-pane.in{transform:none;}
.os-ph{padding:20px 26px 0;border-bottom:1px solid var(--line);flex:none;}
.os-ph-who{display:flex;align-items:center;gap:14px;}
.os-ph-who > .os-av + .os-av{margin-left:-24px;}
.os-ph-who > div{flex:1;min-width:0;}
.os-ph-t{font:700 24px/1.15 var(--disp);letter-spacing:-.025em;margin:0;outline:none;}
.os-ph-s{margin:3px 0 0;font-size:13.5px;color:var(--ink-soft);}
.os-ph-s .needs{color:var(--plum-bright);font-weight:600;}
.os-x{all:unset;cursor:pointer;width:36px;height:36px;border-radius:50%;border:1px solid var(--line);display:inline-flex;align-items:center;justify-content:center;color:var(--ink-soft);flex:none;}
.os-x:hover{color:var(--ink);border-color:var(--line-hard);}
.os-x svg{width:15px;height:15px;}
.os-ptabs{display:flex;flex-wrap:wrap;gap:2px;margin-top:16px;}
/* live app: prototype and "Proposed" notes never show to real users */
.pn-realdata .os-proposed,.pn-realdata .os-flag-inline,.pn-realdata .os-flagbox{display:none!important;}
.os-ptabs::-webkit-scrollbar{display:none;}
.os-ptab{position:relative;padding:10px 12px 12px;color:var(--ink-soft);text-decoration:none;font:600 13.5px var(--disp);white-space:nowrap;border-bottom:2px solid transparent;margin-bottom:-1px;}
.os-ptab:hover{color:var(--ink);}
.os-ptab.on{color:var(--ink);border-bottom-color:var(--plum-bright);}
.os-ptab.dim{color:var(--ink-faint);}
.os-ptab-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--plum-bright);margin-left:6px;vertical-align:2px;}
.os-pbody{flex:1;min-height:0;overflow-y:auto;padding:22px 26px 48px;overscroll-behavior:contain;}
.os-sec + .os-sec{margin-top:26px;padding-top:22px;border-top:1px solid var(--line);}
.os-h3{font:700 20px var(--disp);letter-spacing:-.02em;margin:0 0 8px;}
.os-resolving{display:flex;align-items:center;gap:10px;color:var(--ink-soft);font-size:14px;}
.os-spin{width:14px;height:14px;border-radius:50%;border:2px solid var(--line-hard);border-top-color:var(--plum-bright);animation:osSpin .8s linear infinite;}
@keyframes osSpin{to{transform:rotate(360deg);}}
.os-notice{margin:0 0 18px;padding:12px 14px;border-radius:12px;border:1px solid var(--line-hard);background:var(--glass-2);font:500 14px/1.5 var(--sans);}
.os-nextbox{padding:16px 18px;border-radius:14px;border:1px solid rgba(162,78,129,.4);background:linear-gradient(135deg,rgba(162,78,129,.14),rgba(162,78,129,.02) 70%);}
.os-acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;}
.os-steps{list-style:none;margin:0;padding:0;display:grid;gap:12px;}
.os-steps li{display:grid;grid-template-columns:24px 1fr;gap:12px;align-items:start;}
.os-steps b{display:block;font:600 14.5px var(--disp);}
.os-steps small{display:block;font-size:13px;color:var(--ink-soft);margin-top:2px;}
.os-stepn{width:22px;height:22px;border-radius:50%;border:1.5px solid var(--line-hard);display:inline-flex;align-items:center;justify-content:center;font:700 11px var(--disp);color:#fff;box-sizing:border-box;}
.os-steps li.done .os-stepn{background:var(--plum);border-color:var(--plum);}
.os-places{list-style:none;margin:0;padding:0;}
.os-places a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 4px;border-top:1px solid var(--line);color:inherit;text-decoration:none;}
.os-places li:first-child a{border-top:0;}
.os-places a:hover{background:var(--field);}
.os-pl-n{font:600 15px var(--disp);}
.os-cls{display:inline-flex;align-items:center;gap:7px;font:600 13px var(--disp);color:var(--ink-soft);}
.os-gl{width:16px;height:16px;flex:none;}
.os-gl.w{width:22px;}
.g-ring{fill:var(--elev);stroke:var(--ink);stroke-width:1.6;}
.g-core{fill:var(--ink);}
.g-a{fill:#C97AA6;}
.g-b{fill:#E0AE72;}
[data-theme="light"] .g-a{fill:#8E3F6C;}
[data-theme="light"] .g-b{fill:#946124;}
.g-open{fill:none;stroke:var(--ink-soft);stroke-width:1.5;stroke-dasharray:2.4 3;}
.os-move{margin:0;font:600 17px/1.5 var(--disp);letter-spacing:-.01em;}
.os-banner{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:0 0 20px;padding:14px 16px;border-radius:12px;border:1px solid rgba(210,149,74,.45);background:rgba(210,149,74,.08);font-size:14px;line-height:1.5;color:var(--ink-soft);}
.os-banner b{color:var(--ink);}
.os-headline{font:700 24px/1.2 var(--disp);letter-spacing:-.025em;margin:0 0 16px;}
.os-read{list-style:none;margin:0;padding:0;}
.os-read li{padding:14px 0;border-top:1px solid var(--line);}
.os-read-h{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.os-read p{margin:6px 0 0;font:400 15px/1.55 var(--sans);color:var(--ink);}
.os-two{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:20px;padding-top:18px;border-top:1px solid var(--line);}
.os-line{display:grid;grid-template-columns:1fr auto;gap:4px 12px;align-items:center;padding:12px 14px;border:1px solid var(--line);border-radius:12px;}
.os-line + .os-line{margin-top:8px;}
.os-line small{grid-column:1;font:600 11.5px var(--disp);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);}
.os-line p{grid-column:1;margin:0;font:italic 400 15px/1.5 var(--sans);}
.os-line button{grid-column:2;grid-row:1 / span 2;}
.os-rituals{margin:0;padding-left:18px;font-size:15px;line-height:1.8;}
.os-coach{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;gap:3px;width:100%;padding:16px 18px;border:1px solid var(--line);border-radius:14px;background:var(--glass);}
.os-coach:hover{border-color:var(--plum);}
.os-coach .os-k{margin:0;color:var(--plum-bright);}
.os-coach b{font:600 15.5px var(--disp);}
.os-coach small{font-size:13px;color:var(--ink-soft);}
.os-locked{padding:20px;border:1px dashed var(--line-hard);border-radius:14px;}
.os-locked h3{font:700 17px var(--disp);margin:0 0 6px;}
.os-locked p{margin:0 0 12px;color:var(--ink-soft);line-height:1.55;font-size:14.5px;}
.os-outs{display:grid;gap:12px;margin-bottom:14px;}
.os-out{padding:16px 18px;border:1px solid var(--line);border-radius:14px;}
.os-out.shared{border-color:rgba(162,78,129,.35);}
.os-out h3{font:700 17px var(--disp);margin:0 0 6px;}
.os-pr{padding:9px 0;border-top:1px solid var(--line);}
.os-pr b{font:600 13.5px var(--disp);}
.os-pr p{margin:3px 0 0;font-size:14px;line-height:1.5;color:var(--ink-soft);}
.os-progress{height:6px;border-radius:999px;background:var(--glass-2);overflow:hidden;margin-bottom:14px;}
.os-progress span{display:block;height:100%;background:linear-gradient(90deg,var(--plum),var(--plum-bright));transition:width .3s var(--os-ease);}
.os-clauses{margin:0;padding-left:20px;display:grid;gap:12px;}
.os-clauses li{padding-left:4px;}
.os-clauses p{margin:0 0 8px;font:500 15px/1.5 var(--sans);}
.os-seg{display:inline-flex;border:1px solid var(--line);border-radius:999px;padding:3px;gap:2px;}
.os-seg button{all:unset;cursor:pointer;padding:5px 12px;border-radius:999px;font:600 12.5px var(--disp);color:var(--ink-soft);}
.os-seg button.on{background:rgba(162,78,129,.2);color:var(--ink);}
.os-seg button:focus-visible{outline:2px solid var(--plum-bright);}
.os-sigs{display:flex;flex-wrap:wrap;align-items:center;gap:12px 26px;}
.os-sigs div{display:flex;flex-direction:column;}
.os-sigs span{font-size:12.5px;color:var(--ink-faint);}
.os-sigs b{font:600 15px var(--disp);}
.os-sigs .primary{margin-left:auto;}
.os .primary[disabled]{opacity:.45;cursor:default;transform:none;box-shadow:none;}
.os-kv{display:flex;justify-content:space-between;gap:12px;padding:7px 0;font-size:14px;color:var(--ink-soft);}
.os-kv b{font:600 14px var(--disp);color:var(--ink);}
.os-stop{border:1px solid rgba(192,57,43,.45) !important;border-radius:14px;padding:16px !important;}
.os-hist{list-style:none;margin:14px 0 0;padding:0;}
.os-hist li{display:flex;justify-content:space-between;gap:12px;padding:11px 2px;border-top:1px solid var(--line);font-size:14px;}
.os-hist li b{font:600 14px var(--disp);}
.os-hist li span{color:var(--ink-faint);}
.os-hist li.fresh b::after{content:" \00b7 new";color:var(--plum-bright);font-weight:600;}
.os-toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);z-index:95;background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:999px;font:600 13px var(--disp);}

/* focus */
.os-need:focus-visible,.os-cmd:focus-visible,.os-tab a:focus-visible,a.os-tab:focus-visible,.os-tab-x:focus-visible,.os-x:focus-visible,.os-ptab:focus-visible,.os-row-main:focus-visible,
.os-link:focus-visible,.os-more:focus-visible,.os-places a:focus-visible,.os-coach:focus-visible,.os-sel select:focus-visible{outline:2px solid var(--plum-bright);outline-offset:2px;}
.os-qa .primary:focus-visible,.os-qa .quiet:focus-visible{outline:2px solid var(--plum-bright);outline-offset:3px;}

/* ======================================================= responsive */
@media (max-width:1365px){ .os-pane{width:min(720px,64vw);} }
@media (max-width:1180px){
  .os-split{grid-template-columns:minmax(0,1fr);}
  .os-next-grid{grid-template-columns:minmax(0,1fr);}
}
@media (max-width:1023px){
  .os-pane{width:min(720px,88vw);}
  .os-scrim{left:0;}
  .os-tray{left:16px;}
}
@media (max-width:767px){
  :root{--bar:56px;}
  .os-bar{gap:10px;padding:0 12px;}
  .os-bar-t{display:none;}
  .os-cmd span,.os-cmd kbd{display:none;}
  .os-cmd{flex:none;padding:9px;}
  .os-need{padding:6px 10px;}
  .os-tabs .os-tab > a{padding:6px 8px;}
  .os-page{padding:18px 14px 110px;}
  .os-qi{grid-template-columns:40px minmax(0,1fr);gap:10px 14px;}
  .os-qa{grid-column:2;justify-content:flex-start;flex-wrap:wrap;}
  .os-q.compact .os-qi{grid-template-columns:34px minmax(0,1fr);}
  /* phone: avatars and stage labels only; names live in the list below */
  .os-node-t{display:none;}
  .os-field{aspect-ratio:1000/1150;}
  .os-sl small{display:none;}
  .os-sl b{white-space:nowrap;}
  .os-node .os-av.needs::after{width:7px;height:7px;right:-2px;top:-2px;border-width:1.5px;}
  .os-node .os-av{width:30px !important;height:30px !important;font-size:10px !important;}
  .os-node.in-b{transform:translate(-50%,-15px) !important;} .os-node.in-t{transform:translate(-50%,calc(-100% + 15px)) !important;}
  .os-node.in-r{transform:translate(-15px,-50%) !important;} .os-node.in-l{transform:translate(calc(-100% + 15px),-50%) !important;}
  .os-sl{max-width:84px !important;} .os-sl b{font-size:11.5px;} .os-more{display:none;}
  .os-node .os-av{width:36px;height:36px;font-size:11.5px;}
  .os-node.in-r{transform:translate(-18px,-50%);} .os-node.in-l{transform:translate(calc(-100% + 18px),-50%);} .os-node.in-b{transform:translate(-50%,-18px);} .os-node.in-t{transform:translate(-50%,calc(-100% + 18px));}
  .os-sl{width:96px;}
  .os-sl small{display:none;}
  .os-sl b{white-space:nowrap;}
  .os-node .os-av.needs::after{width:7px;height:7px;right:-2px;top:-2px;border-width:1.5px;}
  .os-me .os-av{width:52px;height:52px;font-size:15px;}
  .os-pane{width:100vw;border-radius:0;border-left:0;}
  .os-ph{padding:14px 16px 0;}
  .os-ph-t{font-size:20px;}
  .os-pbody{padding:18px 16px 110px;}
  .os-two{grid-template-columns:1fr;}
  .os-row-a{display:none;}
  .pn-ctl{bottom:84px;}
}
@media (prefers-reduced-motion:reduce){ .os *{transition:none !important;animation:none !important;} }
html.pn-reduce .os *{transition:none !important;animation:none !important;}

/* ================================================= dashboard (round 4) */
.os-dash{max-width:1560px;}
.os-dh{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin:2px 0 18px;}
.os-dh-t{font:700 30px/1.1 var(--disp);letter-spacing:-.03em;margin:0;outline:none;}
.os-dh-s{margin:6px 0 0;font:500 14.5px var(--sans);color:var(--ink-soft);}
.os-dh-s b{color:var(--plum-bright);font-weight:700;}
.os-dh-d{margin:0;font:600 13px var(--disp);color:var(--ink-faint);letter-spacing:.02em;}

/* cards */
.os-card2{border:1px solid var(--line);border-radius:18px;padding:18px 20px;background:linear-gradient(160deg,rgba(255,255,255,.035),rgba(255,255,255,0) 55%),rgba(255,255,255,.012);min-width:0;}
[data-theme="light"] .os-card2{background:var(--elev);}
.os-ch{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 12px;min-height:30px;}
.os-ct{font:700 16px var(--disp);letter-spacing:-.01em;margin:0;}
.os-cc{min-width:22px;height:22px;padding:0 7px;box-sizing:border-box;border-radius:999px;background:var(--plum);color:#fff;font:700 12px/22px var(--disp);text-align:center;}
.os-cc:empty{display:none;}
.os-cc.soft{background:none;color:var(--ink-faint);font-weight:600;min-width:0;padding:0;}
.os-chint{margin-left:auto;font-size:12px;color:var(--ink-faint);}
.os-skel3{display:grid;gap:12px;padding:6px 0;}
.os-skel3 i{display:block;height:13px;border-radius:7px;background:var(--glass-2);}
.os-skel3 i:nth-child(2){width:75%;} .os-skel3 i:nth-child(3){width:55%;}
.os-empty2{margin:4px 0;font-size:13.5px;line-height:1.5;color:var(--ink-faint);}
.os-calm2{padding:10px 2px;}
.os-fine2{margin:12px 0 0;font-size:12px;color:var(--ink-faint);display:flex;flex-wrap:wrap;gap:6px;align-items:center;}
.os-flag-inline{font:700 10.5px var(--disp);letter-spacing:.06em;text-transform:uppercase;color:var(--amber-bright);border:1px dashed rgba(210,149,74,.6);border-radius:999px;padding:2px 7px;}
[data-theme="light"] .os-flag-inline{color:#80501E;}

/* stage tiles */
.os-tiles{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;}
.os-tile{all:unset;box-sizing:border-box;cursor:pointer;display:grid;grid-template-columns:1fr auto;grid-template-areas:'n v' 'm m' 's s';align-items:baseline;gap:2px 8px;padding:14px 16px 14px;border:1px solid var(--line);border-radius:16px;
  background:linear-gradient(160deg,rgba(255,255,255,.035),rgba(255,255,255,0) 60%),rgba(255,255,255,.012);transition:border-color .16s,background .16s,transform .16s var(--os-ease);min-width:0;}
[data-theme="light"] .os-tile{background:var(--elev);}
.os-tile:hover{border-color:var(--line-hard);transform:translateY(-1px);}
.os-tile-n{grid-area:n;font:600 13px var(--disp);color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.os-tile-v{grid-area:v;font:700 30px/1 var(--disp);letter-spacing:-.03em;color:var(--ink);}
.os-tile-m{grid-area:m;font-size:11.5px;color:var(--ink-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.os-stack{grid-area:s;display:flex;align-items:center;margin-top:10px;min-height:22px;}
.os-stack .os-av + .os-av{margin-left:-6px;}
.os-stack .os-av{box-shadow:0 0 0 2px var(--elev);}
.os-stack i{font:600 11px var(--disp);color:var(--ink-faint);margin-left:6px;font-style:normal;}
.os-tile.hot .os-tile-n{color:var(--plum-bright);}
.os-tile.t-needs{border-color:rgba(162,78,129,.4);background:linear-gradient(135deg,rgba(162,78,129,.18),rgba(162,78,129,.03) 70%);}
.os-tile.t-needs .os-tile-v{color:var(--plum-bright);}
.os-tile.on{border-color:var(--plum);box-shadow:inset 0 -3px 0 var(--plum-bright);}
.os-tile:focus-visible{outline:2px solid var(--plum-bright);outline-offset:3px;}

/* rows */
.os-row2{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(340px,1fr);gap:16px;margin-top:16px;align-items:start;}
.os-col{display:grid;gap:16px;min-width:0;}
.os-row3{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(340px,1fr);gap:16px;margin-top:16px;align-items:stretch;}
.os-row3 .os-net{display:flex;flex-direction:column;justify-content:center;}
.os-col{align-content:start;}
.os-tablecard{margin-top:16px;}

/* needs list */
.os-q.list .os-qi{padding:14px 6px 14px 18px;border-top:1px solid var(--line);}
.os-q.list .os-qi:first-child{border-top:0;}
.os-q.list .os-qi::before{top:14px;bottom:14px;}
.os-needs .os-qs{font-size:15.5px;}

/* coming up timeline */
.os-tl{list-style:none;margin:0;padding:0 0 0 4px;position:relative;}
.os-tl::before{content:"";position:absolute;left:8px;top:8px;bottom:8px;width:2px;background:var(--line-hard);}
.os-tl li{position:relative;padding-left:26px;}
.os-tl-dot{position:absolute;left:0;top:12px;width:12px;height:12px;box-sizing:border-box;border-radius:50%;background:var(--bg);border:2px solid var(--ink-faint);}
.os-tl li.due .os-tl-dot{background:var(--plum-bright);border-color:var(--plum-bright);box-shadow:0 0 10px rgba(184,96,145,.7);}
.os-tl a{display:flex;flex-direction:column;padding:7px 8px;border-radius:10px;color:inherit;text-decoration:none;}
.os-tl a:hover,.os-tl a.hl{background:var(--field);}
.os-tl b{font:600 14px var(--disp);}
.os-tl small{font-size:12.5px;color:var(--ink-faint);}
.os-tl li.due small{color:var(--plum-bright);font-weight:600;}

/* in progress */
.os-prog{list-style:none;margin:0;padding:0;}
.os-prog a{display:flex;align-items:center;gap:12px;padding:8px 6px;border-radius:10px;color:inherit;text-decoration:none;}
.os-prog a:hover,.os-prog a.hl{background:var(--field);}
.os-prog a > span:not(.os-av){display:flex;flex-direction:column;min-width:0;flex:1;}
.os-prog b{font:600 14px var(--disp);}
.os-prog small{font-size:12.5px;color:var(--ink-faint);}
.os-bar2{display:block;height:4px;border-radius:999px;background:var(--glass-2);margin-top:6px;overflow:hidden;}
.os-bar2 i{display:block;height:100%;background:linear-gradient(90deg,var(--plum),var(--plum-bright));}

/* activity feed */
.os-feed{list-style:none;margin:0;padding:0;}
.os-feed a{display:grid;grid-template-columns:22px minmax(0,1fr) auto;align-items:center;gap:10px;padding:9px 6px;border-top:1px solid var(--line);color:inherit;text-decoration:none;font-size:13.5px;}
.os-feed li:first-child a{border-top:0;}
.os-feed a:hover,.os-feed a.hl{background:var(--field);}
.os-feed time{font-size:12px;color:var(--ink-faint);white-space:nowrap;}
.os-feed li.fresh span::after{content:" \00b7 new";color:var(--plum-bright);font-weight:600;}

/* network inside the dashboard */
.os-row3 .os-net{padding:18px 20px 10px;}

/* people table */
.os-tablecard .os-ch .os-search{margin-left:auto;width:min(320px,100%);}
.os-tbl{width:100%;border-collapse:collapse;}
.os-tbl th,.os-tbl td{text-align:left;vertical-align:middle;}
.os-tbl thead th{font:600 11px var(--disp);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);padding:6px 10px 10px;border-bottom:1px solid var(--line);}
.os-tbl tbody th,.os-tbl tbody td{padding:4px 10px;border-bottom:1px solid var(--line);font-weight:inherit;}
.os-tbl tbody tr:last-child th,.os-tbl tbody tr:last-child td{border-bottom:0;}
.os-tr.hl,.os-tr:hover{background:var(--field);}
.os-tbl .os-row-main{padding:8px 0;}
.os-td-s{font-size:14px;color:var(--ink-soft);line-height:1.45;}
.os-tr.needs .os-td-s{color:var(--plum-bright);font-weight:600;}
.os-td-a{text-align:right;white-space:nowrap;}
.os-td-a .primary,.os-td-a .quiet{text-decoration:none;display:inline-flex;}
.os-stagepill{display:inline-block;white-space:nowrap;font:600 12px var(--disp);padding:4px 10px;border-radius:999px;border:1px solid var(--line);color:var(--ink-soft);}
.os-stagepill.st-none{border-style:dashed;}
.os-stagepill.st-agree{border-style:dashed;border-color:rgba(var(--ink-rgb),.45);}
.os-stagepill.st-deeper{background:var(--glass-2);}
.os-tr.needs .os-stagepill{border-color:rgba(184,96,145,.55);color:var(--plum-bright);}

/* agreement dates */
.os-dates{display:flex;flex-wrap:wrap;gap:12px 28px;margin-top:14px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;}
.os-dates div{display:flex;flex-direction:column;}
.os-dates span{font-size:12px;color:var(--ink-faint);}
.os-dates b{font:600 14.5px var(--disp);}

/* responsive */
@media (max-width:1400px){ .os-tiles{grid-template-columns:repeat(3,minmax(0,1fr));} }
@media (max-width:1180px){ .os-row2,.os-row3{grid-template-columns:minmax(0,1fr);} }
@media (max-width:767px){
  .os-dh{flex-direction:column;align-items:flex-start;gap:4px;}
  .os-dh-t{font-size:26px;}
  .os-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
  .os-tile{padding:12px 12px;}
  .os-tile-v{font-size:24px;}
  .os-card2{padding:16px 14px;border-radius:16px;}
  .os-chint{margin-left:0;flex-basis:100%;}
  .os-tablecard .os-ch .os-search{margin-left:0;width:100%;}
  .os-tbl thead{display:none;}
  .os-tbl tbody tr{display:grid;grid-template-columns:minmax(0,1fr) auto;padding:6px 0;border-bottom:1px solid var(--line);}
  .os-tbl tbody th,.os-tbl tbody td{border:0;padding:2px 6px;}
  .os-tbl tbody th{grid-column:1 / -1;}
  .os-tbl .os-td-s{grid-column:1 / -1;padding-left:52px;font-size:13px;}
  .os-tbl tbody td:nth-child(2){padding-left:52px;}
  .os-td-a{display:none;}
}

/* ===================================== round 5: full capability (checklist) */
.os-proposed{display:flex;gap:8px;align-items:baseline;margin:12px 0 0;padding:9px 12px;border:1px dashed rgba(210,149,74,.55);border-radius:10px;font:500 12.5px/1.5 var(--sans);color:var(--ink-soft);}
.os-proposed b{flex:none;font:700 10.5px var(--disp);letter-spacing:.08em;text-transform:uppercase;color:var(--amber-bright);}
[data-theme="light"] .os-proposed b{color:#80501E;}

/* five-place strip */
.os-strip{display:inline-flex;align-items:center;gap:6px;}
.os-sp{display:inline-flex;align-items:center;}
.os-sp .os-gl{width:15px;height:15px;}
.os-sp .os-gl.w{width:20px;}
.os-strip.big{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;width:100%;}
.os-strip.big .os-sp{flex-direction:column;gap:4px;padding:8px 2px;border:1px solid var(--line);border-radius:10px;}
.os-strip.big .os-sp small{font:600 10.5px var(--disp);color:var(--ink-soft);}
.os-strip-none{font-size:12px;color:var(--ink-faint);white-space:nowrap;}
.os-td-p{white-space:nowrap;}

/* header right + focus chip + since */
.os-dh-r{display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:flex-end;}
.os-fchip{display:inline-flex;align-items:center;gap:8px;padding:5px 6px 5px 6px;border:1px solid rgba(184,96,145,.55);border-radius:999px;background:rgba(162,78,129,.14);font:500 13px var(--sans);}
.os-fchip b{font-weight:700;}
.os-fchip button{all:unset;cursor:pointer;display:inline-flex;padding:4px;border-radius:50%;color:var(--ink-soft);}
.os-fchip button svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;}
.os-fchip button:focus-visible{outline:2px solid var(--plum-bright);}
.os-since{display:flex;align-items:center;gap:10px 14px;flex-wrap:wrap;margin:0 0 14px;padding:12px 16px;border:1px solid var(--line);border-radius:14px;background:var(--glass);}
.os-since-h{margin:0;font:700 13px var(--disp);}
.os-since-h span{font-weight:500;color:var(--ink-faint);margin-left:4px;}
.os-since ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px;flex:1;}
.os-since a{display:inline-flex;align-items:center;gap:7px;padding:5px 11px 5px 5px;border:1px solid var(--line);border-radius:999px;color:var(--ink);text-decoration:none;font:500 13px var(--sans);}
.os-since a.hot{border-color:rgba(184,96,145,.55);background:rgba(162,78,129,.12);}
.os-since a:hover{border-color:var(--line-hard);}
.os-since a:focus-visible,.os-since .os-link:focus-visible{outline:2px solid var(--plum-bright);outline-offset:2px;}
.os-since .os-link{font-size:13px;}

/* tiles: zero + focused stage */
.os-tile.zero .os-tile-v{color:var(--ink-faint);}
.os-stack em{font:500 11.5px var(--sans);color:var(--ink-faint);font-style:normal;}
.os-tile.mine{border-color:var(--plum-bright);box-shadow:0 0 0 3px rgba(184,96,145,.2);}

/* network focus */
.os-netwrap{position:relative;}
.os-node{cursor:pointer;}
.os-node.focused .os-av{transform:scale(1.14);box-shadow:0 0 0 4px var(--bg),0 0 0 6px var(--plum-bright),0 0 24px rgba(184,96,145,.6);}
.os-node.unfocused,.os-link-l.unfocused{opacity:.22;}
.os-focus{position:absolute;top:0;right:0;width:290px;max-width:calc(100% - 12px);box-sizing:border-box;padding:16px;border:1px solid var(--line-hard);border-radius:16px;background:var(--elev);
  box-shadow:0 18px 50px rgba(0,0,0,.5);z-index:5;animation:osDrop .2s var(--os-ease);}
[data-theme="light"] .os-focus{box-shadow:0 18px 44px rgba(80,60,92,.22);}
.os-fc-h{display:flex;align-items:center;gap:10px;}
.os-fc-h > div{flex:1;min-width:0;display:flex;flex-direction:column;}
.os-fc-h b{font:600 15px var(--disp);}
.os-fc-h small{font-size:12.5px;color:var(--ink-faint);}
.os-fc-h .os-x{width:30px;height:30px;}
.os-fc-st{margin:12px 0 0;}
.os-fc-line{margin:6px 0 0;font-size:13.5px;line-height:1.45;color:var(--ink-soft);}
.os-fc-line.needs{color:var(--plum-bright);font-weight:600;}
.os-fc-strip{margin:12px 0 0;}
.os-fc-a{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;}
.os-fc-a .primary,.os-fc-a .quiet{text-decoration:none;display:inline-flex;}
.os-fc-open{display:inline-block;margin-top:12px;font:600 13px var(--disp);color:var(--plum-bright);text-decoration:none;}
.os-fc-open:hover{text-decoration:underline;}
.os-fc-open:focus-visible{outline:2px solid var(--plum-bright);outline-offset:2px;}
.os-card-strip{margin-top:8px;}
.os-card-h{margin:6px 0 0 !important;font-size:11.5px !important;color:var(--ink-faint) !important;}

/* in progress: inline action */
.os-prog li.has-a{display:flex;align-items:center;gap:8px;}
.os-prog li.has-a a{flex:1;min-width:0;}

/* row 4: agreements + go further */
.os-row4{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(340px,1fr);gap:16px;margin-top:16px;align-items:stretch;}
.os-agrcard{margin-top:16px;}
.os-agr{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;}
.os-agr-more{display:inline-block;margin-top:12px;font-size:13px;}
@media (max-width:1400px){ .os-agr{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:767px){ .os-agr{grid-template-columns:1fr;} }
.os-agr li{display:flex;flex-direction:column;padding:14px;border:1px solid var(--line);border-radius:14px;}
.os-agr li.hl{border-color:var(--line-hard);background:var(--field);}
.os-agr-h{display:flex;align-items:center;gap:8px;}
.os-agr-h b{font:600 14px var(--disp);flex:1;}
.os-agr-w{margin:12px 0 0;font:500 14px/1.5 var(--sans);}
.os-agr-w .os-k{display:block;margin:0 0 4px;}
.os-agr-r{margin:8px 0 0;font-size:12.5px;color:var(--ink-faint);}
.os-agr-note{display:flex;align-items:center;gap:6px;margin:8px 0 0;font:600 12.5px var(--sans);color:var(--ink-soft);}
.os-agr-a{display:flex;gap:8px;margin-top:auto;padding-top:12px;}
.os-agr-a a{text-decoration:none;}
.os-go{list-style:none;margin:0;padding:0;}
.os-go li{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:12px;padding:11px 4px;border-top:1px solid var(--line);}
.os-go li:first-child{border-top:0;}
.os-go li.hl{background:var(--field);}
.os-go b{display:block;font:600 14px var(--disp);}
.os-go small{display:block;font-size:12.5px;line-height:1.45;color:var(--ink-faint);}
.os-go .quiet{text-decoration:none;display:inline-flex;white-space:nowrap;}

/* prep tool */
.os-prep{list-style:none;margin:0 0 4px;padding:0;}
.os-prep li{display:grid;grid-template-columns:150px minmax(0,1fr);gap:12px;align-items:baseline;padding:10px 0;border-top:1px solid var(--line);}
.os-prep p{margin:0;font-size:14.5px;line-height:1.5;}
.os-release{border:1px solid rgba(162,78,129,.35) !important;border-radius:14px;padding:16px !important;margin-top:16px !important;}

/* day one */
.os-first{max-width:960px;}
.os-first-h{max-width:720px;margin:12px 0 24px;}
.os-first-t{font:700 clamp(30px,3.2vw,44px)/1.1 var(--disp);letter-spacing:-.035em;margin:6px 0 12px;outline:none;}
.os-first-steps{list-style:none;margin:0 0 24px;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
.os-first-steps li{display:flex;gap:12px;padding:16px;border:1px solid var(--line);border-radius:14px;}
.os-first-steps li > b{width:28px;height:28px;flex:none;border-radius:50%;background:var(--plum);color:#fff;display:inline-flex;align-items:center;justify-content:center;font:700 13px var(--disp);}
.os-first-steps strong{display:block;font:600 14.5px var(--disp);}
.os-first-steps span{font-size:13px;color:var(--ink-soft);line-height:1.45;}

@media (max-width:1180px){ .os-row4{grid-template-columns:minmax(0,1fr);} }
@media (max-width:767px){
  .os-focus{position:relative;width:auto;max-width:none;margin-top:12px;box-shadow:none;}
  .os-first-steps{grid-template-columns:1fr;}
  .os-prep li{grid-template-columns:1fr;gap:4px;}
  .os-tbl .os-td-p{grid-column:1 / -1;padding-left:52px;}
  .os-since{padding:12px;}
}

.os-agr-h{flex-wrap:wrap;}
.os-agr-h .os-strip{flex-basis:100%;margin-top:8px;}


.os-netwrap.has-focus .os-focus{position:static;width:auto;max-width:none;margin-top:6px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:'h strip' 'st strip' 'line act' 'open act';align-items:center;gap:8px 22px;}
.os-netwrap.has-focus .os-fc-h{grid-area:h;}
.os-netwrap.has-focus .os-fc-h .os-x{display:none;}
.os-netwrap.has-focus .os-fc-st{grid-area:st;margin:0;}
.os-netwrap.has-focus .os-fc-line{grid-area:line;margin:0;}
.os-netwrap.has-focus .os-fc-strip{grid-area:strip;margin:0;}
.os-netwrap.has-focus .os-fc-a{grid-area:act;margin:0;justify-content:flex-end;flex-wrap:wrap;}
.os-netwrap.has-focus .os-fc-open{grid-area:open;margin:0;justify-self:start;}
@media (max-width:767px){ .os-netwrap.has-focus .os-focus{grid-template-columns:1fr;grid-template-areas:'h' 'st' 'line' 'strip' 'act' 'open';} .os-netwrap.has-focus .os-fc-a{justify-content:flex-start;flex-wrap:wrap;} .os-netwrap.has-focus .os-fc-open{justify-self:start;} }
@media (max-width:767px){
  .os-since{flex-direction:column;align-items:stretch;gap:10px;}
  .os-since ul{flex-direction:column;gap:6px;}
  .os-since a{display:flex;border-radius:12px;padding:8px 10px 8px 6px;}
  .os-dh-r{justify-content:flex-start;}
  .os-dh-d{margin-top:2px;}
}
#osFocusChip:empty{display:none;}

/* ===================================== round 6: system design build */
.os-jb{border:1px solid var(--line);border-radius:18px;padding:16px 20px;margin:0 0 16px;background:linear-gradient(135deg,rgba(162,78,129,.14),rgba(162,78,129,.02) 65%),var(--glass);}
.os-jb.slim{padding:12px 18px;}
.os-jb-m{list-style:none;margin:0 0 14px;padding:0;display:flex;gap:6px;flex-wrap:wrap;counter-reset:jb;}
.os-jb-m li{display:inline-flex;align-items:center;gap:7px;padding:5px 11px 5px 5px;border-radius:999px;border:1px solid var(--line);font:600 12.5px var(--disp);color:var(--ink-faint);}
.os-jb-m li span{width:18px;height:18px;border-radius:50%;border:1.5px solid var(--line-hard);display:inline-flex;align-items:center;justify-content:center;font-size:10px;color:#fff;box-sizing:border-box;}
.os-jb-m li.done{color:var(--ink-soft);}
.os-jb-m li.done span{background:var(--plum);border-color:var(--plum);}
.os-jb-m li.cur{color:var(--ink);border-color:var(--plum-bright);background:rgba(162,78,129,.14);}
.os-jb-m li.cur span{border-color:var(--plum-bright);box-shadow:0 0 0 3px rgba(184,96,145,.25);}
.os-jb-r{display:flex;align-items:center;gap:16px 24px;justify-content:space-between;flex-wrap:wrap;}
.os-jb-s{margin:0;font:600 17px/1.35 var(--disp);letter-spacing:-.01em;}
.os-jb.slim .os-jb-s{font-size:15.5px;}
.os-jb-n{margin:4px 0 0;font-size:13.5px;line-height:1.5;color:var(--ink-soft);max-width:70ch;}
.os-jb-a{display:flex;gap:8px;flex:none;}
.os-jb-a .primary,.os-jb-a .quiet{text-decoration:none;display:inline-flex;white-space:nowrap;}

/* one-to-one */
.os-o2o .os-p{margin-bottom:6px;}
.os-qq{border:0;margin:14px 0 0;padding:0;}
.os-qq legend{font:600 15px/1.4 var(--disp);padding:0;margin-bottom:8px;}
.os-qq legend span{display:block;font:600 11px var(--disp);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:2px;}
.os-qopts{display:flex;flex-wrap:wrap;gap:6px;}
.os-opt{all:unset;box-sizing:border-box;cursor:pointer;padding:8px 12px;border:1px solid var(--line);border-radius:12px;font:500 13.5px/1.35 var(--sans);color:var(--ink-soft);max-width:100%;}
.os-opt:hover{border-color:var(--line-hard);color:var(--ink);}
.os-opt.on{border-color:var(--plum-bright);background:rgba(162,78,129,.16);color:var(--ink);}
.os-opt:focus-visible{outline:2px solid var(--plum-bright);outline-offset:2px;}
.os-lens{margin:4px 0 0;padding:0;list-style:none;display:grid;gap:8px;}
.os-lens li{position:relative;padding:10px 12px 10px 30px;border:1px solid var(--line);border-radius:12px;font:500 14.5px/1.5 var(--sans);}
.os-lens li::before{content:"";position:absolute;left:12px;top:17px;width:7px;height:7px;border-radius:50%;background:var(--plum-bright);}
.os-o2o.compact .os-lens li{font-size:13.5px;}

/* bring someone in */
.os-invite{display:flex;gap:8px;margin-top:12px;}
.os-invite input{flex:1;min-width:0;border:1px solid var(--line);border-radius:999px;background:var(--field);color:var(--ink);font:500 14px var(--sans);padding:10px 14px;outline:none;}
.os-invite input:focus{border-color:var(--plum);}
.os-invite input[aria-invalid="true"]{border-color:#E0776A;}
.os-invite.mini{margin:0;grid-column:2 / -1;}
.os-invited{list-style:none;margin:14px 0 0;padding:0;}
.os-invited li{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--line);}
.os-invited b{display:block;font:600 14px var(--disp);}
.os-invited small{font-size:12.5px;color:var(--ink-faint);}
.os-av.inv{border-style:dashed;color:var(--ink-soft);}
.os-code{margin-top:14px;}
.os-code summary{cursor:pointer;font:600 13px var(--disp);color:var(--ink-soft);}
.os-code summary:focus-visible{outline:2px solid var(--plum-bright);outline-offset:2px;}
.os-go-inv{grid-template-columns:34px minmax(0,1fr) !important;}
.os-go-inv form{margin-top:8px !important;}

/* example read */
.os-exbadge{font:700 10.5px var(--disp);letter-spacing:.1em;text-transform:uppercase;color:var(--amber-bright);border:1px dashed rgba(210,149,74,.6);border-radius:999px;padding:3px 8px;}
[data-theme="light"] .os-exbadge{color:#80501E;}
.os-headline.sm{font-size:19px;margin:0 0 12px;}
.os-example .os-strip.big .os-sp{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 2px;border:1px solid var(--line);border-radius:10px;}
.os-example .os-strip.big .os-sp.on{border-color:var(--plum-bright);background:rgba(162,78,129,.12);}
.os-example .os-strip.big .os-sp:focus-visible{outline:2px solid var(--plum-bright);outline-offset:2px;}
.os-example .os-strip.big .os-sp small{font:600 10.5px var(--disp);color:var(--ink-soft);}
.os-ex-p{margin:12px 0 0;font-size:14px;line-height:1.5;color:var(--ink-soft);}
.os-ex-p b{color:var(--ink);font-weight:600;margin-right:4px;}
.os-ex-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:14px;padding-top:12px;border-top:1px solid var(--line);}
.os-ex-row .os-k{margin-bottom:4px;}

/* pairs view tabs + list */
.os-pvt{display:inline-flex;margin-left:auto;padding:3px;border:1px solid var(--line);border-radius:999px;}
.os-pvt button{all:unset;cursor:pointer;padding:5px 12px;border-radius:999px;font:600 12.5px var(--disp);color:var(--ink-soft);}
.os-pvt button[aria-selected="true"]{background:var(--glass-2);color:var(--ink);}
.os-pvt button:focus-visible{outline:2px solid var(--plum-bright);}
.os-listtools{display:flex;align-items:center;gap:12px;margin-bottom:8px;}
.os-listtools .os-search{flex:1;}
.os-net .os-tbl .os-td-s{font-size:13.5px;}
.os-inv-seat{cursor:default;opacity:.85;}
.os-solo .os-row3 .os-net{min-height:0;}
@media (max-width:767px){
  .os-jb{padding:14px;}
  .os-jb-m{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;}
  .os-jb-m li{flex:none;}
  .os-jb-a{width:100%;}
  .os-ex-row{grid-template-columns:1fr;}
  .os-invite{flex-wrap:wrap;}
}

/* ===== Round 6c: two independent stacks (no row alignment) ===== */
.os-cols{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(340px,1fr);gap:16px;margin-top:16px;align-items:start;}
.os-colstack{display:flex;flex-direction:column;gap:16px;min-width:0;}
.os-cols .os-net{padding:18px 20px 10px;}
@media (max-width:1180px){
  .os-cols{display:flex;flex-direction:column;align-items:stretch;}
  .os-colstack{display:contents;}
  .os-cols > .os-colstack > section{order:var(--o,9);}
}
/* prototype controls live under the sidebar, away from content */
/* phone: milestones become a dot strip; the current step keeps its label (text stays for screen readers) */
@media (max-width:640px){
  .os-jb-m{overflow:visible;flex-wrap:nowrap;}
  .os-jb-m li:not(.cur){font-size:0;padding:4px;gap:0;border-color:transparent;}
}
.os-invited small{display:block;} .os-inv-em{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pn-ctl-panel{max-height:calc(100vh - 140px);overflow-y:auto;} 

/* ===== Round 6d (Mira round 4) ===== */
.os-spine .os-spw{font:600 18px/1.35 var(--disp);color:var(--ink);margin:4px 0 12px;}
.os-spine .os-acts{display:flex;flex-wrap:wrap;gap:8px;align-items:center;}
.os-nothing{margin:0;}
.os-spn{display:grid;grid-template-columns:1fr 1fr;gap:12px 20px;margin:16px 0 0;}
.os-spn dt{font:600 11px var(--disp);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:4px;}
.os-spn dd{margin:0;font:400 14px/1.5 var(--sans);color:var(--ink-soft);}
@media (max-width:640px){ .os-spn{grid-template-columns:1fr;} }
.os-tiles.in-card{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin:4px 0 14px;}
.os-tiles.in-card .os-tile{padding:10px 12px;}
@media (max-width:900px){ .os-tiles.in-card{grid-template-columns:repeat(3,minmax(0,1fr));} }
.os-netkey{margin:6px 0 4px;font:400 12.5px/1.5 var(--sans);color:var(--ink-faint);text-align:center;max-width:62ch;margin-inline:auto;}
.os-netkey-ph{display:none;}
@media (max-width:640px){
  .os-more{display:inline-block !important;font-size:11px;}
  .os-netkey-ph{display:inline;}
}
.os-invited li{grid-template-columns:34px minmax(0,1fr);}
/* List view: stage filters as one wrapping row of chips (Mira r5) */
.os-tiles.in-card{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 14px;}
.os-tiles.in-card .os-tile{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:999px;min-height:0;width:auto;}
.os-tiles.in-card .os-tile-m,.os-tiles.in-card .os-stack .os-av,.os-tiles.in-card .os-stack i{display:none;}
.os-tiles.in-card .os-stack{margin:0;min-height:0;}
.os-tiles.in-card .os-tile-n{white-space:nowrap;font-size:13px;}
.os-tiles.in-card .os-tile-v{font-size:14px;line-height:1;}
.os-tiles.in-card .zero .os-tile-v{display:none;}
@media (max-width:640px){ .os-td-a{display:block;text-align:left;margin-top:8px;} }
.os-err{border-color:rgba(210,149,74,.55);}
.os-td-s .os-stagepill{display:inline-block;margin:0 0 4px;} .os-td-s{min-width:200px;}
.os-failed .os-cols,.os-failed #osSince{display:none;}
.os-wide{margin-top:16px;} .os-cmd:disabled{opacity:.5;cursor:not-allowed;}

/* ===== Inside the console (2026-10-14) =====
   The console's .page already sets the width and gutters, so the bar and the
   home share its content box instead of adding their own. */
.pn-os-host .os-bar{padding:0;background:color-mix(in srgb,var(--bg) 90%,transparent);}
.pn-os-host .os-page{padding:24px 0 72px;max-width:none;}
.os-av.has-ph{overflow:hidden;padding:0;}
.os-av.has-ph img{width:100%;height:100%;object-fit:cover;display:block;border-radius:50%;}
/* The pair space is a full-height sheet over the console (under its drawer,
   z 50, so pairing.js's drawer opens on top of it). */
.pn-os-host .os-bar{z-index:39;}
.pn-os-host .os-scrim{top:var(--os-top,0px);left:0;z-index:36;}
.pn-os-host .os-pane{top:var(--os-top,0px);z-index:38;}
@media (max-width:900px){ .pn-os-host .os-pane{padding-bottom:calc(66px + env(safe-area-inset-bottom,0));} }
/* Mira (console review): the full-width ring keeps a readable height; narrow
   rings drop the stage meanings so labels never touch the arc; the sheet hangs
   from the bar's right edge. */
.os-wide .os-netwrap{max-width:720px;margin:0 auto;}
.os-net{container-type:inline-size;}
@container (max-width:640px){ .os-sl small{display:none;} }
.pn-os-host .os-pane{right:var(--os-right,0px);}
/* "All pairs" stays put; only the open pairs scroll (Mira r2). */
.os-tab-all{margin-left:auto;flex:none;}
.os-bar .os-tab-all + .os-tabs{margin-left:4px;}
/* The bar belongs to the page (Anthem, 10-14: "look at bar"): no strip of its
   own and no second "Pairs"; it takes a backdrop only once it sticks. Nothing
   inside Pairs may push the page sideways. */
.pn-os-host{overflow-x:clip;}
.pn-os-host .os-bar{background:transparent;border-bottom-color:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;transition:background-color .2s ease,border-color .2s ease;}
.pn-os-host .os-bar.stuck{background:color-mix(in srgb,var(--bg) 88%,transparent);border-bottom-color:var(--line);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);}
.pn-os-host .os-cmd{flex:1;max-width:none;}
@media (max-width:640px){ .pn-os-host .os-cmd{flex:none;} }
/* overflow:hidden still lets focus()/scrollIntoView scroll the page sideways
   (Anthem's view kept shifting left); clip forbids it while Pairs is showing. */
html:has([data-view="dyad"].on .pn-os-host), html:has([data-view="dyad"].on .pn-os-host) body{overflow-x:clip;}

/* The grid card and its invite footer (kept from the matrix, 2026-10-15) */
.os-gxcard .os-ch{flex-wrap:wrap;}
.gx-foot{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;justify-content:space-between;margin-top:14px;padding-top:12px;border-top:1px solid var(--line);}
.gx-foot b{display:block;font:600 13.5px var(--sans);}
.gx-foot small{display:block;color:var(--ink-soft);font-size:12.5px;}

/* ===== The grid (2026-10-16, Anthem's reference): a card per colleague =====
   One pill per card (the pair's status); the accent only where someone needs
   you. No stage rings: on photos they couldn't be seen, and the pill already
   says it (Mira, 2026-10-16). */
.gx-grid{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(184px,1fr));gap:14px;}
.gx-grid > li{display:flex;}
.gx-card{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:3px;width:100%;box-sizing:border-box;
  padding:24px 14px 18px;border:1px solid var(--line);border-radius:16px;background:rgba(var(--ink-rgb),.025);
  color:var(--ink);text-align:center;text-decoration:none;font:inherit;cursor:pointer;
  transition:border-color .2s,transform .2s var(--os-ease),box-shadow .2s;}
.gx-card:hover{border-color:var(--line-hard);transform:translateY(-2px);}
.gx-card:focus-visible{outline:2px solid var(--plum-bright);outline-offset:3px;}
.gx-card.needs{border-color:color-mix(in srgb,var(--plum-bright) 60%,transparent);}
[data-theme="light"] .gx-card.needs{border-color:color-mix(in srgb,var(--plum-bright) 85%,transparent);}
.gx-next{margin-top:8px;font-size:12.5px;line-height:1.35;color:var(--ink-soft);}
.gx-next::before{content:"\2192\00a0";color:var(--ink-faint);}
.gx-card.needs .gx-next::before{color:var(--plum-bright);}
.gx-card .gx-av.os-av{width:84px;height:84px;font-size:24px;margin-bottom:10px;}
.gx-card .gx-av.os-av.needs::after{width:14px;height:14px;right:2px;top:2px;}
.gx-n{font:600 15.5px var(--disp);line-height:1.25;}
.gx-r{font-size:13px;color:var(--ink-faint);line-height:1.35;}
.gx-card .gx-pill{margin-top:12px;max-width:100%;overflow:hidden;text-overflow:ellipsis;}
.gx-card.needs .gx-pill{border-color:color-mix(in srgb,var(--plum-bright) 60%,transparent);color:var(--plum-bright);}
.gx-inv{justify-content:center;border-style:dashed;background:none;color:var(--ink-soft);}
.gx-inv:hover{color:var(--ink);}
.gx-plus{width:58px;height:58px;border-radius:50%;border:1px solid var(--line-hard);display:inline-flex;align-items:center;justify-content:center;
  font:300 28px/1 var(--disp);margin-bottom:10px;}
@media (max-width:560px){
  .gx-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
  .gx-card{padding:18px 10px 14px;}
  .gx-card .gx-av.os-av{width:62px;height:62px;font-size:18px;}
  .gx-n{font-size:14.5px;}
}


/* filters in Grid and Matrix: two chips and a stage menu (2026-10-16) */
.os-tiles.in-card:has(.gx-stage){display:flex;flex-wrap:wrap;align-items:center;gap:8px;}
.gx-stage{position:relative;display:inline-flex;}
.gx-stage select{appearance:none;-webkit-appearance:none;font:600 13px var(--disp);color:var(--ink-soft);background:transparent;
  border:1px solid var(--line);border-radius:999px;padding:7px 32px 7px 14px;cursor:pointer;}
.gx-stage::after{content:"";position:absolute;right:14px;top:50%;width:6px;height:6px;margin-top:-5px;border-right:1.5px solid var(--ink-soft);border-bottom:1.5px solid var(--ink-soft);transform:rotate(45deg);pointer-events:none;}
.gx-stage select:focus-visible{outline:2px solid var(--plum-bright);outline-offset:2px;}
.gx-stage.on select{border-color:var(--plum);color:var(--ink);box-shadow:inset 0 -3px 0 var(--plum-bright);}
.gx-stage select option{color:#111;}

/* compact cards over 20 people: photo left, words right */
.gx-grid.dense{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px;}
.gx-grid.dense .gx-card{display:grid;grid-template-columns:48px 1fr;column-gap:12px;row-gap:1px;align-items:center;justify-items:start;text-align:left;padding:12px 14px;}
.gx-grid.dense .gx-card .gx-av.os-av{grid-row:1 / span 4;width:48px;height:48px;font-size:14px;margin:0;align-self:center;}
.gx-grid.dense .gx-card .gx-av.os-av.needs::after{width:10px;height:10px;right:-2px;top:-2px;}
.gx-grid.dense .gx-r{min-height:0;}
.gx-grid.dense .gx-card .gx-pill{margin-top:6px;}
.gx-grid.dense .gx-next{margin-top:3px;}
.gx-grid.dense .gx-plus{grid-row:1 / span 2;width:48px;height:48px;font-size:22px;margin:0;}
.gx-grid.dense .gx-inv{align-content:center;}
@media (max-width:560px){ .gx-grid.dense{grid-template-columns:1fr;} }

/* the invite card, opened in place (one invite, never a result: Mira C3) */
.gx-inv.open{cursor:default;justify-content:center;gap:6px;border-style:solid;}
.gx-inv.open:hover{transform:none;}
.gx-invform{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:10px;width:100%;}
.gx-invform input{flex:1 1 160px;min-width:0;}
.gx-invx{margin-top:6px;font-size:12.5px;}

/* phones: compact from 7 people, so a team fits in a screen or two */
@media (max-width:560px){
  .gx-grid.many{grid-template-columns:1fr;gap:8px;}
  .gx-grid.many .gx-card{display:grid;grid-template-columns:48px 1fr;column-gap:12px;row-gap:1px;align-items:center;justify-items:start;text-align:left;padding:12px 14px;}
  .gx-grid.many .gx-card .gx-av.os-av{grid-row:1 / span 4;width:48px;height:48px;font-size:14px;margin:0;align-self:center;}
  .gx-grid.many .gx-card .gx-av.os-av.needs::after{width:10px;height:10px;right:-2px;top:-2px;}
  .gx-grid.many .gx-card .gx-pill{margin-top:6px;}
  .gx-grid.many .gx-next{margin-top:3px;}
  .gx-grid.many .gx-plus{grid-row:1 / span 2;width:48px;height:48px;font-size:22px;margin:0;}
  .gx-grid.many .gx-inv.open{display:flex;text-align:center;justify-items:center;}
}

/* the card's foot: pill and next line pinned to the bottom, so pills line up
   across a row whatever the role (Mira round 3, C2). An empty line holds its
   two lines on desktop and collapses in compact rows. */
.gx-foot2{display:flex;flex-direction:column;align-items:center;width:100%;margin-top:auto;padding-top:10px;}
.gx-card .gx-foot2 .gx-pill{margin-top:0;}
.gx-grid:not(.dense) .gx-next{min-height:2.7em;}
.gx-next.empty::before{content:none;}
.gx-grid.dense .gx-foot2{align-items:flex-start;margin-top:4px;padding-top:0;}
.gx-grid.dense .gx-next.empty{display:none;}
@media (max-width:560px){
  .gx-grid.many .gx-foot2{align-items:flex-start;margin-top:4px;padding-top:0;}
  .gx-grid.many .gx-next{min-height:0;}
  .gx-grid.many .gx-next.empty{display:none;}
}
/* compact cards read top-down, so a row's pills share a line (a missing role
   closes up by design in compact rows) */
.gx-grid.dense .gx-card{align-content:start;}
@media (max-width:560px){ .gx-grid.many .gx-card{align-content:start;} }

/* what Pairs is for: the hero's essence line (styles.css .essence) */

/* Pills line up from the top, not the foot: the role line is always held (blank
   when there's none), so a longer next line can't push a pill out of its row.
   Compact rows drop the blank line. (Replaces the foot pinning above.) */
.gx-grid:not(.dense) .gx-foot2{margin-top:0;}
.gx-grid:not(.dense) .gx-next{min-height:0;}
.gx-grid.dense .gx-r.empty{display:none;}
@media (max-width:560px){ .gx-grid.many .gx-r.empty{display:none;} .gx-grid.many .gx-foot2{margin-top:4px;} }

/* ===== The hero and section title, in the app's own pattern (2026-10-16) =====
   .hero / .kick / .archetype / .essence / .sqhero-stat come from styles.css, as on
   Profile and Guide. Inside it, the journey's one step sits under a rule instead of
   in a second card. "Your pairs" is a page section title at the app's size (30/25),
   not a label inside a box. */
.os-hero{margin:0 0 22px;}
.os-hero .os-hero-stat{margin-top:22px;}
.os-hero .os-hero-next{margin-top:20px;padding-top:18px;border-top:1px solid var(--line);}
.os-hero .os-hero-next .os-jb{background:none;border:0;border-radius:0;padding:0;margin:0;box-shadow:none;}
.os-gxcard{background:none !important;border:0;padding:0;border-radius:0;}
.os-gxcard > .os-ch{margin-bottom:14px;}
.os-gxcard .os-ct{font:700 30px/1.15 var(--disp);letter-spacing:-.025em;color:var(--ink);}
@media (max-width:560px){ .os-gxcard .os-ct{font-size:25px;} }

/* ===== Visual parity, round 2 (Mira round 6, 2026-10-16) =====
   (a) the hero's one button is full width on phones, as Guide's is;
   (b) with nothing open, the bar rests in the hero's top-right corner, so the lit
       card is the page's top; search is its icon there, the chip keeps its count;
   (c) the side panels' titles take the app's in-card title size (Profile:
       "Dominant strengths", "The flip side"), not a 16px label. */
@media screen and (max-width:899px){
  .os-hero .os-jb-r{flex-direction:column;align-items:stretch;}
  .os-hero .os-jb-a{width:100%;}
  .os-hero .os-jb-a .primary{width:100%;justify-content:center;}
}
.pn-os-host .os-bar.gx-over{justify-content:flex-end;gap:10px;margin-bottom:calc(-1 * var(--bar));padding:0 40px;pointer-events:none;}
.pn-os-host .os-bar.gx-over > *{pointer-events:auto;}
.pn-os-host .os-bar.gx-over .os-bar-l{flex:none;}
.pn-os-host .os-bar.gx-over .os-cmd{flex:none;max-width:none;padding:9px 11px;}
.pn-os-host .os-bar.gx-over .os-cmd span{display:none;}
@media screen and (max-width:899px){ .pn-os-host .os-bar.gx-over{padding:0 20px;} }
.os-grid .os-card2 > .os-ch{flex-wrap:wrap;row-gap:4px;}
.os-grid .os-card2 > .os-ch > .os-ct{font:700 30px/1.15 var(--disp);letter-spacing:-.025em;color:var(--ink);}
@media (max-width:560px){ .os-grid .os-card2 > .os-ch > .os-ct{font-size:25px;} }
.os-page.os-grid{padding-top:0;}

/* The one-to-one panel's buttons are one set (Anthem, 2026-10-16: "clean up the
   pills"): matched quiet pills beside each other, never a pill next to an
   underlined link. Its save button stays an outline until all three are answered,
   so a dimmed filled button never reads as a second main action. */
.os-o2o .os-acts{align-items:center;}
.os-o2o .os-acts .primary:disabled{background:none;box-shadow:inset 0 0 0 1px var(--line);color:var(--ink-faint);opacity:1;cursor:not-allowed;}
@media (max-width:767px){ .pn-os-host .os-pane{left:0;right:0;width:auto;} }  /* phone: full-bleed, never pushed off the left by --os-right (Mira round 7, C1) */
/* N4 (Mira round 8): on narrow phones an open-pair tab is its face and ×; the
   name stays for screen readers, so the strip never shows a cut-off "m ×". */
/* (the 380px name rule is now measured: .os-tabs.fit-compact, below) */
/* ...and the needs chip keeps its dot and count there, its words for screen readers, so an open tab fits whole */
/* R9-2: the chip only shortens when a tab is open (no bare "Nothing" for a solo user) */
.os-need-short{display:none;}
.os-bar.fit-tight .os-need .os-need-w,
.os-bar.fit-tight .os-need .os-need-full{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.os-bar.fit-tight .os-need .os-need-short{display:inline;}
.os-tab-more{color:var(--ink-faint);font-weight:600;}
.os-tabs.fit-compact .os-tab-n{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
/* R10-1 (Mira round 10): with pairs open, search has a readable floor and can give way,
   so open pairs keep their names on tablets and small laptops; .fit-search makes it its icon. */
@media (min-width:768px){
  .pn-os-host .os-bar:not(.gx-over) .os-cmd{min-width:200px;}
  .pn-os-host .os-bar.fit-search .os-cmd{min-width:0;flex:none;padding:9px 11px;}
  .pn-os-host .os-bar.fit-search .os-cmd span{display:none;}
}
/* F2: once search is its icon, the tab strip takes the bar's free space before anything is measured */
.pn-os-host .os-bar.fit-search .os-tabs{flex:1 1 auto;}

/* Long names (prod sweep #14): wrap inside their own column on cards, rows,
   the field and the pair title, instead of running under the close button. */
.os-ph-t,.os-node-t b,.os-row-t b,.os-card b,.os-fc-h b{overflow-wrap:anywhere;}
.os-node-t,.os-row-t{min-width:0;}

/* The invite form says what is wrong with the address, where you are looking (prod sweep Q-16). */
.os-invite-err{margin:8px 0 0;color:var(--amber-bright);}
.os-invite input[aria-invalid="true"]{border-color:rgba(210,149,74,.75);}
.os-invite-err{grid-column:2 / -1;}   /* in the "Invite someone new" row, beside the form, not in the 34px avatar column (Kenji C1) */
