/* app.css — PlanetPad design system (SPEC §10). Shared by every page.
 *
 * Layout: fixed .sp-rail (left, --sp-rail wide), fixed .sp-top (--sp-top tall), .sp-main pads itself clear of
 * both, .sp-tabbar replaces the rail at <= 768px. Pages put their content in <main class="sp-main"><div class="sp-wrap">.
 *
 * Markup the components expect (anything close also works):
 *   status chip      App.statusChip(status, { endsAt })  → <span class="sp-chip is-racing"><span class="sp-dot is-racing"></span>Racing · …</span>
 *   steps bar        <ol class="sp-steps-bar"><li class="is-done">Details</li><li class="is-active">Sign</li><li>Approve</li><li>Verify</li></ol>
 *                    (states: .is-done/.done, .is-active/.active/.on/[aria-current=step], .is-error)
 *   step cards       <ol class="sp-steps"><li [class="is-done"]><span class="sp-step-icon" data-icon="compass"></span><small>Step 1</small><h3>…</h3><p>…</p></li>…</ol>
 *   mass bar         <div class="sp-bar [is-holder|is-leader]"><i style="width:62%"></i></div>   or   <div class="sp-bar" style="--w:62%"></div>
 *   key/values       <dl class="sp-kv"><dt>Type</dt><dd>Planet</dd>…</dl>   or   <div class="sp-kv"><div><span>Type</span><b>Planet</b></div></div>
 *   leaderboard row  <a class="sp-lb-row"><span class="sp-rank">1</span> image <div class="sp-lb-main">name</div> <div class="sp-lb-mass">$…</div> chip arrow</a>
 *   rank circle      .sp-rank shows 1–3 inverted (white) automatically (app.js marks them .is-top)
 *   accordion        <div class="sp-accordion"><details id="q-x"><summary>Question</summary><div>Answer</div></details>…</div>
 *   toggle pills     <button class="sp-pill" aria-pressed="true">Open</button>   (.active / .is-active / aria-selected also work)
 *   segmented        <div class="sp-seg" role="group"><button aria-pressed="true">Solar System</button>…</div>
 *   modal            App.modal({ title, html }) / App.walletModal() build .sp-modal > .sp-modal-card
 *   burn counter     app.js renders .sp-burn-wrap > a.sp-burn ("🔥 31.2M burned" → /burn) next to the CA; shown at >= 1024px
 *                    once state.treasury.burned > 0 (SPEC §18)
 */

