:root{
  --bg:#e9e7f1; --surface:#f4f3f9; --ink:#17153a; --muted:#565379; --line:rgba(23,21,58,.16);
  --accent:#c2392a; --accent-ink:#fff6e8; --gold-text:#8a6414; --cobalt-text:#2c4fa8;
  --night:#0e1233; --cream:#f2e4c4; --keyline:#17110c;
  --red:#d63c2c; --saffron:#eab43a; --blue:#2f5bb8; --sky:#7fb2e5; --green:#3d8c5c;
  --display:"Grenze Gotisch","UnifrakturMaguntia",Georgia,"Times New Roman",serif;
  --body:"Schibsted Grotesk",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#0b0e2a; --surface:#131843; --ink:#efe4cc; --muted:#a6a3c9; --line:rgba(239,228,204,.14);
    --accent:#e0513f; --accent-ink:#fff6e8; --gold-text:#eab43a; --cobalt-text:#93acf2; color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#0b0e2a; --surface:#131843; --ink:#efe4cc; --muted:#a6a3c9; --line:rgba(239,228,204,.14);
  --accent:#e0513f; --accent-ink:#fff6e8; --gold-text:#eab43a; --cobalt-text:#93acf2; color-scheme:dark;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:1.0625rem;line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body.in-app{overflow:hidden}
svg{display:block}
button{font:inherit;color:inherit}
a{color:inherit}
:focus-visible{outline:3px solid var(--saffron);outline-offset:3px}
[hidden]{display:none!important}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- buttons ---------- */
.btn{appearance:none;border:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:.5em;font-weight:700;font-size:1rem;line-height:1.1;padding:.85em 1.3em;border-radius:10px;text-decoration:none;transition:transform .15s ease,background-color .2s ease,box-shadow .2s ease,opacity .2s}
.btn:active{transform:translateY(1px) scale(.98)}
.btn[disabled]{opacity:.45;cursor:not-allowed;transform:none}
.btn-primary{background:var(--red);color:#fff6e8;box-shadow:inset 0 -3px 0 rgba(0,0,0,.28),0 0 0 2px var(--keyline)}
.btn-primary:hover:not([disabled]){background:#e24a39}
.btn-gold{background:var(--saffron);color:var(--keyline);box-shadow:inset 0 -3px 0 rgba(0,0,0,.22),0 0 0 2px var(--keyline)}
.btn-gold:hover:not([disabled]){background:#f2c252}
.btn-ghost{background:transparent;color:inherit;box-shadow:inset 0 0 0 2px currentColor}
.btn-ghost:hover:not([disabled]){background:rgba(127,127,160,.14)}
.btn-lg{font-size:1.1rem;padding:1em 1.55em}
.btn-sm{font-size:.88rem;padding:.6em .95em}

/* ---------- official token strip (top of the page, from token.json) ---------- */
.token-strip{position:relative;z-index:7;background:#070a22;color:#e9dfc6;border-bottom:1px solid rgba(234,180,58,.35);font-size:.9rem;line-height:1.3}
.token-strip::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(234,180,58,.14),rgba(234,180,58,0) 35%,rgba(234,180,58,0) 65%,rgba(47,91,184,.16))}
.token-strip-in{position:relative;display:flex;align-items:center;flex-wrap:wrap;gap:.45rem .8rem;max-width:1240px;margin:0 auto;padding:.55rem clamp(1.1rem,4vw,2.5rem)}
.token-tag{display:inline-flex;align-items:center;gap:.35rem;padding:.28rem .6rem;border-radius:999px;background:var(--saffron);color:var(--keyline);font-weight:800;font-size:.74rem;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap}
.token-tag svg{width:.85rem;height:.85rem}
.token-sym{font-family:var(--display);font-size:1.15rem;font-weight:700;color:#f6d77a;letter-spacing:.01em;white-space:nowrap}
.token-addr{display:inline-flex;align-items:center;min-width:0;padding:.3rem .6rem;border-radius:8px;background:rgba(255,255,255,.07);border:1px solid rgba(239,228,204,.16)}
.token-addr code{font-family:var(--mono);font-size:.84rem;color:#fff;letter-spacing:.01em;word-break:break-all}
.token-addr-short{display:none}
.token-copy{appearance:none;display:inline-flex;align-items:center;gap:.35rem;padding:.34rem .7rem;border-radius:8px;border:1px solid rgba(234,180,58,.55);background:transparent;color:#f6d77a;font-weight:700;font-size:.82rem;cursor:pointer;transition:background .2s,color .2s,transform .15s}
.token-copy svg{width:.9rem;height:.9rem}
.token-copy:hover{background:rgba(234,180,58,.14)}
.token-copy:active{transform:translateY(1px)}
.token-copy.is-done{background:var(--saffron);color:var(--keyline)}
.token-links{display:inline-flex;gap:.25rem}
.token-links a{padding:.3rem .55rem;border-radius:8px;text-decoration:none;font-weight:600;color:#cdcaea;border:1px solid transparent}
.token-links a:hover{color:#fff;border-color:rgba(239,228,204,.25)}
.token-warn{margin-left:auto;color:#b6b0d6;font-size:.8rem;max-width:34ch;text-align:right}
.token-strip.is-sample .token-warn{color:#f0a48f}
.token-strip.is-sample .token-addr{border-style:dashed}
@media (max-width:980px){.token-warn{margin-left:0;max-width:none;text-align:left;flex-basis:100%}}
@media (max-width:640px){
  .token-strip-in{gap:.4rem .55rem;padding:.55rem 1rem}
  .token-addr-full{display:none}.token-addr-short{display:inline}
  .token-warn{font-size:.76rem}
}

/* ---------- landing: hero ---------- */
body{overflow-x:clip}
.band{position:relative;background:var(--night);color:#f2e6cf;isolation:isolate}
.band::before{content:"";position:absolute;inset:0;z-index:0;opacity:.07;pointer-events:none;border-radius:inherit;
  background:repeating-linear-gradient(45deg,#f2e4c4 0 1px,transparent 1px 26px),repeating-linear-gradient(-45deg,#f2e4c4 0 1px,transparent 1px 26px)}
.hero{overflow:hidden;--hp:0}
.hero::after{content:"";position:absolute;inset:auto 0 0;height:45%;z-index:0;pointer-events:none;background:linear-gradient(rgba(5,7,24,0),rgba(5,7,24,.62))}
.hero-dust{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}
.nav{position:relative;z-index:3;display:flex;align-items:center;gap:1.5rem;max-width:1240px;margin:0 auto;padding:1.1rem clamp(1.1rem,4vw,2.5rem)}
.brand{display:inline-flex;align-items:center;gap:.45rem;font-family:var(--display);font-size:1.7rem;font-weight:700;line-height:1;text-decoration:none;color:#f4e8d0}
.brand svg{width:1.7rem;height:1.7rem;color:var(--saffron)}
.nav-links{display:flex;gap:1.6rem;margin-left:auto}
.nav-links a{position:relative;text-decoration:none;font-weight:500;color:#cdcaea;padding:.2rem 0}
.nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:-.1rem;height:2px;background:var(--saffron);transform:scaleX(0);transform-origin:right;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.nav-links a:hover{color:#fff}
.nav-links a:hover::after{transform:scaleX(1);transform-origin:left}
.nav .btn{margin-left:.5rem}
@media (max-width:820px){.nav-links{display:none}.nav .btn{margin-left:auto}}
[data-magnetic]{transition:translate .45s cubic-bezier(.2,.8,.2,1),transform .15s ease,background-color .2s ease,box-shadow .2s ease}

.hero-grid{position:relative;z-index:2;max-width:1240px;margin:0 auto;padding:clamp(.5rem,3vw,2.5rem) clamp(1.1rem,4vw,2.5rem) clamp(5rem,10vw,8.5rem);display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,1fr);gap:clamp(1rem,4vw,4rem);align-items:center}
.hero-copy{position:relative;z-index:2;transform:translate3d(0,calc(var(--hp) * -90px),0);opacity:calc(1 - var(--hp) * 1.15)}
.wordmark{position:relative;display:inline-block;font-family:var(--display);font-weight:900;font-size:clamp(4.8rem,13.5vw,11rem);line-height:.8;letter-spacing:-.012em;margin:0;color:#f4e8d0;text-shadow:0 .04em 0 #05071a}
.wm,.wm-l{display:inline-block}
.wm-arc{position:absolute;left:-2%;width:104%;top:-.34em;height:.5em;overflow:visible;color:var(--saffron);pointer-events:none;clip-path:inset(0 100% 0 0);animation:revealArc 1.2s .8s cubic-bezier(.6,0,.2,1) forwards}
.js .wm-l{animation:letterIn 1.1s cubic-bezier(.2,.85,.2,1) both;animation-delay:calc(var(--i) * 75ms + 120ms)}
.js .rise{animation:riseIn 1s cubic-bezier(.2,.8,.2,1) both;animation-delay:var(--d,0s)}
.hero-lede{font-size:clamp(1.25rem,2.2vw,1.6rem);line-height:1.32;max-width:31ch;text-wrap:pretty;margin:1.1rem 0 .6rem;color:#f2e6cf}
.hero-sub{color:#b9b6db;max-width:42ch;margin:0 0 1.8rem}
.hero-cta{display:flex;flex-wrap:wrap;gap:.8rem;align-items:center}
.hero-cta .btn-ghost{color:#e9e2ff}
.hero-note{margin:1.6rem 0 0;font-size:.9rem;color:#9b98c2;max-width:46ch}

.spread{position:relative;height:clamp(340px,44vw,560px);perspective:1400px;translate:0 calc(var(--hp) * 130px)}
.astrolabe{position:absolute;left:50%;top:50%;width:min(128%,720px);aspect-ratio:1;translate:-50% -50%;rotate:calc(var(--hp) * 100deg);pointer-events:none;z-index:0}
.js .astrolabe{animation:astroIn 2s .05s cubic-bezier(.2,.8,.2,1) both}
.astrolabe svg{width:100%;height:100%;overflow:visible}
.astrolabe circle,.astrolabe line,.astrolabe path{fill:none;stroke:rgba(234,180,58,.3);stroke-width:1.2}
.astrolabe line.mj{stroke:rgba(234,180,58,.62);stroke-width:2}
.astrolabe .dash{stroke:rgba(242,228,196,.28);stroke-dasharray:2 10}
.astrolabe .arc{stroke:rgba(234,180,58,.75);stroke-width:2.6;stroke-linecap:round}
.astrolabe .thin{stroke:rgba(242,228,196,.12)}
.astrolabe .dot{fill:rgba(234,180,58,.7);stroke:none}
.astrolabe text{fill:rgba(242,228,196,.5);font-family:var(--display);font-size:15px;font-weight:700;text-anchor:middle;dominant-baseline:middle}
.astro-outer{animation:spin 170s linear infinite}
.astro-mid{animation:spin 75s linear infinite reverse}
.astro-inner{animation:spin 115s linear infinite}
.spread-inner{position:absolute;inset:0;z-index:1;transform-style:preserve-3d;transform:rotateY(calc(var(--px,0)*10deg)) rotateX(calc(var(--py,0)*-9deg));transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.spread .card{position:absolute;left:50%;top:50%;margin:-7.2em 0 0 -5em;font-size:clamp(15px,2.05vw,24px);opacity:0;transform:translate(0,40%) scale(.9)}
.spread .card .card-inner{animation:floaty 7s ease-in-out infinite}
.spread .card:nth-child(2) .card-inner{animation-delay:-2.3s}
.spread .card:nth-child(3) .card-inner{animation-delay:-4.6s}
@media (max-width:860px){
  .hero-grid{grid-template-columns:1fr}
  .spread{order:-1;height:clamp(250px,72vw,400px);margin-top:-.5rem}
  .spread .card{font-size:clamp(11px,3.3vw,18px)}
  .astrolabe{width:min(112%,560px)}
}

/* holographic foil shared by hero and wheel cards */
@property --sx{syntax:'<percentage>';inherits:true;initial-value:50%}
.foil .card-face::before{content:"";position:absolute;inset:0;z-index:6;pointer-events:none;border-radius:inherit;opacity:var(--glare,0);transition:opacity .45s ease;
  background:radial-gradient(circle at var(--gx,50%) var(--gy,24%),rgba(255,255,255,.3),rgba(255,255,255,0) 40%),linear-gradient(115deg,rgba(255,255,255,0) 32%,rgba(255,238,180,.24) 46%,rgba(170,215,255,.2) 54%,rgba(255,255,255,0) 68%);
  background-size:100% 100%,250% 250%;background-position:0 0,var(--sx) 50%}
.foil.is-focus .card-face::before,.foil.shine .card-face::before{opacity:.85;animation:sheen 3.4s ease-in-out infinite}

/* ---------- marquee ---------- */
.marquee{position:relative;z-index:6;margin:-2.6rem -3% 0;padding:.6rem 0;background:var(--red);color:#f7ecd4;border-block:3px solid var(--keyline);rotate:-2.2deg;box-shadow:0 18px 36px rgba(10,6,30,.28);overflow:hidden}
.marquee-track{display:flex;width:max-content;will-change:transform}
.mq-item{display:inline-flex;align-items:center;gap:1.1rem;padding-right:1.1rem;font-family:var(--display);font-weight:700;font-size:clamp(1.5rem,3.2vw,2.5rem);line-height:1.05;white-space:nowrap}
.mq-item small{font-family:var(--body);font-weight:800;font-size:.42em;letter-spacing:.06em;color:#ffd9c9}
.mq-item svg{width:1.05em;height:1.05em;color:var(--saffron);filter:drop-shadow(0 2px 0 var(--keyline))}

/* ---------- floating bar ---------- */
.floatbar{position:fixed;left:50%;top:14px;z-index:40;display:flex;align-items:center;gap:1rem;padding:.4rem .45rem .4rem 1rem;border-radius:999px;background:rgba(12,15,48,.82);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(242,228,196,.16);box-shadow:0 16px 40px rgba(5,7,24,.35);color:#f2e6cf;translate:-50% -140%;transition:translate .6s cubic-bezier(.2,.8,.2,1)}
.floatbar.show{translate:-50% 0}
.floatbar .brand{font-size:1.3rem}
.floatbar .brand svg{width:1.3rem;height:1.3rem}
.fb-track{position:relative;width:clamp(60px,14vw,160px);height:4px;border-radius:4px;background:rgba(242,228,196,.14);overflow:hidden}
.fb-track i{position:absolute;inset:0;background:linear-gradient(90deg,var(--saffron),var(--red));transform-origin:left;transform:scaleX(var(--pp,0))}
.floatbar .btn{border-radius:999px;white-space:nowrap}
.floatbar{width:max-content;max-width:calc(100vw - 20px)}
@media (max-width:520px){.fb-track{width:56px}.floatbar{gap:.55rem;top:10px;padding:.3rem .32rem .3rem .7rem}.floatbar .brand{font-size:0;gap:0}.floatbar .brand svg{width:1.45rem;height:1.45rem}.floatbar .btn{font-size:.82rem;padding:.55em .9em}}

/* ---------- flow + golden thread ---------- */
.flow{position:relative}
.thread{position:absolute;left:0;top:0;z-index:4;pointer-events:none;overflow:visible}
.thread path{fill:none;stroke-linecap:round}
.thread-base{stroke:var(--muted);stroke-opacity:.2;stroke-width:1.5;stroke-dasharray:2 7}
.thread-glow{stroke:rgba(234,180,58,.22);stroke-width:9}
.thread-live{stroke:var(--saffron);stroke-width:2.4}
.thread-tip{fill:#fff4d6;filter:drop-shadow(0 0 6px rgba(234,180,58,.95)) drop-shadow(0 0 14px rgba(214,60,44,.7))}
.thread-knots rect{fill:var(--bg);stroke:var(--muted);stroke-opacity:.5;stroke-width:1.8;transition:fill .4s,stroke .4s}
.thread-knots rect.lit{fill:var(--saffron);stroke:var(--keyline);stroke-opacity:1}
@media (max-width:999px){.thread{display:none}}

/* ---------- story (pinned, scroll-scrubbed) ---------- */
.story{position:relative;z-index:1}
.story-track{position:relative;height:290vh}
.story-pin{position:sticky;top:0;height:100vh;height:100svh;max-width:1240px;margin:0 auto;padding:clamp(4.5rem,11vh,7rem) clamp(1.1rem,4vw,2.5rem) clamp(1.5rem,5vh,3rem);display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:clamp(1.5rem,5vw,5rem);align-items:center}
.story-copy h2{font-family:var(--display);font-weight:700;font-size:clamp(2.4rem,5.2vw,3.9rem);line-height:.96;margin:0;max-width:14ch}
.story-steps{list-style:none;margin:2.4rem 0 0;padding:0;display:grid;gap:1.7rem;position:relative;--sp:0}
.story-steps::before,.story-steps::after{content:"";position:absolute;left:calc(2.2rem - 1.5px);top:2.2rem;width:3px;border-radius:3px;height:calc(100% - 4.4rem)}
.story-steps::before{background:var(--line)}
.story-steps::after{background:linear-gradient(var(--saffron),var(--accent));transform-origin:top;transform:scaleY(var(--sp))}
.story-step{position:relative;z-index:1;display:grid;grid-template-columns:4.4rem 1fr;gap:1.1rem;align-items:start;opacity:.36;transition:opacity .55s ease}
.story-step.is-active{opacity:1}
.story-step .step-num{display:grid;place-items:center;width:4.4rem;height:4.4rem;border-radius:50%;border:3px solid var(--ink);background:var(--bg);font-family:var(--display);font-weight:900;font-size:2.1rem;line-height:1;color:var(--accent);box-shadow:0 0 0 6px var(--bg);transition:background-color .5s,color .5s,scale .6s cubic-bezier(.3,1.6,.5,1)}
.story-step.is-active .step-num{background:var(--accent);color:#fff6e8;scale:1.1}
.story-step.is-done .step-num{background:var(--ink);color:var(--bg)}
.story-step h3{font-family:var(--display);font-weight:700;font-size:1.95rem;line-height:1;margin:.4rem 0 .4rem}
.story-step p{margin:0;color:var(--muted);max-width:36ch}

.stage{position:relative;justify-self:center;width:min(100%,calc((100svh - 10rem) / .95));aspect-ratio:1/.95;border-radius:30px;overflow:hidden;isolation:isolate;color:#efe4cc;--sw:600px;
  background:radial-gradient(ellipse 85% 70% at 50% 62%,#222b73 0%,#131845 60%,#0a0c27 100%);border:3px solid var(--keyline);box-shadow:0 0 0 5px #f2e4c4,0 0 0 8px var(--keyline),0 40px 90px rgba(14,18,51,.35)}
.stage::before{content:"";position:absolute;inset:0;opacity:.07;pointer-events:none;background:repeating-linear-gradient(45deg,#f2e4c4 0 1px,transparent 1px 22px),repeating-linear-gradient(-45deg,#f2e4c4 0 1px,transparent 1px 22px)}
.stage::after{content:"";position:absolute;left:8%;right:8%;top:78%;height:22%;border-radius:50%;background:radial-gradient(closest-side,rgba(234,180,58,.14),rgba(234,180,58,0));pointer-events:none}
.st-layer{position:absolute;inset:0;pointer-events:none;z-index:5}
.st-layer[data-st-coins]{z-index:6}
.st-layer[data-st-fx]{z-index:7}
.st-caption{position:absolute;left:0;right:0;top:6.5%;margin:0;text-align:center;font-family:var(--display);font-weight:700;font-size:calc(var(--sw) * .052);line-height:1.05;color:#f4e8d0;z-index:8;padding:0 6%}
.st-caption.swap{animation:captionIn .55s cubic-bezier(.2,.8,.2,1) both}
.st-player{position:absolute;left:0;top:0;width:calc(var(--sw) * .19);aspect-ratio:1;z-index:3;will-change:transform}
.st-medal{position:absolute;inset:0;border-radius:50%;background:var(--art);border:3px solid var(--keyline);box-shadow:0 0 0 4px #f2e4c4,0 0 0 7px var(--keyline),0 12px 24px rgba(0,0,0,.45);overflow:hidden}
.st-medal svg{width:100%;height:100%;transform:scale(.9)}
.st-hp{position:absolute;right:-12%;bottom:-8%;width:44%;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;color:#fff;background:radial-gradient(circle at 35% 30%,#f08676,var(--red) 58%,#921f15);border:3px solid var(--keyline);z-index:2}
.st-hp b{font-size:calc(var(--sw) * .03);font-weight:800;line-height:1;font-variant-numeric:tabular-nums}
.st-tag{position:absolute;left:50%;top:calc(100% + .75rem);translate:-50% 0;font-size:calc(var(--sw) * .024);font-weight:700;color:#bdbade;white-space:nowrap}
.st-purse{position:absolute;left:50%;top:calc(100% + .75rem + var(--sw) * .036);translate:-50% 0;font-size:calc(var(--sw) * .034);font-weight:800;color:var(--saffron);white-space:nowrap;font-variant-numeric:tabular-nums}
.st-pot{position:absolute;left:0;top:0;width:calc(var(--sw) * .3);aspect-ratio:1;z-index:2;will-change:transform}
.st-dish{position:absolute;inset:0;border-radius:50%;overflow:hidden;background:radial-gradient(circle at 38% 30%,#fbe39a,var(--saffron) 50%,#a8741a);border:3px solid var(--keyline);box-shadow:inset 0 0 0 calc(var(--sw) * .012) rgba(255,248,220,.25),inset 0 0 0 calc(var(--sw) * .019) rgba(23,17,12,.45),0 18px 34px rgba(0,0,0,.5)}
.st-dish svg{width:100%;height:100%;opacity:.35}
.st-pot-label{position:absolute;left:0;right:0;top:22%;text-align:center;font-size:calc(var(--sw) * .024);font-weight:800;color:var(--keyline);letter-spacing:.03em}
.st-pot-amt{position:absolute;left:0;right:0;top:36%;text-align:center;font-size:calc(var(--sw) * .052);font-weight:800;color:var(--keyline);font-variant-numeric:tabular-nums;line-height:1}
.st-seal{position:absolute;right:-16%;top:-14%;width:50%;aspect-ratio:1;scale:0;z-index:3;--brk:0}
.st-seal svg{width:100%;height:100%;overflow:visible;filter:drop-shadow(0 6px 10px rgba(40,6,2,.45))}
.st-seal .half{transition:none}
.st-seal .half-l{transform:translate(calc(var(--brk) * -22%),calc(var(--brk) * 14%)) rotate(calc(var(--brk) * -24deg))}
.st-seal .half-r{transform:translate(calc(var(--brk) * 22%),calc(var(--brk) * 20%)) rotate(calc(var(--brk) * 20deg))}
.st-fee{position:absolute;left:0;top:0;z-index:4;display:flex;gap:.4rem;align-items:baseline;padding:.3rem .6rem;border-radius:8px;background:rgba(255,255,255,.08);border:1px solid rgba(242,228,196,.2);font-size:calc(var(--sw) * .024);color:#c9c6e6;opacity:0;will-change:transform}
.st-fee b{color:#fff;font-variant-numeric:tabular-nums}
.st-layer .card{position:absolute;left:0;top:0;will-change:transform}
.st-coin{position:absolute;left:0;top:0;display:block;width:calc(var(--sw) * .05);aspect-ratio:1;border-radius:50%;border:2px solid var(--keyline);background:radial-gradient(circle at 35% 30%,#fbe39a,var(--saffron) 55%,#a8741a);box-shadow:inset 0 0 0 3px rgba(255,248,220,.3),0 3px 0 #7a520f;will-change:transform}
.st-flash{position:absolute;left:0;top:0;width:calc(var(--sw) * .5);aspect-ratio:1;border-radius:50%;opacity:0;background:radial-gradient(circle,rgba(255,244,214,.95),rgba(255,210,120,.45) 32%,rgba(255,210,120,0) 70%)}
.st-spark{position:absolute;left:0;top:0;width:calc(var(--sw) * .016);height:calc(var(--sw) * .016);border-radius:2px;background:#ffd27a;opacity:0}
.st-dmg{position:absolute;left:0;top:0;width:calc(var(--sw) * .1);aspect-ratio:1;display:grid;place-items:center;opacity:0;z-index:6}
.st-dmg::before,.st-dmg::after{content:"";position:absolute;inset:0;clip-path:polygon(50% 0,61% 29%,95% 19%,73% 47%,100% 69%,65% 68%,58% 100%,44% 72%,9% 92%,28% 59%,0 37%,34% 35%,22% 5%)}
.st-dmg::before{background:var(--keyline);transform:scale(1.16)}
.st-dmg::after{background:var(--red)}
.st-dmg span{position:relative;z-index:1;color:#fff;font-weight:800;font-size:calc(var(--sw) * .036);text-shadow:0 2px 0 var(--keyline)}
.st-gain{position:absolute;left:0;top:0;z-index:7;translate:-50% 0;font-weight:800;font-size:calc(var(--sw) * .042);color:#9ff0b9;white-space:nowrap;text-shadow:0 2px 0 var(--keyline);opacity:0}

@media (max-width:860px){
  .story-track{height:320vh}
  .story-pin{grid-template-columns:1fr;grid-template-rows:auto 1fr;align-content:start;gap:.7rem;padding-top:4.6rem}
  .story-copy h2{font-size:clamp(2rem,8vw,2.6rem);max-width:none}
  .story-steps{display:block;margin-top:.8rem;min-height:11.6rem}
  .story-steps::before,.story-steps::after{display:none}
  .story-step{position:absolute;inset:0 0 auto 0;opacity:0;transform:translateY(14px);transition:opacity .45s,transform .45s}
  .story-step.is-active{opacity:1;transform:none}
  .story-step .step-num{width:3.4rem;height:3.4rem;font-size:1.6rem}
  .story-step{grid-template-columns:3.4rem 1fr}
  .story-step h3{font-size:1.5rem;margin-top:.2rem}
  .story-step p{font-size:.92rem;line-height:1.45}
  .stage{width:min(100%,calc((100svh - 22rem) / .95));align-self:start;border-radius:22px}
}

/* ---------- fair play ---------- */
.section{max-width:1240px;margin:0 auto;padding:clamp(4rem,9vw,7.5rem) clamp(1.1rem,4vw,2.5rem)}
.section h2{font-family:var(--display);font-weight:700;font-size:clamp(2.4rem,5.2vw,3.9rem);line-height:.96;letter-spacing:-.005em;margin:0;max-width:19ch;text-wrap:balance}
.section-lede{color:var(--muted);max-width:56ch;margin:1rem 0 0;font-size:1.1rem}
.fair{position:relative;z-index:2}
.fair-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(2rem,6vw,5.5rem);align-items:center}
.seal-stage{display:grid;justify-items:center;gap:1.2rem}
.wax{appearance:none;border:0;background:none;padding:0;cursor:pointer;width:min(310px,72vw);aspect-ratio:1;border-radius:50%;filter:drop-shadow(0 18px 26px rgba(40,6,2,.35));transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.wax svg{width:100%;height:100%;overflow:visible}
.wax:not(.is-broken) text{animation:none}
.wax:hover:not(.is-broken){transform:rotate(-4deg) scale(1.03)}
.wax.stamp-in{animation:stamp .7s cubic-bezier(.3,1.5,.5,1) both}
.half{transform-box:fill-box;transform-origin:50% 50%;transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.is-broken .half-l{transform:translate(-9%,5%) rotate(-13deg)}
.is-broken .half-r{transform:translate(9%,8%) rotate(11deg)}
.seal-readout{width:min(430px,100%);min-height:9.5rem;background:var(--surface);border:2px solid var(--line);border-radius:14px;padding:.95rem 1.1rem;font-size:.92rem}
.seal-readout p{margin:0}
.seal-caption{font-weight:700;margin-top:.55rem!important}
.seal-caption:first-child{margin-top:0!important}
.seal-readout code{display:block;font-family:var(--mono);font-size:.76rem;word-break:break-all;color:var(--muted);margin-top:.2rem}
.seal-ok{margin-top:.7rem!important;font-weight:700;color:var(--green)}
.seal-hint{margin-top:.6rem!important;color:var(--muted);font-size:.86rem}
.rules{margin:2.2rem 0 0;display:grid;gap:1.35rem}
.rules > div{display:grid;grid-template-columns:2.7rem 1fr;column-gap:1rem;align-items:start}
.rules dt{font-weight:700;font-size:1.08rem;grid-column:2}
.rules dd{margin:.15rem 0 0;color:var(--muted);grid-column:2;max-width:52ch}
.rules .glyph{grid-row:1 / span 2;width:2.7rem;height:2.7rem;border-radius:50%;background:radial-gradient(circle at 38% 32%,#e9604a,#b5281c 55%,#6f130c);border:2px solid var(--keyline);display:grid;place-items:center;color:#ffd9c9}
.rules .glyph svg{width:1.3rem;height:1.3rem;overflow:visible}
.g-hand{transform-box:view-box;transform-origin:12px 13px;animation:spin 5s linear infinite}
.g-bob{animation:bob 1.6s ease-in-out infinite}
.g-front{animation:cardSwap 3.2s ease-in-out infinite}
@media (max-width:860px){.fair-grid{grid-template-columns:1fr}}

.sflow{position:relative;margin-top:clamp(3rem,7vw,5rem);display:grid;grid-template-columns:auto 1fr auto 1fr auto;align-items:center;padding:clamp(1.6rem,4vw,2.6rem) clamp(1.2rem,4vw,3rem) 1.6rem;border-radius:26px;background:var(--surface);border:2px solid var(--line)}
.sflow-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.sflow-lines path{fill:none;stroke:var(--muted);stroke-opacity:.5;stroke-width:2;stroke-dasharray:4 8;animation:dashflow 1.1s linear infinite}
.sflow-seeds{grid-column:1;display:grid;gap:1.7rem}
.sflow-node{position:relative;z-index:1;display:flex;align-items:center;gap:.7rem;font-weight:700;font-size:.95rem}
.orbdot{display:block;width:1.15rem;height:1.15rem;border-radius:50%;background:radial-gradient(circle,#fff6d8 0 25%,var(--saffron) 62%);border:2px solid var(--keyline);box-shadow:0 0 12px rgba(234,180,58,.55)}
.sflow-mix{grid-column:3;position:relative;z-index:1;display:grid;justify-items:center;gap:.3rem;text-align:center}
.hex{display:block;width:clamp(86px,9vw,116px);aspect-ratio:1}
.hex svg{width:100%;height:100%;overflow:visible}
.hex polygon{fill:var(--bg);stroke:var(--ink);stroke-width:3}
.hex .hex-in{fill:none;stroke:var(--accent);stroke-width:2.5;stroke-dasharray:6 5}
.hex circle{fill:var(--saffron);stroke:var(--keyline);stroke-width:2}
.sflow-mix strong{font-size:.95rem}
.sflow-mix code{font-family:var(--mono);font-size:.74rem;color:var(--muted)}
.sflow-deck{grid-column:5;position:relative;z-index:1;display:grid;justify-items:center;gap:.8rem}
.sflow-cards{position:relative;width:clamp(170px,19vw,240px);height:clamp(96px,10vw,124px)}
.sflow-cards .card{position:absolute;left:50%;top:50%;margin:-7.2em 0 0 -5em;font-size:clamp(5.6px,.62vw,7.4px);transition:transform .7s cubic-bezier(.2,.8,.2,1)}
.sflow-deck strong{font-size:.95rem}
.sflow-caption{grid-column:1 / -1;margin:1.6rem 0 0;color:var(--muted);text-align:center}
.sflow-orb{position:absolute;left:0;top:0;z-index:3;width:18px;height:18px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,#fff 0 24%,#eab43a 58%,rgba(234,180,58,0) 72%)}
@media (max-width:760px){
  .sflow{grid-template-columns:1fr;justify-items:center;row-gap:2.6rem}
  .sflow-seeds{grid-column:1;display:flex;gap:1rem;justify-content:center}
  .sflow-node{flex-direction:column;gap:.4rem;font-size:.78rem;text-align:center}
  .sflow-mix,.sflow-deck{grid-column:1}
}

/* ---------- deck wheel ---------- */
.deck-band{overflow:clip;border-radius:50% 50% 0 0 / clamp(40px,7vw,110px) clamp(40px,7vw,110px) 0 0;margin-top:clamp(2rem,6vw,4rem)}
.deck-track{position:relative;height:250vh}
.deck-pin{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:grid;grid-template-rows:auto minmax(0,1fr) auto;padding:clamp(4.2rem,10vh,6.5rem) 0 clamp(1.2rem,4vh,2.2rem)}
.deck-top{position:relative;z-index:2;max-width:1240px;width:100%;margin:0 auto;padding:0 clamp(1.1rem,4vw,2.5rem);display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:.6rem 3rem}
.deck-top h2{font-family:var(--display);font-weight:700;font-size:clamp(2.2rem,4.6vw,3.6rem);line-height:.96;margin:0;color:#f4e8d0;max-width:17ch}
.deck-lede{margin:0;color:#b9b6db;max-width:46ch}
.deck-lede b{color:#f2e6cf}
.wheel{position:relative;min-height:0;cursor:grab;touch-action:pan-y;outline-offset:-6px}
.wheel.dragging{cursor:grabbing}
.wheel-cards{position:absolute;inset:0}
.wheel-cards .card{position:absolute;left:0;top:0;will-change:transform,opacity;cursor:pointer}
.wheel-rim{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.wheel-rim circle{fill:none}
.wheel-rim .rim-a{stroke:rgba(234,180,58,.4);stroke-width:1.6}
.wheel-rim .rim-b{stroke:rgba(242,228,196,.16);stroke-width:1.2;stroke-dasharray:2 9}
.wheel-rim line{stroke:rgba(234,180,58,.45);stroke-width:1.4}
.wheel-rim line.mj{stroke:rgba(234,180,58,.85);stroke-width:2.4}
.wheel-info{position:relative;z-index:3;max-width:760px;width:100%;margin:0 auto;padding:0 clamp(1rem,4vw,2rem);display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:center}
.wheel-btn{appearance:none;width:50px;height:50px;border-radius:50%;display:grid;place-items:center;cursor:pointer;color:#f2e6cf;background:rgba(255,255,255,.06);border:2px solid rgba(242,228,196,.4);transition:background-color .2s,scale .25s cubic-bezier(.3,1.6,.5,1)}
.wheel-btn:hover{background:rgba(255,255,255,.14)}
.wheel-btn:active{scale:.92}
.wheel-btn svg{width:22px;height:22px}
.wheel-detail{text-align:center;min-height:6.4rem;display:grid;align-content:center}
.wd-meta{margin:0;color:#a8a5cc;font-size:.88rem}
.wd-name{margin:.2rem 0 .3rem;font-family:var(--display);font-weight:700;font-size:clamp(1.8rem,3.3vw,2.6rem);line-height:1;color:#f4e8d0}
.wd-name span{color:var(--saffron);margin-right:.4rem;font-size:.7em}
.wd-text{margin:0;color:#e6def7;font-size:1rem}
.wd-text b{color:var(--saffron)}
.wheel-detail.swap > *{animation:detailIn .5s cubic-bezier(.2,.8,.2,1) both}
.wheel-detail.swap > :nth-child(2){animation-delay:.05s}
.wheel-detail.swap > :nth-child(3){animation-delay:.1s}

.closer{position:relative;z-index:2;display:grid;justify-items:center;gap:1rem;text-align:center;padding:clamp(3rem,8vw,6rem) clamp(1.1rem,4vw,2.5rem) clamp(5rem,11vw,8.5rem)}
.closer h2{font-family:var(--display);font-weight:900;font-size:clamp(3.2rem,9vw,6.4rem);line-height:.88;margin:.6rem 0 0;color:#f4e8d0}
.closer p{margin:0 0 1rem;color:#b9b6db;max-width:44ch}
.shuffle{position:relative;width:clamp(104px,11vw,140px);aspect-ratio:10 / 14.4}
.sb{position:absolute;inset:0;border-radius:9px;border:3px solid var(--keyline);box-shadow:0 8px 16px rgba(0,0,0,.4);will-change:transform;
  background:repeating-linear-gradient(45deg,rgba(242,228,196,.16) 0 1px,transparent 1px 10px),repeating-linear-gradient(-45deg,rgba(242,228,196,.16) 0 1px,transparent 1px 10px),radial-gradient(circle at 50% 50%,#4271d6,var(--blue) 45%,#1a3679)}
.sb::before{content:"";position:absolute;inset:6px;border:2px solid rgba(234,180,58,.85);border-radius:5px}
.sb svg{position:absolute;left:50%;top:50%;width:46%;height:46%;translate:-50% -50%;color:var(--saffron)}
.shuffle .card{position:absolute;left:0;top:0;z-index:40}

/* ---------- reveal choreography ---------- */
[data-split] .w{display:inline-block;overflow:hidden;vertical-align:top;padding:0 .04em .12em;margin:0 -.04em -.12em}
[data-split] .w > span{display:inline-block;transform:translateY(112%) rotate(4deg);transform-origin:0 100%;transition:transform 1.05s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--i) * 65ms)}
[data-split].in .w > span{transform:none}

.foot{border-top:1px solid var(--line);max-width:1240px;margin:0 auto;padding:2rem clamp(1.1rem,4vw,2.5rem) 3rem;display:flex;flex-wrap:wrap;gap:1rem 2rem;align-items:center;justify-content:space-between;color:var(--muted);font-size:.92rem}
.foot .brand{color:var(--ink);font-size:1.4rem}
.foot .brand svg{color:var(--accent)}
.foot p{margin:0;max-width:62ch}

@keyframes letterIn{0%{opacity:0;transform:translateY(40%) rotate(8deg) scale(.95);filter:blur(12px)}55%{opacity:1;filter:blur(0)}100%{opacity:1;transform:none;filter:blur(0)}}
@keyframes riseIn{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@keyframes astroIn{from{opacity:0;scale:.8}to{opacity:1;scale:1}}
@keyframes sheen{0%{--sx:125%}60%,100%{--sx:-25%}}
@keyframes captionIn{from{opacity:0;transform:translateY(12px);filter:blur(4px)}to{opacity:1;transform:none;filter:blur(0)}}
@keyframes detailIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes dashflow{to{stroke-dashoffset:-24}}
@keyframes bob{0%,100%{translate:0 -1.5px}50%{translate:0 2px}}
@keyframes cardSwap{0%,40%,100%{translate:0 0}55%,85%{translate:-5px -2px}}

@media (prefers-reduced-motion:reduce){
  .story-track,.deck-track{height:auto}
  .story-pin{position:relative;height:auto}
  .deck-pin{position:relative;height:auto;min-height:92vh}
  .hero-copy,.spread{transform:none;translate:none;opacity:1}
  [data-split] .w > span{transform:none}
  .floatbar{transition:none}
}
@media (max-width:760px){
  .deck-track{height:auto}
  .deck-pin{position:relative;height:auto;min-height:0;grid-template-rows:auto auto auto;padding-top:clamp(4.5rem,16vw,5.5rem)}
  .wheel{height:clamp(300px,92vw,440px)}
}

/* ---------- cards ---------- */
.card,.minion,.deckpile,.skin-chip{--cf-face:radial-gradient(ellipse at 50% 38%,#faf0d9,#ecdbb6 85%);--cf-frame:var(--keyline);--cf-ink:var(--keyline);--cf-ribbon:#f6ead0;--cf-rule:rgba(23,17,12,.3);--mb-face:radial-gradient(ellipse at 50% 40%,#faf0d9,#eadab4);
  --cb-face:repeating-linear-gradient(45deg,rgba(242,228,196,.16) 0 .1em,transparent .1em 1.05em),repeating-linear-gradient(-45deg,rgba(242,228,196,.16) 0 .1em,transparent .1em 1.05em),radial-gradient(circle at 50% 50%,#4271d6,var(--blue) 45%,#1a3679);--cb-line:rgba(234,180,58,.85);--cb-sigil:var(--saffron)}
.card{position:relative;display:block;width:10em;height:14.4em;padding:0;margin:0;border:0;background:none;text-align:left;color:var(--cf-ink);font-family:var(--body);-webkit-tap-highlight-color:transparent}
.card-inner{position:absolute;inset:0;display:block;transform-style:preserve-3d;transition:transform .55s cubic-bezier(.2,.8,.2,1)}
.card.is-down .card-inner{transform:rotateY(180deg)}
.card-face,.card-back{position:absolute;inset:0;display:block;border-radius:.75em;-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden}
.card-face{background:var(--cf-face);border:.3em solid var(--cf-frame);box-shadow:0 .5em 1.4em rgba(0,0,0,.35);transition:box-shadow .25s ease}
.card-face::after{content:"";position:absolute;inset:.16em;border:.1em solid var(--cf-rule);border-radius:.52em;pointer-events:none}
.c-art{position:absolute;left:.55em;right:.55em;top:.55em;height:6.35em;display:block;background:var(--art);border:.22em solid var(--keyline);border-radius:.32em;overflow:hidden}
.card[data-type="spell"] .c-art{border-radius:4.4em 4.4em .32em .32em}
.c-art svg{width:100%;height:100%}
.c-cost{position:absolute;left:.12em;top:.12em;width:2.55em;height:2.55em;border-radius:50%;background:radial-gradient(circle at 35% 30%,#8fb3f5,var(--blue) 58%,#1b3a80);border:.22em solid var(--keyline);display:grid;place-items:center;color:#fff;z-index:2}
.c-cost > span{font-size:1.52em;font-weight:800;line-height:1;text-shadow:0 .06em 0 rgba(0,0,0,.35)}
.c-name{position:absolute;left:.25em;right:.25em;top:6.55em;height:2.05em;display:grid;place-items:center;background:var(--cf-ribbon);border:.18em solid var(--keyline);border-radius:.28em;z-index:1}
.c-name > span{font-family:var(--display);font-weight:700;font-size:1.14em;line-height:1;white-space:nowrap}
.c-name.long > span{font-size:.93em}
.c-text{position:absolute;left:.7em;right:.7em;top:8.85em;bottom:2.05em;display:grid;place-items:center;text-align:center}
.c-text > span{font-size:.74em;line-height:1.22;font-weight:500}
.c-text b{font-weight:800}
.c-text i{opacity:.72}
.c-num{position:absolute;left:0;right:0;bottom:.38em;text-align:center;display:block}
.c-num > span{font-family:var(--display);font-weight:700;font-size:.95em;letter-spacing:.05em}
.c-atk,.c-hp{position:absolute;bottom:.1em;width:2.45em;height:2.45em;border-radius:50%;border:.22em solid var(--keyline);display:grid;place-items:center;z-index:2}
.c-atk{left:.1em;color:var(--keyline);background:radial-gradient(circle at 35% 30%,#f8dc86,var(--saffron) 58%,#b27d18)}
.c-hp{right:.1em;background:radial-gradient(circle at 35% 30%,#f08676,var(--red) 58%,#921f15);color:#fff}
.c-atk > span,.c-hp > span{font-size:1.42em;font-weight:800;line-height:1}
.card-back{transform:rotateY(180deg);border:.3em solid var(--cf-frame);box-shadow:0 .4em 1.2em rgba(0,0,0,.4);background:var(--cb-face)}
.card-back::before{content:"";position:absolute;inset:.5em;border:.14em solid var(--cb-line);border-radius:.45em}
.card-back svg{position:absolute;left:50%;top:50%;width:4.6em;height:4.6em;margin:-2.3em 0 0 -2.3em;color:var(--cb-sigil);filter:drop-shadow(0 .08em 0 var(--keyline))}

/* ---------- app shell ---------- */
.app{position:fixed;inset:0;z-index:50;display:grid;grid-template-rows:auto minmax(0,1fr) auto;color:#efe4cc;overflow:hidden;
  background:radial-gradient(ellipse 110% 75% at 50% 52%,#1c2466 0%,#111640 55%,#070920 100%)}
.app[hidden]{display:none}
.app::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.05;
  background:repeating-linear-gradient(45deg,#f2e4c4 0 1px,transparent 1px 30px),repeating-linear-gradient(-45deg,#f2e4c4 0 1px,transparent 1px 30px)}
.app-bar{position:relative;z-index:60;display:flex;align-items:center;gap:.6rem;padding:.5rem clamp(.6rem,2vw,1.2rem);min-height:54px;background:linear-gradient(rgba(5,7,24,.55),rgba(5,7,24,0))}
.app-brand{display:inline-flex;align-items:center;gap:.35rem;background:none;border:0;cursor:pointer;font-family:var(--display);font-size:1.5rem;font-weight:700;line-height:1;color:#f4e8d0;padding:.2rem}
.app-brand svg{width:1.45rem;height:1.45rem;color:var(--saffron)}
.app-bar-mid{display:flex;gap:.5rem;margin:0 auto;align-items:center}
.app-bar-end{display:flex;gap:.45rem;align-items:center}
.chip{display:inline-flex;align-items:center;gap:.35rem;padding:.42rem .7rem;border-radius:9px;background:rgba(255,255,255,.07);border:1px solid rgba(239,228,204,.16);font-size:.86rem;white-space:nowrap;line-height:1.1;color:#e6def7}
.chip b{font-variant-numeric:tabular-nums;color:#fff}
button.chip{cursor:pointer}
button.chip:hover{background:rgba(255,255,255,.12)}
.chip.ping{animation:chipPing .8s ease}
.chip .sub{color:#a8a5cc}
.chip.bump{animation:bump .5s cubic-bezier(.3,1.6,.5,1)}
.icon-btn{appearance:none;width:38px;height:38px;border-radius:9px;display:grid;place-items:center;background:rgba(255,255,255,.07);border:1px solid rgba(239,228,204,.16);cursor:pointer;color:#e6def7}
.icon-btn:hover{background:rgba(255,255,255,.13)}
.icon-btn svg{width:20px;height:20px}
.app .btn-ghost{color:#e6def7}
@media (max-width:600px){.chip .lbl{display:none}.app-brand span{display:none}}
@media (max-width:480px){.chip .sub{display:none}.chip .sub[data-symbol]{display:inline;font-size:.68rem}.chip{padding:.4rem .55rem}.app-bar{gap:.35rem}.app-bar-end{gap:.3rem}.app .btn-sm{padding:.55em .7em}}

.view{position:relative;z-index:2;min-height:0}
.view[hidden]{display:none!important}
.centered{display:grid;place-items:center;padding:1.25rem;overflow:auto;text-align:center}
.view h2{font-family:var(--display);font-weight:700;font-size:clamp(2.5rem,6vw,3.8rem);line-height:.95;margin:0}
.view .lead{color:#c3c0e2;margin:.8rem auto 0;max-width:44ch}

.stakes{display:flex;justify-content:center;gap:clamp(.7rem,2.6vw,1.3rem);margin:2.2rem 0 1.4rem;flex-wrap:wrap}
.coin{appearance:none;width:clamp(78px,19vw,108px);aspect-ratio:1;border-radius:50%;border:3px solid var(--keyline);cursor:pointer;display:grid;place-content:center;gap:.15rem;color:var(--keyline);
  background:radial-gradient(circle at 34% 28%,#fbe39a,var(--saffron) 52%,#a8741a);
  box-shadow:inset 0 0 0 6px rgba(255,248,220,.28),inset 0 0 0 9px rgba(23,17,12,.5),0 10px 22px rgba(0,0,0,.45);transition:transform .25s cubic-bezier(.3,1.6,.5,1),box-shadow .25s}
.coin b{font-size:clamp(1.65rem,4.6vw,2.3rem);line-height:.9;font-weight:800}
.coin small{font-size:.7rem;font-weight:800;letter-spacing:.03em}
.coin:hover:not([disabled]){transform:translateY(-4px)}
.coin[aria-checked="true"]{transform:translateY(-10px) scale(1.07);box-shadow:inset 0 0 0 6px rgba(255,248,220,.28),inset 0 0 0 9px rgba(23,17,12,.5),0 0 0 4px #f4e8d0,0 16px 34px rgba(234,180,58,.45)}
.coin[disabled]{opacity:.35;cursor:not-allowed}
.payout{color:#d5d2ee;margin:0 0 1.6rem}
.payout b{color:#fff;font-variant-numeric:tabular-nums}
.fine{color:#9390ba;font-size:.88rem;margin:1.3rem auto 0;max-width:46ch}
.lobby-msg:empty{display:none}
.lobby-msg{color:#ffb4a6;margin:0 0 1rem}
.unclaimed{margin:0 0 1.2rem;color:#f2e6cf;display:flex;gap:.7rem;align-items:center;justify-content:center;flex-wrap:wrap}
.unclaimed[hidden]{display:none}
.hand-you .card{touch-action:none}

.rings{position:relative;width:min(250px,62vw);aspect-ratio:1;margin:0 auto 1.8rem}
.rings svg{position:absolute;inset:0;width:100%;height:100%;color:var(--saffron)}
.rings svg:nth-child(1){animation:spin 14s linear infinite}
.rings svg:nth-child(2){animation:spin 9s linear infinite reverse;opacity:.75}
.rings .rival-face{position:absolute;inset:26%;border-radius:50%;background:var(--blue);border:3px solid var(--keyline);box-shadow:0 0 0 4px var(--cream),0 0 0 7px var(--keyline);overflow:hidden;opacity:0;transform:scale(.4);transition:opacity .4s,transform .5s cubic-bezier(.3,1.6,.5,1)}
.rings.found .rival-face{opacity:1;transform:none}
.rings .rival-face svg{position:static;animation:none;opacity:1}
.found-line{color:var(--saffron);font-weight:700;margin-top:.8rem}
.found-line[hidden]{display:block!important;visibility:hidden}

.seal-row{display:flex;gap:clamp(1rem,5vw,3rem);justify-content:center;margin:2.2rem 0 1.4rem}
.seal-slot{display:grid;justify-items:center;gap:.55rem}
.seal-slot .wax-mini{width:clamp(86px,21vw,128px);aspect-ratio:1;opacity:0}
.seal-slot .wax-mini svg{width:100%;height:100%;overflow:visible}
.seal-slot.stamped .wax-mini{animation:stamp .55s cubic-bezier(.3,1.5,.5,1) forwards}
.seal-slot strong{font-size:.95rem}
.seal-slot code{font-family:var(--mono);font-size:.74rem;color:#a8a5cc}
.seal-status{color:#c3c0e2;min-height:1.6em}

/* ---------- table ---------- */
.table{position:relative;isolation:isolate;height:100%;display:grid;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;
  --tok:clamp(5.8px,min(calc(100vw / 42),1.62vh),14.5px);
  --cardfs:clamp(7.6px,min(calc(100vw / 44),2.02vh),17px);
  --rivalfs:clamp(4.4px,min(calc(100vw / 104),1.08vh),9.6px);
  --hud:clamp(12.5px,min(calc(100vw / 76),2vh),20px);
  --champ:clamp(56px,min(16vw,11vh),120px);
  grid-template-rows:calc(var(--rivalfs) * 7) auto minmax(calc(var(--tok) * 11),1fr) clamp(40px,6vh,58px) minmax(calc(var(--tok) * 11),1fr) auto calc(var(--cardfs) * 9.4)}
.table.frozen{filter:grayscale(.85) brightness(.7);transition:filter .8s}
.hand{position:relative;z-index:20}
.hand-rival{font-size:var(--rivalfs)}
.hand-you{font-size:var(--cardfs)}
.hand .card{position:absolute;left:0;top:0;font-size:1em;will-change:transform;transition:transform .42s cubic-bezier(.2,.8,.2,1)}
.hand-you .card{cursor:pointer}
.hand-you .card.dragging{transition:none;cursor:grabbing}
.hand-you .card.can-play .card-face{box-shadow:0 0 0 .2em var(--saffron),0 0 1.3em .28em rgba(234,180,58,.62),0 .5em 1.4em rgba(0,0,0,.35)}
.hand-you .card.is-selected .card-face{box-shadow:0 0 0 .22em #fff4d6,0 0 2em .55em rgba(255,236,190,.78)}
.hand .card.nope,.minion.nope{animation:nope .38s ease}
.animating{transition:none!important}
.in-fx{position:fixed!important;left:0!important;top:0!important;z-index:70;transition:none!important;pointer-events:none}
.card.casting .card-face{box-shadow:0 0 0 .25em #fff4d6,0 0 3em 1em rgba(255,226,150,.9)}

.champ-row{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.5rem;padding:.2rem clamp(.6rem,4vw,3rem)}
.champ-row > :first-child{justify-self:start}
.champ-row > :last-child{justify-self:end}
.champ{position:relative;width:var(--champ);height:var(--champ);padding:0;border:0;background:none;border-radius:50%;cursor:default;-webkit-tap-highlight-color:transparent}
.h-medal{position:absolute;inset:0;border-radius:50%;background:var(--art);border:3px solid var(--keyline);box-shadow:0 0 0 4px #f2e4c4,0 0 0 7px var(--keyline),0 12px 26px rgba(0,0,0,.5);overflow:hidden;transition:box-shadow .25s}
.h-medal svg{width:100%;height:100%;transform:scale(.9)}
.h-hp{position:absolute;right:-12%;bottom:-10%;width:44%;height:44%;min-width:28px;min-height:28px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#f08676,var(--red) 58%,#921f15);border:3px solid var(--keyline);display:grid;place-items:center;color:#fff;z-index:2}
.h-hp b{font-size:max(13px,calc(var(--champ) * .2));font-weight:800;line-height:1;font-variant-numeric:tabular-nums}
.champ.hurt .h-hp{background:radial-gradient(circle at 35% 30%,#c65a4c,#8a2117 70%)}
.h-tag{position:absolute;left:50%;top:100%;transform:translate(-50%,.62rem);font-size:.74rem;font-weight:700;white-space:nowrap;color:#bdbade;pointer-events:none}
.h-tag span{font-family:var(--display);font-size:1.02rem;font-weight:700;color:#efe4cc;margin-right:.35rem}
.champ-rival .h-tag{top:auto;bottom:100%;transform:translate(-50%,-.62rem)}
.champ.is-target{cursor:pointer}
.champ.is-target .h-medal{box-shadow:0 0 0 4px #f2e4c4,0 0 0 7px var(--red),0 0 30px 8px rgba(214,60,44,.85)}
.champ.is-aimed .h-medal{box-shadow:0 0 0 4px #fff,0 0 0 8px #ff7a66,0 0 38px 12px rgba(255,110,90,.95)}
.champ.is-broken .h-medal{filter:grayscale(1) brightness(.5);transform:scale(.92);transition:filter .6s,transform .6s}
@media (max-width:640px){.h-tag span{display:none}}

.mana{display:flex;align-items:center;gap:.5rem}
.crystals{display:flex;gap:5px}
.crystal{display:block;width:12px;height:12px;transform:rotate(45deg);border:2px solid var(--keyline);background:#232a63;box-shadow:0 0 0 1px rgba(156,195,255,.2)}
.crystal.on{background:linear-gradient(135deg,#d7e6ff,#6f9cf2 42%,#2f5bb8);box-shadow:0 0 9px rgba(120,170,255,.85)}
.crystal.lock{opacity:.22}
.crystal.pop{animation:crystalPop .4s cubic-bezier(.3,1.7,.5,1) both}
.mana-count{font-weight:800;font-size:.95rem;font-variant-numeric:tabular-nums;color:#b9d2ff;min-width:2.4em}
@media (max-width:600px){.crystals{display:none}.mana-count::before{content:"";display:inline-block;width:10px;height:10px;margin-right:.4rem;transform:rotate(45deg);background:linear-gradient(135deg,#d7e6ff,#2f5bb8);border:2px solid var(--keyline)}}
.deckpile{position:relative;display:flex;align-items:center;gap:.55rem;font-size:.85rem;color:#c3c0e2}
.pile{position:relative;width:clamp(26px,3.4vw,40px);height:clamp(37px,4.9vw,57px);border-radius:5px;border:2px solid var(--keyline);background:repeating-linear-gradient(45deg,rgba(242,228,196,.2) 0 1px,transparent 1px 7px),#2f5bb8;box-shadow:3px 3px 0 -1px #1a3679,3px 3px 0 1px var(--keyline),6px 6px 0 -1px #1a3679,6px 6px 0 1px var(--keyline)}
.deckpile b{font-variant-numeric:tabular-nums;color:#fff}
.deckpile[data-skin] .pile{background:var(--cb-face)}
.deckpile.empty .pile{opacity:.25}

.lane{position:relative;font-size:var(--tok);margin:0 auto;width:min(96%,calc(var(--tok) * 52));border-radius:22px;transition:background-color .2s,box-shadow .2s}
.lane.is-drop{background:rgba(234,180,58,.06);box-shadow:inset 0 0 0 2px rgba(234,180,58,.32)}
.lane.is-drop-hot{background:rgba(234,180,58,.14);box-shadow:inset 0 0 0 3px rgba(234,180,58,.75)}
.midline{position:relative;display:flex;align-items:center;justify-content:center;z-index:15}
.midline::before{content:"";position:absolute;left:4%;right:4%;top:50%;height:2px;background:linear-gradient(90deg,transparent,rgba(234,180,58,.4) 14%,rgba(234,180,58,.4) 86%,transparent)}
.fuse{position:absolute;left:4%;top:50%;height:4px;margin-top:-1px;width:92%;opacity:0;background:linear-gradient(90deg,#6d3a14,#eab43a);border-radius:2px;transition:opacity .3s}
.fuse::after{content:"";position:absolute;right:-8px;top:50%;width:16px;height:16px;margin-top:-8px;border-radius:50%;background:radial-gradient(circle,#fff 0 18%,#ffd27a 38%,rgba(214,60,44,.6) 60%,transparent 72%);animation:spark .12s infinite alternate}
.turn-flag{position:absolute;left:clamp(.5rem,4vw,3rem);top:50%;transform:translateY(-50%);font-size:.82rem;font-weight:700;color:#c3c0e2;background:#111640;padding:.25rem .6rem;border-radius:7px;border:1px solid rgba(239,228,204,.14)}
.end-turn{position:absolute;right:clamp(.5rem,4vw,3rem);top:50%;transform:translateY(-50%);appearance:none;cursor:pointer;display:flex;align-items:center;gap:.4rem;padding:.55rem 1rem;border-radius:10px;border:2px solid var(--keyline);font-weight:800;font-size:.92rem;color:var(--keyline);background:linear-gradient(#f5cf6c,var(--saffron));box-shadow:inset 0 -3px 0 rgba(0,0,0,.2),0 0 0 2px rgba(242,228,196,.6);transition:filter .2s,box-shadow .2s}
.end-turn small{font-variant-numeric:tabular-nums;color:#8c1c12;font-size:.95rem;font-weight:800}
.end-turn small:empty{display:none}
.end-turn:hover:not([disabled]){filter:brightness(1.07)}
.end-turn[disabled]{background:#2a3170;color:#9d9ac4;border-color:#0a0c24;box-shadow:none;cursor:default}
.end-turn.is-ready{animation:readyPulse 1.4s ease-in-out infinite}
.table-hint{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);margin:0;font-size:.84rem;color:#e9e2ff;background:rgba(8,10,30,.8);padding:.3rem .75rem;border-radius:7px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .2s}
.table-hint.show{opacity:1}
/* ---------- table HUD scale ---------- */
.table .champ-row{gap:.5rem}
.table .h-tag{left:calc(100% + .9em);top:50%;bottom:auto;transform:translateY(-50%);display:grid;line-height:1.15;text-align:left;font-size:calc(var(--hud) * .8)}
.table .h-tag span{font-size:1.5em;margin:0}
.table .champ-rival .h-tag{top:50%;bottom:auto;transform:translateY(-50%)}
.table .mana{gap:.55em;font-size:var(--hud)}
.table .crystals{gap:.34em}
.table .crystal{width:.95em;height:.95em;border-width:.13em;box-shadow:0 0 0 .06em rgba(156,195,255,.2)}
.table .crystal.on{box-shadow:0 0 .65em rgba(120,170,255,.85)}
.table .mana-count{font-size:1.4em;min-width:2.3em}
.table .deckpile{gap:.55em;font-size:var(--hud)}
.table .pile{width:3.3em;height:4.75em;border-radius:.34em;border-width:.14em;box-shadow:.2em .2em 0 -.06em #1a3679,.2em .2em 0 .06em var(--keyline),.4em .4em 0 -.06em #1a3679,.4em .4em 0 .06em var(--keyline)}
.table .deckpile[data-skin]:not([data-skin="classic"]) .pile{box-shadow:.2em .2em 0 -.06em #15131c,.2em .2em 0 .06em var(--keyline),.4em .4em 0 -.06em #15131c,.4em .4em 0 .06em var(--keyline)}
.table .deckpile b{font-size:1.4em;line-height:1}
.table .midline{font-size:var(--hud)}
.table .fuse{height:.3em;margin-top:-.1em}
.table .fuse::after{right:-.55em;width:1.1em;height:1.1em;margin-top:-.55em}
.table .turn-flag{font-size:1em;padding:.4em .95em;border-radius:.55em}
.table .end-turn{font-size:1.14em;gap:.45em;padding:.62em 1.35em;border-radius:.62em;border-width:.13em;box-shadow:inset 0 -.2em 0 rgba(0,0,0,.2),0 0 0 .13em rgba(242,228,196,.6)}
.table .end-turn small{font-size:1em}
.table .end-turn[disabled]{box-shadow:none}
.table .table-hint{font-size:max(13px,.95em);padding:.38em .9em;border-radius:.5em}
@media (max-width:600px){.table .mana-count::before{width:.62em;height:.62em;border-width:.13em;margin-right:.35em}}
@media (min-width:601px){.app[data-mode="match"] .chip{font-size:.95rem;padding:.46rem .85rem}}

@media (max-width:640px){.turn-flag{display:none}.table-hint{max-width:52vw;white-space:normal;text-align:center;left:42%}}

.minion{position:absolute;left:0;top:0;width:8em;height:10em;padding:0;border:0;background:none;font-size:1em;cursor:pointer;will-change:transform;transition:transform .38s cubic-bezier(.2,.8,.2,1);-webkit-tap-highlight-color:transparent;touch-action:none}
.m-guard{position:absolute;inset:-.85em -.8em -.4em;border-radius:4.9em 4.9em 1.7em 1.7em;border:.3em solid var(--keyline);display:none;background:repeating-linear-gradient(0deg,#737da3 0 .95em,#5f688e .95em 1.08em)}
.minion.is-guard .m-guard{display:block}
.m-body{position:absolute;inset:0;display:block;border-radius:4em 4em 1em 1em;background:var(--mb-face);border:.32em solid var(--cf-frame);box-shadow:0 .55em 1em rgba(0,0,0,.45);transition:box-shadow .25s}
.m-art{position:absolute;left:.5em;right:.5em;top:.5em;bottom:.5em;display:block;border-radius:3.5em 3.5em .6em .6em;background:var(--art);border:.2em solid var(--keyline);overflow:hidden}
.m-art svg{width:100%;height:100%;transform:scale(1.1) translateY(3%)}
.m-ward{position:absolute;inset:-.65em;display:block;border-radius:4.7em 4.7em 1.5em 1.5em;pointer-events:none;opacity:0;transform:scale(.8);z-index:2;
  background:radial-gradient(ellipse 62% 56% at 50% 46%,rgba(255,240,190,0) 58%,rgba(255,220,120,.32) 80%,rgba(255,246,214,.85) 94%,rgba(255,246,214,0) 100%);
  box-shadow:0 0 1.3em .25em rgba(234,180,58,.7),inset 0 0 1.1em rgba(255,236,170,.6);transition:opacity .3s,transform .4s cubic-bezier(.3,1.6,.5,1)}
.minion.is-ward .m-ward{opacity:1;transform:none;animation:wardPulse 2.6s ease-in-out infinite}
.m-atk,.m-hp{position:absolute;bottom:-.6em;width:3.05em;height:3.05em;border-radius:50%;border:.27em solid var(--keyline);display:grid;place-items:center;z-index:3}
.m-atk{left:-.6em;background:radial-gradient(circle at 35% 30%,#f8dc86,var(--saffron) 58%,#b27d18);color:var(--keyline)}
.m-hp{right:-.6em;background:radial-gradient(circle at 35% 30%,#f08676,var(--red) 58%,#921f15);color:#fff}
.m-hp.hurt{background:radial-gradient(circle at 35% 30%,#c65a4c,#7d1b12 70%)}
.m-hp.hurt b{color:#ffcfc4}
.m-atk b,.m-hp b{font-size:1.62em;font-weight:800;line-height:1}
.m-zz{position:absolute;right:.2em;top:-.6em;font-family:var(--display);font-weight:900;font-size:2em;line-height:1;color:#cfdcff;opacity:0;z-index:4;text-shadow:0 .08em 0 var(--keyline);pointer-events:none}
.minion.is-asleep .m-zz{animation:zz 2.2s ease-in-out infinite}
.minion.can-attack .m-body{box-shadow:0 0 0 .32em var(--saffron),0 0 1.7em .4em rgba(234,180,58,.72)}
.minion.is-selected .m-body{box-shadow:0 0 0 .34em #fff4d6,0 0 2.1em .55em rgba(255,236,190,.85)}
.minion.is-target .m-body{box-shadow:0 0 0 .32em var(--red),0 0 1.7em .45em rgba(214,60,44,.82)}
.minion.is-aimed .m-body{box-shadow:0 0 0 .42em #ff8a78,0 0 2.3em .7em rgba(255,110,90,.95)}
.minion.is-attacking{z-index:30}
.minion.buffing .m-body{animation:buffGlow .7s ease}

/* ---------- escrow drawer ---------- */
.escrow{position:absolute;top:54px;right:0;bottom:0;z-index:59;width:min(390px,94vw);display:flex;flex-direction:column;gap:1.05rem;padding:1.1rem 1.15rem 1.4rem;overflow:auto;background:#0f1439;border-left:3px solid var(--keyline);box-shadow:-24px 0 60px rgba(0,0,0,.5);transform:translateX(106%);transition:transform .38s cubic-bezier(.2,.8,.2,1);visibility:hidden}
.escrow.open{transform:none;visibility:visible}
.escrow-head{display:flex;align-items:center;justify-content:space-between}
.escrow h3{font-family:var(--display);font-weight:700;font-size:1.9rem;line-height:1;margin:0}
.escrow-figs{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
.escrow-figs > div{background:rgba(255,255,255,.05);border:1px solid rgba(239,228,204,.12);border-radius:10px;padding:.55rem .7rem}
.escrow-figs dt{font-size:.78rem;color:#a8a5cc}
.escrow-figs dd{margin:.1rem 0 0;font-weight:800;font-variant-numeric:tabular-nums}
.escrow-figs .pot{grid-column:1 / -1}
.escrow-figs .pot dd{font-size:1.55rem;color:var(--saffron)}
.deadline{display:flex;align-items:center;justify-content:space-between;gap:1rem;font-size:.88rem;color:#c3c0e2;border-top:1px solid rgba(239,228,204,.12);border-bottom:1px solid rgba(239,228,204,.12);padding:.7rem 0}
.deadline strong{font-size:1.25rem;font-variant-numeric:tabular-nums;color:#fff}
.mini-seals{display:grid;gap:.45rem}
.mini-seals:empty{display:none}
.mini-seal{display:grid;grid-template-columns:30px 3.6rem 1fr;gap:.55rem;align-items:center;font-size:.82rem}
.mini-seal .dot{width:30px;height:30px}
.mini-seal .dot svg{width:100%;height:100%}
.mini-seal code{font-family:var(--mono);font-size:.72rem;color:#a8a5cc;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.escrow h4{margin:0;font-size:.95rem}
.ledger{list-style:none;margin:0;padding:0;display:grid;gap:.5rem;font-size:.86rem}
.ledger li{display:grid;grid-template-columns:3rem 1fr;gap:.4rem;color:#dcd9f1;padding:.2rem .3rem;border-radius:6px}
.ledger time{color:#8e8bb5;font-variant-numeric:tabular-nums}
.ledger li.fresh{animation:ledgerIn 1.2s ease}
.escrow .test-tool{margin-top:auto;border-top:1px dashed rgba(239,228,204,.2);padding-top:.9rem;font-size:.84rem;color:#a8a5cc}
.escrow .test-tool p{margin:0 0 .6rem}

/* ---------- overlays ---------- */
.overlay{position:absolute;inset:0;z-index:58;display:grid;place-items:center;padding:4.2rem 1rem 1rem;background:rgba(5,7,24,.7);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);overflow:auto}
.overlay[hidden]{display:none}
.panel{width:min(580px,100%);text-align:center;background:linear-gradient(#171d52,#0f1339);border:3px solid var(--keyline);box-shadow:0 0 0 4px #f2e4c4,0 0 0 7px var(--keyline),0 30px 80px rgba(0,0,0,.6);border-radius:16px;padding:clamp(1.3rem,4vw,2.3rem);margin:auto}
.panel-meta{margin:0;color:#a8a5cc;font-size:.9rem}
.result-title{font-family:var(--display);font-weight:900;font-size:clamp(3.3rem,11vw,5.6rem);line-height:.88;margin:.15rem 0 .45rem}
.result-title.win{color:var(--saffron)}
.result-title.lose{color:#cfcbe9}
.result-title.neutral{color:#f2e6cf;font-size:clamp(2.4rem,8vw,3.8rem)}
.result-sum{margin:0 auto;color:#dcd9f1;max-width:40ch}
.result-sum b{color:#fff}
.actions{display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem;margin-top:1.5rem}
.verify{margin-top:1.4rem;text-align:left;border-top:1px solid rgba(239,228,204,.14);padding-top:1.2rem}
.verify[hidden]{display:none}
.rseals{display:flex;justify-content:center;gap:1.6rem;margin-bottom:.9rem}
.rseal{display:grid;justify-items:center;gap:.3rem;font-size:.8rem;color:#a8a5cc}
.rseal .wax-mini{width:64px;height:64px}
.rseal .wax-mini svg{width:100%;height:100%;overflow:visible}
.checks{list-style:none;padding:0;margin:0;display:grid;gap:.5rem}
.checks li{display:grid;grid-template-columns:1.7rem 1fr;gap:.6rem;align-items:center;opacity:0;transform:translateY(8px);transition:opacity .35s,transform .35s}
.checks li.in{opacity:1;transform:none}
.checks .mark{width:1.7rem;height:1.7rem;border-radius:50%;display:grid;place-items:center;font-weight:800;border:2px solid var(--keyline);font-size:.9rem}
.checks .ok .mark{background:var(--green);color:#fff}
.checks .bad .mark{background:var(--red);color:#fff}
.verify-sum{margin:.9rem 0 0;font-weight:700}
.verify-sum.ok{color:#8fe0ad}
.verify-sum.bad{color:#ffb4a6}
.verify details{margin-top:.8rem;font-size:.86rem;color:#c3c0e2}
.verify summary{cursor:pointer;font-weight:700}
.seeds{font-family:var(--mono);font-size:.7rem;word-break:break-all;background:rgba(0,0,0,.28);border-radius:8px;padding:.7rem;margin-top:.5rem;display:grid;gap:.45rem}
.seeds span{color:#8e8bb5}
.confirm .panel{width:min(430px,100%)}
.confirm p{color:#dcd9f1}

/* ---------- fx layer ---------- */
.fx{position:fixed;inset:0;z-index:80;pointer-events:none;overflow:hidden}
.aim{position:absolute;inset:0;width:100%;height:100%;overflow:visible;opacity:0;transition:opacity .15s}
.aim.on{opacity:1}
.aim .rope-under{fill:none;stroke:var(--keyline);stroke-width:12;stroke-linecap:round;stroke-dasharray:3 13}
.aim .rope{fill:none;stroke:var(--red);stroke-width:7;stroke-linecap:round;stroke-dasharray:3 13;animation:rope .45s linear infinite}
.aim .head{fill:var(--saffron);stroke:var(--keyline);stroke-width:3.5;stroke-linejoin:round}
.aim .reticle{fill:none;stroke:#fff4d6;stroke-width:4;opacity:0;transition:opacity .15s}
.aim .reticle.on{opacity:1;animation:spin 3s linear infinite;transform-box:fill-box;transform-origin:center}
.pt{position:fixed;left:0;top:0;display:block;border-radius:2px;will-change:transform,opacity}
.pt.dot{border-radius:50%}
.ring{position:fixed;left:0;top:0;display:block;border-radius:50%;border-style:solid;will-change:transform,opacity}
.orb{position:fixed;left:0;top:0;display:block;border-radius:50%;will-change:transform;filter:blur(.3px)}
.flash{position:fixed;inset:0}
.bolt{position:fixed;left:0;top:0;overflow:visible}
.float-text{position:fixed;left:0;top:0;font-weight:800;font-size:clamp(14px,1.8vw,19px);color:#fff4d6;white-space:nowrap;text-shadow:0 2px 0 var(--keyline),0 0 12px rgba(0,0,0,.8)}
.float-text.buff{color:#9ff0b9}
.float-text.ward{color:#ffe29a}
.float-text.warn{color:#ffb4a6}
.dmg{position:fixed;left:0;top:0;width:clamp(46px,5.8vw,72px);aspect-ratio:1;display:grid;place-items:center;z-index:5}
.dmg::before,.dmg::after{content:"";position:absolute;inset:0;clip-path:polygon(50% 0,61% 29%,95% 19%,73% 47%,100% 69%,65% 68%,58% 100%,44% 72%,9% 92%,28% 59%,0 37%,34% 35%,22% 5%)}
.dmg::before{background:var(--keyline);transform:scale(1.16)}
.dmg::after{background:var(--red)}
.dmg.heal::after{background:var(--green)}
.dmg span{position:relative;z-index:1;color:#fff;font-weight:800;font-size:clamp(17px,2.4vw,27px);text-shadow:0 2px 0 var(--keyline)}
.banner{position:fixed;left:50%;top:50%;z-index:6;padding:.12em 1.1em .22em;font-family:var(--display);font-weight:900;font-size:clamp(2.4rem,8.5vw,5.2rem);line-height:1;color:#f7ecd4;white-space:nowrap;background:var(--red);border-block:.07em solid var(--keyline);
  clip-path:polygon(0 0,100% 0,95.5% 50%,100% 100%,0 100%,4.5% 50%);text-shadow:0 .05em 0 var(--keyline)}
.banner.rival{background:var(--blue)}
.banner.gold{background:var(--saffron);color:var(--keyline);text-shadow:none}
.ghost-coin{position:fixed;left:0;top:0;width:22px;height:22px;border-radius:50%;border:2px solid var(--keyline);background:radial-gradient(circle at 35% 30%,#fbe39a,var(--saffron) 55%,#a8741a)}

/* ---------- keyframes ---------- */
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes floaty{0%,100%{translate:0 0}50%{translate:0 -12px}}
@keyframes revealArc{to{clip-path:inset(0 0 0 0)}}
@keyframes stamp{0%{opacity:0;transform:scale(1.9) rotate(-14deg)}55%{opacity:1;transform:scale(.9) rotate(3deg)}100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes nope{0%,100%{translate:0 0}20%{translate:-6px 0}50%{translate:6px 0}80%{translate:-3px 0}}
@keyframes crystalPop{0%{scale:.1}100%{scale:1}}
@keyframes rope{to{stroke-dashoffset:-16}}
@keyframes spark{from{scale:.75}to{scale:1.25}}
@keyframes readyPulse{0%,100%{box-shadow:inset 0 -3px 0 rgba(0,0,0,.2),0 0 0 2px rgba(242,228,196,.6),0 0 0 0 rgba(234,180,58,.0)}50%{box-shadow:inset 0 -3px 0 rgba(0,0,0,.2),0 0 0 2px #fff4d6,0 0 22px 6px rgba(234,180,58,.75)}}
@keyframes wardPulse{0%,100%{filter:brightness(1)}50%{filter:brightness(1.3)}}
@keyframes zz{0%{opacity:0;translate:0 .3em;scale:.7}30%{opacity:1}100%{opacity:0;translate:.5em -.9em;scale:1.1}}
@keyframes buffGlow{0%{filter:none}35%{filter:brightness(1.5) saturate(1.3)}100%{filter:none}}
@keyframes chipPing{0%{box-shadow:0 0 0 0 rgba(234,180,58,.8)}100%{box-shadow:0 0 0 14px rgba(234,180,58,0)}}
@keyframes bump{0%{scale:1}40%{scale:1.14}100%{scale:1}}
@keyframes ledgerIn{from{background:rgba(234,180,58,.28)}to{background:transparent}}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.08s!important}
  .spread .card .card-inner{animation:none}
}

/* =====================================================================
   ARCANA PAGES: skins, ranking, profile, shop, quick duel
   ===================================================================== */

#site{overflow-x:clip}

/* ---------- card skins ---------- */
:is(.card,.minion,.deckpile,.skin-chip)[data-skin="verdant"]{--cf-face:radial-gradient(ellipse at 50% 38%,#f1f5e4,#d5e2bd 85%);--cf-ribbon:#e9f0d8;--cf-rule:rgba(35,70,40,.32);--mb-face:radial-gradient(ellipse at 50% 40%,#f1f5e4,#d0ddb6);
  --cb-face:repeating-linear-gradient(45deg,rgba(234,220,160,.16) 0 .1em,transparent .1em 1.05em),repeating-linear-gradient(-45deg,rgba(234,220,160,.16) 0 .1em,transparent .1em 1.05em),radial-gradient(circle at 50% 50%,#5aa877,#2f7049 48%,#173d27)}
:is(.card,.minion,.deckpile,.skin-chip)[data-skin="crimson"]{--cf-face:radial-gradient(ellipse at 50% 38%,#fcece6,#f0cfc3 85%);--cf-frame:#4a0f0b;--cf-ribbon:#f9e3dc;--cf-rule:rgba(120,24,16,.4);--mb-face:radial-gradient(ellipse at 50% 40%,#fcece6,#eecabd);
  --cb-face:repeating-linear-gradient(45deg,rgba(255,220,190,.14) 0 .1em,transparent .1em 1.05em),repeating-linear-gradient(-45deg,rgba(255,220,190,.14) 0 .1em,transparent .1em 1.05em),radial-gradient(circle at 50% 50%,#e25a47,#a82a1f 45%,#561009);--cb-line:rgba(255,214,150,.9);--cb-sigil:#ffd98a}
:is(.card,.minion,.deckpile,.skin-chip)[data-skin="obsidian"]{--cf-face:radial-gradient(ellipse at 50% 32%,#3b3748,#17151f 85%);--cf-frame:#07060b;--cf-ink:#f1e9d6;--cf-ribbon:#272430;--cf-rule:rgba(241,233,214,.26);--mb-face:radial-gradient(ellipse at 50% 40%,#4a4558,#1b1924);
  --cb-face:repeating-linear-gradient(45deg,rgba(255,255,255,.07) 0 .1em,transparent .1em 1.05em),repeating-linear-gradient(-45deg,rgba(255,255,255,.07) 0 .1em,transparent .1em 1.05em),radial-gradient(circle at 50% 50%,#44404f,#1f1d28 50%,#0c0b10);--cb-line:rgba(214,208,232,.7);--cb-sigil:#dcd6ec}
:is(.card,.minion,.deckpile,.skin-chip)[data-skin="gilded"]{--cf-face:radial-gradient(ellipse at 50% 38%,#fff9e8,#f1dfae 85%);--cf-frame:#6e4610;--cf-ribbon:linear-gradient(#fcebb8,#efcd78);--cf-rule:rgba(214,158,38,.95);--mb-face:radial-gradient(ellipse at 50% 35%,#fff3cc,#e2bb5f);
  --cb-face:repeating-linear-gradient(45deg,rgba(234,180,58,.22) 0 .1em,transparent .1em 1.05em),repeating-linear-gradient(-45deg,rgba(234,180,58,.22) 0 .1em,transparent .1em 1.05em),radial-gradient(circle at 50% 50%,#3a2a14,#221708 55%,#0f0a04);--cb-line:#eab43a;--cb-sigil:#f7d27a}
:is(.card,.minion,.deckpile,.skin-chip)[data-skin="celestial"]{--cf-face:radial-gradient(circle,rgba(255,255,255,.75) 0 .05em,transparent .09em) 0 0/1.7em 1.9em,radial-gradient(circle,rgba(190,210,255,.55) 0 .04em,transparent .08em) .8em .9em/2.3em 2.1em,radial-gradient(ellipse at 50% 30%,#2e3a82,#141a4a 80%);--cf-frame:#070a24;--cf-ink:#eceaff;--cf-ribbon:#1d2560;--cf-rule:rgba(190,205,255,.45);--mb-face:radial-gradient(ellipse at 50% 35%,#3d4aa0,#151b4d);
  --cb-face:radial-gradient(circle,rgba(255,255,255,.85) 0 .06em,transparent .1em) 0 0/1.5em 1.7em,radial-gradient(circle,rgba(170,200,255,.65) 0 .05em,transparent .09em) .7em .8em/2.1em 1.9em,radial-gradient(circle at 50% 45%,#3b4bb0,#1a2266 50%,#0a0d2c);--cb-line:rgba(200,215,255,.85);--cb-sigil:#dfe6ff}
:is(.card,.minion,.deckpile,.skin-chip)[data-skin="prismatic"]{--cf-face:linear-gradient(135deg,#fff7e6,#f6e1f3 30%,#dff3fa 60%,#f8f1d6);--cf-frame:#2a1f3a;--cf-ribbon:linear-gradient(90deg,#ffe9f5,#e3f6ff,#fff4d6);--cf-rule:rgba(140,90,200,.4);--mb-face:linear-gradient(135deg,#fff7e6,#f0dcf3 40%,#d9f0f8);
  --cb-face:linear-gradient(135deg,#ff7ac6 0%,#8a7bff 30%,#46d6ff 55%,#ffd66b 85%);--cb-line:rgba(255,255,255,.9);--cb-sigil:#fff}
.card[data-skin="prismatic"] .card-face::before,.card[data-skin="prismatic"] .card-back::after,.minion[data-skin="prismatic"] .m-body::after{content:"";position:absolute;inset:0;z-index:5;pointer-events:none;border-radius:inherit;
  background:linear-gradient(115deg,rgba(255,255,255,0) 20%,rgba(255,110,200,.3) 35%,rgba(110,220,255,.32) 50%,rgba(255,225,110,.3) 65%,rgba(255,255,255,0) 80%);background-size:260% 260%;background-position:var(--sx) 50%;animation:sheen 3.2s ease-in-out infinite}
.card[data-skin="gilded"] .card-face{box-shadow:inset 0 0 0 .1em #f6d27b,0 .5em 1.4em rgba(0,0,0,.35)}

/* ---------- table skins ---------- */
[data-table-skin]{--tbl-bg:repeating-linear-gradient(45deg,rgba(242,228,196,.05) 0 1px,transparent 1px 30px),repeating-linear-gradient(-45deg,rgba(242,228,196,.05) 0 1px,transparent 1px 30px),radial-gradient(ellipse 110% 75% at 50% 52%,#1c2466 0%,#111640 55%,#070920 100%);--tbl-rail:none}
[data-table-skin="felt"]{--tbl-bg:repeating-radial-gradient(circle at 30% 30%,rgba(255,255,255,.02) 0 1px,transparent 1px 3px),radial-gradient(ellipse 100% 80% at 50% 50%,#2f7d52 0%,#1c5536 55%,#0b2518 100%);--tbl-rail:inset 0 0 0 10px rgba(0,0,0,.22),inset 0 0 90px rgba(0,0,0,.55)}
[data-table-skin="oak"]{--tbl-bg:repeating-linear-gradient(91deg,rgba(0,0,0,.09) 0 2px,transparent 2px 11px),repeating-linear-gradient(89deg,rgba(255,214,160,.06) 0 1px,transparent 1px 27px),radial-gradient(ellipse 100% 80% at 50% 45%,#6b4527 0%,#4a2e19 60%,#24150a 100%);--tbl-rail:inset 0 0 120px rgba(0,0,0,.55)}
[data-table-skin="velvet"]{--tbl-bg:repeating-linear-gradient(135deg,rgba(255,255,255,.025) 0 2px,transparent 2px 6px),radial-gradient(ellipse 90% 70% at 50% 45%,#9a2a3a 0%,#5d1422 55%,#260710 100%);--tbl-rail:inset 0 0 110px rgba(0,0,0,.55)}
[data-table-skin="marble"]{--tbl-bg:linear-gradient(118deg,transparent 38%,rgba(234,180,58,.22) 39%,transparent 40.2%),linear-gradient(28deg,transparent 58%,rgba(255,255,255,.09) 59%,transparent 60.5%),linear-gradient(160deg,transparent 70%,rgba(234,180,58,.15) 70.6%,transparent 71.4%),radial-gradient(ellipse 90% 80% at 50% 40%,#3a3e4d 0%,#1b1d26 65%,#0d0e13 100%);--tbl-rail:inset 0 0 100px rgba(0,0,0,.5)}
[data-table-skin="starfield"]{--tbl-bg:radial-gradient(circle,rgba(255,255,255,.9) 0 1px,transparent 1.6px) 0 0/97px 83px,radial-gradient(circle,rgba(200,220,255,.7) 0 .8px,transparent 1.3px) 31px 47px/61px 57px,radial-gradient(ellipse 60% 45% at 72% 28%,rgba(130,80,210,.4),transparent 70%),radial-gradient(ellipse 55% 45% at 22% 78%,rgba(40,120,210,.32),transparent 70%),#05061a;--tbl-rail:none}
.table[data-table-skin]:not([data-table-skin="midnight"])::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:var(--tbl-bg);box-shadow:var(--tbl-rail)}
.table[data-table-skin="starfield"]::after,.tbl-swatch[data-table-skin="starfield"]::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(circle,rgba(255,255,255,.95) 0 1.2px,transparent 2px) 13px 21px/173px 149px,radial-gradient(circle,rgba(255,240,200,.9) 0 1px,transparent 1.8px) 70px 90px/211px 181px;animation:twinkle 3.6s ease-in-out infinite alternate}
.tbl-swatch{position:relative;isolation:isolate;overflow:hidden;background:var(--tbl-bg);box-shadow:var(--tbl-rail)}

/* ---------- app shell additions ---------- */
.app-nav{display:flex;gap:.2rem;margin-left:.4rem;padding:.25rem;border-radius:12px;background:rgba(255,255,255,.05);border:1px solid rgba(239,228,204,.12)}
.app-nav button{appearance:none;border:0;background:none;color:#bdbade;font-weight:700;font-size:.9rem;padding:.42rem .8rem;border-radius:9px;cursor:pointer;transition:background-color .2s,color .2s}
.app-nav button:hover{color:#fff;background:rgba(255,255,255,.08)}
.app-nav button[aria-current="page"]{background:#f2e4c4;color:var(--keyline)}
.coins-chip .acoin{width:18px;height:18px}
.app[data-mode="match"] .app-nav,.app[data-mode="match"] .app-tabs,.app[data-mode="match"] .coins-chip,.app[data-mode="match"] .bar-search{display:none}
.leave-btn .l-match,.leave-btn .l-short{display:none}
.app[data-mode="match"] .leave-btn .l-site{display:none}
.app[data-mode="match"] .leave-btn .l-match{display:inline}
.app-tabs{display:none}
@media (max-width:1100px){.app-brand span{display:none}.app .chip .lbl{display:none}.app[data-mode="pages"] .leave-btn .l-site{display:none}.app[data-mode="pages"] .leave-btn .l-short{display:inline}}
@media (max-width:760px){
  .app-nav{display:none}
  .app-tabs{position:relative;z-index:60;display:grid;grid-template-columns:repeat(4,1fr);gap:.2rem;padding:.35rem .5rem calc(.35rem + env(safe-area-inset-bottom));background:rgba(8,10,32,.96);border-top:1px solid rgba(239,228,204,.14)}
  .app-tabs button{appearance:none;border:0;background:none;color:#a8a5cc;display:grid;justify-items:center;gap:.12rem;padding:.35rem 0;border-radius:10px;font-size:.72rem;font-weight:700;cursor:pointer}
  .app-tabs svg{width:22px;height:22px}
  .app-tabs button[aria-current="page"]{color:#fff;background:rgba(242,228,196,.1)}
  .app-tabs button[aria-current="page"] svg{color:var(--saffron)}
}
.acoin{display:inline-block;flex:none;width:1.15em;height:1.15em;vertical-align:-.2em}
.app .up{color:#62e39c}
.app .down{color:#ff7d6e}

/* ---------- search ---------- */
.search{position:relative;display:flex;align-items:center}
.search .s-ic{position:absolute;left:.8rem;top:50%;width:18px;height:18px;margin-top:-9px;color:#a8a5cc;pointer-events:none;z-index:1}
.search input{appearance:none;width:100%;min-width:0;font:inherit;font-size:.95rem;color:#fff;background:rgba(255,255,255,.07);border:1px solid rgba(239,228,204,.18);border-radius:11px;padding:.66rem .9rem .66rem 2.45rem;outline:none;transition:border-color .2s,background-color .2s,box-shadow .2s}
.search input::placeholder{color:#8f8cb6}
.search input:focus{border-color:var(--saffron);background:rgba(255,255,255,.1);box-shadow:0 0 0 3px rgba(234,180,58,.25)}
.search input::-webkit-search-cancel-button{filter:invert(1) opacity(.55)}
.search-list{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:70;margin:0;padding:.35rem;list-style:none;max-height:min(360px,60vh);overflow:auto;background:#101543;border:1px solid rgba(239,228,204,.18);border-radius:12px;box-shadow:0 20px 50px rgba(0,0,0,.55);text-align:left}
.s-opt{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.6rem;padding:.45rem .55rem;border-radius:9px;cursor:pointer}
.s-opt[aria-selected="true"],.s-opt:hover{background:rgba(242,228,196,.1)}
.s-main{display:grid;line-height:1.2;min-width:0}
.s-main b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s-main small{color:#a8a5cc;font-family:var(--mono);font-size:.74rem}
.s-pnl{font-weight:800;font-size:.85rem}
.s-hint{padding:.6rem .7rem;color:#a8a5cc;font-size:.88rem}
.bar-search{position:relative}
.search-pop{position:absolute;right:0;top:calc(100% + 8px);z-index:75;display:block;width:min(390px,calc(100vw - 20px));padding:.5rem;background:#0e1238;border:1px solid rgba(239,228,204,.18);border-radius:14px;box-shadow:0 24px 60px rgba(0,0,0,.6)}
.search-pop .s-ic{left:1.3rem;top:1.53rem;margin-top:-9px}
.search-pop .search-list{position:static;margin-top:.4rem;box-shadow:none;border:0;background:none;padding:0}
.search-pop .search-list[hidden]{display:none}
@media (max-width:600px){.search-pop{position:fixed;left:10px;right:10px;top:60px;width:auto}}

/* ---------- pages ---------- */
.page{overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;text-align:left}
.page-wrap{max-width:1120px;margin:0 auto;padding:clamp(1rem,3vw,2rem) clamp(.9rem,3vw,2rem) 3rem}
.page-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:1rem 2rem;margin-bottom:1.4rem}
.page-kicker,.prof-kicker{margin:0 0 .35rem;font-size:.78rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--saffron)}
.view.page h2{font-size:clamp(2.6rem,6vw,4rem)}
.page-sub{margin:.55rem 0 0;color:#b9b6db;max-width:54ch}
.page-head .search{width:min(380px,100%)}
.seg{display:inline-flex;gap:.2rem;padding:.25rem;border-radius:11px;background:rgba(255,255,255,.06);border:1px solid rgba(239,228,204,.12)}
.seg button{appearance:none;border:0;background:none;color:#bdbade;font-weight:700;font-size:.88rem;padding:.45rem .85rem;border-radius:8px;cursor:pointer;white-space:nowrap;transition:background-color .2s,color .2s}
.seg button:hover{color:#fff}
.seg button[aria-selected="true"]{background:#f2e4c4;color:var(--keyline)}
.seg.sm button{font-size:.8rem;padding:.34rem .62rem}

/* avatars */
.ava{display:inline-block;flex:none;width:34px;height:34px;border-radius:50%;overflow:hidden;background:var(--art);border:2px solid var(--keyline);box-shadow:0 0 0 2px #f2e4c4}
.ava svg{width:100%;height:100%;transform:scale(1.05)}
.ava-lg{width:76px;height:76px;border-width:3px;box-shadow:0 0 0 4px #f2e4c4,0 0 0 7px var(--keyline),0 10px 22px rgba(0,0,0,.4)}
.ava-xl{width:clamp(84px,13vw,116px);height:clamp(84px,13vw,116px);border-width:3px;box-shadow:0 0 0 5px #f2e4c4,0 0 0 8px var(--keyline),0 18px 36px rgba(0,0,0,.45)}

/* ranking */
.rank-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.8rem 1.5rem}
.sim-note{margin:0;color:#8f8cb6;font-size:.85rem}
.podium{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.6rem,2vw,1.4rem);align-items:end;margin:3.4rem 0 2rem;perspective:900px}
.pod{position:relative;isolation:isolate;overflow:hidden;appearance:none;cursor:pointer;display:grid;justify-items:center;gap:.22rem;padding:2.7rem 1rem 1.3rem;border-radius:18px;color:#efe4cc;text-align:center;
  background:radial-gradient(ellipse at 50% 0%,color-mix(in srgb,var(--tier) 22%,transparent),transparent 60%),linear-gradient(#1a2058,#10143b);border:3px solid var(--keyline);box-shadow:0 0 0 3px var(--tier),0 0 0 6px var(--keyline),0 24px 50px rgba(0,0,0,.45);
  transition:translate .35s cubic-bezier(.2,.8,.2,1),box-shadow .3s;animation:podIn .85s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i) * 120ms + 60ms)}
.pod.gold{--tier:#eab43a;translate:0 -24px;padding-top:3.3rem}
.pod.silver{--tier:#c9d1e6}
.pod.bronze{--tier:#cd8a4a}
.pod:hover{box-shadow:0 0 0 3px var(--tier),0 0 0 6px var(--keyline),0 30px 60px rgba(0,0,0,.55),0 0 46px color-mix(in srgb,var(--tier) 45%,transparent)}
.pod.gold:hover{translate:0 -30px}
.pod.silver:hover,.pod.bronze:hover{translate:0 -6px}
.pod-empty{min-height:1px}
.pod-num{position:absolute;top:.5rem;left:50%;translate:-50% 0;font-family:var(--display);font-weight:900;font-size:1.8rem;line-height:1;color:var(--tier)}
.pod .ava-lg{margin-bottom:.45rem}
.pod-rays{position:absolute;left:50%;top:40%;width:280px;height:280px;margin:-140px 0 0 -140px;z-index:-1;opacity:.2;fill:#eab43a;animation:spin 40s linear infinite}
.pod-name{font-weight:800;font-size:1.05rem;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pod-addr{font-family:var(--mono);font-size:.74rem;color:#8f8cb6}
.pod-pnl{font-weight:800;font-size:clamp(1.3rem,3vw,1.95rem);line-height:1.1;font-variant-numeric:tabular-nums;margin-top:.25rem}
.pod-pnl small{font-size:.45em;margin-left:.3em;color:#a8a5cc;font-weight:700}
.pod-meta{font-size:.8rem;color:#a8a5cc}
.pod.is-you .pod-name::after{content:" (you)";color:var(--saffron)}
.table-card{border-radius:16px;background:rgba(255,255,255,.035);border:1px solid rgba(239,228,204,.12);overflow:hidden}
.rank-table{width:100%;border-collapse:collapse;font-size:.95rem}
.rank-table th{padding:.75rem .7rem;font-size:.78rem;font-weight:700;color:#8f8cb6;text-align:left;border-bottom:1px solid rgba(239,228,204,.12);white-space:nowrap}
.rank-table th button{appearance:none;border:0;background:none;color:inherit;font:inherit;display:inline-flex;align-items:center;gap:.3rem;cursor:pointer;padding:.2rem .1rem}
.rank-table th button:hover{color:#fff}
.rank-table th button svg{width:9px;height:9px;fill:none;stroke:currentColor;stroke-width:1.6;opacity:.55}
.rank-table th[aria-sort="descending"],.rank-table th[aria-sort="ascending"]{color:#f2e4c4}
.rank-table th[aria-sort="descending"] svg path:first-child,.rank-table th[aria-sort="ascending"] svg path:last-child{opacity:.15}
.rank-table td{padding:.5rem .7rem;border-bottom:1px solid rgba(239,228,204,.07);vertical-align:middle}
.rank-table tbody tr{cursor:pointer;transition:background-color .15s;animation:rowIn .5s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i) * 20ms)}
.rank-table tbody tr:hover{background:rgba(242,228,196,.06)}
.rank-table tbody tr.is-you{background:rgba(234,180,58,.11);box-shadow:inset 3px 0 0 var(--saffron)}
.rank-table tbody tr:last-child td{border-bottom:0}
.num{text-align:right;font-variant-numeric:tabular-nums;font-weight:700}
.rank-table .c-pnl,.rank-table .c-winRate,.rank-table .c-duels,.rank-table .c-volume{text-align:right}
.rank-table .c-rank{width:3.2rem}
.rank-table .c-trend{width:112px}
.rk{display:inline-grid;place-items:center;min-width:1.95rem;height:1.95rem;padding:0 .3rem;border-radius:999px;font-weight:800;font-size:.85rem;color:#bdbade;font-variant-numeric:tabular-nums}
.rk.t1{background:#eab43a;color:var(--keyline)}
.rk.t2{background:#c9d1e6;color:var(--keyline)}
.rk.t3{background:#cd8a4a;color:var(--keyline)}
.plink{appearance:none;border:0;background:none;color:inherit;font:inherit;display:inline-flex;align-items:center;gap:.6rem;padding:0;cursor:pointer;text-align:left;min-width:0;max-width:100%}
.plink > span{display:grid;line-height:1.2;min-width:0}
.plink b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:22ch}
.plink small{font-family:var(--mono);font-size:.72rem;color:#8f8cb6}
.plink:not(.bot):hover b{text-decoration:underline;text-decoration-color:var(--saffron);text-underline-offset:3px}
.plink.bot{cursor:default}
.wr{display:inline-block;width:46px;height:5px;margin-right:.55rem;vertical-align:middle;border-radius:5px;background:rgba(255,255,255,.1);overflow:hidden}
.wr i{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,#6f9cf2,#a9c3ff)}
.spark{width:96px;height:28px;overflow:visible}
.spark polyline,.spark path{fill:none;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.spark.up polyline,.spark.up path{stroke:#62e39c}
.spark.down polyline,.spark.down path{stroke:#ff7d6e}
.rank-you{position:sticky;bottom:.8rem;z-index:5;margin-top:1.2rem;display:flex;align-items:center;gap:.8rem;padding:.7rem .8rem .7rem .9rem;border-radius:14px;background:rgba(14,18,56,.94);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(234,180,58,.45);box-shadow:0 16px 40px rgba(0,0,0,.45)}
.ry-main{display:grid;line-height:1.25;margin-right:auto;min-width:0}
.ry-main small{color:#a8a5cc}
.rank-you .btn{flex:none}
@media (max-width:760px){
  .rank-table .c-volume,.rank-table .c-trend,.rank-table .c-duels{display:none}
  .rank-table{font-size:.88rem}
  .rank-table td,.rank-table th{padding:.5rem .45rem}
  .rank-table .c-rank{width:2.4rem}
  .plink small{display:none}
  .plink b{max-width:13ch}
  .wr{display:none}
  .podium{margin-top:2.8rem;gap:.5rem}
  .podium{padding:0 7px}
  .pod{padding:2.2rem .35rem .9rem;box-shadow:0 0 0 2px var(--tier),0 0 0 4px var(--keyline),0 14px 30px rgba(0,0,0,.4)}
  .pod-pnl small{display:none}
  .pod.gold{padding-top:2.6rem;translate:0 -16px}
  .pod .ava-lg{width:50px;height:50px}
  .pod-addr,.pod-meta{display:none}
  .pod-name{font-size:.82rem}
  .pod-pnl{font-size:1rem}
  .pod-num{font-size:1.4rem}
  .pod-rays{width:180px;height:180px;margin:-90px 0 0 -90px}
  .rank-you small{display:none}
}

/* profile */
.prof-head{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;align-items:center;gap:1rem 1.5rem;margin:.4rem 0 1.6rem}
.prof-head.self{grid-template-columns:auto minmax(0,1fr) auto}
.back{appearance:none;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(239,228,204,.2);background:rgba(255,255,255,.06);color:#efe4cc;cursor:pointer;align-self:start;margin-top:.5rem}
.back:hover{background:rgba(255,255,255,.12)}
.back svg{width:20px;height:20px}
.prof-id{min-width:0}
.prof-id h2{font-size:clamp(2.2rem,5.5vw,3.4rem);overflow-wrap:anywhere}
.addr-row{display:flex;align-items:center;gap:.4rem;margin-top:.5rem;min-width:0}
.addr-row code{font-family:var(--mono);font-size:.82rem;color:#b9b6db;background:rgba(255,255,255,.05);padding:.32rem .55rem;border-radius:7px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.copy{appearance:none;flex:none;width:32px;height:32px;display:grid;place-items:center;border-radius:8px;border:1px solid rgba(239,228,204,.16);background:rgba(255,255,255,.05);color:#d7d3f0;cursor:pointer}
.copy:hover{background:rgba(255,255,255,.12)}
.copy svg{width:16px;height:16px}
.badges{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.75rem}
.badge{font-size:.78rem;font-weight:700;padding:.25rem .62rem;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(239,228,204,.14);color:#d7d3f0}
.badge.rank{background:#f2e4c4;color:var(--keyline);border-color:transparent}
.badge.hot{background:rgba(214,60,44,.2);border-color:rgba(214,60,44,.55);color:#ffb4a6}
.prof-skins{display:grid;gap:.6rem;align-self:start;padding:.8rem 1rem;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid rgba(239,228,204,.1)}
.mini-skin{display:flex;align-items:center;gap:.65rem;font-size:.86rem;font-weight:700}
.mini-skin > span:last-child{display:grid;line-height:1.15}
.mini-skin small{color:#8f8cb6;font-weight:600;font-size:.72rem}
.skin-chip{display:block;flex:none}
.skin-chip.card-chip{font-size:14px;width:26px;height:36px;border-radius:5px;background:var(--cb-face);border:2px solid var(--cf-frame);box-shadow:0 0 0 1.5px rgba(242,228,196,.55)}
.skin-chip.tbl-chip{width:42px;height:30px;border-radius:6px;background:var(--tbl-bg);box-shadow:inset 0 0 0 2px var(--keyline),0 0 0 1.5px rgba(242,228,196,.55)}
.tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:minmax(100px,auto);gap:.8rem;margin-bottom:1.2rem}
.tile{position:relative;display:grid;align-content:center;gap:.15rem;padding:1rem 1.1rem;border-radius:14px;background:rgba(255,255,255,.045);border:1px solid rgba(239,228,204,.12);animation:rowIn .6s cubic-bezier(.2,.8,.2,1) both}
.tile:nth-child(2){animation-delay:.06s}.tile:nth-child(3){animation-delay:.12s}.tile:nth-child(4){animation-delay:.18s}.tile:nth-child(5){animation-delay:.24s}
.tile.big{grid-column:span 2;grid-row:span 2;background:radial-gradient(ellipse at 0% 0%,rgba(98,227,156,.2),transparent 60%),rgba(255,255,255,.04)}
.tile.big.down{background:radial-gradient(ellipse at 0% 0%,rgba(255,125,110,.2),transparent 60%),rgba(255,255,255,.04)}
.t-label{font-size:.8rem;color:#a8a5cc;font-weight:700}
.tile .num{text-align:left}
.t-val{font-size:clamp(1.5rem,3vw,2rem);font-weight:800;line-height:1.05;color:#fff}
.tile.big .t-val{font-size:clamp(2.6rem,6vw,4.2rem);letter-spacing:-.02em}
.tile.big.up .t-val{color:#62e39c}
.tile.big.down .t-val{color:#ff7d6e}
.tile small{color:#8f8cb6;font-size:.8rem}
.ring-tile{grid-template-columns:auto 1fr;align-items:center;gap:.9rem}
.ring-tile svg{width:74px;height:74px;transform:rotate(-90deg)}
.ring-tile circle{fill:none;stroke-width:8}
.r-bg{stroke:rgba(255,255,255,.1)}
.r-fg{stroke:var(--saffron);stroke-linecap:round;animation:ringIn 1.2s cubic-bezier(.2,.8,.2,1) both}
.ring-val{display:grid;line-height:1.1}
.ring-val b{font-size:1.6rem;color:#fff}
.ring-val small{color:#8f8cb6}
.card-box{border-radius:16px;background:rgba(255,255,255,.04);border:1px solid rgba(239,228,204,.12);padding:1rem 1.1rem 1.1rem}
.box-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.6rem;margin-bottom:.8rem}
.box-head h3{margin:0;font-family:var(--display);font-weight:700;font-size:1.75rem;line-height:1}
.box-tools{display:flex;gap:.5rem;flex-wrap:wrap}
.box-note{color:#8f8cb6;font-size:.85rem}
.chart-box{margin-bottom:1.2rem}
.chart-box.pnl{padding:1.1rem 1.2rem 1rem;background:radial-gradient(ellipse at 100% 0%,rgba(98,227,156,.08),transparent 55%),rgba(255,255,255,.04)}
.pnl-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem 1.4rem;flex-wrap:wrap;margin-bottom:.2rem}
.pnl-lead{display:grid;gap:.1rem;min-width:0}
.pnl-title{margin:0 0 .15rem;font-family:var(--display);font-weight:700;font-size:1.3rem;line-height:1;color:#bdbade}
.pnl-big{display:block;font-size:clamp(2rem,4.6vw,2.9rem);font-weight:800;letter-spacing:-.025em;line-height:1.02;color:#fff;font-variant-numeric:tabular-nums;transition:color .3s}
.pnl-big small{font-size:.62em;font-weight:700;color:#8f8cb6;letter-spacing:0}
.pnl-big.down{color:#ffd9d3}
.pnl-delta{display:block;margin-top:.3rem;font-weight:700;font-size:.98rem;font-variant-numeric:tabular-nums}
.pnl-delta.up{color:#62e39c}
.pnl-delta.down{color:#ff7d6e}
.pnl-big.flat,.pnl-delta.flat{color:#bdbade}
.pnl-delta .range{margin-left:.5rem;color:#8f8cb6;font-weight:600}
.pnl-tools{display:flex;gap:.45rem;flex-wrap:wrap;justify-content:flex-end;margin-left:auto}
.chart-host{position:relative;min-height:200px}
.chart{display:block;width:100%;height:auto;overflow:visible;touch-action:pan-y}
.chart .grid{stroke:rgba(239,228,204,.08);stroke-width:1}
.chart .grid.zero{stroke:rgba(239,228,204,.28);stroke-dasharray:4 6}
.chart .ylab,.chart .xlab{fill:#77749c;font-size:11px;font-family:var(--body);font-weight:600}
.chart .ylab{text-anchor:end}
.chart .ln{fill:none;stroke-width:3;stroke-linejoin:round;stroke-linecap:round}
.chart .ln.up{stroke:#62e39c}
.chart .ln.down{stroke:#ff7d6e}
.chart .ln.glow{stroke-width:9;opacity:.16;filter:blur(3px)}
.chart .ln.glow.down{stroke:#ff7d6e}
.chart .end{stroke:#0b0e2a;stroke-width:2.5}
.chart .end.up{fill:#62e39c;filter:drop-shadow(0 0 7px rgba(98,227,156,.9))}
.chart .end.down{fill:#ff7d6e;filter:drop-shadow(0 0 7px rgba(255,125,110,.9))}
.chart .plot{animation:plotIn 1.2s cubic-bezier(.3,.7,.2,1) both}
.chart .blab{font-size:11px;font-weight:700;font-family:var(--body);font-variant-numeric:tabular-nums}
.chart .blab.up{fill:#62e39c}
.chart .blab.down{fill:#ff7d6e}
.chart .bar{transform-box:fill-box;transform-origin:50% 100%;animation:barIn .6s cubic-bezier(.2,.8,.2,1) both;animation-delay:var(--d)}
.chart .bar.down{transform-origin:50% 0%}
.chart .cross{stroke:rgba(242,228,196,.55);stroke-width:1;stroke-dasharray:3 4;pointer-events:none}
.chart .dot{fill:#fff;stroke-width:3;pointer-events:none}
.chart .dot.up{stroke:#62e39c}
.chart .dot.down{stroke:#ff7d6e}
.chart .hit{cursor:crosshair}
.tip{position:absolute;left:0;top:0;z-index:3;pointer-events:none;display:grid;gap:.12rem;min-width:150px;padding:.5rem .7rem;border-radius:10px;background:#0a0d2c;border:1px solid rgba(239,228,204,.22);box-shadow:0 12px 30px rgba(0,0,0,.5);font-size:.8rem;white-space:nowrap}
.tip[hidden]{display:none}
.tip b{font-size:1.08rem;font-variant-numeric:tabular-nums}
.t-date{color:#a8a5cc}
.t-duel{color:#d7d3f0}
.chart-sum{margin:.5rem 0 0;color:#8f8cb6;font-size:.8rem;line-height:1.45}
.chart-empty{display:grid;justify-items:center;gap:.7rem;padding:2.6rem 1rem;text-align:center;color:#a8a5cc}
.chart-empty svg{width:130px;color:rgba(234,180,58,.6)}
.chart-empty p{margin:0}
.chart-empty.small{padding:1.4rem 1rem}
.prof-cols{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:1.2rem;align-items:start}
.duels{list-style:none;margin:0;padding:0;display:grid}
.duel{display:grid;grid-template-columns:4.6rem minmax(0,1fr) auto auto 4.4rem;align-items:center;gap:.6rem;padding:.55rem .15rem;border-bottom:1px solid rgba(239,228,204,.07);font-size:.9rem}
.duel:last-child{border-bottom:0}
.d-when{color:#8f8cb6;font-size:.8rem}
.d-stake{color:#bdbade;font-size:.84rem;white-space:nowrap}
.d-pnl{font-size:.92rem}
.plink.sm{gap:.45rem}
.plink.sm .ava{width:26px;height:26px}
.pill{font-size:.72rem;font-weight:800;padding:.2rem .52rem;border-radius:999px;text-align:center;white-space:nowrap}
.pill.win{background:rgba(98,227,156,.16);color:#62e39c}
.pill.loss{background:rgba(255,125,110,.14);color:#ff9a8d}
.pill.draw,.pill.refund{background:rgba(255,255,255,.08);color:#d7d3f0}
.more{margin-top:.8rem}
.favs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem}
.fav{display:grid;gap:.45rem;justify-items:center;text-align:center}
.fav-art{display:block;width:100%;aspect-ratio:10 / 12;border-radius:40% 40% 8px 8px / 30% 30% 8px 8px;overflow:hidden;background:var(--art);border:3px solid var(--keyline);box-shadow:0 0 0 3px #f2e4c4,0 0 0 6px var(--keyline)}
.fav-art svg{width:100%;height:100%}
.fav-name{font-family:var(--display);font-weight:700;font-size:1.05rem;line-height:1;margin-top:.35rem}
.prof-missing{display:grid;justify-items:center;text-align:center;gap:.7rem;padding:4rem 1rem}
.pm-seal{width:96px;height:96px;color:var(--saffron)}
.pm-seal svg{width:100%;height:100%}
.prof-missing p{margin:0;color:#b9b6db}
.prof-missing code{font-family:var(--mono);font-size:.8rem;color:#a8a5cc;overflow-wrap:anywhere}
@media (max-width:860px){
  .prof-cols{grid-template-columns:1fr}
  .tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tile.big{grid-row:span 1}
  .prof-head,.prof-head.self{grid-template-columns:auto minmax(0,1fr)}
  .prof-head .back{grid-column:1 / -1;margin:0}
  .prof-skins{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:1.2rem}
}
@media (max-width:560px){
  .duel{grid-template-columns:minmax(0,1fr) auto auto;row-gap:.25rem}
  .d-when{grid-column:1 / -1}
  .d-stake{display:none}
  .favs{gap:.45rem}
  .fav-name{font-size:.9rem}
  .ring-tile svg{width:60px;height:60px}
}

/* ---------- shop ---------- */
.coin-balance{display:flex;align-items:center;gap:.55rem;padding:.6rem 1rem .6rem .75rem;border-radius:14px;background:linear-gradient(135deg,rgba(234,180,58,.2),rgba(234,180,58,.05));border:1px solid rgba(234,180,58,.45)}
.coin-balance .acoin{width:30px;height:30px}
.coin-balance b{font-size:1.6rem;font-variant-numeric:tabular-nums;color:#fff;line-height:1}
.coin-balance span{color:#e9cf8f;font-size:.85rem;font-weight:700}
.shop-top{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:1.3rem;margin-bottom:1.7rem}
.shop-stage{position:relative;aspect-ratio:16 / 10;border-radius:18px;border:3px solid var(--keyline);box-shadow:0 0 0 4px #f2e4c4,0 0 0 7px var(--keyline),0 30px 60px rgba(0,0,0,.45)}
.ss-lane{position:absolute;left:0;right:0;top:4%;z-index:1;display:flex;justify-content:center;gap:1.6em;font-size:clamp(5.4px,.85vw,9.5px)}
.ss-lane.ss-you{top:36%}
.ss-mid{position:absolute;left:6%;right:6%;top:32.5%;height:2px;background:linear-gradient(90deg,transparent,rgba(234,180,58,.5) 15%,rgba(234,180,58,.5) 85%,transparent)}
.minion.static,.qd .minion{position:relative;left:auto;top:auto;transform:none;transition:none;touch-action:manipulation}
.minion.static{cursor:default}
.ss-hand{position:absolute;left:50%;bottom:-7%;z-index:2;display:flex;font-size:clamp(6px,.98vw,10.5px);translate:-50% 0}
.ss-hand .card{margin:0 -1.1em;transform-origin:50% 120%}
.ss-hand .card:nth-child(1){transform:translateY(1em) rotate(-10deg)}
.ss-hand .card:nth-child(3){transform:translateY(1em) rotate(10deg)}
.ss-hand .ss-back{position:absolute;left:100%;bottom:4.6em;margin-left:1.6em;transform:rotate(16deg)}
.shop-stage.swap .ss-hand .card,.shop-stage.swap .ss-you .minion,.shop-stage.swap::before{animation:skinSwap .55s cubic-bezier(.2,.8,.2,1) both}
.shop-stage.revealed{animation:stageReveal 1s cubic-bezier(.2,.8,.2,1)}
.shop-detail{display:grid;align-content:center;justify-items:start;gap:.45rem;padding:1.3rem 1.4rem;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid rgba(239,228,204,.12)}
.sd-kind{margin:0;font-size:.78rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#8f8cb6}
.sd-name{margin:0;font-family:var(--display);font-weight:700;font-size:clamp(2.1rem,4vw,2.9rem);line-height:.95;color:#f4e8d0}
.sd-blurb{margin:.3rem 0 .7rem;color:#c3c0e2}
.sd-actions{display:flex;flex-wrap:wrap;gap:.55rem;align-items:center}
.rarity{display:inline-block;font-size:.72rem;font-weight:800;padding:.16rem .55rem;border-radius:999px;border:1px solid currentColor;white-space:nowrap}
.rarity.common{color:#bdbade}
.rarity.rare{color:#8fb6ff}
.rarity.legendary{color:#f5c04e;box-shadow:0 0 12px rgba(245,192,78,.35)}
.buy-btn .acoin{margin:0 .1rem 0 .15rem}
.buy-btn.confirming{background:var(--saffron);color:var(--keyline);animation:confirmPulse 1s ease-in-out infinite}
.btn .ic{width:18px;height:18px}
.shop-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.8rem;margin-bottom:1rem}
.earn-note{margin:0;color:#a8a5cc;font-size:.88rem}
.shop-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:.9rem}
.shop-tile{appearance:none;cursor:pointer;display:grid;text-align:left;padding:.55rem;border-radius:16px;color:#efe4cc;background:rgba(255,255,255,.045);border:2px solid rgba(239,228,204,.12);transition:translate .25s cubic-bezier(.2,.8,.2,1),border-color .2s,background-color .2s,box-shadow .25s;animation:rowIn .5s cubic-bezier(.2,.8,.2,1) both}
.shop-tile:nth-child(2){animation-delay:.04s}.shop-tile:nth-child(3){animation-delay:.08s}.shop-tile:nth-child(4){animation-delay:.12s}.shop-tile:nth-child(5){animation-delay:.16s}.shop-tile:nth-child(6){animation-delay:.2s}.shop-tile:nth-child(7){animation-delay:.24s}
.shop-tile:hover{translate:0 -4px;background:rgba(255,255,255,.07)}
.shop-tile.is-sel{border-color:var(--saffron);box-shadow:0 0 0 3px rgba(234,180,58,.25),0 14px 30px rgba(0,0,0,.35)}
.tile-art{position:relative;display:grid;place-items:center;height:132px;border-radius:11px;overflow:hidden;background:radial-gradient(ellipse at 50% 60%,#1c2466,#0c1030)}
.shop-tile.legendary .tile-art{box-shadow:inset 0 0 0 1px rgba(245,192,78,.55),inset 0 0 34px rgba(245,192,78,.2)}
.tile-info{display:flex;align-items:center;justify-content:space-between;gap:.4rem;padding:.65rem .25rem .2rem}
.tile-info b{font-size:.95rem;line-height:1.2}
.tile-foot{padding:.25rem .25rem .15rem;font-weight:800;font-size:.92rem}
.price{display:inline-flex;align-items:center;gap:.3rem;color:#f5d27a}
.own{color:#a8a5cc;font-weight:700}
.own.eq{color:#62e39c}
.tp-cards{position:relative;display:block;width:124px;height:118px}
.tp-slot{position:absolute;top:10px;left:10px;font-size:6.4px;transform:rotate(-12deg)}
.tp-slot:last-child{left:52px;top:6px;transform:rotate(9deg)}
.shop-tile:hover .tp-slot:first-child{transform:rotate(-18deg) translateX(-4px)}
.shop-tile:hover .tp-slot:last-child{transform:rotate(14deg) translateX(4px)}
.tp-slot{transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.tp-table{position:absolute;inset:0}
.tp-table i{position:absolute;display:block}
.tp-table i:nth-child(1){left:10%;right:10%;top:50%;height:2px;background:linear-gradient(90deg,transparent,rgba(234,180,58,.6),transparent)}
.tp-table i:nth-child(2),.tp-table i:nth-child(3){left:calc(50% - 15px);width:30px;height:36px;border-radius:15px 15px 6px 6px;border:2px solid var(--keyline);background:radial-gradient(ellipse at 50% 40%,#faf0d9,#eadab4);box-shadow:0 4px 8px rgba(0,0,0,.4)}
.tp-table i:nth-child(2){top:12%}
.tp-table i:nth-child(3){bottom:12%}
@media (max-width:860px){
  .shop-top{grid-template-columns:1fr}
  .shop-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
  .tile-art{height:112px}
  .tile-info{flex-direction:column;align-items:flex-start}
}

/* ---------- toasts, rewards, lobby ---------- */
.toasts{position:fixed;left:50%;bottom:clamp(76px,11vh,112px);translate:-50% 0;z-index:95;display:grid;gap:.5rem;justify-items:center;pointer-events:none;width:max-content;max-width:calc(100vw - 24px)}
.toast{display:flex;align-items:center;gap:.55rem;padding:.65rem 1rem;border-radius:12px;background:#0b0f33;color:#f2e6cf;border:1px solid rgba(239,228,204,.22);box-shadow:0 16px 40px rgba(0,0,0,.5);font-size:.92rem;animation:toastIn .45s cubic-bezier(.2,.8,.2,1) both}
.toast b{color:#fff}
.toast .acoin{width:20px;height:20px}
.toast.gold{border-color:rgba(234,180,58,.65)}
.toast.out{animation:toastOut .35s ease forwards}
.reward{display:inline-flex;align-items:center;gap:.5rem;margin:1rem auto 0;padding:.45rem .95rem;border-radius:999px;background:rgba(234,180,58,.12);border:1px solid rgba(234,180,58,.45);color:#f5dd9c;font-size:.92rem}
.reward b{color:#ffe7a8}
.reward .acoin{width:20px;height:20px}
.equip-line{margin:1.2rem 0 0;color:#a8a5cc;font-size:.9rem}
.equip-line b{color:#efe4cc}
.linkish{appearance:none;border:0;background:none;padding:0;color:var(--saffron);font:inherit;font-weight:700;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.closer-cta{display:flex;flex-wrap:wrap;gap:.8rem;justify-content:center}
.closer .btn-ghost{color:#e9e2ff}

/* ---------- landing quick duel ---------- */
.demo{position:relative;z-index:2}
.demo-grid{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:clamp(2rem,5vw,4.5rem);align-items:center}
.eyebrow{margin:0 0 .6rem;font-size:.8rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.demo-how{list-style:none;margin:1.8rem 0 0;padding:0;display:grid;gap:1rem}
.demo-how li{display:grid;grid-template-columns:2.5rem 1fr;gap:.9rem;align-items:start}
.demo-how span{display:grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:50%;border:2px solid var(--ink);font-family:var(--display);font-weight:900;font-size:1.05rem;line-height:1;color:var(--accent)}
.demo-how p{margin:.25rem 0 0;color:var(--muted)}
.demo-how b{color:var(--ink)}
.demo-record{margin:1.4rem 0 0;font-weight:700;color:var(--ink)}
.demo-record:empty{display:none}
.qd{position:relative;isolation:isolate;display:grid;grid-template-rows:auto minmax(0,1fr) auto minmax(0,1fr) auto auto;min-height:clamp(600px,52vw,690px);padding:.9rem .9rem 0;border-radius:26px;overflow:hidden;color:#efe4cc;user-select:none;-webkit-user-select:none;
  background:radial-gradient(ellipse 100% 70% at 50% 50%,#222b73 0%,#131845 60%,#0a0c27 100%);border:3px solid var(--keyline);box-shadow:0 0 0 5px #f2e4c4,0 0 0 8px var(--keyline),0 40px 90px rgba(14,18,51,.35);
  --qfs:clamp(7px,.98vw,10.5px);--qtok:clamp(5.6px,.76vw,10px)}
.qd::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.06;pointer-events:none;background:repeating-linear-gradient(45deg,#f2e4c4 0 1px,transparent 1px 24px),repeating-linear-gradient(-45deg,#f2e4c4 0 1px,transparent 1px 24px)}
.qd-row{position:relative;z-index:2;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.6rem;padding:0 .3rem}
.qd-row > :first-child{justify-self:start}
.qd-row > :last-child{justify-self:end}
.qd-hero{position:relative;appearance:none;border:0;background:none;padding:0;width:clamp(56px,6vw,70px);aspect-ratio:1;border-radius:50%;cursor:default;touch-action:manipulation}
.qd-medal{position:absolute;inset:0;border-radius:50%;background:var(--art);border:3px solid var(--keyline);box-shadow:0 0 0 3px #f2e4c4,0 0 0 6px var(--keyline),0 10px 22px rgba(0,0,0,.5);overflow:hidden;transition:box-shadow .25s,filter .6s,transform .6s}
.qd-medal svg{width:100%;height:100%;transform:scale(.9)}
.qd-hp{position:absolute;right:-16%;bottom:-12%;width:50%;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;color:#fff;background:radial-gradient(circle at 35% 30%,#f08676,var(--red) 58%,#921f15);border:3px solid var(--keyline);z-index:2}
.qd-hp b{font-size:clamp(13px,1.4vw,16px);font-weight:800;line-height:1;font-variant-numeric:tabular-nums}
.qd-hero.hurt .qd-hp{background:radial-gradient(circle at 35% 30%,#c65a4c,#8a2117 70%)}
.qd-hero.is-target{cursor:pointer}
.qd-hero.is-target .qd-medal{box-shadow:0 0 0 3px #f2e4c4,0 0 0 6px var(--red),0 0 28px 8px rgba(214,60,44,.85)}
.qd-hero.broken .qd-medal{filter:grayscale(1) brightness(.5);transform:scale(.9)}
.qd-mana{display:flex;align-items:center;gap:.4rem;font-weight:800;color:#b9d2ff;font-variant-numeric:tabular-nums}
.qd-mana i{display:block;width:12px;height:12px;transform:rotate(45deg);border:2px solid var(--keyline);background:linear-gradient(135deg,#d7e6ff,#6f9cf2 42%,#2f5bb8);box-shadow:0 0 9px rgba(120,170,255,.8)}
.qd-mana b{font-size:1.08rem;color:#fff}
.qd-mana span{color:#8fa6d8}
.qd-rhand{position:relative;width:120px;height:42px}
.qd-rhand i{position:absolute;left:50%;top:4px;width:22px;height:32px;margin-left:-11px;border-radius:4px;border:2px solid var(--keyline);background:repeating-linear-gradient(45deg,rgba(242,228,196,.2) 0 1px,transparent 1px 5px),#2f5bb8;transform:translateX(calc(var(--i) * 13px)) rotate(calc(var(--i) * 7deg));transform-origin:50% 140%}
.qd-lane{position:relative;z-index:3;display:flex;justify-content:center;align-items:center;gap:calc(var(--qtok) * 1.7);font-size:var(--qtok);min-height:calc(var(--qtok) * 12.4)}
.qd .minion{flex:none;will-change:auto}
.qd-mid{position:relative;z-index:4;display:flex;align-items:center;justify-content:center;min-height:46px}
.qd-mid::before{content:"";position:absolute;left:3%;right:3%;top:50%;height:2px;z-index:-1;background:linear-gradient(90deg,transparent,rgba(234,180,58,.4) 14%,rgba(234,180,58,.4) 86%,transparent)}
.qd-status{max-width:58%;padding:.32rem .85rem;border-radius:8px;background:#111640;border:1px solid rgba(239,228,204,.16);font-size:.86rem;font-weight:700;color:#d7d3f0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qd-status.you{background:var(--red);color:#fff6e8;border-color:var(--keyline)}
.qd-status.rival{background:var(--blue);color:#fff;border-color:var(--keyline)}
.qd-status.warn{background:#3b1512;color:#ffb4a6;border-color:rgba(255,120,100,.45)}
.qd-end{position:absolute;right:.4rem;top:50%;translate:0 -50%;appearance:none;cursor:pointer;padding:.45rem .85rem;border-radius:9px;border:2px solid var(--keyline);font-weight:800;font-size:.85rem;color:var(--keyline);background:linear-gradient(#f5cf6c,var(--saffron));box-shadow:inset 0 -3px 0 rgba(0,0,0,.2)}
.qd-end:hover:not([disabled]){filter:brightness(1.07)}
.qd-end[disabled]{background:#2a3170;color:#9d9ac4;border-color:#0a0c24;box-shadow:none;cursor:default}
.qd-end.is-ready{animation:readyPulse 1.4s ease-in-out infinite}
.qd-deck{display:flex;align-items:center;gap:.45rem;color:#c3c0e2;font-size:.85rem}
.qd-deck .pile{width:24px;height:34px}
.qd-deck b{color:#fff;font-variant-numeric:tabular-nums}
.qd-hand{position:relative;z-index:6;display:flex;justify-content:center;align-items:flex-start;font-size:var(--qfs);height:calc(var(--qfs) * 13.6);padding:0 .3rem;margin-top:.5rem}
.qd-hand .card{flex:none;cursor:pointer;touch-action:manipulation;transform:translateY(var(--y,0px)) rotate(var(--r,0deg));transform-origin:50% 100%;transition:transform .3s cubic-bezier(.2,.8,.2,1),margin .3s}
.qd-hand .card.can-play .card-face{box-shadow:0 0 0 .2em var(--saffron),0 0 1.3em .28em rgba(234,180,58,.62),0 .5em 1.4em rgba(0,0,0,.35)}
.qd-hand .card.is-selected{transform:translateY(-26%) scale(1.08);z-index:60!important}
.qd-hand .card.is-selected .card-face{box-shadow:0 0 0 .22em #fff4d6,0 0 2em .55em rgba(255,236,190,.78)}
@media (hover:hover){.qd-hand .card:hover{transform:translateY(-30%) rotate(0deg) scale(1.14);z-index:60!important}}
.qd-cover{position:absolute;inset:0;z-index:20;display:grid;place-items:center;padding:1.2rem;text-align:center;background:radial-gradient(ellipse at 50% 50%,rgba(10,12,39,.7),rgba(5,7,24,.93));-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.qd-cover[hidden]{display:none}
.qd-cover-in{max-width:36ch;display:grid;gap:.55rem;justify-items:center}
.qd-kicker{margin:0;font-size:.76rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--saffron)}
.qd-cover h3{margin:0;font-family:var(--display);font-weight:900;font-size:clamp(3rem,6vw,4.4rem);line-height:.9;color:#f4e8d0}
.qd-cover-text{margin:0;color:#c3c0e2}
.qd-actions{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center;margin-top:.6rem}
.qd-actions .btn-ghost{color:#e6def7}
.qd-reward{display:flex;align-items:center;gap:.6rem;margin:.3rem 0 0;padding:.55rem .85rem;border-radius:12px;background:rgba(234,180,58,.14);border:1px solid rgba(234,180,58,.5);color:#f5dd9c;font-size:.9rem;text-align:left}
.qd-reward b{color:#ffe7a8}
.qd-reward .acoin{width:28px;height:28px}
.qd.qd-death::after{content:"";position:absolute;inset:0;z-index:15;pointer-events:none;background:radial-gradient(circle,rgba(58,42,85,.25),rgba(10,6,20,.88));animation:deathFade .95s ease both}
@media (max-width:860px){
  .demo-grid{grid-template-columns:1fr}
  .qd{min-height:590px;padding:.7rem .6rem 0;--qfs:clamp(6.6px,2.1vw,9.5px);--qtok:clamp(5.3px,1.65vw,7.6px)}
  .qd-rhand{width:96px}
  .qd-mid{justify-content:space-between;gap:.5rem;padding:0 .2rem}
  .qd-status{max-width:none;min-width:0;flex:1 1 auto;font-size:.78rem}
  .qd-end{position:static;translate:none;flex:none;font-size:.8rem;padding:.4rem .7rem}
}

@keyframes podIn{from{opacity:0;transform:translateY(46px) rotateX(28deg)}to{opacity:1;transform:none}}
@keyframes rowIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes ringIn{from{stroke-dasharray:0 214}}
@keyframes plotIn{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes barIn{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes skinSwap{0%{filter:brightness(1.9) saturate(.2);scale:.94}100%{filter:none;scale:1}}
@keyframes stageReveal{0%{box-shadow:0 0 0 4px #f2e4c4,0 0 0 7px var(--keyline),0 0 0 0 rgba(234,180,58,.9)}35%{box-shadow:0 0 0 4px #fff4d6,0 0 0 7px var(--saffron),0 0 90px 20px rgba(234,180,58,.75)}100%{box-shadow:0 0 0 4px #f2e4c4,0 0 0 7px var(--keyline),0 30px 60px rgba(0,0,0,.45)}}
@keyframes confirmPulse{0%,100%{box-shadow:inset 0 -3px 0 rgba(0,0,0,.22),0 0 0 2px var(--keyline),0 0 0 0 rgba(234,180,58,.6)}50%{box-shadow:inset 0 -3px 0 rgba(0,0,0,.22),0 0 0 2px var(--keyline),0 0 0 7px rgba(234,180,58,0)}}
@keyframes twinkle{from{opacity:.15}to{opacity:.95}}
@keyframes toastIn{from{opacity:0;transform:translateY(16px) scale(.96)}to{opacity:1;transform:none}}
@keyframes toastOut{to{opacity:0;transform:translateY(10px)}}
@keyframes deathFade{0%{opacity:0}40%{opacity:1}100%{opacity:0}}

/* ---------- custom tables ---------- */
.stakes-row{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:clamp(.5rem,2.2vw,1.3rem);margin:2.2rem 0 1.4rem}
.stakes-row .stakes{margin:0;gap:clamp(.5rem,2.2vw,1.3rem)}
.stakes-row .coin{width:clamp(58px,16vw,108px)}
.stakes-row .coin b{font-size:clamp(1.3rem,4.2vw,2.3rem)}
.coin-custom{appearance:none;cursor:pointer;width:clamp(58px,16vw,108px);aspect-ratio:1;border-radius:50%;display:grid;place-content:center;justify-items:center;gap:.12rem;color:#f2e4c4;background:radial-gradient(circle at 34% 28%,rgba(242,228,196,.16),rgba(242,228,196,.03) 62%);border:3px dashed rgba(242,228,196,.6);transition:transform .25s cubic-bezier(.3,1.6,.5,1),border-color .2s,color .2s,background-color .2s}
.coin-custom svg{width:clamp(18px,4.4vw,30px);height:clamp(18px,4.4vw,30px)}
.coin-custom small{font-size:clamp(.62rem,1.9vw,.74rem);font-weight:800;letter-spacing:.03em}
.coin-custom:hover{transform:translateY(-4px) rotate(8deg);border-color:var(--saffron);color:#fff;background-color:rgba(234,180,58,.12)}
.seg button[aria-pressed="true"]{background:#f2e4c4;color:var(--keyline)}
.back-link{appearance:none;border:0;background:none;padding:.2rem 0;margin:0 0 .5rem;display:inline-flex;align-items:center;gap:.3rem;color:#bdbade;font:inherit;font-size:.88rem;font-weight:700;cursor:pointer}
.back-link:hover{color:#fff}
.back-link svg{width:16px;height:16px}
.ct-layout{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:1.2rem;align-items:start}
.ct-create{position:sticky;top:1rem;display:grid;gap:.85rem;padding:1.2rem 1.25rem 1.25rem}
.ct-title{margin:0;font-family:var(--display);font-weight:700;font-size:1.9rem;line-height:1}
.ct-lead{margin:-.3rem 0 0;color:#b9b6db;font-size:.92rem}
.ct-amount{display:flex;align-items:center;gap:.6rem;padding:.35rem 1rem;border-radius:14px;background:rgba(255,255,255,.06);border:2px solid rgba(239,228,204,.2);cursor:text;transition:border-color .2s,box-shadow .2s}
.ct-amount:focus-within{border-color:var(--saffron);box-shadow:0 0 0 3px rgba(234,180,58,.22)}
.ct-amount input{flex:1;min-width:0;appearance:none;border:0;background:none;outline:none;color:#fff;font:inherit;font-size:clamp(2rem,4.4vw,2.8rem);font-weight:800;font-variant-numeric:tabular-nums;padding:.15rem 0}
.ct-amount input::placeholder{color:rgba(239,228,204,.25)}
.ct-cur{font-weight:800;color:#a8a5cc;font-size:1.05rem}
.ct-quick{display:flex;flex-wrap:wrap;gap:.4rem}
.ct-quick button{appearance:none;cursor:pointer;padding:.36rem .78rem;border-radius:999px;border:1px solid rgba(239,228,204,.2);background:rgba(255,255,255,.05);color:#e6def7;font:inherit;font-weight:700;font-size:.85rem;transition:background-color .2s,color .2s}
.ct-quick button:hover{background:rgba(255,255,255,.12)}
.ct-quick button[aria-pressed="true"]{background:#f2e4c4;color:var(--keyline);border-color:transparent}
.ct-sum{margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}
.ct-sum div{padding:.55rem .7rem;border-radius:10px;background:rgba(255,255,255,.04);border:1px solid rgba(239,228,204,.1);min-width:0}
.ct-sum dt{font-size:.74rem;color:#a8a5cc;font-weight:700;white-space:nowrap}
.ct-sum dd{margin:.1rem 0 0;font-weight:800;font-variant-numeric:tabular-nums;color:#fff;overflow:hidden;text-overflow:ellipsis}
.ct-sum .win dd{color:#62e39c}
.ct-msg{margin:0;min-height:1.35em;font-size:.88rem;color:#ffb4a6}
.ct-msg.hint{color:#8f8cb6}
.ct-open{width:100%}
.ct-near{margin:-.3rem 0 0;font-size:.86rem;color:#a8a5cc}
.ct-near:empty{display:none}
.ct-faucet{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem;padding-top:.75rem;border-top:1px solid rgba(239,228,204,.1);font-size:.82rem;color:#8f8cb6}
.ct-hosting{display:grid;justify-items:center;text-align:center;gap:.45rem;padding:.4rem 0 .2rem}
.ct-orbit{position:relative;width:128px;height:128px;display:grid;place-items:center;margin-bottom:.3rem}
.ct-orbit::before,.ct-orbit::after{content:"";position:absolute;inset:0;border-radius:50%;pointer-events:none}
.ct-orbit::before{border:2px dashed rgba(234,180,58,.6);animation:spin 12s linear infinite}
.ct-orbit::after{inset:12px;border:3px solid rgba(242,228,196,.12);border-top-color:var(--saffron);animation:spin 1.3s linear infinite}
.ct-orbit .ava{width:78px;height:78px;border-width:3px;box-shadow:0 0 0 4px #f2e4c4,0 0 0 7px var(--keyline)}
.ct-host-amt{margin:0;font-family:var(--display);font-weight:900;font-size:clamp(2.6rem,6vw,3.6rem);line-height:.95;color:#f4e8d0}
.ct-host-amt small{font-family:var(--body);font-size:.32em;font-weight:800;color:#a8a5cc;margin-left:.35em}
.ct-wait{margin:.2rem 0 0;color:#d7d3f0}
.ct-wait b{color:#fff;font-variant-numeric:tabular-nums}
.ct-host-note{margin:0 0 .5rem;color:#8f8cb6;font-size:.85rem;max-width:36ch}
.ct-tools{display:grid;gap:.6rem;margin-bottom:.8rem}
.ct-search{width:100%}
.ct-tools-row{display:flex;flex-wrap:wrap;gap:.5rem .8rem;align-items:center;justify-content:space-between}
.ct-bands{max-width:100%;overflow-x:auto;scrollbar-width:none}
.ct-tools-end{display:flex;align-items:center;gap:.7rem}
.ct-check{display:inline-flex;align-items:center;gap:.4rem;font-size:.85rem;color:#d7d3f0;cursor:pointer;white-space:nowrap}
.ct-check input{accent-color:#eab43a;width:16px;height:16px}
.ct-select{appearance:none;font:inherit;font-size:.84rem;font-weight:700;color:#e6def7;background:rgba(255,255,255,.06) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23d7d3f0' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right .6rem center/10px;border:1px solid rgba(239,228,204,.18);border-radius:9px;padding:.42rem 1.8rem .42rem .7rem;cursor:pointer}
.ct-select option{color:#17153a}
.ct-rows{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.ct-row{display:grid;grid-template-columns:minmax(0,1.25fr) auto minmax(0,1fr) auto;grid-template-areas:"p s o j";align-items:center;gap:.9rem;padding:.65rem .75rem;border-radius:13px;background:rgba(255,255,255,.045);border:1px solid rgba(239,228,204,.1);transition:background-color .2s,opacity .55s ease,transform .55s ease}
.ct-row:hover{background:rgba(255,255,255,.075)}
.ct-row.fresh{animation:ctIn .8s cubic-bezier(.2,.8,.2,1) both}
.ct-row.taken{opacity:0;transform:translateX(26px)}
.ct-row.mine{border-color:rgba(234,180,58,.6);background:linear-gradient(90deg,rgba(234,180,58,.16),rgba(255,255,255,.03))}
.ct-row.exact{box-shadow:inset 3px 0 0 var(--saffron)}
.ct-p{grid-area:p}
.ct-stake{grid-area:s;display:grid;justify-items:end;line-height:1.1}
.ct-stake b{font-size:1.35rem;font-variant-numeric:tabular-nums;color:#fff}
.ct-stake small{font-size:.72rem;color:#8f8cb6}
.ct-pot{grid-area:o;display:grid;line-height:1.3;font-size:.84rem;color:#bdbade;min-width:0}
.ct-pot small{color:#62e39c;font-weight:700;font-size:.8rem}
.ct-side{grid-area:j;display:grid;justify-items:end;gap:.3rem;min-width:5.6rem}
.ct-age{font-size:.72rem;color:#8f8cb6;white-space:nowrap}
.ct-join{white-space:nowrap}
.ct-join.confirming{animation:confirmPulse 1s ease-in-out infinite}
.ct-need{font-size:.74rem;color:#ffb4a6;font-weight:700;white-space:nowrap}
.pill.mine{background:rgba(234,180,58,.2);color:#f5d27a}
.ct-empty{display:grid;justify-items:center;gap:.7rem;padding:1.8rem 1rem;text-align:center;color:#a8a5cc;border:1px dashed rgba(239,228,204,.18);border-radius:13px}
.ct-empty p{margin:0}
.ct-note{margin:.9rem 0 0}
.app[data-mode="hosting"] .app-nav,.app[data-mode="hosting"] .app-tabs,.app[data-mode="hosting"] .coins-chip,.app[data-mode="hosting"] .bar-search{display:none}
.app[data-mode="hosting"] .leave-btn .l-site,.app[data-mode="hosting"] .leave-btn .l-short{display:none}
.app[data-mode="hosting"] .leave-btn .l-match{display:inline}
.app[data-mode="hosting"] .back-link{visibility:hidden}
@keyframes ctIn{from{opacity:0;transform:translateY(-12px) scale(.98);background-color:rgba(234,180,58,.3)}to{opacity:1;transform:none}}
@media (max-width:900px){.ct-layout{grid-template-columns:1fr}.ct-create{position:static}}
@media (max-width:600px){
  .ct-row{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"p s" "o j";row-gap:.45rem;gap:.45rem .7rem}
  .ct-side{grid-template-columns:auto auto;align-items:center;gap:.5rem;min-width:0}
  .ct-tools-end{width:100%;justify-content:space-between}
  .ct-sum dt{font-size:.68rem}
  .ct-sum dd{font-size:.9rem}
}
.ct-layout > *,.ct-create > *,.ct-browse > *{min-width:0}
.ct-amount input{width:100%}
@media (max-width:900px){.ct-layout{grid-template-columns:minmax(0,1fr)}}
.ct-tools-row > *{min-width:0}
@media (max-width:600px){.ct-bands{flex:1 1 100%}}
.ct-tools{grid-template-columns:minmax(0,1fr)}

/* ---------- bots for coins ---------- */
.preview-tag{display:inline-flex;align-items:center;margin-left:.2rem;padding:.18rem .5rem;border-radius:999px;font-size:.68rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#f5d27a;background:rgba(234,180,58,.12);border:1px solid rgba(234,180,58,.4);white-space:nowrap}
.app[data-mode="match"] .preview-tag{display:none}
.bot-auto{display:flex;align-items:center;justify-content:center;gap:.5rem;margin:.9rem auto 0;font-size:.88rem;color:#c3c0e2;cursor:pointer;max-width:44ch}
.bot-auto input{accent-color:#eab43a;width:17px;height:17px;flex:none}
.bot-box{width:min(460px,100%);margin:1.4rem auto 0;padding:1rem 1.1rem 1.05rem;border-radius:16px;background:rgba(255,255,255,.045);border:1px solid rgba(239,228,204,.14);display:grid;gap:.7rem;justify-items:center}
.bot-head{display:grid;gap:.15rem;justify-items:center}
.bot-head b{color:#f4e8d0}
.bot-head small{color:#8f8cb6;font-size:.8rem}
.bot-levels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem;width:100%}
.bot-levels button{appearance:none;cursor:pointer;display:grid;gap:.05rem;padding:.5rem .3rem;border-radius:11px;border:1px solid rgba(239,228,204,.18);background:rgba(255,255,255,.05);color:#e6def7;font:inherit;transition:background-color .2s,border-color .2s,transform .2s}
.bot-levels button span{font-weight:800;font-size:.95rem}
.bot-levels button small{font-size:.72rem;color:#a8a5cc;font-weight:700}
.bot-levels button:hover{background:rgba(255,255,255,.1)}
.bot-levels button[aria-checked="true"]{background:#f2e4c4;color:var(--keyline);border-color:transparent;transform:translateY(-2px)}
.bot-levels button[aria-checked="true"] small{color:#6b5a2e}
.bot-record{margin:0;font-size:.82rem;color:#8f8cb6}
.bot-record:empty{display:none}
.seek-timer{margin:.8rem 0 0;color:#8f8cb6;font-variant-numeric:tabular-nums;min-height:1.4em}
.seek-none{margin:1.2rem auto 0;max-width:520px;padding:1.1rem 1.2rem;border-radius:16px;background:rgba(255,255,255,.05);border:1px solid rgba(234,180,58,.4);animation:rowIn .45s cubic-bezier(.2,.8,.2,1) both}
.seek-none-title{margin:0;font-family:var(--display);font-weight:700;font-size:1.7rem;line-height:1.05;color:#f4e8d0}
.seek-none-text{margin:.45rem 0 0;color:#c3c0e2}
.seek-none-text b{color:var(--saffron);font-size:1.15em;font-variant-numeric:tabular-nums}
.seek-none .actions{margin-top:1rem}
.rings.idle svg:nth-child(1),.rings.idle svg:nth-child(2){animation-duration:40s}
.ct-botoffer{display:grid;justify-items:center;gap:.35rem;margin-top:.6rem;padding-top:.7rem;border-top:1px solid rgba(239,228,204,.1);font-size:.85rem;color:#a8a5cc;width:100%}
.qd-levels{display:inline-flex;gap:.25rem;padding:.25rem;border-radius:11px;background:rgba(255,255,255,.07);border:1px solid rgba(239,228,204,.14);margin-top:.2rem}
.qd-levels button{appearance:none;border:0;background:none;color:#d7d3f0;font:inherit;font-weight:700;font-size:.85rem;padding:.38rem .8rem;border-radius:8px;cursor:pointer}
.qd-levels button[aria-checked="true"]{background:#f2e4c4;color:var(--keyline)}

/* ---------- stake token: dollar hints and unit toggle ---------- */
.coin .coin-usd{font-size:clamp(.56rem,1.6vw,.68rem);font-weight:700;letter-spacing:0;opacity:.78;white-space:nowrap;margin-top:.05rem}
.coin[disabled] .coin-usd{opacity:.5}
.price-line{margin:-.4rem 0 .9rem;color:#a8a5cc;font-size:.84rem}
.price-line:empty{display:none}
.payout .sub{color:#a8a5cc;font-size:.88em;white-space:nowrap}
.app .chip .wallet-usd{color:#a8a5cc}
.app .chip .wallet-usd:empty{display:none}
.ct-price{margin:-.2rem 0 0;color:#a8a5cc;font-size:.82rem}
.chart-price{margin:.3rem 0 0;color:#8f8cb6;font-size:.78rem}
@media (max-width:640px){.pnl-tools{justify-content:flex-start;margin-left:0}.pnl-big{font-size:2.1rem}}
.ct-sum dd{font-size:.92rem}
.ct-sum .win dd{white-space:normal}
.rank-bar [data-rank-unit]:empty{display:none}
.seg button[aria-checked="true"]{background:#f2e4c4;color:var(--keyline)}
@media (max-width:640px){
  .app .chip .wallet-usd{display:none}
  .coin .coin-usd{display:none}
  .stakes-row .coin b{font-size:clamp(1.15rem,4vw,2rem)}
}

/* game server unreachable (online build) */
.server-down{position:fixed;left:50%;bottom:16px;z-index:60;translate:-50% 0;max-width:calc(100vw - 24px);padding:.6rem 1rem;border-radius:999px;background:#2a1330;border:1px solid rgba(255,125,110,.5);color:#ffd9d3;font-size:.9rem;box-shadow:0 12px 30px rgba(0,0,0,.4)}
.gate-link{color:#f6d77a;font-weight:700}

/* wallet picker in the sign-in gate */
.wallets{display:grid;gap:.5rem;margin:.2rem 0 .9rem}
.wallet-btn{display:flex;align-items:center;gap:.75rem;width:100%;padding:.7rem .9rem;border-radius:12px;border:1px solid rgba(239,228,204,.18);background:rgba(255,255,255,.05);color:#f2e6cf;font-weight:700;font-size:1rem;cursor:pointer;text-align:left;transition:background .2s,border-color .2s}
.wallet-btn:hover{background:rgba(255,255,255,.1);border-color:rgba(234,180,58,.6)}
.wallet-btn img,.wallet-dot{width:28px;height:28px;border-radius:8px;flex:none}
.wallet-dot{background:linear-gradient(135deg,#eab43a,#d63c2c)}
.wallet-btn[disabled]{opacity:.6;cursor:wait}

[data-preview-only]{display:none!important}
.gate .panel{max-width:460px}
.gate-error{min-height:1.3em;margin:.6rem 0 0;color:#ffb4a6;font-size:.92rem}
.gate-help{margin:1rem 0 0;color:#8f8cb6;font-size:.85rem}