[hidden] { display:none !important; }

:root {
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px; --sp-6:24px; --sp-8:32px;
  --r-ctl:10px; --r-box:18px; --r-pill:999px;
  --ctl:28px;
  --lavender:#9298ff; --azure:#5badff; --teal:#3bc5c7; --mint:#55cd96;
  --amber:#f3bc52; --coral:#ff7b91; --orchid:#cc8af6; --steel:#8b9cb4;
  --accent:var(--lavender); --accent-solid:#5b64d7; --accent-ink:var(--accent); --on-accent:#fff;
  --ok:#36bf83; --warn:#e6a52f; --danger:#f2637b;
  --sans:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI Variable Text","Segoe UI",system-ui,sans-serif;
  --mono:"SFMono-Regular","Cascadia Code","Roboto Mono",Consolas,monospace;
  --fast:140ms; --mid:240ms; --slow:480ms;
  --ease:cubic-bezier(.2,.8,.2,1); --spring:cubic-bezier(.16,1,.3,1);
}

[data-accent="azure"] { --accent:var(--azure); --accent-solid:#216db5; }
[data-accent="teal"] { --accent:var(--teal); --accent-solid:#08777a; }
[data-accent="mint"] { --accent:var(--mint); --accent-solid:#16784f; }
[data-accent="amber"] { --accent:var(--amber); --accent-solid:#855a08; }
[data-accent="coral"] { --accent:var(--coral); --accent-solid:#b33b55; }
[data-accent="orchid"] { --accent:var(--orchid); --accent-solid:#8146ad; }
[data-accent="steel"] { --accent:var(--steel); --accent-solid:#51627b; }

[data-theme="graphite"] {
  --bg:#120b1d; --bg-1:#1c122b; --bg-2:#281a3b; --bg-3:#392451;
  --line:rgba(238,203,255,.11); --line-2:rgba(255,206,244,.22);
  --fg:#fff7ff; --fg-2:#d5bddd; --fg-3:#a88eaf;
  --glass:rgba(28,18,43,.72); --glass-edge:rgba(255,215,250,.18);
  --tint:rgba(231,169,255,.065); --halo:color-mix(in srgb,var(--accent) 34%,transparent); --accent-ink:color-mix(in srgb,var(--accent) 76%,white);
}
[data-theme="obsidian"] {
  --bg:#040608; --bg-1:#0a0e13; --bg-2:#11171e; --bg-3:#1a222c;
  --line:rgba(255,255,255,.075); --line-2:rgba(255,255,255,.14);
  --fg:#f7f9fc; --fg-2:#afb8c4; --fg-3:#7f8793;
  --glass:rgba(10,14,19,.86); --glass-edge:rgba(255,255,255,.105);
  --tint:rgba(255,255,255,.042); --halo:color-mix(in srgb,var(--accent) 16%,transparent); --accent-ink:var(--accent);
}
[data-theme="abyss"] {
  --bg:#021516; --bg-1:#062023; --bg-2:#0a2d31; --bg-3:#104047;
  --line:rgba(129,235,226,.10); --line-2:rgba(129,235,226,.21);
  --fg:#effffc; --fg-2:#9ccbc6; --fg-3:#739d9a;
  --glass:rgba(4,28,30,.93); --glass-edge:rgba(144,239,230,.14);
  --tint:rgba(69,214,202,.055); --halo:color-mix(in srgb,var(--teal) 20%,transparent); --accent-ink:color-mix(in srgb,var(--accent) 72%,white);
}
[data-theme="daylight"] {
  --bg:#ebf1f6; --bg-1:#fbfdfe; --bg-2:#f3f7fa; --bg-3:#e5ecf2;
  --line:rgba(31,52,72,.10); --line-2:rgba(31,52,72,.18);
  --fg:#172330; --fg-2:#526477; --fg-3:#657083;
  --glass:rgba(251,253,254,.88); --glass-edge:rgba(39,63,85,.12);
  --tint:rgba(39,70,96,.038); --halo:color-mix(in srgb,var(--accent) 14%,transparent); --accent-ink:var(--accent-solid);
}
[data-theme="sand"] {
  --bg:#f1ede4; --bg-1:#fcfaf6; --bg-2:#f6f1e9; --bg-3:#e9e1d5;
  --line:rgba(79,61,40,.12); --line-2:rgba(79,61,40,.21);
  --fg:#292017; --fg-2:#645647; --fg-3:#746957;
  --glass:rgba(252,250,246,.88); --glass-edge:rgba(87,67,43,.13);
  --tint:rgba(91,68,40,.04); --halo:color-mix(in srgb,var(--accent) 15%,transparent); --accent-ink:var(--accent-solid);
}

html[data-theme="graphite"],html[data-theme="obsidian"],html[data-theme="abyss"] { color-scheme:dark; }
html[data-theme="daylight"],html[data-theme="sand"] { color-scheme:light; }

* { box-sizing:border-box; margin:0; padding:0; }
html,body { height:100%; }
body {
  color:var(--fg); font:400 13.5px/1.5 var(--sans); letter-spacing:-.008em;
  background:
    radial-gradient(circle at 15% -10%, color-mix(in srgb,var(--accent) 14%,transparent), transparent 30%),
    radial-gradient(circle at 95% 110%, color-mix(in srgb,var(--accent) 9%,transparent), transparent 34%),
    var(--bg);
  overflow:hidden; -webkit-font-smoothing:antialiased;
}
html[data-theme="graphite"] body {
  background:
    radial-gradient(ellipse at 8% 0%, rgba(225,92,255,.24), transparent 38%),
    radial-gradient(ellipse at 94% 98%, rgba(79,119,255,.20), transparent 42%),
    linear-gradient(145deg,#120b1d 0%,#0b1023 100%);
}
html[data-theme="graphite"] :is(.sidebar,.bar,.composer,.context) {
  backdrop-filter:blur(22px) saturate(145%); -webkit-backdrop-filter:blur(22px) saturate(145%);
}
html[data-theme="abyss"] body {
  background:
    linear-gradient(135deg,rgba(48,202,190,.035) 25%,transparent 25%) 0 0/26px 26px,
    linear-gradient(315deg,rgba(48,202,190,.025) 25%,transparent 25%) 0 0/26px 26px,
    #021516;
}
html[data-theme="abyss"] :is(.row,.group,.work-card,.settings-cluster,.nodes-panel,.kpi) { border-radius:7px; }
body,.sidebar,.main,.context,.bar,.col.left,.composer,.group,.work-card,.settings-cluster,.appearance-panel,.health-card,.nodes-panel,.node-kpi {
  transition:background-color var(--mid) var(--ease),border-color var(--mid) var(--ease),color var(--mid) var(--ease);
}
button,input,select,textarea { color:inherit; font:inherit; letter-spacing:inherit; }
button { border:0; background:none; cursor:pointer; }
svg { display:block; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.btn svg,.icon-btn svg,.mobile-back svg,.lock-btn svg,.send svg { width:17px; height:17px; }
.sr-only { position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important;
  overflow:hidden !important; clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important; }
.eyebrow { color:var(--accent-ink); font-size:10px; font-weight:650; letter-spacing:.12em; text-transform:uppercase; }
button:active:not(:disabled) { transform:scale(.975); }
:focus-visible { outline:2px solid color-mix(in srgb,var(--accent) 80%,white); outline-offset:2px; }
::selection { background:color-mix(in srgb,var(--accent) 30%,transparent); }
::-webkit-scrollbar { width:10px; height:10px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:var(--line-2); border:3px solid transparent; border-radius:var(--r-pill); background-clip:content-box; }
::-webkit-scrollbar-thumb:hover { background:var(--fg-3); background-clip:content-box; }
.mono { font:400 11px/1.45 var(--mono); letter-spacing:0; }
.scroll-y { min-height:0; overflow-y:auto; overscroll-behavior:contain; }

@keyframes ui-enter { from { opacity:0; transform:translateY(10px) scale(.995); } }
@keyframes view-enter { from { opacity:0; transform:translateY(7px); } }
@keyframes soft-pop { from { opacity:0; transform:translateY(8px) scale(.98); } }
@keyframes slide-in { from { opacity:0; transform:translateX(-8px); } }
@keyframes message-in { from { opacity:0; transform:translateY(7px) scale(.985); } }
@keyframes pulse-live { 50% { opacity:.55; transform:scale(.82); } }
@keyframes shimmer { to { transform:translateX(100%); } }
@keyframes grow-y { from { transform:scaleY(0); } }
@keyframes grow-x { from { transform:scaleX(0); } }
@keyframes halo-breathe { 50% { opacity:.58; transform:scale(.92); } }
@keyframes spin { to { transform:rotate(360deg); } }

/* Login */
.gate { position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:24px; overflow:hidden; }
.gate::before { content:""; position:absolute; width:min(780px,90vw); aspect-ratio:1; border-radius:50%;
  background:radial-gradient(circle,var(--halo),transparent 66%); opacity:.9; animation:halo-breathe 8s ease-in-out infinite; pointer-events:none; }
.gate-shell { position:relative; width:min(820px,100%); display:grid; grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);
  overflow:hidden; border:1px solid var(--glass-edge); border-radius:28px; background:var(--glass);
  backdrop-filter:blur(24px) saturate(150%); -webkit-backdrop-filter:blur(24px) saturate(150%);
  box-shadow:0 32px 90px rgba(0,0,0,.38); animation:soft-pop var(--slow) var(--spring); }
.gate-story { padding:52px; display:flex; flex-direction:column; justify-content:space-between; min-height:470px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 14%,var(--bg-1)),var(--bg-1)); border-right:1px solid var(--line); }
.gate-brand { display:flex; align-items:center; gap:10px; font-weight:650; letter-spacing:-.02em; }
.gate-brand .brand-mark { width:32px; height:32px; border-radius:10px; }
.gate-brand .brand-mark svg,.gate-mark svg { width:19px; height:19px; }
.gate-story h1 { margin-top:54px; max-width:11ch; font-size:clamp(34px,5vw,54px); line-height:.98; letter-spacing:-.055em; }
.gate-story p { margin-top:18px; max-width:40ch; color:var(--fg-2); font-size:14px; }
.gate-points { display:flex; flex-wrap:wrap; gap:8px; color:var(--fg-3); font-size:11.5px; }
.gate-points span { padding:6px 10px; border:1px solid var(--line); border-radius:var(--r-pill); background:var(--tint); }
.gate-card { padding:44px 36px; display:flex; flex-direction:column; justify-content:center; background:var(--bg-1); }
.gate-mark,.brand-mark { display:grid; place-items:center; flex:none; color:#fff;
  background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 88%,white),var(--accent-solid)); }
.gate-mark { width:44px; height:44px; border-radius:14px; margin-bottom:22px; }
.gate-card h2 { font-size:22px; line-height:1.15; letter-spacing:-.03em; }
.gate-card p { margin-top:8px; color:var(--fg-3); }
.gate-card input { margin-top:24px; }
.gate-card .btn { margin-top:10px; }
.gate-card .err { margin-top:10px; }
.gate-card .gate-help { margin-top:18px; text-align:center; font-size:10.5px; }

/* Workspace shell */
.app { --w-side:clamp(198px,14vw,250px); --w-ctx:clamp(286px,22vw,430px); position:relative;
  height:100dvh; padding:10px; display:grid; grid-template-columns:var(--w-side) minmax(0,1fr) var(--w-ctx);
  grid-template-areas:"side main context"; gap:10px; overflow:hidden; animation:ui-enter var(--slow) var(--spring); }
.app[data-context="off"] { grid-template-columns:var(--w-side) minmax(0,1fr); grid-template-areas:"side main"; }
.app[data-context="off"] .context { display:none; }
.sidebar,.main,.context { min-height:0; background:var(--bg-1); border:1px solid var(--line); border-radius:var(--r-box); overflow:hidden; }
.sidebar { grid-area:side; position:relative; display:flex; flex-direction:column; padding:12px; }
.main { grid-area:main; min-width:0; display:grid; grid-template:minmax(0,1fr)/minmax(0,1fr); }
.context { grid-area:context; position:relative; display:flex; flex-direction:column; gap:12px; padding:16px 12px;
  overflow-y:auto; overscroll-behavior:contain; scrollbar-gutter:stable; }
.context > * { flex:0 0 auto; }
.view { grid-area:1/1; min-width:0; min-height:0; display:flex; flex-direction:column; overflow:hidden; }
.view:not([hidden]) { animation:view-enter var(--mid) var(--ease); }
.grip { position:absolute; z-index:8; top:0; bottom:0; width:9px; cursor:col-resize; touch-action:none; }
.grip::after { content:""; position:absolute; inset:10px 4px; width:1px; background:transparent; transition:background var(--fast); }
.grip:hover::after,.grip.dragging::after { background:var(--accent); }
body.resizing { cursor:col-resize; user-select:none; }

/* Navigation */
.brand { height:50px; display:flex; align-items:center; gap:10px; padding:0 8px; }
.brand-mark { width:30px; height:30px; border-radius:10px; }
.brand-mark svg { width:17px; height:17px; }
.brand-copy { min-width:0; display:flex; flex-direction:column; }
.brand-copy b { font-size:13.5px; line-height:1.1; font-weight:650; letter-spacing:-.02em; }
.brand-copy small { margin-top:3px; color:var(--fg-3); font-size:9.5px; text-transform:uppercase; letter-spacing:.09em; }
.pulse { width:8px; height:8px; margin-left:auto; flex:none; border-radius:50%; background:var(--danger); }
.pulse.live { background:var(--ok); box-shadow:0 0 0 4px color-mix(in srgb,var(--ok) 15%,transparent); animation:pulse-live 2.6s ease-in-out infinite; }
.side-cap { padding:18px 9px 7px; color:var(--fg-3); font-size:9.5px; font-weight:650; letter-spacing:.11em; text-transform:uppercase; }
.nav { position:relative; height:38px; padding:0 10px; display:flex; align-items:center; gap:10px; border-radius:11px;
  color:var(--fg-2); text-align:left; transition:color var(--fast),background var(--fast),transform var(--fast); }
.nav:hover { color:var(--fg); background:var(--tint); transform:translateX(2px); }
.nav[aria-current="true"] { color:var(--fg); background:color-mix(in srgb,var(--accent) 13%,var(--bg-2)); }
.nav::before { content:""; position:absolute; left:0; width:3px; height:18px; border-radius:0 4px 4px 0; background:var(--accent);
  transform:scaleY(0); transition:transform var(--mid) var(--spring); }
.nav[aria-current="true"]::before { transform:scaleY(1); }
.nav .glyph { width:18px; height:18px; display:grid; place-items:center; flex:none; color:var(--fg-3); }
.nav .glyph svg { width:17px; height:17px; }
.nav[aria-current="true"] .glyph { color:var(--accent-ink); }
.nav .count { margin-left:auto; min-width:20px; height:20px; padding:0 6px; display:grid; place-items:center;
  border-radius:var(--r-pill); color:var(--fg-3); background:var(--tint); font:500 10px/1 var(--mono); }
.nav .count:empty { display:none; }
.sidebar .grow { flex:1; }
.sidebar .foot { padding:0; color:var(--fg-3); font:400 10px/1 var(--mono); }
.sidebar-foot { min-height:38px; padding:8px; display:flex; align-items:center; justify-content:space-between; border-top:1px solid var(--line); }
.lock-btn,.icon-btn { width:32px; height:32px; display:grid; place-items:center; flex:none; border-radius:10px; color:var(--fg-3);
  transition:color var(--fast),background var(--fast),transform var(--fast); }
.lock-btn:hover,.icon-btn:hover { color:var(--fg); background:var(--tint); }
.board { display:grid; gap:3px; padding:2px; }
.board button { height:30px; padding:0 8px; display:flex; align-items:center; gap:8px; border-radius:9px; color:var(--fg-2); font-size:11.5px; text-align:left; }
.board button:hover { color:var(--fg); background:var(--tint); }
.board b { margin-left:auto; font:600 11px/1 var(--mono); }
.mark { width:7px; height:7px; flex:none; border-radius:50%; background:var(--fg-3); }
.mark.hot { background:var(--danger); } .mark.warn { background:var(--warn); } .mark.ok { background:var(--ok); }

/* Toolbars and controls */
.bar { min-height:58px; flex:none; display:flex; align-items:center; gap:12px; padding:10px 18px; border-bottom:1px solid var(--line); background:var(--bg-1); }
.bar-title { min-width:0; display:flex; align-items:center; gap:11px; }
.page-icon { width:36px; height:36px; display:grid; place-items:center; flex:none; border:1px solid var(--line); border-radius:11px;
  color:var(--fg-2); background:var(--bg-2); }
.page-icon.ai { color:var(--accent-ink); background:color-mix(in srgb,var(--accent) 10%,var(--bg-2)); }
.page-icon svg { width:18px; height:18px; }
.bar-kicker { display:block; color:var(--fg-3); font-size:9.5px; text-transform:uppercase; letter-spacing:.1em; }
.bar h1 { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:15px; line-height:1.25; font-weight:650; letter-spacing:-.025em; }
.bar .right { margin-left:auto; display:flex; align-items:center; gap:8px; flex:none; }
.bar .note { max-width:40vw; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--fg-3); font-size:11.5px; }
.mobile-back { display:none; width:32px; height:32px; flex:none; place-items:center; border-radius:10px; color:var(--fg-2); background:var(--bg-2); }
.inspector-toggle { display:none; }
.seg { display:inline-flex; flex:none; gap:2px; padding:3px; border:1px solid var(--line); border-radius:12px; background:var(--bg-2); }
.seg button { min-width:52px; height:26px; padding:0 10px; border-radius:9px; color:var(--fg-3); font-size:11.5px; transition:color var(--fast),background var(--fast),transform var(--fast); }
.seg button:hover { color:var(--fg-2); }
.seg button[aria-pressed="true"] { color:var(--fg); background:var(--bg-3); box-shadow:0 1px 0 var(--line-2); }
.btn { min-height:34px; padding:0 13px; display:inline-flex; align-items:center; justify-content:center; gap:7px; border:1px solid var(--line);
  border-radius:10px; background:var(--bg-2); color:var(--fg-2); font-size:12px; font-weight:500; white-space:nowrap;
  transition:color var(--fast),background var(--fast),border-color var(--fast),transform var(--fast),filter var(--fast); }
.btn:hover:not(:disabled) { color:var(--fg); background:var(--bg-3); border-color:var(--line-2); transform:translateY(-1px); }
.btn.primary { color:var(--on-accent); border-color:transparent; background:linear-gradient(135deg,color-mix(in srgb,var(--accent-solid) 88%,white),var(--accent-solid)); }
.btn.primary:hover:not(:disabled) { filter:brightness(1.08); }
.btn.danger { color:var(--danger); } .btn.quiet { background:transparent; border-color:transparent; }
.btn.primary.danger { color:#fff; background:var(--danger); }
.btn.quiet:hover:not(:disabled) { background:var(--tint); } .btn.wide { width:100%; }
.btn:disabled { opacity:.42; cursor:not-allowed; }
input[type=text],input[type=password],input[type=number],select,textarea { width:100%; min-height:36px; padding:0 12px; color:var(--fg);
  border:1px solid var(--line); border-radius:10px; background:var(--bg-2); transition:border-color var(--fast),background var(--fast),box-shadow var(--fast); }
textarea { height:auto; padding:10px 12px; line-height:1.55; resize:none; }
input::placeholder,textarea::placeholder { color:var(--fg-3); }
input:hover,select:hover,textarea:hover { border-color:var(--line-2); }
input:focus,select:focus,textarea:focus { outline:none; border-color:var(--accent); background:var(--bg-1); box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 14%,transparent); }

/* Inbox list */
.split { --w-list:clamp(320px,24vw,470px); flex:1; min-height:0; display:grid; grid-template-columns:var(--w-list) minmax(0,1fr); }
.col { min-width:0; min-height:0; display:flex; flex-direction:column; overflow:hidden; }
.col.left { position:relative; border-right:1px solid var(--line); background:color-mix(in srgb,var(--bg-1) 78%,var(--bg)); }
.queue-head { min-height:132px; display:grid; gap:10px; padding:14px; border-bottom:1px solid var(--line); }
.queue-top { display:flex; align-items:center; gap:10px; }
.queue-top h2 { font-size:18px; font-weight:650; letter-spacing:-.035em; }
.queue-search { position:relative; }
.queue-search svg { position:absolute; left:11px; top:50%; transform:translateY(-50%); width:15px; height:15px; color:var(--fg-3); pointer-events:none; }
.queue-search input { height:36px; padding-left:34px; padding-right:36px; background:var(--bg-1); }
.queue-search kbd { position:absolute; right:9px; top:50%; transform:translateY(-50%); min-width:20px; height:20px; display:grid; place-items:center;
  border:1px solid var(--line); border-radius:6px; color:var(--fg-3); background:var(--bg-2); font:400 10px/1 var(--mono); pointer-events:none; }
.folder-bar { min-width:0; display:flex; align-items:center; gap:6px; }
.folder-tabs { min-width:0; display:flex; align-items:center; gap:3px; overflow-x:auto; scrollbar-width:none; }
.folder-tabs::-webkit-scrollbar { display:none; }
.folder-tabs button { position:relative; height:28px; padding:0 11px; flex:none; border-radius:9px; color:var(--fg-3); font-size:11.5px;
  transition:color var(--fast),background var(--fast); }
.folder-tabs button:hover { color:var(--fg-2); background:var(--tint); }
.folder-tabs button[aria-pressed="true"] { color:var(--fg); background:var(--bg-3); }
.folder-tabs button i { width:6px; height:6px; display:inline-block; margin-right:6px; border-radius:50%; background:var(--folder-color,var(--accent)); }
.folder-manage { width:28px; height:28px; display:grid; place-items:center; flex:none; border:1px solid var(--line); border-radius:9px;
  color:var(--fg-3); background:var(--bg-2); font-size:18px; line-height:1; }
.folder-manage:hover { color:var(--fg); border-color:var(--line-2); background:var(--bg-3); }
#list { flex:1; padding:8px; display:flex; flex-direction:column; gap:4px; }
.row { position:relative; min-height:78px; padding:10px; display:grid; grid-template-columns:38px minmax(0,1fr); gap:10px; align-items:start;
  border:1px solid transparent; border-radius:14px; cursor:pointer; contain:content;
  transition:background var(--fast),border-color var(--fast),transform var(--fast); }
.row:hover { background:var(--tint); border-color:var(--line); transform:translateX(2px); }
.row[aria-selected="true"] { background:color-mix(in srgb,var(--accent) 10%,var(--bg-2)); border-color:color-mix(in srgb,var(--accent) 22%,var(--line)); }
.row::before { content:""; position:absolute; left:0; top:13px; bottom:13px; width:3px; border-radius:0 4px 4px 0; background:var(--accent);
  transform:scaleY(0); transition:transform var(--mid) var(--spring); }
.row[aria-selected="true"]::before { transform:scaleY(1); }
.row-avatar { position:relative; isolation:isolate; width:38px; height:38px; min-width:38px; min-height:38px; max-width:38px; max-height:38px; display:grid; place-items:center; border-radius:12px; flex:none;
  color:color-mix(in srgb,var(--accent) 70%,var(--fg)); background:color-mix(in srgb,var(--accent) 13%,var(--bg-3));
  font-size:11px; font-weight:650; text-transform:uppercase; }
.row-avatar .avatar-photo,.title-avatar .avatar-photo { position:absolute !important; inset:0 !important; display:block !important;
  width:100% !important; height:100% !important; min-width:0 !important; min-height:0 !important;
  max-width:100% !important; max-height:100% !important; margin:0 !important; padding:0 !important;
  border-radius:inherit !important; object-fit:cover !important; pointer-events:none !important; }
.avatar-initials { position:relative; z-index:0; }
.row-main { min-width:0; display:grid; gap:4px; }
.who { min-width:0; display:flex; align-items:baseline; gap:8px; }
.row-person { min-width:0; display:flex; align-items:baseline; gap:6px; overflow:hidden; }
.who b { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; font-weight:600; }
.row-person em { overflow:hidden; color:var(--fg-3); font-size:10px; font-style:normal; text-overflow:ellipsis; white-space:nowrap; }
.who small { margin-left:auto; flex:none; color:var(--fg-3); font:400 9.5px/1 var(--mono); }
.snippet { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--fg-3); font-size:11.5px; }
.chips { min-height:18px; display:flex; align-items:center; gap:4px; flex-wrap:wrap; }
.chip { padding:4px 7px; border-radius:var(--r-pill); color:var(--fg-3); background:var(--bg-3); font-size:9.5px; line-height:1; }
.chip.hot { color:var(--danger); background:color-mix(in srgb,var(--danger) 13%,transparent); }
.chip.ai { color:var(--accent-ink); background:color-mix(in srgb,var(--accent) 14%,transparent); }
.row-avatar .dot { position:absolute; top:-1px; right:-1px; width:7px; height:7px; border-radius:50%; background:var(--accent);
  z-index:2; box-shadow:0 0 0 3px var(--bg-1); }

/* Conversation */
.conversation-head { min-height:68px; }
.title-avatar { position:relative; isolation:isolate; width:36px; height:36px; min-width:36px; min-height:36px; max-width:36px; max-height:36px;
  flex:none; display:grid; place-items:center; border-radius:12px;
  color:var(--on-accent); background:linear-gradient(145deg,color-mix(in srgb,var(--accent-solid) 82%,white),var(--accent-solid)); font-size:11px; font-weight:650; }
.title-stack { min-width:0; }
.title-stack .note { display:block; margin-top:2px; }
.thread { flex:1; min-height:0; overflow-y:auto; overscroll-behavior:contain; overflow-anchor:none; scrollbar-gutter:stable;
  padding:24px clamp(18px,3vw,42px); background:
    linear-gradient(var(--tint) 1px,transparent 1px),linear-gradient(90deg,var(--tint) 1px,transparent 1px);
  background-size:32px 32px; background-position:center; }
.thread-inner { width:100%; min-height:100%; display:flex; flex-direction:column; justify-content:flex-end; }
.thread-inner.enter { animation:view-enter var(--mid) var(--ease); }
.msg { max-width:min(64ch,78%); display:flex; flex-direction:column; contain:content; }
.msg.fresh { animation:message-in var(--mid) var(--spring); }
.msg.in { align-self:flex-start; align-items:flex-start; }
.msg.out { align-self:flex-end; align-items:flex-end; }
.msg.note { align-self:center; align-items:center; max-width:60ch; }
.msg + .msg { margin-top:6px; }
.bubble { padding:9px 12px; border:1px solid var(--line); border-radius:15px; background:var(--bg-1); line-height:1.52; white-space:pre-wrap; overflow-wrap:anywhere; }
.msg.in .bubble { border-bottom-left-radius:5px; }
.msg.out .bubble { color:var(--on-accent); border-color:transparent; border-bottom-right-radius:5px;
  background:linear-gradient(140deg,color-mix(in srgb,var(--accent-solid) 90%,white),var(--accent-solid)); }
.msg.note .bubble { color:var(--fg-3); border-style:dashed; background:color-mix(in srgb,var(--warn) 5%,var(--bg-1)); font-size:12px; }
.msg .meta { margin:5px 8px 0; display:flex; align-items:center; gap:8px; color:var(--fg-3); font:400 9.5px/1 var(--mono); }
.act { color:var(--fg-3); opacity:.65; font:500 10px/1 var(--sans); transition:opacity var(--fast),color var(--fast); }
.msg:hover .act { opacity:1; } .act:hover { color:var(--accent-ink); opacity:1; }
.reply-to { max-width:100%; margin-bottom:4px; padding:5px 8px; overflow:hidden; cursor:pointer; border-left:2px solid var(--accent);
  border-radius:7px; color:var(--fg-2); background:var(--tint); font-size:10.5px; transition:background var(--fast); }
.reply-to span { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.reply-to:hover { background:color-mix(in srgb,var(--accent) 12%,transparent); }
.msg.out .reply-to { color:#fff; border-left-color:rgba(255,255,255,.65); background:rgba(255,255,255,.13); }
.bubble .shot { display:block; max-width:min(250px,100%); max-height:300px; margin-top:8px; overflow:hidden; cursor:zoom-in;
  border:1px solid var(--line); border-radius:12px; background:var(--bg-3); contain:paint; }
.bubble .shot img { display:block; width:100%; height:100%; object-fit:contain; opacity:0; transition:opacity var(--mid); }
.bubble .shot img.ready { opacity:1; }
.msg.in .bubble a { color:var(--accent-ink); } .msg.out .bubble a { color:#fff; }
.bubble.skel { position:relative; overflow:hidden; border:0; background:var(--bg-2); }
.bubble.skel::after { content:""; position:absolute; inset:0; transform:translateX(-100%); background:linear-gradient(90deg,transparent,var(--tint),transparent); animation:shimmer 1.1s linear infinite; }
.msg.flash .bubble { animation:message-in var(--mid) var(--spring); }
.lightbox { position:fixed; inset:0; z-index:80; display:grid; place-items:center; padding:24px; cursor:zoom-out;
  background:color-mix(in srgb,var(--bg) 84%,transparent); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); }
.lightbox img { max-width:min(1200px,94vw); max-height:90dvh; border-radius:16px; box-shadow:0 30px 90px rgba(0,0,0,.55); animation:soft-pop var(--mid) var(--spring); }
.lightbox-close { position:fixed; top:max(16px,env(safe-area-inset-top)); right:max(16px,env(safe-area-inset-right)); z-index:1;
  width:42px; height:42px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.22); border-radius:50%;
  color:#fff; background:rgba(10,12,18,.72); font:300 28px/1 var(--sans); cursor:pointer; backdrop-filter:blur(10px); }
.lightbox-close:hover,.lightbox-close:focus-visible { background:rgba(10,12,18,.94); border-color:rgba(255,255,255,.5); }

/* AI suggestion and composer */
.suggest-wrap { flex:none; padding:0 clamp(18px,3vw,42px) 12px; background:var(--bg-1); }
.suggest { overflow:hidden; border:1px solid color-mix(in srgb,var(--accent) 28%,var(--line)); border-radius:15px;
  background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 7%,var(--bg-2)),var(--bg-2)); animation:soft-pop var(--mid) var(--spring); }
.suggest .head { padding:11px 12px 0; display:flex; align-items:center; gap:8px; }
.suggest .head b { color:var(--accent-ink); font-size:9.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.suggest .head span { margin-left:auto; color:var(--fg-3); font:400 9.5px/1 var(--mono); }
.suggest .text { max-height:150px; padding:8px 12px 0; overflow-y:auto; white-space:pre-wrap; }
.suggest .src { padding:6px 12px 0; color:var(--fg-3); font-size:10.5px; }
.suggest .acts { padding:10px 12px 12px; display:flex; gap:7px; }
.gauge { height:2px; background:var(--line); } .gauge i { display:block; height:100%; background:var(--accent); transition:width var(--slow) var(--ease); }
.composer { flex:none; padding:12px clamp(18px,3vw,42px) 16px; border-top:1px solid var(--line); background:var(--bg-1); }
.composer-inner { max-width:920px; margin:0 auto; }
.tools { margin-bottom:8px; display:flex; align-items:center; gap:7px; }
.tools select { width:auto; max-width:190px; }
.wleft { margin-left:auto; color:var(--fg-3); font:400 9.5px/1 var(--mono); }
.composer[data-window="soon"] .wleft { color:var(--warn); } .composer[data-window="closed"] .wleft { color:var(--danger); }
.quoting { margin-bottom:7px; padding:7px 10px; display:flex; align-items:center; gap:8px; border-left:2px solid var(--accent);
  border-radius:9px; color:var(--fg-2); background:var(--tint); animation:slide-in var(--fast) var(--ease); }
.quoting span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.field { display:flex; align-items:flex-end; gap:8px; padding:5px 5px 5px 14px; border:1px solid var(--line-2); border-radius:17px; background:var(--bg-2);
  transition:border-color var(--fast),box-shadow var(--fast),background var(--fast); }
.field:focus-within { border-color:var(--accent); background:var(--bg-1); box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 13%,transparent); }
.field textarea { min-height:26px; max-height:148px; padding:7px 0; border:0; background:transparent; box-shadow:none; }
.field textarea:focus { border:0; background:transparent; box-shadow:none; }
.ring { --p:100; width:34px; height:34px; flex:none; padding:2px; border-radius:50%;
  background:conic-gradient(var(--ring,var(--accent)) calc(var(--p)*1%),var(--line-2) 0); }
.send { width:100%; height:100%; display:grid; place-items:center; border-radius:50%; color:var(--on-accent); background:var(--accent-solid); transition:filter var(--fast),transform var(--fast); }
.send svg { width:16px; height:16px; }
.send:hover:not(:disabled) { filter:brightness(1.12); transform:scale(1.04); }
.send:disabled { color:var(--fg-3); background:var(--bg-3); }
.composer[data-window="soon"] { --ring:var(--warn); } .composer[data-window="closed"] { --ring:var(--danger); }
.composer[data-window="closed"] .ring { --p:0; }
.err { min-height:16px; margin-top:7px; color:var(--danger); font-size:11px; }

/* Context cards */
.context-head { padding:2px 5px 8px; display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.context-head h2 { font-size:17px; font-weight:650; letter-spacing:-.03em; }
.context-head p { margin-top:3px; color:var(--fg-3); font-size:10.5px; }
.context-close { display:none; }
.fold > summary { height:34px; padding:0 7px; display:flex; align-items:center; gap:8px; list-style:none; cursor:pointer;
  color:var(--fg-2); font-size:10px; font-weight:650; letter-spacing:.09em; text-transform:uppercase; }
.fold > summary::-webkit-details-marker { display:none; }
.fold > summary::before { content:""; width:6px; height:6px; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor;
  transform:rotate(-45deg); transition:transform var(--mid) var(--spring); }
.fold[open] > summary::before { transform:rotate(45deg); }
.fold > summary .tag { margin-left:auto; color:var(--fg-3); font:400 9.5px/1 var(--mono); letter-spacing:0; text-transform:none; }
.group { overflow:hidden; border:1px solid var(--line); border-radius:14px; background:var(--bg-2); }
.group.scrolls { max-height:286px; overflow-y:auto; overscroll-behavior:contain; }
.item { min-height:40px; padding:8px 11px; display:flex; align-items:center; gap:10px; flex:0 0 auto; border-bottom:1px solid var(--line); font-size:12px; }
.item:last-child { border-bottom:0; } .item .lbl { color:var(--fg-2); flex:none; }
.item .val { min-width:0; margin-left:auto; overflow-wrap:anywhere; text-align:right; }
.item .ctl { width:auto; min-width:132px; max-width:210px; margin-left:auto; }
.item.col-item { flex-direction:column; align-items:stretch; gap:8px; }
.device { min-height:38px; padding:6px 10px; display:flex; align-items:center; gap:8px; border-bottom:1px solid var(--line); font-size:11.5px; }
.device:last-child { border-bottom:0; } .device .grow { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.device .btn { min-height:27px; padding:0 8px; font-size:10.5px; }
.reveal { animation:view-enter var(--mid) var(--ease); }

/* Secondary pages */
.page { flex:1; min-height:0; padding:28px clamp(20px,4vw,56px); overflow-y:auto; overscroll-behavior:contain; }
.page-inner { width:100%; max-width:1180px; margin:0 auto; }
.narrow { width:100%; max-width:1040px; margin:0 auto; display:grid; gap:34px; }
.cap { padding:0 3px 8px; color:var(--fg-3); font-size:9.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.lab-layout { display:grid; grid-template-columns:minmax(280px,.9fr) minmax(340px,1.1fr); gap:16px; align-items:start; }
.work-card { min-height:390px; padding:20px; display:flex; flex-direction:column; gap:20px; border:1px solid var(--line); border-radius:16px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 4%,var(--bg-2)),var(--bg-2)); }
.work-card-head { display:flex; align-items:flex-start; gap:12px; }
.work-card-head .step { width:30px; height:30px; display:grid; place-items:center; flex:none; border-radius:9px; color:var(--accent-ink);
  background:color-mix(in srgb,var(--accent) 12%,transparent); font:500 10px/1 var(--mono); }
.work-card-head div { display:grid; gap:3px; }
.work-card-head b { font-size:14px; }
.work-card-head div span { color:var(--fg-3); font-size:11px; }
.work-card textarea { min-height:190px; resize:vertical; }
.work-actions { margin-top:auto; display:flex; align-items:center; gap:10px; }
.result-card #labOut { min-height:250px; display:flex; flex-direction:column; }
.result-card #labOut > * { flex:1; }
.settings-section { display:grid; grid-template-columns:205px minmax(0,1fr); gap:28px; align-items:start; }
.section-copy { position:sticky; top:0; }
.section-copy .cap { padding-bottom:5px; }
.section-copy h2 { font-size:15px; letter-spacing:-.02em; }
.section-copy p { margin-top:5px; color:var(--fg-3); font-size:11.5px; line-height:1.5; }
.settings-stack { display:grid; gap:10px; }
.source-folders { overflow:hidden; border:1px solid var(--line); border-radius:16px; background:var(--bg-2); }
.source-folders-head { min-height:56px; padding:12px 14px; display:flex; align-items:center; gap:12px; border-bottom:1px solid var(--line); }
.source-folders-head > div { min-width:0; display:grid; gap:2px; }
.source-folders-head b { font-size:12px; }
.source-folders-head span { color:var(--fg-3); font-size:10px; }
.source-folders-head .btn { margin-left:auto; flex:none; }
.source-list,.folder-list { display:grid; }
.source-row,.folder-row { min-height:52px; padding:10px 14px; display:flex; align-items:center; gap:10px; border-bottom:1px solid var(--line); }
.source-row:last-child,.folder-row:last-child { border-bottom:0; }
.source-row > div,.folder-row > div { min-width:0; display:grid; gap:2px; }
.source-row b,.folder-row b { overflow:hidden; font-size:11.5px; text-overflow:ellipsis; white-space:nowrap; }
.source-row span,.folder-row span { color:var(--fg-3); font-size:9.5px; }
.source-kind,.folder-dot { width:30px; height:30px; display:grid; place-items:center; flex:none; border-radius:10px; color:var(--accent-ink);
  background:color-mix(in srgb,var(--accent) 10%,var(--bg-3)); font:600 9px/1 var(--mono); }
.folder-dot { width:10px; height:10px; border-radius:50%; background:var(--folder-color,var(--accent)); }
.folder-row .btn { min-height:28px; margin-left:auto; padding:0 10px; }
.source-actions { min-width:auto !important; margin-left:auto; display:flex !important; grid-auto-flow:column; align-items:center; justify-content:end; gap:8px; flex:none; }
.source-actions .btn { min-height:28px; padding:0 10px; }
.source-progress { padding:11px 14px; display:grid; gap:4px; border-bottom:1px solid var(--line); background:color-mix(in srgb,var(--warn) 7%,var(--bg-2)); }
.source-progress.ok { background:color-mix(in srgb,var(--ok) 7%,var(--bg-2)); }
.source-progress.danger { background:color-mix(in srgb,var(--danger) 7%,var(--bg-2)); }
.source-progress > div { display:flex; align-items:center; gap:8px; }
.source-progress b { font-size:11px; }
.source-progress span,.source-progress p { color:var(--fg-3); font-size:9.5px; line-height:1.45; }
.source-progress p { margin:0; }
.source-wizard-intro { margin-bottom:13px; padding:11px 12px; display:grid; gap:4px; border:1px solid var(--line); border-radius:11px; background:var(--tint); }
.source-wizard-intro b,.business-guide > b { font-size:12px; }
.source-wizard-intro span,.business-guide p { color:var(--fg-3); font-size:10px; line-height:1.5; }
.source-readonly { margin-top:10px; padding:10px 12px; display:flex; align-items:center; gap:10px; border:1px solid var(--line); border-radius:11px; background:var(--bg-2); }
.source-readonly input { width:16px; min-height:16px; accent-color:var(--accent); }
.source-readonly span { display:grid; gap:2px; }
.source-readonly b { font-size:11px; }
.source-readonly small { color:var(--fg-3); font-size:9.5px; }
.business-guide { display:grid; gap:10px; }
.business-guide ol { margin:0; padding-left:20px; display:grid; gap:7px; color:var(--fg-2); font-size:10.5px; line-height:1.45; }
.business-guide ul { margin:0; padding:0; display:grid; gap:6px; list-style:none; }
.business-guide li { padding:9px 11px; display:grid; gap:2px; border:1px solid var(--line); border-radius:10px; background:var(--bg-2); }
.business-guide li b { font-size:10.5px; }
.business-guide li span { color:var(--fg-3); font:400 9px/1.4 var(--mono); }
.service-profile-copy { margin-bottom:12px; padding:10px 12px; display:grid; gap:2px; border:1px solid var(--line); border-radius:10px; background:var(--tint); }
.service-profile-copy b { font-size:12px; }
.service-profile-copy span { overflow:hidden; color:var(--fg-3); font:400 9.5px/1.4 var(--mono); text-overflow:ellipsis; white-space:nowrap; }
.folder-checks { display:grid; grid-template-columns:1fr 1fr; gap:7px; }
.folder-check { min-height:42px; padding:8px 10px; display:flex; align-items:center; gap:9px; border:1px solid var(--line); border-radius:10px; background:var(--bg-2); }
.folder-check input { width:16px; min-height:16px; accent-color:var(--accent); }
.folder-check span { min-width:0; display:grid; }
.folder-check b { overflow:hidden; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.folder-check small { color:var(--fg-3); font-size:9px; }
.settings-hint { padding:9px 12px 0; }
.save-state { display:flex; align-items:center; gap:7px; }
.save-state i { width:7px; height:7px; border-radius:50%; background:var(--fg-3); opacity:.42; transition:background var(--fast),opacity var(--fast),transform var(--fast); }
.save-state[data-state="saving"] i { background:var(--warn); opacity:1; animation:pulse-live 1.1s ease-in-out infinite; }
.save-state[data-state="saved"] i { background:var(--ok); opacity:1; }
.save-state[data-state="error"] i { background:var(--danger); opacity:1; }
.appearance-panel { overflow:hidden; border:1px solid var(--line); border-radius:16px; background:var(--bg-2); }
.appearance-panel > header { min-height:52px; padding:11px 14px; display:flex; flex-direction:column; justify-content:center; border-bottom:1px solid var(--line); }
.appearance-panel > header b { font-size:12px; }
.appearance-panel > header span { margin-top:2px; color:var(--fg-3); font-size:10px; }
.settings-content { display:grid; gap:14px; }
.settings-cluster { overflow:hidden; border:1px solid var(--line); border-radius:16px; background:var(--bg-2); }
.settings-cluster-head { min-height:64px; padding:12px 15px; display:flex; align-items:center; gap:11px; border-bottom:1px solid var(--line); }
.cluster-mark { width:30px; height:30px; display:grid; place-items:center; flex:none; border-radius:10px;
  background:color-mix(in srgb,var(--accent) 10%,var(--bg-3)); }
.cluster-mark::after { content:""; width:9px; height:9px; border:2px solid var(--accent-ink); border-radius:3px; transform:rotate(45deg); }
[data-cluster="limits"] .cluster-mark::after { border-radius:50%; }
[data-cluster="models"] .cluster-mark::after { width:12px; height:7px; border-width:1.5px; border-radius:2px; transform:none; }
[data-cluster="voice"] .cluster-mark::after { width:12px; height:9px; border-width:1.5px; border-radius:5px 5px 5px 1px; transform:none; }
.settings-cluster-head h3 { font-size:13px; letter-spacing:-.015em; }
.settings-cluster-head p { margin-top:2px; color:var(--fg-3); font-size:10.5px; }
.settings-panel { display:grid; }
.setting-row { padding:13px 15px; border-bottom:1px solid var(--line); transition:background var(--fast),opacity var(--fast); }
.setting-row:last-child { border-bottom:0; }
.setting-row:hover { background:var(--tint); }
.setting-main { display:grid; grid-template-columns:minmax(190px,1fr) minmax(220px,320px); align-items:center; gap:18px; }
.setting-label { color:var(--fg-2); font-size:11.5px; line-height:1.4; }
.setting-control { min-width:0; display:flex; align-items:center; justify-content:flex-end; gap:7px; }
.setting-control .ctl { min-width:0; max-width:320px; }
.setting-control:has(.model-pick) { display:grid; grid-template-columns:minmax(0,1fr) auto; }
.model-pick { padding:0 10px; }
.setting-meta { min-height:24px; margin-top:6px; display:flex; align-items:center; gap:7px; }
.setting-badge { margin-left:auto; padding:4px 7px; border-radius:var(--r-pill); color:var(--warn);
  background:color-mix(in srgb,var(--warn) 10%,transparent); font-size:9px; }
.setting-row.is-inactive .setting-main { opacity:.58; }
.setting-row.is-saving { background:color-mix(in srgb,var(--accent) 5%,var(--bg-2)); }
.setting-row .why-text { margin-top:5px; padding:9px 10px; border-left:2px solid var(--accent); border-radius:8px; background:var(--tint); line-height:1.55; }
.copy-settings { grid-template-columns:1fr 1fr; }
.copy-setting { min-width:0; padding:15px; display:flex; flex-direction:column; gap:8px; }
.copy-setting + .copy-setting { border-left:1px solid var(--line); }
.copy-setting-head { display:flex; align-items:baseline; gap:9px; }
.copy-setting-head label { color:var(--fg-2); font-size:11.5px; font-weight:600; }
.copy-setting-head span { margin-left:auto; color:var(--fg-3); font-size:9px; }
.copy-setting textarea { min-height:104px; resize:vertical; }
.copy-setting .btn { align-self:flex-start; margin-top:auto; }
.health-grid { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.update-panel { min-height:82px; display:flex; align-items:center; justify-content:space-between; gap:18px; padding:18px 20px; border:1px solid var(--line); border-radius:var(--r-lg); background:var(--surface); }
.update-panel > div { display:grid; gap:6px; }
.update-panel > div > b { color:var(--fg); font-size:14px; }
.update-panel .btn { flex:none; }
.health-card { --health-tone:var(--fg-3); min-height:64px; padding:11px 12px; display:flex; align-items:center; gap:11px; overflow:hidden;
  border:1px solid var(--line); border-radius:13px; background:var(--bg-2); }
.health-status { width:30px; height:30px; display:grid; place-items:center; flex:none; border-radius:10px;
  background:color-mix(in srgb,var(--health-tone) 9%,var(--bg-3)); }
.health-status i { width:7px; height:7px; border-radius:50%; background:var(--health-tone); box-shadow:0 0 0 4px color-mix(in srgb,var(--health-tone) 12%,transparent); }
.health-card > div { min-width:0; display:grid; gap:2px; }
.health-card b { color:var(--fg-2); font-size:10.5px; }
.health-card div span { overflow:hidden; color:var(--fg-3); font-size:9.5px; line-height:1.4; text-overflow:ellipsis; white-space:nowrap; }
.health-card.ok { --health-tone:var(--ok); } .health-card.warn { --health-tone:var(--warn); }
.health-card.error { --health-tone:var(--danger); } .health-card.accent { --health-tone:var(--accent-ink); }
.health-card.neutral,.health-card.off { --health-tone:var(--fg-3); }
.health-action { grid-column:1/-1; min-height:68px; padding:12px 14px; display:flex; align-items:center; gap:14px;
  border:1px solid var(--line); border-radius:13px; background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 5%,var(--bg-2)),var(--bg-2)); }
.health-action > div { min-width:0; display:grid; gap:2px; }
.health-action b { font-size:11px; } .health-action span { color:var(--fg-3); font-size:9.5px; }
.health-action .btn { margin-left:auto; flex:none; }

/* Servers */
.nodes-shell { display:grid; gap:16px; }
.nodes-alert { min-height:62px; padding:12px 14px; display:flex; align-items:center; gap:12px; border:1px solid color-mix(in srgb,var(--warn) 28%,var(--line));
  border-radius:14px; background:color-mix(in srgb,var(--warn) 7%,var(--bg-2)); }
.nodes-alert-icon { width:30px; height:30px; display:grid; place-items:center; flex:none; border-radius:9px; color:var(--warn);
  background:color-mix(in srgb,var(--warn) 13%,transparent); font-weight:700; }
.nodes-alert > div { min-width:0; display:grid; gap:2px; }
.nodes-alert b { font-size:12px; }
.nodes-alert span:last-child { color:var(--fg-3); font-size:10.5px; overflow-wrap:anywhere; }
.nodes-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.node-kpi { position:relative; min-height:132px; padding:16px; display:grid; grid-template-columns:38px minmax(0,1fr); grid-template-rows:auto auto auto;
  column-gap:12px; overflow:hidden; border:1px solid var(--line); border-radius:16px; background:var(--bg-2); }
.node-kpi::after { content:""; position:absolute; right:-24px; bottom:-34px; width:92px; height:92px; border-radius:50%;
  background:color-mix(in srgb,var(--tone,var(--fg-3)) 8%,transparent); pointer-events:none; }
.node-kpi-icon { grid-row:1/4; width:38px; height:38px; display:grid; place-items:center; border-radius:12px;
  color:var(--tone,var(--fg-2)); background:color-mix(in srgb,var(--tone,var(--fg-2)) 11%,var(--bg-3)); }
.node-kpi-icon svg { width:19px; height:19px; }
.node-kpi strong { align-self:end; color:var(--fg); font-size:28px; line-height:1; letter-spacing:-.045em; font-variant-numeric:tabular-nums; }
.node-kpi > span:not(.node-kpi-icon) { margin-top:7px; color:var(--fg-2); font-size:11px; }
.node-kpi small { margin-top:2px; color:var(--fg-3); font-size:9.5px; }
.node-kpi.online { --tone:var(--ok); } .node-kpi.danger { --tone:var(--danger); }
.node-kpi.accent { --tone:var(--accent-ink); background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 7%,var(--bg-2)),var(--bg-2)); }
.node-kpi.quiet { --tone:var(--fg-3); }
.nodes-panel { overflow:hidden; border:1px solid var(--line); border-radius:16px; background:var(--bg-2); }
.nodes-panel-head { min-height:72px; padding:14px 16px; display:flex; align-items:center; gap:16px; border-bottom:1px solid var(--line); }
.nodes-panel-head > div { min-width:0; }
.nodes-panel-head h2 { font-size:14px; letter-spacing:-.02em; }
.nodes-panel-head p { margin-top:3px; color:var(--fg-3); font-size:10.5px; }
.nodes-panel-head > span { margin-left:auto; flex:none; color:var(--fg-3); font:400 9.5px/1 var(--mono); }
.node-table-head,.node-row { display:grid; grid-template-columns:minmax(250px,1.55fr) 130px 105px 128px; align-items:center; }
.node-table-head { min-height:38px; padding:0 16px; color:var(--fg-3); background:color-mix(in srgb,var(--bg-3) 48%,var(--bg-2));
  font-size:9px; font-weight:650; letter-spacing:.08em; text-transform:uppercase; }
.node-row { min-height:86px; padding:11px 16px; border-top:1px solid var(--line); transition:background var(--fast),border-color var(--fast); }
.node-table-head + .node-row { border-top:0; }
.node-row:hover { background:var(--tint); }
.node-row.offline { background:color-mix(in srgb,var(--danger) 3.5%,var(--bg-2)); }
.node-cell { min-width:0; padding-right:12px; }
.node-identity { display:grid; grid-template-columns:34px minmax(0,1fr); align-items:center; gap:11px; }
.node-country { width:34px; height:34px; display:grid; place-items:center; border:1px solid var(--line); border-radius:10px; color:var(--fg-2);
  background:var(--bg-3); font:500 19px/1 sans-serif; letter-spacing:0; }
.node-name { position:relative; min-width:0; display:grid; gap:3px; }
.node-alias-field { min-width:0; display:flex; align-items:center; gap:9px; }
.node-alias-field > span { width:64px; flex:none; color:var(--fg-3); font-size:9.5px; }
.node-alias-field input { min-width:0; height:32px; min-height:32px; padding:0 8px; border-color:transparent; background:transparent; font-size:12px; font-weight:600; }
.node-alias-field input:hover,.node-alias-field input:focus,.node-alias-field input.is-dirty { border-color:var(--line-2); background:var(--bg-1); }
.node-alias-field input.is-dirty { border-color:var(--warn); }
.node-alias-field input.is-saved { border-color:var(--ok); }
.node-alias-field input.is-error { border-color:var(--danger); }
.node-alias-field input.is-saving { opacity:.68; }
.node-raw { max-width:100%; padding-left:73px; overflow:hidden; color:var(--fg-3); font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.node-alias-feedback { position:absolute; right:0; bottom:-13px; color:var(--fg-3); font-size:8.5px; }
.node-status { width:max-content; min-height:27px; padding:0 9px; display:inline-flex; align-items:center; gap:7px; border:1px solid var(--line);
  border-radius:var(--r-pill); color:var(--fg-2); background:var(--bg-1); font-size:10.5px; }
.node-status i { width:6px; height:6px; border-radius:50%; background:var(--fg-3); }
.node-status.online { color:var(--ok); border-color:color-mix(in srgb,var(--ok) 24%,var(--line)); background:color-mix(in srgb,var(--ok) 7%,var(--bg-1)); }
.node-status.online i { background:var(--ok); }
.node-status.offline { color:var(--danger); border-color:color-mix(in srgb,var(--danger) 25%,var(--line)); background:color-mix(in srgb,var(--danger) 7%,var(--bg-1)); }
.node-status.offline i { background:var(--danger); }
.node-status.disabled i { background:var(--fg-3); }
.node-metric { display:grid; gap:2px; }
.node-metric strong { color:var(--fg-2); font:600 11px/1.2 var(--mono); }
.node-metric span { color:var(--fg-3); font-size:9px; }
.nodes-state { min-height:330px; padding:36px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center;
  border:1px solid var(--line); border-radius:16px; background:var(--bg-2); }
.nodes-state .state-icon { width:48px; height:48px; margin-bottom:14px; display:grid; place-items:center; border-radius:15px; color:var(--fg-3); background:var(--bg-3); font-size:18px; }
.nodes-state h2 { font-size:15px; } .nodes-state p { max-width:48ch; margin-top:6px; color:var(--fg-3); font-size:11.5px; }
.nodes-state .btn { margin-top:16px; }
.error-state .state-icon { color:var(--danger); background:color-mix(in srgb,var(--danger) 10%,var(--bg-3)); }
.nodes-refresh.is-loading svg { animation:spin .8s linear infinite; }
.nodes-loading { display:grid; gap:16px; }
.skeleton-card,.skeleton-panel { position:relative; overflow:hidden; }
.skeleton-card::before,.skeleton-panel::before { content:""; position:absolute; inset:0; transform:translateX(-100%);
  background:linear-gradient(90deg,transparent,var(--tint),transparent); animation:shimmer 1.1s linear infinite; }
.skeleton-panel { min-height:300px; padding:20px; display:grid; align-content:start; gap:12px; }
.skeleton-panel i { display:block; height:54px; border-radius:10px; background:var(--bg-3); }
.grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:12px; align-content:start; }
.doc { min-height:145px; padding:16px; display:flex; flex-direction:column; gap:8px; border:1px solid var(--line); border-radius:15px;
  background:var(--bg-2); contain:content; transition:transform var(--fast),border-color var(--fast),background var(--fast); }
.doc:hover { transform:translateY(-3px); border-color:color-mix(in srgb,var(--accent) 30%,var(--line)); background:color-mix(in srgb,var(--accent) 5%,var(--bg-2)); }
.doc b { font-size:14px; font-weight:650; line-height:1.35; overflow-wrap:anywhere; }
.doc .acts { margin-top:auto; padding-top:8px; display:flex; gap:7px; flex-wrap:wrap; }
.kpis { margin-bottom:24px; display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:12px; }
.kpi { min-height:118px; padding:18px; display:flex; flex-direction:column; justify-content:flex-end; border:1px solid var(--line); border-radius:15px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 5%,var(--bg-2)),var(--bg-2)); }
.kpi b { font-size:30px; line-height:1; font-weight:650; letter-spacing:-.05em; font-variant-numeric:tabular-nums; }
.kpi > span { margin-top:9px; color:var(--fg-2); font-size:11px; }
.kpi .sub { margin-top:3px; color:var(--fg-3); font:400 9.5px/1.3 var(--mono); }
.bars { height:150px; padding:16px 12px 8px; display:flex; align-items:flex-end; gap:4px; border:1px solid var(--line); border-radius:15px; background:var(--bg-2); }
.bars .col2 { min-width:0; height:100%; flex:1; display:flex; flex-direction:column; justify-content:flex-end; gap:2px; }
.bars .col2 i { display:block; border-radius:4px 4px 0 0; transform-origin:bottom; animation:grow-y var(--slow) var(--ease); }
.bars .col2 i.in { background:var(--accent); } .bars .col2 i.out { background:var(--fg-3); opacity:.48; }
.bars .col2 span { overflow:hidden; white-space:nowrap; color:var(--fg-3); text-align:center; font:400 8.5px/1 var(--mono); }
.legend { padding:8px 3px 0; display:flex; gap:16px; color:var(--fg-3); font-size:10.5px; }
.legend i { display:inline-block; width:8px; height:8px; margin-right:5px; border-radius:2px; }
.split2 { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:16px; }
.meter { min-height:38px; padding:8px 11px; display:flex; align-items:center; gap:9px; border-bottom:1px solid var(--line); font-size:11.5px; }
.meter:last-child { border-bottom:0; } .meter .track { height:6px; flex:1; overflow:hidden; border-radius:var(--r-pill); background:var(--bg-3); }
.meter .track i { display:block; height:100%; border-radius:inherit; background:var(--accent); transform-origin:left; animation:grow-x var(--slow) var(--ease); }
.meter b { min-width:34px; text-align:right; font:600 11px/1 var(--mono); }
table { width:100%; overflow:hidden; border:1px solid var(--line); border-radius:14px; border-collapse:collapse; background:var(--bg-2); font-size:12px; }
th,td { padding:9px 11px; border-bottom:1px solid var(--line); text-align:left; }
th { color:var(--fg-3); font-size:9px; letter-spacing:.09em; text-transform:uppercase; } tr:last-child td { border-bottom:0; }