:root{
  --sp-bg:#05060a; --sp-panel:#0c0e15; --sp-panel-2:#121521; --sp-panel-3:#1a1e2c;
  --sp-line:#ffffff12; --sp-line-2:#ffffff24; --sp-text:#f3f5ff; --sp-muted:#e6ebff99; --sp-faint:#e6ebff61;
  --sp-accent:#8b7bff; --sp-accent-2:#46d0ff; --sp-grad:linear-gradient(120deg,#8b7bff,#46d0ff);
  --sp-open:#7fb8ff; --sp-claimed:#ffcf5c; --sp-race:#ff4f8b; --sp-ok:#5ee3a1; --sp-warn:#ffb454; --sp-err:#ff6b6b;
  --sp-ease:cubic-bezier(.16,1,.3,1); --sp-rail:64px; --sp-top:60px; --sp-radius:16px;
  --sp-font:"Inter",system-ui,sans-serif; --sp-display:"Space Grotesk","Inter",sans-serif; --sp-mono:"JetBrains Mono",ui-monospace,monospace;
  /* extras */
  --sp-radius-sm:12px; --sp-field:#090b11; --sp-light:#fafafa; --sp-ink:#0a0a0a;
  --sp-tabbar:calc(64px + env(safe-area-inset-bottom, 0px));
  --sp-shadow:0 24px 60px -20px rgba(0,0,0,.8),0 2px 8px rgba(0,0,0,.35);
  --sp-ring:0 0 0 3px rgba(139,123,255,.24);
  --sp-stars-a:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='540' height='540'%3E%3Ccircle cx='0.0' cy='497.2' r='0.45' fill='%23fff' opacity='0.25'/%3E%3Ccircle cx='287.7' cy='177.8' r='0.61' fill='%23fff' opacity='0.42'/%3E%3Ccircle cx='369.6' cy='343.4' r='0.64' fill='%23fff' opacity='0.26'/%3E%3Ccircle cx='382.3' cy='376.9' r='0.37' fill='%23fff' opacity='0.40'/%3E%3Ccircle cx='498.1' cy='436.0' r='0.39' fill='%23fff' opacity='0.34'/%3E%3Ccircle cx='371.8' cy='347.6' r='0.55' fill='%23fff' opacity='0.47'/%3E%3Ccircle cx='201.0' cy='181.1' r='0.64' fill='%23ffe6c7' opacity='0.29'/%3E%3Ccircle cx='160.7' cy='231.4' r='0.45' fill='%23fff' opacity='0.48'/%3E%3Ccircle cx='393.8' cy='474.0' r='0.37' fill='%23fff' opacity='0.27'/%3E%3Ccircle cx='274.8' cy='227.6' r='0.42' fill='%23cfdcff' opacity='0.47'/%3E%3Ccircle cx='197.4' cy='185.8' r='0.58' fill='%23fff' opacity='0.48'/%3E%3Ccircle cx='89.4' cy='219.0' r='0.45' fill='%23fff' opacity='0.30'/%3E%3Ccircle cx='179.6' cy='287.1' r='0.56' fill='%23fff' opacity='0.25'/%3E%3Ccircle cx='247.2' cy='466.0' r='0.57' fill='%23fff' opacity='0.38'/%3E%3Ccircle cx='272.7' cy='372.1' r='0.68' fill='%23fff' opacity='0.31'/%3E%3Ccircle cx='135.6' cy='316.9' r='0.47' fill='%23fff' opacity='0.29'/%3E%3Ccircle cx='429.1' cy='473.9' r='0.39' fill='%23cfdcff' opacity='0.44'/%3E%3Ccircle cx='219.7' cy='82.9' r='0.38' fill='%23d9ccff' opacity='0.50'/%3E%3Ccircle cx='341.5' cy='77.9' r='0.51' fill='%23cfdcff' opacity='0.37'/%3E%3Ccircle cx='497.8' cy='477.7' r='0.66' fill='%23fff' opacity='0.46'/%3E%3Ccircle cx='411.0' cy='148.7' r='0.35' fill='%23cfdcff' opacity='0.26'/%3E%3Ccircle cx='0.9' cy='333.1' r='0.43' fill='%23fff' opacity='0.42'/%3E%3Ccircle cx='371.3' cy='128.5' r='0.66' fill='%23fff' opacity='0.26'/%3E%3Ccircle cx='482.9' cy='63.9' r='0.52' fill='%23fff' opacity='0.18'/%3E%3Ccircle cx='343.9' cy='497.9' r='0.36' fill='%23ffe6c7' opacity='0.47'/%3E%3Ccircle cx='523.1' cy='305.3' r='0.59' fill='%23d9ccff' opacity='0.27'/%3E%3Ccircle cx='112.8' cy='304.8' r='0.37' fill='%23fff' opacity='0.43'/%3E%3Ccircle cx='385.6' cy='269.0' r='0.36' fill='%23fff' opacity='0.22'/%3E%3Ccircle cx='70.6' cy='371.4' r='0.66' fill='%23fff' opacity='0.19'/%3E%3Ccircle cx='465.1' cy='536.1' r='0.68' fill='%23fff' opacity='0.42'/%3E%3Ccircle cx='134.0' cy='392.9' r='0.66' fill='%23d9ccff' opacity='0.31'/%3E%3Ccircle cx='218.6' cy='479.0' r='0.55' fill='%23fff' opacity='0.29'/%3E%3Ccircle cx='396.8' cy='180.9' r='0.60' fill='%23ffe6c7' opacity='0.32'/%3E%3Ccircle cx='168.3' cy='532.2' r='0.70' fill='%23fff' opacity='0.38'/%3E%3Ccircle cx='495.9' cy='107.8' r='0.58' fill='%23fff' opacity='0.22'/%3E%3Ccircle cx='301.0' cy='416.6' r='0.68' fill='%23ffe6c7' opacity='0.33'/%3E%3Ccircle cx='241.2' cy='89.7' r='0.58' fill='%23fff' opacity='0.35'/%3E%3Ccircle cx='273.6' cy='408.9' r='0.48' fill='%23cfdcff' opacity='0.42'/%3E%3Ccircle cx='161.4' cy='292.5' r='0.42' fill='%23fff' opacity='0.41'/%3E%3Ccircle cx='127.3' cy='356.2' r='0.50' fill='%23fff' opacity='0.20'/%3E%3Ccircle cx='444.3' cy='494.3' r='0.67' fill='%23fff' opacity='0.40'/%3E%3Ccircle cx='13.6' cy='411.5' r='0.56' fill='%23fff' opacity='0.41'/%3E%3Ccircle cx='20.0' cy='73.4' r='0.38' fill='%23cfdcff' opacity='0.21'/%3E%3Ccircle cx='5.1' cy='326.7' r='0.68' fill='%23cfdcff' opacity='0.24'/%3E%3Ccircle cx='109.2' cy='364.5' r='0.44' fill='%23fff' opacity='0.33'/%3E%3Ccircle cx='228.2' cy='363.8' r='0.62' fill='%23fff' opacity='0.31'/%3E%3Ccircle cx='33.0' cy='124.3' r='0.63' fill='%23ffe6c7' opacity='0.49'/%3E%3Ccircle cx='499.8' cy='274.7' r='0.39' fill='%23fff' opacity='0.25'/%3E%3Ccircle cx='92.1' cy='42.2' r='0.45' fill='%23fff' opacity='0.39'/%3E%3Ccircle cx='259.5' cy='536.7' r='0.38' fill='%23fff' opacity='0.31'/%3E%3Ccircle cx='2.2' cy='3.3' r='0.49' fill='%23d9ccff' opacity='0.21'/%3E%3Ccircle cx='499.0' cy='419.8' r='0.62' fill='%23fff' opacity='0.32'/%3E%3Ccircle cx='519.7' cy='432.5' r='0.58' fill='%23fff' opacity='0.36'/%3E%3Ccircle cx='219.8' cy='268.4' r='0.52' fill='%23fff' opacity='0.36'/%3E%3Ccircle cx='359.2' cy='341.7' r='0.61' fill='%23fff' opacity='0.46'/%3E%3Ccircle cx='533.7' cy='236.6' r='0.52' fill='%23fff' opacity='0.49'/%3E%3Ccircle cx='193.2' cy='42.8' r='0.47' fill='%23fff' opacity='0.46'/%3E%3Ccircle cx='398.6' cy='515.8' r='0.63' fill='%23d9ccff' opacity='0.25'/%3E%3Ccircle cx='431.2' cy='56.2' r='0.67' fill='%23fff' opacity='0.44'/%3E%3Ccircle cx='384.2' cy='289.4' r='0.51' fill='%23fff' opacity='0.46'/%3E%3Ccircle cx='471.8' cy='146.1' r='0.59' fill='%23fff' opacity='0.32'/%3E%3Ccircle cx='101.3' cy='318.1' r='0.43' fill='%23fff' opacity='0.47'/%3E%3Ccircle cx='182.5' cy='368.7' r='0.66' fill='%23fff' opacity='0.22'/%3E%3Ccircle cx='497.3' cy='0.7' r='0.40' fill='%23cfdcff' opacity='0.31'/%3E%3Ccircle cx='374.1' cy='484.8' r='0.41' fill='%23fff' opacity='0.25'/%3E%3Ccircle cx='377.9' cy='94.6' r='0.39' fill='%23cfdcff' opacity='0.38'/%3E%3Ccircle cx='438.4' cy='319.5' r='0.61' fill='%23fff' opacity='0.22'/%3E%3Ccircle cx='386.0' cy='515.7' r='0.54' fill='%23fff' opacity='0.37'/%3E%3Ccircle cx='379.3' cy='396.2' r='0.56' fill='%23cfdcff' opacity='0.21'/%3E%3Ccircle cx='331.2' cy='121.4' r='0.55' fill='%23d9ccff' opacity='0.26'/%3E%3C/svg%3E");
  --sp-stars-b:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='760' height='760'%3E%3Ccircle cx='471.2' cy='478.4' r='0.87' fill='%23fff' opacity='0.51'/%3E%3Ccircle cx='40.1' cy='524.9' r='0.68' fill='%23fff' opacity='0.76'/%3E%3Ccircle cx='611.5' cy='79.5' r='0.91' fill='%23fff' opacity='0.63'/%3E%3Ccircle cx='322.9' cy='658.4' r='0.86' fill='%23fff' opacity='0.73'/%3E%3Ccircle cx='652.2' cy='144.6' r='0.82' fill='%23cfdcff' opacity='0.47'/%3E%3Ccircle cx='721.0' cy='725.6' r='0.53' fill='%23d9ccff' opacity='0.43'/%3E%3Ccircle cx='715.0' cy='661.0' r='0.93' fill='%23ffe6c7' opacity='0.52'/%3E%3Ccircle cx='22.6' cy='357.1' r='0.75' fill='%23fff' opacity='0.46'/%3E%3Ccircle cx='365.5' cy='172.3' r='0.52' fill='%23cfdcff' opacity='0.42'/%3E%3Ccircle cx='478.3' cy='355.6' r='0.86' fill='%23fff' opacity='0.73'/%3E%3Ccircle cx='532.3' cy='294.9' r='0.78' fill='%23fff' opacity='0.83'/%3E%3Ccircle cx='731.1' cy='540.8' r='0.77' fill='%23ffe6c7' opacity='0.76'/%3E%3Ccircle cx='49.7' cy='552.2' r='0.79' fill='%23fff' opacity='0.59'/%3E%3Ccircle cx='294.1' cy='375.8' r='0.55' fill='%23cfdcff' opacity='0.43'/%3E%3Ccircle cx='269.2' cy='261.9' r='0.59' fill='%23cfdcff' opacity='0.69'/%3E%3Ccircle cx='39.7' cy='1.2' r='0.88' fill='%23cfdcff' opacity='0.79'/%3E%3Ccircle cx='583.8' cy='241.9' r='0.68' fill='%23fff' opacity='0.81'/%3E%3Ccircle cx='8.8' cy='754.9' r='0.59' fill='%23fff' opacity='0.69'/%3E%3Ccircle cx='25.2' cy='131.3' r='0.84' fill='%23d9ccff' opacity='0.74'/%3E%3Ccircle cx='651.7' cy='618.3' r='0.64' fill='%23fff' opacity='0.61'/%3E%3Ccircle cx='192.5' cy='670.0' r='0.89' fill='%23fff' opacity='0.71'/%3E%3Ccircle cx='658.7' cy='623.0' r='0.87' fill='%23fff' opacity='0.74'/%3E%3Ccircle cx='525.4' cy='216.9' r='0.82' fill='%23fff' opacity='0.55'/%3E%3Ccircle cx='123.8' cy='642.5' r='0.80' fill='%23fff' opacity='0.77'/%3E%3Ccircle cx='604.8' cy='629.9' r='0.52' fill='%23ffe6c7' opacity='0.50'/%3E%3Ccircle cx='17.8' cy='438.9' r='0.87' fill='%23fff' opacity='0.68'/%3E%3Ccircle cx='657.8' cy='618.2' r='0.59' fill='%23fff' opacity='0.65'/%3E%3Ccircle cx='293.4' cy='409.0' r='0.84' fill='%23fff' opacity='0.63'/%3E%3Ccircle cx='379.8' cy='186.0' r='0.82' fill='%23fff' opacity='0.75'/%3E%3Ccircle cx='193.5' cy='466.6' r='0.75' fill='%23fff' opacity='0.82'/%3E%3Ccircle cx='240.4' cy='456.2' r='0.76' fill='%23fff' opacity='0.69'/%3E%3Ccircle cx='122.7' cy='158.6' r='0.55' fill='%23fff' opacity='0.55'/%3E%3Ccircle cx='664.7' cy='489.5' r='0.68' fill='%23fff' opacity='0.56'/%3E%3Ccircle cx='95.5' cy='117.7' r='0.52' fill='%23fff' opacity='0.61'/%3E%3Ccircle cx='69.5' cy='482.0' r='0.68' fill='%23cfdcff' opacity='0.61'/%3E%3Ccircle cx='638.6' cy='208.4' r='0.64' fill='%23ffe6c7' opacity='0.45'/%3E%3Ccircle cx='332.4' cy='151.7' r='0.77' fill='%23fff' opacity='0.66'/%3E%3Ccircle cx='596.4' cy='374.2' r='0.89' fill='%23cfdcff' opacity='0.71'/%3E%3Ccircle cx='474.2' cy='559.6' r='0.90' fill='%23fff' opacity='0.66'/%3E%3Ccircle cx='220.9' cy='756.1' r='0.52' fill='%23fff' opacity='0.45'/%3E%3Ccircle cx='650.7' cy='682.9' r='0.83' fill='%23d9ccff' opacity='0.65'/%3E%3Ccircle cx='406.3' cy='590.2' r='0.58' fill='%23fff' opacity='0.77'/%3E%3Ccircle cx='442.0' cy='722.8' r='0.64' fill='%23fff' opacity='0.41'/%3E%3Ccircle cx='391.2' cy='466.7' r='0.81' fill='%23cfdcff' opacity='0.71'/%3E%3Ccircle cx='536.8' cy='745.5' r='0.88' fill='%23fff' opacity='0.71'/%3E%3Ccircle cx='165.9' cy='478.9' r='0.76' fill='%23cfdcff' opacity='0.60'/%3E%3C/svg%3E");
  --sp-stars-c:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1080' height='1080'%3E%3Ccircle cx='931.9' cy='705.0' r='1.29' fill='%23fff' opacity='0.67'/%3E%3Ccircle cx='616.7' cy='672.1' r='2.88' fill='%23fff' opacity='0.078'/%3E%3Ccircle cx='616.7' cy='672.1' r='0.90' fill='%23fff' opacity='0.65'/%3E%3Ccircle cx='51.1' cy='613.0' r='3.81' fill='%23cfdcff' opacity='0.107'/%3E%3Ccircle cx='51.1' cy='613.0' r='1.19' fill='%23cfdcff' opacity='0.89'/%3E%3Ccircle cx='663.8' cy='456.1' r='3.07' fill='%23cfdcff' opacity='0.080'/%3E%3Ccircle cx='663.8' cy='456.1' r='0.96' fill='%23cfdcff' opacity='0.67'/%3E%3Ccircle cx='466.7' cy='685.9' r='1.05' fill='%23fff' opacity='0.77'/%3E%3Ccircle cx='969.7' cy='1020.8' r='1.03' fill='%23fff' opacity='0.88'/%3E%3Ccircle cx='436.9' cy='678.5' r='0.83' fill='%23cfdcff' opacity='0.66'/%3E%3Ccircle cx='120.6' cy='258.9' r='3.62' fill='%23fff' opacity='0.077'/%3E%3Ccircle cx='120.6' cy='258.9' r='1.13' fill='%23fff' opacity='0.64'/%3E%3Ccircle cx='821.1' cy='331.6' r='1.11' fill='%23cfdcff' opacity='0.85'/%3E%3Ccircle cx='984.2' cy='829.8' r='4.10' fill='%23ffe6c7' opacity='0.070'/%3E%3Ccircle cx='984.2' cy='829.8' r='1.28' fill='%23ffe6c7' opacity='0.58'/%3E%3Ccircle cx='1061.8' cy='514.8' r='0.94' fill='%23fff' opacity='0.76'/%3E%3Ccircle cx='854.0' cy='10.4' r='2.75' fill='%23fff' opacity='0.096'/%3E%3Ccircle cx='854.0' cy='10.4' r='0.86' fill='%23fff' opacity='0.80'/%3E%3Ccircle cx='310.5' cy='437.7' r='3.81' fill='%23fff' opacity='0.098'/%3E%3Ccircle cx='310.5' cy='437.7' r='1.19' fill='%23fff' opacity='0.82'/%3E%3Ccircle cx='1004.8' cy='1078.0' r='1.11' fill='%23ffe6c7' opacity='0.84'/%3E%3Ccircle cx='172.4' cy='371.4' r='1.15' fill='%23fff' opacity='0.72'/%3E%3Ccircle cx='483.6' cy='595.7' r='3.62' fill='%23ffe6c7' opacity='0.071'/%3E%3Ccircle cx='483.6' cy='595.7' r='1.13' fill='%23ffe6c7' opacity='0.59'/%3E%3Ccircle cx='904.9' cy='363.3' r='4.16' fill='%23cfdcff' opacity='0.092'/%3E%3Ccircle cx='904.9' cy='363.3' r='1.30' fill='%23cfdcff' opacity='0.77'/%3E%3Ccircle cx='548.5' cy='14.2' r='3.42' fill='%23fff' opacity='0.106'/%3E%3Ccircle cx='548.5' cy='14.2' r='1.07' fill='%23fff' opacity='0.88'/%3E%3Ccircle cx='72.2' cy='686.2' r='3.26' fill='%23fff' opacity='0.072'/%3E%3Ccircle cx='72.2' cy='686.2' r='1.02' fill='%23fff' opacity='0.60'/%3E%3Ccircle cx='985.8' cy='777.6' r='1.24' fill='%23fff' opacity='0.82'/%3E%3Ccircle cx='297.2' cy='729.8' r='3.30' fill='%23cfdcff' opacity='0.066'/%3E%3Ccircle cx='297.2' cy='729.8' r='1.03' fill='%23cfdcff' opacity='0.55'/%3E%3Ccircle cx='63.2' cy='557.2' r='0.86' fill='%23fff' opacity='0.64'/%3E%3C/svg%3E");
  color-scheme:dark;
}

