/* premium.css · Velvet-inspired premium pass for / · LOADED LAST · additive + reversible.
   Refines FORM (space · depth · radius · type · motion) not colour semantics: --accent stays
   whatever it is, --ember stays the orange brand accent. No token inversion. Remove this one
   <link> to revert completely. Shared surfaces first (every ceShell page), then components. */

:root {
  --pr-r-sm: 9px; --pr-r: 13px; --pr-r-lg: 18px; --pr-r-xl: 22px;
  --pr-sh-1: 0 1px 2px rgba(0,0,0,.40);
  --pr-sh-2: 0 16px 44px -14px rgba(0,0,0,.58);
  --pr-ease: cubic-bezier(.4,0,.2,1);
  --pr-line: rgba(255,255,255,.07);
  --pr-line-2: rgba(255,255,255,.12);
  --pr-ink-2: #b7bec9;
  --pr-ink-3: #828b9a;
  --pr-ember: #f97316;
  --pr-ember-soft: rgba(249,115,22,.30);
  --pr-ember-tint: rgba(249,115,22,.10);
}

/* ---- type · Geist across the shell (already loaded via Google Fonts) ---- */
body { font-family: 'Geist', var(--inter, system-ui), sans-serif !important; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; letter-spacing: -.004em; }
.mono, code, .dmk-p, .ptok-price, .ptok-chg, .agent-stat-num { font-family: 'Geist Mono', var(--mono), ui-monospace, monospace !important; }

/* ---- view head · on every ceShell page ---- */
body .view-head { padding: 6px 2px 2px; margin-bottom: 16px; border-bottom: 0; }
body .view-title { font-weight: 640 !important; letter-spacing: -.025em; font-size: 23px; line-height: 1.14; }
body .view-sub { color: var(--pr-ink-3); font-size: 13.5px; margin-top: 5px; line-height: 1.55; max-width: 62ch; }

/* ---- vcard · the shared content card ---- */
body .vcard { border: 1px solid var(--pr-line) !important; border-radius: var(--pr-r-lg) !important;
  box-shadow: var(--pr-sh-1); padding: 18px; transition: border-color .18s var(--pr-ease), transform .18s var(--pr-ease); }
body .vcard:hover { border-color: var(--pr-line-2) !important; }
body .vcard h3 { font-weight: 620; letter-spacing: -.012em; }
body .vcard p { color: var(--pr-ink-2); line-height: 1.62; }

