/* css/shell.css · THE NEW SHELL [redesign · flag: new_shell]
   Scope: every rule sits under body.new-shell, so the flag owns the whole look.
   Structure changes, not paint: the left pane becomes NAVIGATION (the command
   bay is gone), the right terminal pane is retired, the thread becomes a page
   surface, the composer becomes the Ask-Corvo bar, mobile gets the Q6 nav.
   Tokens only; orange primary; green and red stay semantic. */

/* ---- frame ---- */
body.new-shell{--tg-mkt:228px;--tg-side:0px;background:var(--bg-0);}
body.new-shell .tg-grid,body.new-shell #app{background:var(--bg-0);}
body.new-shell .side-pane{display:none!important;}
body.new-shell .work-tabs{display:none!important;}

/* ---- topbar: calm, brand + search + wallet ---- */
body.new-shell .topbar{
  background:var(--glass);backdrop-filter:blur(18px) saturate(1.2);
  -webkit-backdrop-filter:blur(18px) saturate(1.2);
  border-bottom:1px solid var(--line);box-shadow:none;}
body.new-shell .topbar .brand-name{font-weight:800;letter-spacing:-.02em;font-size:15.5px;}
body.new-shell .topbar-right .iconbtn{border-radius:var(--r-md);}
body.new-shell .topbar-right .iconbtn:hover{background:var(--panel-2);border-color:var(--line);}
body.new-shell #topsearch,body.new-shell .topsearch{
  background:var(--bg-1);border:1px solid var(--line);border-radius:var(--r-pill);}
body.new-shell .status-pill{border-radius:var(--r-pill);border:1px solid var(--line);background:var(--panel);}

/* ---- ticker: a hairline strip, not a marquee shout ---- */
body.new-shell .ticker{background:var(--bg-0);border-bottom:1px solid var(--line);opacity:.92;}
body.new-shell .tk-item{font-size:11px;}

/* ---- the left rail (built by shell.js into #mkt-pane) ---- */
body.new-shell .mkt-pane{
  background:var(--bg-0);border-right:1px solid var(--line);padding:12px 10px;
  display:flex;flex-direction:column;gap:2px;overflow-y:auto;}
body.new-shell .nr-item{
  display:flex;align-items:center;gap:11px;width:100%;text-align:left;
  font:600 13.5px/1 var(--font);letter-spacing:-.005em;color:var(--ink-3);
  background:none;border:1px solid transparent;border-radius:var(--r-md);
  min-height:40px;padding:0 12px;cursor:pointer;text-decoration:none;
  transition:background var(--dur-1) var(--ease),color var(--dur-1) var(--ease);}
body.new-shell .nr-item:hover{background:var(--panel-2);color:var(--ink);}
body.new-shell .nr-item.active{background:var(--brand-soft);color:var(--brand);border-color:var(--brand-line);}
body.new-shell .nr-item .nr-ico{width:18px;text-align:center;font-size:14px;opacity:.9;}
body.new-shell .nr-label{
  font:600 10px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-4);padding:14px 12px 6px;}
body.new-shell .nr-foot{margin-top:auto;padding:10px 4px 4px;display:flex;flex-direction:column;gap:8px;}
body.new-shell .nr-ask{
  display:flex;align-items:center;gap:9px;border:1px solid var(--brand-line);
  background:var(--brand-soft);border-radius:var(--r-md);padding:10px 12px;
  font:600 12.5px/1.35 var(--font);color:var(--ink-2);cursor:pointer;text-align:left;}
body.new-shell .nr-ask b{color:var(--brand);}

/* ---- main surface: a page, not a scrollback ---- */
body.new-shell .chat-surface{background:var(--bg-0);}
body.new-shell .chat-thread{max-width:980px;margin:0 auto;padding:6px 18px 28px;}
body.new-shell .boot-seq,body.new-shell .tg-boot{display:none!important;}