/* ---- base ------------------------------------------------------------------------------------------------ */
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--sp-top) + 16px);background:var(--sp-bg)}
html,body{margin:0}
body{min-height:100vh;min-height:100dvh;background:var(--sp-bg);color:var(--sp-text);font-family:var(--sp-font);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;font-feature-settings:"cv11","ss01"}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit;color:inherit;letter-spacing:inherit}
button{cursor:pointer}
img,svg{display:block;max-width:100%}
p{margin:0;text-wrap:pretty}
h1,h2,h3,h4{margin:0;font-family:var(--sp-display);font-weight:600;letter-spacing:-.02em;line-height:1.15;text-wrap:balance}
ol,ul{margin:0;padding:0}
code,kbd,samp{font-family:var(--sp-mono)}
::selection{background:rgba(139,123,255,.38);color:#fff}
:focus-visible{outline:2px solid var(--sp-accent);outline-offset:2px}
:focus:not(:focus-visible){outline:none}
html{scrollbar-color:#ffffff26 transparent;scrollbar-width:thin}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:#ffffff1f;border-radius:10px;border:3px solid transparent;background-clip:padding-box}
::-webkit-scrollbar-thumb:hover{background-color:#ffffff38}

/* ---- starfield ----------------------------------------------------------------------------------------- */
.sp-stars{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;
  background:
    radial-gradient(56% 46% at 10% 4%,rgba(139,123,255,.095),transparent 70%),
    radial-gradient(44% 40% at 96% 92%,rgba(70,208,255,.065),transparent 72%),
    radial-gradient(30% 26% at 70% 18%,rgba(255,79,139,.03),transparent 70%),
    var(--sp-stars-a) 0 0/540px 540px repeat,
    var(--sp-bg)}
.sp-stars::before,.sp-stars::after{content:"";position:absolute;inset:0;background-repeat:repeat;will-change:opacity}
.sp-stars::before{background-image:var(--sp-stars-b);background-size:760px 760px;background-position:130px 60px;animation:sp-twinkle 7s ease-in-out infinite alternate}
.sp-stars::after{background-image:var(--sp-stars-c);background-size:1080px 1080px;background-position:-240px 180px;animation:sp-twinkle 11s ease-in-out -4s infinite alternate}
@keyframes sp-twinkle{0%{opacity:1}45%{opacity:.5}70%{opacity:.85}100%{opacity:.38}}

/* ---- shell: rail --------------------------------------------------------------------------------------- */
.sp-skip{position:fixed;left:12px;top:-60px;z-index:200;padding:10px 16px;border-radius:999px;background:var(--sp-light);color:var(--sp-ink);font-weight:600;font-size:14px;transition:top .2s var(--sp-ease)}
.sp-skip:focus{top:12px}
.sp-rail{position:fixed;inset:0 auto 0 0;z-index:40;width:var(--sp-rail);display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 0 16px;border-right:1px solid var(--sp-line);background:rgba(5,6,10,.86);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.sp-rail:empty{display:none}
.sp-rail-logo{display:grid;place-items:center;width:44px;height:44px;margin-bottom:14px;border-radius:14px;transition:background .2s,transform .5s var(--sp-ease)}
.sp-rail-logo img{width:30px;height:30px;transition:transform .8s var(--sp-ease)}
.sp-rail-logo:hover img{transform:rotate(-14deg) scale(1.06)}
.sp-rail-nav{display:flex;flex-direction:column;gap:6px}
.sp-rail-link{position:relative;display:grid;place-items:center;width:44px;height:44px;border-radius:12px;color:rgba(230,235,255,.66);transition:background .2s,color .2s}
.sp-rail-link svg{width:20px;height:20px}
.sp-rail-link:hover,.sp-rail-link:focus-visible{background:var(--sp-panel-2);color:var(--sp-text)}
.sp-rail-link.active,.sp-rail-link[aria-current="page"]{background:var(--sp-panel-3);color:var(--sp-text)}
.sp-rail-link.active::before{content:"";position:absolute;left:-10px;top:12px;bottom:12px;width:3px;border-radius:0 3px 3px 0;background:var(--sp-grad)}
.sp-rail-link::after{content:attr(data-tip);position:absolute;top:50%;left:calc(100% + 12px);translate:-4px -50%;z-index:5;padding:5px 10px;border-radius:8px;background:var(--sp-light);color:var(--sp-ink);font-size:12px;font-weight:500;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .15s,translate .25s var(--sp-ease);box-shadow:0 8px 24px -8px rgba(0,0,0,.6)}
.sp-rail-link:hover::after,.sp-rail-link:focus-visible::after{opacity:1;translate:0 -50%}
.sp-rail-x{margin-top:auto}
.sp-x.is-disabled{opacity:.42;cursor:not-allowed}
.sp-x.is-disabled:hover{background:transparent;color:rgba(230,235,255,.66)}
.sp-x svg{width:17px;height:17px}

/* ---- shell: top bar ------------------------------------------------------------------------------------ */
.sp-top{position:fixed;top:0;left:var(--sp-rail);right:0;z-index:30;height:var(--sp-top);display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);grid-template-areas:"search ca actions";align-items:center;gap:16px;padding:0 20px;border-bottom:1px solid var(--sp-line);background:rgba(5,6,10,.78);-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%)}
.sp-top:empty{display:none}
.sp-top-brand{grid-area:brand;display:none;align-items:center;gap:9px;min-width:0;border-radius:10px}
.sp-top-brand img{width:30px;height:30px;flex:none}
.sp-wordmark{font-family:var(--sp-display);font-weight:600;font-size:18px;letter-spacing:-.035em;white-space:nowrap}
.sp-top .sp-search{grid-area:search;max-width:min(32vw,440px)}
.sp-ca-slot{grid-area:ca;display:flex;align-items:center;justify-content:center;min-width:0}
.sp-ca-box{display:flex;min-width:0}
.sp-top-actions{grid-area:actions;display:flex;align-items:center;justify-content:flex-end;gap:8px;min-width:0}
.sp-top-x{display:none;width:36px;height:36px;border-radius:999px;place-items:center;color:rgba(230,235,255,.75);transition:background .2s,color .2s}
.sp-top-x:hover{background:var(--sp-panel-2);color:var(--sp-text)}
.sp-top-x svg{width:17px;height:17px}

/* search */
.sp-search{position:relative;display:flex;align-items:center;gap:9px;min-width:0;height:38px;padding:0 12px;border:1px solid var(--sp-line-2);border-radius:999px;background:var(--sp-field);color:var(--sp-muted);transition:border-color .2s,background .2s,box-shadow .2s}
.sp-search:focus-within{border-color:rgba(255,255,255,.34);background:#0b0d15;box-shadow:var(--sp-ring)}
.sp-search > svg{width:16px;height:16px;flex:none}
.sp-search input{flex:1;min-width:0;height:100%;padding:0;border:0;outline:0;background:none;color:var(--sp-text);font-size:14px}
.sp-search input::placeholder{color:var(--sp-muted);opacity:1}
.sp-search input::-webkit-search-cancel-button,.sp-search input::-webkit-search-decoration{-webkit-appearance:none;appearance:none}
.sp-search .sp-kbd{flex:none}
.sp-search:focus-within .sp-kbd{opacity:0}
.sp-search-results{position:absolute;top:calc(100% + 8px);left:0;right:0;min-width:min(340px,calc(100vw - 32px));z-index:50;max-height:min(62vh,460px);overflow:auto;overscroll-behavior:contain;padding:6px;border:1px solid var(--sp-line-2);border-radius:14px;background:rgba(12,14,21,.97);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:var(--sp-shadow);animation:sp-pop .22s var(--sp-ease)}
.sp-search-item{display:flex;align-items:center;gap:11px;padding:8px 10px;border-radius:10px;color:var(--sp-text);cursor:pointer}
.sp-search-item[aria-selected="true"],.sp-search-item:hover{background:var(--sp-panel-3)}
.sp-search-text{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.3}
.sp-search-text b{font-weight:500;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sp-search-text small{font-size:12px;color:var(--sp-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sp-search-status{display:inline-flex;align-items:center;gap:6px;flex:none;font-size:12px;color:var(--sp-muted)}
.sp-search-empty{padding:14px 12px;color:var(--sp-muted);font-size:13.5px}
.sp-search-empty a{color:var(--sp-text);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(255,255,255,.3)}
.sp-search-hint{display:flex;gap:12px;padding:8px 10px 4px;margin-top:4px;border-top:1px solid var(--sp-line);font-size:11.5px;color:var(--sp-faint)}

/* contract address */
.sp-ca{display:inline-flex;align-items:center;gap:6px;max-width:100%;min-width:0;padding:6px 10px;border:0;border-radius:999px;background:none;color:var(--sp-muted);font-size:14px;white-space:nowrap;transition:background .2s,color .2s}
.sp-ca b{color:var(--sp-text);font-weight:600}
.sp-ca .sp-mono{font-size:13px;overflow:hidden;text-overflow:ellipsis}
.sp-ca svg{width:13px;height:13px;flex:none;opacity:.6}
button.sp-ca:hover{background:var(--sp-panel-2);color:var(--sp-text)}
.sp-ca.is-pending{cursor:default}

/* burn counter next to the CA (SPEC §18): desktop only, shown once something has burned (app.js unhides it) */
.sp-burn-wrap{display:none}
@media (min-width:1024px){
  .sp-burn-wrap{display:flex;align-items:center;flex:none}
  .sp-burn-wrap::before{content:"";flex:none;width:1px;height:18px;margin:0 4px 0 2px;background:var(--sp-line-2)}
}
.sp-burn{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;color:var(--sp-muted);font-size:14px;white-space:nowrap;transition:background .2s,color .2s}
.sp-burn b{color:var(--sp-text);font-weight:600;font-variant-numeric:tabular-nums}
.sp-burn-fire{font-size:13px;line-height:1}
.sp-burn:hover{background:var(--sp-panel-2);color:var(--sp-text)}

/* connected wallet (top bar) */
.sp-wallet-slot{position:relative;display:flex}
.sp-wallet-slot:empty{display:none}
.sp-wallet-btn .sp-mono{font-size:12.5px}
.sp-menu{position:absolute;top:calc(100% + 8px);right:0;z-index:60;min-width:190px;padding:6px;border:1px solid var(--sp-line-2);border-radius:14px;background:rgba(12,14,21,.98);box-shadow:var(--sp-shadow);animation:sp-pop .2s var(--sp-ease)}
.sp-menu button,.sp-menu a{display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;border:0;border-radius:9px;background:none;color:var(--sp-text);font-size:13.5px;text-align:left}
.sp-menu button:hover,.sp-menu a:hover,.sp-menu :focus-visible{background:var(--sp-panel-3)}
.sp-menu svg{width:15px;height:15px;opacity:.75}

/* ---- shell: tab bar (mobile) --------------------------------------------------------------------------- */
.sp-tabbar{display:none}
.sp-tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:0;color:var(--sp-faint);font-size:11px;font-weight:500;transition:color .2s}
.sp-tab svg{width:22px;height:22px}
.sp-tab span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.sp-tab.active,.sp-tab[aria-current="page"]{color:var(--sp-text)}
.sp-tab:focus-visible{outline-offset:-4px;border-radius:12px}

/* ---- main + containers --------------------------------------------------------------------------------- */
.sp-main{position:relative;z-index:1;display:block;min-height:100vh;min-height:100dvh;padding:var(--sp-top) 0 0 var(--sp-rail)}
.sp-main:focus{outline:none}
.sp-wrap{width:min(1120px,100% - 48px);margin-inline:auto;padding-block:clamp(28px,4.5vw,52px) 88px}
.sp-two-col{display:grid;grid-template-columns:minmax(0,1fr) minmax(290px,360px);gap:20px;align-items:start}
.sp-two-col > *{min-width:0}
.sp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,248px),1fr));gap:12px}
.sp-stack{display:flex;flex-direction:column;gap:12px}
.sp-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}

