:root{
--page:#FBD8A5;--frame:#6B4630;--frame-hi:#96684A;--frame-lo:#482D1E;
--surface:#F7E3C0;--surface-2:#EFD5AC;--slot:#D9B383;--slot-deep:#A87B4C;
--hi:#FFF3DA;--edge:#C99E6C;--ink:#3D2B2A;--ink-soft:#6B5049;--ink-faint:#94756A;
--gold:#E9A93A;--gold-hi:#F7CE72;--gold-d:#A8741E;--clay:#C2685A;--clay-d:#8E4237}
*{box-sizing:border-box;border-radius:0!important}
html{scroll-behavior:smooth}
body{margin:0;background:var(--page);color:var(--ink);font-family:"Instrument Sans",ui-sans-serif,system-ui,sans-serif;font-size:16px;line-height:1.62;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:focus-visible{outline:3px solid var(--gold-hi);outline-offset:3px}
.page-shell{width:min(1460px,calc(100% - 30px));margin:0 auto;padding:24px 0 40px}
.chest{border:4px solid var(--frame-lo);background:var(--frame);box-shadow:inset 4px 4px 0 var(--frame-hi),inset -4px -4px 0 var(--frame-lo)}
.title-bar{min-height:84px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 20px;background:var(--frame);color:var(--page);border-bottom:4px solid var(--frame-lo);box-shadow:inset 3px 3px 0 var(--frame-hi),inset -3px -3px 0 var(--frame-lo)}
.wordmark{display:flex;flex-direction:column;gap:3px}
.wordmark strong{font-family:"Bricolage Grotesque",sans-serif;font-size:30px;line-height:1;letter-spacing:-.03em}
.wordmark span,.eyebrow,.slot span,.loop-card span,.loop-return,.rung span,.boost-band span,.footer,.mascot-placeholder span{font-family:"DM Mono",monospace;font-size:10px;line-height:1.3;letter-spacing:.15em;text-transform:uppercase}
.wordmark span{color:var(--surface-2)}
.title-actions{display:flex;align-items:center;gap:10px}
.button{min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:0 16px;border:3px solid var(--frame-lo);background:var(--surface-2);color:var(--ink);font-family:"DM Mono",monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;font-weight:500;box-shadow:inset 3px 3px 0 var(--hi),inset -3px -3px 0 var(--edge)}
.button:active{box-shadow:inset 3px 3px 0 var(--edge),inset -3px -3px 0 var(--hi)}
.button-gold{background:var(--gold);box-shadow:inset 3px 3px 0 var(--gold-hi),inset -3px -3px 0 var(--gold-d)}
.button-gold:active{box-shadow:inset 3px 3px 0 var(--gold-d),inset -3px -3px 0 var(--gold-hi)}
.surface{background:var(--surface);padding:0 34px;box-shadow:inset 3px 3px 0 var(--hi),inset -3px -3px 0 var(--edge)}
.section-rule{padding:46px 0;border-bottom:4px solid var(--frame)}
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,430px);gap:44px;align-items:center}
.eyebrow{color:var(--gold-d);font-weight:500;margin-bottom:10px}
h1,h2{font-family:"Bricolage Grotesque",sans-serif;font-weight:800;letter-spacing:-.03em}
h1{max-width:18ch;margin:0;font-size:clamp(48px,6vw,84px);line-height:.95}
h2{max-width:20ch;margin:0 0 12px;font-size:clamp(34px,4vw,52px);line-height:1}
.hero-sub,.ratchet-copy p{max-width:44ch;color:var(--ink-soft)}
.hero-sub{margin:18px 0 24px;font-size:19px;line-height:1.55}
.hero-button{width:max-content;min-width:168px}
.mascot-placeholder{aspect-ratio:1/1;display:grid;place-items:center;border:3px solid var(--frame);background:var(--surface-2);color:var(--ink-faint);box-shadow:inset 3px 3px 0 var(--slot-deep),inset -3px -3px 0 var(--hi)}
.mascot-placeholder span{text-align:center;max-width:18ch}
.slot-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:9px}
.slot{aspect-ratio:1/1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:14px;border:3px solid var(--frame);background:var(--slot);box-shadow:inset 3px 3px 0 var(--slot-deep),inset -3px -3px 0 var(--hi)}
.slot strong{font-family:"Bricolage Grotesque",sans-serif;font-size:clamp(28px,3vw,42px);letter-spacing:-.03em;line-height:1;color:var(--gold-d)}
.slot span{margin-top:9px;color:var(--ink-soft)}
.loop-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;max-width:980px;margin-top:26px}
.loop-card{min-height:170px;padding:18px;border:3px solid var(--frame);background:var(--slot);box-shadow:inset 3px 3px 0 var(--slot-deep),inset -3px -3px 0 var(--hi)}
.loop-card span{color:var(--gold-d)}
.loop-card p{max-width:30ch;margin:18px 0 0;font-size:18px;line-height:1.45}
.loop-final{background:var(--gold);box-shadow:inset 3px 3px 0 var(--gold-hi),inset -3px -3px 0 var(--gold-d)}
.loop-final span{color:var(--ink)}
.loop-return{margin-top:12px;color:var(--gold-d)}
.ratchet{display:grid;grid-template-columns:minmax(0,.8fr) minmax(420px,1.2fr);gap:48px;align-items:end}
.ratchet-copy p{margin:0}
.ratchet-chart{min-height:320px;display:grid;grid-template-columns:repeat(7,1fr);gap:9px;align-items:end}
.rung{min-height:64px;padding:12px 8px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;border:3px solid var(--frame);background:var(--slot);box-shadow:inset 3px 3px 0 var(--hi),inset -3px -3px 0 var(--edge)}
.rung strong{font-family:"Bricolage Grotesque",sans-serif;font-size:26px;line-height:1}
.rung span{margin-top:6px;color:var(--ink-soft)}
.rung-1{height:26%}.rung-2{height:34%}.rung-3{height:42%}.rung-4{height:54%}.rung-5{height:68%}.rung-6{height:82%}.rung-7{height:100%;background:var(--gold);box-shadow:inset 3px 3px 0 var(--gold-hi),inset -3px -3px 0 var(--gold-d)}
.boost-band{margin:0 -34px;padding:22px 34px;display:grid;grid-template-columns:220px minmax(0,1fr);gap:20px;align-items:center;background:var(--gold);border-top:4px solid var(--frame);border-bottom:4px solid var(--frame);box-shadow:inset 3px 3px 0 var(--gold-hi),inset -3px -3px 0 var(--gold-d)}
.boost-band span{color:var(--ink);font-weight:500}.boost-band p{max-width:72ch;margin:0;font-weight:600}
.footer{padding:18px 20px;color:var(--page);background:var(--frame);border-top:4px solid var(--frame-lo);box-shadow:inset 3px 3px 0 var(--frame-hi),inset -3px -3px 0 var(--frame-lo)}
.footer-top{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
.footer-links{display:flex;flex-wrap:wrap;gap:18px;margin-top:12px}.footer a{color:var(--gold-hi)}
@media(max-width:880px){
.page-shell{width:min(100% - 14px,880px);padding:8px 0 18px}
.chest{border-width:3px;box-shadow:inset 3px 3px 0 var(--frame-hi),inset -3px -3px 0 var(--frame-lo)}
.title-bar{align-items:flex-start;flex-direction:column;border-bottom-width:3px}.title-actions{width:100%}.title-actions .button{flex:1}
.surface{padding:0 18px;box-shadow:inset 2px 2px 0 var(--hi),inset -2px -2px 0 var(--edge)}
.section-rule{padding:34px 0;border-bottom-width:3px}.hero,.ratchet{grid-template-columns:1fr}.mascot-placeholder{width:min(100%,420px);justify-self:center}
.loop-grid{grid-template-columns:1fr 1fr}.ratchet-chart{min-height:260px}.boost-band{margin:0 -18px;padding:18px;grid-template-columns:1fr;border-top-width:3px;border-bottom-width:3px}.footer{border-top-width:3px}
}
@media(max-width:560px){
.wordmark strong{font-size:26px}h1{font-size:48px}h2{font-size:36px}.slot-grid{grid-template-columns:repeat(2,1fr)}.loop-grid{grid-template-columns:1fr}
.ratchet-chart{min-height:220px;gap:5px}.rung{padding:8px 4px;border-width:2px}.rung strong{font-size:20px}.rung span{font-size:8px}
}