@font-face{font-family:GameSerif;src:local("Georgia")}
*{box-sizing:border-box}
html{color-scheme:dark}
body{margin:0;color:#ede8e0;background:#11121c;background-image:radial-gradient(ellipse at 50% 40%,#2a243d66,transparent 65%);font-family:Arial,Helvetica,sans-serif;font-size:16px;min-height:100svh}
button,input,select,a{ -webkit-tap-highlight-color:transparent}
button,a{touch-action:manipulation}
button{font:inherit;cursor:pointer}
button:disabled{cursor:wait;opacity:.5}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,canvas:focus-visible{outline:3px solid #83d7c6;outline-offset:4px}
button{color:inherit}
a{color:inherit;text-decoration:none}
[hidden]{display:none!important}
html:not(.touch-input) .touch-controls{display:none}
/* This is a game surface, including the header and dialogs. Only actual text
   entry retains native selection/callouts; scrolling and focus remain native. */
html,body,body *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
input,textarea,[contenteditable]:not([contenteditable="false"]),[contenteditable]:not([contenteditable="false"]) *{-webkit-user-select:text;user-select:text;-webkit-touch-callout:default}
img,a{-webkit-user-drag:none}
.topbar{height:82px;max-width:1400px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:0 5%;gap:18px;border-bottom:1px solid #ffffff0b}
.brand{display:flex;align-items:center;gap:12px;font-size:13px;letter-spacing:2px;font-weight:700}
.brand b{font-weight:400;color:#aaa3b3}
.brand-mark{display:grid;place-items:center;width:35px;height:39px;background:#d3a466;color:#191620;clip-path:polygon(50% 0,100% 24%,100% 76%,50% 100%,0 76%,0 24%);font:bold 25px Georgia}
.preview-tag{color:#b6acbf;font-size:10px;letter-spacing:2px}
.topbar nav{display:flex;gap:10px}
.icon-button{background:#ffffff05;border:1px solid #ffffff16;width:36px;height:36px;border-radius:50%;position:relative;font-size:20px}
.slash{position:absolute;left:15px;top:5px;color:#d0a977}
.layout{display:grid;grid-template-columns:minmax(175px,245px) minmax(0,420px) minmax(190px,245px);justify-content:center;align-items:center;gap:clamp(24px,4vw,68px);padding:36px 28px 20px}
.intro-rail{padding-bottom:20px}
.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;color:#b8a080;line-height:1.8}
.intro-rail h1{font-family:GameSerif,Georgia,serif;font-weight:400;font-size:clamp(43px,4.5vw,67px);line-height:.98;letter-spacing:-3px;margin:22px 0;position:relative}
.intro-rail h1 em{font-size:1.35em;color:#e0b57b;font-weight:400}
.title-star{position:absolute;color:#bba077;top:66px;right:12px;font-size:31px}
.lede{font-size:17px;line-height:1.7;color:#b8b1c2}
.personal-best{margin-top:55px;border-top:1px solid #ffffff17;padding-top:23px}
.personal-best>span{font-size:10px;color:#b8a080;letter-spacing:1.8px}
.personal-best>span small{display:block;color:#8b8497;font-size:11px;letter-spacing:0;margin-top:7px}
.personal-best strong{display:block;font:40px Georgia;margin-top:9px}
.personal-best strong small{font-size:18px;color:#9c91ac}
.personal-best strong .record-coins{display:block;margin-top:6px;font:12px Arial;color:#cdb78d}
.keyboard-hint{display:flex;gap:15px;margin-top:36px;align-items:center}
.keyboard-hint p{color:#b1a9ba;font-size:14px;line-height:1.6}
.keyboard-hint kbd{display:inline-grid;place-items:center;width:31px;height:31px;border:1px solid #64546c;border-bottom:3px solid #64546c;border-radius:6px;font-size:20px;color:#cfbfdb}
.small-note{color:#9b93a7;font-size:12px;line-height:1.7}
.game-column{min-width:0;width:100%}
.stage{width:100%;aspect-ratio:3/5;position:relative;overflow:hidden;border:1px solid #a48a6277;border-radius:18px;box-shadow:0 0 0 6px #ffffff03,0 24px 90px #0007;background:#171c35;isolation:isolate}
canvas{display:block;width:100%;height:100%;touch-action:none}
.hud{position:absolute;inset:22px 22px auto;display:flex;justify-content:space-between;pointer-events:none}
.height>span{font-size:9px;letter-spacing:2px;color:#cfc5d3}
.height strong{display:block;font:38px Georgia;line-height:1.1;text-shadow:0 2px 8px #000}
.height small{font:16px Georgia;color:#c6bed0}
.hud-right{display:flex;flex-direction:column;align-items:center;gap:10px}
.hud-right>span{font-size:12px;color:#dbc29b;background:#151728a8;padding:4px 7px;border-radius:4px}
.pause-button{pointer-events:auto;border:1px solid #ffffff35;background:#11182777;border-radius:50%;width:35px;height:35px}
.inventory{position:absolute;left:24px;top:96px;display:flex;gap:7px}
.inventory>span{display:grid;place-items:center;border:1px solid #ffffff24;background:#1518278c;border-radius:50%;width:30px;height:30px;color:#928898;font-size:20px}
.inventory .active-shield{border-color:#82eed1;color:#82eed1;box-shadow:0 0 15px #59dac855}
.inventory .coin-counter{display:flex;gap:6px;min-width:53px;width:auto;padding:0 9px;border-radius:18px;color:#f1d291;border-color:#dbb87350}
.coin-counter i{font-style:normal;font-size:21px;color:#f2ca70}
.coin-counter b{font-size:13px;font-weight:600;font-variant-numeric:tabular-nums}
.inventory .crown-counter{border-color:#f2cb7870;background:#392b1bc9}
.crown-counter i{color:#ffe1a0}
.zone-label{display:flex;gap:7px;align-items:center;min-width:0;line-height:1.4;font-size:9px;letter-spacing:.4px;color:#c8bdd2}
.zone-label strong{flex-shrink:0;font-size:8px;letter-spacing:.8px;color:#dac198}
.zone-label>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:26px;background:linear-gradient(180deg,#10142a20,#11132378 45%,#111223db);z-index:4}
.start-panel .eyebrow{color:#d7be96;margin-top:18px}
.overlay h2{font:45px/1.07 Georgia,serif;letter-spacing:-1.8px;margin:15px 0 4px;color:#f2e4cb}
.hero-goblin{width:43%;max-width:176px;height:auto;filter:drop-shadow(0 12px 12px #04040b88);margin:21px 0 24px;animation:bob 3.6s ease-in-out infinite}
.primary,.secondary{display:flex;align-items:center;justify-content:center;gap:20px;border-radius:8px;min-height:48px;padding:13px 22px;font-size:15px;font-weight:700;width:100%;text-align:center}
.primary{border:1px solid #efc592;background:linear-gradient(110deg,#edc58c,#cc9658);color:#272032;box-shadow:0 5px 20px #0003}
.primary:hover{filter:brightness(1.09)}
.primary span{font-size:22px;font-weight:400}
.secondary{border:1px solid #b7a48366;background:#252132;color:#e1c9a4}
.secondary:hover{background:#373044}
.overlay>.primary,.overlay>.secondary{max-width:280px;margin-top:12px}
.overlay p{font-size:12px;line-height:1.7;color:#c5bfd0;max-width:285px;margin:16px 0 0}
.text-button{border:0;background:none;color:#ccb28f;font-size:12px;padding:8px 0}
.text-button:hover{color:#ffe0af}
.start-panel .text-button{margin-top:5px}
.end-panel{background:#141425e8;backdrop-filter:blur(7px)}
.end-panel h2{font-size:74px;margin:18px 0 5px;color:#efd4a5}
.end-panel h2 small{font-size:30px}
.end-coins{color:#e8c37e;font-size:13px;margin:3px 0 1px}
.end-panel .record-message{min-height:20px;color:#dcb67f}
.end-panel .validation-message{font-size:11px;min-height:36px;color:#ada2ba}
.pause-panel{background:#161424e8;backdrop-filter:blur(8px)}
.pause-panel .primary{margin-top:26px}
.toast{position:absolute;top:190px;left:15px;right:15px;text-align:center;color:#f9e4b9;font-size:16px;text-shadow:0 2px 8px #000;z-index:3;pointer-events:none;opacity:0;transition:opacity .2s}
.toast.show{opacity:1}
.touch-controls{--steer-width:156px;--steer-height:108px;--steer-font:56px;position:absolute;bottom:48px;left:50%;width:max(calc(100% - 24px),calc(var(--steer-width)*2 + 12px));transform:translateX(-50%);display:flex;align-items:center;justify-content:space-between;gap:12px;pointer-events:none;z-index:3}
.touch-controls button{pointer-events:auto;border:1px solid #d3b7826b;background:#19192c9c;border-radius:14px;flex:0 0 var(--steer-width);width:var(--steer-width);height:var(--steer-height);color:#ebd4b0;font-size:var(--steer-font);touch-action:none}
.touch-controls button:active,.touch-controls button.pressed{background:#c69d6680}
.stage-caption{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:35px;font-size:10px;color:#92899e}
.caption-status{flex:1;min-width:0}
.caption-status>#run-label{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.6}
.caption-status:has(.zone-label:not([hidden]))>#run-label{font-size:8px;color:#8b8296}
.stage-caption .text-button{font-size:11px;white-space:nowrap}
.caption-status>#run-label.practice-label{white-space:normal;color:#a6dccb;line-height:1.4}
#practice-open{color:#9dd5c4;text-decoration:underline;text-decoration-color:#9dd5c450;text-underline-offset:4px}
.right-rail{align-self:center}
.board-card{padding:24px 22px;border:1px solid #b5986b33;border-radius:12px;background:linear-gradient(140deg,#ffffff05,#ffffff01)}
.card-heading{display:flex;justify-content:space-between;align-items:center;color:#d3b07e}
.board-card h2{font:28px Georgia;margin:12px 0 22px;letter-spacing:-.6px}
.leaderboard{list-style:none;margin:0;padding:0}
.leaderboard li:not(.empty-board){display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:5px;padding:13px 0;border-bottom:1px solid #ffffff0c;align-items:center;font-size:13px}
.leaderboard .rank{color:#b89d76;font:17px Georgia}
.leaderboard .name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.leaderboard .value{font-weight:700;color:#e4d6bd;text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.leaderboard .value small{display:block;font-size:10px;font-weight:400;color:#c7ab77;margin-top:4px}
.leaderboard .score-detail{grid-column:2 / -1;text-align:right;font-size:10px;line-height:1.5;font-weight:400;color:#c7ab77;overflow-wrap:anywhere}
.ranking-rule{color:#c7af89;font-size:11px;line-height:1.6;margin:17px 0 0}
.leaderboard .empty-board{font-size:13px;line-height:1.9;color:#aaa0b6;padding:12px 0 23px}
.board-card .small-note{font-size:10px;margin-top:20px}
.treasures{margin-top:38px;padding:0 12px}
.treasures>div{display:flex;align-items:center;gap:14px;margin-top:18px}
.item-badge{display:grid;place-items:center;flex-shrink:0;width:36px;height:39px;border:1px solid currentColor;border-radius:11px;font:26px Georgia}
.teal{color:#86dcca;background:#86dcca0c}
.gold{color:#ddbd80;background:#ddbd800c}
.treasures p{margin:0;font-size:12px}
.treasures strong{display:block;font-weight:400;color:#e0d6e7}
.treasures p>span{display:block;font-size:11px;margin-top:6px;line-height:1.5;color:#9b92a6}
footer{display:flex;justify-content:space-between;max-width:1250px;margin:4px auto 0;padding:18px 5% 24px;color:#776e85;font-size:10px;letter-spacing:1px}
footer span:first-child{font-size:9px;letter-spacing:2px}
dialog{border:1px solid #8f7456;border-radius:16px;background:#201d2e;color:#e7dfed;box-shadow:0 25px 100px #0009;width:460px;max-width:calc(100vw - 28px);max-height:calc(100svh - 32px);overflow-y:auto;overscroll-behavior:contain;padding:34px;line-height:1.7}
dialog::backdrop{background:#090a16b8;backdrop-filter:blur(7px)}
dialog h2{font:32px/1.12 Georgia;margin:14px 0 22px;color:#ead2a9;letter-spacing:-.6px}
dialog p,.rules{font-size:14px;color:#c7bdd1}
.rules{padding-left:20px}
.rules li{margin:10px 0}
.rules strong{color:#eee0c4}
.dialog-close{position:absolute;top:10px;right:14px;font-size:27px;background:none;border:0;color:#bdb0c9}
.dialog-close-button{margin-top:25px}
form label:not(.checkbox){display:block;font-size:13px;color:#c6b4a0;margin:16px 0}
input:not([type=checkbox]){display:block;margin-top:7px;width:100%;min-height:46px;background:#141421;border:1px solid #786777;border-radius:7px;padding:10px 12px;font-size:16px;color:#fff}
input::placeholder{color:#82768f}
#practice-height{display:block;width:100%;min-height:48px;border:1px solid #786777;border-radius:7px;background:#141421;color:#f4e7d3;font:16px Arial;padding:10px 12px}
#practice-form label{margin-bottom:7px}
#practice-dialog .practice-summary{font-size:12px;color:#9dd5c4;margin:12px 0 17px}
#practice-dialog>.small-note{font-size:11px;line-height:1.65;margin:15px 0 0}
#practice-dialog>.secondary{margin-top:18px}
.checkbox{display:flex;align-items:flex-start;gap:10px;font-size:12px;color:#c2b7cd;margin:20px 0}
.checkbox input{width:18px;height:18px;flex-shrink:0;accent-color:#deb77d}
.form-status{min-height:24px}
dialog .secondary{margin-top:18px;font-size:13px}
@keyframes bob{0%,100%{transform:translateY(0) rotate(-2deg)}
50%{transform:translateY(-10px) rotate(2deg)}
}
@media(prefers-reduced-motion:reduce){.hero-goblin{animation:none}
*{scroll-behavior:auto!important}
}
@media(min-width:901px) and (max-height:870px){.layout{grid-template-columns:minmax(175px,245px) minmax(0,360px) minmax(190px,235px);padding-top:25px}
.topbar{height:66px}
footer{padding-top:0}
.overlay h2{font-size:39px}
.hero-goblin{margin:15px 0}
.start-panel .eyebrow{margin-top:0}
}
@media(max-width:1000px){.layout{gap:25px;grid-template-columns:minmax(150px,200px) minmax(0,380px) minmax(165px,200px)}
.board-card{padding:20px 15px}
.title-star{display:none}
.intro-rail h1{font-size:48px}
}
@media(max-width:800px){.topbar{height:58px;padding:0 16px}
.brand{font-size:10px;letter-spacing:1.4px;gap:9px}
.brand-mark{width:27px;height:31px;font-size:21px}
.preview-tag{font-size:8px;letter-spacing:1px}
.icon-button{width:31px;height:31px;font-size:17px}
.slash{top:3px;left:13px}
.topbar nav{gap:6px}
.layout{display:flex;justify-content:center;padding:14px 12px 0;gap:0}
.intro-rail,.right-rail,footer{display:none}
.game-column{width:min(100%,420px,calc((100svh - 113px)*.6))}
.stage{border-radius:13px}
.stage-caption{font-size:9px;min-height:34px}
.overlay{padding:20px}
.overlay h2{font-size:clamp(30px,8vw,43px)}
.hero-goblin{margin:14px 0 20px;width:42%}
.overlay p{font-size:11px}
.overlay>.primary,.overlay>.secondary{min-height:44px;padding:10px 18px;max-width:260px}
.start-panel .eyebrow{margin-top:0;font-size:9px}
.end-panel h2{font-size:64px}
.toast{top:155px;font-size:14px}
.zone-label{font-size:8px;letter-spacing:0}
.zone-label strong{font-size:7px;letter-spacing:.4px}
.hud{inset:16px 16px auto}
.height strong{font-size:32px}
.inventory{left:17px;top:83px}
.pause-panel p{font-size:12px}
}
@media(max-height:620px){.hero-goblin{width:31%;margin:10px 0}
.overlay h2{font-size:30px}
.overlay p{margin-top:9px}
.overlay>.primary,.overlay>.secondary{margin-top:8px}
.start-panel .text-button{margin-top:0}
.overlay .eyebrow{font-size:8px}
.end-panel h2{font-size:50px}
.caption-status{max-width:190px}
.topbar{height:48px}
.game-column{width:min(100%,420px,calc((100svh - 96px)*.6))}
}
@media(max-width:360px){.preview-tag{display:none}
.stage-caption{font-size:8px}
.overlay p{font-size:10px}
dialog{padding:25px}
}

@media(max-height:500px) and (orientation:landscape){.intro-rail,.right-rail,footer{display:none}
.layout{display:flex;justify-content:center;padding:10px 12px 0}
.game-column{width:calc((100svh - 96px)*.6)}
.stage{border-radius:10px}
.stage-caption{font-size:8px;min-height:28px}
.caption-status>#run-label{display:none}
.caption-status>#run-label.practice-label{display:block;font-size:7px}
.stage-caption{gap:5px}
.stage-caption .text-button{font-size:8px}
.overlay{padding:12px}
.overlay h2{font-size:25px}
.overlay>.primary,.overlay>.secondary{min-height:36px;padding:7px;font-size:12px}
.overlay p{font-size:9px;line-height:1.4}
.overlay .eyebrow{font-size:7px;letter-spacing:1px}
.hero-goblin{width:29%;margin:8px 0}
.start-panel .text-button{font-size:9px}
.hud{inset:9px}
.height strong{font-size:25px}
.height>span{font-size:8px}
.pause-button{width:28px;height:28px}
.hud-right{gap:4px}
.hud-right>span{font-size:9px}
.inventory{left:9px;top:65px}
.inventory>span{width:23px;height:23px;font-size:15px}
.inventory .coin-counter{width:auto;min-width:43px;padding:0 6px;gap:4px}
.coin-counter i{font-size:17px}
.coin-counter b{font-size:11px}
.zone-label{font-size:7px;gap:4px;letter-spacing:0}
.zone-label strong{font-size:6px;letter-spacing:0}
.end-panel h2{font-size:36px;margin:8px 0 2px}
.end-coins{font-size:9px;margin:1px 0}
.end-panel .validation-message{font-size:8px;margin-top:5px;min-height:25px}
.end-panel .record-message{min-height:0;margin-top:5px;font-size:8px}
.end-panel>.primary,.end-panel>.secondary{min-height:32px;padding:6px;margin-top:6px}
.toast{top:117px;font-size:11px}
.end-panel .eyebrow{margin:0}
}

.item-badge{background-image:url('/assets/pickups-v1.png');background-size:300% 100%;background-repeat:no-repeat;border:0;color:transparent;width:43px;height:43px}
.item-badge.teal{background-position:0 0}
.item-badge.gold{background-position:50% 0}
.item-badge.coin-badge{background-image:none;color:#f2ca70;font:bold 34px Georgia;text-shadow:1px 2px #9a6228;position:relative}

/* The cabinet belongs to the same old stone / worn brass world as the game. */
body{background-color:#101319;background-image:radial-gradient(ellipse at 50% 5%,#48413938,transparent 60%),repeating-linear-gradient(115deg,#fff1 0,transparent 1px,transparent 140px),linear-gradient(90deg,#0b1014,#191b23 48%,#0b1014);color:#e6e0d3}
.topbar{height:72px;border-bottom:1px solid #ac87552b;max-width:1460px}
.brand{gap:12px;letter-spacing:2.2px;font-size:11px}.brand b{color:#ae956d}
.brand-mark{display:block;clip-path:none;width:55px;height:55px;object-fit:contain;background:none;filter:drop-shadow(0 2px 2px #000)}
.layout{grid-template-columns:minmax(180px,230px) minmax(0,min(420px,calc((100svh - 145px)*.6))) minmax(190px,240px);gap:clamp(25px,4vw,65px);padding:14px 28px 0;align-items:center}
.intro-rail h1{font-size:61px;letter-spacing:-3px;margin:18px 0;text-shadow:0 4px 0 #0004}
.intro-rail h1 em{color:#d5af70}.title-star{font-size:23px;right:16px;color:#a88953}.lede{font-size:15px;line-height:1.65;color:#b8b3a9;margin-bottom:22px}
.journey-map{display:flex;flex-direction:column;gap:0;border-left:1px solid #9674424d;padding-left:12px;margin:0 0 24px 3px}
.journey-map>span{font:15px Georgia;color:#8b806f;display:flex;align-items:center;gap:9px;padding:7px 0}.journey-map b{font:11px Arial;letter-spacing:.3px;flex:1}.journey-map small{font:10px Arial;color:#8c8881}.journey-map .journey-start{color:#d8b273}.journey-start small{color:#c6b08a}
.personal-best{margin-top:20px;padding-top:16px;border-color:#b8996330}.personal-best strong{font-size:34px}.personal-best strong small{font:11px Arial;color:#b6a281}.personal-best strong .record-coins{font-size:11px;color:#99948b}
.keyboard-hint{margin-top:20px;gap:10px}.keyboard-hint p{font-size:12px;margin:0;color:#aba499}.keyboard-hint kbd{border-color:#71634e;border-radius:3px;color:#dac095;background:#24262a}.intro-rail>.small-note{font-size:10px;color:#797871}
.game-column{position:relative;align-self:start;filter:drop-shadow(0 18px 25px #0007)}
.portal-plaque{position:relative;width:78%;margin:0 auto;height:25px;display:flex;justify-content:center;align-items:center;gap:16px;background:linear-gradient(#635443,#332f2b 30%,#1f2224 70%,#5c4a35);border:1px solid #99805b;border-bottom:0;border-radius:7px 7px 0 0;font:bold 9px Georgia;letter-spacing:2px;color:#ceb78f;text-shadow:0 2px #000;box-shadow:inset 0 2px #a797794d;z-index:1}.portal-plaque span{font-size:10px;color:#a78551}
.stage{aspect-ratio:auto;border:7px solid #393b3c;border-top-color:#60605a;border-left-color:#4c4c47;border-bottom-color:#242827;border-right-color:#303636;border-radius:13px;overflow:hidden;box-shadow:0 0 0 1px #aa8f5b,0 0 0 3px #171b1e,0 0 0 4px #5b503d,inset 0 0 0 2px #151515;background:#111721}
.stage:after{content:"";position:absolute;inset:0;pointer-events:none;z-index:7;border:1px solid #d6b97c50;border-radius:5px;box-shadow:inset 0 0 10px #0007}
canvas{height:auto;aspect-ratio:3/5}
.overlay{background:linear-gradient(#0c111b15,#0d111aa8 50%,#0b1119e8);padding:20px}
.overlay h2{color:#ede2ca;font-size:42px;text-shadow:0 3px 0 #0c0f15;letter-spacing:-1.1px}.overlay h2 em{font-size:.88em;color:#d6b176;font-weight:400}
.hero-goblin{width:39%;margin:16px 0 18px;filter:drop-shadow(0 10px 6px #0008)}
.overlay p{color:#c4bfb2}.eyebrow{color:#b8a17d;letter-spacing:1.8px}
.primary,.secondary{border-radius:4px;min-height:44px;font-size:13px;padding:11px 18px;letter-spacing:.2px}
.primary{background:linear-gradient(#e8c98d 0,#c9a264 9%,#b88944 91%,#98713c);border:1px solid #e3c68c;border-bottom:3px solid #76552d;color:#211c16;text-shadow:0 1px #ffffff25;box-shadow:inset 0 1px #ffe5a999,0 3px 0 #0c1018,0 8px 15px #0003}
.secondary{background:linear-gradient(#33383a,#23292d);border:1px solid #7c725e;border-bottom:3px solid #151d20;color:#dfcba7;box-shadow:inset 0 1px #c9b79225,0 3px 0 #0c1018}.secondary:hover{background:linear-gradient(#414644,#2a3333)}
.overlay>.primary,.overlay>.secondary{max-width:268px;margin-top:10px}.overlay p{margin-top:11px}.start-panel .text-button{font-size:10px;color:#a99e8a}.start-panel>p{font-size:10px}
.board-card{border-radius:3px;border:1px solid #665d493f;border-top:3px solid #84704d;background:linear-gradient(150deg,#34363255,#141a2080);padding:23px 20px;box-shadow:inset 0 1px #c7ad7933,0 12px 32px #0003;position:relative}.board-card:after{content:"✦";position:absolute;bottom:-8px;left:calc(50% - 6px);font-size:14px;color:#9f8457;background:#181d23;padding:0 4px}
.board-card h2{font-size:28px;color:#ded1b9}.card-heading{color:#bc9e69}.leaderboard .empty-board{color:#999a93;font-size:12px}.ranking-rule{color:#c4ac83;font-size:11px}.board-card .small-note{color:#84887e;font-size:10px}
.treasures{margin-top:30px;padding:0 8px}.treasures p>span{color:#93968e}.treasures strong{color:#cec8b9}.treasures>div{gap:10px}.treasures p>span{font-size:10px}
.hud{inset:16px}.height>span{font-size:8px;color:#cbbd9e;text-shadow:0 1px 3px #000}.height strong{font-size:30px;letter-spacing:-.7px;color:#fff1cd}.height>small{display:block;font:9px Arial;color:#babcb5;margin-top:3px;text-shadow:0 1px 4px #000}
.inventory{left:16px;top:89px}.hud-right{gap:6px;align-items:flex-end}.hud-right>span{font-size:10px;color:#d1c29f;background:#131b20c9;border:1px solid #baa06a33;border-radius:3px}.hud-right>#live-points{color:#efcc7c}.pause-button{background:#141c25bf;border-color:#b5a0797d;border-radius:5px;width:30px;height:30px}
.touch-controls button{background:linear-gradient(#2e343ba8,#19212bbb);border-color:#baa87880;border-bottom:3px solid #1a1d25;border-radius:7px;box-shadow:inset 0 1px #c6b48e25}
.stage-caption{min-height:36px;color:#a29b8b;gap:8px}.zone-label>span{color:#c8b58f}.zone-label strong{color:#8f9b98}.caption-status:has(.zone-label:not([hidden]))>#run-label{color:#878b82}.stage-caption .text-button{font-size:10px}
.end-panel,.pause-panel,.lesson-panel{background:linear-gradient(#131c22e8,#131b20f8);backdrop-filter:blur(3px)}
.end-panel h2{font-size:55px;margin:10px 0 11px;letter-spacing:-1.5px;color:#f3dbab}.end-panel h2 small{font:11px Arial;letter-spacing:1px;display:block;text-transform:uppercase;margin-top:5px;color:#b8a17b}.end-height{font-size:11px;color:#b0bdb5;margin-top:10px}
.result-breakdown{width:100%;max-width:268px;text-align:left;font-size:11px;color:#c1c8c2}.result-meter{display:flex;width:100%;height:10px;margin:9px 0;background:#080f15;border:1px solid #8388753f;overflow:hidden;border-radius:2px;box-shadow:inset 0 1px 3px #000}.result-meter i{height:100%;width:0}.result-meter i:first-child{background:linear-gradient(#9faeae,#5d7c81)}#result-gold-bar{background:linear-gradient(#f5d18b,#b67e2e);box-shadow:-1px 0 #f5dda7}#result-crown-bar{background:linear-gradient(#fff1b8,#e5ad51);box-shadow:-1px 0 #fff4d1}
.end-crowns{font-size:inherit;line-height:1.5;color:#ffe1a0;margin:2px 0 1px}
.end-coins{font-size:11px;color:#dfbc76}.end-panel #death-message{font-size:11px;margin-top:17px;line-height:1.6}.end-panel .record-message{font-size:10px;line-height:1.5;margin-top:9px;min-height:0}.end-panel .validation-message{font-size:10px;line-height:1.5;min-height:29px;margin-top:9px}
.lesson-panel{z-index:6}.lesson-panel h2{font-size:35px}.lesson-panel p{font-size:13px;line-height:1.75;margin:17px 0 23px}.lesson-panel>.text-button{margin-top:12px;font-size:10px}.lesson-guide{position:absolute;top:138px;left:12px;right:12px;display:flex;gap:7px;align-items:center;padding:7px;background:#172629eb;border:1px solid #9db0a75e;border-radius:4px;z-index:3;color:#ded5bc;font-size:10px}.lesson-guide b{font-size:9px;color:#9bbdb0;white-space:nowrap}.lesson-guide span{flex:1}.lesson-guide button{font-size:19px;background:none;border:0;color:#c8b68f;padding:0 4px}
dialog{background:linear-gradient(145deg,#2c3030,#182127);border-radius:7px;border:1px solid #98805b;border-top:4px solid #b39b70;box-shadow:inset 0 1px #dbc3934a,0 25px 100px #0009}dialog h2{color:#e1c99d}dialog p,.rules{color:#bfc3bb}dialog .primary{margin-top:20px}.rules strong{color:#dec89f}input:not([type=checkbox]),#practice-height{border-radius:3px;background:#111c24;border-color:#6a7169}.small-note{color:#9a9c92}
footer{font-size:9px;margin-top:0;padding:10px 5% 14px;color:#767e77;letter-spacing:.4px}
@media(max-height:800px) and (min-width:801px){.topbar{height:58px}.layout{grid-template-columns:minmax(160px,220px) minmax(0,min(390px,calc((100svh - 130px)*.6))) minmax(180px,225px)}.intro-rail h1{font-size:47px;margin:12px 0}.lede{font-size:13px;margin-bottom:14px}.journey-map>span{padding:5px 0}.journey-map{margin-bottom:13px}.keyboard-hint{margin-top:12px}.personal-best{margin-top:13px;padding-top:12px}.personal-best strong{font-size:28px}.intro-rail>.small-note{display:none}.hero-goblin{margin:11px 0;width:36%}.overlay h2{font-size:35px}.end-panel h2{font-size:46px}.end-panel #death-message{font-size:10px;margin-top:11px}.board-card{padding:19px 16px}.treasures{margin-top:22px}}
@media(max-width:800px){.topbar{height:54px;padding:0 14px}.brand-mark{width:40px;height:40px}.brand{font-size:9px;gap:8px;letter-spacing:1.5px}.preview-tag{font-size:7px}.layout{display:flex;padding:10px 12px 0}.game-column{width:min(100%,420px,calc((100svh - 125px)*.6))}.portal-plaque{height:21px;font-size:8px;letter-spacing:1.4px}.stage{border-width:5px;border-radius:9px}.stage:after{border-radius:3px}.overlay{padding:16px}.overlay h2{font-size:clamp(28px,7.5vw,39px)}.hero-goblin{width:36%;margin:11px 0}.overlay>.primary,.overlay>.secondary{min-height:40px;font-size:12px;padding:9px 14px;margin-top:9px}.hud{inset:12px}.height strong{font-size:29px}.inventory{left:12px;top:84px}.stage-caption .text-button{font-size:9px}.end-panel h2{font-size:48px;margin:9px 0}.end-panel h2 small{font-size:9px}.end-height{font-size:10px;margin-top:7px}.end-panel #death-message{font-size:10px;margin-top:12px}.end-panel .record-message{font-size:9px}.end-panel .validation-message{font-size:9px;min-height:24px}.lesson-panel h2{font-size:29px}.lesson-panel p{font-size:12px}.lesson-guide{top:126px;font-size:9px}.touch-controls{--steer-width:128px;--steer-height:88px}}
@media(max-height:650px){.topbar{height:45px}.brand-mark{width:34px;height:34px}.game-column{width:min(100%,420px,calc((100svh - 110px)*.6))}.portal-plaque{height:17px;font-size:7px}.layout{padding-top:8px}.overlay{padding:13px}.overlay h2{font-size:28px}.hero-goblin{width:31%;margin:8px 0}.start-panel .eyebrow{font-size:7px}.overlay>.primary,.overlay>.secondary{min-height:36px;padding:8px;font-size:11px;margin-top:8px}.start-panel>p{margin-top:10px;font-size:9px}.start-panel .text-button{font-size:9px;padding:5px}.end-panel h2{font-size:40px;margin:6px 0}.end-height{font-size:9px}.result-breakdown,.end-coins{font-size:9px}.result-meter{height:8px;margin:7px 0}.end-panel #death-message{font-size:9px;margin-top:10px}.end-panel .record-message{font-size:8px;margin-top:7px}.end-panel .validation-message{font-size:8px;margin-top:7px;min-height:20px}.lesson-panel h2{font-size:26px}.lesson-panel p{font-size:11px;line-height:1.6;margin:13px 0 15px}.height strong{font-size:26px}.height>small{font-size:8px}.inventory{top:78px}.lesson-guide{top:117px}.stage-caption{min-height:33px}}
@media(max-height:500px) and (orientation:landscape){.game-column{width:calc((100svh - 104px)*.6)}.stage{border-width:3px}.portal-plaque{height:15px;font-size:6px}.overlay{overflow-y:auto;justify-content:flex-start;padding:12px 9px}.overlay h2{font-size:22px;margin:9px 0 3px}.hero-goblin{width:29%;margin:5px 0}.start-panel>.eyebrow{font-size:6px}.overlay>.primary,.overlay>.secondary{min-height:29px;font-size:9px;padding:5px;margin-top:6px}.start-panel>p{display:none}.start-panel .text-button{font-size:8px;padding:4px}.end-panel h2{font-size:30px}.end-panel #death-message{font-size:8px;line-height:1.4}.result-breakdown,.end-coins{font-size:8px}.end-panel .record-message{display:none}.end-height{font-size:8px}.end-panel .validation-message{font-size:7px;line-height:1.3}.hud{inset:8px}.height strong{font-size:21px}.height>small{font-size:6px}.height>span{font-size:6px}.inventory{top:68px;left:8px}.hud-right>span{font-size:7px;padding:2px 4px}.hud-right{gap:3px}.pause-button{width:25px;height:25px}.lesson-guide{top:100px;padding:4px;font-size:7px;left:7px;right:7px}.lesson-guide b{font-size:7px}.lesson-panel p{font-size:9px;line-height:1.5;margin:10px 0}.lesson-panel>.text-button{font-size:8px;margin-top:7px}.touch-controls{--steer-width:98px;--steer-height:68px;--steer-font:42px;width:min(calc(100vw - 32px),560px);bottom:44px}.toast{font-size:10px;top:136px}}

.inventory .coins-paused { opacity: .4; }

/* The watch sits above steering thumbs; it is absent when uncharged. */
.watch-button{position:absolute;right:16px;bottom:52px;z-index:4;width:76px;min-height:92px;padding:8px 6px;color:#efcb7f;border:1px solid #b89354;border-radius:14px;background:linear-gradient(145deg,#363042f2,#151725f5);box-shadow:inset 0 1px #ffe3a944,0 3px 12px #0007;touch-action:manipulation;display:flex;align-items:center;flex-direction:column;gap:3px}
.watch-button svg{width:32px;height:36px}.watch-button span{font-size:10px;letter-spacing:.3px}.watch-button small{font-size:7px;letter-spacing:.7px}.watch-button:focus-visible{outline:2px solid #ffe7a0;outline-offset:3px}.watch-button:disabled{opacity:1;color:#fce4a3}.watch-button.is-active{border-color:#ffe6a5;box-shadow:0 0 18px #d9ac4733,inset 0 0 10px #d9ac471c}.watch-track{width:100%;height:3px;background:#e5cb7920;border-radius:2px;overflow:hidden}.watch-track i{display:block;height:100%;width:100%;background:#efd48b;transform-origin:left}.watch-button:not(.is-active) .watch-track{display:none}.touch-input .watch-key{display:none}.touch-input .watch-button{bottom:168px;right:12px;min-height:74px;width:64px}.watch-help{font-size:13px;line-height:1.6;color:#d8c59d;padding:0 22px}
@media(max-width:800px){.touch-input .watch-button{bottom:148px}}
@media(max-height:500px) and (orientation:landscape){.touch-input .watch-button{bottom:124px;right:-84px;width:64px;min-height:74px}}

.watch-button #watch-stock{font-size:9px;letter-spacing:0;color:#ffe3a5;max-width:100%;overflow-wrap:anywhere}

/* Clean HUD experiment. Exact previous files: data/ui-rollback.json. */
.start-touch-hint{display:none}.touch-input .start-touch-hint{display:block;font-size:11px;color:#c1b79f}.touch-input .start-flavour{display:none}
.clean-hud{position:relative;inset:auto;pointer-events:auto;display:flex;align-items:center;gap:12px;height:48px;padding:0 10px;border:1px solid #9b845b;border-bottom:0;border-radius:9px 9px 0 0;background:linear-gradient(#303533,#171e20);box-shadow:inset 0 1px #dac59630}
.clean-hud #height{font:23px Georgia,serif;font-variant-numeric:tabular-nums;letter-spacing:-.5px;white-space:nowrap;color:#f4e9d0}
.gold-total{display:flex;align-items:center;gap:5px;margin-left:auto;min-width:0;color:#e6c278;white-space:nowrap}
.gold-total i{font:22px Georgia;font-style:normal}.gold-total b{font-size:13px;font-variant-numeric:tabular-nums}.gold-total.coins-paused{opacity:.4}
.clean-hud .pause-button{flex:0 0 40px;width:40px;height:40px;border:0;background:transparent;border-radius:5px;font-size:20px}
.run-started .portal-plaque{display:none}
.run-started .stage{border-top-left-radius:0;border-top-right-radius:0}
.control-dock{display:flex;justify-content:center;align-items:center;gap:10px}
.run-started .control-dock{min-height:70px;padding-top:8px}
.control-dock .watch-button{position:relative;inset:auto;width:60px;min-height:60px;height:60px;padding:5px;border-radius:50%;gap:0;flex-shrink:0}
.control-dock .watch-button svg{width:38px;height:43px;overflow:visible}
.watch-button svg>circle:first-of-type{stroke-opacity:.3}
.watch-button:not(.is-active) #watch-ring{opacity:0}
.control-dock #watch-stock{position:absolute;right:-4px;top:-3px;min-width:22px;max-width:58px;padding:3px 5px;border-radius:12px;border:1px solid #c4a466;background:#222a2b;font:bold 11px Arial;text-align:center}
.control-dock #watch-label,.control-dock .watch-key,.control-dock .watch-track{display:none}
.touch-input .run-started .control-dock{position:absolute;right:14px;bottom:48px;display:block;min-height:0;padding:0;z-index:8}
.touch-input .control-dock .watch-button{width:60px;height:60px;min-height:60px;inset:auto;background:#19232a99;border-color:#d5b776aa;box-shadow:inset 0 1px #f4d69930}
.touch-input .control-dock .watch-button.is-active{background:#332b2199;box-shadow:0 0 12px #e3c26f25}
.stage{touch-action:none}
.touch-input body.is-playing{touch-action:none;overscroll-behavior:none}
.toast{position:relative;inset:auto;z-index:auto;height:0;overflow:hidden;text-align:left;font-size:11px;line-height:1.5;color:#e5ce9d;text-shadow:none;opacity:0}
.toast.show{height:auto;margin:7px 0;padding:8px 10px;border-left:2px solid #b39765;background:#202627;opacity:1}
.lesson-guide{top:10px}
.pause-keys{font-size:11px!important;line-height:1.6!important;color:#b7c0b9;max-width:240px;margin:8px 0!important}
.touch-input .pause-keys{display:none}
@media(min-width:801px){
  .run-started .layout{grid-template-columns:minmax(160px,245px) minmax(0,min(420px,calc((100svh - 218px)*.6))) minmax(180px,245px)}
}
@media(max-width:800px){
  .run-started .topbar{height:calc(36px + env(safe-area-inset-top));padding:env(safe-area-inset-top) max(12px,env(safe-area-inset-right)) 0 max(12px,env(safe-area-inset-left))}
  .run-started .topbar .brand-mark{width:27px;height:27px}
  .run-started .topbar .brand>span,.run-started .topbar .preview-tag{display:none}
  .run-started .topbar .icon-button{width:30px;height:30px;font-size:17px}
  .run-started .layout{padding:6px 12px 0}
  .run-started .game-column{width:min(100%,420px,calc((100svh - 136px - env(safe-area-inset-top) - env(safe-area-inset-bottom))*.6 + 10px))}
  html:not(.touch-input) .run-started .game-column{width:min(100%,420px,calc((100svh - 198px)*.6 + 10px))}
  .clean-hud{height:42px;padding:0 7px;gap:7px}
  .clean-hud #height{font-size:21px}.clean-hud .gold-total b{font-size:12px}.clean-hud .pause-button{width:38px;flex-basis:38px;height:38px}
  .run-started .stage-caption{min-height:28px;justify-content:space-between;gap:4px}
  .run-started .stage-caption .caption-status{display:none}
  .run-started .stage-caption .text-button{padding:5px 0}
  .run-started footer{display:none}
}
@media(max-height:500px) and (orientation:landscape){
  .run-started .game-column,html:not(.touch-input) .run-started .game-column{width:calc((100svh - 119px)*.6 + 6px)}
  .clean-hud{height:36px;gap:3px;padding:0 4px}.clean-hud #height{font-size:17px}.clean-hud .gold-total i{font-size:17px}.clean-hud .gold-total b{font-size:10px}.clean-hud .pause-button{width:28px;height:32px;flex-basis:28px}
  .run-started .control-dock,.touch-input .run-started .control-dock{min-height:0;padding:0}
  .touch-input .run-started .control-dock{position:absolute;right:-80px;bottom:30px}
  .control-dock .watch-button{position:relative;inset:auto}

}