/* ---- type ---------------------------------------------------------------------------------------------- */
.sp-hero-title{font-family:var(--sp-display);font-size:clamp(40px,6.2vw,68px);font-weight:600;line-height:1.02;letter-spacing:-.04em}
.sp-panel .sp-hero-title{font-size:clamp(32px,3.1vw,40px);line-height:1.04;letter-spacing:-.035em}
.sp-page-title{font-family:var(--sp-display);font-size:clamp(32px,4.4vw,48px);font-weight:600;line-height:1.06;letter-spacing:-.035em}
.sp-section-title{font-family:var(--sp-display);font-size:clamp(22px,2.4vw,26px);font-weight:600;line-height:1.15;letter-spacing:-.025em}
.sp-sub{color:var(--sp-muted);font-size:clamp(15px,1.3vw,16.5px);line-height:1.6;max-width:62ch;text-wrap:pretty}
.sp-grad-text{background:var(--sp-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.sp-mono{font-family:var(--sp-mono);font-size:.92em;letter-spacing:0}
.sp-muted{color:var(--sp-muted)}
.sp-faint{color:var(--sp-faint)}
.sp-num{font-variant-numeric:tabular-nums}
.sp-link{color:var(--sp-text);text-decoration:underline;text-decoration-color:rgba(255,255,255,.3);text-underline-offset:3px;transition:text-decoration-color .2s}
.sp-link:hover{text-decoration-color:currentColor}
.sp-eyebrow{font-family:var(--sp-mono);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--sp-faint)}
.sp-kbd{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border:1px solid var(--sp-line-2);border-radius:6px;font-family:var(--sp-mono);font-size:11px;color:var(--sp-faint);line-height:1;transition:opacity .2s}
.sp-sr,.sp-sr-only,.sp-visually-hidden,.sr-only,.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

/* ---- surfaces ------------------------------------------------------------------------------------------ */
.sp-panel{position:relative;min-width:0;padding:clamp(18px,2.2vw,24px);border:1px solid var(--sp-line);border-radius:var(--sp-radius);background:var(--sp-panel)}
.sp-panel.is-glass{background:rgba(12,14,21,.8);-webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%)}
.sp-tile{position:relative;min-width:0;padding:14px 16px;border:1px solid var(--sp-line);border-radius:var(--sp-radius-sm);background:var(--sp-panel-2);transition:border-color .25s,background .25s,transform .5s var(--sp-ease)}
a.sp-tile:hover,button.sp-tile:hover{border-color:var(--sp-line-2);background:var(--sp-panel-3)}
button.sp-tile{width:100%;text-align:left;color:inherit}
.sp-inset{min-width:0;padding:12px 14px;border:1px solid var(--sp-line);border-radius:var(--sp-radius-sm);background:rgba(3,4,8,.55);box-shadow:inset 0 1px 0 rgba(0,0,0,.35)}
.sp-divider{height:1px;border:0;margin:16px 0;background:var(--sp-line)}

