@font-face{font-family:Hound;src:url('./assets/hound-display-latin.woff2') format('woff2');font-display:swap}
:root{--ink:#e4dfc6;--muted:#b1b5a2;--jade:#a6e7b5;--gold:#bbad79;--night:#101c19;--edge:#bbb68c40}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{background:var(--night);color:var(--ink);font:16px Georgia,serif;isolation:isolate}button{font:inherit;cursor:pointer}button:disabled{cursor:wait;opacity:.6}button:focus-visible,#stage:focus-visible{outline:2px solid var(--jade);outline-offset:5px}button{touch-action:manipulation}button:active{transform:translateY(1px)}[hidden]{display:none!important}
.world,.atmosphere{position:fixed;inset:0;pointer-events:none;z-index:-2}.world{background:url('./assets/district.webp') center 65%/cover no-repeat;opacity:.8;transition:opacity 1.2s;transform:scale(1.03)}.atmosphere{z-index:-1;background:linear-gradient(90deg,#071510e8 0%,#0d1d1477 35%,#08171022 63%,#07151080),linear-gradient(0deg,#071710ed,transparent 43%,#081410a8),radial-gradient(ellipse at 58% 43%,transparent 10%,#06151066 80%)}
header{height:100px;margin:0 4%;display:flex;align-items:center;gap:30px;border-bottom:1px solid var(--edge);position:relative;z-index:5}.brand{width:106px;height:65px;object-fit:contain}.event-name,.eyebrow,.tools button,.edition,.personal,.milestone,.primary,.text-button,footer,.result-numbers span,.prototype-note{font-family:ui-monospace,'Courier New',monospace;font-size:10px;letter-spacing:2px;font-weight:400}.event-name{color:var(--muted)}.event-name i{font-style:normal;margin:0 12px;opacity:.5}.tools{margin-left:auto;display:flex;gap:12px}.tools button{color:var(--ink);background:#0a17164d;border:1px solid var(--edge);padding:0 15px;min-height:44px;letter-spacing:1.2px}.tools button:hover{border-color:var(--jade)}
main{height:calc(100dvh - 148px);position:relative}.intro{position:absolute;left:6.8%;top:12%;width:31%;z-index:2;pointer-events:none}.eyebrow{color:var(--jade);letter-spacing:2.6px}.eyebrow>span{display:inline-block;width:5px;height:5px;background:var(--jade);margin:0 10px 2px 0;transform:rotate(45deg)}h1{font-family:Hound,Georgia,serif;font-weight:400;font-size:clamp(54px,6.4vw,100px);line-height:.98;margin:28px 0 24px;letter-spacing:-2px;text-shadow:0 4px 24px #06100c}h1 em{font-style:normal;color:#b7d6ae}.story{font-size:21px;font-style:italic;line-height:1.5;color:#cfceb8}.rules{display:grid;grid-template-columns:26px 1fr;gap:20px 8px;border-top:1px solid var(--edge);padding-top:25px;margin-top:32px;max-width:285px}.rules p{font-size:14px;line-height:1.7;margin:0;color:var(--muted)}.rule-number{color:var(--gold);font-style:italic;font-size:16px;padding-top:3px}.edition{color:var(--muted);font-size:9px;letter-spacing:1.8px;margin-top:30px}
#stage{position:absolute;left:31%;right:9%;top:0;bottom:0;touch-action:none;outline-offset:-5px;cursor:crosshair;-webkit-tap-highlight-color:transparent}#stage canvas{width:100%;height:100%;display:block}.scoreboard{position:absolute;top:8%;right:5%;z-index:2;pointer-events:none;text-align:right;display:flex;flex-direction:column;gap:35px}.score-block{display:flex;flex-direction:column}.score-block>strong{font:74px Georgia,serif;line-height:1.25;font-variant-numeric:tabular-nums}.personal{font-size:9px;letter-spacing:1px;color:var(--muted)}.personal b{color:var(--ink);margin-left:8px;font-weight:400}.time-block>strong{display:block;font:31px Georgia,serif;font-variant-numeric:tabular-nums;margin:9px 0 13px}.time-block>strong span{font-size:15px;color:var(--muted);margin-left:3px}.time-track{height:2px;width:110px;background:#e4dfc629;margin-left:auto}#time-fill{height:100%;width:100%;background:var(--jade);transform-origin:left;transition:transform .1s linear}.milestone{position:absolute;right:5%;bottom:17%;width:110px;color:var(--muted);font-size:9px;letter-spacing:1.2px;pointer-events:none}.milestone b{display:block;font-weight:400;color:var(--ink);margin:10px 0}.milestone>div{height:2px;background:#e4dfc629}.milestone i{height:100%;display:block;background:var(--jade);width:0;transition:width .2s}
.action-dock{position:absolute;left:35%;right:14%;bottom:2.5%;text-align:center;z-index:3;pointer-events:none}#hint{font-size:16px;font-style:italic;color:#d5dac5;margin:0 0 17px;text-shadow:0 2px 5px #05100a}.primary{background:#c6d9ad;color:#17291b;border:1px solid #e6e5bf;min-width:248px;min-height:53px;letter-spacing:2px;padding:15px 26px;box-shadow:0 5px 35px #07171155;pointer-events:auto;transition:background .15s}.primary:hover{background:#e0efc7}.primary span{margin-left:25px}.action-dock p:last-child{font-size:12px;color:var(--muted);margin:15px 0 0;line-height:1.8}kbd{font:9px ui-monospace,monospace;border:1px solid var(--edge);padding:3px 5px;letter-spacing:1px;margin-right:3px}#feedback{position:absolute;top:13%;left:35%;right:15%;text-align:center;font-family:Hound,Georgia,serif;font-size:29px;color:#d4ffc3;text-shadow:0 0 20px #75f58a88;opacity:0;transition:opacity .13s;pointer-events:none;z-index:4}#feedback.visible{opacity:1}
footer{height:48px;margin:0 4%;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--edge);color:var(--muted);font-size:8px;letter-spacing:1.8px;position:relative;z-index:5}.result{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);width:440px;max-width:calc(100% - 32px);background:linear-gradient(135deg,#18291ef5,#0c1b17fa);border:1px solid #a8b17b80;padding:36px;text-align:center;box-shadow:0 30px 100px #0009;z-index:6}.result:before,.result:after{content:'';position:absolute;inset:6px;border:1px solid #b7b78b22;pointer-events:none}.result h2{font-family:Hound,Georgia,serif;font-size:33px;line-height:1.15;font-weight:400;margin:21px 0}.result-numbers{display:flex;justify-content:center;gap:40px;padding:20px 0;border-block:1px solid var(--edge)}.result-numbers strong{display:block;font-size:52px;font-weight:400;color:var(--jade)}.result-numbers span{font-size:9px;letter-spacing:1px;color:var(--muted)}#result-copy{line-height:1.6;font-style:italic;font-size:16px;min-height:50px}.result .primary{width:100%;min-width:0}.text-button{display:block;background:none;border:0;color:var(--ink);margin:8px auto;min-height:44px;letter-spacing:1px}.prototype-note{font-size:9px;letter-spacing:0;line-height:1.6;color:var(--muted);margin:8px 0 0}body[data-state=over] .action-dock,body[data-state=over] .intro{opacity:.15;pointer-events:none}body[data-state=over] .action-dock button{pointer-events:none}body[data-state=playing] #action{background:#102419c9;border-color:#a2c89666;color:#d4dfbe}body[data-state=playing] .world{opacity:.55}
@media(min-width:1100px) and (max-height:760px){.intro{top:6%}h1{font-size:68px;margin:20px 0}.rules{margin-top:20px;padding-top:20px;gap:12px}.edition{margin-top:18px}.story{font-size:18px}.action-dock{bottom:1%}}
@media(max-width:760px){header{height:76px;margin:0 20px;gap:12px}.brand{width:78px;height:48px}.event-name{font-size:8px;letter-spacing:1px}.event-name i{margin:0 3px}.tools{gap:5px}.tools button{font-size:8px;padding:0 9px;letter-spacing:.5px}.tools #pause{width:44px;padding:0;font-size:8px}main{height:calc(100dvh - 111px)}.intro{top:20px;left:24px;width:70%}.intro .eyebrow{font-size:8px;letter-spacing:1.8px;margin:0 0 13px}.intro h1{font-size:47px;line-height:.96;letter-spacing:-1px;margin:0}.intro h1 br{display:none}.intro h1 em{display:block}.story{font-size:14px;line-height:1.4;margin:12px 0}.story br{display:none}.rules,.edition{display:none}.scoreboard{top:24px;right:24px;gap:16px}.scoreboard .eyebrow{font-size:8px;letter-spacing:1.5px}.score-block>strong{font-size:46px}.personal{font-size:8px;letter-spacing:0}.personal b{margin-left:4px}.time-block>strong{font-size:24px;margin:6px 0 8px}.time-track{width:68px}#stage{left:0;right:0;top:100px;bottom:70px}.action-dock{left:20px;right:20px;bottom:15px}#hint{font-size:14px;margin-bottom:12px}.primary{min-height:50px;min-width:240px;font-size:10px}.action-dock p:last-child{margin-top:10px;font-size:10px}.action-dock p:last-child span{display:none}.milestone{right:24px;bottom:153px;width:73px;font-size:8px;letter-spacing:.5px}.milestone b{margin:6px 0}#feedback{top:28%;left:15%;right:15%;font-size:23px}footer{height:35px;margin:0 20px;font-size:7px;letter-spacing:.7px}footer span:last-child{display:none}.world{background-position:52% 50%;opacity:.65}.atmosphere{background:linear-gradient(180deg,#071510bd,transparent 40%,#071710e8),linear-gradient(90deg,#08180d66,transparent,#08180d55)}.result{padding:26px;top:48%}.result h2{font-size:30px}.result-numbers{padding:12px 0}.result-numbers strong{font-size:44px}body[data-state=playing] .intro .story{opacity:0}}
@media(max-height:650px) and (max-width:760px){header{height:62px}main{height:calc(100dvh - 92px)}footer{height:30px}.intro{top:13px}.intro h1{font-size:37px}.intro .eyebrow{font-size:7px;margin-bottom:9px}.story{display:none}.scoreboard{top:12px;gap:9px}.score-block>strong{font-size:36px}#stage{top:65px;bottom:65px}.action-dock{bottom:8px}#hint{margin-bottom:7px}.milestone{bottom:130px}.result{padding:20px}.result h2{margin:14px 0}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important}.world{transform:none}}
@media(orientation:landscape) and (max-height:550px){header{height:58px;margin:0 3%}.brand{width:80px;height:45px}.event-name{font-size:8px}.tools button{min-height:38px;font-size:8px}main{height:calc(100dvh - 88px)}footer{height:30px;font-size:7px;margin:0 3%}.intro{left:5%;top:12%;width:25%}.intro .eyebrow{font-size:7px;letter-spacing:1px}.intro h1{font-size:45px;margin:14px 0}.intro .story,.rules,.edition{display:none}#stage{left:27%;right:17%;top:-15px;bottom:30px}.scoreboard{right:5%;top:7%;gap:10px}.scoreboard .eyebrow{font-size:8px}.score-block>strong{font-size:42px}.time-block>strong{font-size:24px;margin:5px 0}.time-track{width:70px}.action-dock{left:30%;right:24%;bottom:5px}.action-dock #hint,.action-dock #controls{display:none}.action-dock .primary{min-height:40px;padding:10px 15px;min-width:190px;font-size:9px}.milestone{bottom:7%;width:95px}.result{padding:18px 25px;width:440px;top:49%}.result h2{font-size:25px;margin:8px 0}.result .eyebrow{margin:0}.result-numbers{padding:6px 0}.result-numbers strong{font-size:30px}.result-numbers span{font-size:8px}#result-copy{font-size:13px;margin:8px 0;min-height:0}.result .primary{min-height:40px;padding:10px}.result .text-button{min-height:30px;margin:0 auto}.prototype-note{margin:2px 0 0;font-size:8px}#feedback{top:3%;font-size:21px}}
