@font-face{font-family:GameGothic;src:url("GameFont.ttf") format("truetype");font-weight:400;font-display:swap}
/* Navigation stays outside the Unity canvas and its touch/keyboard controls. */
.game-heading{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.back-to-arcade{display:inline-flex;align-items:center;min-height:44px;color:#493b5c;font-size:14px;text-decoration:none;border:1px solid #b5a4c7;border-radius:10px;padding:6px 12px;background:#ffffff80}.back-to-arcade:hover{background:#fff}.back-to-arcade:focus-visible{outline:3px solid #b25572;outline-offset:3px}@media(max-width:480px){.game-heading{gap:6px}.brand{font-size:12px}header{gap:8px}header button{font-size:13px;padding:10px}.back-to-arcade{padding:6px 8px}}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:GameGothic,"Malgun Gothic",sans-serif;color:#493b5c;background:linear-gradient(150deg,#d8edf9,#eadff2 70%,#ffe4d6)}body{min-height:100dvh;display:grid;place-items:center}.page{width:min(1440px,100%);padding:16px 24px}header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px}.brand{font-size:17px;font-weight:800;letter-spacing:.075em}button{border:0;border-radius:12px;padding:10px 17px;background:#ffccb8;color:#493b5c;font:700 15px GameGothic,"Malgun Gothic",sans-serif;cursor:pointer}button:hover{background:#ffbda7}button:focus-visible,canvas:focus-visible{outline:3px solid #b25572;outline-offset:3px}#stage{position:relative;aspect-ratio:16/9;max-height:calc(100dvh - 130px);width:100%;overflow:hidden;background:#d8edf9;border-radius:18px;box-shadow:0 12px 40px #72608a22}canvas{display:block;max-width:100%;width:100%;height:100%;object-fit:contain;outline:none}#loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:18px;background:linear-gradient(#d8edf9,#eee0f3);padding:24px;text-align:center}#loading strong{font-size:26px}progress{width:min(280px,80%);height:12px;accent-color:#c96883}#load-status{font-size:16px;margin:0;line-height:1.6}#loading[hidden]{display:none}footer{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:13px 2px 0;font-size:14px;line-height:1.6;color:#665674}.keyboard-note{display:none;font-size:14px;color:#665674}#stage:is(:fullscreen,.mobile-fullscreen){width:100vw;height:100vh;max-height:none;border-radius:0;display:flex;align-items:center;justify-content:center;background:#d8edf9}#stage:is(:fullscreen,.mobile-fullscreen) canvas{width:100%;height:100%;object-fit:contain}@media(max-width:700px){.page{padding:12px}header{margin-bottom:10px}.brand{font-size:15px}#stage{border-radius:12px;max-height:none}footer{font-size:14px}.keyboard-note{display:block}}@media(prefers-reduced-motion:no-preference){button{transition:background .15s}}

@media(orientation:portrait){
 body{display:block}.page{padding:12px max(12px,env(safe-area-inset-right)) 12px max(12px,env(safe-area-inset-left))}
 #stage{aspect-ratio:auto;height:calc(100dvh - 200px);min-height:480px;max-height:none}
 #stage:is(:fullscreen,.mobile-fullscreen){height:100dvh;min-height:0;width:100vw}
 canvas{object-fit:fill}footer{font-size:12px}.keyboard-note{font-size:12px;margin:8px 0}
}

#exit-fullscreen{display:none}#stage:is(:fullscreen,.mobile-fullscreen){display:block;padding-top:calc(44px + env(safe-area-inset-top))}#stage:is(:fullscreen,.mobile-fullscreen) #exit-fullscreen{display:block;position:absolute;z-index:2;right:max(12px,env(safe-area-inset-right));top:max(6px,env(safe-area-inset-top));font-size:12px;padding:8px}

#mobile-name{display:none;position:absolute;z-index:2;left:max(8px,env(safe-area-inset-left));top:6px;gap:6px;align-items:center;font-size:14px;height:32px}
#nickname{font:16px GameGothic,sans-serif;width:150px;min-width:0;border:1px solid #b5a4c7;border-radius:6px;padding:4px 6px;color:#493b5c;background:#fffaf5}
#nickname:disabled{opacity:.65}
@media(pointer:coarse),(orientation:portrait){#mobile-name{display:flex}#stage{padding-top:44px}#stage:is(:fullscreen,.mobile-fullscreen) #mobile-name{top:max(6px,env(safe-area-inset-top))}}
@media(max-width:360px){#nickname{width:120px}#mobile-name label{display:none}}

body.game-fullscreen{overflow:hidden}#stage.mobile-fullscreen{position:fixed;inset:0;z-index:1000;margin:0;width:100vw;height:100dvh;max-height:none;border-radius:0}

/* Keep music controls outside the canvas and visible in full screen. */
#stage{padding-top:44px}
#mute{position:absolute;z-index:3;right:max(8px,env(safe-area-inset-right));top:6px;min-width:72px;font-size:14px;padding:7px 9px}
#stage:is(:fullscreen,.mobile-fullscreen) #mute{right:calc(max(8px,env(safe-area-inset-right)) + 74px);top:max(6px,env(safe-area-inset-top))}
#stage:is(:fullscreen,.mobile-fullscreen) #exit-fullscreen{font-size:14px;padding:7px 9px}
@media(max-width:420px){#mobile-name{gap:4px}#mobile-name label{display:none}#nickname{width:140px}}

.history-link{color:#3c4972;font-size:14px;font-weight:700;white-space:nowrap;min-height:44px;display:inline-flex;align-items:center;text-underline-offset:4px}

/* Recovery stays clear of music/name controls and scrolls on short landscape screens. */
#loading{top:44px}
#stage:is(:fullscreen,.mobile-fullscreen) #loading{top:calc(44px + env(safe-area-inset-top))}
#loading.has-error{justify-content:flex-start;gap:12px;overflow-y:auto;overscroll-behavior:contain}
#loading.has-error strong{font-size:clamp(20px,3vw,26px);flex-shrink:0}
#load-status,#recovery-steps{max-width:38rem}
#recovery-steps{margin:0;padding-left:1.4em;text-align:left;font-size:14px;line-height:1.7;overflow-wrap:anywhere}
#recovery-steps li+li{margin-top:6px}
#recovery-actions{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;flex-shrink:0}
#recovery-actions[hidden],#recovery-steps[hidden]{display:none}
#recovery-actions button,#recovery-actions a{min-height:44px}
#recovery-actions button:disabled{cursor:wait;opacity:.7}

.game-guide{margin-top:12px;font-size:14px;line-height:1.7;color:#665674}
.game-guide summary{cursor:pointer;min-height:44px;display:list-item;padding:10px 0}
.game-guide summary:focus-visible{outline:3px solid #b25572;outline-offset:3px}
.game-guide p{max-width:60rem;margin:4px 0 12px}