:root{--font-display: "Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-body: "Quicksand", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--bg-primary: #fbf9f5;--color-slate: #2e3b4e;--color-slate-light: #5a6e85;--color-sky-blue: #d4f0fc;--color-mint: #e2fcd4;--color-blush: #fcd4dc;--color-cream: #fbf7ee;--glass-bg: rgba(255, 255, 255, .75);--glass-border: rgba(255, 255, 255, .5);--glass-shadow: 0 12px 32px rgba(46, 59, 78, .08);--radius-lg: 24px;--radius-md: 16px;--radius-sm: 8px;--transition-smooth: all .3s cubic-bezier(.25, .8, .25, 1)}*{box-sizing:border-box;margin:0;padding:0}body,html{width:100%;height:100%;overflow:hidden;background-color:var(--bg-primary);color:var(--color-slate);font-family:var(--font-body);-webkit-font-smoothing:antialiased}#app{width:100%;height:100%;position:relative}#canvas-container{width:100%;height:100%;position:absolute;top:0;left:0;z-index:1;touch-action:none}.touch-only,body.is-touch-ui .desktop-only{display:none!important}body.is-touch-ui .touch-only{display:flex!important}body.is-touch-ui .escape-controls-panel.touch-only{display:block!important}.glass-card{background:var(--glass-bg);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--glass-shadow);padding:40px;width:90%;max-width:800px;animation:floatIn .6s cubic-bezier(.25,.8,.25,1)}.glass-card.compact{max-width:480px;padding:32px}.glass-card-mini{background:var(--glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);border-radius:var(--radius-md);box-shadow:var(--glass-shadow);padding:12px 20px}.overlay-panel{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;z-index:10;pointer-events:none;opacity:0;transition:opacity .4s ease}.overlay-panel.active{pointer-events:all;opacity:1}#start-screen{align-items:flex-start;padding:12px 0;overflow-y:auto}#start-screen .start-menu-card{padding:20px 24px 16px;margin:auto;max-height:calc(100dvh - 24px);max-height:calc(100vh - 24px);overflow-y:auto}@supports (height: 100dvh){#start-screen .start-menu-card{max-height:calc(100dvh - 24px)}}#start-screen .game-title{font-size:2.15rem;letter-spacing:-1px;margin-bottom:12px;text-align:center}#start-screen .setup-top{display:grid;grid-template-columns:1fr;gap:12px;margin-bottom:14px}@media (min-width: 640px){#start-screen .setup-top{grid-template-columns:1.35fr 1fr;align-items:start}}#start-screen .play-mode-section,#start-screen .name-section{margin-bottom:0}#start-screen .play-mode-btn{padding:8px 10px;font-size:.92rem}#start-screen .play-mode-panel{margin-top:8px}#start-screen .player-name-input{padding:9px 12px;font-size:.95rem}#start-screen .setup-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px;margin-bottom:14px;align-items:start}#start-screen .setup-col{display:flex;flex-direction:column;gap:12px;min-width:0}#start-screen .setup-section h3{font-size:.78rem;letter-spacing:.8px;margin-bottom:8px}#start-screen .option-card{padding:8px 6px}#start-screen .option-card:hover{transform:translateY(-2px)}#start-screen .option-preview{width:52px;height:52px;margin-bottom:6px}#start-screen .option-card span{font-size:.78rem}#start-screen .card-options{gap:8px}#start-screen .action-bar{margin-top:4px}#start-screen .btn-primary{padding:12px 28px;font-size:1rem}.picker-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:8px}.clothes-picker-grid{margin-top:8px}.picker-card{background:#fff;border:2px solid transparent;border-radius:var(--radius-md);padding:8px 6px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;box-shadow:0 4px 12px #2e3b4e08;transition:var(--transition-smooth);-webkit-user-select:none;user-select:none}.picker-card:hover{transform:translateY(-2px);box-shadow:0 8px 20px #2e3b4e0f;border-color:#2e3b4e26}.picker-card span:last-child{font-size:.78rem;font-weight:700;color:var(--color-slate);text-align:center}.picker-swatch{position:relative;width:100%;max-width:72px;height:40px;border-radius:var(--radius-sm);overflow:hidden;border:1px solid rgba(46,59,78,.1);background:#f3efe6;box-shadow:inset 0 0 0 1px #fff6}.picker-swatch input[type=color]{position:absolute;top:-6px;right:-6px;bottom:-6px;left:-6px;width:calc(100% + 12px);height:calc(100% + 12px);border:none;padding:0;cursor:pointer;background:none}#start-screen .symbol-options{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:8px;max-width:none}#start-screen .symbol-btn{width:auto;height:auto;min-height:44px;padding:8px 4px;font-size:1.2rem;background:#fff;border:2px solid transparent;border-radius:var(--radius-md);box-shadow:0 4px 12px #2e3b4e08;color:var(--color-slate)}#start-screen .symbol-btn:hover{transform:translateY(-2px);background:#fff;box-shadow:0 8px 20px #2e3b4e0f;border-color:#2e3b4e26}#start-screen .symbol-btn.active{border-color:var(--color-slate);background:var(--color-cream);color:var(--color-slate)}.game-title{font-family:var(--font-display);font-weight:800;font-size:3.5rem;letter-spacing:-1.5px;line-height:1.1;color:var(--color-slate);margin-bottom:24px}.name-section{margin-bottom:28px}.player-name-input{width:100%;padding:12px 16px;border:2px solid var(--glass-border);border-radius:var(--radius-md);background:#fff;font-family:var(--font-body);font-size:1.05rem;font-weight:600;color:var(--color-slate);outline:none;transition:var(--transition-smooth)}.player-name-input:focus{border-color:var(--color-slate);box-shadow:0 0 0 3px #2e3b4e14}.player-name-input::placeholder{color:var(--color-slate-light);font-weight:500}.play-mode-section{margin-bottom:24px;text-align:left}.play-mode-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}.play-mode-btn{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:12px 14px;border:2px solid var(--glass-border);border-radius:var(--radius-md);background:#fff;font-family:var(--font-body);font-size:1rem;font-weight:800;color:var(--color-slate);cursor:pointer;text-align:left;transition:border-color .15s ease,background .15s ease,box-shadow .15s ease}.play-mode-btn small{font-size:.72rem;font-weight:600;color:var(--color-slate-light)}.play-mode-btn:hover{border-color:var(--color-slate)}.play-mode-btn.active{border-color:var(--color-slate);background:#eef2f6;box-shadow:0 0 0 3px #2e3b4e14}.map-section{margin-bottom:14px}.map-options{display:grid;grid-template-columns:1fr;gap:8px}@media (min-width: 640px){.map-options{grid-template-columns:1fr 1fr 1fr}}.map-option-btn{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:10px 12px;border:2px solid var(--glass-border);border-radius:var(--radius-md);background:#fff;font-family:var(--font-body);font-size:.88rem;font-weight:800;color:var(--color-slate);cursor:pointer;text-align:left;transition:border-color .15s ease,background .15s ease,box-shadow .15s ease}.map-option-btn small{font-size:.68rem;font-weight:600;color:var(--color-slate-light)}.map-option-btn:hover{border-color:var(--color-slate)}.map-option-btn.active{border-color:var(--color-slate);background:#eef2f6;box-shadow:0 0 0 3px #2e3b4e14}.play-mode-panel{margin-top:12px}.play-mode-panel[hidden]{display:none!important}.server-url-label{display:block;font-size:.8rem;font-weight:700;color:var(--color-slate-light);margin-bottom:6px}.server-url-input{font-size:.9rem}.server-url-hint{margin:8px 0 0;font-size:.75rem;color:var(--color-slate-light);line-height:1.35}.server-url-hint code{font-size:.7rem;word-break:break-all}.player-name-tag{padding:4px 10px;border-radius:999px;background:#ffffffe0;border:1px solid rgba(46,59,78,.12);box-shadow:0 4px 12px #2e3b4e1f;color:var(--color-slate);font-family:var(--font-display);font-size:13px;font-weight:700;letter-spacing:.02em;white-space:nowrap;pointer-events:none;-webkit-user-select:none;user-select:none;transform:translateY(-6px)}.player-name-tag.is-local{background:#2e3b4eeb;color:#fbf7ee;border-color:transparent}.game-title span{color:var(--color-slate-light);font-weight:300}.subtitle{font-size:1.1rem;color:var(--color-slate-light);margin-bottom:32px;font-weight:500}.setup-grid{display:grid;grid-template-columns:1fr;gap:28px;margin-bottom:40px}@media (min-width: 768px){.setup-grid{grid-template-columns:1fr 1fr}}@media (max-width: 520px){#start-screen .setup-grid{grid-template-columns:1fr}#start-screen .symbol-options{grid-template-columns:repeat(5,1fr)}#start-screen #boat-options.card-options{grid-template-columns:repeat(2,1fr)}#start-screen #stick-options.card-options{grid-template-columns:repeat(3,1fr)}}.setup-section h3{font-family:var(--font-display);font-size:1.1rem;font-weight:600;text-transform:uppercase;letter-spacing:1px;margin-bottom:16px;color:var(--color-slate)}.card-options{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}#character-options.card-options{grid-template-columns:repeat(2,1fr)}#character-options .option-preview{margin-bottom:0}.option-card{background:#fff;border:2px solid transparent;border-radius:var(--radius-md);padding:16px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:var(--transition-smooth);box-shadow:0 4px 12px #2e3b4e08}.option-card:hover{transform:translateY(-4px);box-shadow:0 8px 20px #2e3b4e0f}.option-card.active{border-color:var(--color-slate);background:var(--color-cream)}.option-preview{width:76px;height:76px;margin-bottom:10px;border-radius:var(--radius-sm);overflow:hidden;background:linear-gradient(160deg,#eef3f7,#f3efe6);border:1px solid rgba(46,59,78,.08);flex-shrink:0}.option-preview.has-model-preview,.option-preview-static{background:#f3efe6}.option-preview-static img{width:100%;height:100%;display:block;object-fit:cover;pointer-events:none}.option-preview canvas{width:100%!important;height:100%!important;display:block;pointer-events:none}.option-card span{font-size:.9rem;font-weight:700;text-align:center}.option-flavor{display:block;margin-top:4px;font-size:.68rem;font-weight:500;line-height:1.25;text-align:center;color:#2e3b4e9e;max-width:9.5rem}.option-stat{display:block;margin-top:6px;font-size:.72rem;font-weight:600;line-height:1.25;text-align:center;color:var(--color-slate-light)}.customization-controls{display:flex;flex-direction:column;gap:16px}.control-group{display:flex;align-items:center;justify-content:space-between}.control-group label{font-weight:700;font-size:.95rem}.color-picker-wrapper{position:relative;width:50px;height:36px;border-radius:var(--radius-sm);overflow:hidden;border:1px solid var(--glass-border);box-shadow:0 2px 6px #0000000d}.color-picker-wrapper input[type=color]{position:absolute;top:-5px;left:-5px;width:60px;height:46px;border:none;cursor:pointer}.symbol-options{display:flex;gap:8px}.symbol-btn{width:36px;height:36px;background:#fff;border:1px solid var(--glass-border);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.1rem;transition:var(--transition-smooth)}.symbol-btn:hover{background:var(--bg-primary);transform:scale(1.05)}.symbol-btn.active{background:var(--color-slate);color:#fff;border-color:var(--color-slate)}.btn-primary{background:var(--color-slate);color:#fff;border:none;border-radius:var(--radius-md);padding:16px 40px;font-family:var(--font-display);font-size:1.15rem;font-weight:700;cursor:pointer;transition:var(--transition-smooth);box-shadow:0 6px 20px #2e3b4e26}.btn-primary:hover{background:#1e2836;transform:translateY(-2px);box-shadow:0 8px 24px #2e3b4e33}.btn-primary:active{transform:translateY(1px)}.btn-secondary{background:var(--glass-bg);border:1px solid var(--glass-border);color:var(--color-slate);border-radius:var(--radius-md);padding:10px 20px;font-family:var(--font-body);font-size:.95rem;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:8px;transition:var(--transition-smooth);box-shadow:var(--glass-shadow)}.btn-secondary:hover{background:#fff;transform:translateY(-2px)}.action-bar{display:flex;justify-content:center}.hud-container{position:absolute;top:0;left:0;width:100%;height:100%;z-index:5;pointer-events:none;display:flex;flex-direction:column;justify-content:space-between;padding:24px;padding-top:calc(24px + env(safe-area-inset-top,0px));padding-right:calc(24px + env(safe-area-inset-right,0px));padding-bottom:calc(24px + env(safe-area-inset-bottom,0px));padding-left:calc(24px + env(safe-area-inset-left,0px));opacity:0;transition:opacity .5s ease;box-sizing:border-box}.hud-container.active{opacity:1}.hud-row{display:flex;justify-content:space-between;align-items:center;width:100%}.hud-top{display:flex;justify-content:space-between;align-items:stretch;gap:12px}.hud-top-left{display:flex;align-items:stretch;gap:10px}.hud-top-right{display:flex;align-items:stretch;margin-left:auto}.hud-top-center{flex:1 1 auto;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:8px;min-width:0;pointer-events:none}.hud-top-center>*{pointer-events:all}.race-hud{min-width:min(280px,92vw);max-width:340px;padding:10px 14px;display:flex;flex-direction:column;gap:6px}.race-hud[hidden]{display:none!important}.race-hud-header{display:flex;align-items:baseline;justify-content:space-between;gap:10px;font-family:var(--font-display)}.race-hud-name{font-weight:800;font-size:.95rem;color:var(--color-slate)}.race-hud-progress{font-weight:700;font-size:.8rem;color:var(--color-slate-light)}.race-hud-timer{font-weight:800;font-size:.9rem;font-variant-numeric:tabular-nums;color:#c4893a}.race-hud-standings{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:3px}.race-hud-standings li{display:grid;grid-template-columns:1.4rem 1fr auto;gap:8px;align-items:center;font-family:var(--font-body);font-size:.82rem;font-weight:600;color:var(--color-slate)}.race-hud-standings .place{font-family:var(--font-display);font-weight:800;color:var(--color-slate-light)}.race-hud-standings .status{font-variant-numeric:tabular-nums;color:var(--color-slate-light);font-size:.78rem}.race-hud-standings li.is-local,.race-hud-standings li.is-local .place{color:#2e6b4a}.course-invite-prompt{min-width:min(300px,92vw);max-width:360px;padding:12px 14px;display:flex;flex-direction:column;gap:10px;text-align:center}.course-invite-prompt[hidden]{display:none!important}.course-invite-text{margin:0;font-family:var(--font-display);font-size:.95rem;font-weight:700;color:var(--color-slate);line-height:1.35}.course-invite-text strong{color:#2e6b4a}.course-invite-actions{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.course-invite-btn{min-height:40px;padding:8px 14px;font-size:.85rem}.course-win-banner{position:fixed;top:0;right:0;bottom:0;left:0;z-index:55;display:flex;align-items:center;justify-content:center;pointer-events:none;background:radial-gradient(ellipse at center,#fff8e68c,#fff8e600 62%);animation:course-win-fade 2.8s ease-out forwards}.course-win-banner[hidden]{display:none!important}.course-win-text{margin:0;font-family:var(--font-display);font-size:clamp(2.6rem,8vw,4.5rem);font-weight:800;letter-spacing:.02em;color:#2e6b4a;text-align:center;text-shadow:0 2px 0 rgba(255,248,235,.95),0 6px 24px rgba(46,59,78,.28);animation:course-win-pop 2.8s cubic-bezier(.22,1.2,.36,1) forwards}@keyframes course-win-pop{0%{opacity:0;transform:scale(.72) translateY(18px)}18%{opacity:1;transform:scale(1.06) translateY(0)}55%{opacity:1;transform:scale(1) translateY(0)}to{opacity:0;transform:scale(1.04) translateY(-10px)}}@keyframes course-win-fade{0%,55%{opacity:1}to{opacity:0}}.hud-bottom{align-items:flex-end;pointer-events:all}.multiplayer-chat{position:absolute;left:calc(24px + env(safe-area-inset-left,0px));bottom:calc(88px + env(safe-area-inset-bottom,0px));width:min(320px,calc(100vw - 48px));max-width:340px;padding:10px 12px;display:flex;flex-direction:column;gap:8px;pointer-events:all;z-index:6}.multiplayer-chat[hidden]{display:none!important}.chat-log{max-height:140px;overflow-y:auto;display:flex;flex-direction:column;gap:4px;font-size:.82rem;line-height:1.35;color:var(--color-slate);scrollbar-width:thin}.chat-line{word-break:break-word}.chat-line .chat-name{font-family:var(--font-display);font-weight:700;color:#2e6b4a;margin-right:.35em}.chat-line.is-local .chat-name{color:#3a6a9a}.chat-line .chat-text{color:var(--color-slate)}.chat-form{display:flex;gap:6px;align-items:stretch}.chat-input{flex:1;min-width:0;border:1px solid rgba(46,59,78,.18);border-radius:10px;padding:7px 10px;font-family:var(--font-body);font-size:.85rem;color:var(--color-slate);background:#fffcf5eb;outline:none}.chat-input:focus{border-color:#2e6b4a8c;box-shadow:0 0 0 2px #2e6b4a1f}.chat-send{padding:7px 12px;font-size:.8rem;flex-shrink:0}body:not(.is-multiplayer) .chat-hint,body:not(.is-multiplayer) .chat-hint-divider{display:none}@media (max-width: 720px){.multiplayer-chat{bottom:calc(120px + env(safe-area-inset-bottom,0px));width:min(280px,calc(100vw - 32px))}.chat-log{max-height:100px}}.camera-toggle-container.view-options{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end;max-width:420px}.view-options-label{font-family:var(--font-display);font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--color-slate-light);margin-right:4px}.view-option{padding:8px 12px;font-size:.85rem}.view-option.active{background:var(--color-slate);color:var(--color-cream);border-color:var(--color-slate)}.view-option.active:hover{background:var(--color-slate-light);border-color:var(--color-slate-light);color:#fff}.glass-bar-container{background:var(--glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);border-radius:var(--radius-md);box-shadow:var(--glass-shadow);padding:14px 20px;width:240px;display:flex;flex-direction:column;gap:6px}.bar-label{font-family:var(--font-display);font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--color-slate-light)}.progress-bar-bg{width:100%;height:12px;background:#0000000d;border-radius:6px;overflow:hidden}.progress-bar-fill{height:100%;width:100%;background:linear-gradient(90deg,#a8e6cf,#dcedc1);border-radius:6px;transition:width .3s cubic-bezier(.25,.8,.25,1)}.score-panel.glass-card-mini{display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box;min-width:72px;padding:14px 12px;gap:2px;position:relative;align-self:stretch}.score-label{font-family:var(--font-display);font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--color-slate-light);line-height:1}.score-value{font-family:var(--font-display);font-size:1.35rem;font-weight:800;color:var(--color-slate);line-height:1}.score-streak{font-family:var(--font-display);font-size:.65rem;font-weight:700;letter-spacing:.4px;color:#c4893a;min-height:.85em;max-width:5.5rem;text-align:center;line-height:1.15}.score-toast{position:absolute;top:calc(100% + 6px);left:50%;transform:translate(-50%) translateY(4px);font-family:var(--font-display);font-size:.95rem;font-weight:800;color:#c4893a;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease}.score-toast.visible{opacity:1;transform:translate(-50%) translateY(0)}.ring-score-popup{font-family:var(--font-display);font-size:1.35rem;font-weight:800;color:#c4893a;text-shadow:0 1px 0 rgba(255,248,235,.95),0 2px 8px rgba(46,59,78,.25);white-space:nowrap;pointer-events:none;-webkit-user-select:none;user-select:none;opacity:1;will-change:opacity,transform}.duck-quack-popup{font-family:var(--font-display);font-size:1.2rem;font-weight:800;color:#6a8a3e;text-shadow:0 1px 0 rgba(255,248,235,.95),0 2px 8px rgba(46,59,78,.22);white-space:nowrap;pointer-events:none;-webkit-user-select:none;user-select:none;opacity:1;will-change:opacity,transform}.wind-vane-container.glass-card-mini{display:flex;align-items:center;gap:10px;box-sizing:border-box;padding:14px 12px;align-self:stretch;min-width:0}.wind-vane-arrow-wrapper{width:32px;height:32px;background:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.15rem;font-weight:700;color:var(--color-slate);box-shadow:0 4px 8px #0000000d;flex-shrink:0}#wind-vane-arrow{transition:transform .12s linear;line-height:1}.wind-info{display:flex;flex-direction:column;justify-content:center;gap:2px;min-width:0}.wind-phase{font-size:.7rem;font-weight:700;color:var(--color-slate-light);text-transform:capitalize;line-height:1}.wind-value{font-family:var(--font-display);font-size:1.15rem;font-weight:800;color:var(--color-slate);line-height:1}.course-panel{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.escape-course-panel{text-align:left;margin-bottom:24px;padding:14px 16px;border-radius:var(--radius-md);background:#2e3b4e0a;border:1px solid rgba(46,59,78,.08)}.escape-map-panel{display:flex;flex-wrap:wrap;align-items:center;gap:8px;text-align:left;margin-bottom:14px;padding:14px 16px;border-radius:var(--radius-md);background:#2e3b4e0a;border:1px solid rgba(46,59,78,.08)}.escape-map-panel select{flex:1 1 100%;width:100%;font-size:.9rem;padding:8px 10px;border-radius:6px;border:1px solid rgba(46,59,78,.15);background:#fff}.escape-map-panel .course-btn{flex:1 1 100%}.course-label{font-family:var(--font-display);font-size:.75rem;font-weight:700;letter-spacing:.6px;color:var(--color-slate-light);width:100%;text-transform:uppercase}.course-panel select{flex:1 1 100%;width:100%;font-size:.9rem;padding:8px 10px;border-radius:6px;border:1px solid rgba(46,59,78,.15);background:#fff}.course-actions{display:flex;gap:8px;width:100%}.course-btn{font-size:.8rem!important;padding:6px 12px!important;flex:1}.course-status{width:100%;font-size:.78rem;font-weight:600;color:var(--color-slate);min-height:1.1em}.controls-hint{display:flex;align-items:center;gap:8px;font-size:.85rem;color:var(--color-slate-light);font-weight:500}.controls-hint strong{color:var(--color-slate);background:#0000000d;padding:2px 5px;border-radius:var(--radius-sm);font-family:var(--font-display);margin-left:2px}.controls-hint .divider{opacity:.35}.text-center{text-align:center}.margin-top-md{margin-top:20px}.escape-menu-card{text-align:center;max-height:min(90dvh,90vh);overflow-y:auto;-webkit-overflow-scrolling:touch}.escape-menu-title{font-family:var(--font-display);font-weight:800;font-size:2rem;color:var(--color-slate);margin-bottom:4px}.escape-menu-subtitle{font-size:.95rem;color:var(--color-slate-light);margin-bottom:28px;font-weight:500}.escape-audio-controls{display:flex;flex-direction:column;gap:18px;text-align:left;margin-bottom:28px}.escape-mute-row{display:flex;align-items:center;gap:12px;font-weight:700;cursor:pointer;-webkit-user-select:none;user-select:none}.escape-mute-row input[type=checkbox]{width:18px;height:18px;accent-color:var(--color-slate);cursor:pointer}.escape-volume-row{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;font-weight:700}.escape-volume-row input[type=range]{width:100%;accent-color:var(--color-slate);cursor:pointer}.escape-volume-value{font-family:var(--font-display);font-size:.9rem;min-width:3.2em;text-align:right;color:var(--color-slate-light)}.escape-controls-panel{text-align:left;margin-bottom:14px;padding:14px 16px;border-radius:var(--radius-md);background:#2e3b4e0a;border:1px solid rgba(46,59,78,.08)}.escape-controls-panel .course-label{display:block;margin-bottom:10px}.escape-controls-list{display:grid;gap:8px;margin:0}.escape-controls-list>div{display:grid;grid-template-columns:7.5em 1fr;gap:10px;align-items:baseline;font-size:.88rem}.escape-controls-list dt{margin:0;font-weight:700;color:var(--color-slate)}.escape-controls-list dd{margin:0;color:var(--color-slate-light);font-weight:500}.escape-controls-list kbd{display:inline-block;color:var(--color-slate);background:#0000000d;padding:1px 6px;border-radius:var(--radius-sm);font-family:var(--font-display);font-size:.85em;font-weight:700}.escape-menu-actions{justify-content:center;flex-wrap:wrap;gap:10px}.escape-volume-row.is-muted input[type=range]{opacity:.45}@keyframes floatIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.dev-panel{position:fixed;top:0;right:0;bottom:0;z-index:80;width:min(420px,100vw);padding:16px;pointer-events:none;opacity:0;transform:translate(12px);transition:opacity .18s ease,transform .18s ease}.dev-panel.active{pointer-events:auto;opacity:1;transform:translate(0)}.dev-panel-card{height:100%;display:flex;flex-direction:column;background:#f8f4ecf0;border:1px solid rgba(60,72,84,.12);border-radius:16px;box-shadow:0 18px 48px #1e283238;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);overflow:hidden}.dev-panel-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:16px 16px 10px;border-bottom:1px solid rgba(60,72,84,.08)}.dev-panel-title{margin:0;font-family:var(--font-display);font-size:1.25rem;color:var(--color-slate)}.dev-panel-subtitle{margin:4px 0 0;font-size:.78rem;color:var(--color-slate-light)}.dev-panel-subtitle kbd{font-family:var(--font-display);font-size:.72rem;padding:1px 5px;border-radius:4px;background:#3c485414}.dev-panel-actions{display:flex;gap:6px}.dev-panel-actions .btn-secondary{padding:6px 10px;font-size:.75rem}.dev-tabs{display:flex;gap:4px;padding:10px 12px 0;overflow-x:auto}.dev-tab{flex:0 0 auto;border:none;background:transparent;font-family:var(--font-display);font-size:.78rem;font-weight:700;letter-spacing:.3px;color:var(--color-slate-light);padding:8px 10px;border-radius:8px 8px 0 0;cursor:pointer}.dev-tab:hover{color:var(--color-slate);background:#3c48540d}.dev-tab.active{color:var(--color-slate);background:#ffffffb3;box-shadow:inset 0 -2px #c4893a}.dev-panel-body{flex:1;overflow-y:auto;padding:12px 16px 20px}.dev-hint{margin:0 0 12px;font-size:.78rem;line-height:1.35;color:var(--color-slate-light)}.dev-btn-row{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 12px}.dev-btn-row .btn-secondary{font-size:.72rem;padding:4px 8px}.dev-section{margin-top:14px;padding-top:10px;border-top:1px solid rgba(60,72,84,.08)}.dev-section-title{margin:0 0 8px;font-family:var(--font-display);font-size:.95rem;color:var(--color-slate)}.dev-row{display:flex;flex-direction:column;gap:4px;margin-bottom:10px}.dev-row-top{display:flex;justify-content:space-between;gap:8px;font-size:.78rem}.dev-row-label{color:var(--color-slate);font-weight:600}.dev-row-value{font-variant-numeric:tabular-nums;color:var(--color-slate-light)}.dev-row input[type=range]{width:100%;accent-color:#c4893a}.dev-check-row{display:flex;align-items:center;gap:8px;margin:8px 0 12px;font-size:.82rem;color:var(--color-slate);cursor:pointer}.dev-sfx-list{display:flex;flex-direction:column;gap:8px}.dev-sfx-row{display:grid;grid-template-columns:1fr auto auto;gap:6px;align-items:center}.dev-sfx-label{font-size:.82rem;font-weight:600;color:var(--color-slate)}.dev-sfx-row .btn-secondary,.dev-sfx-row .btn-primary{padding:6px 10px;font-size:.72rem}.mobile-controls{position:absolute;left:0;right:0;bottom:0;z-index:6;pointer-events:none;justify-content:space-between;align-items:flex-end;gap:12px;padding:0 calc(12px + env(safe-area-inset-right,0px)) calc(12px + env(safe-area-inset-bottom,0px)) calc(12px + env(safe-area-inset-left,0px));box-sizing:border-box}.mobile-controls-left,.mobile-controls-right{display:flex;gap:10px;pointer-events:all}.mobile-btn{min-width:56px;min-height:56px;padding:10px 14px;border:1px solid var(--glass-border);border-radius:var(--radius-md);background:var(--glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:var(--glass-shadow);color:var(--color-slate);font-family:var(--font-display);font-weight:700;font-size:1.1rem;touch-action:manipulation;user-select:none;-webkit-user-select:none}.mobile-btn:active{background:#2e3b4e1f;transform:translateY(1px)}.mobile-btn-action{font-size:.85rem;min-width:64px}body.is-touch-ui:has(#escape-menu.active) #mobile-controls,body.is-touch-ui:has(#start-screen.active) #mobile-controls,body.is-touch-ui:has(#sink-screen.active) #mobile-controls{display:none!important}@media (max-width: 640px){.hud-top{flex-wrap:wrap}.hud-top-left{flex:1 1 100%;flex-wrap:wrap}.hud-top-right{margin-left:0}.hud-top-center{flex:1 1 100%;order:3}.glass-bar-container{width:min(240px,100%);flex:1 1 auto}.hud-bottom{flex-direction:column;align-items:stretch;gap:10px}.camera-toggle-container.view-options{max-width:none;justify-content:flex-start}body.is-touch-ui .view-option{min-height:44px;padding:10px 12px}body.is-touch-ui .hud-bottom{padding-bottom:72px}.controls-hint{flex-wrap:wrap;font-size:.78rem}}body.is-touch-ui #start-screen{padding-top:calc(12px + env(safe-area-inset-top,0px));padding-bottom:calc(12px + env(safe-area-inset-bottom,0px))}body.is-touch-ui .overlay-panel .glass-card{margin-left:max(12px,env(safe-area-inset-left,0px));margin-right:max(12px,env(safe-area-inset-right,0px))}
