/* Outdraw premium layer: one type family, hairline borders, soft depth, calm motion. Loaded last; overrides the look
   of styles.css and app.css without touching layout logic. */
:root{
  --display:'Inter Tight','Inter',system-ui,sans-serif;
  --wide:'Inter Tight','Inter',system-ui,sans-serif;
  --body:'Inter Tight','Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:'Geist Mono','DM Mono',ui-monospace,Menlo,monospace;
  --ink:#09090b; --coal:#111113; --coal-2:#17171a; --line:rgba(255,255,255,.07); --line-2:rgba(255,255,255,.12);
  --text:#f5f5f4; --mute:#a1a1aa; --dim:#6b6b73;
  --yolk:#e9c46a; --gold-1:#f6dc9a; --gold-2:#d6a64b;
  --card:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012));
  --shadow:0 1px 0 rgba(255,255,255,.04) inset,0 20px 50px -24px rgba(0,0,0,.8);
  --ease:cubic-bezier(.22,1,.36,1);
}
html,body{background:var(--ink)}
body{font:450 15px/1.6 var(--body);letter-spacing:-.005em;background:radial-gradient(1200px 600px at 70% -10%,rgba(233,196,106,.07),transparent 60%),var(--ink)}
::selection{background:rgba(233,196,106,.3)}

