:root {
 color-scheme:dark; --ink:#e4e4df; --muted:#929bac; --accent:#ddc698; --gold:#a28b60; --panel:#0e1624; --line:#ddc6982c; --hud-height:36px; --touch-size:66px; --touch-opacity:.6;
 font-family:"Hiragino Kaku Gothic ProN","Noto Sans JP",Meiryo,sans-serif; background:#050810; color:var(--ink);
}
*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;overscroll-behavior:none}button,input{font:inherit}button{color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}button:disabled{cursor:default;opacity:.3}button:focus-visible,input:focus-visible{outline:1px solid var(--accent);outline-offset:5px}button svg{pointer-events:none}button[hidden],.hidden{display:none!important}.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}
.app{height:100%;height:100dvh;display:flex;align-items:center;justify-content:center;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);background:radial-gradient(ellipse at 50% 50%,#111c2b,#050810 75%)}
.game-shell{width:min(100%,calc((100dvh - var(--hud-height) - env(safe-area-inset-top) - env(safe-area-inset-bottom)) * 4 / 3));position:relative;background:#0a1220;box-shadow:0 0 80px #0008}
body[data-mode=title] .game-shell{width:min(100%,calc((100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom)) * 4 / 3))}
.game-shell:fullscreen{width:100%!important;height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#050810}
.game-shell:fullscreen>.arena,.game-shell:fullscreen>.hud{width:min(100%,calc((100dvh - var(--hud-height)) * 4 / 3))}
body[data-mode=title] .game-shell:fullscreen>.arena{width:min(100%,calc(100dvh * 4 / 3))}
.arena{position:relative;aspect-ratio:4/3;width:100%;overflow:hidden;container-type:inline-size;isolation:isolate}
canvas{display:block;width:100%;height:100%;image-rendering:pixelated;touch-action:none}canvas:focus{outline:none}
.hud{height:var(--hud-height);padding:0 13px;display:flex;align-items:center;gap:18px;background:#101a29;border-bottom:1px solid #c2cad018;position:relative;z-index:4;font-size:10px}
.chapter{display:flex;gap:12px;align-items:center;flex:1;min-width:0}.chapter strong{font:11px/1 monospace;letter-spacing:.14em;color:var(--accent);white-space:nowrap}.chapter>span:last-child{color:#aab4c1;font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hud-divider{width:1px;height:10px;background:var(--line)}
.live-stats{display:flex;gap:20px}.live-stats>div{display:flex;align-items:center;gap:7px}.live-stats b{font:12px monospace;letter-spacing:.04em;font-variant-numeric:tabular-nums;color:#bec9d6}.live-stats svg{width:14px;height:14px;fill:none;stroke:#a6b0be;stroke-width:1.4}.timer-icon{width:11px;height:11px;border:1px solid #8997a8;border-radius:50%;position:relative}.timer-icon:after{content:"";position:absolute;left:4px;top:1px;height:4px;width:3px;border-left:1px solid #8997a8;border-bottom:1px solid #8997a8}
.icon-button{border:0;background:transparent;width:30px;height:30px;padding:7px;color:#a6b2c4;display:grid;place-items:center;flex-shrink:0}.icon-button svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.icon-button:hover{background:#ddc6980c;color:var(--accent)}.mute-line{display:none}.muted .mute-line{display:block}.pause-button{border-left:1px solid var(--line);padding-left:12px;width:35px}.pause-button svg{stroke-width:2.6}
.utility{position:absolute;bottom:20px;right:22px;display:flex;gap:8px;z-index:8}.utility .icon-button{background:#08101e80;border:1px solid #c1c7cd22}.utility .icon-button:hover{border-color:#c5b28988}.utility:has(+dialog[open]){z-index:0}
body[data-mode=title] .hud{display:none}body:not([data-mode=title]):not([data-mode=paused]):not([data-mode=clear]) .utility{display:none}body[data-mode=clear] .pause-button{visibility:hidden}
.screen{position:absolute;inset:0;z-index:5}.title-screen{background:#0b1424;overflow:hidden}.title-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.title-vignette{position:absolute;inset:0;background:linear-gradient(90deg,#050c1833 0%,transparent 70%),linear-gradient(0deg,#030914b8 0%,transparent 17%,transparent 89%,#03091444 100%);pointer-events:none}
.title-content{position:absolute;top:10%;left:5.8%;width:62%;text-align:center}.crest{height:4cqw;display:flex;align-items:center;justify-content:center;gap:1.8cqw;margin-bottom:2.4cqw;color:var(--gold);opacity:.8}.crest span{width:8cqw;height:1px;background:linear-gradient(90deg,transparent,#baa16e)}.crest span:last-child{transform:rotate(180deg)}.crest svg{width:2.8cqw;height:4cqw;fill:none;stroke:currentColor;stroke-width:1.3}
h1{font-size:inherit;margin:0;line-height:1}.title-logo{display:block;width:100%;height:auto;filter:drop-shadow(0 3px 2px #0009)}.title-jp{display:block;font-size:1.45cqw;font-weight:400;letter-spacing:.45em;text-indent:.45em;color:#b9c2cc;margin-top:1.8cqw}.title-tagline{font-family:"Hiragino Mincho ProN","Yu Mincho",Georgia,serif;font-size:1.7cqw;letter-spacing:.35em;color:#d6dfeb;margin:3.8cqw 0 4.2cqw;text-shadow:0 2px 8px #000}
.title-menu{display:flex;flex-direction:column;align-items:center;gap:.7cqw;width:80%;margin:auto}.menu-entry{position:relative;display:flex;align-items:center;text-align:left;gap:1.5cqw;width:75%;border:0;background:transparent;padding:.9cqw 0;color:#b3bdcb;transition:color .16s,transform .16s;min-height:4.2cqw}.menu-entry>span:last-child{display:flex;align-items:baseline;gap:1.2cqw;white-space:nowrap}.menu-entry small{font: .78cqw monospace;letter-spacing:.16em;color:#677d96}.menu-pointer{font-size:.8cqw;opacity:0;color:#dac595;transition:opacity .15s;flex-shrink:0}.menu-entry:hover,.menu-entry:focus-visible{color:#fff1ce;transform:translateX(.6cqw);outline:none}.menu-entry:focus-visible{box-shadow:0 1px #d6c39066}.menu-entry:hover .menu-pointer,.menu-entry:focus-visible .menu-pointer{opacity:1}.main-entry{font-size:1.85cqw;font-weight:500;letter-spacing:.1em}.minor-entry{font-size:1.45cqw;letter-spacing:.1em}.title-menu:has(.main-entry:hover) .main-entry:not(:hover){color:#b3bdcb}.title-menu .main-entry:first-child:not([hidden]),.title-menu:not(:has(#continueButton:not([hidden]))) #startButton{color:var(--accent)}.title-menu .main-entry:first-child:not([hidden]) .menu-pointer,.title-menu:not(:has(#continueButton:not([hidden]))) #startButton .menu-pointer{opacity:1}.has-save #startButton{font-size:1.45cqw;font-weight:400}.has-save #startButton small{font-size:.78cqw}.boot-status{font-size:10px;color:#a4b5cc;min-height:12px}.game-ready .boot-status{display:none}
.title-footer{position:absolute;bottom:3.8%;left:4.2%;display:flex;align-items:center;gap:1.5cqw;color:#8b9bb0;font-size:1cqw;letter-spacing:.05em}.title-footer button{background:none;border:0;color:#bbc8d6;font-size:1.05cqw;padding:7px 0}.title-footer button:hover{color:var(--accent)}.footer-rule{height:10px;width:1px;background:#b1c1cc33}.touch-tip{display:none}.title-edition{position:absolute;right:4.5%;top:5%;display:flex;flex-direction:column;align-items:flex-end;color:#aab4be;font:1.05cqw Georgia,serif;letter-spacing:.22em;text-shadow:0 1px 3px #000}.title-edition>span{font: .7cqw monospace;letter-spacing:.13em;color:#657c94;margin-top:.8cqw}
.embers{position:absolute;inset:0;pointer-events:none}.embers i{position:absolute;left:70%;top:85%;width:2px;height:2px;background:#cfbd91;opacity:0;box-shadow:0 0 6px #f0d699;animation:ember 9s linear infinite}.embers i:nth-child(2){left:86%;top:77%;animation-delay:2s}.embers i:nth-child(3){left:56%;top:88%;animation-delay:4s}.embers i:nth-child(4){left:92%;top:65%;animation-delay:6s}.embers i:nth-child(5){left:40%;top:93%;animation-delay:8s}
.shade{background:#060e1be8;display:grid;place-items:center;backdrop-filter:blur(4px);padding:3cqw}.menu-card{width:min(360px,62cqw);text-align:center}.eyebrow{color:var(--gold);font:9px monospace;letter-spacing:.25em}.menu-card h2{font-family:Georgia,"Hiragino Mincho ProN",serif;font-size:clamp(22px,4.3cqw,44px);font-weight:400;line-height:1.25;letter-spacing:.08em;margin:15px 0 10px;color:#eadcc1}.menu-caption{color:#8798ad;font-size:11px;margin:0 0 20px;letter-spacing:.1em}.ornament{display:flex;align-items:center;justify-content:center;gap:12px;color:#a28b60;font-size:7px;margin:18px auto;width:65%}.ornament:before,.ornament:after{content:"";height:1px;width:50%;background:linear-gradient(90deg,transparent,#c4a86e66)}.ornament:after{transform:rotate(180deg)}
.primary,.secondary,.text-button{display:flex;align-items:center;justify-content:center;border:0;font-weight:400;transition:background .15s,color .15s;letter-spacing:.08em}.primary{background:#bba57513;border:1px solid #c9b07a88;color:#eadcc1;min-height:46px;padding:0 20px;gap:30px;font-size:13px;box-shadow:inset 0 0 18px #c5a15c05}.primary:hover{background:#bba5752a;border-color:#ead2a0}.primary>span{font:18px Georgia,serif}.secondary{background:none;color:#a4b2c4;min-height:37px;padding:0 12px;font-size:11px}.secondary:hover{background:#a6b4ca0a;color:#e0d4b8}.secondary:disabled:hover{background:none;color:#a4b2c4}.menu-card>.primary,.menu-card>.secondary{width:100%;margin-top:7px}.text-button{background:none;color:#6e849d;width:100%;padding:14px 4px;font-size:10px}.text-button:hover{color:#c4c9ce}.menu-tools{display:flex;justify-content:center;gap:28px;border-top:1px solid #c1c7cd12;margin-top:12px;padding-top:14px}.menu-tools button{border:0;background:none;color:#93a5bb;font-size:11px}.menu-tools button:hover{color:#eadcc1}.menu-shortcut{color:#526981;font:8px monospace;letter-spacing:.18em;display:block;margin-top:15px}#pauseScreen{z-index:8}
.result-card{width:min(420px,70cqw)}.result-card h2{font-size:3.7cqw}.result-card p{font-size:11px;line-height:1.8;color:#9baec2}.result-numbers{display:flex;justify-content:center;gap:40px;margin:24px 0 15px}.result-numbers>div{display:flex;flex-direction:column;gap:8px}.result-numbers span{font:8px monospace;letter-spacing:.16em;color:#8299b0}.result-numbers b{font:32px Georgia,serif;letter-spacing:.04em;color:var(--accent)}.result-card .record{font-size:10px;color:#9d906f;margin-bottom:23px}
.transition-screen{z-index:6;background:#080f1d;display:grid;place-items:center;overflow:hidden;text-align:center}.transition-mist{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 70%,#29425b44,transparent 65%),linear-gradient(0deg,#10233755,transparent 65%)}.transition-ghost{position:absolute;left:0;right:0;top:6%;font:50cqw/1 Georgia,serif;letter-spacing:-.1em;color:#a9b3c704;pointer-events:none}.transition-content{position:relative;width:70%;animation:arrive .3s ease-out both}.transition-content>.eyebrow{font-size:1cqw;letter-spacing:.35em}.transition-heading{display:flex;flex-direction:column;align-items:center;margin:4cqw 0 0}.transition-heading>span{font:1.5cqw Georgia,serif;letter-spacing:.4em;text-indent:.4em;color:#899caf}.transition-heading strong{font:14cqw/1.2 Georgia,serif;font-weight:400;letter-spacing:-.05em;color:#e2cda3}.transition-content .ornament{margin:2cqw auto 2.5cqw;width:35%}.transition-content h2{font-family:"Hiragino Mincho ProN","Yu Mincho",serif;font-size:2.2cqw;letter-spacing:.2em;font-weight:400;color:#d2dae1;margin:0}.transition-content p{color:#5c7793;font:1cqw monospace;letter-spacing:.2em;margin:2cqw 0 0;min-height:1.4em}.transition-track{height:1px;background:#dbc29011;width:12cqw;margin:4cqw auto 0;overflow:hidden}.transition-track>span{display:block;width:100%;height:100%;background:#b29b6a;transform-origin:left;transform:scaleX(0)}.transition-footer{position:absolute;bottom:5%;font:1.1cqw Georgia,serif;letter-spacing:.35em;color:#435773}.transition-screen.cleared .transition-heading strong{font-size:8cqw;letter-spacing:.15em;text-indent:.15em;margin:3cqw 0 1cqw}
.room-banner{position:absolute;z-index:3;left:50%;top:7%;transform:translateX(-50%);background:#0b1724e8;border-top:1px solid #d3ba8177;padding:10px 22px;color:#e5dcc8;font-size:12px;line-height:1.5;white-space:nowrap;pointer-events:none;text-align:center}.room-banner small{display:block;font:8px monospace;letter-spacing:.17em;color:#9f956e;margin-bottom:4px}.death-toast{position:absolute;left:50%;bottom:13%;transform:translateX(-50%);padding:7px 14px;background:#0b1422dc;color:#d2d7df;font-size:11px;pointer-events:none;z-index:3;max-width:80%;text-align:center}.play-badge{position:absolute;bottom:10px;left:12px;background:#081221b8;padding:5px 8px;color:#9eafc4;font:9px monospace;letter-spacing:.08em;pointer-events:none}.play-badge span{color:#d9c18d;margin-left:6px}
.touch-controls{position:absolute;inset:auto 0 max(16px,env(safe-area-inset-bottom));padding:0 22px;display:flex;align-items:center;justify-content:space-between;pointer-events:none;z-index:4}.move-controls{display:flex;gap:12px}.touch-controls button{width:var(--touch-size);height:var(--touch-size);border:1px solid #c3b18588;background:#101d32c9;border-radius:50%;color:#e8dcbe;opacity:var(--touch-opacity);font:20px monospace;pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none}.touch-controls button.pressed{opacity:.95;background:#8c795b77;transform:scale(.97)}.touch-controls .jump-control{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3px;font-size:27px;border-color:#e3c796b8}.jump-control small{font:8px monospace;letter-spacing:.2em}.touch-controls.swap{flex-direction:row-reverse}.touch-controls:not(.hidden)~.play-badge{bottom:calc(var(--touch-size) + 24px)}
dialog{color:var(--ink);background:linear-gradient(145deg,#152238,#0b1423);border:1px solid #a58d5e66;border-radius:0;width:min(430px,calc(100% - 28px));padding:0;max-height:calc(100dvh - 32px);box-shadow:0 25px 100px #000b;scrollbar-width:thin;scrollbar-color:#5d6b7c transparent}dialog::backdrop{background:#030914d9;backdrop-filter:blur(5px)}.dialog-inner{padding:27px 30px;margin:0}.dialog-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:22px}.dialog-head h2{font-family:"Hiragino Mincho ProN","Yu Mincho",serif;font-size:23px;letter-spacing:.1em;font-weight:400;margin:9px 0 0;color:#e3d4b3}.close{border:0;background:none;color:#90a4bd;font-size:24px;padding:0 3px;line-height:1}.close:hover{color:var(--accent)}.dialog-inner>label{display:flex;align-items:center;justify-content:space-between;font-size:12px;min-height:43px;gap:18px;border-bottom:1px solid #acb9cb12}.dialog-inner>label small{display:block;color:#6c839e;font-size:10px;margin-top:4px}.dialog-inner input[type=range]{width:44%;accent-color:var(--gold);height:24px}.dialog-inner input[type=checkbox]{width:17px;height:17px;accent-color:var(--gold)}.dialog-note{font-size:10px!important;line-height:1.8!important;color:#6f87a2!important;margin:20px 0}.dialog-inner>.primary{width:100%;font-size:12px;min-height:42px}.dialog-inner>p{font-size:12px;line-height:1.9;color:#a8b8ca}.help-row{display:flex;gap:14px;align-items:center;font-size:11px;margin:13px 0}.help-row kbd{min-width:65px;text-align:center}kbd{font:10px monospace;border:1px solid #9daec033;padding:5px 7px;color:#d0bd95;white-space:nowrap}.stages-dialog{width:min(650px,calc(100% - 28px))}.stage-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:9px}.stage{position:relative;overflow:hidden;border:1px solid #9c895855;background:linear-gradient(145deg,#25354b,#101b2b);padding:17px 4px 13px;color:#b5c3d1;text-align:center}.stage:before{content:"";position:absolute;inset:0;background:linear-gradient(145deg,transparent 50%,#d5ba7f06 50%);pointer-events:none}.stage:hover:not(:disabled){background:linear-gradient(145deg,#374860,#172438);border-color:#d9bd83}.stage .number{font:27px Georgia,serif;display:block;color:#dfd0b0}.stage-mark{font:7px monospace;display:block;letter-spacing:.13em;margin-top:8px;color:#8997a9}.stage.locked{background:#0b1523;color:#40516a;border-color:#6f819c22;opacity:1}.stage.locked .number,.stage.locked .stage-mark{color:#40516a}.stage.complete{border-color:#b59d6a99}.stage.complete .stage-mark{color:#ccb581}.stage.current{box-shadow:inset 0 -2px #c5ab74}.stage-progress{font:10px monospace!important;letter-spacing:.16em;color:#ad9a72!important}.stages-dialog .dialog-note{margin-bottom:0}.boot-error{z-index:99;background:#080f1df7;display:grid;place-items:center}.boot-error h2{font-size:3cqw;line-height:1.6}.boot-error p{color:#a7b6c8;font-size:12px;line-height:1.9;margin:20px 0}noscript{position:fixed;inset:auto 0 0;background:#651e2e;color:white;padding:20px;text-align:center;z-index:100}
@keyframes arrive{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes ember{0%{opacity:0;transform:translate(0,0)}20%{opacity:.5}80%{opacity:.2}100%{opacity:0;transform:translate(-20px,-80px)}}
@media(max-width:620px){:root{--hud-height:32px}.hud{padding:0 9px;gap:10px}.chapter{gap:8px}.chapter strong{font-size:10px}.chapter>span:last-child{font-size:9px}.live-stats{gap:12px}.live-stats b{font-size:10px}.live-stats svg{width:12px;height:12px}.pause-button{height:28px;width:30px;padding:6px 5px 6px 9px}.pause-button svg{width:14px;height:14px}.utility{right:13px;bottom:10px;gap:3px}.utility .icon-button{width:27px;height:27px;padding:6px}.title-content{top:8%;left:5%;width:66%}.crest{margin-bottom:3cqw}.title-jp{font-size:1.9cqw}.title-tagline{font-size:2.2cqw;margin:4cqw 0}.main-entry{font-size:2.8cqw}.minor-entry,.has-save #startButton{font-size:2.4cqw}.menu-entry{width:86%;min-height:7cqw;padding:1.1cqw 0}.menu-entry>span:last-child{gap:1.3cqw}.menu-entry small,.has-save #startButton small{font-size:1.2cqw}.menu-pointer{font-size:1.2cqw}.title-footer{font-size:1.3cqw;bottom:3.2%;gap:2cqw}.title-footer button{font-size:1.7cqw}.title-edition{font-size:1.5cqw}.title-edition>span{font-size:1cqw}.menu-card{width:66cqw}.menu-card h2{margin:10px 0;font-size:5cqw}.menu-caption{margin-bottom:10px;font-size:10px}.eyebrow{font-size:8px}.menu-card>.primary{min-height:35px;font-size:11px}.menu-card>.secondary{min-height:27px;font-size:10px;margin-top:4px}.menu-tools{padding-top:10px;margin-top:6px}.menu-tools button{font-size:10px}.menu-card>.text-button{font-size:9px;padding:11px}.menu-shortcut{display:none}.ornament{margin:12px auto}.result-card h2{font-size:4cqw}.result-card p{font-size:9px}.result-numbers{gap:24px;margin:15px 0}.result-numbers b{font-size:24px}.result-card .record{font-size:8px;margin-bottom:13px}.room-banner{font-size:10px;padding:8px 13px}.play-badge{font-size:7px;bottom:7px;left:7px}.dialog-inner{padding:23px}.transition-content>.eyebrow{font-size:1.5cqw}.transition-content p{font-size:1.6cqw}.transition-content h2{font-size:3cqw}.transition-heading>span{font-size:2.2cqw}.transition-heading strong{font-size:18cqw}.transition-footer{font-size:1.6cqw}.boot-error h2{font-size:5cqw}.boot-error p{font-size:10px}}
@media(max-width:390px){.chapter>span:last-child,.hud-divider{display:none}.title-content{width:68%;left:3%}.title-menu{width:92%}.title-tagline{margin:3cqw 0}.menu-entry{min-height:7.7cqw}.title-footer .key-tip{display:none}}
@media(pointer:coarse){.key-tip{display:none}.touch-tip{display:inline}.title-footer button{padding:8px 0}.touch-controls{padding:0 18px;bottom:12px}.touch-controls button{max-width:16cqw;max-height:16cqw}.icon-button{min-width:32px;min-height:30px}}
@media(max-height:500px){:root{--hud-height:30px}.hud{padding:0 10px}.title-content{top:7%;width:64%;left:5%}.crest{height:3.2cqw;margin-bottom:2cqw}.title-tagline{margin:3cqw 0}.menu-entry{min-height:5.5cqw;padding:.7cqw 0}.main-entry{font-size:2cqw}.minor-entry,.has-save #startButton{font-size:1.7cqw}.menu-entry small,.has-save #startButton small{font-size:.9cqw}.title-menu{gap:.5cqw}.menu-card h2{font-size:4.5cqw;margin:1.5cqw 0}.menu-caption{font-size:1.5cqw;margin-bottom:1.5cqw}.ornament{margin:2cqw auto}.menu-card>.primary{min-height:6cqw;font-size:1.8cqw}.menu-card>.secondary{min-height:4.8cqw;font-size:1.5cqw;margin-top:.8cqw}.menu-tools{margin-top:1cqw;padding-top:2cqw}.menu-tools button{font-size:1.5cqw}.menu-card>.text-button{padding:2cqw;font-size:1.5cqw}.menu-shortcut{display:none}.result-card h2{font-size:3.8cqw}.result-numbers{margin:2cqw 0}.result-numbers b{font-size:4cqw}.result-card p{font-size:1.6cqw}.result-card .record{font-size:1.4cqw;margin-bottom:2cqw}.result-numbers span{font-size:1.2cqw}.stage{padding:9px 3px}.stage .number{font-size:20px}.stage-grid{gap:6px}.stages-dialog .dialog-head{margin-bottom:10px}.stages-dialog .dialog-inner{padding:18px 24px}.stages-dialog .dialog-note{margin-top:10px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.embers{display:none}}
@media(max-width:620px){.menu-caption{display:none}.menu-card .ornament{margin:7px auto}.menu-card>.primary{min-height:32px;margin-top:4px}.menu-card>.secondary{min-height:25px;margin-top:2px}.menu-card>.text-button{padding:9px 4px}.menu-tools{padding-top:8px;margin-top:6px}}
/* In-game brass and slate details. The approved title composition is unchanged. */
body:not([data-mode=title]) .hud{background:linear-gradient(90deg,#111b2a,#182334 55%,#101a29);border-bottom-color:#c2aa7840;box-shadow:inset 0 1px #e2d4b20b}
body:not([data-mode=title]) .chapter strong{font-family:Georgia,serif;color:#d8c39b;letter-spacing:.12em}
body:not([data-mode=title]) .hud-divider{background:#c5aa7550}
body:not([data-mode=title]) .live-stats svg{stroke:#b8ab91}
.play-badge{background:linear-gradient(90deg,#081221e0,#08122100);border-left:1px solid #c5aa7566;padding:6px 18px 6px 9px;color:#a4b3c3}
.room-banner{background:linear-gradient(90deg,#101b2b00,#101b2bf2 18%,#101b2bf2 82%,#101b2b00);border-top-color:#c4ab7566;border-bottom:1px solid #c4ab7526;font-family:"Hiragino Mincho ProN","Yu Mincho",serif;letter-spacing:.08em}
/* Softer daylight surrounds during play, with the original title untouched. */
body:not([data-mode=title]) .hud{background:linear-gradient(90deg,#26394b,#34495d 55%,#24384b);border-bottom-color:#d6c69b66}
body:not([data-mode=title]) .chapter>span:last-child{color:#c5d1d9}
body:not([data-mode=title]) .live-stats b{color:#e0e7e8}
body:not([data-mode=title]) .app{background:radial-gradient(ellipse at center,#314759,#142334 80%)}
.play-badge{color:#d0dadb;background:linear-gradient(90deg,#20364bc9,#20364b00)}
/* Landscape display: preserve world geometry and put touch input beside the view. */
.game-shell,body[data-mode=title] .game-shell{width:var(--shell-width,min(100%,calc(100dvh * 4 / 3)));height:var(--shell-height,auto);display:grid;grid-template-columns:var(--rail-left,0px) var(--arena-width,100%) var(--rail-right,0px);grid-template-rows:var(--layout-hud,0px) var(--arena-height,auto);background:linear-gradient(90deg,#1c2e40,#263e50 50%,#1c2e40)}
.hud{grid-column:1/-1;grid-row:1;width:100%;height:var(--layout-hud,36px);gap:12px}
.arena{grid-column:2;grid-row:2;width:var(--arena-width,100%);height:var(--arena-height,auto)}
body:not([data-mode=title]) .arena{aspect-ratio:auto;container-type:size;box-shadow:0 0 0 1px #c6b68125}
.game-shell:fullscreen{display:grid;justify-content:center;align-content:center;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
.game-shell:fullscreen>.arena,body[data-mode=title] .game-shell:fullscreen>.arena{width:var(--arena-width,100%);height:var(--arena-height,100%)}
.game-shell:fullscreen>.hud{width:100%}
body[data-touch=true] .hud .icon-button{width:44px;height:44px;padding:11px;min-width:44px}
body[data-touch=true] .hud .icon-button svg{width:20px;height:20px}
body[data-touch=true] .hud{padding-right:2px;gap:6px}
body[data-mode=clear] .hud-full{margin-right:0}
.touch-controls{inset:auto;top:calc(50% + var(--layout-hud,44px) / 2);left:50%;width:var(--shell-width,100%);height:var(--arena-height,100%);transform:translate(-50%,-50%);padding:0;display:block;overflow:hidden}
.touch-controls .move-controls{position:absolute;left:12px;bottom:clamp(18px,10vh,60px);gap:0}
.touch-controls button{width:var(--touch-size);height:var(--touch-size);max-width:none;max-height:none;border-radius:14px;background:linear-gradient(145deg,#324b61,#14283b);box-shadow:inset 0 1px #e0cfa326,0 4px 14px #06132155;-webkit-touch-callout:none}
.touch-controls .move-controls button:first-child{border-radius:14px 0 0 14px;border-right-color:#d6c19b22}
.touch-controls .move-controls button:last-child{border-radius:0 14px 14px 0;border-left:0}
.touch-controls .jump-control{position:absolute;right:12px;bottom:clamp(18px,10vh,60px);border-radius:50%}
.touch-controls .move-controls:before{content:'MOVE';position:absolute;bottom:calc(100% + 14px);left:0;right:0;text-align:center;font:8px monospace;letter-spacing:.25em;color:#a5b4c1;opacity:.65}
.touch-controls.swap .move-controls{left:auto;right:12px}.touch-controls.swap .jump-control{right:auto;left:12px}
body:not([data-mode=title]) .utility{bottom:auto;top:calc(var(--layout-hud) + 10px);right:12px}
body:not([data-mode=title]) .menu-card{width:min(380px,84%);max-height:calc(100% - 16px);overflow:auto;padding:12px 16px;scrollbar-width:thin}
body:not([data-mode=title]) .menu-card h2{font-size:clamp(24px,7cqh,44px);margin:10px 0}
body:not([data-mode=title]) .menu-caption{font-size:11px;margin-bottom:10px}
body:not([data-mode=title]) .menu-card .ornament{margin:12px auto}
body:not([data-mode=title]) .menu-card>.primary{min-height:42px;font-size:12px;margin-top:4px}
body:not([data-mode=title]) .menu-card>.secondary{min-height:38px;font-size:11px;margin-top:5px}
body:not([data-mode=title]) .menu-tools{margin-top:9px;padding-top:10px}
body:not([data-mode=title]) .menu-tools button{font-size:11px;min-height:32px}
body:not([data-mode=title]) .menu-card>.text-button{font-size:11px;padding:12px 4px;min-height:40px}
.transition-content>.eyebrow{font-size:clamp(8px,1.5cqh,12px)}
.transition-ghost{font-size:70cqh;top:4%}
.transition-heading{margin:4cqh 0 0}.transition-heading>span{font-size:2.6cqh}.transition-heading strong{font-size:24cqh}
.transition-content .ornament{margin:3cqh auto 4cqh}.transition-content h2{font-size:clamp(13px,3.8cqh,28px)}
.transition-content p{font-size:clamp(8px,1.8cqh,12px);margin:3cqh 0 0}.transition-track{width:18cqh;margin-top:5cqh}.transition-footer{font-size:1.8cqh}
.transition-screen.cleared .transition-heading strong{font-size:16cqh;margin:3cqh 0 1cqh}
body:not([data-mode=title]) .result-card p{font-size:clamp(10px,1.8cqh,12px)}
body:not([data-mode=title]) .result-numbers{margin:3cqh 0;gap:32px}
body:not([data-mode=title]) .result-numbers b{font-size:clamp(22px,6cqh,40px)}
body:not([data-mode=title]) .result-numbers span{font-size:9px}
body:not([data-mode=title]) .result-card .record{font-size:10px;margin-bottom:14px}
.rotate-screen{position:fixed;inset:0;z-index:100;background:radial-gradient(ellipse at 50% 40%,#293f54,#101d2d 85%);display:grid;place-items:center;padding:max(24px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left));text-align:center}
.rotate-card{max-width:330px;width:100%}.rotate-card>svg{display:block;width:116px;height:100px;margin:30px auto 16px;fill:none;stroke:#d6c296;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.rotate-card h2{font:23px 'Hiragino Mincho ProN','Yu Mincho',serif;letter-spacing:.12em;color:#e5d9bd}
.rotate-card p{font-size:12px;line-height:2;color:#bdcbd5;margin:22px 0 30px}.rotate-card button{min-height:48px;width:100%;font-size:12px}.rotate-card small{display:block;font-size:10px;color:#8fa5b7;line-height:1.8;margin-top:18px}
@media(max-height:500px){
 body:not([data-mode=title]) .menu-card{width:min(360px,88%);padding:8px 14px}
 body:not([data-mode=title]) .menu-card .eyebrow,body:not([data-mode=title]) .menu-caption,body:not([data-mode=title]) .menu-card .ornament{display:none}
 body:not([data-mode=title]) .menu-card h2{font-size:24px;margin:0 0 8px}
 body:not([data-mode=title]) .menu-card>.primary{min-height:40px}
 body:not([data-mode=title]) .menu-card>.secondary{min-height:36px;margin-top:4px}
 body:not([data-mode=title]) .menu-tools{margin-top:4px;padding-top:4px}
 body:not([data-mode=title]) .menu-card>.text-button{padding:8px 4px;min-height:36px}
 .room-banner{top:4%;font-size:10px;padding:6px 12px}.room-banner small{font-size:7px;margin-bottom:2px}
 .death-toast{bottom:9%;font-size:10px}.play-badge{font-size:8px;bottom:6px;left:6px}
 dialog{max-height:calc(100dvh - 16px);max-width:calc(100% - env(safe-area-inset-left) - env(safe-area-inset-right) - 24px)}
 .dialog-inner{padding:16px 24px}
}
.game-shell:fullscreen,body[data-mode=title] .game-shell:fullscreen{width:100%!important;height:100dvh;align-content:center;justify-content:center}
.game-shell:fullscreen>.touch-controls{left:calc(50% + (env(safe-area-inset-left) - env(safe-area-inset-right)) / 2);top:calc(50% + (var(--layout-hud,44px) + env(safe-area-inset-top) - env(safe-area-inset-bottom)) / 2)}
/* Edge-to-edge play. Safe areas protect controls, not shrink the game canvas. */
body:not([data-mode=title]) .app{position:fixed;inset:0;width:var(--window-width,100vw);height:var(--window-height,100dvh);padding:0;display:block}
body:not([data-mode=title]) .game-shell,body:not([data-mode=title]) .game-shell:fullscreen{width:var(--shell-width,100vw)!important;height:var(--shell-height,100dvh);padding:0;display:block;box-shadow:none}
body:not([data-mode=title]) .arena{position:absolute;inset:0;width:100%;height:100%;box-shadow:none}
body:not([data-mode=title]) .game-shell:fullscreen>.arena{width:100%;height:100%}
body:not([data-mode=title]) .hud,body:not([data-mode=title]) .game-shell:fullscreen>.hud{position:absolute;top:0;left:0;width:100%;height:calc(44px + env(safe-area-inset-top));padding:env(safe-area-inset-top) max(8px,env(safe-area-inset-right)) 0 max(12px,env(safe-area-inset-left));border:0;background:linear-gradient(#0c1d30b3,#0c1d3033);box-shadow:none;z-index:6;pointer-events:none}
.hud button{pointer-events:auto}
body:not([data-mode=title]) .touch-controls,body:not([data-mode=title]) .game-shell:fullscreen>.touch-controls{inset:0;top:0;left:0;transform:none;width:100%;height:100%}
.touch-controls .move-controls{left:max(18px,env(safe-area-inset-left));bottom:max(14px,env(safe-area-inset-bottom))}
.touch-controls .jump-control{right:max(18px,env(safe-area-inset-right));bottom:max(14px,env(safe-area-inset-bottom))}
.touch-controls.swap .move-controls{left:auto;right:max(18px,env(safe-area-inset-right))}.touch-controls.swap .jump-control{right:auto;left:max(18px,env(safe-area-inset-left))}
.touch-controls button{background:#14283b80;box-shadow:inset 0 1px #e0cfa326;border-color:#ddd1b399;text-shadow:0 1px 3px #000}
.touch-controls .move-controls:before{display:none}
body[data-touch=true]:not([data-mode=title]) .play-badge{left:50%;bottom:max(8px,env(safe-area-inset-bottom));transform:translateX(-50%);white-space:nowrap}
body:not([data-mode=title]) .room-banner{top:calc(52px + env(safe-area-inset-top))}
body:not([data-mode=title]) .utility{right:max(10px,env(safe-area-inset-right));top:calc(54px + env(safe-area-inset-top))}
body:not([data-mode=title]) .utility #fullButton{display:none}
body:not([data-mode=title]) .shade{padding:calc(48px + env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))}
body:not([data-mode=title]) .shade>.menu-card{max-height:100%}
.fullscreen-help ol{margin:18px 0;padding-left:23px;color:#bacbd9;font-size:12px;line-height:1.9}.fullscreen-help li{padding:6px 0}.fullscreen-help strong{color:#e6d7b6;font-weight:500}.fullscreen-help .fullscreen-note{font-size:10px;line-height:1.8;color:#8ea4b9}
@media(max-height:500px){.fullscreen-help .dialog-head{margin-bottom:10px}.fullscreen-help ol{margin:10px 0}.fullscreen-help li{padding:2px 0}.fullscreen-help p{margin:10px 0}}
/* Keep the world above thumbs while retaining the full-width canvas and scale. */
.safe-area-probe{position:fixed;inset:0 auto auto 0;width:0;height:0;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);visibility:hidden;pointer-events:none}
.touch-controls:before{content:'';position:absolute;left:0;right:0;bottom:0;height:var(--control-height,0px);background:linear-gradient(#173044b8,#112437e8);border-top:1px solid #c5ae7e25;pointer-events:none}
.touch-controls .move-controls,.touch-controls .jump-control{bottom:var(--control-bottom,24px)}
.touch-controls .move-controls{left:max(24px,env(safe-area-inset-left))}.touch-controls .jump-control{right:max(24px,env(safe-area-inset-right))}
.touch-controls.swap .move-controls{right:max(24px,env(safe-area-inset-right))}.touch-controls.swap .jump-control{left:max(24px,env(safe-area-inset-left))}
body[data-touch=true]:not([data-mode=title]) .play-badge{z-index:4;bottom:calc(var(--control-bottom,24px) + 16px)}
.safari-menu-demo{display:flex;align-items:center;gap:13px;margin:16px 0;padding:10px 14px;border:1px solid #8797ac55;border-radius:12px;background:#293c51;font:11px monospace;color:#c8d4df}.safari-menu-demo>span:nth-child(2){flex:1}.safari-menu-glyph{display:grid;place-items:center;width:28px;height:28px;color:#e8d4a7;border:1px solid #d2b97e;border-radius:7px;font-size:18px}.fullscreen-help li small{display:block;font-size:10px;color:#91a5b9;line-height:1.5}
@media(max-height:500px){.safari-menu-demo{margin:10px 0;padding:5px 10px}}
/* Both thumbs share this surface. Declare gesture ownership before contact. */
body:is([data-mode=play],[data-mode=intro],[data-mode=interlude]) .game-shell{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.touch-controls,.touch-controls *{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.touch-controls button>*{pointer-events:none}