/* Shared layout for diagnostics, team and queue screens. These selectors
   used to exist only in the disabled legacy stylesheet. */
.ops-head { margin:24px 0 12px; display:flex; align-items:flex-end; justify-content:space-between; gap:12px; }
.ops-head:first-child { margin-top:0; }
.ops-head > div { min-width:0; display:grid; gap:3px; }
.ops-head b,.ops-head h2 { margin:0; font-size:14px; line-height:1.3; font-weight:650; letter-spacing:-.015em; }
.ops-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px; }
.ops-card { min-width:0; padding:16px; display:grid; align-content:start; gap:12px; border:1px solid var(--line);
  border-radius:15px; background:var(--bg-2); }
.ops-card.overdue { border-color:color-mix(in srgb,var(--danger) 50%,var(--line)); }
.ops-card header { display:flex; align-items:flex-start; justify-content:space-between; gap:9px; }
.ops-card header b { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ops-card .meta { display:flex; flex-wrap:wrap; gap:6px 12px; color:var(--fg-3); font-size:10.5px; }
.ops-table { min-width:680px; }
.ops-table td:last-child { text-align:right; }
.ops-actions { display:flex; justify-content:flex-end; align-items:center; gap:8px; flex-wrap:wrap; }
.badge { display:inline-flex; align-items:center; width:max-content; max-width:100%; padding:4px 8px; border-radius:var(--r-pill);
  color:var(--fg-2); background:var(--bg-3); font:510 10.5px/1 var(--sans); }
.badge.danger { color:var(--danger); background:color-mix(in srgb,var(--danger) 13%,transparent); }
.badge.ok { color:var(--ok); background:color-mix(in srgb,var(--ok) 13%,transparent); }
.sla-panel { margin-bottom:24px; border:1px solid var(--line); border-radius:15px; background:var(--bg-2); }
.sla-panel > summary { padding:16px; display:flex; align-items:center; gap:12px; cursor:pointer; list-style:none; }
.sla-panel > summary::-webkit-details-marker { display:none; }
.sla-panel > summary::after { content:'⌄'; margin-left:auto; color:var(--fg-3); transition:transform var(--fast); }
.sla-panel[open] > summary::after { transform:rotate(180deg); }
.sla-panel > summary > div { display:grid; gap:3px; }
.sla-panel > summary p { max-width:72ch; margin:0; color:var(--fg-3); font-size:11px; }
.sla-panel-body { padding:0 16px 16px; }
.sla-card .frow { grid-template-columns:minmax(0,1fr) 96px; align-items:center; }
.sla-card .frow label { font-size:11px; }
.sla-card input { width:96px; }
.sla-unit { color:var(--fg-3); font-size:9.5px; }
.team-intro { margin-bottom:20px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.team-intro > div { display:grid; gap:5px; }
.team-intro p { margin:0; color:var(--fg-3); font-size:11px; }
.stats-tools { margin-bottom:16px; display:flex; justify-content:space-between; align-items:center; gap:12px; }
.stats-tools p { margin:0; color:var(--fg-3); font-size:11px; }
.themes { padding:14px; display:grid; grid-template-columns:repeat(auto-fit,minmax(142px,1fr)); gap:10px; }
.theme-card { position:relative; overflow:hidden; min-width:0; border:1px solid var(--line); border-radius:13px; color:var(--fg);
  background:var(--bg-1); text-align:left; transition:transform var(--fast),border-color var(--fast),box-shadow var(--fast); }
.theme-card:hover { transform:translateY(-2px); border-color:var(--line-2); }
.theme-card[aria-pressed="true"] { border-color:var(--accent); box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 20%,transparent); }
.theme-preview { height:68px; padding:8px; display:grid; grid-template-columns:16px 38% minmax(0,1fr); gap:5px; background:var(--bg); }
.preview-rail { border-radius:5px; background:var(--bg-1); }
.preview-rail::before { content:""; display:block; width:7px; height:7px; margin:7px auto; border-radius:3px; background:var(--accent); }
.preview-list,.preview-chat { min-width:0; padding:6px 5px; display:flex; flex-direction:column; gap:5px; border:1px solid var(--line); border-radius:6px; background:var(--bg-1); }
.preview-list i { width:100%; height:6px; border-radius:3px; background:var(--bg-3); }
.preview-list i:nth-child(2) { background:color-mix(in srgb,var(--accent) 18%,var(--bg-3)); }
.preview-chat { justify-content:center; background:var(--bg-2); }
.preview-chat i { width:74%; height:8px; border-radius:5px; background:var(--bg-3); }
.preview-chat i:last-child { margin-left:auto; background:var(--accent-solid); }
.theme-meta { min-height:50px; padding:8px 9px; display:flex; align-items:center; gap:8px; border-top:1px solid var(--line); background:var(--bg-1); }
.theme-meta > span { min-width:0; display:grid; gap:2px; }
.theme-meta b { color:var(--fg); font-size:11.5px; font-weight:650; }
.theme-meta small { overflow:hidden; color:var(--fg-3); font-size:9.5px; text-overflow:ellipsis; white-space:nowrap; }
.theme-check { width:20px; height:20px; margin-left:auto; display:grid; place-items:center; flex:none; border-radius:7px; color:transparent;
  background:var(--bg-3); font-size:11px; font-style:normal; transition:color var(--fast),background var(--fast),transform var(--fast); }
.theme-card[aria-pressed="true"] .theme-check { color:var(--on-accent); background:var(--accent-solid); transform:scale(1.04); }
.swatches { padding:13px; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.swatch { min-width:0; height:36px; padding:0 9px; display:flex; align-items:center; gap:7px; border:1px solid var(--line); border-radius:10px;
  color:var(--fg-2); background:var(--bg-1); font-size:10.5px; transition:transform var(--fast),border-color var(--fast),background var(--fast); }
.swatch i { width:12px; height:12px; flex:none; border-radius:50%; background:var(--swatch); box-shadow:0 0 0 3px color-mix(in srgb,var(--swatch) 14%,transparent); }
.swatch span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.swatch:hover { transform:translateY(-1px); border-color:var(--line-2); }
.swatch[aria-pressed="true"] { color:var(--fg); border-color:var(--accent); background:color-mix(in srgb,var(--accent) 8%,var(--bg-1));
  box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 16%,transparent); }

/* Shared feedback and dialogs */
.hint { color:var(--fg-3); font-size:11.5px; }
.empty { max-width:36ch; margin:auto; padding:42px 24px; color:var(--fg-3); text-align:center; font-size:12px; }
.empty-thread { display:flex; flex-direction:column; align-items:center; gap:7px; }
.empty-thread b { color:var(--fg-2); font-size:14px; }
.empty-mark { width:46px; height:46px; margin-bottom:7px; display:grid; place-items:center; border:1px solid var(--line); border-radius:15px;
  color:var(--accent-ink); background:color-mix(in srgb,var(--accent) 8%,var(--bg-2)); }
.empty-mark svg { width:22px; height:22px; }
.why { align-self:flex-start; padding:4px 8px; border:1px solid var(--line); border-radius:var(--r-pill); color:var(--fg-3); font-size:10.5px; }
.why:hover,.why[aria-expanded="true"] { color:var(--accent-ink); border-color:color-mix(in srgb,var(--accent) 35%,var(--line)); }
.why-text { display:none; } .why-text.open { display:block; animation:view-enter var(--fast) var(--ease); }
.log { max-height:220px; padding:12px; overflow-y:auto; white-space:pre-wrap; border:1px solid var(--line); border-radius:11px;
  color:var(--fg-2); background:var(--bg-2); font:400 10.5px/1.7 var(--mono); }
.frow { display:grid; gap:5px; } .frow label { color:var(--fg-3); font-size:10.5px; }
.backdrop { position:fixed; inset:0; z-index:60; display:grid; place-items:center; padding:20px;
  background:color-mix(in srgb,var(--bg) 64%,transparent); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); }