/* ---- chat bubbles · the surface every interaction uses (.msg-bubble x42) ---- */
body .msg-bubble { border-radius: 16px !important; line-height: 1.62; box-shadow: var(--pr-sh-1); }
body .msg-user .msg-bubble, body .msg-user.msg-row .msg-bubble { background: var(--pr-ember-tint); border: 1px solid rgba(249,115,22,.20); border-bottom-right-radius: 5px !important; }
body .msg-agent .msg-bubble { background: var(--panel, #13161d); border: 1px solid var(--pr-line); border-bottom-left-radius: 5px !important; }
body .msg-time { color: var(--pr-ink-3); font-size: 11px; }
body .msg-avatar { border-radius: 999px; }

/* ---- followup chips · pill, ember hover ---- */
body .followup-chip { border-radius: 999px !important; border: 1px solid var(--pr-line-2); font-weight: 540; transition: border-color .18s, color .18s, transform .18s var(--pr-ease); }
body .followup-chip:hover { border-color: var(--pr-ember-soft); color: var(--txt); transform: translateY(-1px); }

/* ---- buttons ---- */
body .btn, body .btn-ghost, body .btn-danger { border-radius: var(--pr-r) !important; font-weight: 580; transition: filter .18s, transform .18s var(--pr-ease), border-color .18s; }
body .btn-ghost { border: 1px solid var(--pr-line-2); }
body .btn:hover, body .btn-ghost:hover, body .btn-danger:hover { transform: translateY(-1px); }
body .iconbtn { border-radius: var(--pr-r-sm) !important; transition: background .18s, color .18s; }
body .btn-primary { border-radius: var(--pr-r) !important; font-weight: 620; box-shadow: 0 8px 22px -8px rgba(249,115,22,.42); transition: filter .18s, transform .18s var(--pr-ease); }
body .btn-primary:hover { filter: brightness(1.06); transform: translateY(-1px); }

/* ---- chat-rendered cards (token / portfolio / rewards / agent) ---- */
body .card { border: 1px solid var(--pr-line) !important; border-radius: var(--pr-r-lg) !important; box-shadow: var(--pr-sh-1); }
body .card-title { font-weight: 620; letter-spacing: -.01em; }
body .card-meta { color: var(--pr-ink-3); font-size: 11.5px; }
body .agent-card { border-radius: var(--pr-r-lg) !important; }

/* ---- market chips (.dmk) + yield rows (.dyl) ---- */
body .dmk { border-radius: var(--pr-r) !important; border: 1px solid var(--pr-line) !important; transition: border-color .18s, transform .18s var(--pr-ease); }
body .dmk:hover { border-color: var(--pr-ember-soft) !important; transform: translateY(-1px); }
body .dyl { border-radius: var(--pr-r-sm) !important; transition: background .18s; }

/* ---- discovery / trenches token cards (.ptok) ---- */
body .ptok { border-radius: var(--pr-r) !important; border: 1px solid var(--pr-line) !important; transition: border-color .18s, transform .18s var(--pr-ease), box-shadow .18s; }
body .ptok:hover { border-color: var(--pr-line-2) !important; transform: translateY(-1px); box-shadow: var(--pr-sh-1); }

/* ---- composer · elevated card with an ember focus ring ---- */
body .composer-inner { border-radius: var(--pr-r-lg) !important; border: 1px solid var(--pr-line-2); box-shadow: var(--pr-sh-2); transition: border-color .18s, box-shadow .18s; }
body .composer-inner:focus-within { border-color: var(--pr-ember-soft); box-shadow: 0 0 0 1px var(--pr-ember-soft), var(--pr-sh-2); }
body .composer-foot, body .composer-foot .ft-r, body .composer-foot .ft-l { color: var(--pr-ink-3); font-size: 11.5px; }

/* ---- side + market panes ---- */
body .tg-pane { border-color: var(--pr-line) !important; }
body .tg-pane-head { letter-spacing: .09em; font-size: 11px; text-transform: uppercase; color: var(--pr-ink-3); font-weight: 560; }

/* ---- topbar · glassy ---- */
body .topbar { backdrop-filter: saturate(1.4) blur(14px); -webkit-backdrop-filter: saturate(1.4) blur(14px); border-bottom: 1px solid var(--pr-line); }

/* ---- work-tabs · pill nav ---- */
body .work-tabs button, body .work-tab, body .work-tabs a { border-radius: 999px !important; transition: background .18s, color .18s; }

/* ---- mobile bottom nav ---- */
body .botnav { border-top: 1px solid var(--pr-line); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
body .bn-item { transition: color .18s var(--pr-ease); }
body .bn-item.active, body .bn-item[aria-current="page"] { color: var(--pr-ember); }

/* ---- drawer / more-sheet ---- */
body .drawer { border-radius: var(--pr-r-xl) var(--pr-r-xl) 0 0 !important; border: 1px solid var(--pr-line-2); }
body .drawer-item, body .more-item, body .drawer-row { border-radius: var(--pr-r) !important; transition: background .18s; }
body .feed-grid { gap: 10px; }

/* ---- inputs / fields · ember focus ---- */
body .input, body .field, body #composer-input { border-radius: var(--pr-r) !important; transition: border-color .18s, box-shadow .18s; font-family: 'Geist', var(--inter, system-ui), sans-serif; }
body .input:focus, body .field:focus { border-color: var(--pr-ember-soft) !important; box-shadow: 0 0 0 1px var(--pr-ember-soft); outline: none; }

/* ---- Portfolio holdings (.th-*) · the data-dense wallet view ---- */
body .th-row { border-radius: var(--pr-r) !important; border: 1px solid transparent; transition: background .18s, border-color .18s; }
body .th-row:hover { background: rgba(255,255,255,.02); border-color: var(--pr-line); }
body .th-tok-sym { font-weight: 600; letter-spacing: -.01em; }
body .th-tok-ico, body .th-logo { border-radius: 999px !important; }
body .th-bal-amt, body .th-tok-v, body .th-bal-today { font-family: 'Geist Mono', var(--mono), monospace !important; letter-spacing: -.01em; }
body .th-bal-chg.up { color: var(--pos); } body .th-bal-chg.down { color: var(--neg); }

/* ---- Perps positions (.pp-*) ---- */
body .pp-card { border: 1px solid var(--pr-line) !important; border-radius: var(--pr-r-lg) !important; box-shadow: var(--pr-sh-1); }
body .pp-row { border-radius: var(--pr-r) !important; }
body .pp-val, body .pp-pnl { font-family: 'Geist Mono', var(--mono), monospace !important; letter-spacing: -.01em; }
body .pp-pnl.up { color: var(--pos); } body .pp-pnl.down { color: var(--neg); }
body .pp-side { border-radius: var(--pr-r-sm) !important; font-weight: 640; text-transform: uppercase; letter-spacing: .04em; font-size: 10.5px; }
body .pp-claim, body .pp-ac-toggle { border-radius: var(--pr-r-sm) !important; }

/* ---- loading states ---- */
body .shimmer { border-radius: var(--pr-r-sm) !important; }
body .pulse-load { color: var(--pr-ink-3); }

/* ---- SPECIFICITY FIXES · the base uses .chat-thread .X (2-class) + !important on these,
   which out-ranks `body .X`. These match/exceed it and load last, so they actually apply. ---- */
.chat-thread .vcard, .chat-thread .result-card, .chat-thread .pf-card { border: 1px solid var(--pr-line) !important; border-radius: var(--pr-r-lg) !important; box-shadow: var(--pr-sh-1); }
.chat-thread .vcard:hover { border-color: var(--pr-line-2) !important; }
.chat-thread .card { border: 1px solid var(--pr-line) !important; border-radius: var(--pr-r-lg) !important; box-shadow: var(--pr-sh-1); }
.chat-thread .ptok { border-radius: var(--pr-r) !important; border: 1px solid var(--pr-line) !important; }
.chat-thread .ptok:hover { border-color: var(--pr-line-2) !important; transform: translateY(-1px); box-shadow: var(--pr-sh-1); }
.chat-thread .btn-primary, .vcard .btn-primary { border-radius: var(--pr-r) !important; }
.msg-row.msg-agent .msg-bubble { border-radius: 16px !important; border-bottom-left-radius: 5px !important; background: var(--panel, #13161d) !important; border: 1px solid var(--pr-line) !important; box-shadow: var(--pr-sh-1); }
.msg-row.msg-user .msg-bubble { border-radius: 16px !important; border-bottom-right-radius: 5px !important; background: var(--pr-ember-tint) !important; border: 1px solid rgba(249,115,22,.20) !important; }
.composer:focus-within .composer-inner { border-color: var(--pr-ember-soft) !important; box-shadow: 0 0 0 1px var(--pr-ember-soft), var(--pr-sh-2) !important; }

/* ---- per-row Buy pill on token cards (Velvet-style CTA) · default = full-width
   pill at the bottom of the card; the split-feed override below floats it right ---- */
.chat-thread .ptok { position: relative; }
.chat-thread .ptok-buy { display: block; margin-top: 9px; text-align: center; padding: 8px 0; border-radius: 10px;
  font-weight: 660; font-size: 12px; letter-spacing: -.01em; color: #0a0a0d; cursor: pointer;
  background: linear-gradient(180deg, #fb923c, #f97316);
  box-shadow: 0 7px 16px -9px rgba(249,115,22,.65), inset 0 1px 0 rgba(255,255,255,.3);
  transition: filter .14s var(--pr-ease), transform .14s var(--pr-ease); }
.chat-thread .ptok-buy:hover { filter: brightness(1.07); transform: translateY(-1px); }
.chat-thread .ptok-buy:active { transform: translateY(0); }

/* ---- CORVO PULSE · Kupo/GMGN-style multi-lane trenches terminal (home · desktop) ----
   The live feed IS the home now. `#welcome` still renders the raven hero + pulse
   lanes in the DOM; here we hide the hero and turn `.pulse-cols` into a full-height
   3-lane terminal with rich cards + one-tap Buy. Reuses /api/public/pulse. */
@media (min-width:1150px){
  /* Lock scroll + kill padding ONLY when the 3-lane deck is actually mounted (home).
     `cv-home` lingers on other views, so guard with :has() or their content can't scroll. */
  body .chat-thread:has(#welcome .pulse-cols){ padding:0 !important; overflow:hidden !important; }
  .chat-thread:has(#welcome .pulse-cols) #welcome{ display:block !important; height:100%; max-width:none !important; margin:0 !important; padding:0 !important; text-align:left !important; }
  /* hide the AI-hero bits · the feed owns the home */
  .chat-thread #welcome > .hero-glyph, .chat-thread #welcome > h1, .chat-thread #welcome > .lead,
  .chat-thread #welcome > .ask-raven, .chat-thread #welcome > .home-launch, .chat-thread #welcome > .welcome-tagline,
  .chat-thread #welcome > .welcome-prices, .chat-thread #welcome > .welcome-proof, .chat-thread #welcome > .welcome-share-row,
  .chat-thread #welcome > .tg-boot, .chat-thread #welcome > #active-banner{ display:none !important; }
  /* obsidian ember-noir ground · the deck is an instrument, not a page */
  body .chat-thread{
    background:
      radial-gradient(1000px 460px at 80% -12%, rgba(249,115,22,.07), transparent 60%),
      radial-gradient(680px 420px at 4% 112%, rgba(59,130,246,.05), transparent 62%),
      #08080b !important;
  }
  /* 3-lane grid */
  .chat-thread #welcome > .pulse-cols{
    --cvm:ui-monospace,'JetBrains Mono','DejaVu Sans Mono',Menlo,monospace;
    display:grid !important; grid-template-columns:1fr 1fr 1fr; grid-template-rows:auto minmax(0,1fr); align-content:start; gap:0; height:100%;
    position:relative !important; grid-column:auto !important; grid-row:auto !important; align-self:stretch !important;
    margin:0 !important; padding:0 !important; max-width:none !important; max-height:none !important; overflow:hidden !important;
    border:0 !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important;
  }
  .chat-thread #welcome > .pulse-cols > .cv-feedbar{ grid-column:1 / -1; border-radius:0; }
  .chat-thread #welcome > .pulse-cols > .pulse-col{ min-width:0; min-height:0; display:flex; flex-direction:column; border-right:1px solid var(--pr-line); }
  .chat-thread #welcome > .pulse-cols > .pulse-col:last-child{ border-right:0; }
  /* lane header */
  .chat-thread #welcome > .pulse-cols .pulse-col-h{
    position:sticky; top:0; z-index:3; margin:0 !important; padding:12px 14px 11px !important;
    display:flex; align-items:center; gap:9px; background:linear-gradient(180deg,#0e0e15,rgba(14,14,21,.4)); border-bottom:1px solid var(--pr-line);
    font-size:13.5px; font-weight:700; letter-spacing:-.01em; color:var(--txt-1,#f4f4f6); text-transform:none;
  }
  .chat-thread #welcome > .pulse-cols .pulse-col-h .dlive{
    margin-left:auto; font-family:var(--cvm); font-size:8.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--pr-ember);
    border:1px solid rgba(249,115,22,.3); border-radius:999px; padding:2px 8px;
  }
  .chat-thread #welcome > .pulse-cols .pulse-list{
    flex:1; min-height:0; overflow-y:auto; display:flex !important; flex-direction:column; gap:0;
    grid-template-columns:1fr !important; padding:2px 0 16px;
  }
  /* ---- FILAMENT ROW · thin mono-data line that ignites on hover (ember underglow) ---- */
  .chat-thread #welcome .ptok{
    position:relative; width:100%; display:flex !important; flex-direction:column; gap:5px;
    padding:10px 13px !important; border:0 !important; border-bottom:1px solid var(--pr-line) !important;
    border-left:2px solid transparent !important; border-radius:0 !important;
    background:transparent !important; box-shadow:none !important; transition:background .14s,border-color .14s;
  }
  .chat-thread #welcome .ptok:hover{
    background:linear-gradient(90deg,rgba(249,115,22,.09),rgba(249,115,22,.015) 62%,transparent) !important;
    border-left-color:var(--pr-ember) !important; transform:none !important;
  }
  .chat-thread #welcome .ptok-top{ display:flex !important; align-items:center; justify-content:space-between; gap:10px; }
  .chat-thread #welcome .ptok-id{ display:flex; align-items:center; gap:8px; min-width:0; }
  .chat-thread #welcome .ptok-ico{ width:32px; height:32px; border-radius:9px; font-size:12px; font-weight:700; flex:none; background-color:#15151d; background-size:cover; background-position:center; box-shadow:inset 0 0 0 1px rgba(255,255,255,.08); }
  .chat-thread #welcome .ptok-sym{ font-weight:700; font-size:13px; letter-spacing:-.01em; }
  .chat-thread #welcome .ptok-age{ font-family:var(--cvm); color:var(--pr-ember); font-weight:600; font-size:9.5px; opacity:.9; }
  .chat-thread #welcome .ptok-px{ display:flex; flex-direction:column; align-items:flex-end; text-align:right; flex:none; line-height:1.25; }
  .chat-thread #welcome .ptok-price{ font-family:var(--cvm); font-variant-numeric:tabular-nums; font-weight:600; font-size:12px; }
  .chat-thread #welcome .ptok-chg{ font-family:var(--cvm); font-variant-numeric:tabular-nums; font-size:10px; }
  .chat-thread #welcome .ptok-stats{
    display:flex; gap:11px; padding-left:40px; padding-right:70px;
    font-family:var(--cvm); font-variant-numeric:tabular-nums; font-size:10px; color:var(--pr-ink-3);
  }
  .chat-thread #welcome .ptok-stats span{ white-space:nowrap; }
  .chat-thread #welcome .ptok-buy{
    position:absolute; right:13px; bottom:9px; top:auto; transform:none; margin:0 !important; min-width:0; width:auto;
    font-family:var(--cvm); font-size:10.5px; font-weight:700; letter-spacing:0; color:#fdba74 !important;
    background:rgba(249,115,22,.08) !important; border:1px solid rgba(249,115,22,.42) !important;
    border-radius:7px !important; padding:5px 11px !important; box-shadow:none !important;
  }
  .chat-thread #welcome .ptok:hover .ptok-buy{
    color:#180a02 !important; background:linear-gradient(180deg,#fdba74,var(--pr-ember)) !important;
    border-color:transparent !important; box-shadow:0 4px 14px -4px rgba(249,115,22,.35) !important;
  }
  /* real-data depth (injected by deck-enhance.js) · hide Liq to make room for MC/Vol/◈ */
  .chat-thread #welcome .ptok-stats span:nth-child(2){ display:none; }
  .chat-thread #welcome .ptok-oc{ color:var(--pr-ember); opacity:.9; }
  /* buy/sell pressure · thin underline at the row base (GT 24h buys vs sells) */
  .chat-thread #welcome .ptok-prs{
    position:absolute; left:13px; right:13px; bottom:0; height:2px; border-radius:2px; overflow:hidden;
    background:rgba(251,113,133,.32); opacity:.55; transition:opacity .14s;
  }
  .chat-thread #welcome .ptok:hover .ptok-prs{ opacity:1; }
  .chat-thread #welcome .ptok-prs i{ display:block; height:100%; background:#34d399; box-shadow:0 0 6px rgba(52,211,153,.55); }
  /* lane momentum sparkline in the header */
  .chat-thread #welcome > .pulse-cols .pulse-col-h .lane-mom{ margin-left:auto; display:inline-flex; align-items:center; gap:7px; }
  .chat-thread #welcome > .pulse-cols .pulse-col-h .lane-mom svg{ display:block; }
  .chat-thread #welcome > .pulse-cols .pulse-col-h .lane-mom b{ font-family:var(--cvm); font-variant-numeric:tabular-nums; font-size:11px; font-weight:600; }
  .chat-thread #welcome > .pulse-cols .pulse-col-h .lane-mom b.up{ color:#34d399; }
  .chat-thread #welcome > .pulse-cols .pulse-col-h .lane-mom b.down{ color:#fb7185; }
  .chat-thread #welcome > .pulse-cols .pulse-col-h .dlive{ margin-left:8px; }
}

