/* Brass, parchment and a living miniature kingdom. */
:root{--bg:#14110b;--ink:#f0e6d2;--dim:#c6b99e;--gold:#d3b363;--line:rgba(211,179,99,.4);--safe-t:env(safe-area-inset-top,0px);--safe-r:env(safe-area-inset-right,0px);--safe-b:env(safe-area-inset-bottom,0px);--safe-l:env(safe-area-inset-left,0px);color-scheme:dark}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html,body{height:100%;width:100%;background:var(--bg);color:var(--ink);font-family:system-ui,sans-serif;line-height:1.45;-webkit-tap-highlight-color:transparent}
#app{position:fixed;inset:0;overflow:hidden;background:var(--bg)}
#game{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;outline-offset:-5px}
#vignette{pointer-events:none;position:absolute;inset:0;background:radial-gradient(ellipse at 50% 38%,transparent 50%,rgba(8,6,4,.34) 100%);z-index:2}
button,a,input,select{font:inherit}
button,.secondary,.arcade-link{touch-action:manipulation}
button{cursor:pointer}
a{color:var(--gold);text-underline-offset:4px}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,canvas:focus-visible{outline:3px solid #fff0b0;outline-offset:4px}
button:disabled{opacity:.5;cursor:default}
button:active{filter:brightness(.9)}
.primary,.secondary{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:48px;padding:12px 18px;font-weight:700;text-decoration:none;border:1px solid var(--gold);border-radius:2px}
.primary{background:var(--gold);color:#21190e;letter-spacing:.09em;margin-top:20px}
.secondary{background:#241d14;color:var(--ink);margin-top:10px}
.quiet{min-height:44px;padding:9px 12px;border:0;background:none;color:var(--gold);text-decoration:underline;text-underline-offset:4px}
.button-row{display:flex;justify-content:center;flex-wrap:wrap;gap:2px 8px;margin-top:6px}
.arcade-link{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 6px;font-size:14px;color:var(--dim)}
@media(hover:hover){.primary:hover{background:#e7c982}.secondary:hover{background:#3c3020}.quiet:hover,.arcade-link:hover{color:#fff0b0}}
.icon-button{position:absolute;z-index:6;top:calc(74px + var(--safe-t));width:46px;height:46px;display:grid;place-items:center;border:1px solid var(--line);background:#19170fe8;color:var(--ink);border-radius:6px}
#mute{left:calc(12px + var(--safe-l))}#pause-button{right:calc(12px + var(--safe-r));font-size:23px}
#mute svg{width:22px;height:22px;display:block}#mute.is-muted{color:var(--dim)}
#hud{position:absolute;top:0;left:0;right:0;z-index:4;display:grid;grid-template-columns:1fr auto 1fr;align-items:start;gap:8px;padding:calc(12px + var(--safe-t)) 18px 14px;pointer-events:none;background:linear-gradient(#11140fee,transparent);text-shadow:0 2px 3px #000}
.hud-col{display:flex;flex-direction:column}.hud-center{align-items:center}.hud-right{align-items:flex-end}.hud-label{font-size:12px;letter-spacing:.14em;color:var(--dim)}
#hud-floor{font:600 clamp(22px,6vw,30px)/1.2 ui-serif,serif;letter-spacing:.03em}#hud-best,#hud-challenge{font-size:13px;color:var(--dim)}#hud-challenge{color:#fff0b0}#hud-score,#hud-streak{font-size:20px;font-weight:600;font-variant-numeric:tabular-nums}#hud-streak.is-hot{color:var(--gold)}
.overlay{position:absolute;inset:0;z-index:7;overflow-y:auto;overscroll-behavior:contain;display:flex;align-items:safe center;justify-content:center;padding:calc(28px + var(--safe-t)) calc(20px + var(--safe-r)) calc(28px + var(--safe-b)) calc(20px + var(--safe-l));background:#0e0b0866;touch-action:pan-y pinch-zoom}
.overlay-title{align-items:safe flex-end;background:linear-gradient(transparent 15%,#17100b44);padding-bottom:calc(4vh + var(--safe-b))}
.card{position:relative;flex-shrink:0;width:min(390px,100%);padding:26px;text-align:center;background:linear-gradient(145deg,#3e3021f5,#201a13fc);border:1px solid var(--line)}
.card:before,.card:after{content:"";position:absolute;top:6px;width:9px;height:9px;border:1px solid var(--gold);border-bottom:0;pointer-events:none}.card:before{left:6px;border-right:0}.card:after{right:6px;border-left:0}.wide-card{width:min(470px,100%)}
.card-title{background:linear-gradient(145deg,#4a3824ed,#251c13fa);width:min(370px,100%)}
h1,h2,.res-floor{font-family:ui-serif,serif;font-weight:600;line-height:1.08;text-wrap:balance}
h1{font-size:clamp(34px,8vw,46px);letter-spacing:.035em;margin:12px 0}h2{font-size:clamp(26px,6vw,34px);margin:10px 0 20px}
.studio{font-size:12px;letter-spacing:.19em;color:var(--gold);font-weight:700}.tagline{font-size:16px;color:var(--ink);margin:12px 0}.title-best,.res-best{color:var(--gold);font-size:14px;font-weight:600;letter-spacing:.1em}.title-challenge{font-size:16px;color:#fff0b0;margin-top:12px}.howto,.small-copy{font-size:14px;color:var(--dim);margin-top:12px}.body-copy{font-size:16px;line-height:1.5;margin:12px 0}.body-copy+.body-copy{margin-top:16px}
.res-floor{font-size:42px;margin:14px 0 4px}.res-stats{list-style:none;margin:20px 0 8px;text-align:left}.res-stats li{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #d3b36326;padding:8px 0;font-size:15px;color:var(--dim)}.res-stats b{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}.overlay-results .card{width:min(410px,100%)}
.play-cue{position:absolute;left:50%;bottom:calc(9% + var(--safe-b));transform:translateX(-50%);z-index:4;width:max-content;max-width:min(90%,480px);background:#1a160fea;border:1px solid var(--line);color:var(--ink);padding:12px 18px;text-align:center;font-size:16px;pointer-events:none}
.gust-cue{position:absolute;top:calc(124px + var(--safe-t));left:50%;transform:translateX(-50%);z-index:4;background:#201608ee;color:#fff0b0;padding:8px 14px;text-align:center;font-size:14px;max-width:80%;pointer-events:none}
#toasts{pointer-events:none;position:absolute;left:12%;right:12%;top:calc(19% + var(--safe-t));z-index:5;display:flex;flex-direction:column;align-items:center;gap:8px}.toast{background:#1e170eea;border:1px solid #d3b36366;color:#ffe3a0;padding:8px 14px;font-size:16px;text-align:center;font-weight:600;animation:toastPop 2s ease-out forwards}.toast-crown{font-family:ui-serif,serif;font-size:24px}.toast-mason,.toast-favor{font-size:17px}@keyframes toastPop{0%{opacity:0;transform:translateY(6px)}12%,80%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-5px)}}
.setting-row,.slider-row{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:56px;text-align:left;border-top:1px solid #d3b36326;padding:14px 0;font-size:16px}.setting-row small{display:block;font-size:14px;max-width:270px;color:var(--dim);margin-top:4px}.setting-row input{width:24px;height:24px;flex-shrink:0;accent-color:var(--gold)}.slider-row{display:block}.slider-row>span{display:flex;justify-content:space-between}.slider-row input{width:100%;height:36px;accent-color:var(--gold)}output{font-variant-numeric:tabular-nums;color:var(--gold)}select{min-height:44px;padding:8px;color:var(--ink);background:#241d14;border:1px solid var(--line)}
.rewards{text-align:left;margin:18px 0;font-size:15px}.rewards>div{display:grid;grid-template-columns:85px 1fr;gap:14px;padding:8px 0;border-top:1px solid #d3b36326}.rewards dt{color:var(--gold);font-weight:700}.rewards dd{color:var(--dim)}
.rule-demo{position:relative;height:62px;margin:14px auto;width:200px;overflow:hidden}.rule-target,.rule-stone{position:absolute;width:86px;height:24px;left:57px;top:34px;background:#8b7759;border:1px solid #e4cd92}.rule-stone{top:8px;background:#decaa4;animation:demoStone 4s ease-in-out infinite}@keyframes demoStone{0%,100%{transform:translateX(-60px)}42%,58%{transform:translateX(0)}75%{transform:translateX(50px)}}
.view-back{position:absolute;bottom:calc(30px + var(--safe-b));left:50%;transform:translateX(-50%);width:auto;z-index:7}
#share-fallback{display:block}#share-url{display:block;width:100%;margin-top:8px;padding:10px;border:1px solid var(--line);background:#14110b;color:var(--ink)}
.intro-layer{position:absolute;inset:0;z-index:7;pointer-events:none}#skip-intro{position:absolute;top:calc(16px + var(--safe-t));right:calc(16px + var(--safe-r));width:auto;pointer-events:auto;margin:0}.intro-caption{position:absolute;bottom:calc(7% + var(--safe-b));left:50%;transform:translateX(-50%);width:min(520px,90%);text-align:center;background:#19140df2;padding:20px 24px;border:1px solid var(--line)}#intro-caption{font:500 clamp(20px,5vw,27px)/1.3 ui-serif,serif;margin:8px 0 12px}#intro-progress{display:block;width:0;height:2px;background:var(--gold)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.reduce-motion *,.reduce-motion *:before,.reduce-motion *:after{animation:none!important;scroll-behavior:auto!important}.reduce-motion .rule-stone{transform:none}
@media(prefers-reduced-motion:reduce){.toast,.rule-stone{animation:none}}
@media(min-width:900px) and (min-height:620px){.overlay-title{justify-content:flex-start;padding-left:max(5vw,32px);align-items:center}.overlay-results{justify-content:flex-end;padding-right:max(5vw,32px)}}
@media(max-height:560px){.overlay{align-items:flex-start;padding:12px max(16px,var(--safe-r)) max(12px,var(--safe-b)) max(16px,var(--safe-l))}.card{padding:22px}.overlay-title .card{margin:auto 0}h1{font-size:32px}h1 br{display:none}h1 br:after{content:" "}.tagline{margin:8px 0}.primary{margin-top:14px}.play-cue{bottom:18px;max-width:60%;padding:8px 12px;font-size:14px}.icon-button{top:calc(64px + var(--safe-t))}#hud{padding-top:8px}.intro-caption{bottom:14px;padding:12px 20px}}
@media(max-width:350px){.overlay{padding-left:12px;padding-right:12px}.card{padding:22px 18px}.hud-label{font-size:11px}#hud{padding-left:12px;padding-right:12px}.rewards>div{grid-template-columns:76px 1fr;gap:10px}.setting-row{gap:12px}}