.sheet { width:min(640px,100%); max-height:86dvh; display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--line-2);
  border-radius:20px; background:var(--bg-1); box-shadow:0 30px 90px rgba(0,0,0,.42); animation:soft-pop var(--mid) var(--spring); }
.sheet header { min-height:58px; padding:10px 16px; flex:none; display:flex; align-items:center; gap:8px; border-bottom:1px solid var(--line); }
.sheet header b { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px; font-weight:650; }
.sheet .body { min-height:0; padding:16px; display:grid; gap:12px; overflow-y:auto; }
.sheet .foot { flex:none; padding:12px 16px; display:flex; justify-content:flex-end; gap:8px; border-top:1px solid var(--line); }
.sheet textarea { min-height:300px; font:400 11.5px/1.55 var(--mono); }
.toast { position:fixed; z-index:70; left:50%; bottom:24px; transform:translateX(-50%); max-width:min(520px,calc(100vw - 32px));
  padding:10px 16px; border:1px solid var(--glass-edge); border-radius:var(--r-pill); color:var(--fg); background:var(--glass);
  backdrop-filter:blur(18px) saturate(150%); -webkit-backdrop-filter:blur(18px) saturate(150%);
  box-shadow:0 14px 42px rgba(0,0,0,.35); animation:soft-pop var(--mid) var(--spring); }