/* ---- the Ask-Corvo bar (was: command composer) ---- */
body.new-shell .composer{background:transparent;border-top:1px solid var(--line);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);}
body.new-shell .composer-inner{
  max-width:760px;margin:8px auto;background:var(--bg-1);
  border:1px solid var(--line-2);border-radius:var(--r-pill);
  box-shadow:0 8px 30px rgba(0,0,0,.35);}
body.new-shell .composer-inner:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft);}
body.new-shell #composer-input{font:500 14.5px/1.4 var(--font);}
body.new-shell .composer-send{background:var(--brand);border-radius:var(--r-pill);}
body.new-shell .composer-send:hover{background:var(--brand-hi);}
body.new-shell .composer-foot{max-width:760px;margin:0 auto;opacity:.85;}
body.new-shell #agent-ctx-chips{max-width:760px;margin:0 auto;}

/* ---- mobile: Q6 nav, glass bar, safe areas ---- */
body.new-shell .botnav{
  background:var(--glass);backdrop-filter:blur(20px) saturate(1.3);
  -webkit-backdrop-filter:blur(20px) saturate(1.3);border-top:1px solid var(--line);}
body.new-shell .bn-item{color:var(--ink-4);font-weight:600;}
body.new-shell .bn-item.active{color:var(--brand);}
body.new-shell .bn-item .bn-ico{font-size:16px;}
body.new-shell .bn-item.bn-mid{position:relative;}
body.new-shell .bn-item.bn-mid .bn-ico{
  display:flex;align-items:center;justify-content:center;width:42px;height:42px;margin:-14px auto 2px;
  background:var(--brand-grad);color:var(--on-brand);border-radius:50%;box-shadow:var(--shadow-glow);font-size:18px;}

/* ---- welcome-era chrome that the new shell retires ---- */
body.new-shell .promo-rail,body.new-shell #promo-rail{display:none!important;}

@media (max-width:880px){
  body.new-shell .chat-thread{padding:6px 12px 20px;}
}
@media (prefers-reduced-motion: reduce){
  body.new-shell .composer-inner,body.new-shell .nr-item{transition:none;}
}

/* ================= PREMIUM PASS v2 [new_shell · 2026-09-01] =================
   The brand layer: warm ember ground with edge glows, film grain, one signature
   surface (.c-ember) for hero and money moments, gradient primaries, refined
   rail, a real mobile pass. Restraint rules hold: glows stay under 8% opacity,
   gradients live on the primary CTA and the ember surface only. */

/* ---- ground: ember-lit, not flat ---- */
body.new-shell{
  background:
    radial-gradient(900px 480px at 88% -10%, var(--ground-glow-a), transparent 62%),
    radial-gradient(700px 420px at -6% 108%, var(--ground-glow-b), transparent 60%),
    var(--bg-0);
  color:var(--ink);}
body.new-shell .chat-surface,body.new-shell .tg-grid{background:transparent;}

