/* Jarvis app (4.8.3 r6). A dim listening room: slate, warm paper text, one brass accent. Private topics carry a violet seal. */
@font-face{font-family:'Onest';font-style:normal;font-display:swap;font-weight:100 900;src:url(/app/onest-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Onest';font-style:normal;font-display:swap;font-weight:100 900;src:url(/app/onest-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Onest';font-style:normal;font-display:swap;font-weight:100 900;src:url(/app/onest-cyrillic.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Onest';font-style:normal;font-display:swap;font-weight:100 900;src:url(/app/onest-cyrillic-ext.woff2) format('woff2');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}
@font-face{font-family:'Noto Sans Georgian';font-style:normal;font-display:swap;font-weight:400;src:url(/app/noto-georgian-400.woff2) format('woff2');unicode-range:U+0589,U+10A0-10FF,U+1C90-1CBA,U+1CBD-1CBF,U+205A,U+2D00-2D2F,U+2E31}
@font-face{font-family:'Noto Sans Georgian';font-style:normal;font-display:swap;font-weight:600;src:url(/app/noto-georgian-600.woff2) format('woff2');unicode-range:U+0589,U+10A0-10FF,U+1C90-1CBA,U+1CBD-1CBF,U+205A,U+2D00-2D2F,U+2E31}

:root{
  --bg:#161B26;--panel:#1C2230;--raise:#252D3D;--sunk:#121722;--ink:#ECE7DC;--soft:#C9C4B9;--mute:#949DB0;--line:#2E374A;
  --brass:#D2A84B;--brass-ink:#1B1608;--brass-soft:rgba(210,168,75,.14);--seal:#A08CDD;--seal-soft:rgba(160,140,221,.14);
  --danger:#E58A78;--ok:#86C495;--focus:#E6C26E;
  --font:'Onest','Noto Sans Georgian',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:ui-monospace,'SF Mono',Menlo,Consolas,monospace;
  --r-s:8px;--r-m:14px;--r-l:20px;
  --top:env(safe-area-inset-top,0px);--bottom:env(safe-area-inset-bottom,0px);--left:env(safe-area-inset-left,0px);--right:env(safe-area-inset-right,0px);
  color-scheme:dark;
}
@media (prefers-color-scheme:light){
  :root{--bg:#F2F3EF;--panel:#FFFFFF;--raise:#E8EAE4;--sunk:#E3E5DE;--ink:#1C2230;--soft:#3A4252;--mute:#5F6779;--line:#D6DAD0;
    --brass:#93701F;--brass-ink:#FFFFFF;--brass-soft:rgba(147,112,31,.12);--seal:#6A54B4;--seal-soft:rgba(106,84,180,.10);
    --danger:#B3462F;--ok:#2F7A44;--focus:#93701F;color-scheme:light}
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{background:var(--bg);color:var(--ink);font:400 16px/1.5 var(--font);-webkit-text-size-adjust:100%;text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;overscroll-behavior:none}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer}
a{color:var(--brass)}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:6px}
[hidden]{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.boot{display:grid;place-items:center;height:100%}
.boot-note{color:var(--mute)}

/* ---------------------------------------------------------------- shell */
.shell{display:grid;grid-template-columns:300px minmax(0,1fr);height:100dvh;height:100vh;height:100dvh}
.shell.with-panel{grid-template-columns:300px minmax(0,1fr) 340px}
.side{background:var(--panel);border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0;padding:calc(var(--top) + 14px) 0 0 var(--left)}
.main{display:flex;flex-direction:column;min-width:0;min-height:0;position:relative}
.panel{background:var(--panel);border-left:1px solid var(--line);overflow:auto;padding:calc(var(--top) + 18px) 20px 24px;min-height:0}
.tabs{display:none}

.brand{display:flex;align-items:center;gap:10px;padding:0 18px 14px;font-weight:650;font-size:19px;letter-spacing:.01em}
.mark{width:26px;height:26px;border-radius:50%;flex:none;
  background:radial-gradient(circle at 50% 50%,var(--bg) 0 2px,var(--brass) 3px 7px,transparent 7.5px),
    repeating-radial-gradient(circle at 50% 50%,var(--raise) 0 1px,var(--sunk) 1.5px 3px);border:1px solid var(--line)}
.side-scroll{flex:1;overflow:auto;padding:0 10px 12px;min-height:0}
.side-foot{border-top:1px solid var(--line);padding:8px 10px calc(10px + var(--bottom));display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
.side-foot button{background:none;border:0;border-radius:var(--r-s);padding:9px 6px;color:var(--soft);font-size:14px;display:flex;align-items:center;justify-content:center;gap:6px}
.side-foot button[aria-current=page]{background:var(--raise);color:var(--ink)}
.side-head{display:flex;align-items:center;justify-content:space-between;padding:4px 8px 6px;color:var(--mute);font-size:13px}
.topic{display:block;width:100%;text-align:left;background:none;border:0;border-radius:var(--r-s);padding:9px 10px;color:var(--ink)}
.topic:hover{background:var(--raise)}
.topic[aria-current=page]{background:var(--raise)}
.topic .t-name{display:flex;align-items:center;gap:8px;font-weight:550}
.topic .t-sub{color:var(--mute);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.chatlink{display:block;width:100%;text-align:left;background:none;border:0;border-radius:var(--r-s);padding:6px 10px 6px 30px;color:var(--soft);font-size:14px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chatlink:hover{background:var(--raise)}
.chatlink[aria-current=page]{color:var(--ink);background:var(--brass-soft)}
.seal{display:inline-flex;align-items:center;gap:4px;color:var(--seal);font-size:12px;font-weight:550}
.seal svg{width:13px;height:13px}
.dot{width:8px;height:8px;border-radius:50%;background:var(--brass);display:inline-block}
.badge{background:var(--brass);color:var(--brass-ink);border-radius:999px;font-size:11px;font-weight:700;padding:1px 6px;min-width:18px;text-align:center}

/* ---------------------------------------------------------------- generic */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:999px;padding:10px 18px;font-weight:600;
  background:var(--brass);color:var(--brass-ink);min-height:42px}
.btn.ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.btn.quiet{background:var(--raise);color:var(--ink)}
.btn.danger{background:transparent;color:var(--danger);box-shadow:inset 0 0 0 1px currentColor}
.btn:disabled{opacity:.5;cursor:default}
.icon-btn{width:42px;height:42px;border-radius:50%;border:0;background:transparent;color:var(--soft);display:inline-grid;place-items:center;flex:none}
.icon-btn:hover{background:var(--raise);color:var(--ink)}
.icon-btn svg{width:22px;height:22px}
.icon-btn.on{background:var(--brass);color:var(--brass-ink)}
.small{font-size:13px;color:var(--mute)}
.page{flex:1;overflow:auto;padding:calc(var(--top) + 18px) max(20px,var(--right)) calc(30px + var(--bottom)) max(20px,var(--left));min-height:0}
.page-inner{max-width:720px;margin:0 auto}
h1.title{font-size:28px;line-height:1.15;font-weight:650;letter-spacing:-.01em;margin:6px 0 6px}
h2.sub{font-size:19px;font-weight:620;margin:28px 0 10px}
.lede{color:var(--soft);margin:0 0 18px;max-width:60ch}
.field{display:grid;gap:6px;margin:0 0 16px}
.field label,.field .label{font-weight:550;font-size:15px}
.field .hint{color:var(--mute);font-size:13px}
input[type=text],input[type=email],input[type=password],input[type=search],input:not([type]),textarea,select{background:var(--sunk);border:1px solid var(--line);border-radius:var(--r-m);padding:11px 13px;width:100%}
textarea{resize:vertical;min-height:90px;line-height:1.5}
.switch{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-m);margin:0 0 10px;background:var(--panel)}
.switch input{width:22px;height:22px;margin:2px 0 0;accent-color:var(--brass);flex:none}
.switch b{display:block;font-weight:600}
.switch span{color:var(--mute);font-size:14px}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.list{display:grid;gap:2px}
/* r8: per-chat row with its own options menu (rename, archive) */
.chatrow{display:flex;align-items:center;gap:2px;padding:0}
.chatrow:hover,.chatrow.here{background:var(--raise);border-radius:var(--r-s)}
.chatrow-main{flex:1;min-width:0;display:block;text-align:left;background:none;border:0;color:var(--ink);padding:9px 10px;border-radius:var(--r-s)}
.chatrow .t-name{display:flex;align-items:center;gap:8px;font-weight:550}
.chatrow .t-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chatrow .t-sub{color:var(--mute);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.chatrow .row-more{flex:none;margin-right:6px;opacity:.55}
.chatrow .row-more:hover{opacity:1}
.chatrow .tag{font-size:11px;color:var(--mute);border:1px solid var(--line);border-radius:999px;padding:0 6px}
.archived-row .t-name svg{width:16px;height:16px;color:var(--mute)}
.rename-box{display:flex;gap:6px;align-items:center;padding:6px 8px;flex:1}
.rename-in{flex:1;min-width:0;background:var(--sunk);border:1px solid var(--line);border-radius:var(--r-s);color:var(--ink);padding:6px 8px;font:inherit}
.item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:13px 14px;border-radius:var(--r-m);background:var(--panel);
  border:1px solid var(--line);text-align:left;width:100%;color:var(--ink)}
.item + .item{margin-top:8px}
.item .i-title{font-weight:600}
.item .i-sub{color:var(--mute);font-size:14px;margin-top:2px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.item.unread .i-title::before{content:'';display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--brass);margin-right:8px;vertical-align:middle}
.empty{color:var(--mute);padding:28px 4px;max-width:46ch}
.toast{position:fixed;left:50%;bottom:calc(84px + var(--bottom));transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:14px;line-height:1.4;
  font-size:14px;z-index:30;max-width:calc(100vw - 32px);box-shadow:0 8px 30px rgba(0,0,0,.3)}
.error-text{color:var(--danger)}
.mt12{margin-top:12px}.mt16{margin-top:16px}.mt28{margin-top:28px}.mb10{margin-bottom:10px}
.home-start{padding:4px 8px 14px}
.empty.quiet{padding:4px 0 8px;text-align:left}
.working.held .pulse{animation:none;background:var(--mute)}
.working.held .w-text{white-space:normal}
.paused-box{border-color:var(--brass);background:transparent}.paused-box b{color:var(--brass)}
.brand-name{flex:1}
.btn.slim{min-height:34px;padding:6px 12px;font-size:14px;margin-right:8px}
.btn.slim svg{width:16px;height:16px}
.empty-chat{margin:8vh auto 0;max-width:460px;text-align:center;display:flex;flex-direction:column;align-items:center}
.empty-chat .lede{margin-top:8px}
.empty-chat .private-box{text-align:left}
.mark.big{width:64px;height:64px;margin-bottom:6px}
.box.private{border-color:var(--seal)}
.box.private:focus-within{border-color:var(--seal);box-shadow:0 0 0 3px var(--seal-soft)}
.seal-switch:has(input:checked){border-color:var(--seal);background:var(--seal-soft)}
.seal-switch input{accent-color:var(--seal)}
.i-kind{font-size:12.5px;color:var(--brass);font-weight:600;margin-bottom:2px}
.wide-btn{width:100%;min-height:50px;font-size:16px}
.wide-btn svg{width:20px;height:20px}

/* ---------------------------------------------------------------- conversation */
.chat-head{display:flex;align-items:center;gap:6px;padding:calc(var(--top) + 8px) max(10px,var(--right)) 8px max(10px,var(--left));border-bottom:1px solid var(--line);
  background:var(--bg);min-height:56px}
.chat-head .h-text{flex:1;min-width:0}
.chat-head .h-title{font-weight:620;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-head .h-sub{font-size:13px;color:var(--mute);display:flex;gap:8px;align-items:center;white-space:nowrap;overflow:hidden}
.log{flex:1;overflow-y:auto;overflow-x:hidden;padding:18px max(16px,var(--right)) 18px max(16px,var(--left));min-height:0;scroll-behavior:auto}
.log-inner{max-width:760px;margin:0 auto;display:flex;flex-direction:column;gap:18px}
.day{align-self:center;color:var(--mute);font-size:12px;padding:2px 10px}
.msg{display:flex;flex-direction:column;max-width:100%;min-width:0}
.msg.owner{align-items:flex-end}
.msg.owner .bubble{background:var(--raise);border-radius:var(--r-l) var(--r-l) 6px var(--r-l);padding:10px 14px;max-width:min(560px,86%);white-space:pre-wrap;
  overflow-wrap:anywhere;font-size:16px}
.msg.owner .meta{color:var(--mute);font-size:12px;margin:4px 6px 0;display:flex;gap:8px;align-items:center}
.msg.pending .bubble{opacity:.6}
.msg.failed .bubble{box-shadow:inset 0 0 0 1px var(--danger)}
.att{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;margin-bottom:6px;max-width:min(560px,86%)}
.att img{max-width:200px;max-height:200px;border-radius:var(--r-m);display:block;object-fit:cover;background:var(--sunk)}
.file-chip{display:inline-flex;align-items:center;gap:8px;background:var(--sunk);border:1px solid var(--line);border-radius:var(--r-m);padding:8px 12px;font-size:14px;
  max-width:260px;color:var(--ink);text-decoration:none}
.file-chip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.msg.jarvis{align-items:stretch}
.who{display:flex;align-items:center;gap:8px;color:var(--mute);font-size:13px;margin-bottom:4px}
.who .mark{width:18px;height:18px}
.md{font-size:16.5px;line-height:1.62;overflow-wrap:anywhere;max-width:68ch}
.md p{margin:0 0 .8em}
.md p:last-child{margin-bottom:0}
.md h3,.md h4{font-size:17px;font-weight:650;margin:1.1em 0 .4em}
.md ul,.md ol{padding-left:1.3em;margin:0 0 .8em}
.md li{margin:.15em 0}
.md code{font-family:var(--mono);font-size:.88em;background:var(--sunk);padding:.1em .35em;border-radius:5px}
.md pre{background:var(--sunk);border:1px solid var(--line);border-radius:var(--r-m);padding:12px 14px;overflow:auto;font-size:14px;line-height:1.5}
.md pre code{background:none;padding:0}
.md blockquote{margin:0 0 .8em;padding:0 0 0 14px;border-left:3px solid var(--line);color:var(--soft)}
.md table{border-collapse:collapse;margin:0 0 .8em;font-size:15px;display:block;overflow:auto}
.md th,.md td{border-bottom:1px solid var(--line);padding:6px 10px;text-align:left}
.md a{text-underline-offset:3px}
.acts{display:flex;gap:2px;margin-top:6px;margin-left:-8px;align-items:center;flex-wrap:wrap}
.acts button{background:none;border:0;border-radius:999px;padding:6px 10px;color:var(--mute);font-size:13px;display:inline-flex;gap:6px;align-items:center}
.acts button:hover{background:var(--raise);color:var(--ink)}
.acts button.playing{color:var(--brass)}
.acts svg{width:16px;height:16px}
.sources{margin-top:8px;display:grid;gap:4px;font-size:14px}
.sources a,.sources span{color:var(--soft);text-decoration:none;display:flex;gap:8px;align-items:baseline;overflow:hidden}
.sources a:hover{color:var(--ink)}
.sources .host{color:var(--mute);font-size:12px;flex:none}
.sources .t{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kind-question .md{border-left:3px solid var(--brass);padding-left:12px}
.kind-error .md,.kind-notice .md{color:var(--soft);font-size:15px}
.kind-error .md{color:var(--danger)}

/* the memorable part: what Jarvis learned, written in the margin under your own words */
.learned{align-self:flex-end;max-width:min(520px,86%);margin-top:-10px;display:flex;gap:10px;align-items:flex-start;color:var(--brass);font-size:13.5px;
  line-height:1.45;padding:2px 0 2px 12px;border-left:2px solid var(--brass)}
.learned .l-text{color:var(--soft)}
.learned .l-text b{color:var(--brass);font-weight:600}
.learned button{background:none;border:0;color:var(--mute);font-size:12.5px;padding:0 2px;text-decoration:underline;text-underline-offset:3px;flex:none}
.learned.forgotten{opacity:.55}
.learned.forgotten .l-text{text-decoration:line-through}

.card{border:1px solid var(--line);border-radius:var(--r-m);background:var(--panel);padding:14px 16px;max-width:620px}
.card.approval{border-color:var(--brass);box-shadow:0 0 0 3px var(--brass-soft)}
.card .c-title{font-weight:620;margin-bottom:6px}
.card details{margin:8px 0 12px;color:var(--mute);font-size:14px}
.card details pre{white-space:pre-wrap;overflow-wrap:anywhere;font-family:var(--mono);font-size:12.5px;background:var(--sunk);padding:10px;border-radius:var(--r-s);color:var(--soft)}
.card .decided{font-weight:600;color:var(--mute)}
.card.alert-card{border-left:3px solid var(--brass)}

.working{display:flex;align-items:center;gap:10px;color:var(--mute);font-size:14px;padding:2px 0}
.working .pulse{width:10px;height:10px;border-radius:50%;background:var(--brass);animation:pulse 1.4s ease-in-out infinite;flex:none}
.working .w-text{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.working button{background:none;border:1px solid var(--line);color:var(--soft);border-radius:999px;padding:3px 10px;font-size:13px}
@keyframes pulse{0%,100%{transform:scale(.7);opacity:.5}50%{transform:scale(1);opacity:1}}

/* ---------------------------------------------------------------- composer */
.composer{border-top:1px solid var(--line);background:var(--bg);padding:10px max(12px,var(--right)) calc(10px + var(--bottom)) max(12px,var(--left))}
.composer-inner{max-width:760px;margin:0 auto}
.waiting-note{font-size:13px;color:var(--brass);margin:0 4px 6px}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 8px}
.chip{display:inline-flex;align-items:center;gap:8px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-m);padding:5px 6px 5px 10px;font-size:13px;
  max-width:240px}
.chip img{width:34px;height:34px;object-fit:cover;border-radius:6px}
.chip .c-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chip button{background:none;border:0;color:var(--mute);width:26px;height:26px;border-radius:50%}
.chip.uploading{opacity:.6}
.chip.bad{border-color:var(--danger);color:var(--danger)}
.box{display:flex;align-items:flex-end;gap:6px;background:var(--panel);border:1px solid var(--line);border-radius:24px;padding:5px 5px 5px 6px}
.box:focus-within{border-color:var(--brass)}
.box textarea{flex:1;border:0;background:transparent;resize:none;min-height:42px;max-height:40vh;padding:10px 6px;outline:none;font-size:16px;line-height:1.4}
.send{background:var(--brass);color:var(--brass-ink)}
.send:hover{background:var(--brass);color:var(--brass-ink)}
.send:disabled{opacity:.4}
.rec{display:flex;align-items:center;gap:12px;flex:1;padding:0 8px;color:var(--danger);font-variant-numeric:tabular-nums;min-height:42px}
.rec .rdot{width:10px;height:10px;border-radius:50%;background:var(--danger);animation:pulse 1s infinite}
.menu{position:absolute;z-index:20;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-m);padding:6px;min-width:220px;box-shadow:0 12px 40px rgba(0,0,0,.35)}
.menu button{display:flex;gap:10px;align-items:center;width:100%;background:none;border:0;border-radius:var(--r-s);padding:10px 12px;text-align:left;color:var(--ink)}
.menu button:hover{background:var(--raise)}
.menu svg{width:18px;height:18px;color:var(--mute)}

/* ---------------------------------------------------------------- topic panel */
.k-list{display:grid;gap:10px}
.k{padding:10px 0;border-bottom:1px solid var(--line)}
.k .k-text{font-size:15px}
.k .k-quote{color:var(--mute);font-size:13px;margin-top:3px}
.k .k-row{display:flex;justify-content:space-between;align-items:center;margin-top:4px}
.k button{background:none;border:0;color:var(--mute);font-size:13px;text-decoration:underline;padding:0}
.private-box{border:1px solid var(--seal);background:var(--seal-soft);border-radius:var(--r-m);padding:12px 14px;color:var(--soft);font-size:14px;margin:0 0 16px}
.private-box b{color:var(--seal)}

/* ---------------------------------------------------------------- pairing */
.pair{min-height:100%;display:grid;place-items:center;padding:calc(var(--top) + 30px) 22px calc(30px + var(--bottom))}
.pair-card{max-width:420px;width:100%}
.pair-card .mark{width:58px;height:58px;margin-bottom:18px}
.pair-card .code{font:600 24px/1 var(--mono);letter-spacing:.12em;text-align:center;text-transform:uppercase}
.pair-card .steps{padding-left:1.2em;color:var(--soft)}
.pair-card .steps li{margin:.4em 0}

/* ---------------------------------------------------------------- phone */
@media (max-width:899px){
  .shell,.shell.with-panel{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto}
  .side{border-right:0;padding-top:calc(var(--top) + 10px)}
  .shell[data-view=chat] .side,.shell[data-view=chat] .tabs{display:none}
  .shell:not([data-view=home]) .side{display:none}
  .shell[data-view=home] .main{display:none}
  .shell[data-view=chat] .main{grid-row:1/3}
  .side-foot{display:none}
  .panel{position:fixed;inset:0;z-index:15;border:0;padding-top:calc(var(--top) + 12px)}
  .tabs{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);background:var(--panel);padding:4px max(6px,var(--left)) calc(4px + var(--bottom))}
  .tabs button{background:none;border:0;color:var(--mute);font-size:11.5px;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 0;position:relative}
  .tabs button svg{width:24px;height:24px}
  .tabs button[aria-current=page]{color:var(--ink)}
  .tabs .badge{position:absolute;top:2px;left:calc(50% + 6px)}
  .md{font-size:16px}
  .toast{bottom:calc(90px + var(--bottom))}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* ---------------------------------------------------------------- r7: Notices, steps, files, edit, search, review */
.notices-row{border:1px solid var(--line);margin:0 0 10px;background:var(--sunk)}
.notices-row .t-name svg{width:17px;height:17px;color:var(--brass)}
.notices-row .t-name .badge{margin-left:auto}
.side-tools{display:flex;gap:2px}
.notice-card{max-width:680px;border-left:3px solid var(--brass)}
.notice-card.kind-shipment{border-left-color:var(--ok)}
.notice-card .c-title{display:flex;align-items:center;gap:8px}
.notice-card .c-title svg{width:16px;height:16px;color:var(--brass)}
.notice-card .c-title .small{margin-left:auto;font-weight:400}
.n-items{margin-top:10px}
.n-items details{margin:0}
.n-items summary{cursor:pointer;color:var(--soft);font-size:14px;padding:6px 0}
.n-item{border-top:1px solid var(--line);padding:10px 0 8px}
.n-item.settled .n-title{color:var(--mute)}
.n-head{display:flex;gap:10px;align-items:flex-start}
.n-num{flex:none;min-width:22px;height:22px;border-radius:50%;background:var(--raise);color:var(--soft);font-size:12px;font-weight:700;display:grid;place-items:center;margin-top:1px}
.n-text{flex:1;min-width:0}
.n-title{font-weight:580;overflow-wrap:anywhere}
.n-sub{color:var(--mute);font-size:13.5px;margin-top:2px;overflow-wrap:anywhere}
.n-state{flex:none;font-size:12px;color:var(--mute);background:var(--raise);border-radius:999px;padding:2px 8px;white-space:nowrap}
.n-acts{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 0 32px}
.n-item:only-child .n-acts,.n-items > .n-item .n-acts{margin-left:0}
.chip-btn{display:inline-flex;align-items:center;gap:6px;background:var(--raise);border:0;border-radius:999px;padding:6px 11px;font-size:13.5px;color:var(--ink);text-decoration:none;min-height:32px}
.chip-btn:hover{background:var(--brass-soft)}
.chip-btn svg{width:15px;height:15px;color:var(--brass)}
.n-draft{margin:8px 0 0}
.n-draft textarea,.edit-box textarea{width:100%;background:var(--sunk);border:1px solid var(--line);border-radius:var(--r-s);padding:10px;resize:vertical;margin-bottom:8px}
.n-foot{margin-top:10px;flex-wrap:wrap;gap:4px}
.msg.notice{align-items:stretch}
.quote{display:flex;gap:6px;align-items:center;color:var(--mute);font-size:12.5px;margin:0 6px 4px;max-width:86%}
.quote svg{width:13px;height:13px;flex:none}
.replying{display:flex;gap:8px;align-items:center;font-size:13px;color:var(--brass);margin:0 4px 6px}
.replying svg{width:14px;height:14px;flex:none}
.replying span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.replying button{background:none;border:0;color:var(--mute);font-size:18px;line-height:1;padding:0 4px}
.linkish{background:none;border:0;padding:0;color:var(--mute);font-size:12px;display:inline-flex;gap:4px;align-items:center;text-decoration:underline;text-underline-offset:2px}
.linkish svg{width:12px;height:12px}
.msg.owner .meta .linkish{opacity:.8}
.superseded{display:none!important}
.log.show-old .superseded{display:flex!important;opacity:.45}
.log.show-old .superseded.learned{display:grid!important}
.flash{animation:flash 2.2s ease-out}
@keyframes flash{0%,30%{box-shadow:0 0 0 3px var(--brass-soft);border-radius:var(--r-m)}100%{box-shadow:none}}
.edit-box{margin-top:8px;width:min(560px,86%)}
.edit-box .row{flex-wrap:wrap;gap:6px}
/* work line and steps */
.work{margin:-2px 0 6px}
.work-line{display:inline-flex;align-items:center;gap:6px;background:none;border:0;padding:4px 0;color:var(--mute);font-size:13.5px}
.work-line svg{width:14px;height:14px;transition:transform .15s}
.work-line[aria-expanded=true] svg{transform:rotate(90deg)}
.work-line:hover{color:var(--ink)}
.steps{list-style:none;margin:6px 0 10px;padding:0 0 0 4px;border-left:2px solid var(--line);display:grid;gap:10px}
.step{display:flex;gap:10px;align-items:flex-start;padding-left:10px;font-size:14px}
.s-ico{flex:none;width:24px;height:24px;border-radius:50%;background:var(--raise);display:grid;place-items:center;margin-left:-23px;box-shadow:0 0 0 3px var(--bg)}
.s-ico svg{width:14px;height:14px;color:var(--brass)}
.step.bad .s-ico svg{color:var(--danger)}
.s-body{flex:1;min-width:0}
.s-label{overflow-wrap:anywhere}
.s-label b{font-weight:580}
.s-detail{color:var(--soft)}
.s-results{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:2px}
.s-results a,.s-link{color:var(--soft);text-decoration:none;font-size:13.5px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s-results a:hover,.s-link:hover{color:var(--ink)}
.s-results .host{color:var(--mute);font-size:12px}
.s-code summary,.s-expert summary{cursor:pointer;color:var(--mute);font-size:13px;margin-top:4px}
pre.code,pre.out{white-space:pre-wrap;overflow-wrap:anywhere;font-family:var(--mono);font-size:12.5px;background:var(--sunk);padding:10px;border-radius:var(--r-s);
  color:var(--soft);margin:6px 0 0;max-height:360px;overflow:auto}
pre.out{border-left:2px solid var(--line)}
.live-steps{list-style:none;margin:0 0 4px;padding:0;display:grid;gap:3px;font-size:13px;color:var(--mute)}
.live-steps li{display:flex;gap:8px;align-items:center;min-width:0}
.live-steps li span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.live-steps svg{width:13px;height:13px;color:var(--ok);flex:none}
.working{flex-direction:column;align-items:stretch;gap:4px}
.w-now{display:flex;align-items:center;gap:10px;min-width:0}
/* files Jarvis made, previews */
.made{display:grid;gap:8px;margin:10px 0 2px;max-width:560px}
.made img{max-width:100%;border-radius:var(--r-m)}
.file-card{display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-m);padding:8px 8px 8px 12px}
.f-ico{flex:none;width:34px;height:34px;border-radius:var(--r-s);background:var(--brass-soft);display:grid;place-items:center}
.f-ico svg{width:18px;height:18px;color:var(--brass)}
.f-text{flex:1;min-width:0}
.f-name{font-weight:580;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sources a .fav{flex:none;width:18px;height:18px;border-radius:5px;background:var(--raise);color:var(--soft);font-size:11px;font-weight:700;display:inline-grid;place-items:center;align-self:center}
.sheet{position:fixed;inset:0;z-index:40;background:rgba(8,10,16,.55);display:grid;align-items:end;justify-items:center;padding:calc(var(--top) + 30px) 0 0}
.sheet-card{background:var(--panel);width:min(860px,100%);max-height:100%;border-radius:var(--r-l) var(--r-l) 0 0;display:flex;flex-direction:column;
  padding-bottom:var(--bottom);box-shadow:0 -12px 50px rgba(0,0,0,.4)}
.sheet-head{display:flex;align-items:center;gap:6px;padding:12px 10px 10px 18px;border-bottom:1px solid var(--line)}
.sheet-head b{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sheet-body{overflow:auto;padding:14px 18px 22px;min-height:120px}
.sheet-body pre.code{max-height:none}
.table-wrap{overflow:auto;max-width:100%}
.table-wrap table{border-collapse:collapse;font-size:13.5px}
.table-wrap th,.table-wrap td{border:1px solid var(--line);padding:5px 9px;text-align:left;white-space:nowrap}
.table-wrap th{background:var(--raise)}
@media (min-width:900px){.sheet{align-items:center;padding:40px}.sheet-card{border-radius:var(--r-l);max-height:86vh}}
/* search, review, cloud help */
#search-q{width:100%;background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:12px 18px;margin:6px 0 16px}
mark{background:var(--brass-soft);color:var(--ink);border-radius:3px;padding:0 1px}
.review-list{display:grid;gap:12px}
.review-card{max-width:none}
.r-value{font-weight:600;font-size:17px;margin:4px 0}
.review-card blockquote{margin:6px 0;color:var(--soft);font-size:14px;border-left:2px solid var(--line);padding-left:10px}
.review-card .row{margin-top:10px}
.seg{display:inline-flex;background:var(--sunk);border:1px solid var(--line);border-radius:999px;padding:3px;gap:2px;margin:6px 0}
.seg button{background:none;border:0;border-radius:999px;padding:7px 14px;font-size:14px;color:var(--soft)}
.seg button[aria-pressed=true]{background:var(--brass);color:var(--brass-ink);font-weight:600}

/* r9: audio upload, drag-drop, analyze chip (refined in the r9 redesign) */
.main.dropping, .composer.dropping { outline: 2px dashed var(--brass); outline-offset: -10px; border-radius: var(--r-l); }
.chip-go { font-size: 12px; padding: 3px 10px; margin-left: 6px; border-radius: 999px; border: 1px solid var(--line); background: var(--brass-soft); color: var(--brass-ink); cursor: pointer; }
.chip-go:hover { filter: brightness(1.05); }

/* ---------------------------------------------------------------- r9 polish: more depth and warmth, same identity */
.log-inner{gap:20px}
.msg.owner .bubble{box-shadow:inset 0 1px 0 rgba(255,255,255,.045), 0 1px 2px rgba(0,0,0,.18)}
.card{box-shadow:0 1px 3px rgba(0,0,0,.12)}
.card.approval{box-shadow:0 0 0 3px var(--brass-soft), 0 1px 3px rgba(0,0,0,.12)}
.item{box-shadow:0 1px 2px rgba(0,0,0,.08)}
.box{box-shadow:0 2px 12px rgba(0,0,0,.12)}
.box:focus-within{border-color:var(--brass);box-shadow:0 0 0 3px var(--brass-soft)}
.send{position:relative;background-image:linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,0))}
.btn{box-shadow:0 1px 2px rgba(0,0,0,.10)}
.btn.ghost,.btn.quiet{box-shadow:inset 0 0 0 1px var(--line)}
.btn.slim{min-height:34px;padding:6px 14px;font-size:14px}
.chat-head{backdrop-filter:saturate(1.1)}
.brand{letter-spacing:.004em}
/* audio preview chip reads as a distinct, tappable control */
.chip .chip-go{font-weight:600}
/* r10: calendar test results and the Google sign-in steps */
.small.ok{color:var(--ok,#2e7d32)}
.small.warn{color:var(--danger,#b3261e)}
.gsteps{margin:6px 0 10px;padding-left:1.3em;display:grid;gap:6px;color:var(--soft)}
.item.warnbox{border-color:var(--brass);background:var(--brass-soft)}
.grow{flex:1;min-width:0}
#parcel-box .row input{flex:1;min-width:8em}
/* r12: chats like Claude — New chat, Notices, Search, Archived at the top, then every chat by its name */
.menu-row{padding:7px 10px}
.menu-row .t-name svg{width:16px;height:16px;color:var(--mute)}
.side-chats{display:flex;flex-direction:column;gap:1px;padding-bottom:12px}
.side-chats .chatrow{padding:2px 4px}
.side-chats .chatrow-main.chatlink{padding:5px 6px;color:var(--ink);font-size:14px}
.side-chats .chatrow-main.chatlink[aria-current=page]{background:var(--brass-soft)}
.home-wide{max-width:560px;margin:12vh auto 0;text-align:center}
.home-wide .row{justify-content:center}
.side-more{display:block;width:100%;text-align:left;padding:8px 12px;color:var(--mute);font:inherit;font-size:13px;background:none;border:0;cursor:pointer}
.side-more:hover{text-decoration:underline}
/* r13: the live list of what Jarvis is doing */
.working .live-detail{max-height:min(52vh,560px);overflow:auto;margin:2px 0 6px;overscroll-behavior:contain}
.s-why{color:var(--soft);font-size:13px;margin-bottom:2px}
.step.running .s-ico{animation:pulse 1.4s ease-in-out infinite}
/* r14: a permission request */
.card.permission .c-title{display:flex;align-items:center;gap:6px}
.card.permission .c-title svg{width:16px;height:16px;color:var(--brass)}
.toast.updated14{cursor:pointer;border:0;font:inherit;bottom:auto;top:12px}

/* r15: where a parcel is and when it should reach you */
.journey15{margin:4px 0 10px;border-radius:14px;overflow:hidden;cursor:pointer;box-shadow:0 1px 3px rgba(20,30,45,.12);background:#fff;line-height:0}
.journey15 svg{display:block;width:100%;height:auto}
.journey15:focus-visible{outline:2px solid var(--accent,#2f6fed);outline-offset:2px}
.journey15-wait{line-height:1.4;padding:16px;color:var(--muted)}
.journey15.big{cursor:default;margin:0 0 14px}
.journey15-title{font-weight:650;margin:4px 0 2px}
.journey15-when{margin:0 0 10px}
.journey15-why{margin:6px 0 12px;padding-left:20px}
.journey15-why li,.journey15-route li{margin:3px 0}
.journey15-route{padding-left:22px;margin:4px 0 12px}
/* r16: the maps under a parcel answer */
.parcels16{display:grid;gap:10px;margin:8px 0 4px}
@media (min-width:760px){.parcels16{grid-template-columns:repeat(auto-fill,minmax(330px,1fr))}}
.parcels16 .journey15{margin:0}
/* r17: inside the iPhone/Mac app the page itself never slides; only its lists and chats scroll */
html.native,html.native body{overflow:hidden;overscroll-behavior:none;width:100%}
html.native main.pair{height:100%;overflow-y:auto;-webkit-overflow-scrolling:touch}   /* r17 review: the pairing screen still scrolls (keyboard, landscape) */