/* Grimkin · The Underforge
   The page floats inside a painted cave (cave-world.js). This sheet keeps the
   content legible over it: text sits on the rock with shadow, and anything you
   interact with is a carved tablet with pixel-cut corners. */

/* Display: Cave Stone. Text: Morgeon Hermes. Labels: IBM Plex Mono.
   Both display fonts are free-for-personal-use downloads (licenses in ../font-licenses/):
   this styling is a design preview until commercial licenses are bought. The free Morgeon Hermes
   draws a watermark in place of every digit, so for the preview its faces skip U+0030-0039 and
   digits fall back to Space Grotesk. The licensed version has real digits: delete both
   unicode-range lines once it is installed. */
@font-face{font-family:'Cave Stone';src:url(fonts/Cave-Stone.ttf) format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Morgeon Hermes';src:url(fonts/MorgeonHermes-Regular.ttf) format('truetype');font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0000-002F,U+003A-10FFFF}
@font-face{font-family:'Morgeon Hermes';src:url(fonts/MorgeonHermes-Bold.ttf) format('truetype');font-weight:700;font-style:normal;font-display:swap;unicode-range:U+0000-002F,U+003A-10FFFF}

:root{
 color-scheme:dark;
 --ink:#0b0919;--tablet:rgba(15,12,27,.88);--tablet-solid:#130f22;--tablet-hi:rgba(24,20,42,.94);
 --line:rgba(176,164,232,.14);--line-strong:rgba(176,164,232,.28);
 --text:#ece8f6;--muted:#aaa4c0;--dim:#7d7798;
 --mint:#c4f692;--mint-deep:#45602f;--lamp:#f0b566;--crimson:#e2406a;
 --display:'Cave Stone','Space Grotesk',Impact,sans-serif;--body:'Morgeon Hermes','Space Grotesk',system-ui,sans-serif;--mono:'IBM Plex Mono',ui-monospace,monospace;
 --cut:polygon(6px 0,calc(100% - 6px) 0,100% 6px,100% calc(100% - 6px),calc(100% - 6px) 100%,6px 100%,0 calc(100% - 6px),0 6px);
 --cut-sm:polygon(4px 0,calc(100% - 4px) 0,100% 4px,100% calc(100% - 4px),calc(100% - 4px) 100%,4px 100%,0 calc(100% - 4px),0 4px);
 --ease:cubic-bezier(.16,1,.3,1);
}
*{box-sizing:border-box}
html{scroll-behavior:auto}
body{margin:0;background:var(--ink);color:var(--text);font:17px/1.6 var(--body);font-synthesis:none;-webkit-font-smoothing:antialiased;overflow-x:hidden}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}
button:disabled{opacity:.42;cursor:not-allowed}
:focus-visible{outline:2px solid var(--mint);outline-offset:3px}
img{max-width:100%}
[hidden]{display:none!important}
/* Copy for the stage the build exported; pre-reveal wording is the default until the data says otherwise. */
body:not([data-reveal="revealed"]) .when-revealed,body[data-reveal="revealed"] .when-pre{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
h1,h2,h3{margin:0;font-weight:700}

/* ---- the cave behind everything ---------------------------------------------- */
.world{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:#07060c}
.world canvas{display:block;image-rendering:pixelated;will-change:transform}
body::before{content:'';position:fixed;inset:0;z-index:1;pointer-events:none;background:radial-gradient(130% 100% at 50% 40%,transparent 55%,rgba(5,4,10,.55) 100%)}
.topbar,.notice,main,.depth-rail{position:relative;z-index:2}

/* ---- top bar -------------------------------------------------------------------- */
.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:28px;height:74px;padding:0 clamp(16px,3vw,40px);background:linear-gradient(180deg,rgba(9,7,18,.94),rgba(9,7,18,.78));border-bottom:1px solid var(--line);backdrop-filter:blur(8px)}
.brand{display:flex;align-items:center;gap:10px;color:var(--text);text-decoration:none;font:400 20px var(--display);letter-spacing:.04em}
.brand small{font:500 11px var(--mono);letter-spacing:.14em;color:var(--dim);border-left:1px solid var(--line);padding-left:10px;line-height:1.3;max-width:84px}
.crest{width:20px;height:15px;background:var(--mint);clip-path:polygon(0 100%,0 26%,24% 58%,50% 0,76% 58%,100% 26%,100% 100%)}
.topbar nav{display:flex;gap:4px;margin:0 auto;height:100%}
.nav{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:2px;padding:0 14px;height:100%;color:var(--muted);font:500 15px var(--body);border-bottom:2px solid transparent;transition:color .2s}
.nav small{font:500 11px var(--mono);letter-spacing:.14em;color:var(--dim)}
.nav:hover{color:var(--text)}
.nav.active{color:var(--text);border-color:var(--lamp)}
.nav.active small{color:var(--lamp)}
.top-actions{display:flex;align-items:center;gap:10px}
.icon-button{display:grid;place-items:center;width:38px;height:38px;color:var(--muted);border:1px solid var(--line-strong);clip-path:var(--cut-sm)}
.icon-button:hover{color:var(--text)}
.icon-button svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round}
.icon-button .spk{fill:currentColor;stroke:none}
.icon-button[aria-pressed="false"] .wave,.icon-button[aria-pressed="true"] .mute{display:none}
.icon-button[aria-pressed="true"]{color:var(--lamp);border-color:rgba(240,181,102,.5)}
.notice{display:flex;align-items:center;gap:10px;padding:9px clamp(16px,3vw,40px);font:500 12px var(--mono);letter-spacing:.06em;color:var(--mint);background:rgba(10,8,20,.72);border-bottom:1px solid var(--line)}
.notice span:not(.dot){color:var(--muted)}
.notice button{margin-left:auto;color:var(--text);font:500 12px var(--mono);letter-spacing:.06em;text-decoration:underline;text-underline-offset:3px}
.dot{width:6px;height:6px;background:var(--mint);flex:none;box-shadow:0 0 0 2px rgba(196,246,146,.18)}

