/* Fondue FX v3 (DRAFT): chrome/glass for solids, liquid for flows. Reads kit-v2 tokens only. */
.fx-mesh{position:fixed;inset:0;width:100vw;height:100vh;z-index:0;pointer-events:none;display:block}
.fx-mesh-fallback{background:radial-gradient(60% 50% at 30% 20%,rgba(255,106,61,.16),transparent 60%),radial-gradient(50% 60% at 80% 70%,rgba(176,141,87,.16),transparent 65%),var(--c-bg)}
body:has(.fx-mesh){background-image:none}
body:has(.fx-mesh)::before{background:radial-gradient(ellipse at 50% 40%,transparent 0,rgba(21,23,28,.55) 85%)!important}
.app,.wrap,main,section{position:relative;z-index:1}
/* glass card: Linear-style hairline + top specular + pointer sheen */
.fx-glass,.card{--mx:30%;--my:0%;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.01) 40%),rgba(27,30,36,.62);
  border:1px solid rgba(255,255,255,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 1px 0 rgba(0,0,0,.4),0 18px 50px -20px rgba(0,0,0,.7);
  backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);position:relative;isolation:isolate}
.fx-glass::before,.card::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1;opacity:0;transition:opacity var(--m-base) var(--m-ease);
  background:radial-gradient(420px circle at var(--mx) var(--my),rgba(255,180,120,.10),transparent 45%)}
.fx-glass:hover::before,.card:hover::before{opacity:1}
.card:hover,.fx-glass:hover{border-color:rgba(176,141,87,.38)}
/* titanium pot card: brushed metal + conic sheen + brass hairline */
.fx-ti,.potcard{background:
  radial-gradient(500px circle at var(--mx,20%) var(--my,0%),rgba(255,255,255,.08),transparent 40%),
  repeating-linear-gradient(100deg,rgba(255,255,255,.018) 0 1px,transparent 1px 3px),
  linear-gradient(155deg,#2C3038 0%,#1C1F25 38%,#23262D 62%,#17191E 100%)!important;
  border:1px solid rgba(255,255,255,.09)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),inset 0 -1px 0 rgba(0,0,0,.5),0 0 0 1px rgba(0,0,0,.35),0 24px 60px -24px rgba(0,0,0,.8),0 0 40px -18px rgba(255,106,61,.25)}
.fx-ti::after,.potcard::after{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;pointer-events:none;
  background:linear-gradient(135deg,rgba(226,195,138,.55),rgba(176,141,87,.08) 30%,transparent 60%,rgba(255,106,61,.35));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
/* buttons: chrome/glass, Signal primary keeps AA (Ink on Signal 14:1) */
.btn{background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.02));border:1px solid var(--c-rule-strong);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 1px 2px rgba(0,0,0,.4);
  transition:transform 240ms var(--m-spring),box-shadow 240ms var(--m-ease),border-color 240ms}
.btn:hover{border-color:rgba(226,195,138,.6);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 0 0 3px rgba(176,141,87,.12),0 8px 24px -10px rgba(255,106,61,.45)}
.btn.primary,.btn:where([class*=primary]){background:linear-gradient(180deg,#DAFF70,#C8FF3D 55%,#B4EA2C);border-color:#E4FF9A;color:var(--c-accent-ink);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6),inset 0 -2px 0 rgba(0,0,0,.12),0 0 0 1px rgba(0,0,0,.3),0 10px 30px -10px rgba(200,255,61,.55)}
.btn.primary:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 0 0 4px rgba(200,255,61,.16),0 14px 36px -10px rgba(200,255,61,.7)}
.btn:active{transform:translateY(1px) scale(.985)}
/* rolling digits */
.fx-roll{display:inline-flex;font-variant-numeric:tabular-nums}
.fx-roll>span{display:inline-flex}
.fx-ch{display:inline-block;height:1.1em;line-height:1.1em;overflow:hidden;vertical-align:top}
.fx-strip{display:flex;flex-direction:column;transition:transform 280ms var(--m-spring)}
.fx-strip>span{height:1.1em;line-height:1.1em}
.fx-roll.fx-up{animation:fxu 300ms var(--m-viscous)}.fx-roll.fx-down{animation:fxd 300ms var(--m-viscous)}
@keyframes fxu{15%{color:var(--c-up);text-shadow:0 0 18px rgba(61,220,151,.45)}}@keyframes fxd{15%{color:var(--c-down);text-shadow:0 0 18px rgba(255,92,108,.4)}}
.fx-chart{width:100%;height:180px;display:block;touch-action:pan-y}
@media (prefers-reduced-motion:reduce){.fx-strip{transition:none}.fx-roll.fx-up,.fx-roll.fx-down{animation:none}.btn,.card,.fx-glass{transition:none}}

/* chart range chips */
.ranges{display:flex;gap:6px;margin:var(--s-3) 0 var(--s-2)}.ranges .seg-chip{border:1px solid var(--c-rule-strong);border-radius:999px;padding:0 12px;min-height:32px;cursor:pointer;background:transparent;color:var(--c-ink-2);font:500 12px var(--f-mono)}
.ranges .seg-chip[aria-pressed=true]{background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.04));color:var(--c-ink);border-color:rgba(226,195,138,.6);box-shadow:0 0 0 3px rgba(176,141,87,.12)}
/* showcase */
.card.asset .coin{width:28px;height:28px;margin-right:8px;vertical-align:middle;filter:drop-shadow(0 2px 6px rgba(0,0,0,.5))}
.card.asset .row.between{align-items:center}.card.asset .fx-spark{height:44px;margin:6px 0 4px}
.card.asset .px{font-family:var(--f-mono);letter-spacing:-.01em}
.card.asset[data-group=xstocks]{border-color:rgba(226,195,138,.22)}
[data-filter][aria-pressed=true]{background:linear-gradient(180deg,#DAFF70,#C8FF3D);color:var(--c-accent-ink);border-color:#E4FF9A}
[data-pause]{color:var(--c-ink-2)!important;opacity:1!important}

/* brief-ui Do: UI motion <= 300 ms (ambient illustration loops excepted) */
.card,.fx-glass,.vcard,.card.asset{transition-duration:240ms!important}