html,body{height:100%;overflow:hidden}main{height:100dvh;width:100%;max-width:none;padding:0 14px;display:grid;grid-template-rows:56px minmax(0,1fr) 68px 48px;gap:0}header{grid-row:1;height:56px!important;padding:0!important;position:relative;gap:10px;flex-wrap:nowrap!important}.brand{gap:9px}.mark{width:30px;height:30px;font-size:26px}h1{font-size:18px;letter-spacing:-.5px}h1 span{display:none}.play-actions{display:flex;gap:6px;align-items:center}.play-actions button{font-size:13px;padding:8px 11px;white-space:nowrap}.play-actions #reset kbd{display:none}.game,.is-opening .game{grid-row:2;height:auto!important;min-height:0!important;max-height:none!important;border-radius:6px}.hud{inset:10px 10px auto!important;border:0;padding:8px 11px;background:#183033bd;box-shadow:none;gap:12px;align-items:center;width:max-content;max-width:calc(100% - 20px)}.hud .eyebrow{display:none}.location{display:none}#journey-stage{font-size:14px;margin:0;letter-spacing:0}.stats{margin:0;gap:12px;white-space:nowrap;flex-wrap:nowrap}.stats b{font-size:15px}.stats span:nth-child(2),.stats span:nth-child(4),.stats #timer{display:none}.show-stats .stats span,.show-stats .stats #timer{display:inline}.show-stats .hud{flex-wrap:wrap}.show-stats .hud .eyebrow{display:block;font-size:10px;margin-bottom:5px}.show-stats .location{display:block;font-size:14px}.stats span{font-size:11px}#balance-meter{left:14px;bottom:15px;width:110px;font-size:10px}#balance-meter small{display:none}.charge{right:14px;bottom:15px;width:110px;font-size:10px}#dialogue-strip{grid-row:3;position:relative;min-height:0;display:flex;align-items:center;background:#191e22;overflow:hidden}#speech-caption,#notice{position:static;max-width:none;width:100%;padding:8px 12px;margin:0;border:0;border-radius:0;background:transparent;font-size:14px;line-height:1.3;left:auto;right:auto;bottom:auto}#notice{position:absolute;inset:0;display:flex;align-items:center}#speech-caption{z-index:1}#spoken-line{font-size:14px;line-height:1.3}#speaker-name{display:inline;margin-right:12px;font-size:10px;letter-spacing:1px}footer{grid-row:4;min-height:0;height:48px}.controls{gap:15px;font-size:12px;padding:0}.controls kbd{font-size:10px;padding:3px}.touch{grid-row:4;padding:0 0 6px;gap:6px;height:48px}.touch button{min-height:0;height:42px;font-size:12px;padding:6px;touch-action:none}.touch button:active{background:#56694c}.play-panel{position:absolute;z-index:20;right:0;top:50px;width:min(520px,calc(100vw - 28px));max-height:calc(100dvh - 64px);overflow:auto;background:#22302f;border:1px solid #728177;border-radius:8px;padding:18px;box-shadow:0 12px 50px #0009}.panel-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.panel-heading h2{font-size:19px;margin:0}.panel-heading button{font-size:13px;padding:6px 10px}.play-panel .header-right{display:flex;justify-content:flex-start!important;flex-wrap:wrap;width:auto;gap:12px;margin:16px 0}.play-panel .header-right button{font-size:14px;padding:8px 12px}.play-panel .volume{font-size:13px}.play-panel .volume input{width:85px}.play-panel .level-nav{display:grid;grid-template-columns:1fr 1fr;overflow:visible;padding:0;margin:0;gap:9px}.play-panel .level-nav button{min-width:0;font-size:14px;white-space:normal;justify-content:flex-start;padding:12px}.play-panel p{font-size:14px;color:#bacbbf;line-height:1.5}.detail-toggle{display:flex;align-items:center;gap:9px;font-size:14px}.play-panel #controller-status,.play-panel #audio-hint{font-size:12px;margin-top:14px;color:#d9dfbd}.opening{padding:16px 6%;align-items:center}.opening-copy{padding:0;width:45%;max-height:100%;overflow:auto}.opening h2{font-size:clamp(24px,3.3vh,38px)}.party-note{margin:16px 0}.party-note p{font-size:20px}.opening p{font-size:14px}.opening small{font-size:10px}.opening button{padding:10px 14px}.opening #hear-note{display:inline-block;margin-right:6px}.is-opening #dialogue-strip{visibility:hidden}
@media(pointer:coarse),(max-width:650px){main{padding:0 7px;grid-template-rows:48px minmax(0,1fr) 68px 58px}header{height:48px!important}.brand .mark{display:none}h1{font-size:14px;max-width:65px;line-height:1.05}.play-actions{gap:4px}.play-actions button{font-size:11px;padding:8px 6px}.play-actions #reset{font-size:11px}.play-actions kbd{display:none}.touch{display:flex;height:58px;padding:0 0 max(6px,env(safe-area-inset-bottom))}.touch button{height:48px}.touch button:last-child{flex:1.6}footer{display:none!important}.hud{inset:7px 7px auto!important;max-width:calc(100% - 14px);padding:7px 9px;gap:10px}#journey-stage{font-size:12px;max-width:180px}.stats{gap:8px}.stats b{font-size:12px}.stats span{font-size:9px}.show-stats .stats{flex-wrap:wrap}#spoken-line{font-size:13px}#speaker-name{font-size:9px}#notice{font-size:13px}#balance-meter{width:85px;left:12px;bottom:13px;font-size:9px}.charge{right:12px;bottom:13px;width:85px;font-size:9px}.opening{padding:12px;background:#18302cbd}.opening-copy{width:100%;max-width:370px;margin:auto}.opening h2{font-size:25px;margin:8px 0}.opening p{font-size:13px}.opening .realisation{display:none}.party-note{padding:9px 14px;margin:16px 0 9px}.party-note p{font-size:18px}.opening small{display:none}.play-panel{top:44px}}
@media(max-height:500px){main{grid-template-rows:40px minmax(0,1fr) 43px 43px;padding:0 7px}header{height:40px!important}.brand h1{font-size:14px;max-width:none}.mark{display:none}.touch{height:43px;padding-bottom:3px}.touch button{height:38px}footer{height:43px}#dialogue-strip{font-size:12px}#speech-caption,#notice{padding:3px 10px}#spoken-line{font-size:12px}.hud{padding:5px 9px}#journey-stage{font-size:12px}.opening{padding:10px 20px}.opening-copy{max-width:500px;width:70%;display:grid;grid-template-columns:1fr 1fr;gap:5px 16px}.opening .morning,.opening small,.opening .realisation,.opening-copy>p{display:none}.opening h2{font-size:23px;margin:0;grid-column:1}.party-note{grid-column:2;grid-row:1/4;margin:8px 0;padding:8px 14px}.party-note p{font-size:17px}.opening button{grid-column:1;font-size:12px;margin:0;padding:6px}.play-panel{top:37px;max-height:calc(100dvh - 47px)}}

#spoken-line{display:inline}.play-panel[hidden]{display:none}.is-speaking #notice{visibility:hidden}@media(pointer:coarse),(max-width:650px){#speech-caption{padding:5px 12px}}

/* The opening camera frames the real shirt note; controls stay outside its text. */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
.opening{background:none!important;padding:16px!important;align-items:flex-end!important;justify-content:center!important;pointer-events:none;overflow:hidden}.opening-copy{width:auto!important;max-width:none!important;display:block!important;overflow:visible!important;padding:0!important;text-align:center;margin:0!important}.opening-actions{display:flex;gap:10px;justify-content:center;pointer-events:auto}.opening button{margin:0!important;font-size:16px!important;padding:12px 20px!important;border:1px solid #e6d89f!important}.opening #hear-note{background:#20322fee;color:#f3e7be;margin:0!important}.opening small{display:block!important;margin-top:9px;font-size:12px!important;color:#fff2cc;text-shadow:0 1px 3px #152b29}.is-opening canvas{animation:none!important}.is-opening .game{min-height:0!important}.is-opening #balance-meter,.is-revealing .hud,.is-revealing #balance-meter,.is-revealing .charge,.is-revealing #dialogue-strip,.is-revealing .touch{visibility:hidden}.is-revealing #pause,.is-revealing #reset{visibility:hidden}
@media(max-height:500px){.opening{padding:9px!important}.opening button{padding:8px 18px!important}.opening small{display:none!important}}