/* ---- cockpit feed control bar (Velvet-style) · lives inside .pulse-cols so it
   only shows in the ≥1360 split · chain filter chips + cycling quick-buy amount ---- */
.cv-feedbar{ display:flex; align-items:center; gap:8px; flex-wrap:nowrap; position:sticky; top:0; z-index:5;
  padding:9px 8px; background:#0d0d13; border-bottom:1px solid var(--pr-line); }
.cv-fb-title{ font-size:12px; font-weight:660; letter-spacing:-.01em; color:var(--txt-1,#f4f4f6); display:inline-flex; align-items:center; gap:6px; white-space:nowrap; }
.cv-fb-live{ font-size:8.5px; text-transform:uppercase; letter-spacing:.1em; color:#4ade80; border:1px solid rgba(74,222,128,.3); border-radius:999px; padding:1px 6px; }
.cv-fb-filters{ display:flex; gap:3px; }
.cv-fb-chip{ font-size:11px; font-weight:560; color:var(--pr-ink-3); background:transparent; border:1px solid var(--pr-line-2); border-radius:999px; padding:4px 9px; cursor:pointer; transition:color .14s,border-color .14s,background .14s; white-space:nowrap; }
.cv-fb-chip:hover{ color:var(--txt-1,#f4f4f6); border-color:rgba(255,255,255,.2); }
.cv-fb-chip.on{ color:#0a0a0d; background:linear-gradient(180deg,#fb923c,#f97316); border-color:transparent; }
.cv-fb-qb{ margin-left:auto; display:inline-flex; align-items:center; gap:5px; font-size:11px; font-weight:560; color:var(--pr-ink-2);
  background:var(--pr-ember-tint); border:1px solid rgba(249,115,22,.34); border-radius:999px; padding:5px 10px; cursor:pointer; transition:filter .14s; white-space:nowrap; }
.cv-fb-qb:hover{ filter:brightness(1.12); }
.cv-fb-qb b{ color:#fdba74; font-weight:700; }
/* chain filter · CSS-driven, hides non-matching token rows */
.chat-thread #welcome .pulse-cols.cv-filt-base .ptok:not(.ptok-base),
.chat-thread #welcome .pulse-cols.cv-filt-solana .ptok:not(.ptok-solana),
.chat-thread #welcome .pulse-cols.cv-filt-fogo .ptok:not(.ptok-fogo){ display:none !important; }

/* ---- #2 · THREE-ZONE INSTRUMENT · on home (≥1150) the deck runs between a live
   Markets rail (left) and the position Terminal (right). No drawer on desktop home;
   below 1150 the base grid + mobile stacking take over. ---- */
@media (min-width:1150px){
  body{ grid-template-columns:[mkt] 226px [work] minmax(0,1fr) [side] 322px !important; }
  body #pf-toggle{ display:none !important; }
  body .side-pane{ position:static !important; transform:none !important; width:auto !important;
    max-width:none !important; box-shadow:none !important; z-index:auto !important; margin:0 !important; }
  body .side-pane .pf-close{ display:none !important; }
}
/* Portfolio button hidden unless in cockpit mode */
#pf-toggle{ display:none; }
/* backdrop + close · only meaningful when the drawer is open in cockpit mode */
.pf-backdrop{ position:fixed; inset:0; background:rgba(0,0,0,.46); opacity:0; pointer-events:none; z-index:55; transition:opacity .3s; }
body.pf-open .pf-backdrop{ opacity:1; pointer-events:auto; }
.pf-close{ display:none; position:absolute; top:9px; right:11px; z-index:4; width:26px; height:26px; place-items:center;
  background:transparent; border:0; color:var(--pr-ink-3); font-size:22px; line-height:1; cursor:pointer; border-radius:8px; }
.pf-close:hover{ color:var(--txt-1,#f4f4f6); background:rgba(255,255,255,.06); }

/* ---- #4 · ask-the-raven chips polish ---- */
.chat-thread #welcome .ar-eyebrow{ text-transform:uppercase; letter-spacing:.12em; font-size:10.5px; color:var(--pr-ink-3); }
.chat-thread #welcome .ar-chips button{ border-radius:999px !important; transition:border-color .16s,transform .16s var(--pr-ease); }
.chat-thread #welcome .ar-chips button:hover{ transform:translateY(-1px); }

/* ============================================================================
   ZONE 2 (Markets rail) · ZONE 3 (Position terminal) · EMBER TAPE
   Terminal-noir restyle of the live panes on home · obsidian ground, ember the
   only warm light, all data mono/tabular. Scoped to body. ============= */
@media (min-width:1150px){
  body{ --cvm:ui-monospace,'JetBrains Mono','DejaVu Sans Mono',Menlo,monospace; }
  body .mkt-pane, body .side-pane{
    background:linear-gradient(180deg,rgba(255,255,255,.014),transparent), #0a0a0f !important;
  }
  body .mkt-pane{ border-right:1px solid var(--pr-line) !important; }
  body .side-pane{ border-left:1px solid var(--pr-line) !important; }

  /* ---------- ZONE 2 · MARKETS RAIL ---------- */
  body .mkt-pane .tg-pane-head{
    font-family:var(--cvm); font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--pr-ink-3);
    padding:13px 14px 10px !important; border-bottom:1px solid var(--pr-line) !important; background:transparent !important;
  }
  body .mkt-pane .tg-live{
    font-family:var(--cvm); font-size:8px; letter-spacing:.1em; color:var(--pr-ember);
    border:1px solid rgba(249,115,22,.3); border-radius:999px; padding:2px 6px; margin-left:8px;
  }
  body .mkt-pane .tg-seg{ background:transparent !important; padding:9px 10px 6px !important; gap:3px !important; border:0 !important; }
  body .mkt-pane .tg-seg button{
    font-family:var(--cvm); font-size:10px; font-weight:600; color:var(--pr-ink-3);
    background:transparent !important; border:1px solid var(--pr-line-2) !important; border-radius:7px !important; padding:5px 0 !important;
  }
  body .mkt-pane .tg-seg button.on{ color:#180a02 !important; background:linear-gradient(180deg,#fdba74,var(--pr-ember)) !important; border-color:transparent !important; }
  body .mkt-pane .mkt-search{ margin:4px 10px 8px !important; background:#101017 !important; border:1px solid var(--pr-line) !important; border-radius:8px !important; }
  body .mkt-pane .mkt-search input{ font-family:var(--cvm); font-size:11px; }
  body .mkt-pane .tg-row{
    border-radius:0 !important; border:0 !important; border-bottom:1px solid var(--pr-line) !important;
    border-left:2px solid transparent !important; padding:8px 12px !important; background:transparent !important; transition:background .14s,border-color .14s;
  }
  body .mkt-pane .tg-row:hover{ background:linear-gradient(90deg,rgba(249,115,22,.08),transparent 70%) !important; border-left-color:var(--pr-ember) !important; }
  body .mkt-pane .r-ico{ width:24px !important; height:24px !important; border-radius:7px !important; font-size:10px !important; }
  body .mkt-pane .r-sym{ font-weight:700; font-size:12px; }
  body .mkt-pane .r-px{ font-family:var(--cvm); font-variant-numeric:tabular-nums; font-size:11px; font-weight:600; }
  body .mkt-pane .r-chg{ font-family:var(--cvm); font-variant-numeric:tabular-nums; font-size:10px; }

  /* ---------- ZONE 3 · POSITION TERMINAL ---------- */
  body .side-pane .term-head{ padding:14px 15px 12px !important; border-bottom:1px solid var(--pr-line) !important; }
  body .side-pane .th-uri{ font-family:var(--cvm); font-size:11px; color:var(--pr-ember); letter-spacing:.02em; }
  body .side-pane .th-online{ font-family:var(--cvm); font-size:9.5px; color:#34d399; }
  body .side-pane .th-bal-amt{ font-family:var(--cvm); font-variant-numeric:tabular-nums; font-size:27px; font-weight:600; letter-spacing:-.02em; }
  body .side-pane .th-bal-chg{ font-family:var(--cvm); font-size:12px; }
  body .side-pane .th-bal-today{ font-family:var(--cvm); font-size:10px; color:var(--pr-ink-3); }
  body .side-pane .term-hold-h{
    font-family:var(--cvm); font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--pr-ink-3); padding:12px 15px 8px !important;
  }
  body .side-pane .th-tok{
    border-radius:0 !important; border:0 !important; border-top:1px solid var(--pr-line) !important;
    border-left:2px solid transparent !important; padding:9px 15px !important; background:transparent !important; transition:background .14s,border-color .14s;
  }
  body .side-pane .th-tok:hover{ background:linear-gradient(90deg,rgba(249,115,22,.07),transparent 70%) !important; border-left-color:var(--pr-ember) !important; }
  body .side-pane .th-tok-ico{ width:26px !important; height:26px !important; border-radius:7px !important; font-size:10px !important; }
  body .side-pane .th-tok-sym{ font-weight:700; font-size:12px; }
  body .side-pane .th-tok-sub{ font-family:var(--cvm); font-size:9px; color:var(--pr-ink-3); }
  body .side-pane .th-tok-v{ font-family:var(--cvm); font-variant-numeric:tabular-nums; font-size:12px; font-weight:600; }
  body .side-pane .th-tok-pct{ font-family:var(--cvm); font-size:9px; }

  /* ---------- EMBER TAPE (top ticker) ---------- */
  body .ticker{
    position:relative; background:linear-gradient(90deg,rgba(249,115,22,.06),transparent 10%,transparent 90%,rgba(249,115,22,.06)) !important;
    border-bottom:1px solid var(--pr-line) !important;
  }
  body .ticker::before{
    content:"LIVE"; position:absolute; left:0; top:0; bottom:0; z-index:2; display:flex; align-items:center; padding:0 12px;
    font-family:var(--cvm); font-size:9px; letter-spacing:.14em; color:var(--pr-ember);
    background:linear-gradient(90deg,#08080b 68%,transparent); border-right:1px solid var(--pr-line);
  }
  body .ticker .ticker-track{ padding-left:64px; }
  body .ticker .tk-s{ font-family:var(--cvm); font-weight:600; }
  body .ticker .tk-p{ font-family:var(--cvm); font-variant-numeric:tabular-nums; }
  body .ticker .tk-item .up, body .ticker .tk-item .down{ font-family:var(--cvm); }
}

/* ============================================================================
   SWAP TICKET · terminal-noir reskin of the unified-swap card (all views).
   Obsidian mono legs, mono readout, dark-on-ember CTA. Higher specificity than
   the component's inline <style> so no !important arms-race on layout. ========= */
#chat-thread .usw{ --cvm:ui-monospace,'JetBrains Mono','DejaVu Sans Mono',Menlo,monospace; }
#chat-thread .usw-leg{ background:#0e0e15 !important; border:1px solid var(--pr-line) !important; border-radius:14px !important; }
#chat-thread .usw-leg:focus-within{ border-color:var(--pr-line-2) !important; box-shadow:0 0 0 1px rgba(249,115,22,.14), 0 10px 30px -18px rgba(0,0,0,.8) !important; }
#chat-thread .usw-leg-lbl{ font-family:var(--cvm); letter-spacing:.12em; color:var(--pr-ink-3) !important; }
#chat-thread .usw-est{ font-family:var(--cvm); }
#chat-thread .usw-amt{ font-family:var(--cvm) !important; font-size:30px !important; font-weight:600 !important; letter-spacing:-.02em !important; }
#chat-thread .usw-pct{ font-family:var(--cvm); background:#15151d !important; border:1px solid var(--pr-line) !important; border-radius:7px !important; color:var(--pr-ink-2) !important; font-weight:700; }
#chat-thread .usw-pct:hover{ border-color:rgba(249,115,22,.5) !important; color:#fdba74 !important; background:rgba(249,115,22,.06) !important; }
#chat-thread .usw-flip{ background:#15151d !important; border:1px solid var(--pr-line-2) !important; box-shadow:0 6px 18px -8px rgba(0,0,0,.7) !important; border-radius:10px !important; width:34px !important; height:34px !important; color:var(--pr-ember) !important; }
#chat-thread .usw-pick{ background:#15151d !important; border:1px solid var(--pr-line-2) !important; border-radius:999px !important; }
#chat-thread .usw-pick-s{ font-weight:700; }
#chat-thread .usw-pick-c{ font-family:var(--cvm); }
#chat-thread .usw-mono, #chat-thread .usw-rate, #chat-thread .usw-route, #chat-thread .usw-rev-row, #chat-thread .usw-rev-big, #chat-thread .usw-bal, #chat-thread .usw-ca input{ font-family:var(--cvm) !important; font-variant-numeric:tabular-nums; }
#chat-thread .usw-ca input{ background:#15151d !important; border-color:var(--pr-line) !important; }
#chat-thread .usw-go{ background:linear-gradient(180deg,#fdba74,var(--pr-ember) 55%,#ea6a0c) !important; color:#180a02 !important; border-radius:13px !important;
  box-shadow:0 12px 30px -12px rgba(249,115,22,.4), inset 0 1px 0 rgba(255,255,255,.35) !important; }
#chat-thread .usw-hint{ font-family:var(--cvm); }

/* ============================================================================
   ALL PAGES · terminal-noir cohesion across every view + home/swap advances === */
@media (min-width:1150px){
  /* app-wide obsidian ground so every route sits in the same instrument */
  body{ background:
    radial-gradient(1000px 460px at 80% -12%, rgba(249,115,22,.06), transparent 60%),
    radial-gradient(680px 420px at 4% 112%, rgba(59,130,246,.045), transparent 62%),
    #08080b !important; }
  .chat-surface{ background:transparent !important; }
  /* work-tabs nav → mono, ember-active */
  .work-tabs{ background:linear-gradient(180deg,rgba(255,255,255,.015),transparent) !important; border-bottom:1px solid var(--pr-line) !important; }
  .work-tab{ font-family:var(--cvm); font-size:11.5px !important; letter-spacing:.01em; color:var(--pr-ink-3) !important; border-radius:8px !important; }
  .work-tab .wt-ico{ opacity:.72; }
  .work-tab:hover{ color:var(--txt-1,#f4f4f6) !important; background:rgba(255,255,255,.03) !important; }
  .work-tab.active{ color:#180a02 !important; background:linear-gradient(180deg,#fdba74,var(--pr-ember)) !important; }
  .work-tab.active .wt-ico{ opacity:1; }
  /* SWAP advance · chain tabs + mono readout to match the deck */
  #chat-thread .usw-chtabs{ background:transparent !important; }
  #chat-thread .usw-chtab{ font-family:var(--cvm); border-radius:8px !important; }
  #chat-thread .usw-chtab.active{ color:#180a02 !important; background:linear-gradient(180deg,#fdba74,var(--pr-ember)) !important; }
  #chat-thread .usw-badge.safe{ font-family:var(--cvm); }
  #chat-thread .usw-rev-big, #chat-thread .usw-rev-pay, #chat-thread .usw-rev-get{ font-family:var(--cvm) !important; font-variant-numeric:tabular-nums; }
}
/* ---- Trending / New / Gainers views now render .ptok filament in #welcome ----
   Neutralize the old boxed table + feed-grid, make it a single-column filament list,
   and re-skin the trench chrome (chain tabs + search) to terminal-noir. */
@media (min-width:1150px){
  .chat-thread #welcome .trench-table{ background:transparent !important; border:0 !important; border-radius:0 !important; overflow:visible !important; margin-top:8px !important; }
  .chat-thread #welcome .trench-fil, .chat-thread #welcome .feed-grid{ display:flex !important; flex-direction:column; gap:0 !important; grid-template-columns:1fr !important; }
  .chat-thread #welcome .trench-head{ display:none !important; }
  .chat-thread #welcome .trench-chrome{ margin-top:2px; }
  .chat-thread #welcome .trench-bar{ display:flex; align-items:center; gap:10px; }
  .chat-thread #welcome .trench-tabs{ background:transparent !important; border:0 !important; padding:0 !important; gap:3px !important; }
  .chat-thread #welcome .trench-tab{ font-family:var(--cvm); font-size:10.5px !important; font-weight:600 !important; color:var(--pr-ink-3) !important;
    background:transparent !important; border:1px solid var(--pr-line-2) !important; border-radius:8px !important; padding:6px 12px !important; }
  .chat-thread #welcome .trench-tab.on{ color:#180a02 !important; background:linear-gradient(180deg,#fdba74,var(--pr-ember)) !important; border-color:transparent !important; }
  .chat-thread #welcome .trench-search{ background:#101017 !important; border:1px solid var(--pr-line) !important; border-radius:9px !important; }
  .chat-thread #welcome .trench-search input{ font-family:var(--cvm); font-size:11.5px; }
  /* view heading → terminal caption */
  .chat-thread #welcome .view-title{ font-size:17px; letter-spacing:-.01em; }
  .chat-thread #welcome .view-sub{ font-family:var(--cvm); font-size:11px; color:var(--pr-ink-3); }
}

/* raven watermark embossed behind the deck (home) */
.chat-thread #welcome > .pulse-cols::after{
  content:""; position:absolute; right:-18px; bottom:-26px; width:290px; height:290px; z-index:0; pointer-events:none; opacity:.045;
  background:no-repeat center/contain;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 13c3.5-1 5-4 8.5-4 2 0 3 .8 4 2 .6.7 1.3 1 2.2 1 .8 0 1.3-.3 1.8-.8-.2 2-1.6 3.4-3.4 3.7l1.9 3.4-4-1.6c-2.2.7-4.6.4-6.4-.9C5.7 17.6 3.8 15.6 3 13Z' fill='%23f97316'/%3E%3C/svg%3E");
}
.chat-thread #welcome > .pulse-cols > *{ position:relative; z-index:1; }

/* ---- scrollbars ---- */
body ::-webkit-scrollbar { width: 9px; height: 9px; }
body ::-webkit-scrollbar-thumb { background: rgba(255,255,255,.09); border-radius: 999px; }
body ::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,.16); }

/* ---- On-chain X-ray · token detail sheet (GoldRush holders + concentration · thirdweb transfers) ---- */
.tok-sheet .ts-onchain{ margin:15px 0 4px; padding:13px 15px; border:1px solid var(--pr-line,rgba(255,255,255,.09)); border-radius:13px; background:linear-gradient(180deg,rgba(249,115,22,.04),rgba(255,255,255,.015)); }
.tok-sheet .ts-oc-load{ font:600 10px/1 var(--cvm,ui-monospace,'JetBrains Mono',monospace); letter-spacing:1px; text-transform:uppercase; color:var(--muted,#8a909a); }
.tok-sheet .ts-oc-h{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; font:700 10px/1 var(--cvm,ui-monospace,'JetBrains Mono',monospace); letter-spacing:1.4px; text-transform:uppercase; color:#fdba74; margin-bottom:12px; }
.tok-sheet .ts-oc-src{ font-weight:600; font-size:9px; letter-spacing:.4px; text-transform:none; color:var(--muted,#8a909a); }
.tok-sheet .ts-oc-grid{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:11px; }
.tok-sheet .ts-oc-s .k{ font:600 9px/1 var(--cvm,ui-monospace,monospace); letter-spacing:.6px; text-transform:uppercase; color:var(--muted,#8a909a); margin-bottom:6px; }
.tok-sheet .ts-oc-s .v{ font:600 15px/1 var(--cvm,ui-monospace,'JetBrains Mono',monospace); color:#f4f4f6; font-variant-numeric:tabular-nums; }
.tok-sheet .ts-oc-s .v.r-ok{ color:#34d399; }
.tok-sheet .ts-oc-s .v.r-warn{ color:#fbbf24; }
.tok-sheet .ts-oc-s .v.r-hi{ color:#fb7185; }
/* segmented supply-distribution bar · whales (ember) · next 90 (blue) · crowd (green=healthy) */
.tok-sheet .ts-oc-dist{ display:flex; gap:1px; height:8px; border-radius:5px; overflow:hidden; margin:14px 0 9px; background:rgba(255,255,255,.05); }
.tok-sheet .ts-oc-dist .sg{ height:100%; min-width:2px; transition:width .5s ease; }
.tok-sheet .ts-oc-dist .sg.s10{ background:linear-gradient(90deg,#fb7185,#f97316); }
.tok-sheet .ts-oc-dist .sg.smid{ background:#3b82f6; }
.tok-sheet .ts-oc-dist .sg.srest{ background:#34d399; }
.tok-sheet .ts-oc-leg{ display:flex; flex-wrap:wrap; gap:14px; margin-bottom:9px; }
.tok-sheet .ts-oc-leg span{ display:inline-flex; align-items:center; gap:6px; font:600 10px/1 var(--cvm,ui-monospace,monospace); letter-spacing:.3px; color:var(--muted,#9aa0aa); font-variant-numeric:tabular-nums; }
.tok-sheet .ts-oc-leg i{ width:8px; height:8px; border-radius:2px; flex:none; }
.tok-sheet .ts-oc-leg i.s10{ background:#f97316; }
.tok-sheet .ts-oc-leg i.smid{ background:#3b82f6; }
.tok-sheet .ts-oc-leg i.srest{ background:#34d399; }
/* fallback single bar (dist unavailable) */
.tok-sheet .ts-oc-bar{ position:relative; height:4px; border-radius:3px; background:rgba(255,255,255,.06); margin:13px 0 8px; overflow:hidden; }
.tok-sheet .ts-oc-bar i{ position:absolute; left:0; top:0; bottom:0; border-radius:3px; transition:width .5s ease; }
.tok-sheet .ts-oc-bar i.r-ok{ background:linear-gradient(90deg,#059669,#34d399); }
.tok-sheet .ts-oc-bar i.r-warn{ background:linear-gradient(90deg,#d97706,#fbbf24); }
.tok-sheet .ts-oc-bar i.r-hi{ background:linear-gradient(90deg,#e11d48,#fb7185); }
.tok-sheet .ts-oc-read{ font:11px/1.45 var(--cvm,ui-monospace,monospace); color:var(--muted,#9aa0aa); text-transform:capitalize; }
.tok-sheet .ts-oc-read.r-ok{ color:#34d399; }
.tok-sheet .ts-oc-read.r-warn{ color:#fbbf24; }
.tok-sheet .ts-oc-read.r-hi{ color:#fb7185; }
/* safety / sellability row · GoPlus honeypot+tax+LP-lock (green=safe is success-semantic) */
.tok-sheet .ts-oc-safe{ display:flex; align-items:center; gap:9px; flex-wrap:wrap; margin-top:12px; padding-top:12px; border-top:1px solid rgba(255,255,255,.06); font:600 11px/1.35 var(--cvm,ui-monospace,monospace); }
.tok-sheet .ts-oc-safe .sf-ico{ width:18px; height:18px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:11px; flex:none; }
.tok-sheet .ts-oc-safe.v-ok .sf-ico{ background:rgba(52,211,153,.15); color:#34d399; }
.tok-sheet .ts-oc-safe.v-warn .sf-ico{ background:rgba(251,191,36,.15); color:#fbbf24; }
.tok-sheet .ts-oc-safe.v-danger .sf-ico{ background:rgba(251,113,133,.16); color:#fb7185; }
.tok-sheet .ts-oc-safe .sf-lbl{ font-weight:700; letter-spacing:.3px; }
.tok-sheet .ts-oc-safe.v-ok .sf-lbl{ color:#34d399; }
.tok-sheet .ts-oc-safe.v-warn .sf-lbl{ color:#fbbf24; }
.tok-sheet .ts-oc-safe.v-danger .sf-lbl{ color:#fb7185; }
.tok-sheet .ts-oc-safe .sf-chips{ color:var(--muted,#9aa0aa); font-weight:500; letter-spacing:.2px; }
/* deck filament-row safety glyph · only warn/danger, inline in the stats row */
#welcome .ptok .ptok-safe{ margin-left:5px; font-size:11px; line-height:1; font-weight:700; cursor:help; }
#welcome .ptok .ptok-safe.sf-warn{ color:#fbbf24; }
#welcome .ptok .ptok-safe.sf-danger{ color:#fb7185; }
/* swap ticket · read-only safety chip for the target token (GoPlus) */
#chat-thread .usw .usw-safety{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:9px 0 2px; padding:9px 11px; border-radius:11px; border:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.02); font:600 11px/1.3 var(--cvm,ui-monospace,'JetBrains Mono',monospace); }
#chat-thread .usw .usw-safety .s-ic{ width:16px; height:16px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:10px; flex:none; }
#chat-thread .usw .usw-safety.v-ok{ color:#34d399; }
#chat-thread .usw .usw-safety.v-warn{ color:#fbbf24; }
#chat-thread .usw .usw-safety.v-danger{ color:#fb7185; }
#chat-thread .usw .usw-safety.v-ok .s-ic{ background:rgba(52,211,153,.15); }
#chat-thread .usw .usw-safety.v-warn .s-ic{ background:rgba(251,191,36,.15); }
#chat-thread .usw .usw-safety.v-danger .s-ic{ background:rgba(251,113,133,.16); }
#chat-thread .usw .usw-safety .s-tx{ font-weight:700; letter-spacing:.2px; }
#chat-thread .usw .usw-safety .s-cc{ margin-left:auto; color:var(--muted,#9aa0aa); font-weight:500; font-variant-numeric:tabular-nums; }

/* ===== MOBILE / TABLET filament rows (below the 1150 desktop 3-lane grid) =====
   Trenches / New / Gainers / Watch render .ptok in #welcome. Below 1150 the base
   style made them fat cards with giant full-width Buy buttons (~5/screen). Bring the
   terminal-noir filament row to touch: thin mono line, always-visible ember Buy pill,
   tap-ignite. ~9-10 tokens/screen, same instrument language as desktop. */
@media (max-width:1149px){
  .chat-thread #welcome .pulse-list,
  .chat-thread #welcome .feed-grid{
    display:flex !important; flex-direction:column !important; gap:0 !important;
    grid-template-columns:1fr !important; padding:0 !important;
  }
  .chat-thread #welcome .ptok{
    position:relative; width:100%; display:flex !important; flex-direction:column; gap:6px;
    padding:12px 15px !important; margin:0 !important;
    border:0 !important; border-bottom:1px solid var(--pr-line) !important;
    border-left:2px solid transparent !important; border-radius:0 !important;
    background:transparent !important; box-shadow:none !important; transform:none !important;
    transition:background .14s, border-color .14s;
  }
  .chat-thread #welcome .ptok:active{
    background:linear-gradient(90deg,rgba(249,115,22,.11),transparent 70%) !important;
    border-left-color:var(--pr-ember) !important;
  }
  .chat-thread #welcome .ptok-top{ display:flex !important; align-items:center; justify-content:space-between; gap:10px; padding-right:80px; }
  .chat-thread #welcome .ptok-id{ display:flex; align-items:center; gap:10px; min-width:0; }
  .chat-thread #welcome .ptok-ico{ width:36px; height:36px; border-radius:10px; flex:none; font-size:13px; font-weight:700; background-color:#15151d; background-size:cover; background-position:center; box-shadow:inset 0 0 0 1px rgba(255,255,255,.08); }
  .chat-thread #welcome .ptok-sym{ font-weight:700; font-size:15px; letter-spacing:-.01em; }
  .chat-thread #welcome .ptok-age{ font-family:var(--cvm); color:var(--pr-ember); font-weight:600; font-size:10.5px; opacity:.9; }
  .chat-thread #welcome .ptok-px{ display:flex; flex-direction:column; align-items:flex-end; text-align:right; flex:none; line-height:1.3; }
  .chat-thread #welcome .ptok-price{ font-family:var(--cvm); font-variant-numeric:tabular-nums; font-weight:600; font-size:14px; }
  .chat-thread #welcome .ptok-chg{ font-family:var(--cvm); font-variant-numeric:tabular-nums; font-size:12px; }
  .chat-thread #welcome .ptok-stats{
    display:flex; align-items:center; gap:13px; padding:0 80px 0 46px;
    font-family:var(--cvm); font-variant-numeric:tabular-nums; font-size:11px; color:var(--pr-ink-3);
  }
  .chat-thread #welcome .ptok-stats span{ white-space:nowrap; }
  .chat-thread #welcome .ptok-stats span:nth-child(2){ display:none; }
  .chat-thread #welcome .ptok-oc{ color:var(--pr-ember); opacity:.9; }
  /* Buy = compact ember pill, ALWAYS filled/visible (no hover on touch) */
  .chat-thread #welcome .ptok-buy{
    position:absolute !important; right:15px; top:50%; bottom:auto; transform:translateY(-50%); margin:0 !important; width:auto !important; min-width:0;
    display:inline-flex !important; align-items:center; justify-content:center; text-align:center;
    font-family:var(--cvm); font-size:12px; font-weight:700; letter-spacing:0;
    padding:8px 17px !important; border-radius:9px !important;
    color:#180a02 !important; background:linear-gradient(180deg,#fdba74,var(--pr-ember)) !important;
    border:0 !important; box-shadow:0 3px 12px -3px rgba(249,115,22,.4) !important;
  }
  .chat-thread #welcome .ptok-buy:active{ filter:brightness(1.08); }
  .chat-thread #welcome .ptok-prs{
    position:absolute; left:15px; right:15px; bottom:0; height:2px; border-radius:2px; overflow:hidden;
    background:rgba(251,113,133,.32); opacity:.85;
  }
  .chat-thread #welcome .ptok-prs i{ display:block; height:100%; background:#34d399; box-shadow:0 0 6px rgba(52,211,153,.55); }
  /* --- Perps table · widen Market so "PERP · up to Nx" stops triple-wrapping,
        tighten Long/Short so it fits --- */
  .chat-thread .perp-head, .chat-thread .perp-row{ grid-template-columns:2fr .9fr .7fr auto !important; }
  .chat-thread .perp-row .tr-nm b{ font-size:14px; }
  .chat-thread .perp-row .tr-nm small{ white-space:nowrap !important; font-size:9.5px !important; letter-spacing:-.01em; opacity:.72; }
  .chat-thread .perp-long, .chat-thread .perp-short{ padding:6px 10px !important; font-size:11px !important; margin-right:4px !important; }
}

@media (prefers-reduced-motion: reduce) { body * { transition: none !important; } }

/* -- global 3D hover motion on token cards · everywhere (trenches/new/gainers/watch) -- */
#chat-thread .pulse-list,#chat-thread .feed-grid,#chat-thread .trench-table,#chat-thread .pulse-cols,#chat-thread .pulse-col{perspective:1400px}
#chat-thread .ptok{transform-style:preserve-3d;transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s,border-color .2s;will-change:transform}
#chat-thread .ptok:hover{transform:translateY(-3px) translateZ(14px) rotateX(2.5deg);box-shadow:0 22px 44px -22px rgba(249,115,22,.5),0 6px 16px -12px rgba(0,0,0,.7);z-index:3}
#chat-thread .ptok .ptok-buy{transition:transform .16s,box-shadow .2s,background .2s}
#chat-thread .ptok:hover .ptok-buy{transform:translateZ(10px)}

/* -- generic list pager (.pf-pager) · used by paginated token feeds everywhere -- */
.pf-pager{display:flex;align-items:center;justify-content:center;gap:12px;padding:13px 0 4px}
.pf-pager .pyf-pg{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.09);color:#c9ced6;cursor:pointer;font-size:15px;transition:transform .16s,background .18s,border-color .18s,color .18s}
.pf-pager .pyf-pg:hover:not(.dis){background:rgba(249,115,22,.1);border-color:rgba(249,115,22,.5);color:#fdba74;transform:translateY(-1px)}
.pf-pager .pyf-pg.dis{opacity:.3;cursor:default}
.pf-pager .pyf-dots{display:flex;gap:7px;align-items:center}
.pf-pager .pyf-dot{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.16);transition:transform .2s,background .2s}
.pf-pager .pyf-dot.on{background:#f97316;transform:scale(1.5);box-shadow:0 0 10px rgba(249,115,22,.7)}
.pf-pager .pyf-pcount{font:600 11px/1 var(--cvm,ui-monospace);color:#8a8f98;letter-spacing:.05em;min-width:52px;text-align:center}
.chat-thread #welcome .ptok.pf-filt,#chat-thread .ptok.pf-filt{display:none!important}

.chat-thread #welcome .ptok.pf-pghide,#chat-thread .ptok.pf-pghide{display:none!important}

/* -- subtle decorative accents (ember title underline + faint view-head glow) -- */
#chat-thread .view-title{position:relative;display:inline-block}
#chat-thread .view-title::after{content:'';position:absolute;left:2px;width:44px;bottom:-7px;height:2px;border-radius:2px;background:linear-gradient(90deg,#f97316,rgba(249,115,22,0))}
#chat-thread .welcome{position:relative;isolation:isolate}
#chat-thread .welcome::before{content:'';position:absolute;top:-8px;right:-8px;width:360px;height:230px;pointer-events:none;background:radial-gradient(120% 100% at 100% 0,rgba(249,115,22,.055),transparent 66%);z-index:-1}

/* ---- 3D elevation for every chat card (2026-07-26) · depth + amber rim + hover lift,
       restrained (no tilt) so dense data cards stay readable ---- */
.chat-thread .result-card, .chat-thread .detail-card, .chat-thread .pf-card,
.chat-thread .vcard, .chat-thread .card, .chat-thread .ac-card {
  background-image: linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0) 42%);
  box-shadow:
    inset 0 1px 0 rgba(249,115,22,.26),
    0 2px 4px rgba(0,0,0,.42),
    0 14px 30px -14px rgba(0,0,0,.60),
    0 34px 66px -40px rgba(249,115,22,.15) !important;
  transition: transform .28s cubic-bezier(.2,.7,.2,1), box-shadow .28s !important;
}
.chat-thread .result-card:hover, .chat-thread .detail-card:hover, .chat-thread .pf-card:hover,
.chat-thread .vcard:hover, .chat-thread .card:hover, .chat-thread .ac-card:hover {
  transform: translateY(-3px) !important;
  box-shadow:
    inset 0 1px 0 rgba(249,115,22,.34),
    0 3px 6px rgba(0,0,0,.45),
    0 22px 44px -16px rgba(0,0,0,.70),
    0 50px 92px -42px rgba(249,115,22,.22) !important;
}

/* ============================================================================
   Route picker, engine identity + premium 3D  (added 2026-08-02, Flash engine)
   premium.css loads LAST so these win the cascade over corvo-grid.css.
   ========================================================================= */

/* --- engine colours. Flash = gold, distinct from Edge orange at a glance --- */
.swr-route.route-flash{color:#fcd34d;background:rgba(252,211,77,.12);border-color:rgba(252,211,77,.32)}
.rpk2-name.route-flash{color:#fcd34d}
/* neutral fallback so an unregistered engine never borrows another's colour */
.swr-route.route-generic{color:#9aa3b2;background:rgba(154,163,178,.10);border-color:rgba(154,163,178,.26)}
.rpk2-name.route-generic{color:#9aa3b2}

/* --- BEST is a RECOMMENDATION, so it reads brand-orange, not green.
       Green stays reserved for the real P&L deltas (.rpk2-d.pos/.neg). --- */
.rpk2-row.is-best{
  background:linear-gradient(180deg,rgba(249,115,22,.13),rgba(249,115,22,.05));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07);
}
.rpk2-b.best{background:rgba(249,115,22,.18);color:#fb923c}

/* --- 3D depth, matching the .ptok token-card system already in this file --- */
.chat-thread .result-card.rpk2,#chat-thread .result-card.rpk2{
  perspective:1200px;
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012));
  box-shadow:0 18px 40px -26px rgba(0,0,0,.75),inset 0 1px 0 rgba(255,255,255,.06);
}
.rpk2-list{transform-style:preserve-3d}
button.rpk2-row{
  transform-style:preserve-3d;
  transition:transform .3s cubic-bezier(.22,1,.36,1),background .18s,box-shadow .3s;
  will-change:transform;
}
button.rpk2-row:hover{
  transform:translateY(-2px) translateZ(14px) rotateX(2.5deg);
  box-shadow:0 22px 44px -24px rgba(249,115,22,.45),0 6px 16px -12px rgba(0,0,0,.7);
  z-index:3;
}
button.rpk2-row:active{transform:translateY(0) translateZ(6px) rotateX(1deg)}
.rpk2-row.is-best .rpk2-out{text-shadow:0 0 18px rgba(249,115,22,.35)}
.rpk2-go{transition:transform .3s cubic-bezier(.22,1,.36,1)}
button.rpk2-row:hover .rpk2-go{transform:translateX(3px)}

/* --- the picker CTA gets the same sheen the primary buttons use --- */
.rpk2-cancel{transition:transform .2s,color .18s,border-color .18s}
.rpk2-cancel:hover{transform:translateY(-1px)}

@media (prefers-reduced-motion:reduce){
  button.rpk2-row,button.rpk2-row:hover,button.rpk2-row:active,
  .rpk2-go,button.rpk2-row:hover .rpk2-go,.rpk2-cancel:hover{transform:none;transition:none}
}

/* --- an ASYNC Flash order that is placed but not yet filled. Gold to match the
       Flash engine colour, never the green success treatment of a settled swap. --- */
.result-card.swr.is-pending{
  border-color:rgba(252,211,77,.30);
  background:linear-gradient(180deg,rgba(252,211,77,.07),rgba(252,211,77,.015));
  box-shadow:0 18px 40px -26px rgba(0,0,0,.75),inset 0 1px 0 rgba(255,255,255,.06);
}
.swr-check.is-pend{color:#fcd34d;animation:swrPulse 1.9s ease-in-out infinite}
.result-card.swr.is-pending .swr-foot{color:#fcd34d;opacity:.9}
@keyframes swrPulse{0%,100%{opacity:1}50%{opacity:.45}}
@media (prefers-reduced-motion:reduce){.swr-check.is-pend{animation:none}}

/* ============================================================================
   /buy + /swap cards, 3D + premium  (2026-08-02)
   The review card (before signing) and the result card (after) had NO depth at
   all while the token cards and the route picker did. Same tilt vocabulary as
   .ptok so the whole thread reads as one system.
   ========================================================================= */

/* --- the card itself: real surface, not a flat panel --- */
.chat-thread .result-card.swr,#chat-thread .result-card.swr{
  perspective:1200px;
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.014));
  box-shadow:0 20px 44px -28px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.07);
  transform-style:preserve-3d;
  transition:transform .34s cubic-bezier(.22,1,.36,1),box-shadow .34s,border-color .22s;
  will-change:transform;
}
.chat-thread .result-card.swr:hover,#chat-thread .result-card.swr:hover{
  transform:translateY(-3px) translateZ(12px) rotateX(1.6deg);
  box-shadow:0 30px 58px -30px rgba(249,115,22,.34),0 8px 20px -14px rgba(0,0,0,.72);
  border-color:rgba(249,115,22,.24);
}

/* --- header sits proud of the card --- */
.swr-head{transform:translateZ(18px)}
.swr-title{letter-spacing:-.01em}
.swr-check,.swr-ic{
  display:inline-flex;align-items:center;justify-content:center;
  width:20px;height:20px;margin-right:7px;border-radius:50%;
  background:rgba(249,115,22,.16);color:#fb923c;font-size:12px;font-weight:800;
  box-shadow:0 0 0 1px rgba(249,115,22,.28),0 0 16px rgba(249,115,22,.28);
}
/* the review icon is an emoji glyph, keep it legible inside the disc */
.swr-ic{font-size:11px;line-height:1}

/* --- the pay -> receive flow, the part people actually read --- */
.swr-flow{transform:translateZ(24px)}
.swr-leg{
  padding:11px 12px;border-radius:12px;
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.008));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
  transition:transform .26s cubic-bezier(.22,1,.36,1),box-shadow .26s;
}
.chat-thread .result-card.swr:hover .swr-leg{box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.swr-amt{text-shadow:0 1px 12px rgba(0,0,0,.35)}
/* the arrow between legs, a real connector with depth */
.swr-sep{position:relative;display:flex;align-items:center;justify-content:center;margin:2px 0}
.swr-sep span{
  display:inline-flex;align-items:center;justify-content:center;
  width:26px;height:26px;border-radius:50%;
  background:linear-gradient(180deg,rgba(249,115,22,.20),rgba(249,115,22,.07));
  box-shadow:0 0 0 1px rgba(249,115,22,.26),0 6px 16px -8px rgba(249,115,22,.5);
  color:#fb923c;font-weight:800;transform:translateZ(10px);
  transition:transform .3s cubic-bezier(.22,1,.36,1);
}
.chat-thread .result-card.swr:hover .swr-sep span{transform:translateZ(18px) translateY(1px) scale(1.06)}

/* --- meta rows recede, so the amounts lead --- */
.swr-meta{transform:translateZ(8px)}
.swr-meta a{color:#fb923c;text-decoration:none;border-bottom:1px solid rgba(249,115,22,.32)}
.swr-meta a:hover{border-bottom-color:rgba(249,115,22,.7)}

/* --- review card reads as a DECISION surface, warmer border --- */
.result-card.swr.swr-review{border-color:rgba(249,115,22,.22)}
.result-card.swr.swr-review .swr-flow{transform:translateZ(26px)}
/* a warning review must not look inviting */
.result-card.swr.swr-review.is-warn{border-color:rgba(248,113,113,.38)}
.result-card.swr.swr-review.is-warn .swr-check{background:rgba(248,113,113,.16);color:#f87171;box-shadow:0 0 0 1px rgba(248,113,113,.3),0 0 16px rgba(248,113,113,.26)}

/* pending (async order) keeps its gold identity, defined earlier, just add depth */
.result-card.swr.is-pending .swr-check{background:rgba(252,211,77,.16);color:#fcd34d;box-shadow:0 0 0 1px rgba(252,211,77,.3),0 0 16px rgba(252,211,77,.3)}

@media (prefers-reduced-motion:reduce){
  .chat-thread .result-card.swr,#chat-thread .result-card.swr,
  .chat-thread .result-card.swr:hover,#chat-thread .result-card.swr:hover,
  .swr-head,.swr-flow,.swr-meta,.swr-sep span,
  .chat-thread .result-card.swr:hover .swr-sep span{transform:none;transition:none}
}
/* touch devices: no hover tilt, keep the static depth */
@media (hover:none){
  .chat-thread .result-card.swr:hover,#chat-thread .result-card.swr:hover{transform:none}
}

/* ============================================================================
   UNIVERSAL CARD DEPTH  (2026-08-03)
   Every chat card is a .result-card, but only .swr and the token cards had any
   depth, so ~15 families (detail, generic, intel, history, discover, movers,
   scam-scan, research, pp, pm, alpha-signal, send-help…) read flat next to them.
   One base treatment here so the whole thread is a single system instead of a
   few polished cards and a lot of plain panels.
   ========================================================================= */

.chat-thread .result-card,#chat-thread .result-card{
  perspective:1200px;
  transform-style:preserve-3d;
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012));
  box-shadow:0 18px 40px -28px rgba(0,0,0,.78),inset 0 1px 0 rgba(255,255,255,.06);
  transition:transform .32s cubic-bezier(.22,1,.36,1),box-shadow .32s,border-color .22s;
  will-change:transform;
}
.chat-thread .result-card:hover,#chat-thread .result-card:hover{
  transform:translateY(-2px) translateZ(10px) rotateX(1.4deg);
  box-shadow:0 28px 54px -30px rgba(249,115,22,.30),0 8px 20px -14px rgba(0,0,0,.7);
  border-color:rgba(249,115,22,.20);
}

/* headers ride forward, dense data recedes, so the eye lands on the title first */
.chat-thread .result-card .rc-head,#chat-thread .result-card .rc-head,
.chat-thread .result-card .dc-head,#chat-thread .result-card .dc-head{transform:translateZ(16px)}
.chat-thread .result-card .rc-footer,#chat-thread .result-card .rc-footer,
.chat-thread .result-card .dc-footer,#chat-thread .result-card .dc-footer{transform:translateZ(4px)}

/* the hero number on a detail card is the point of the card, push it furthest */
.chat-thread .result-card .dc-hero,#chat-thread .result-card .dc-hero{transform:translateZ(22px)}
.chat-thread .result-card .dc-hero-v,#chat-thread .result-card .dc-hero-v{text-shadow:0 2px 18px rgba(0,0,0,.45)}

/* rows lift individually on hover, same vocabulary as the route picker */
.chat-thread .rc-row,#chat-thread .rc-row,
.chat-thread .dc-field,#chat-thread .dc-field,
.chat-thread .ar-field,#chat-thread .ar-field{
  transform-style:preserve-3d;
  transition:transform .26s cubic-bezier(.22,1,.36,1),background .18s;
  border-radius:10px;
}
.chat-thread .rc-row:hover,#chat-thread .rc-row:hover,
.chat-thread .dc-field:hover,#chat-thread .dc-field:hover{
  transform:translateZ(9px);
  background:rgba(255,255,255,.032);
}

/* tappable rows read as tappable, brand chevron drift */
.chat-thread .rc-row[data-cmd],.chat-thread .rc-row[data-view],
#chat-thread .rc-row[data-cmd],#chat-thread .rc-row[data-view]{cursor:pointer}
.chat-thread .rc-row[data-cmd]:hover,#chat-thread .rc-row[data-cmd]:hover{
  box-shadow:inset 0 0 0 1px rgba(249,115,22,.18);
}

/* card chips get the same lift the primary buttons use */
.chat-thread .result-card .chip,#chat-thread .result-card .chip,
.chat-thread .result-card .dc-chip,#chat-thread .result-card .dc-chip{
  transition:transform .22s cubic-bezier(.22,1,.36,1),box-shadow .22s,border-color .18s;
}
.chat-thread .result-card .chip:hover,#chat-thread .result-card .chip:hover,
.chat-thread .result-card .dc-chip:hover,#chat-thread .result-card .dc-chip:hover{
  transform:translateY(-1px) translateZ(8px);
  box-shadow:0 10px 22px -14px rgba(249,115,22,.55);
}

/* a card entering the thread settles in from slightly behind, not a flat fade */
@keyframes cardIn3d{
  from{opacity:0;transform:translateY(8px) translateZ(-30px) rotateX(-3deg)}
  to  {opacity:1;transform:none}
}
.chat-thread .result-card,#chat-thread .result-card{animation:cardIn3d .42s cubic-bezier(.22,1,.36,1) both}

@media (prefers-reduced-motion:reduce){
  .chat-thread .result-card,#chat-thread .result-card,
  .chat-thread .result-card:hover,#chat-thread .result-card:hover,
  .chat-thread .rc-row:hover,#chat-thread .rc-row:hover,
  .chat-thread .dc-field:hover,#chat-thread .dc-field:hover,
  .chat-thread .result-card .rc-head,#chat-thread .result-card .rc-head,
  .chat-thread .result-card .dc-hero,#chat-thread .result-card .dc-hero,
  .chat-thread .result-card .chip:hover,#chat-thread .result-card .chip:hover{
    transform:none;animation:none;transition:none;
  }
}
/* touch: keep the static depth, drop the hover tilt (it sticks after a tap) */
@media (hover:none){
  .chat-thread .result-card:hover,#chat-thread .result-card:hover,
  .chat-thread .rc-row:hover,#chat-thread .rc-row:hover,
  .chat-thread .dc-field:hover,#chat-thread .dc-field:hover{transform:none}
}

/* --- override the stark flattener -------------------------------------------
   style.css:10614 sets `.card,.result-card,.pf-card,.suggest{ background:.. !important;
   box-shadow:none !important; ... }` globally ("CARDS, stark, thin-bordered"). That
   !important beats every non-important rule, so the depth above was being erased.
   Operator asked for premium 3D on the cards, so we win back ONLY the two
   properties depth needs (fill + shadow) and deliberately leave the stark pass's
   border and border-radius alone, so the shape language stays theirs.
   ------------------------------------------------------------------------- */
.chat-thread .result-card,#chat-thread .result-card{
  background:
    linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.012)),
    var(--bg-1) !important;
  box-shadow:0 18px 40px -28px rgba(0,0,0,.78),inset 0 1px 0 rgba(255,255,255,.07) !important;
}
.chat-thread .result-card:hover,#chat-thread .result-card:hover{
  box-shadow:0 28px 54px -30px rgba(249,115,22,.30),0 8px 20px -14px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.09) !important;
}
/* the swap + picker cards keep their own stronger identity on top */
.chat-thread .result-card.swr,#chat-thread .result-card.swr{
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.014)),var(--bg-1) !important;
}
.chat-thread .result-card.swr.is-pending,#chat-thread .result-card.swr.is-pending{
  background:linear-gradient(180deg,rgba(252,211,77,.08),rgba(252,211,77,.015)),var(--bg-1) !important;
}
.rpk2-row.is-best{
  background:linear-gradient(180deg,rgba(249,115,22,.14),rgba(249,115,22,.05)) !important;
}
@media (prefers-reduced-motion:reduce){
  .chat-thread .result-card:hover,#chat-thread .result-card:hover{
    box-shadow:0 18px 40px -28px rgba(0,0,0,.78),inset 0 1px 0 rgba(255,255,255,.07) !important;
  }
}

/* token-card SELL chip. It existed only on the Solana branch and had no styling at
   all, so it rendered as a plain chip. Base branches now offer it too. */
.tk-chip.tk-chip-sell{
  color:#fca5a5;
  background:linear-gradient(180deg,rgba(248,113,113,.14),rgba(248,113,113,.05));
  border-color:rgba(248,113,113,.30);
}
.tk-chip.tk-chip-sell:hover{
  border-color:rgba(248,113,113,.55);
  box-shadow:0 10px 22px -14px rgba(248,113,113,.55);
}

/* Flash order rows: status colour + a little depth. The generic card already gives
   is-pos / is-warn / is-neg gradients, this adds the 3D vocabulary the rest of the
   thread uses so history does not read flatter than the cards around it. */
.chat-thread .rc-row.is-pos .rc-v,#chat-thread .rc-row.is-pos .rc-v{color:#34d399;font-weight:800}
.chat-thread .rc-row.is-warn .rc-v,#chat-thread .rc-row.is-warn .rc-v{color:#fbbf24;font-weight:800}
.chat-thread .rc-row.is-neg .rc-v,#chat-thread .rc-row.is-neg .rc-v{color:#f87171;font-weight:800}
/* the pay -> receive flow is the point of the row, give it presence */
.chat-thread .rc-row .rc-k,#chat-thread .rc-row .rc-k{letter-spacing:.01em}
.chat-thread .rc-row.is-warn,#chat-thread .rc-row.is-warn{position:relative;overflow:hidden}
/* an OPEN order is still working, so it breathes until it settles */
.chat-thread .rc-row.is-warn::after,#chat-thread .rc-row.is-warn::after{
  content:"";position:absolute;left:0;top:0;bottom:0;width:2px;
  background:linear-gradient(180deg,#fbbf24,rgba(251,191,36,0));
  animation:orderPulse 1.8s ease-in-out infinite;
}
@keyframes orderPulse{0%,100%{opacity:1}50%{opacity:.25}}
@media (prefers-reduced-motion:reduce){
  .chat-thread .rc-row.is-warn::after,#chat-thread .rc-row.is-warn::after{animation:none}
}

/* a generic row that carries a command is a CHOICE, make it look tappable */
.chat-thread .rc-row-tap,#chat-thread .rc-row-tap{cursor:pointer}
.chat-thread .rc-row-tap:hover,#chat-thread .rc-row-tap:hover{
  box-shadow:inset 0 0 0 1px rgba(249,115,22,.30);
  background:rgba(249,115,22,.07);
}
.chat-thread .rc-row-tap .rc-v,#chat-thread .rc-row-tap .rc-v{color:#fb923c;font-weight:700}
.chat-thread .rc-row-tap:focus-visible,#chat-thread .rc-row-tap:focus-visible{outline:2px solid rgba(249,115,22,.6);outline-offset:2px}

/* ============================================================================
   BUTTON SYSTEM  (2026-08-03)
   One vocabulary for every interactive control. Several had NO hover state at all
   (usw-go, usw-tok, usw-flip, hl-tile), so the swap surface felt dead even when it
   was working. Depth + press + a single accent, orange #f97316 primary per brand,
   red reserved for destructive, green never decorative.
   ========================================================================= */

/* --- shared motion + press for everything clickable --- */
.btn,.chip,.tk-chip,.dc-chip,.ar-chip,.pill,.tab,.cta,.cta-primary,
.usw-go,.usw-pct,.usw-tok,.usw-flip,.hl-tile,.rpk2-cancel{
  transition:transform .2s cubic-bezier(.22,1,.36,1),box-shadow .22s,
             background .18s,border-color .18s,color .18s;
  will-change:transform;
}
.btn:active,.chip:active,.tk-chip:active,.dc-chip:active,.pill:active,.tab:active,
.cta:active,.usw-go:active,.usw-pct:active,.usw-tok:active,.usw-flip:active,.hl-tile:active{
  transform:translateY(1px) scale(.985);
}
.btn:focus-visible,.chip:focus-visible,.tk-chip:focus-visible,.dc-chip:focus-visible,
.pill:focus-visible,.tab:focus-visible,.cta:focus-visible,.usw-go:focus-visible,
.usw-pct:focus-visible,.usw-tok:focus-visible,.hl-tile:focus-visible{
  outline:2px solid rgba(249,115,22,.65);outline-offset:2px;
}

/* --- generic lift --- */
.btn:hover,.chip:hover,.tk-chip:hover,.dc-chip:hover,.pill:hover,.tab:hover,.hl-tile:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 22px -14px rgba(0,0,0,.7);
}

/* --- PRIMARY: the one orange action per surface, with a sheen sweep --- */
.btn-primary,.cta-primary,.usw-go,.tk-chip-buy{
  position:relative;overflow:hidden;
  background:linear-gradient(180deg,rgba(249,115,22,.22),rgba(249,115,22,.10));
  border:1px solid rgba(249,115,22,.42);
  color:#fdba74;font-weight:800;
}
.btn-primary:hover,.cta-primary:hover,.usw-go:hover,.tk-chip-buy:hover{
  transform:translateY(-2px);
  border-color:rgba(249,115,22,.75);
  box-shadow:0 16px 34px -16px rgba(249,115,22,.60),inset 0 1px 0 rgba(255,255,255,.10);
  color:#ffd7b0;
}
.btn-primary::after,.cta-primary::after,.usw-go::after,.tk-chip-buy::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.16) 50%,transparent 65%);
  transform:translateX(-120%);
}
.btn-primary:hover::after,.cta-primary:hover::after,.usw-go:hover::after,.tk-chip-buy:hover::after{
  transform:translateX(120%);transition:transform .68s cubic-bezier(.22,1,.36,1);
}
/* the main swap CTA had no hover at all, give it real presence */
.usw-go{width:100%;font-size:14px;letter-spacing:.01em}

/* --- DESTRUCTIVE / SELL --- */
.btn-danger,.tk-chip-sell{
  background:linear-gradient(180deg,rgba(248,113,113,.16),rgba(248,113,113,.05));
  border-color:rgba(248,113,113,.34);color:#fca5a5;
}
.btn-danger:hover,.tk-chip-sell:hover{
  transform:translateY(-2px);border-color:rgba(248,113,113,.62);
  box-shadow:0 14px 30px -16px rgba(248,113,113,.55);color:#fecaca;
}

/* --- swap widget: token picker, % chips, flip --- */
.usw-tok{
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.10);border-radius:999px;
}
.usw-tok:hover{
  transform:translateY(-1px);
  border-color:rgba(249,115,22,.45);
  box-shadow:0 10px 22px -14px rgba(249,115,22,.45);
}
.usw-pct:hover{
  transform:translateY(-1px);
  border-color:rgba(249,115,22,.45);color:#fdba74;
  box-shadow:0 8px 18px -12px rgba(249,115,22,.45);
}
.usw-flip{border-radius:50%}
.usw-flip:hover{
  transform:rotate(180deg) scale(1.08);
  border-color:rgba(249,115,22,.55);
  box-shadow:0 0 0 1px rgba(249,115,22,.28),0 8px 20px -10px rgba(249,115,22,.55);
}

/* --- ghost / secondary stay quiet, they should not compete --- */
.btn-ghost:hover{border-color:rgba(255,255,255,.24);background:rgba(255,255,255,.045)}

/* --- home tiles get depth like the cards --- */
.hl-tile{transform-style:preserve-3d}
.hl-tile:hover{transform:translateY(-3px) translateZ(10px) rotateX(2deg);box-shadow:0 20px 40px -22px rgba(249,115,22,.40)}

/* --- disabled must never look clickable --- */
.btn:disabled,.chip:disabled,.usw-go:disabled,.tk-chip:disabled,
.btn[disabled],.usw-go[disabled]{
  opacity:.45;cursor:not-allowed;transform:none!important;box-shadow:none!important;
}
.btn:disabled:hover,.usw-go:disabled:hover{transform:none!important;box-shadow:none!important}

@media (prefers-reduced-motion:reduce){
  .btn,.chip,.tk-chip,.dc-chip,.pill,.tab,.cta,.usw-go,.usw-pct,.usw-tok,.usw-flip,.hl-tile,
  .btn:hover,.chip:hover,.tk-chip:hover,.usw-go:hover,.usw-tok:hover,.usw-pct:hover,
  .usw-flip:hover,.hl-tile:hover,.btn-primary:hover{transform:none;transition:none}
  .btn-primary::after,.usw-go::after,.tk-chip-buy::after{display:none}
}
@media (hover:none){
  .btn:hover,.chip:hover,.tk-chip:hover,.usw-go:hover,.usw-tok:hover,
  .usw-pct:hover,.usw-flip:hover,.hl-tile:hover{transform:none;box-shadow:none}
}

/* usw-tok and usw-flip carry their own base rules in style.css with equal or higher
   specificity, so scope these to the widget to win without !important. */
.usw .usw-tok{
  background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.12);
}
.usw .usw-tok:hover{border-color:rgba(249,115,22,.50)}
.usw .usw-flip{border-radius:50%;aspect-ratio:1/1;display:inline-flex;align-items:center;justify-content:center}