*,*::before,*::after{box-sizing:border-box}
:root{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
[hidden]{display:none!important}
img{max-width:100%}
:root{
  /* Layout: split console. Conversation pane left, instrument stack right; two frosted panes float over a slow indigo/slate field. */
  color-scheme:dark;
  --bg:#090e1c;
  --field-1:rgba(99,102,241,.42);
  --field-2:rgba(51,65,85,.72);
  --field-3:rgba(139,147,251,.22);
  --dot:rgba(148,163,184,.08);
  --glass:rgba(20,26,50,.55);
  --glass-tile:rgba(148,163,184,.055);
  --glass-input:rgba(148,163,184,.09);
  --log-bg:rgba(4,7,18,.38);
  --edge:rgba(165,180,252,.15);
  --edge-strong:rgba(165,180,252,.30);
  --sheen:rgba(255,255,255,.06);
  --shadow:rgba(2,6,23,.55);
  --fg:#e8ebf7;
  --fg-2:#a6aec9;
  --fg-3:#737c9e;
  --accent:#9aa1fc;
  --accent-fill:#5b5ff0;
  --accent-soft:rgba(99,102,241,.22);
  --on-accent:#ffffff;
  --user:rgba(91,95,240,.30);
  --user-edge:rgba(139,147,251,.38);
  --good:#3ddc97;--good-soft:rgba(61,220,151,.14);
  --warn:#f5c04a;--warn-soft:rgba(245,192,74,.13);
  --bad:#f87171;--bad-soft:rgba(248,113,113,.14);
  --cyan:#6fd6e8;
  --font-display:"Bricolage Grotesque","Avenir Next","Segoe UI",system-ui,sans-serif;
  --font-ui:"Instrument Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --r-pane:20px;--r-tile:14px;--r-bubble:16px;
  --blur:22px;
}
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]){
    color-scheme:light;
    --bg:#e8ecf6;--field-1:rgba(99,102,241,.26);--field-2:rgba(148,163,184,.50);--field-3:rgba(129,140,248,.20);--dot:rgba(51,65,85,.08);
    --glass:rgba(255,255,255,.60);--glass-tile:rgba(99,102,241,.045);--glass-input:rgba(255,255,255,.78);--log-bg:rgba(255,255,255,.62);
    --edge:rgba(79,70,229,.14);--edge-strong:rgba(79,70,229,.30);--sheen:rgba(255,255,255,.85);--shadow:rgba(30,41,82,.16);
    --fg:#111731;--fg-2:#465073;--fg-3:#6e7795;
    --accent:#4f46e5;--accent-fill:#4f46e5;--accent-soft:rgba(79,70,229,.11);--on-accent:#ffffff;
    --user:rgba(79,70,229,.11);--user-edge:rgba(79,70,229,.24);
    --good:#047857;--good-soft:rgba(4,120,87,.10);--warn:#a15c07;--warn-soft:rgba(161,92,7,.10);--bad:#b91c1c;--bad-soft:rgba(185,28,28,.09);--cyan:#0e7490;
  }
}
:root[data-theme="light"]{
  color-scheme:light;
  --bg:#e8ecf6;--field-1:rgba(99,102,241,.26);--field-2:rgba(148,163,184,.50);--field-3:rgba(129,140,248,.20);--dot:rgba(51,65,85,.08);
  --glass:rgba(255,255,255,.60);--glass-tile:rgba(99,102,241,.045);--glass-input:rgba(255,255,255,.78);--log-bg:rgba(255,255,255,.62);
  --edge:rgba(79,70,229,.14);--edge-strong:rgba(79,70,229,.30);--sheen:rgba(255,255,255,.85);--shadow:rgba(30,41,82,.16);
  --fg:#111731;--fg-2:#465073;--fg-3:#6e7795;
  --accent:#4f46e5;--accent-fill:#4f46e5;--accent-soft:rgba(79,70,229,.11);--on-accent:#ffffff;
  --user:rgba(79,70,229,.11);--user-edge:rgba(79,70,229,.24);
  --good:#047857;--good-soft:rgba(4,120,87,.10);--warn:#a15c07;--warn-soft:rgba(161,92,7,.10);--bad:#b91c1c;--bad-soft:rgba(185,28,28,.09);--cyan:#0e7490;
}