/* ---- buttons ------------------------------------------------------------------------------------------- */
.sp-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 20px;border:1px solid transparent;border-radius:999px;background:var(--sp-panel-3);color:var(--sp-text);font-family:var(--sp-font);font-size:15px;font-weight:500;line-height:1;white-space:nowrap;text-decoration:none;cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent;transition:background .2s,border-color .2s,color .2s,box-shadow .25s,transform .2s var(--sp-ease),opacity .2s}
.sp-btn:active{transform:scale(.97)}
.sp-btn svg{width:17px;height:17px;flex:none}
.sp-btn:disabled,.sp-btn[aria-disabled="true"]{opacity:.45;cursor:not-allowed;pointer-events:none}
.sp-btn-light{background:var(--sp-light);color:var(--sp-ink)}
.sp-btn-light:hover{background:rgba(255,255,255,.86)}
.sp-btn-light:focus-visible{box-shadow:0 0 0 4px rgba(139,123,255,.28)}
.sp-btn-ghost{background:rgba(5,6,10,.6);border-color:var(--sp-line-2);color:var(--sp-text)}
.sp-btn-ghost:hover{background:var(--sp-panel-2);border-color:rgba(255,255,255,.24)}
.sp-btn-vamp{background:var(--sp-race);color:#17040c;font-weight:600;box-shadow:0 10px 28px -12px rgba(255,79,139,.75)}
.sp-btn-vamp:hover{background:#ff6c9f;box-shadow:0 12px 32px -10px rgba(255,79,139,.85)}
.sp-btn-sm{height:36px;padding:0 15px;font-size:14px}
.sp-btn-sm svg{width:15px;height:15px}
.sp-btn-block{width:100%}
.sp-btn-icon{width:36px;height:36px;padding:0}
.sp-btn[aria-busy="true"]{color:transparent!important;pointer-events:none}
.sp-btn[aria-busy="true"]::after{content:"";position:absolute;inset:0;margin:auto;width:18px;height:18px;border-radius:50%;border:2px solid currentColor;border-color:rgba(10,10,10,.8) rgba(10,10,10,.8) rgba(10,10,10,.2) rgba(10,10,10,.2);animation:sp-spin .7s linear infinite}
.sp-btn-ghost[aria-busy="true"]::after,.sp-btn:not(.sp-btn-light):not(.sp-btn-vamp)[aria-busy="true"]::after{border-color:#fff #fff rgba(255,255,255,.2) rgba(255,255,255,.2)}
.sp-btn .sp-arrow{transition:transform .3s var(--sp-ease)}
.sp-btn:hover .sp-arrow{transform:translateX(3px)}

/* ---- pills, chips, dots -------------------------------------------------------------------------------- */
.sp-pill{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 13px;border:1px solid var(--sp-line-2);border-radius:999px;background:var(--sp-field);color:rgba(243,245,255,.8);font-size:13px;font-weight:500;white-space:nowrap;transition:background .2s,color .2s,border-color .2s}
button.sp-pill,a.sp-pill{cursor:pointer}
.sp-pill:hover{color:#fff;border-color:rgba(255,255,255,.26)}
.sp-pill[aria-pressed="true"],.sp-pill[aria-selected="true"],.sp-pill[aria-current="page"],.sp-pill[aria-current="true"],.sp-pill.active,.sp-pill.is-active{background:var(--sp-panel-3);color:#fff;border-color:rgba(255,255,255,.32)}
.sp-pill svg{width:14px;height:14px}
.sp-pill small,.sp-pill .sp-count{font-size:12px;color:var(--sp-faint);font-variant-numeric:tabular-nums}
.sp-chip{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border-radius:999px;background:var(--sp-panel-3);color:rgba(243,245,255,.82);font-size:12.5px;font-weight:500;line-height:1;white-space:nowrap;vertical-align:middle}
.sp-chip svg{width:13px;height:13px}
.sp-chip.is-open{background:rgba(127,184,255,.1);color:#b9d8ff}
.sp-chip.is-claimed{background:rgba(255,207,92,.1);color:#ffe2a0}
.sp-chip.is-racing{background:rgba(255,79,139,.12);color:#ffa3c2}
.sp-chip.is-reserved{background:rgba(255,180,84,.1);color:#ffd29a}
.sp-chip.is-ok{background:rgba(94,227,161,.1);color:#a6f1cb}
.sp-chip.is-err{background:rgba(255,107,107,.12);color:#ffb3b3}
.sp-chip .sp-countdown{color:inherit}
.sp-dot{display:inline-block;flex:none;width:7px;height:7px;border-radius:50%;background:var(--sp-ok)}
.sp-dot.is-open{background:var(--sp-open)}
.sp-dot.is-claimed{background:var(--sp-claimed)}
.sp-dot.is-reserved{background:var(--sp-warn)}
.sp-dot.is-ok{background:var(--sp-ok)}
.sp-dot.is-err{background:var(--sp-err)}
.sp-dot.is-racing{background:var(--sp-race);animation:sp-pulse 1.8s ease-out infinite}
@keyframes sp-pulse{0%{box-shadow:0 0 0 0 rgba(255,79,139,.6)}70%{box-shadow:0 0 0 7px rgba(255,79,139,0)}100%{box-shadow:0 0 0 0 rgba(255,79,139,0)}}
.sp-soon{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 9px;border:1px solid rgba(255,180,84,.26);border-radius:999px;background:rgba(255,180,84,.1);color:#ffcf8a;font-size:12px;font-weight:500;white-space:nowrap}
.sp-soon svg{width:12px;height:12px}
.sp-tag{display:inline-flex;align-items:center;height:20px;padding:0 7px;border-radius:6px;background:var(--sp-panel-3);color:var(--sp-muted);font-size:11px;font-weight:600;letter-spacing:.02em;white-space:nowrap}
.sp-tag.is-holder{background:rgba(255,207,92,.14);color:#ffe2a0}
.sp-tag.is-leader{background:rgba(255,79,139,.16);color:#ffa3c2}
.sp-seg{display:inline-flex;align-items:center;gap:2px;padding:3px;border:1px solid var(--sp-line-2);border-radius:999px;background:rgba(9,11,17,.86)}
.sp-seg > button,.sp-seg > a{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 13px;border:0;border-radius:999px;background:none;color:var(--sp-muted);font-size:13px;font-weight:500;white-space:nowrap;transition:background .2s,color .2s}
.sp-seg > :hover{color:var(--sp-text)}
.sp-seg > [aria-pressed="true"],.sp-seg > [aria-selected="true"],.sp-seg > [aria-current="true"],.sp-seg > .active,.sp-seg > .is-active{background:var(--sp-light);color:var(--sp-ink)}
.sp-seg svg{width:13px;height:13px}
/* An icon slot (<span data-icon>) inside a flex pill/chip/segment must not shrink: its svg's max-width:100% would collapse it to 0. */
.sp-seg [data-icon],.sp-chip [data-icon],.sp-pill [data-icon]{display:inline-flex;flex:none}

/* ---- forms --------------------------------------------------------------------------------------------- */
.sp-field{display:flex;flex-direction:column;gap:7px;min-width:0}
.sp-label{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:13.5px;font-weight:500;color:var(--sp-text)}
.sp-label small{font-weight:400;color:var(--sp-faint);font-size:12px;font-variant-numeric:tabular-nums}
.sp-hint{font-size:12.5px;color:var(--sp-muted);line-height:1.5}
.sp-hint.is-err,.sp-error{color:#ff9d9d;font-size:12.5px}
.sp-input,.sp-textarea{display:block;width:100%;height:46px;padding:0 14px;border:1px solid var(--sp-line-2);border-radius:var(--sp-radius-sm);outline:0;background:var(--sp-field);color:var(--sp-text);font-size:15px;transition:border-color .2s,background .2s,box-shadow .2s}
.sp-input::placeholder,.sp-textarea::placeholder{color:var(--sp-faint);opacity:1}
.sp-input:hover,.sp-textarea:hover{border-color:rgba(255,255,255,.22)}
.sp-input:focus,.sp-input:focus-visible,.sp-textarea:focus,.sp-textarea:focus-visible{outline:none;border-color:rgba(255,255,255,.5);background:#0b0d15;box-shadow:var(--sp-ring)}
.sp-input:disabled,.sp-textarea:disabled{opacity:.55;cursor:not-allowed}
.sp-input[aria-invalid="true"],.sp-textarea[aria-invalid="true"]{border-color:rgba(255,107,107,.7)}
.sp-textarea,textarea.sp-input{height:auto;min-height:104px;padding:12px 14px;line-height:1.55;resize:vertical}
select.sp-input{appearance:none;padding-right:38px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e6ebff' stroke-opacity='.6' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:16px}
input.sp-input[type="number"]{font-variant-numeric:tabular-nums}
.sp-affix{position:relative;display:flex;align-items:center}
.sp-affix > span,.sp-affix > b{position:absolute;left:14px;color:var(--sp-faint);font-size:15px;pointer-events:none}
.sp-affix > .sp-input{padding-left:30px}
.sp-affix > .sp-affix-end{left:auto;right:14px}
label.sp-check,.sp-check-row{display:flex;align-items:flex-start;gap:10px;font-size:13.5px;line-height:1.5;color:var(--sp-muted);cursor:pointer}
input.sp-check,.sp-check input[type="checkbox"],.sp-check-row input[type="checkbox"]{appearance:none;-webkit-appearance:none;display:grid;place-items:center;flex:none;width:20px;height:20px;margin:1px 0 0;border:1.5px solid var(--sp-line-2);border-radius:6px;background:var(--sp-field);cursor:pointer;transition:background .15s,border-color .15s}
input.sp-check:hover,.sp-check input[type="checkbox"]:hover{border-color:rgba(255,255,255,.4)}
input.sp-check:checked,.sp-check input[type="checkbox"]:checked,.sp-check-row input[type="checkbox"]:checked{background:var(--sp-light);border-color:var(--sp-light)}
input.sp-check:checked::after,.sp-check input[type="checkbox"]:checked::after,.sp-check-row input[type="checkbox"]:checked::after{content:"";width:10px;height:6px;border:solid var(--sp-ink);border-width:0 0 2px 2px;translate:0 -1px;rotate:-45deg}
input.sp-check:disabled,.sp-check input[type="checkbox"]:disabled{opacity:.5;cursor:not-allowed}
.sp-check a{color:var(--sp-text);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(255,255,255,.3)}

/* ---- motion -------------------------------------------------------------------------------------------- */
.sp-rise{animation:sp-rise .8s var(--sp-ease) both;animation-delay:calc(var(--d,0) * 70ms)}
@keyframes sp-rise{from{opacity:0;transform:translateY(14px)}}
@keyframes sp-pop{from{opacity:0;transform:translateY(-4px) scale(.985)}}
@keyframes sp-spin{to{transform:rotate(360deg)}}
@keyframes sp-fade{from{opacity:0}}
.sp-skeleton{display:block;min-height:1em;border-radius:10px;background:linear-gradient(100deg,var(--sp-panel-2) 30%,var(--sp-panel-3) 50%,var(--sp-panel-2) 70%);background-size:300% 100%;animation:sp-shimmer 1.4s linear infinite;color:transparent!important;pointer-events:none;user-select:none}
span.sp-skeleton{display:inline-block;vertical-align:middle}
@keyframes sp-shimmer{from{background-position:100% 0}to{background-position:-200% 0}}
.sp-spinner{display:inline-block;flex:none;width:16px;height:16px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:sp-spin .7s linear infinite;vertical-align:middle}

/* ---- steps bar (launch progress) ----------------------------------------------------------------------- */
.sp-steps-bar{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:8px;margin:0;padding:0;list-style:none;counter-reset:sp-sb}
.sp-steps-bar > *{position:relative;min-width:0;padding-top:12px;color:var(--sp-faint);font-size:12px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;counter-increment:sp-sb;transition:color .3s}
.sp-steps-bar > *::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;border-radius:999px;background:var(--sp-panel-3);transition:background .4s var(--sp-ease)}
.sp-steps-bar > :is(.is-done,.done,[data-state="done"]){color:var(--sp-muted)}
.sp-steps-bar > :is(.is-done,.done,[data-state="done"])::before{background:var(--sp-light)}
.sp-steps-bar > :is(.is-active,.active,.on,.is-current,[aria-current="step"],[data-state="active"]){color:var(--sp-text)}
.sp-steps-bar > :is(.is-active,.active,.on,.is-current,[aria-current="step"],[data-state="active"])::before{background:linear-gradient(90deg,#8b7bff,#46d0ff,#8b7bff);background-size:200% 100%;animation:sp-flow 1.6s linear infinite}
.sp-steps-bar > :is(.is-error,[data-state="error"]){color:#ff9d9d}
.sp-steps-bar > :is(.is-error,[data-state="error"])::before{background:var(--sp-err)}
@keyframes sp-flow{from{background-position:100% 0}to{background-position:-100% 0}}

/* ---- step cards ---------------------------------------------------------------------------------------- */
.sp-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:12px;margin:0;padding:0;list-style:none;counter-reset:sp-step}
.sp-steps > *{position:relative;display:flex;flex-direction:column;gap:6px;min-width:0;padding:20px;border:1px solid var(--sp-line);border-radius:var(--sp-radius);background:var(--sp-panel);counter-increment:sp-step;transition:border-color .3s,transform .5s var(--sp-ease)}
.sp-steps > :hover{border-color:rgba(255,255,255,.14)}
.sp-steps .sp-step-icon,.sp-steps > * > svg:first-child{display:grid;place-items:center;flex:none;width:42px;height:42px;margin-bottom:14px;padding:11px;border-radius:50%;background:var(--sp-panel-3);color:var(--sp-text)}
.sp-steps .sp-step-icon svg{width:20px;height:20px}
.sp-steps small{font-size:12px;color:var(--sp-faint);font-weight:500}
.sp-steps h3{font-size:17px;font-weight:600;letter-spacing:-.02em}
.sp-steps p{color:var(--sp-muted);font-size:14px;line-height:1.55}
.sp-steps > .is-done{border-color:rgba(94,227,161,.24)}
.sp-steps > .is-done .sp-step-icon{background:rgba(94,227,161,.14);color:var(--sp-ok)}
.sp-steps > .is-done small{color:var(--sp-ok)}
.sp-steps.is-vamp .sp-step-icon{background:rgba(255,79,139,.12);color:#ff8fb3}

/* ---- modal --------------------------------------------------------------------------------------------- */
html.sp-modal-open{overflow:hidden}
.sp-modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:16px;background:rgba(2,3,6,.68);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);animation:sp-fade .2s ease both}
.sp-modal-card{position:relative;width:min(100%,420px);max-height:calc(100dvh - 32px);overflow:auto;overscroll-behavior:contain;padding:26px 24px 22px;border:1px solid var(--sp-line-2);border-radius:20px;background:var(--sp-panel);box-shadow:var(--sp-shadow),0 0 0 1px rgba(0,0,0,.4);animation:sp-modal-in .35s var(--sp-ease) both}
.sp-modal-card:focus{outline:none}
.sp-modal-card::before{content:"";position:absolute;inset:0 0 auto;height:120px;border-radius:20px 20px 0 0;background:radial-gradient(80% 100% at 50% 0,rgba(139,123,255,.12),transparent 70%);pointer-events:none}
.sp-modal-card h2{font-size:22px;letter-spacing:-.03em;padding-right:36px}
.sp-modal-card .sp-sub{margin-top:6px;font-size:14.5px}
.sp-modal-x{position:absolute;top:14px;right:14px;z-index:1;display:grid;place-items:center;width:34px;height:34px;border:0;border-radius:999px;background:var(--sp-panel-2);color:var(--sp-muted);transition:background .2s,color .2s}
.sp-modal-x:hover{background:var(--sp-panel-3);color:var(--sp-text)}
.sp-modal-x svg{width:16px;height:16px}
.sp-modal.is-closing{animation:sp-fade .18s ease reverse both}
.sp-modal.is-closing .sp-modal-card{animation:sp-modal-out .18s ease both}
@keyframes sp-modal-in{from{opacity:0;transform:translateY(12px) scale(.97)}}
@keyframes sp-modal-out{to{opacity:0;transform:translateY(8px) scale(.98)}}
.sp-modal-actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:18px}
.sp-modal-msg{margin-top:12px;font-size:13px;color:var(--sp-muted);min-height:1em}
.sp-modal-msg:empty{display:none}
.sp-modal-msg.is-err{color:#ff9d9d}
.sp-wallet-list{display:flex;flex-direction:column;gap:8px;margin-top:18px}
.sp-wallet-opt{display:flex;align-items:center;gap:12px;width:100%;padding:10px 14px 10px 10px;border:1px solid var(--sp-line);border-radius:14px;background:var(--sp-panel-2);color:var(--sp-text);text-align:left;transition:border-color .2s,background .2s}
.sp-wallet-opt:hover{border-color:var(--sp-line-2);background:var(--sp-panel-3)}
.sp-wallet-opt > span:nth-child(2){flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.3}
.sp-wallet-opt b{font-weight:500;font-size:15px}
.sp-wallet-opt small{font-size:12px;color:var(--sp-faint)}
.sp-wallet-opt > svg{width:16px;height:16px;color:var(--sp-faint);transition:transform .3s var(--sp-ease)}
.sp-wallet-opt:hover > svg{transform:translateX(3px);color:var(--sp-text)}
.sp-wallet-opt[aria-busy="true"] > svg{display:none}
.sp-wallet-opt[aria-busy="true"]::after{content:"";width:16px;height:16px;border-radius:50%;border:2px solid var(--sp-muted);border-right-color:transparent;animation:sp-spin .7s linear infinite}
.sp-wallet-ico{display:grid;place-items:center;flex:none;width:38px;height:38px;border-radius:11px;background:hsl(var(--h,250) 70% 62% / .18);color:hsl(var(--h,250) 90% 80%);font-family:var(--sp-display);font-weight:700;font-size:17px}
.sp-wallet-ico img{width:100%;height:100%;border-radius:inherit}
.sp-wallet-none{margin-top:18px;font-size:14px;line-height:1.6;color:var(--sp-muted)}
.sp-wallet-get{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}

/* ---- toast --------------------------------------------------------------------------------------------- */
.sp-toast{position:fixed;left:50%;bottom:24px;z-index:110;display:flex;align-items:center;gap:9px;max-width:min(460px,calc(100vw - 32px));padding:11px 16px;border:1px solid var(--sp-line-2);border-radius:14px;background:rgba(26,30,44,.97);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:var(--sp-shadow);color:var(--sp-text);font-size:13.5px;font-weight:500;line-height:1.4;opacity:0;transform:translate(-50%,16px);pointer-events:none;transition:opacity .25s,transform .4s var(--sp-ease)}
.sp-toast.is-show{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.sp-toast svg{width:16px;height:16px;flex:none}
.sp-toast.is-ok svg{color:var(--sp-ok)}
.sp-toast.is-err{border-color:rgba(255,107,107,.45);color:#ffd4d4}
.sp-toast.is-err svg{color:var(--sp-err)}

/* ---- accordion ----------------------------------------------------------------------------------------- */
.sp-accordion{display:flex;flex-direction:column;gap:8px}
.sp-accordion > details,details.sp-accordion{border:1px solid var(--sp-line);border-radius:var(--sp-radius-sm);background:var(--sp-panel-2);transition:border-color .25s,background .25s}
.sp-accordion > details:hover,details.sp-accordion:hover{border-color:rgba(255,255,255,.12)}
.sp-accordion > details[open],details.sp-accordion[open]{border-color:var(--sp-line-2);background:#141827}
.sp-accordion summary{position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 16px;border-radius:var(--sp-radius-sm);font-size:15px;font-weight:500;line-height:1.4;list-style:none;cursor:pointer;user-select:none}
.sp-accordion summary::-webkit-details-marker{display:none}
.sp-accordion summary::marker{content:""}
.sp-accordion summary::after{content:"";flex:none;width:14px;height:14px;opacity:.65;background:linear-gradient(currentColor,currentColor) center/14px 1.5px no-repeat,linear-gradient(currentColor,currentColor) center/1.5px 14px no-repeat;transition:background-size .3s var(--sp-ease),opacity .2s,rotate .3s var(--sp-ease)}
.sp-accordion details[open] > summary::after,details.sp-accordion[open] > summary::after{background-size:14px 1.5px,1.5px 0;opacity:1;rotate:180deg}
.sp-accordion summary:hover::after{opacity:1}
.sp-accordion summary:focus-visible{outline-offset:-2px}
.sp-accordion details > :not(summary),details.sp-accordion > :not(summary){padding:0 16px 16px;color:var(--sp-muted);font-size:14px;line-height:1.65}
.sp-accordion details p + p{margin-top:10px}
.sp-accordion details a{color:var(--sp-text);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(255,255,255,.3)}
.sp-accordion details b,.sp-accordion details strong{color:var(--sp-text);font-weight:500}
@supports (interpolate-size:allow-keywords){
  .sp-accordion > details,details.sp-accordion{interpolate-size:allow-keywords}
  .sp-accordion > details::details-content,details.sp-accordion::details-content{height:0;overflow:clip;transition:height .35s var(--sp-ease),content-visibility .35s allow-discrete}
  .sp-accordion > details[open]::details-content,details.sp-accordion[open]::details-content{height:auto}
}

/* ---- cards & rows -------------------------------------------------------------------------------------- */
.sp-world-card{position:relative;isolation:isolate;display:flex;flex-direction:column;gap:12px;min-width:0;padding:16px;border:1px solid var(--sp-line);border-radius:var(--sp-radius);background:var(--sp-panel);color:inherit;overflow:hidden;transition:border-color .3s,background .3s,transform .5s var(--sp-ease),box-shadow .4s}
.sp-world-card::before{content:"";position:absolute;inset:-1px -1px auto;z-index:-1;height:110px;background:radial-gradient(70% 100% at 20% 0,var(--glow,rgba(139,123,255,.14)),transparent 72%);opacity:0;transition:opacity .4s}
a.sp-world-card:hover,button.sp-world-card:hover{border-color:rgba(255,255,255,.16);background:#0e1119;transform:translateY(-2px);box-shadow:0 18px 40px -24px rgba(0,0,0,.9)}
.sp-world-card:hover::before{opacity:1}
.sp-world-card.is-racing{border-color:rgba(255,79,139,.26);--glow:rgba(255,79,139,.14)}
.sp-world-card.is-claimed{--glow:rgba(255,207,92,.1)}
.sp-world-card h3{font-size:17px;letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sp-lb-row{position:relative;display:flex;align-items:center;gap:14px;min-width:0;min-height:68px;padding:12px 16px;border:1px solid var(--sp-line);border-radius:14px;background:var(--sp-panel);color:inherit;transition:border-color .25s,background .25s}
.sp-lb-row + .sp-lb-row{margin-top:8px}
a.sp-lb-row:hover{border-color:var(--sp-line-2);background:var(--sp-panel-2)}
.sp-lb-row > *{flex:none;min-width:0}
.sp-lb-row > div,.sp-lb-row > .sp-lb-main,.sp-lb-row > .grow{flex:1 1 0}
.sp-lb-row > .sp-lb-mass{flex:0 0 auto;text-align:right}
.sp-lb-row b,.sp-lb-row strong{font-weight:500}
.sp-lb-row > svg:last-child{width:16px;height:16px;color:var(--sp-faint);transition:transform .3s var(--sp-ease),color .2s}
a.sp-lb-row:hover > svg:last-child{transform:translateX(3px);color:var(--sp-text)}
.sp-lb-row.is-holder{border-color:rgba(255,207,92,.2)}
.sp-lb-row.is-leader{border-color:rgba(255,79,139,.28)}
.sp-rank{display:inline-grid;place-items:center;flex:none;width:32px;height:32px;border-radius:50%;background:var(--sp-panel-3);color:rgba(243,245,255,.72);font-size:12px;font-weight:500;font-variant-numeric:tabular-nums;line-height:1}
.sp-rank.is-top,.sp-rank.top,.sp-rank[data-rank="1"],.sp-rank[data-rank="2"],.sp-rank[data-rank="3"]{background:var(--sp-light);color:var(--sp-ink);font-weight:600}
.sp-countdown{font-variant-numeric:tabular-nums;font-feature-settings:"tnum";white-space:nowrap}
.sp-bar{position:relative;display:block;height:8px;border-radius:999px;background:var(--sp-panel-3);overflow:hidden}
.sp-bar > *,.sp-bar:empty::before{content:"";display:block;height:100%;width:var(--w,var(--p,0%));max-width:100%;border-radius:inherit;background:linear-gradient(90deg,#c43a6c,var(--sp-race));transition:width .8s var(--sp-ease)}
.sp-bar.is-holder > *,.sp-bar.is-holder:empty::before{background:linear-gradient(90deg,#c99a2e,var(--sp-claimed))}
.sp-bar.is-leader > *,.sp-bar.is-leader:empty::before{background:linear-gradient(90deg,var(--sp-race),#ff9ec0);box-shadow:0 0 12px rgba(255,79,139,.55)}
.sp-bar.is-muted > *,.sp-bar.is-muted:empty::before{background:rgba(230,235,255,.3)}
.sp-kv{display:grid;grid-template-columns:auto minmax(0,1fr);gap:9px 16px;margin:0;font-size:14px;align-items:baseline}
.sp-kv > dt,.sp-kv > span:nth-child(odd){color:var(--sp-muted)}
.sp-kv > dd,.sp-kv > span:nth-child(even),.sp-kv > b{margin:0;text-align:right;color:var(--sp-text);min-width:0;overflow-wrap:anywhere;font-weight:500}
.sp-kv > div{grid-column:1/-1;display:flex;justify-content:space-between;align-items:baseline;gap:16px;min-width:0}
.sp-kv > div > :first-child{color:var(--sp-muted);flex:none}
.sp-kv > div > :last-child{text-align:right;min-width:0;overflow-wrap:anywhere;font-weight:500}

/* ---- bits: swatch, coin image, copy, empty, banner ----------------------------------------------------- */
.sp-swatch{--s:40px;position:relative;isolation:isolate;display:inline-block;flex:none;width:var(--s);height:var(--s);vertical-align:middle}
.sp-swatch::after{content:"";position:absolute;inset:0;z-index:1;border-radius:50%;
  background:radial-gradient(circle at 34% 30%,rgba(255,255,255,.5),rgba(255,255,255,0) 38%),radial-gradient(circle at 42% 40%,var(--c2,#9aa4c7),var(--c1,#5b6384) 62%);
  box-shadow:inset calc(var(--s) * -.2) calc(var(--s) * -.14) calc(var(--s) * .26) rgba(0,0,0,.72),0 0 0 1px rgba(255,255,255,.06)}
.sp-swatch.is-banded::after{background:radial-gradient(circle at 34% 30%,rgba(255,255,255,.42),rgba(255,255,255,0) 40%),repeating-linear-gradient(172deg,var(--c1) 0 11%,var(--c2) 11% 17%,var(--c1) 17% 24%,color-mix(in srgb,var(--c2) 60%,var(--c1)) 24% 31%)}
.sp-swatch.is-star::after,.sp-swatch.is-brown-dwarf::after{background:radial-gradient(circle at 50% 50%,#fff 0,var(--c2,#fff3c4) 26%,var(--c1,#ffcc55) 56%,color-mix(in srgb,var(--c1,#ffcc55) 70%,#000) 100%);box-shadow:0 0 calc(var(--s) * .32) calc(var(--s) * .02) color-mix(in srgb,var(--c1,#ffcc55) 70%,transparent),inset 0 0 calc(var(--s) * .12) rgba(255,255,255,.4)}
.sp-swatch.is-brown-dwarf::after{background:radial-gradient(circle at 42% 40%,var(--c2),var(--c1) 60%,#1a0705 100%);box-shadow:0 0 calc(var(--s) * .22) color-mix(in srgb,var(--c1) 55%,transparent),inset calc(var(--s) * -.12) calc(var(--s) * -.1) calc(var(--s) * .2) rgba(0,0,0,.6)}
.sp-swatch.is-asteroid::after{border-radius:46% 54% 42% 58%/55% 44% 56% 45%;transform:rotate(-18deg) scale(.86,.74)}
.sp-swatch.is-comet::after{inset:22% 22% 22% 22%}
.sp-swatch.is-comet::before{content:"";position:absolute;z-index:0;top:44%;left:-6%;width:70%;height:12%;border-radius:999px;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--c2,#bfe8ff) 80%,transparent));transform:rotate(-24deg);transform-origin:right center;filter:blur(.5px)}
.sp-swatch.has-rings::before,.sp-swatch.has-rings > i{content:"";position:absolute;left:-30%;width:160%;top:50%;height:36%;border-radius:50%;border:max(1.5px,calc(var(--s) * .055)) solid color-mix(in srgb,var(--c2,#e8d9b0) 80%,transparent);transform:translateY(-50%) rotate(-20deg);pointer-events:none}
.sp-swatch.has-rings::before{z-index:0}
.sp-swatch.has-rings > i{z-index:2;border-top-color:transparent;border-left-color:transparent;border-right-color:transparent}
.sp-coinimg{--s:40px;position:relative;display:inline-grid;place-items:center;flex:none;width:var(--s);height:var(--s);border-radius:28%;overflow:hidden;vertical-align:middle;background:linear-gradient(135deg,hsl(var(--h,250) 60% 38%),hsl(calc(var(--h,250) + 40) 70% 26%));box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
.sp-coinimg::before{content:attr(data-mono);color:#fff;font-family:var(--sp-display);font-weight:600;font-size:calc(var(--s) * .36);letter-spacing:-.02em}
.sp-coinimg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:var(--sp-panel-3)}
.sp-copy{display:inline-flex;align-items:center;gap:6px;max-width:100%;padding:2px 4px;margin:-2px -4px;border:0;border-radius:6px;background:none;color:var(--sp-muted);font-family:var(--sp-mono);font-size:12.5px;cursor:pointer;transition:color .2s,background .2s}
.sp-copy:hover{color:var(--sp-text);background:var(--sp-panel-2)}
.sp-copy svg{width:13px;height:13px;flex:none;opacity:.7}
.sp-empty{display:flex;flex-direction:column;align-items:center;gap:8px;padding:44px 20px;border:1px dashed var(--sp-line-2);border-radius:var(--sp-radius);color:var(--sp-muted);text-align:center;font-size:14px}
.sp-empty b,.sp-empty strong{color:var(--sp-text);font-size:16px;font-weight:600;font-family:var(--sp-display);letter-spacing:-.015em}
.sp-empty .sp-btn{margin-top:8px}
.sp-banner{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;border:1px solid rgba(255,180,84,.3);border-radius:var(--sp-radius-sm);background:rgba(255,180,84,.06);font-size:13.5px;line-height:1.5}
.sp-banner > svg{width:18px;height:18px;flex:none;margin-top:1px;color:var(--sp-warn)}
.sp-banner.is-ok{border-color:rgba(94,227,161,.3);background:rgba(94,227,161,.06)}
.sp-banner.is-ok > svg{color:var(--sp-ok)}
.sp-banner.is-err{border-color:rgba(255,107,107,.38);background:rgba(255,107,107,.07)}
.sp-banner.is-err > svg{color:var(--sp-err)}
.sp-banner.is-info{border-color:rgba(139,123,255,.32);background:rgba(139,123,255,.07)}
.sp-banner.is-info > svg{color:var(--sp-accent)}
.sp-list-dots{display:flex;flex-direction:column;gap:10px;margin:0;padding:0;list-style:none}
.sp-list-dots li{position:relative;padding-left:17px;color:var(--sp-muted);font-size:14px;line-height:1.55}
.sp-list-dots li::before{content:"";position:absolute;left:0;top:.55em;width:7px;height:7px;border-radius:50%;background:var(--sp-ok)}
.sp-back{display:inline-flex;align-items:center;gap:4px;color:var(--sp-muted);font-size:14px;transition:color .2s}
.sp-back:hover{color:var(--sp-text)}
.sp-back svg{width:16px;height:16px}

/* ---- responsive ---------------------------------------------------------------------------------------- */
@media (max-width:1100px){
  .sp-top{gap:12px;padding:0 16px}
}
@media (max-width:960px){
  .sp-two-col{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:768px){
  :root{--sp-rail:0px;--sp-top:116px}
  .sp-rail{display:none}
  .sp-top{left:0;grid-template-columns:auto minmax(0,1fr) auto;grid-template-rows:44px 44px;grid-template-areas:"brand ca actions" "search search search";row-gap:8px;column-gap:6px;padding:8px 16px 12px;padding-left:max(16px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}
  .sp-top-brand{display:flex}
  .sp-top .sp-search{max-width:none;height:44px;padding:0 14px}
  .sp-top .sp-kbd{display:none}
  .sp-top-actions{gap:2px}
  .sp-ca-slot{justify-content:flex-end}
  .sp-ca{padding:6px 8px}
  .sp-top-x{display:grid}
  .sp-find,.sp-wallet-slot{display:none!important}
  .sp-search-results{position:fixed;top:calc(var(--sp-top) - 4px);left:16px;right:16px;max-height:calc(100dvh - var(--sp-top) - var(--sp-tabbar) - 16px)}
  .sp-search-hint{display:none}
  .sp-tabbar{position:fixed;left:0;right:0;bottom:0;z-index:40;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));height:var(--sp-tabbar);padding:0 6px env(safe-area-inset-bottom,0px);border-top:1px solid var(--sp-line);background:rgba(5,6,10,.9);-webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%)}
  .sp-tabbar:empty{display:none}
  .sp-main{padding:var(--sp-top) 0 var(--sp-tabbar)}
  .sp-wrap{width:min(1120px,100% - 32px);padding-bottom:48px}
  .sp-toast{bottom:calc(var(--sp-tabbar) + 12px)}
  .sp-modal{place-items:end center;padding:0}
  .sp-modal-card{width:100%;max-height:calc(100dvh - 24px);border-radius:22px 22px 0 0;padding-bottom:calc(22px + env(safe-area-inset-bottom,0px));animation-name:sp-sheet-in}
  .sp-modal.is-closing .sp-modal-card{animation-name:sp-sheet-out}
  .sp-lb-row{gap:10px;padding:10px 12px}
}
@keyframes sp-sheet-in{from{transform:translateY(100%)}}
@keyframes sp-sheet-out{to{transform:translateY(100%)}}
@media (max-width:420px){
  .sp-wordmark{display:none}
  .sp-btn{padding:0 16px}
  .sp-steps-bar{gap:5px}
  .sp-steps-bar > *{font-size:11px}
}
@media (hover:none){
  .sp-rail-link::after{display:none}
}

/* ---- reduced motion ------------------------------------------------------------------------------------ */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .sp-stars::before,.sp-stars::after{animation:none}
  .sp-rise,.sp-skeleton,.sp-dot.is-racing,.sp-search-results,.sp-menu,.sp-modal,.sp-modal-card,.sp-steps-bar > *::before{animation:none!important}
  .sp-spinner,.sp-btn[aria-busy="true"]::after,.sp-wallet-opt[aria-busy="true"]::after{animation-duration:1.6s}
  *,*::before,*::after{transition-duration:.01ms!important}
  .sp-accordion > details::details-content,details.sp-accordion::details-content{transition:none}
  .sp-world-card:hover,a.sp-world-card:hover{transform:none}
}

/* Touch screens: small standalone links and copy buttons get a ~40px-tall tap area without changing the layout
   (WCAG 2.2 target size). Cards and leaderboard rows are already whole-card links. */
@media (pointer:coarse){
  :is(.sp-back,.sp-copy,.ex-pump,.bp-link,.bp-entrant-name a,.adm-ext,.hm-more,.hiw-foot a){position:relative}
  :is(.sp-back,.sp-copy,.ex-pump,.bp-link,.bp-entrant-name a,.adm-ext,.hm-more,.hiw-foot a)::after{content:"";position:absolute;inset:-10px -6px}
}