/* type */
.h1{font:600 clamp(36px,5vw,60px)/1.02 var(--display);letter-spacing:-.035em}
.h2{font:600 clamp(24px,2.8vw,32px)/1.1 var(--display);letter-spacing:-.025em}
.h3{font:600 18px/1.2 var(--display);letter-spacing:-.015em}
.lead{font:450 17px/1.6 var(--body);color:#c9c9cf}
.note{color:var(--mute);font-size:14px}
.tag,.tag-ink,.jpb-l .tag{transform:none;box-shadow:none;background:transparent;color:var(--yolk);border:1px solid rgba(233,196,106,.28);font:500 11px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;padding:7px 10px;border-radius:999px}
.kicker .jp{font-size:15px;color:var(--mute)}
.kicker span:last-child{font:500 11px var(--mono);letter-spacing:.12em;color:var(--dim)}

/* buttons */
.pill{min-height:46px;padding:0 22px;border-radius:12px;font:600 14px/1 var(--body);letter-spacing:-.005em;text-transform:none;transition:transform .2s var(--ease),background .2s,box-shadow .2s,border-color .2s}
.pill-sm{min-height:36px;padding:0 14px;font-size:13px;border-radius:10px}
.pill-yolk{background:linear-gradient(180deg,var(--gold-1),var(--gold-2));color:#1a1408;box-shadow:0 1px 0 rgba(255,255,255,.5) inset,0 8px 24px -10px rgba(233,196,106,.6)}
.pill-yolk:hover:not(:disabled){background:linear-gradient(180deg,#fbe6b0,#ddb05a);box-shadow:0 1px 0 rgba(255,255,255,.5) inset,0 12px 30px -10px rgba(233,196,106,.7)}
.pill-white{background:#f5f5f4;color:#111}
.pill-white:hover:not(:disabled){background:#fff}
.pill-line{border:1px solid var(--line-2);background:rgba(255,255,255,.02);color:var(--text)}
.pill-line:hover:not(:disabled){background:rgba(255,255,255,.06);color:var(--text);border-color:rgba(255,255,255,.2)}
.seg{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:12px;padding:3px}
.seg button{border-radius:9px;font:500 13px var(--body);min-height:32px}
.seg button[aria-pressed="true"],.seg button[aria-selected="true"]{background:rgba(255,255,255,.09);color:var(--text);box-shadow:0 1px 0 rgba(255,255,255,.06) inset}
.cats button{border-radius:10px;border:1px solid var(--line);background:transparent;font:500 13.5px var(--body);min-height:38px}
.cats button[aria-pressed="true"]{background:rgba(255,255,255,.08);border-color:var(--line-2);color:var(--text)}
.cats button[aria-pressed="true"] em{background:rgba(255,255,255,.08);color:var(--mute)}
.cats button em,.seg em{font-family:var(--mono)}

/* surfaces */
.duel,.pack,.side,.tile,.card,.how3 li,.mtile,.result,.escrow,.proof,.t-card,.flow,.tk-live,.token,.pulse,.king,.tix,.bigwin,.flipcard,.lb,.holder-banner,.table,.hero-stage,.jp-hero,.sheet,.sum,.them,.vsbox,.opt,.call,.pp,.wal,.lookup{background:var(--card),var(--coal);border:1px solid var(--line);box-shadow:var(--shadow)}
.duel,.pack,.side,.tile,.result,.escrow,.t-card,.flow,.mtile{border-radius:18px}
.duel:hover,.pack:hover,.mtile:hover{border-color:var(--line-2);transform:translateY(-1px)}
.duel,.pack,.mtile{transition:border-color .25s,transform .35s var(--ease)}
.duel::before,.mtile::before{display:none}
.duel.mine{border-color:rgba(233,196,106,.35)}
.ribbon,.flag{transform:none;border:0;border-radius:6px;background:rgba(233,196,106,.14);color:var(--yolk);font:500 10.5px/1 var(--mono);letter-spacing:.06em;padding:5px 7px}
.ribbon{top:12px}
.mode{background:transparent;border:0;padding:0;font:600 12px/1 var(--body);letter-spacing:0;text-transform:none;color:var(--text)}
.mode .ic{color:var(--mc)}
.mode.sm{font-size:11px}
.catc{font:500 12px var(--body)}
.d-v,.val,.pack-name b,.side-h span,.fc-txt em,.jpb-l b,#tPot,.rs-val,.king-val,.src dd,.tk-live dd{font-family:var(--display);font-weight:600;letter-spacing:-.03em}
.fc-txt em{color:var(--text)}
.d-need,.who span,.t-from{font-family:var(--mono)}
.grade{background:rgba(255,255,255,.08);color:var(--text);font:600 11px var(--mono);border:1px solid var(--line-2)}
.chip,.status{transform:none}
.status{font:500 11px var(--mono);letter-spacing:.06em;border-radius:999px}
.status.live{background:rgba(233,196,106,.14);color:var(--yolk);border-color:rgba(233,196,106,.3)}
.status.done{background:rgba(108,240,178,.1);color:var(--mint);border-color:rgba(108,240,178,.25)}
.rar{font:600 10px/1 var(--mono);letter-spacing:.08em}

/* top bar, dock */
.top{background:rgba(9,9,11,.72);border-bottom:1px solid var(--line)}
.logo span{font:700 17px/1 var(--display);letter-spacing:-.02em}
.logo-coin{transform:none}
.logo-coin circle{fill:url(#g);fill:var(--yolk);stroke:none}
.logo-coin path{stroke:#1a1408;stroke-width:5}
.demo-chip{border-style:solid;border-color:var(--line);font-size:10px}
.jackpot{background:rgba(233,196,106,.06);border-color:rgba(233,196,106,.22);border-radius:10px}
.jackpot b{font:600 13px var(--display);letter-spacing:-.01em}
.wallet{border-radius:10px;font:600 13px var(--body);letter-spacing:0;text-transform:none;min-height:40px}
.wallet.on{border-color:var(--line)}
.dock{background:rgba(17,17,19,.78);border:1px solid var(--line-2);border-radius:20px;box-shadow:0 30px 60px -20px rgba(0,0,0,.9)}
.dock a,.dock-create{font:500 11px var(--body)}
.dc-coin{width:50px;height:50px;border:0;background:linear-gradient(180deg,var(--gold-1),var(--gold-2));box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 10px 26px -8px rgba(233,196,106,.7)}
.dock-create:hover .dc-coin{transform:translateY(-2px)}
.dock a[aria-current="page"]::after{background:var(--text)}

/* hero */
.hero h1{font:600 clamp(64px,8.6vw,112px)/.92 var(--display);letter-spacing:-.055em}
.hero h1 .stop{color:var(--yolk)}
.hero-facts{font:500 13px var(--body);color:var(--mute)}
.hero-facts .ic{color:var(--yolk)}
.hero-stage{border-radius:24px}
.hs-note{display:none}
.hs{padding:4px;border-radius:10px;background:linear-gradient(180deg,#f3f3f3,#cfcfcf);box-shadow:0 30px 60px -20px rgba(0,0,0,.9)}
.hs-tag{transform:translateX(-50%);border:1px solid rgba(255,255,255,.14);border-radius:10px;background:rgba(15,15,17,.82);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--text);box-shadow:0 10px 30px -10px rgba(0,0,0,.8)}
.hs-tag b{font:600 13px var(--display)}
.hs-tag small{font:500 10px var(--mono);color:var(--mute)}
.hero-hint{font:500 11px var(--mono);color:rgba(255,255,255,.55)}
.how3 li>b{background:transparent;border:1px solid var(--line-2);color:var(--mute);font:500 12px var(--mono)}
.how3 h3{font-size:17px}

/* lobby */
.mt-i{background:transparent;border:1px solid var(--line);border-radius:10px}
.mtile b{font:600 15px/1.2 var(--display);letter-spacing:-.015em;text-transform:none}
.mtile em{font-family:var(--mono);color:var(--mute)}
.mtile[aria-pressed="true"]{background:var(--card),var(--coal);border-color:color-mix(in srgb,var(--mc) 55%,transparent);box-shadow:0 0 0 1px color-mix(in srgb,var(--mc) 30%,transparent) inset,var(--shadow)}
.count{background:rgba(255,255,255,.05);border-color:var(--line);color:var(--mute);font-family:var(--mono)}
.search{border-radius:12px;background:rgba(255,255,255,.03);border-color:var(--line)}
.side-chip i,.mini-coin{border-width:1px;border-color:rgba(0,0,0,.4);font-family:var(--display);font-weight:700}
.side-chip.h i,.mini-coin.h,.pip.h{background:linear-gradient(180deg,var(--gold-1),var(--gold-2))}
.side-chip.t i,.mini-coin.t,.pip.t{background:linear-gradient(180deg,#e8e8ea,#9c9ca3)}
.seats i.t{background:#c4c4ca;border-color:#c4c4ca}
.stake .ph{border-radius:8px;box-shadow:0 14px 30px -12px rgba(0,0,0,.9)}
.jp-banner{background:radial-gradient(800px 300px at 0% 0%,rgba(233,196,106,.12),transparent 60%),var(--coal);border:1px solid rgba(233,196,106,.2)}
.jp-banner::after{display:none}
.jpb-l b{color:var(--text)}
.jpb-l>span:last-child,.jpb-r small{color:var(--mute)}

/* packs */
.pack-vis,.rip-vis{background:radial-gradient(60% 50% at 50% 60%,rgba(255,255,255,.06),transparent 70%),#0d0d0f}
.pack-name span{font:600 15px/1.2 var(--display);letter-spacing:-.01em;text-transform:none}
.how{background:var(--card),var(--coal);color:var(--text);border:1px solid var(--line)}
.steps p{color:var(--mute);font:450 14.5px/1.6 var(--body)}
.steps b{font:500 12px var(--mono);color:var(--yolk)}
.flow-mint{background:radial-gradient(600px 300px at 100% 0%,rgba(233,196,106,.1),transparent 60%),var(--coal);color:var(--text);border-color:rgba(233,196,106,.22)}
.flow-mint .flow-k{color:var(--yolk)}
.split-bar{height:44px;border-radius:12px;border:1px solid var(--line)}
.split-bar span{font:600 12px var(--body);letter-spacing:0;text-transform:none}
.split-bar span:first-child{background:linear-gradient(180deg,var(--gold-1),var(--gold-2));color:#1a1408}
.split-bar span:last-child,.flow-mint .split-bar span:last-child{background:rgba(255,255,255,.06);color:var(--text)}
.flow-mint .split-bar span:first-child{background:linear-gradient(180deg,var(--gold-1),var(--gold-2))}

/* sheets */
.scrim{background:rgba(0,0,0,.6);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.sheet{background:#0f0f11;border-color:var(--line-2);box-shadow:0 40px 100px -20px rgba(0,0,0,.9)}
.sheet-h .h3{font-size:20px}
.fl{font:500 11px var(--mono);letter-spacing:.08em;color:var(--dim)}
.opt b,.call b,.pp b{font:600 14px/1.25 var(--display);letter-spacing:-.01em;text-transform:none}
.opt[aria-pressed="true"],.call[aria-pressed="true"],.pp[aria-pressed="true"],.pick[aria-pressed="true"]{border-color:rgba(233,196,106,.55);background:rgba(233,196,106,.06)}
.steps3 button{border-color:var(--line);background:transparent}
.steps3 li.on button{border-color:rgba(233,196,106,.45)}
.steps3 li.on b{background:var(--yolk)}
.steps3 li.done b{background:rgba(255,255,255,.12);color:var(--text)}
.pick[aria-pressed="true"]::after{background:var(--yolk);border:0}
.pick .fit{background:rgba(9,9,11,.8);color:var(--mint);font:600 10px var(--mono);border:1px solid rgba(108,240,178,.3)}
.inp{border-radius:12px;border:1px solid var(--line-2);background:rgba(255,255,255,.02)}
.paysel{border-color:var(--line);background:rgba(255,255,255,.03)}
.paysel button{font:600 12px var(--body);letter-spacing:0}
.paysel button[aria-pressed="true"]{background:rgba(255,255,255,.1);color:var(--text)}
.toast{background:rgba(24,24,27,.92);color:var(--text);border:1px solid var(--line-2);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);font:500 14px var(--body)}

/* duel room */
.side.won{box-shadow:0 0 0 1px rgba(233,196,106,.6),0 30px 80px -30px rgba(233,196,106,.45)}
.side.lost{opacity:.45;filter:grayscale(.7)}
.side{border-top-width:1px}
.sd-h{border-top-color:rgba(233,196,106,.45)}
.sd-t{border-top-color:rgba(200,200,210,.35)}
.side-h b{font:600 13px var(--body);letter-spacing:.02em;text-transform:none}
.result.win{background:radial-gradient(700px 260px at 0% 0%,rgba(233,196,106,.12),transparent 60%),var(--coal);border-color:rgba(233,196,106,.3)}
.result.win h2{color:var(--text)}
.result.loss h2{color:var(--mute)}
.result h2{font-weight:600;letter-spacing:-.045em}
.timeline li.done i{background:var(--yolk);border-color:var(--yolk)}
.vs-intro{background:radial-gradient(circle,rgba(9,9,11,.5),rgba(9,9,11,.92));-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.vs-plate{border:1px solid var(--line-2);background:rgba(17,17,19,.9);border-radius:14px}
.vs-plate.vs-t{border-color:var(--line-2)}
.vs-word{font:600 42px/1 var(--display);letter-spacing:-.04em;color:var(--text);-webkit-text-stroke:0;text-shadow:0 0 40px rgba(233,196,106,.35)}
.vs-intro.go .vs-h{animation:vsIn .7s var(--ease) both}
.vs-intro.go .vs-t{animation:vsIn .7s .08s var(--ease) both}
.vs-intro.go .vs-word{animation:vsWordCalm .6s .3s var(--ease) both}
@keyframes vsWordCalm{from{opacity:0;transform:scale(.8);filter:blur(6px)}}
.fx-stamp{font:600 clamp(28px,4.4vw,48px)/1 var(--display);letter-spacing:-.04em;color:var(--text);-webkit-text-stroke:0;text-shadow:0 0 30px rgba(0,0,0,.6),0 0 60px rgba(233,196,106,.35)}
.fx-stamp.face-t{color:#e5e5ea;text-shadow:0 0 30px rgba(0,0,0,.6),0 0 60px rgba(255,255,255,.2)}
.fx-stamp.win{color:var(--gold-1)}
.pips span{font-family:var(--display)}

/* rip stage: dark studio, a metallic pack, soft rarity light */
.rs-bg{background:radial-gradient(55% 45% at 50% 42%,#18181b 0%,#050506 75%)}
.rs.s-tear .rs-bg{background:radial-gradient(50% 42% at 50% 40%,color-mix(in srgb,var(--rc) 18%,#111) 0%,#050506 78%)}
.rs-flash{background:radial-gradient(circle at 50% 40%,color-mix(in srgb,var(--rc) 70%,#fff),transparent 55%)}
.rs-rays{background:conic-gradient(from 0deg,transparent 0deg,color-mix(in srgb,var(--rc) 40%,transparent) 20deg,transparent 60deg,transparent 120deg,color-mix(in srgb,var(--rc) 30%,transparent) 150deg,transparent 200deg,transparent 260deg,color-mix(in srgb,var(--rc) 35%,transparent) 290deg,transparent 330deg);filter:blur(18px)}
.rs.s-tear .rs-rays{opacity:.55}
.rs-pack{border-radius:14px;background:
  linear-gradient(115deg,rgba(255,255,255,0) 30%,rgba(255,255,255,.35) 45%,rgba(255,255,255,0) 58%) -100% 0/250% 100% no-repeat,
  linear-gradient(160deg,#2a2a2e 0%,#141416 45%,#26262a 70%,#0f0f11 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.12),inset 0 1px 0 rgba(255,255,255,.2),0 40px 80px -20px rgba(0,0,0,.9),0 0 0 1px color-mix(in srgb,var(--cc,#e9c46a) 30%,transparent)}
.rs-pack::before{background:radial-gradient(80% 50% at 50% 0%,color-mix(in srgb,var(--cc,#e9c46a) 22%,transparent),transparent 70%);mix-blend-mode:normal}
.rs.s-drop .rs-pack{animation:dropCalm .9s var(--ease) both,sheen 1.6s .5s ease-in-out both}
@keyframes dropCalm{0%{opacity:0;transform:translateY(-30%) scale(.92);filter:blur(6px)}100%{opacity:1;transform:none;filter:none}}
@keyframes sheen{to{background-position:200% 0,0 0}}
.rs-pack-top{border-radius:14px 14px 0 0;border-bottom:1px dashed rgba(255,255,255,.18);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
.rs-pack-top::before{background:repeating-linear-gradient(90deg,rgba(255,255,255,.06) 0 2px,transparent 2px 6px)}
.rs-pack-body{color:var(--text)}
.rs-pk-cat{font:500 10px var(--mono);letter-spacing:.12em;color:var(--mute)}
.rs-pk-name{font:600 clamp(22px,5vw,30px)/1.05 var(--display);letter-spacing:-.03em;text-transform:none}
.rs-pk-price{font:500 15px var(--mono);color:color-mix(in srgb,var(--cc,#e9c46a) 80%,#fff)}
.rs-pk-brand{font:500 8px var(--mono);color:var(--dim)}
.rs.s-tear .rs-pack-top{animation:tearCalm .8s var(--ease) forwards}
@keyframes tearCalm{0%{transform:none}100%{transform:translate(40%,-120%) rotate(18deg);opacity:0}}
.rs.s-rise .rs-pack{animation:sinkCalm .9s var(--ease) forwards}
@keyframes sinkCalm{from{opacity:1;transform:none}to{opacity:0;transform:translateY(40%) scale(.94);filter:blur(4px)}}
.rs.s-rise .rs-card{animation:cardupCalm 1.1s var(--ease) forwards}
@keyframes cardupCalm{0%{opacity:0;transform:translateY(30%) scale(.9)}30%{opacity:1}100%{opacity:1;transform:translateY(-2%) scale(1.04)}}
.rs-card-in{transition:transform 1.1s var(--ease)}
.rs-face{border-radius:12px;box-shadow:0 0 0 1px rgba(255,255,255,.14),0 0 70px -10px color-mix(in srgb,var(--rc) 70%,transparent),0 40px 80px -20px rgba(0,0,0,.9)}
.rs-banner{background:transparent;color:var(--rc);border:1px solid color-mix(in srgb,var(--rc) 45%,transparent);font:600 11px/1 var(--mono);letter-spacing:.14em;border-radius:999px;padding:7px 12px}
.rs.s-done .rs-banner{animation:fadeUp .6s var(--ease) forwards}
@keyframes fadeUp{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.rs-name{font:600 clamp(24px,3.6vw,32px)/1.1 var(--display);letter-spacing:-.03em}
.rs-val{color:var(--text)}
.rs-cardback{background:linear-gradient(160deg,#1c1c1f,#0d0d0f)}
.rs-cardback span{font:600 13px var(--display);letter-spacing:.2em;color:var(--mute)}
.mr-pack{background:linear-gradient(160deg,#2a2a2e 0%,#141416 45%,#26262a 70%,#0f0f11 100%);color:var(--text);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12),0 20px 40px -14px rgba(0,0,0,.9)}
.mr-pack b{font:600 11px var(--display);letter-spacing:-.01em;text-transform:none}
.mr-pack span{font:500 12px var(--mono);color:var(--yolk)}
.mr-top{border-bottom:1px dashed rgba(255,255,255,.18)}
.mr-card{box-shadow:0 0 0 1px rgba(255,255,255,.14),0 0 40px -8px color-mix(in srgb,var(--rc) 70%,transparent)}

/* jackpot, misc */
.jp-hero{background:radial-gradient(900px 400px at 0% 0%,rgba(233,196,106,.13),transparent 60%),var(--coal);border:1px solid rgba(233,196,106,.2)}
#tPot{color:var(--text)}
.jph-l,.jph-stats dt,.tix dt{font:500 11px var(--mono);letter-spacing:.08em;color:var(--mute)}
.jph-time,.jph-free,.jph-act .note,.tix-n span{color:var(--mute)}
.prog span{background:linear-gradient(90deg,var(--gold-2),var(--gold-1))}
.src-bar span:first-child{background:var(--yolk)}
.src-bar span:last-child{background:rgba(255,255,255,.35)}
.br-champ.on{border:1px solid rgba(233,196,106,.5)}
.br-p.w{background:rgba(233,196,106,.08)}
.tix{background:var(--card),var(--coal);border-color:var(--line)}
.tix-n b{color:var(--text)}
.king{border:1px solid color-mix(in srgb,var(--rc,var(--yolk)) 45%,transparent)}
.king-val{color:var(--text)}
.king-label{font:500 11px var(--mono);color:var(--yolk);letter-spacing:.08em}
.foot{background:#070708;border-top:1px solid var(--line)}
.foot-cols h4{font:500 11px var(--mono);letter-spacing:.1em;color:var(--dim)}
.marker,.hs-note{display:none}
.price b,.flag,.chip{font-family:var(--body)}
.tile.r-epic{box-shadow:0 0 0 1px color-mix(in srgb,var(--r-epic) 50%,transparent),0 20px 50px -20px rgba(180,108,255,.35)}
.tile.new{animation:fadeIn .8s var(--ease)}
.flipcard.new{animation:fadeIn .8s var(--ease)}
@keyframes fadeIn{from{opacity:0;transform:translateY(-6px)}}
.duel{animation:fadeIn .5s var(--ease)}

/* packs filters */
.pk-filters{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin:4px 0 12px}
.pk-group button{min-height:38px;padding:0 14px;gap:7px}
.pk-group button .ic{width:16px;height:16px}
.pk-group em{font-style:normal;font:500 11px var(--mono);color:var(--dim)}
.pk-search{flex:0 1 300px;min-height:42px}
.pk-row{margin:10px 0 6px}
#packCats{margin-top:2px}
#packCatBlurb{justify-content:space-between;color:var(--mute);font-size:13px}
.flag{background:rgba(9,9,11,.75);border:1px solid var(--line-2);color:var(--text);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.demo-chip.devnet{color:var(--mint);border-color:rgba(108,240,178,.35)}