@media (max-width:1240px) {
  .app { grid-template-columns:clamp(190px,16vw,225px) minmax(0,1fr); grid-template-areas:"side main"; }
  .app::after { content:""; position:fixed; inset:0; z-index:29; background:color-mix(in srgb,var(--bg) 55%,transparent);
    opacity:0; pointer-events:none; transition:opacity var(--mid) var(--ease); }
  .app[data-inspector="open"]::after { opacity:1; pointer-events:auto; }
  .app[data-context="off"]::after { display:none; }
  .context { display:flex; position:fixed; z-index:30; top:10px; right:10px; bottom:10px; width:min(370px,calc(100vw - 24px));
    transform:translateX(calc(100% + 24px)); opacity:0; pointer-events:none;
    box-shadow:0 30px 90px rgba(0,0,0,.38); transition:transform var(--slow) var(--spring),opacity var(--mid) var(--ease); }
  .app[data-inspector="open"] .context { transform:translateX(0); opacity:1; pointer-events:auto; }
  .inspector-toggle,.context-close { display:grid; }
  .context .grip { display:none; }
  .split { --w-list:clamp(290px,30vw,380px); }
}
@media (min-width:821px) and (max-width:1000px) {
  .app,.app[data-context="off"] { grid-template-columns:72px minmax(0,1fr); }
  .sidebar { padding:8px; }
  .sidebar .brand { justify-content:center; padding:0; }
  .sidebar .brand-copy,.sidebar .pulse,.sidebar .side-cap,.sidebar .board,.sidebar .foot,.sidebar .grow,.sidebar .grip { display:none; }
  .nav { height:42px; padding:0; justify-content:center; }
  .nav:hover { transform:none; }
  .nav .nav-label { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
  .nav .count { position:absolute; top:2px; right:2px; min-width:16px; height:16px; padding:0 4px; }
  .sidebar-foot { margin-top:auto; padding:3px; justify-content:center; border:0; }
  .node-table-head,.node-row { grid-template-columns:minmax(220px,1.5fr) 116px 88px 108px; }
}
@media (max-width:820px) {
  .app,.app[data-context="off"] { padding:6px; grid-template-columns:1fr; grid-template-rows:minmax(0,1fr) calc(62px + env(safe-area-inset-bottom)); grid-template-areas:"main" "side"; gap:6px; }
  .sidebar { padding:5px 5px calc(5px + env(safe-area-inset-bottom)); flex-direction:row; align-items:center; overflow:hidden; }
  .sidebar .brand,.sidebar .side-cap,.sidebar .grow,.sidebar .board,.sidebar .foot,.sidebar .grip,.sidebar-foot { display:none; }
  .nav { min-width:0; height:50px; padding:4px 2px; flex:1 1 0; flex-direction:column; justify-content:center; gap:3px; font-size:9px; }
  .nav-label { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .nav:hover { transform:none; } .nav::before { left:50%; top:0; width:18px; height:3px; transform:translateX(-50%) scaleX(0); }
  .nav[aria-current="true"]::before { transform:translateX(-50%) scaleX(1); }
  .nav .glyph { width:16px; height:16px; } .nav .count { position:absolute; top:4px; right:6px; min-width:16px; height:16px; padding:0 4px; }
  .split { --w-list:310px; }
  .page { padding:20px 14px; }
  .lab-layout { grid-template-columns:1fr; }
  .work-card { min-height:340px; }
  .settings-section { grid-template-columns:1fr; gap:12px; }
  .section-copy { position:static; }
  .nodes-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .gate-shell { grid-template-columns:1fr; max-width:420px; }
  .gate-story { display:none; }
}
@media (max-width:760px) {
  .split { grid-template-columns:1fr; }
  .split:not([data-pane="thread"]) .col:not(.left) { display:none; }
  .split[data-pane="thread"] .col.left { display:none; }
  .mobile-back { display:grid; }
  .conversation-head { min-height:60px; padding:8px 12px; }
  .thread { padding:18px 12px; }
  .msg { max-width:min(72ch,90%); }
  .composer { padding:9px 10px 12px; }
  .suggest-wrap { padding:0 10px 10px; }
  .bar { min-height:54px; padding:8px 12px; }
  .bar .note { display:none; }
  .view:not(#view-inbox) > .bar { min-height:64px; }
  #view-kb > .bar { min-height:108px; align-content:center; flex-wrap:wrap; }
  #view-kb > .bar .right { width:100%; margin-left:0; overflow-x:auto; }
  .page-icon { width:34px; height:34px; }
  .queue-head { min-height:88px; }
  .kpis { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .kpi { min-height:104px; padding:13px; }
  .kpi b { font-size:25px; }
  .sheet { max-height:92dvh; }
  .gate-card { padding:34px 24px; }
  .context { top:auto; left:6px; right:6px; bottom:calc(74px + env(safe-area-inset-bottom)); width:auto; max-height:min(76dvh,720px);
    transform:translateY(calc(100% + 90px)); border-radius:20px; }
  .app[data-inspector="open"] .context { transform:translateY(0); }
  .composer { padding-bottom:calc(12px + env(safe-area-inset-bottom)); }
  .tools select { max-width:150px; }
  .btn,.icon-btn,.mobile-back,input[type=text],input[type=password],select { min-height:40px; }
  .node-table-head { display:none; }
  .node-row { min-height:0; padding:14px; grid-template-columns:repeat(3,minmax(0,1fr)); gap:13px; }
  .node-identity { grid-column:1/-1; padding-right:0; }
  .node-cell { padding-right:0; }
  .node-cell[data-label]::before { content:attr(data-label); display:block; margin-bottom:6px; color:var(--fg-3); font-size:8.5px; letter-spacing:.07em; text-transform:uppercase; }
  .node-status { min-height:25px; }
  .nodes-panel-head { min-height:66px; padding:12px 14px; }
  .setting-main { grid-template-columns:1fr; gap:8px; }
  .setting-control,.setting-control .ctl { width:100%; max-width:none; justify-content:stretch; }
  .copy-settings { grid-template-columns:1fr; }
  .copy-setting + .copy-setting { border-left:0; border-top:1px solid var(--line); }
  .settings-cluster-head { padding:11px 13px; }
}
@media (max-width:460px) {
  .bar-title .page-icon { display:none; }
  .bar h1 { font-size:14px; }
  .seg button { min-width:0; padding:0 8px; }
  .queue-top { align-items:flex-end; }
  .queue-top h2 { font-size:17px; }
  .row { min-height:76px; }
  .kpis { grid-template-columns:1fr 1fr; gap:8px; }
  .stats-range button { padding:0 6px; }
  .gate { padding:12px; }
  .swatches { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .nodes-summary { gap:8px; }
  .node-kpi { min-height:112px; padding:12px; grid-template-columns:32px minmax(0,1fr); column-gap:9px; }
  .node-kpi-icon { width:32px; height:32px; }
  .node-kpi strong { font-size:24px; }
  .node-row { grid-template-columns:1fr 1fr; }
  .node-state-cell { grid-column:1/-1; }
  .node-alias-field { align-items:flex-start; flex-direction:column; gap:4px; }
  .node-alias-field > span { width:auto; }
  .node-raw { padding-left:0; }
  .node-alias-feedback { bottom:-12px; }
  .nodes-panel-head > span { display:none; }
  .health-grid { grid-template-columns:1fr; }
  .health-action { grid-column:1; align-items:flex-start; flex-direction:column; }
  .health-action .btn { width:100%; margin-left:0; }
  .theme-preview { height:62px; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior:auto !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}