html{height:100%}
body{height:100%;margin:0;background:var(--bg);color:var(--fg);font-family:var(--font-ui);font-size:14px;line-height:1.45;overflow:hidden;-webkit-font-smoothing:antialiased}
button,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* Background field */
.field{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;background-image:radial-gradient(var(--dot) 1px,transparent 1.3px);background-size:22px 22px}
.blob{position:absolute;border-radius:50%}
.b1{width:56vmax;height:56vmax;left:-16vmax;top:-20vmax;background:radial-gradient(circle,var(--field-1),transparent 66%);animation:d1 30s ease-in-out infinite alternate}
.b2{width:62vmax;height:62vmax;right:-24vmax;bottom:-28vmax;background:radial-gradient(circle,var(--field-2),transparent 66%);animation:d2 36s ease-in-out infinite alternate}
.b3{width:38vmax;height:38vmax;left:40%;top:28%;background:radial-gradient(circle,var(--field-3),transparent 66%);animation:d3 26s ease-in-out infinite alternate}
@keyframes d1{to{transform:translate(9vmax,7vmax)}}
@keyframes d2{to{transform:translate(-8vmax,-6vmax)}}
@keyframes d3{to{transform:translate(-12vmax,8vmax)}}

/* Shell */
.app{position:relative;z-index:1;height:100%;max-width:1480px;margin:0 auto;display:flex;flex-direction:column;gap:12px;padding-block:14px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.glass{background:var(--glass);-webkit-backdrop-filter:blur(var(--blur)) saturate(150%);backdrop-filter:blur(var(--blur)) saturate(150%);border:1px solid var(--edge);box-shadow:inset 0 1px 0 var(--sheen),0 22px 44px -22px var(--shadow)}

.topbar{display:flex;align-items:center;gap:14px;min-height:44px}
.brand{display:flex;align-items:center;gap:11px;min-width:0}
.mark{width:36px;height:36px;border-radius:11px;flex:none;display:grid;place-items:center;color:#fff;background:linear-gradient(150deg,#7479f7,#3730a3);box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 8px 18px -8px rgba(79,70,229,.8)}
.mark svg{width:23px;height:23px}
.wordmark{font-family:var(--font-display);font-weight:680;font-size:20px;letter-spacing:-.015em;line-height:1;white-space:nowrap}
.wordmark em{font-style:normal;font-weight:520;color:var(--accent);margin-left:2px}
.crumb{color:var(--fg-2);font-size:13px;padding-left:12px;border-left:1px solid var(--edge-strong);white-space:nowrap}
.top-right{margin-left:auto;display:flex;align-items:center;gap:10px}
.mode{font:500 10.5px/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;padding:8px 10px;border-radius:999px;border:1px solid var(--edge);color:var(--fg-2);background:var(--glass-tile);white-space:nowrap}
.mode[data-mode="live"]{color:var(--good);background:var(--good-soft);border-color:transparent}
.mode[data-mode="scripted"]{color:var(--accent);background:var(--accent-soft);border-color:transparent}
.btn{font:500 13px/1 var(--font-ui);color:var(--fg);background:var(--glass-input);border:1px solid var(--edge);border-radius:10px;padding:9px 12px;cursor:pointer;display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.btn:hover{border-color:var(--edge-strong)}
.btn svg{width:15px;height:15px}

.tabs{display:none}
.main{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:14px}
.pane{border-radius:var(--r-pane);min-height:0;display:flex;flex-direction:column;overflow:hidden}

/* Chat */
.chat-head{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--edge)}
.avatar{width:44px;height:44px;border-radius:50%;flex:none;display:grid;place-items:center;background:radial-gradient(circle at 30% 25%,#b3b8ff,#5b5ff0 55%,#2e2a7a);box-shadow:0 0 0 3px var(--accent-soft)}
.wave{display:flex;gap:2.5px;align-items:center;height:18px}
.wave i{display:block;width:3px;height:4px;border-radius:2px;background:#fff;opacity:.92}
.chat[data-activity="responding"] .wave i{animation:wave .85s ease-in-out infinite}
.chat[data-activity="thinking"] .wave i,.chat[data-activity="tools"] .wave i{animation:idle 1.6s ease-in-out infinite}
.wave i:nth-child(2){animation-delay:.12s}.wave i:nth-child(3){animation-delay:.24s}.wave i:nth-child(4){animation-delay:.36s}.wave i:nth-child(5){animation-delay:.48s}
@keyframes wave{0%,100%{height:4px}50%{height:17px}}
@keyframes idle{0%,100%{height:4px;opacity:.55}50%{height:8px;opacity:1}}
.agent-id{min-width:0}
.agent-name{font-family:var(--font-display);font-weight:620;font-size:17px;line-height:1.1}
.agent-sub{color:var(--fg-3);font-size:12px;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pill{margin-left:auto;display:inline-flex;align-items:center;gap:7px;padding:7px 12px 7px 10px;border-radius:999px;font:500 12px/1 var(--font-ui);border:1px solid var(--edge);background:var(--glass-tile);color:var(--fg-2);white-space:nowrap;flex:none}
.pill .dot{width:8px;height:8px;border-radius:50%;background:var(--fg-3)}
.pill[data-state="online"]{color:var(--fg)}
.pill[data-state="online"] .dot{background:var(--good);box-shadow:0 0 0 3px var(--good-soft)}
.pill[data-state="connecting"] .dot,.pill[data-state="verifying"] .dot{background:var(--warn);animation:pulse 1.3s ease-in-out infinite}
.pill[data-state="thinking"] .dot,.pill[data-state="responding"] .dot{background:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);animation:pulse 1s ease-in-out infinite}
.pill[data-state="responding"]{color:var(--fg)}
.pill[data-state="tools"] .dot{background:var(--warn);box-shadow:0 0 0 3px var(--warn-soft);animation:pulse .8s ease-in-out infinite}
.pill[data-state="paused"] .dot{background:var(--warn)}
.pill[data-state="error"] .dot{background:var(--bad);box-shadow:0 0 0 3px var(--bad-soft)}
@keyframes pulse{50%{transform:scale(.6);opacity:.55}}

.mini{display:none}
.feed{flex:1;min-height:0;overflow-y:auto;padding:18px 16px 10px;display:flex;flex-direction:column;gap:14px;overscroll-behavior:contain}
.msg{display:flex;flex-direction:column;gap:6px;max-width:min(86%,580px);min-width:0;animation:rise .28s ease-out}
@keyframes rise{from{transform:translateY(6px);opacity:.4}}
.msg.agent{align-self:flex-start}
.msg.user{align-self:flex-end;align-items:flex-end}
.bubble{padding:11px 14px;border-radius:var(--r-bubble);font-size:14.5px;line-height:1.52;white-space:pre-wrap;overflow-wrap:anywhere;min-width:0}
.agent .bubble{background:var(--glass-tile);border:1px solid var(--edge);border-top-left-radius:6px}
.user .bubble{background:var(--user);border:1px solid var(--user-edge);border-top-right-radius:6px}
.bubble.streaming::after{content:"";display:inline-block;width:7px;height:1.05em;margin-left:3px;vertical-align:-3px;background:var(--accent);border-radius:1.5px;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.typing{display:inline-flex;align-items:center;gap:8px;color:var(--fg-3);font-size:13px}
.typing .dots{display:inline-flex;gap:4px}
.typing .dots i{width:6px;height:6px;border-radius:50%;background:var(--accent);opacity:.5;animation:bounce 1.2s ease-in-out infinite}
.typing .dots i:nth-child(2){animation-delay:.15s}.typing .dots i:nth-child(3){animation-delay:.3s}
@keyframes bounce{0%,80%,100%{transform:translateY(0);opacity:.35}40%{transform:translateY(-4px);opacity:1}}
.meta{font:400 11px/1.3 var(--font-mono);color:var(--fg-3);display:flex;gap:4px 12px;flex-wrap:wrap;padding:0 4px;font-variant-numeric:tabular-nums}
.activity,.attach{display:flex;flex-direction:column;gap:6px}
.act{display:flex;align-items:center;gap:8px;font:400 11.5px/1.35 var(--font-mono);color:var(--warn);padding:6px 10px;border-radius:9px;background:var(--warn-soft);overflow-wrap:anywhere}
.act svg{width:13px;height:13px;flex:none}
.card{border:1px solid var(--edge);background:var(--glass-tile);border-radius:var(--r-tile);padding:12px;display:flex;flex-direction:column;gap:10px}
.card-h{display:flex;align-items:center;gap:8px;font:600 10.5px/1 var(--font-ui);letter-spacing:.1em;text-transform:uppercase;color:var(--fg-3)}
.card-h svg{width:14px;height:14px;color:var(--accent)}
.slots{display:flex;flex-direction:column;gap:6px}
.slot{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;border:1px solid var(--edge);background:var(--glass-input);font:500 13.5px/1.2 var(--font-ui);cursor:pointer;text-align:left;font-variant-numeric:tabular-nums}
.slot:hover:not(:disabled){border-color:var(--accent)}
.slot .go{font-size:12px;color:var(--accent)}
.slot:disabled{opacity:.5;cursor:default}
.slot.chosen{opacity:1;border-color:var(--good);background:var(--good-soft)}
.slot.chosen .go{color:var(--good)}
.booked{border-color:transparent;background:var(--good-soft)}
.booked .card-h{color:var(--good)}.booked .card-h svg{color:var(--good)}
.booked-main{font-size:15px;font-weight:600}
.booked-code{font:500 12px var(--font-mono);color:var(--fg-2)}
.fine{font-size:11.5px;color:var(--fg-3)}
.notice{align-self:stretch;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border-radius:12px;font-size:13px;background:var(--bad-soft);border:1px solid transparent}
.notice.info{background:var(--accent-soft)}
.notice .btn{padding:7px 10px;font-size:12.5px}
.sys{align-self:center;font:400 11px var(--font-mono);color:var(--fg-3);padding:2px 10px}

.ts-box{display:flex;justify-content:center}
.ts-box:empty{display:none}
.composer{padding:12px 14px 12px;border-top:1px solid var(--edge);display:flex;flex-direction:column;gap:10px}
.inputrow{display:flex;align-items:flex-end;gap:8px;padding:6px 6px 6px 14px;border-radius:14px;background:var(--glass-input);border:1px solid var(--edge);transition:border-color .15s,box-shadow .15s}
.inputrow:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
textarea{flex:1;min-width:0;resize:none;border:0;outline:0;background:transparent;font:400 14.5px/1.45 var(--font-ui);padding:8px 0;max-height:120px}
textarea:focus-visible{outline:none}
textarea::placeholder{color:var(--fg-3)}
.send{width:38px;height:38px;flex:none;border-radius:11px;border:0;background:var(--accent-fill);color:var(--on-accent);display:grid;place-items:center;cursor:pointer;transition:opacity .15s,transform .1s}
.send:active:not(:disabled){transform:scale(.95)}
.send:disabled{opacity:.38;cursor:default}
.send svg{width:18px;height:18px}
.send[data-mode="stop"]{background:var(--fg);color:var(--bg)}
.chips{display:flex;flex-wrap:wrap;gap:7px}
.chip{font:500 12.5px/1 var(--font-ui);color:var(--fg-2);padding:8px 11px;border-radius:999px;border:1px solid var(--edge);background:var(--glass-tile);cursor:pointer;white-space:nowrap;display:inline-flex;gap:6px;align-items:center;flex:none;animation:rise .25s ease-out}
.chip:hover:not(:disabled){color:var(--fg);border-color:var(--edge-strong);background:var(--glass-input)}
.chip.primary{color:var(--accent);background:var(--accent-soft);border-color:transparent}
.chip.primary svg{width:12px;height:12px}
.chip:disabled{opacity:.42;cursor:default}

/* Telemetry */
.tele-head{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--edge)}
.tele-title{font-family:var(--font-display);font-weight:620;font-size:17px;line-height:1.1}
.tele-sub{font:400 11px/1.3 var(--font-mono);color:var(--fg-3);margin-top:4px}
.sess{margin-left:auto;display:flex;flex-direction:column;align-items:flex-end;gap:4px;font:400 11px/1 var(--font-mono);color:var(--fg-3);font-variant-numeric:tabular-nums}
.sess b{font-weight:500;color:var(--fg-2)}
.tele-body{flex:1;min-height:0;overflow-y:auto;padding:14px 16px 18px;display:flex;flex-direction:column;gap:16px;overscroll-behavior:contain}
.sec{display:flex;flex-direction:column;gap:10px;min-width:0}
.tile{padding:13px 14px;border-radius:var(--r-tile);background:var(--glass-tile);border:1px solid var(--edge)}
.sec-h{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0}
.label{font:600 10.5px/1.2 var(--font-ui);letter-spacing:.1em;text-transform:uppercase;color:var(--fg-3)}
.hint{font:400 11px var(--font-mono);color:var(--fg-3);white-space:nowrap;font-variant-numeric:tabular-nums}
.kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.kpi{padding:11px 12px;border-radius:var(--r-tile);background:var(--glass-tile);border:1px solid var(--edge);min-width:0}
.kpi .v{font:500 21px/1.1 var(--font-mono);font-variant-numeric:tabular-nums;margin-top:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kpi .v small{font-size:11.5px;color:var(--fg-3);margin-left:3px;font-weight:400}
.kpi .s{font-size:11px;color:var(--fg-3);margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chart svg{display:block;width:100%;height:auto}
.c-grid{stroke:var(--edge);stroke-width:1}
.c-axis{fill:var(--fg-3);font:400 9px var(--font-mono)}
.c-line{fill:none;stroke:var(--accent);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.c-dot{fill:var(--accent)}
.c-dot.flag{fill:var(--bg);stroke:var(--accent);stroke-width:1.5}
.c-halo{fill:var(--accent-soft)}
.c-val{fill:var(--fg);font:500 10px var(--font-mono)}
.c-area{fill:url(#lg)}
.c-stop{stop-color:var(--accent)}
.c-empty{fill:var(--fg-3);font:400 11px var(--font-ui)}
.c-base{stroke:var(--edge-strong);stroke-dasharray:4 5}

.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}
.step{display:flex;flex-direction:column;align-items:center;gap:7px;position:relative;font-size:11px;color:var(--fg-3);text-align:center}
.step::before{content:"";position:absolute;top:6px;left:-50%;width:100%;height:2px;background:var(--edge-strong)}
.step:first-child::before{display:none}
.step .d{width:14px;height:14px;border-radius:50%;border:2px solid var(--edge-strong);background:var(--bg);position:relative;z-index:1;transition:all .3s}
.step.done{color:var(--fg-2)}
.step.done .d{background:var(--accent-fill);border-color:var(--accent-fill)}
.step.done::before,.step.cur::before{background:var(--accent-fill)}
.step.cur{color:var(--fg);font-weight:600}
.step.cur .d{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.intel{display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px;align-items:center;margin-top:4px}
.ring{position:relative;width:86px;height:86px}
.ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.ring-track{fill:none;stroke:var(--glass-input);stroke-width:7}
.ring-val{fill:none;stroke:var(--accent);stroke-width:7;stroke-linecap:round;stroke-dasharray:213.63;stroke-dashoffset:213.63;transition:stroke-dashoffset .8s ease}
.ring .num{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}
.ring .num b{font:500 23px/1 var(--font-mono);font-variant-numeric:tabular-nums}
.ring .num span{font:600 9px/1 var(--font-ui);letter-spacing:.12em;color:var(--fg-3);text-transform:uppercase}
.kv{display:flex;flex-direction:column;gap:9px;min-width:0}
.kv-row{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12.5px;min-width:0}
.kv-row .k{color:var(--fg-3);flex:none}
.intent{font:500 12px/1 var(--font-ui);padding:5px 9px;border-radius:999px;background:var(--accent-soft);color:var(--accent);white-space:nowrap}
.intent.empty{background:var(--glass-input);color:var(--fg-3)}
.sv{font:500 12px var(--font-mono);font-variant-numeric:tabular-nums}
.senti{height:6px;border-radius:3px;background:var(--glass-input);position:relative;overflow:hidden}
.senti::after{content:"";position:absolute;left:50%;top:-1px;bottom:-1px;width:1px;background:var(--edge-strong)}
.senti i{position:absolute;top:0;bottom:0;left:50%;width:0;border-radius:3px;background:var(--fg-3);transition:all .6s ease}
.next{flex-direction:column;align-items:flex-start;gap:3px}
.next .val{color:var(--fg);font-weight:500;overflow-wrap:anywhere}
.sync{font:500 10.5px/1 var(--font-mono);padding:6px 9px;border-radius:999px;background:var(--glass-input);color:var(--fg-3);white-space:nowrap}
.sync[data-s="draft"]{background:var(--warn-soft);color:var(--warn)}
.sync[data-s="synced"]{background:var(--good-soft);color:var(--good)}
.fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.f{padding:10px 11px;border-radius:11px;background:var(--glass-tile);border:1px solid var(--edge);min-width:0}
.f .k{font:600 10px/1.2 var(--font-ui);letter-spacing:.09em;text-transform:uppercase;color:var(--fg-3)}
.f .v{margin-top:5px;font-size:13px;line-height:1.35;overflow-wrap:anywhere}
.f .v.empty{color:var(--fg-3)}
.f.flash{animation:flash 1.4s ease-out}
@keyframes flash{0%{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}}
.mini-btn{font:500 11px/1 var(--font-mono);color:var(--fg-2);background:var(--glass-input);border:1px solid var(--edge);border-radius:7px;padding:5px 8px;cursor:pointer}
.mini-btn:hover{border-color:var(--edge-strong)}
.log{font:400 11.5px/1.6 var(--font-mono);background:var(--log-bg);border:1px solid var(--edge);border-radius:12px;padding:10px 12px;height:230px;overflow:auto;overscroll-behavior:contain;font-variant-numeric:tabular-nums}
.ln{display:grid;grid-template-columns:auto 4.2ch minmax(0,1fr);gap:9px}
.ln .t{color:var(--fg-3)}
.ln .g{color:var(--fg-3)}
.ln .x{color:var(--fg-2);overflow-wrap:anywhere}
.ln .x b{color:var(--fg);font-weight:500}
.ln[data-k="metric"] .g{color:var(--accent)}
.ln[data-k="signal"] .g{color:var(--cyan)}
.ln[data-k="tool"] .g{color:var(--warn)}
.ln[data-k="crm"] .g{color:var(--good)}
.ln[data-k="error"] .g,.ln[data-k="error"] .x b{color:var(--bad)}
.ln[data-k="user"] .g{color:var(--fg-2)}
.ln.sep .x{color:var(--fg-3)}
.sec-list{display:flex;flex-direction:column;gap:10px}
.sec-item{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;font-size:12.5px;color:var(--fg-2);line-height:1.4}
.sec-item svg{width:16px;height:16px;color:var(--good);margin-top:1px}
.sec-item b{display:block;color:var(--fg);font-weight:600;font-size:12.5px}

/* Narrow: one pane at a time */
@media (max-width:959px){
  .app{gap:10px;padding-block:10px}
  .crumb,.btn .lbl,.mode{display:none}
  .btn{padding:9px}
  .wordmark{font-size:18px}
  .tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;border-radius:13px}
  .tab{border:0;background:transparent;border-radius:10px;padding:9px 10px;font:600 13px/1 var(--font-ui);color:var(--fg-2);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:7px}
  .tab[aria-selected="true"]{background:var(--glass-input);color:var(--fg);box-shadow:0 1px 0 var(--sheen),0 2px 8px -4px var(--shadow)}
  .tdot{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
  .main{grid-template-columns:minmax(0,1fr)}
  .app[data-view="chat"] .tele{display:none}
  .app[data-view="telemetry"] .chat{display:none}
  .mini{display:flex;gap:16px;padding:8px 16px;border-bottom:1px solid var(--edge);font:400 11px/1.2 var(--font-mono);color:var(--fg-3);overflow-x:auto;white-space:nowrap;scrollbar-width:none;font-variant-numeric:tabular-nums}
  .mini::-webkit-scrollbar{display:none}
  .mini b{color:var(--fg);font-weight:500}
  .chat-head,.tele-head{padding:12px 14px}
  .feed{padding:14px 14px 8px}
  .msg{max-width:92%}
  .composer{padding:10px 12px 12px}
  .chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:-12px;padding-inline:12px}
  .chips::-webkit-scrollbar{display:none}
  .tele-body{padding:12px 14px 16px}
}
@media (max-width:380px){.kpi .v{font-size:18px}}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}