.nav,.primary,.ghost,.link,.notice b,.chip,.page{white-space:nowrap}
@media(max-width:1180px){.brand small{display:none}.nav{padding:0 10px}.topbar{gap:16px}}
@media(max-width:900px){.notice{flex-wrap:wrap}.notice span:not(.dot){width:100%;order:3}}

/* The wordmark matches the Grimkin banner: lavender letters, lighter upper half, hard pixel shadow. */
.brand>span:not(.crest){background:linear-gradient(#d6c4ff 0 52%,#ac8ce6 52% 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(2px 2px 0 #060006)}
.crest{background:#ac8ce6;filter:drop-shadow(2px 2px 0 #060006)}

/* ---- buttons --------------------------------------------------------------------- */
.primary{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 22px;background:var(--mint);color:#16210f;font:700 16px var(--body);letter-spacing:.02em;clip-path:var(--cut-sm);box-shadow:inset 0 -3px 0 rgba(30,50,20,.35),inset 0 1px 0 rgba(255,255,255,.45);transition:filter .2s,transform .12s}
.primary:hover:not(:disabled){filter:brightness(1.08)}
.primary:active:not(:disabled){transform:translateY(1px)}
.ghost{display:inline-flex;align-items:center;justify-content:center;padding:12px 18px;color:var(--text);font:600 15px var(--body);border:1px solid var(--line-strong);clip-path:var(--cut-sm);background:rgba(15,12,27,.5);transition:border-color .2s,background .2s}
.ghost:hover:not(:disabled){border-color:var(--lamp);background:rgba(240,181,102,.08)}
.link{color:var(--mint);font:600 15px var(--body);padding:10px 0;text-decoration:underline;text-decoration-color:rgba(196,246,146,.35);text-underline-offset:4px}
.link:hover:not(:disabled){text-decoration-color:var(--mint)}
.full{width:100%}

/* ---- tablets: anything you touch is carved stone ----------------------------------- */
.tablet,.ability,.token-card,.route,.choice,.chip,.filters,.tier-table,.stat-row,.send-off,.ladder li{
 background:linear-gradient(180deg,rgba(255,255,255,.03),transparent 40%),var(--tablet);
 box-shadow:inset 0 0 0 1px var(--line),inset 0 1px 0 rgba(255,255,255,.06);
 clip-path:var(--cut)}

/* ---- layout + type ------------------------------------------------------------------ */
main{max-width:1180px;margin:0 auto;padding:0 clamp(16px,3vw,32px)}
.eyebrow,.station-tag,.panel-label,.cave-top,.route-label{font:500 12px var(--mono);letter-spacing:.14em;color:var(--muted)}
.lede{font-size:20px;line-height:1.65;color:#d3cee3;max-width:48ch;margin:18px 0 0;text-shadow:0 1px 12px rgba(5,4,10,.95),0 0 2px rgba(5,4,10,.9)}
h1{font:400 clamp(42px,5.8vw,84px)/1 var(--display);letter-spacing:.005em;text-shadow:0 3px 0 rgba(5,4,10,.8),0 0 40px rgba(5,4,10,.7)}
h1 em{font-style:normal;color:var(--mint)}
h2{font:400 clamp(30px,3.6vw,50px)/1.05 var(--display);letter-spacing:.005em;text-shadow:0 2px 0 rgba(5,4,10,.8),0 0 30px rgba(5,4,10,.8)}
h3{font:700 20px/1.3 var(--body)}

/* ---- the surface: copy over the night sky, the mine mouth below ----------------------- */
.hero{position:relative;min-height:calc(100svh - 116px);padding:clamp(48px,11vh,120px) 0 0}
.hero>:not(.scroll-hint){max-width:640px}
.hero .eyebrow{color:#c9c2e0;text-shadow:0 1px 8px rgba(5,4,10,.9)}
.hero h1{margin-top:18px}
.cta-row{display:flex;align-items:center;gap:22px;margin-top:30px}
.scroll-hint{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;margin:0;font:500 11px var(--mono);letter-spacing:.2em;color:#d9d3ee;text-transform:uppercase;text-shadow:0 1px 6px #000;width:max-content}
.scroll-hint span{width:1px;height:36px;background:linear-gradient(var(--lamp),transparent);animation:hint 2.2s var(--ease) infinite}
@keyframes hint{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* ---- stations: content you pass on the way down -------------------------------------- */
.station{margin-top:clamp(140px,30vh,300px)}
.station-tag{display:flex;align-items:center;gap:9px;margin:0 0 16px;color:#cfc8e4;text-shadow:0 1px 6px #000}
.station-tag i{width:7px;height:7px;background:var(--lamp);box-shadow:0 0 0 2px rgba(240,181,102,.2);animation:flicker 3.4s infinite}
.station-tag b{color:var(--lamp);font-weight:600;min-width:4ch}
@keyframes flicker{0%,100%{opacity:1}44%{opacity:.55}48%{opacity:.95}73%{opacity:.6}}
.station-copy{max-width:640px}
.station-copy p{color:#d3cee3;margin:14px 0 0;max-width:58ch;text-shadow:0 1px 10px rgba(5,4,10,.95),0 0 2px rgba(5,4,10,.9)}

.ability-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(172px,1fr));gap:10px;margin-top:32px}
.ability{padding:10px;text-align:left;cursor:pointer;transition:transform .3s var(--ease),box-shadow .3s}
.ability:hover,.ability:focus-visible{transform:translateY(-3px);box-shadow:inset 0 0 0 1px rgba(240,181,102,.55),inset 0 1px 0 rgba(255,255,255,.08)}
.ability:first-child{grid-column:span 2;display:grid;grid-template-columns:1fr 1fr;gap:12px;align-content:start;align-self:start}
.ability:first-child img{grid-row:span 5}
.ability img{display:block;width:100%;image-rendering:pixelated;margin-bottom:10px}
.ability small{font:500 11px var(--mono);letter-spacing:.12em;color:var(--dim)}
.ability h3{margin:4px 0 6px;font-size:17px}
.ability b{display:block;font:500 12px var(--mono);letter-spacing:.06em;color:var(--mint)}
.ability p{margin:6px 0 0;font-size:14px;line-height:1.6;color:var(--muted)}

.ledge-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px;align-items:end}
.hero-strip{display:grid;grid-template-columns:repeat(4,96px);gap:8px}
.hero-strip img{display:block;width:100%;image-rendering:pixelated;clip-path:var(--cut-sm);box-shadow:inset 0 0 0 1px var(--line)}
.stat-row{display:grid;grid-template-columns:repeat(4,1fr);margin:26px 0 0;padding:22px 26px}
.stat-row div+div{border-left:1px solid var(--line);padding-left:22px}
.stat-row dt{font:500 11px var(--mono);letter-spacing:.14em;color:var(--muted);text-transform:uppercase}
.stat-row dd{margin:6px 0 0;font:400 38px/1 var(--display);color:var(--text)}

.tier-table{display:grid;grid-template-columns:130px 90px 76px 70px minmax(0,1fr);margin-top:28px;padding:8px 22px 14px}
.tier-table .th{font:500 11px var(--mono);letter-spacing:.14em;color:var(--dim);padding:12px 10px 10px 0}
.tier-table .td{padding:14px 10px 14px 0;border-top:1px solid var(--line);font-size:15px;color:var(--muted)}
.tier-table .td:nth-child(5n+1){color:var(--text);font-weight:600}
.tier-common{--tier:#a19bb5}.tier-uncommon{--tier:#8fd27a}.tier-rare{--tier:#6ab8d2}.tier-epic{--tier:#b48ae6}.tier-legendary{--tier:#f0b566}
[class*="tier-"]{border-left:3px solid var(--tier,transparent);padding-left:10px!important}

.ladder{list-style:none;margin:28px 0 0;padding:0;display:grid;gap:10px}
.ladder li{display:grid;grid-template-columns:72px minmax(0,1fr);gap:18px;padding:20px 24px;max-width:720px;transition:transform .35s var(--ease)}
.ladder li:nth-child(2){margin-left:7%}.ladder li:nth-child(3){margin-left:14%}.ladder li:nth-child(4){margin-left:21%}
.ladder li:hover{transform:translateX(4px)}
.rung{font:400 34px/1 var(--display);color:var(--lamp)}
.ladder p{margin:6px 0 0;color:var(--muted);font-size:16px}
.send-off{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:clamp(110px,22vh,220px) 0 0;padding:32px 36px}
.send-off h2{text-shadow:none}

/* ---- deeper chambers ------------------------------------------------------------------ */
.chamber{padding:clamp(56px,13vh,140px) 0 26px;max-width:720px}
.chamber h1{font-size:clamp(38px,4.8vw,70px)}
.chamber .station-tag{margin-bottom:12px}

.filters{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:12px;margin-bottom:14px}
.filters input,.filters select{background:rgba(5,4,12,.6);border:1px solid var(--line-strong);color:var(--text);font:500 15px var(--body);padding:10px 12px;clip-path:var(--cut-sm)}
.filters input{width:260px}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{padding:9px 13px;font:500 12px var(--mono);letter-spacing:.06em;color:var(--muted)}
.chip.on{color:var(--ink);background:var(--lamp);box-shadow:none}
.count{margin-left:auto;font:500 12px var(--mono);color:var(--muted)}
.collection-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(164px,1fr));gap:10px;margin-bottom:80px}
.token-card{padding:9px;text-align:left;transition:transform .3s var(--ease),box-shadow .3s}
.token-card:hover{transform:translateY(-3px);box-shadow:inset 0 0 0 1px rgba(240,181,102,.55)}
.token-card.mine{box-shadow:inset 0 0 0 2px var(--mint)}
.token-card img{display:block;width:100%;image-rendering:pixelated}
.token-head{display:flex;justify-content:space-between;align-items:center;margin:9px 0 4px}
.token-head b{font:500 13px var(--mono)}
.token-head small{font:500 11px var(--mono);color:var(--muted);border-left-width:2px!important;padding-left:6px!important}
.token-design{display:block;font-weight:600;font-size:16px}
.token-ability{display:block;font:500 12px var(--mono);color:var(--mint);margin-top:3px}
.token-owned{display:block;font:600 11px var(--mono);color:var(--ink);background:var(--mint);padding:3px 6px;margin-top:7px;width:max-content;letter-spacing:.08em}
.token-card.owned{box-shadow:inset 0 0 0 1px var(--mint)}
.chip.yours{color:var(--mint);box-shadow:inset 0 0 0 1px rgba(196,246,146,.5)}
.chip.yours.on{color:var(--ink);background:var(--mint)}
.choice.owned{box-shadow:inset 0 0 0 2px var(--mint)}
.token-editions{display:block;font:500 11px var(--mono);color:var(--lamp);margin-top:5px;letter-spacing:.06em}
.empty{padding:40px 0;color:var(--muted)}

.collection-grid{margin-bottom:22px}
.pager{display:flex;align-items:center;justify-content:center;gap:8px;margin:0 0 90px;flex-wrap:wrap}
.pager ol{display:flex;gap:6px;list-style:none;margin:0;padding:0;flex-wrap:wrap;justify-content:center}
.page{min-width:40px;height:40px;padding:0 12px;font:500 13px var(--mono);color:var(--muted);background:var(--tablet);box-shadow:inset 0 0 0 1px var(--line);clip-path:var(--cut-sm);transition:color .2s,box-shadow .2s}
.page:hover:not(:disabled){color:var(--text);box-shadow:inset 0 0 0 1px rgba(240,181,102,.55)}
.page.on{color:var(--ink);background:var(--lamp);box-shadow:none}
.page.step{padding:0 16px;color:var(--text)}
.pager .gap{align-self:center;color:var(--dim);font:500 13px var(--mono);padding:0 2px}
#browseAll{margin-top:16px}

/* ---- the Grim Mine claim panel --------------------------------------------------------- */
.claim{padding:24px;margin-bottom:22px}
.claim-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:start}
.claim-copy h2{font-size:clamp(28px,3.2vw,40px);text-shadow:none;margin:10px 0 8px}
.claim-copy p{margin:0;color:var(--muted);max-width:56ch}
.claim-copy .ghost{margin-top:16px}
.claim-total{display:grid;gap:8px;justify-items:end;text-align:right;min-width:240px}
.claim-total small{font:500 11px var(--mono);letter-spacing:.12em;color:var(--muted)}
.claim-total b{font:400 40px/1 var(--display);color:var(--lamp);font-variant-numeric:tabular-nums}
.claim-total em{font:500 14px var(--mono);font-style:normal;color:var(--muted)}
.claim-total .primary{min-width:200px}
.claim-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:8px;margin-top:20px}
.claim-list:empty{display:none}
.claim-row{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:12px;align-items:center;padding:8px 12px 8px 8px;background:rgba(5,4,12,.45);box-shadow:inset 0 0 0 1px var(--line);clip-path:var(--cut-sm)}
.claim-row img,.claim-blank{width:48px;height:48px;image-rendering:pixelated;background:#1c1630;display:block}
.claim-who b{display:block;font:500 13px var(--mono)}
.claim-who small{font:500 12px var(--mono);color:var(--muted)}
.claim-amount{font:500 15px var(--mono);color:var(--mint);font-variant-numeric:tabular-nums}
.game-tag{margin:6px 0 12px}
@media(max-width:760px){.claim{padding:18px}.claim-head{grid-template-columns:1fr}.claim-total{justify-items:stretch;text-align:left}.claim-total .primary{min-width:0}}

/* ---- the mine: the live cave shows through the expedition window ----------------------- */
.game-grid{display:grid;grid-template-columns:286px minmax(0,1fr);gap:16px}
.miner-panel{padding:16px}
.panel-label{display:flex;justify-content:space-between}
.panel-label span{color:var(--mint)}
.portrait{position:relative;margin-top:14px;background:#1c1630;clip-path:var(--cut-sm)}
.portrait img{display:block;width:100%;image-rendering:pixelated}
.portrait-id{position:absolute;left:8px;bottom:8px;padding:4px 8px;font:500 12px var(--mono);background:rgba(8,6,16,.85)}
.miner-title{display:flex;justify-content:space-between;align-items:center;margin-top:14px}
.miner-title h2{font:400 24px var(--display);text-shadow:none}
.miner-title span{font:500 12px var(--mono);color:var(--mint)}
#minerDescription{margin:6px 0 14px;font-size:14px;color:var(--muted)}
.ability-card{padding:12px;margin-bottom:12px;background:rgba(240,181,102,.06);box-shadow:inset 0 0 0 1px rgba(240,181,102,.22);clip-path:var(--cut-sm)}
.ability-card small{font:500 11px var(--mono);letter-spacing:.12em;color:var(--muted)}
.ability-card b{display:block;margin:5px 0 3px;color:var(--lamp);font-weight:600}
.ability-card p{margin:0;font-size:14px;color:var(--muted)}
.stat-list,.trait-list{margin:0 0 14px}
.stat-list div,.trait-list div{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid var(--line);font:500 13px var(--mono)}
.stat-list dt,.trait-list dt{color:var(--muted)}
.stat-list dd,.trait-list dd{margin:0}
.trait-list .derived dd{color:var(--mint)}
.energy-label{display:flex;justify-content:space-between;margin:12px 0 6px;font:500 12px var(--mono);color:var(--muted)}
progress{appearance:none;width:100%;height:6px;border:0;background:rgba(255,255,255,.08)}
progress::-webkit-progress-bar{background:rgba(255,255,255,.08)}
progress::-webkit-progress-value{background:var(--mint)}
progress::-moz-progress-bar{background:var(--mint)}
.small-note{margin:8px 0 0;font:500 12px/1.6 var(--mono);color:var(--dim)}

.cave-panel{min-width:0;display:flex;flex-direction:column}
.cave-top{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:var(--tablet);box-shadow:inset 0 0 0 1px var(--line)}
.cave-top .dot{display:inline-block;margin-right:9px}
.cave-scene{position:relative;flex:1;min-height:360px;box-shadow:inset 0 0 0 1px var(--line-strong);background:linear-gradient(90deg,rgba(8,6,16,.86),rgba(8,6,16,.3) 58%,rgba(8,6,16,0) 85%),linear-gradient(0deg,rgba(8,6,16,.7),transparent 45%)}
.cave-scene.mining{box-shadow:inset 0 0 0 1px var(--lamp),inset 0 0 60px rgba(240,181,102,.12)}
.scene-copy{position:absolute;left:28px;top:30px;right:28px}
.scene-copy>span{font:500 12px var(--mono);letter-spacing:.16em;color:var(--mint)}
.scene-copy h2{margin:12px 0;font-size:clamp(28px,3.2vw,42px)}
.scene-copy p{max-width:320px;margin:0;color:#d3cee3;font-size:15px;text-shadow:0 1px 8px #000}
.mining-meter{position:absolute;left:28px;right:28px;bottom:96px;font:500 12px var(--mono);color:var(--lamp)}
.mining-meter progress{margin-top:10px;height:8px}
.mining-meter progress::-webkit-progress-value{background:var(--lamp)}
.mining-meter progress::-moz-progress-bar{background:var(--lamp)}
.mine-cta{position:absolute;right:22px;bottom:22px;min-width:240px}
.route-label{display:flex;justify-content:space-between;padding:14px 4px 10px;text-shadow:0 1px 6px #000}
.routes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.route{padding:13px 12px;text-align:left;transition:box-shadow .2s}
.route.selected{box-shadow:inset 0 0 0 2px var(--mint);background:linear-gradient(180deg,rgba(196,246,146,.08),transparent),var(--tablet-hi)}
.route>span{display:flex;gap:8px;align-items:baseline}
.route i{font:500 12px var(--mono);font-style:normal;color:var(--dim)}
.route b{font-weight:600;font-size:16px}
.route small{display:block;margin:8px 0;font:500 12px var(--mono);color:var(--muted)}
.route strong{font:500 11px var(--mono);letter-spacing:.1em;color:var(--mint)}
.satchel{display:grid;grid-template-columns:repeat(4,1fr) auto;align-items:end;gap:22px;margin:18px 0 70px;padding:20px 24px;background:var(--tablet);box-shadow:inset 0 0 0 1px var(--line);clip-path:var(--cut)}
.satchel dt{font:500 11px var(--mono);letter-spacing:.14em;color:var(--muted);text-transform:uppercase}
.satchel dd{margin:6px 0 0;font:400 30px/1 var(--display)}
.satchel em{font:500 12px var(--mono);font-style:normal;color:var(--muted)}

/* ---- the forge ------------------------------------------------------------------------ */
.forge-split{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:14px;margin-bottom:80px}
.forge-main{display:grid;grid-template-columns:180px minmax(0,1fr);gap:26px;align-items:center;padding:26px}
.item-art{display:grid;place-items:center;height:180px;background:radial-gradient(70% 60% at 50% 40%,rgba(255,140,60,.18),transparent 70%),rgba(5,4,12,.55);clip-path:var(--cut-sm);box-shadow:inset 0 0 0 1px var(--line)}
.item-art svg{width:96px;height:96px;image-rendering:pixelated}
.item-art .handle{fill:#86603a}.item-art .head{fill:#b8b3cc}
.forge-main h3,.forge-side h3{font-size:23px;margin:8px 0 6px}
.forge-main p,.forge-side p{color:var(--muted);margin:0 0 16px;font-size:16px}
.forge-main small,.forge-side small{font:500 11px var(--mono);letter-spacing:.12em;color:var(--dim)}
.forge-side{display:grid;gap:14px}
.forge-side article{padding:22px}

/* ---- journal + dialogs --------------------------------------------------------------- */
#journalEntries{padding:6px 24px;margin-bottom:16px}
#journalEntries>p{margin:0;padding:22px 0;color:var(--muted)}
.entry{display:flex;justify-content:space-between;gap:20px;padding:16px 0;border-bottom:1px solid var(--line)}
.entry:last-child{border-bottom:0}
.entry small{color:var(--dim);font:500 12px var(--mono);white-space:nowrap}
#reset{margin-bottom:80px}
dialog{width:min(860px,92vw);max-height:86vh;overflow:auto;padding:26px;color:var(--text);border:0;background:linear-gradient(180deg,rgba(255,255,255,.03),transparent 30%),var(--tablet-solid)}
dialog::backdrop{background:rgba(5,4,10,.78)}
.modal-head{display:flex;justify-content:space-between;align-items:start;gap:20px}
.modal-head h2{font-size:32px;margin:4px 0 16px;text-shadow:none}
.close{width:36px;height:36px;font-size:20px;color:var(--muted)}
dialog p{color:var(--muted)}
#minerChoices{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.choice{padding:8px;text-align:left}
.choice img{display:block;width:100%;image-rendering:pixelated}
.choice span{display:block;margin-top:8px;font-size:15px;font-weight:600}
.choice small{font:500 12px var(--mono);color:var(--mint)}
.token-body{display:grid;grid-template-columns:250px minmax(0,1fr);gap:22px}
.token-body img{width:100%;image-rendering:pixelated;clip-path:var(--cut-sm)}
#infoBody li{margin:10px 0;color:#c9c3dc}
#toast{position:fixed;left:50%;bottom:24px;z-index:40;transform:translate(-50%,10px);max-width:min(560px,90vw);padding:14px 22px;background:var(--mint);color:#16210f;font-weight:600;clip-path:var(--cut-sm);opacity:0;pointer-events:none;transition:opacity .25s,transform .35s var(--ease)}
#toast.show{opacity:1;transform:translate(-50%,0)}
.footer{display:flex;justify-content:space-between;gap:16px;padding:26px 0 34px;font:500 12px var(--mono);letter-spacing:.08em;color:var(--dim);border-top:1px solid var(--line);text-shadow:0 1px 6px #000}

/* ---- depth rail + the fall between chambers ----------------------------------------- */
.depth-rail{position:fixed;left:20px;top:128px;bottom:44px;width:62px;display:flex;flex-direction:column;align-items:center;gap:10px;font:500 11px var(--mono);letter-spacing:.14em;color:var(--dim);pointer-events:none;text-shadow:0 1px 4px #000}
.rail-read{font:400 20px var(--display);letter-spacing:0;color:var(--lamp)}
.rail-read b{font:inherit}
.rail-track{position:relative;flex:1;width:2px;background:rgba(176,164,232,.18)}
.rail-track i{position:absolute;left:0;right:0;top:0;height:0;background:var(--lamp)}
.rail-track>b{position:absolute;left:50%;top:0;width:9px;height:9px;margin:-4px 0 0 -4.5px;background:var(--lamp);transform:rotate(45deg)}
.tick{position:absolute;top:var(--at);left:8px;font-size:11px;color:var(--dim);transform:translateY(-50%)}
.tick::before{content:'';position:absolute;left:-10px;top:50%;width:6px;height:1px;background:var(--dim)}
.rail-zone{writing-mode:vertical-rl;color:var(--mint);max-height:170px;overflow:hidden}
main{transition:opacity .26s var(--ease)}
body.travelling main{opacity:0;pointer-events:none}
.descent{position:fixed;inset:0;z-index:30;display:grid;place-content:center;justify-items:center;gap:12px;pointer-events:none;opacity:0;transition:opacity .3s}
body.travelling .descent{opacity:1}
.descent-read{font:400 clamp(60px,9vw,120px)/1 var(--display);color:var(--lamp);text-shadow:0 4px 0 rgba(5,4,10,.85),0 0 50px rgba(5,4,10,.9)}
.descent-read b{font:inherit}
.descent-zone{font:500 13px var(--mono);letter-spacing:.24em;color:var(--text);text-shadow:0 1px 8px #000}

/* ---- responsive ----------------------------------------------------------------------- */
@media(max-width:1379px){.depth-rail{display:none}}
@media(max-width:1060px){
 .game-grid{grid-template-columns:240px minmax(0,1fr)}
 .forge-split{grid-template-columns:1fr}
 .ledge-row{grid-template-columns:1fr}
 .tier-table{grid-template-columns:110px 80px 70px 64px minmax(0,1fr)}
}
@media(max-width:760px){
 .topbar{flex-wrap:wrap;height:auto;gap:0;padding:12px 16px 0}
 .brand small{display:none}
 .top-actions{margin-left:auto}
 .topbar nav{order:3;width:100%;margin:8px 0 0;height:48px;overflow-x:auto;scrollbar-width:none}
 .topbar nav::-webkit-scrollbar{display:none}
 .nav{flex:0 0 auto;padding:0 12px}
 #wallet{padding:10px 12px;font-size:14px}
 .notice{flex-wrap:wrap;font-size:11px;padding:8px 16px}
 .notice span:not(.dot){width:100%;order:3}
 .hero{min-height:calc(100svh - 150px);padding-top:44px}
 .cta-row{flex-direction:column;align-items:stretch;gap:6px}
 .station{margin-top:34vh}
 .ability-grid{grid-template-columns:repeat(2,1fr)}
 .ability:first-child{grid-column:auto;display:block}
 .ability:first-child img{grid-row:auto}
 .hero-strip{grid-template-columns:repeat(4,1fr)}
 .stat-row{grid-template-columns:repeat(2,1fr);gap:18px 0;padding:18px}
 .stat-row div:nth-child(3){border-left:0;padding-left:0}
 .tier-table{grid-template-columns:96px 70px 64px;padding:8px 14px 12px}
 .tier-table .th:nth-child(n+4),.tier-table .td:nth-child(5n+4),.tier-table .td:nth-child(5n+5){display:none}
 .ladder li,.ladder li:nth-child(n){margin-left:0;grid-template-columns:52px minmax(0,1fr);padding:16px}
 .send-off{flex-direction:column;align-items:stretch;padding:24px}
 .filters input{width:100%}
 .count{margin-left:0}
 .collection-grid{grid-template-columns:repeat(2,1fr)}
 .game-grid{grid-template-columns:1fr}
 .cave-scene{min-height:400px}
 .mine-cta{left:16px;right:16px;min-width:0}
 .routes{grid-template-columns:1fr}
 .satchel{grid-template-columns:repeat(2,1fr)}
 .satchel button{grid-column:1/-1;justify-self:start}
 .forge-main{grid-template-columns:1fr;padding:18px}
 .item-art{height:130px}
 .token-body{grid-template-columns:1fr}
 .token-body img{max-width:220px}
 .footer{flex-direction:column}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* ---- docs page (docs.html): the field guide, read inside the cave ---------------------- */
a.nav{text-decoration:none}
.docs-link{text-decoration:none;padding:9px 14px}
.docs-link.active{color:var(--lamp);box-shadow:inset 0 0 0 1px rgba(240,181,102,.6)}
.docs-hero{padding:clamp(28px,6vh,64px) 0 24px;max-width:780px}
.docs-banner{width:100%;height:auto;display:block;image-rendering:pixelated;margin-bottom:26px;box-shadow:0 0 0 1px var(--line)}
.docs-hero h1{margin:6px 0 12px;font-size:clamp(36px,5vw,64px)}
.docs-glance{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:26px 0 0;padding:18px 22px;background:var(--tablet);box-shadow:inset 0 0 0 1px var(--line);clip-path:var(--cut)}
.docs-glance div+div{border-left:1px solid var(--line);padding-left:18px}
.docs-glance dt{font:500 11px var(--mono);letter-spacing:.12em;color:var(--muted);text-transform:uppercase}
.docs-glance dd{margin:6px 0 0;font:400 30px/1 var(--display);color:var(--text)}
.docs-layout{display:grid;grid-template-columns:210px minmax(0,1fr);gap:28px;align-items:start;padding:14px 0 90px}
.docs-toc{position:sticky;top:calc(96px + env(safe-area-inset-top,0px));padding:16px;background:var(--tablet);box-shadow:inset 0 0 0 1px var(--line);clip-path:var(--cut)}
.docs-toc ol{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:2px}
.docs-toc a{display:block;padding:6px 10px;color:var(--muted);text-decoration:none;font-size:15px;border-left:2px solid transparent}
.docs-toc a:hover{color:var(--text)}
.docs-toc a[aria-current]{color:var(--text);border-color:var(--lamp)}
.docs .label{font:500 12px var(--mono);letter-spacing:.14em;color:var(--lamp);margin:0}
.docs-body{display:grid;gap:16px;min-width:0}
.docs-section{padding:clamp(20px,3vw,34px);scroll-margin-top:100px}
.docs-section h2{text-shadow:none;margin:8px 0 14px}
.docs-section h3{margin:24px 0 6px;font-size:20px}
.docs-section p,.docs-section li{color:#d8d2e8;max-width:68ch}
.docs-section p{margin:0 0 14px}
.docs-section ul{padding-left:20px;display:grid;gap:8px;margin:10px 0}
.docs-section a{color:var(--mint)}
.docs code{font:500 .88em var(--mono);background:rgba(5,4,12,.6);padding:2px 6px}
.docs code.hash{display:inline-block;overflow-wrap:anywhere;max-width:100%;color:var(--lamp)}
.docs-cast{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:20px 0}
.docs-cast figure{margin:0;display:grid;gap:6px}
.docs-cast img{width:100%;height:auto;image-rendering:pixelated;clip-path:var(--cut-sm)}
.docs-cast figcaption{font:500 11px var(--mono);color:var(--muted);text-align:center}
.docs-table{overflow-x:auto;margin:16px 0}
.docs-table table{width:100%;min-width:480px;border-collapse:collapse;font-size:15px}
.docs-table th,.docs-table td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.docs-table thead th{font:500 11px var(--mono);letter-spacing:.12em;color:var(--muted);text-transform:uppercase}
.docs-table tr:last-child td,.docs-table tr:last-child th{border-bottom:0}
.docs-facts{min-width:0!important}
.docs-facts th{font:500 12px var(--mono);color:var(--muted);width:36%}
.docs-table .num{text-align:right;font-variant-numeric:tabular-nums}
.tba{font:600 11px var(--mono);letter-spacing:.06em;color:var(--ink);background:var(--lamp);padding:2px 7px;white-space:nowrap}
.docs-note{margin:18px 0;padding:14px 18px;background:rgba(240,181,102,.07);box-shadow:inset 0 0 0 1px rgba(240,181,102,.3);clip-path:var(--cut-sm)}
.docs-note p{margin:4px 0 0}
.docs-note.warn{background:rgba(226,64,106,.08);box-shadow:inset 0 0 0 1px rgba(226,64,106,.4)}
.docs-note.warn .label{color:var(--crimson)}
.docs-depths{list-style:none;padding:0;margin:16px 0;border-left:2px solid var(--lamp)}
.docs-depths li{display:grid;grid-template-columns:76px minmax(0,1fr);gap:14px;padding:9px 0 9px 16px}
.docs-depths b{font:400 20px var(--display);color:var(--lamp)}
.docs-depths a{display:block;font-weight:700}
.docs-depths span{color:var(--muted)}
.docs-steps{list-style:none;counter-reset:step;padding:0;margin:16px 0;display:grid;gap:12px}
.docs-steps li{counter-increment:step;display:grid;grid-template-columns:40px minmax(0,1fr);gap:14px;align-items:start}
.docs-steps li::before{content:counter(step);font:400 20px/40px var(--display);text-align:center;width:40px;height:40px;color:var(--lamp);background:rgba(5,4,12,.6);clip-path:var(--cut-sm)}
.docs-steps strong{display:block;color:var(--text)}
.docs details{border-bottom:1px solid var(--line);padding:12px 0}
.docs summary{cursor:pointer;font-weight:700;list-style:none;display:flex;justify-content:space-between;gap:16px;color:var(--text)}
.docs summary::-webkit-details-marker{display:none}
.docs summary::after{content:'+';font:400 22px/1 var(--display);color:var(--lamp)}
.docs details[open] summary::after{content:'−'}
.docs details p{margin:10px 0 0;color:var(--muted)}
.docs-end{color:var(--muted);text-shadow:0 1px 8px #000;margin:6px 0 0}
@media(max-width:1000px){.docs-layout{grid-template-columns:1fr}.docs-toc{position:static}.docs-toc ol{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.docs-glance{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 0}.docs-glance div:nth-child(3){border-left:0;padding-left:0}.docs-cast{grid-template-columns:repeat(3,minmax(0,1fr))}.docs-cast figure:nth-child(n+4){display:none}.docs-depths li{grid-template-columns:60px minmax(0,1fr)}}
.docs-hero{position:relative}
.docs-hero::before{content:'';position:absolute;inset:-12px -28px -8px;z-index:-1;background:radial-gradient(120% 90% at 30% 60%,rgba(8,7,14,.9) 45%,rgba(8,7,14,.55) 75%,transparent 100%)}
/* Team announcement gate: visible even before JavaScript finishes loading. */
.mining-launch { padding:clamp(24px,5vw,56px); margin-bottom:24px; text-align:center; }
.mining-countdown { font-family:'IBM Plex Mono',monospace; font-size:clamp(40px,9vw,96px); font-variant-numeric:tabular-nums; letter-spacing:.04em; margin:24px 0; color:#f0b566; }
.mining-locked #activate,.mining-locked #mineButton,.mining-locked #claimAll,.mining-locked #claimConnect { pointer-events:none; opacity:.45; }