/* ---- film grain, the highest premium-per-byte layer ---- */
body.new-shell::after{
  content:"";position:fixed;inset:0;z-index:2000;pointer-events:none;opacity:var(--grain-op);
  mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");}

/* ---- the signature surface ---- */
body.new-shell .c-ember{
  background:var(--ember-card);
  border:1px solid var(--ember-line);
  box-shadow:var(--shadow-ember);
  border-radius:var(--r-xl);}
body.new-shell .c-ember .c-stat__label{color:var(--ink-3);}
body.new-shell .c-ember .c-stat__value{color:var(--ink);}

/* ---- primaries: one gradient, everywhere the same ---- */
body.new-shell .c-btn--primary{
  background:var(--brand-grad);border:none;color:#fff;
  box-shadow:0 8px 24px rgba(249,115,22,.28), inset 0 1px 0 rgba(255,255,255,.25);}
body.new-shell .c-btn--primary:hover{filter:brightness(1.08);box-shadow:0 12px 30px rgba(249,115,22,.4), inset 0 1px 0 rgba(255,255,255,.25);}
body.new-shell .c-chip{background:var(--panel);}
body.new-shell .c-chip:hover{background:var(--brand-soft);}
body.new-shell .c-card{box-shadow:0 10px 34px rgba(0,0,0,.32);}
body.new-shell .c-table th{background:var(--panel);}
body.new-shell .c-table tbody tr:hover td{background:var(--brand-soft);}

/* ---- topbar and rail refinements ---- */
body.new-shell .topbar{background:var(--glass);}
body.new-shell .mkt-pane{border-right:1px solid var(--line);
  background:linear-gradient(180deg, var(--panel), transparent 30%);}
body.new-shell .nr-item.active{
  background:linear-gradient(135deg, rgba(251,146,60,.16), rgba(234,88,12,.10));
  color:var(--brand-hi);border-color:rgba(249,115,22,.3);
  box-shadow:0 6px 20px rgba(249,115,22,.12);}
body.new-shell .nr-ask{box-shadow:0 8px 26px rgba(249,115,22,.10);}

/* ---- the Ask bar: hairline ember ring ---- */
body.new-shell .composer-inner{
  background:linear-gradient(var(--bg-1),var(--bg-1)) padding-box,
             linear-gradient(120deg, var(--brand-line), var(--line-2) 40%, rgba(0,82,255,.3)) border-box;
  border:1px solid transparent;}
body.new-shell .composer-inner:focus-within{
  box-shadow:0 0 0 3px var(--brand-soft), 0 14px 40px rgba(249,115,22,.14);}

/* ---- ticker: quiet, edge-faded ---- */
body.new-shell .ticker{
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
  mask-image:linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);}

/* ---- MOBILE PASS ---- */
@media (max-width:880px){
  body.new-shell .chat-thread{padding:10px 14px 24px;}
  body.new-shell .ticker{height:24px;opacity:.8;}
  /* horizontal chip rows instead of stacks */
  body.new-shell .nl-chips{display:flex;gap:8px;overflow-x:auto;flex-wrap:nowrap!important;
    justify-content:flex-start!important;padding:2px 2px 6px;margin:0 -2px;
    scrollbar-width:none;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;}
  body.new-shell .nl-chips::-webkit-scrollbar{display:none;}
  body.new-shell .nl-chips .c-chip{flex:none;scroll-snap-align:start;min-height:38px;}
  body.new-shell .c-card{padding:14px;border-radius:var(--r-lg);}
  body.new-shell .c-card--pad{padding:16px;}
  body.new-shell .c-stat__value--big{font-size:30px;}
  body.new-shell .c-table th,body.new-shell .c-table td{padding:9px 10px;font-size:12.5px;}
  /* bottom nav: breathing room, legible labels, safe area */
  body.new-shell .botnav{padding-top:6px;}
  body.new-shell .bn-item{font-size:10px;letter-spacing:.02em;gap:3px;}
  body.new-shell .bn-item .bn-ico{font-size:17px;}
  body.new-shell .composer-inner{margin:6px 10px;}
  body.new-shell #agent-ctx-chips{padding:6px 10px 2px;justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none;}
  body.new-shell #agent-ctx-chips::-webkit-scrollbar{display:none;}
  body.new-shell #agent-ctx-chips .c-chip{flex:none;}
  /* the promo pill rail sits above content, give the page air under it */
  body.new-shell #corvo-promo-rail ~ * .chat-thread{scroll-padding-top:40px;}
}
@media (prefers-reduced-motion: reduce){ body.new-shell::after{display:none;} }

/* the fixed promo pill rail overlays the top of the page surface; give the
   thread air only while the rail exists */
body.new-shell:has(#corvo-promo-rail) .chat-thread{padding-top:52px;}
@media (max-width:880px){
  body.new-shell:has(#corvo-promo-rail) .chat-thread{padding-top:58px;}
}