:root{--ink:#f6efe2;--dim:#f6efe2a8;--gold:#f4b84a;--rust:#cf5a3c;--teal:#2f8f8a;--panel:#181511b8;--line:#f6efe224;--slab:"Rockwell", "Roboto Slab", "Zilla Slab", "Sitka Heading", Georgia, serif;--sans:"Avenir Next", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", sans-serif}*{box-sizing:border-box}html,body{height:100%;color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none;touch-action:none;background:#1b1a17;margin:0;overflow:hidden}#scene{width:100%;height:100%;display:block;position:fixed;inset:0}[hidden]{display:none!important}h1,h2,h3{font-family:var(--slab);margin:0;font-weight:700}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0}.glass{background:var(--panel);-webkit-backdrop-filter:blur(14px)saturate(1.2);border:1px solid var(--line);box-shadow:0 18px 50px #0006}#loading{z-index:50;background:#1b1a17 50%/cover no-repeat;place-items:end start;padding:clamp(24px,6vw,72px);transition:opacity .9s;display:grid;position:fixed;inset:0}#loading:before{content:"";background:linear-gradient(200deg,#14100c00 30%,#14100cd1 88%);position:absolute;inset:0}#loading.done{opacity:0;pointer-events:none}#loading .card{max-width:520px;position:relative}#loading h1{letter-spacing:-.02em;text-shadow:0 4px 30px #0000008c;font-size:clamp(44px,8vw,92px);line-height:.92}#loading h1 span,.brand h1 span{color:var(--gold)}#loading p{color:var(--dim);margin:14px 0 18px;font-size:17px}.bar{background:#ffffff29;border-radius:6px;height:6px;overflow:hidden}.bar i{background:linear-gradient(90deg, var(--rust), var(--gold));border-radius:6px;width:0;height:100%;transition:width .25s;display:block}#menu{pointer-events:none;align-items:stretch;display:flex;position:fixed;inset:0}#menu .panel{pointer-events:auto;scrollbar-width:thin;border-radius:22px;flex-direction:column;gap:14px;width:min(430px,100vw);margin:18px;padding:22px 22px 18px;display:flex;overflow-y:auto}.brand{align-items:center;gap:14px;display:flex}.brand img{filter:drop-shadow(0 6px 14px #00000073);width:68px;height:68px}.brand h1{letter-spacing:-.01em;font-size:38px;line-height:.95}.brand p{color:var(--dim);margin:5px 0 0;font-size:14px}.field h2{font-family:var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-bottom:7px;font-size:11.5px;font-weight:700}.blurb{min-height:1.3em;color:var(--dim);margin:7px 0 0;font-size:13.5px}.coats{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.coat{background:#ffffff0d;border:1.5px solid #0000;border-radius:14px;justify-items:center;gap:5px;padding:8px 2px 7px;font-size:12px;font-weight:600;transition:background .15s,border-color .15s,transform .15s;display:grid}.coat i{border:2px solid #ffffff47;border-radius:50%;width:38px;height:38px;box-shadow:inset 0 -6px 10px #00000059}.coat:hover{background:#ffffff1a;transform:translateY(-1px)}.coat.on{border-color:var(--gold);background:#f4b84a24}.seg{background:#ffffff0f;border-radius:13px;gap:4px;padding:4px;display:flex}.seg button{color:var(--dim);white-space:nowrap;border-radius:10px;flex:1;padding:8px 6px;font-size:13.5px;font-weight:600;transition:background .15s,color .15s}.seg button:hover{color:var(--ink)}.seg button.on{background:var(--ink);color:#1d1a15}.pair{grid-template-columns:1fr 1fr;gap:12px;display:grid}.check{color:var(--dim);cursor:pointer;align-items:center;gap:9px;font-size:13.5px;display:flex}.check input{accent-color:var(--gold);width:16px;height:16px}.primary{font-family:var(--slab);color:#241806;background:linear-gradient(180deg, #ffd27a, var(--gold));border-radius:15px;margin-top:4px;padding:15px 18px;font-size:21px;font-weight:700;transition:transform .12s,box-shadow .12s;box-shadow:0 10px 26px #f4b84a52,inset 0 1px #ffffff8c}.primary:hover{transform:translateY(-2px);box-shadow:0 14px 32px #f4b84a6b,inset 0 1px #ffffff8c}.primary:active{transform:translateY(0)}.ghost{border:1px solid var(--line);background:#ffffff0d;border-radius:13px;padding:11px 16px;font-size:14.5px;font-weight:600;transition:background .15s}.ghost:hover{background:#ffffff1f}.foot{color:var(--dim);justify-content:space-between;align-items:center;gap:10px;font-size:12.5px;display:flex}.foot select{font:inherit;color:var(--ink);border:1px solid var(--line);background:#ffffff14;border-radius:8px;padding:4px 6px}.foot select option{color:#111}.howto{pointer-events:auto;border-radius:18px;width:min(390px,100vw - 36px);padding:16px 18px;font-size:13.5px;line-height:1.5;position:absolute;bottom:18px;right:18px}.howto h3{margin-bottom:8px;font-size:17px}.howto ul{grid-template-columns:auto 1fr;align-items:baseline;gap:5px 12px;margin:0 0 10px;padding:0;list-style:none;display:grid}.howto li{display:contents}kbd{min-width:22px;font:600 11.5px var(--sans);text-align:center;background:#ffffff14;border:1px solid #ffffff40;border-bottom-width:2px;border-radius:6px;padding:1px 6px;display:inline-block}.howto p{color:var(--dim);margin:0}#hud{pointer-events:none;font-variant-numeric:tabular-nums;position:fixed;inset:0}.hud-top{grid-template-columns:1fr auto 1fr;align-items:start;gap:12px;display:grid;position:absolute;top:14px;left:14px;right:14px}.pill{border-radius:16px;justify-self:start;align-items:center;gap:10px;padding:9px 15px;display:inline-flex}.pill svg{width:30px;height:24px}#count b{font:700 26px var(--slab)}#count span{color:var(--dim);font-size:14px}#timer{font:700 34px var(--slab);letter-spacing:.02em;border-radius:18px;justify-self:center;padding:7px 22px 8px}#timer.low{color:#ffb49f;animation:1s infinite pulse}@keyframes pulse{50%{transform:scale(1.06)}}#view{pointer-events:auto;justify-self:end;padding:9px 13px;font-size:13.5px;font-weight:600}#view small{color:var(--dim);font-weight:500}#toast{font:700 18px var(--slab);opacity:0;white-space:nowrap;border-radius:14px;padding:8px 18px;transition:opacity .25s,transform .25s;position:absolute;top:84px;left:50%;transform:translate(-50%)}#toast.show{opacity:1;transform:translate(-50%)translateY(4px)}#toast.good{color:#ffe2a2}#toast.bad{color:#ffb49f}#countdown{font:700 clamp(54px, 10vw, 120px) var(--slab);text-shadow:0 6px 40px #0009;opacity:0;place-items:center;transition:opacity .2s;display:grid;position:absolute;inset:0}#countdown.show{opacity:1}.meters{border-radius:16px;gap:8px;width:210px;padding:12px 14px;display:grid;position:absolute;bottom:14px;left:14px}.meter{letter-spacing:.1em;text-transform:uppercase;color:var(--dim);grid-template-columns:52px 1fr;align-items:center;gap:8px;font-size:11.5px;font-weight:700;display:grid}.meter .bar i{transition:none}.meter.winded .bar i{background:#d65b4a}.meter.bark .bar i{background:linear-gradient(90deg,#7fc8c4,#cdf3ef)}.stance{color:var(--dim);min-height:1.2em;font-size:12.5px}.stance b{color:var(--gold)}#map{border-radius:16px;width:232px;height:174px;position:absolute;bottom:14px;right:14px}#keys{color:var(--dim);white-space:nowrap;border-radius:13px;padding:8px 14px;font-size:12.5px;transition:opacity .6s;position:absolute;bottom:16px;left:50%;transform:translate(-50%)}#keys.fade{opacity:0}#touch{pointer-events:none;position:absolute;inset:0}#stick{pointer-events:auto;background:#14120e61;border:1.5px solid #ffffff40;border-radius:50%;place-items:center;width:132px;height:132px;display:grid;position:absolute;bottom:96px;left:18px}#knob{background:#f6efe2cc;border-radius:50%;width:54px;height:54px}.tbtns{pointer-events:auto;grid-template-columns:1fr 1fr;gap:10px;display:grid;position:absolute;bottom:16px;right:16px}.tbtns button{background:#14120e80;border:1.5px solid #ffffff4d;border-radius:50%;width:62px;height:62px;font-size:13px;font-weight:700}.tbtns button.on,.tbtns button:active{background:var(--gold);color:#241806}#hud.touching #map{width:128px;height:96px;inset:66px auto auto 14px}#hud.touching #keys{display:none}.overlay{z-index:20;background:radial-gradient(#0f0c0959,#0f0c09b8);place-items:center;display:grid;position:fixed;inset:0}.sheet{text-align:center;border-radius:24px;gap:12px;width:min(460px,100vw - 32px);padding:28px 28px 22px;display:grid}.sheet h2{font-size:34px;line-height:1}.sheet .big{font:700 76px/1 var(--slab);color:var(--gold)}.sheet .big small{color:var(--dim);font-size:30px}.sheet p{color:var(--dim);margin:0}.stats{grid-template-columns:repeat(3,1fr);gap:8px;margin:4px 0;display:grid}.stats div{color:var(--dim);background:#ffffff0f;border-radius:12px;padding:10px 6px;font-size:12px}.stats b{font:700 19px var(--slab);color:var(--ink);display:block}.sheet .actions{gap:8px;margin-top:6px;display:grid}.record{font-weight:700;color:var(--gold)!important}@media (max-width:1100px){.howto{display:none}}@media (max-width:860px){#map{width:150px;height:112px;top:70px;bottom:auto}#keys{display:none}.meters{width:170px}}@media (max-width:620px){#menu .panel{background:#1815118c;width:calc(100vw - 20px);margin:10px}}@media (max-height:760px){#menu .panel{gap:10px;margin:10px;padding:16px 18px 14px}.brand img{width:52px;height:52px}.brand h1{font-size:30px}.coat i{width:30px;height:30px}}