:root{--navy:#102e38;--petrol:#24616a;--coral:#f26455;--cream:#f5e8cb;--dim:#aec5bd}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{background:var(--navy);color:var(--cream);font:16px/1.5 'Trebuchet MS',Arial,sans-serif}button,input,textarea,select{font:inherit}button{cursor:pointer;border:0;border-radius:0}button:disabled{opacity:.38;cursor:default}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,canvas:focus-visible,[role=slider]:focus-visible{outline:3px solid var(--coral);outline-offset:3px}.arcade,.stage{width:100%;height:100%;height:100dvh;position:relative;overflow:hidden}.arcade:fullscreen,.arcade:-webkit-full-screen{width:100vw;height:100dvh}#game{width:100%;height:100%;display:block;image-rendering:pixelated;touch-action:none}.hud{position:absolute;top:max(12px,env(safe-area-inset-top));left:max(16px,env(safe-area-inset-left));right:max(16px,env(safe-area-inset-right));display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px 18px;background:#102e38ed;border:2px solid #f5e8cb35;z-index:12;pointer-events:auto}.stats{display:flex;align-items:center;gap:28px}.hud-label{display:block;color:var(--dim);font:10px monospace;letter-spacing:1px}.stats strong{font:bold 25px monospace;letter-spacing:1px}#lives{color:var(--coral);font-size:20px}.world-info{text-align:center;font:11px monospace;color:var(--dim)}.world-info strong{display:block;font:14px monospace;color:var(--cream);margin:3px 0}.world-info>div{font-size:11px}#combo{color:var(--coral)}.utility{display:flex;gap:7px}.icon-btn{min-width:38px;height:38px;background:transparent;border:1px solid #f5e8cb80;color:var(--cream);font:22px monospace}.icon-btn:hover{background:var(--petrol)}.time-stat{padding:0 8px}.time-stat.urgent{background:var(--coral);color:var(--navy);border-radius:2px}.time-stat.urgent .hud-label{color:var(--navy)}.effect-bar{position:absolute;z-index:3;left:20px;top:100px;color:var(--cream);font:12px monospace;background:#102e38c9;padding:5px 10px;pointer-events:none}.effect-bar:empty{display:none}.overlay{position:absolute;inset:0;z-index:4}.start-copy{position:absolute;top:21%;left:7%;width:380px;padding:24px 28px;background:#102e38e8;border:2px solid #f5e8cb35;box-shadow:7px 7px 0 #102e3890;max-height:calc(100% - 120px);overflow:auto}.badge{font:11px monospace;color:var(--dim);letter-spacing:1.4px}h1{margin:18px 0 15px}h1 img{display:block;max-width:100%;height:auto;image-rendering:pixelated}p{margin:12px 0}fieldset{border:0;padding:0;margin:18px 0}legend{font:11px monospace;color:var(--dim);letter-spacing:1px;margin-bottom:8px}.characters{display:flex;gap:8px}.character{display:flex;align-items:center;gap:8px;background:var(--navy);border:1px solid #f5e8cb50;padding:0 8px;color:var(--cream);font:14px monospace}.character canvas{width:30px;height:42px;image-rendering:pixelated}.character.selected{background:var(--petrol);border-color:var(--cream)}.check{visibility:hidden}.selected .check{visibility:visible}.primary,.secondary{display:flex;justify-content:space-between;align-items:center;width:100%;padding:13px 16px;font:bold 15px monospace;letter-spacing:.6px}.primary{background:var(--coral);color:var(--navy)}.primary:hover{background:var(--cream)}.secondary{background:transparent;border:1px solid #f5e8cb60;color:var(--cream);margin-top:9px}.secondary:hover{background:var(--petrol)}.scene-caption{position:absolute;right:24px;bottom:28px;font:11px monospace;color:var(--cream);letter-spacing:1px}.center,.sheet{display:flex;align-items:center;justify-content:center;background:#102e38b8;padding:110px 18px 18px}.sheet{z-index:10}.dialog{width:400px;max-width:100%;max-height:100%;overflow:auto;overscroll-behavior:contain;background:var(--navy);border:2px solid var(--cream);padding:24px;text-align:center;box-shadow:6px 6px 0 var(--petrol)}.dialog h2{font:bold 30px monospace;color:var(--coral);margin:6px 0 14px;line-height:1.2}.dialog p{color:var(--dim);font-size:14px}.wide-dialog{width:600px;text-align:left}.panel-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:10px}.panel-heading h2{font-size:24px;margin:0}.panel-heading .icon-btn{flex-shrink:0}.text-btn{background:transparent;color:var(--cream);font-size:13px;padding:12px;text-decoration:underline}.results{display:flex;justify-content:space-around;gap:12px;padding:14px 0;border-top:1px solid #f5e8cb30;border-bottom:1px solid #f5e8cb30}.results span{display:block;color:var(--dim);font-size:12px}.results strong{font:bold 28px monospace}.small,.dialog p.small{font-size:12px;line-height:1.5}.muted{color:var(--dim)}label{display:block;text-align:left;font-size:14px;margin:10px 0}input,select,textarea{display:block;width:100%;border:1px solid var(--petrol);border-radius:0;padding:9px;background:var(--cream);color:var(--navy);margin-top:5px}.input-row{display:flex;gap:8px}.input-row input{min-width:0}.small-primary{margin-top:5px;flex-shrink:0;background:var(--coral);color:var(--navy);font:bold 12px monospace;padding:8px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.end-links{display:flex;justify-content:center;flex-wrap:wrap}.tabs{display:flex;gap:8px;margin:12px 0}.tabs button{padding:8px 14px;background:var(--petrol);color:var(--cream);font-size:14px}.tabs .active{background:var(--cream);color:var(--navy)}table{width:100%;border-collapse:collapse;font-size:14px}th{font:11px monospace;color:var(--dim);text-align:left;padding:8px 0}td{border-top:1px solid #f5e8cb30;padding:10px 0}td:last-child,th:last-child{text-align:right;font-family:monospace}.sample{font-size:10px;margin-left:6px;color:var(--dim)}.own{font-weight:bold}.guide-controls{border-top:1px solid #f5e8cb35;border-bottom:1px solid #f5e8cb35}.legend{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0}.legend>div{display:flex;gap:12px;align-items:flex-start}.legend p{margin:0;font-size:13px}.legend-icon{font-size:32px;line-height:1.2;min-width:30px}.danger{color:var(--coral)}.safe{color:var(--cream)}.power-guide{display:grid;grid-template-columns:1fr 1fr;gap:12px;font-size:13px;border-top:1px solid #f5e8cb35;padding:15px 0}.toast{position:absolute;left:50%;top:112px;transform:translateX(-50%);max-width:90%;background:var(--cream);color:var(--navy);padding:8px 14px;border-bottom:3px solid var(--coral);z-index:15;font:bold 14px monospace;text-align:center;pointer-events:none}.hidden{display:none!important}
.touch-controls{position:absolute;bottom:max(16px,env(safe-area-inset-bottom));left:max(20px,env(safe-area-inset-left));right:max(20px,env(safe-area-inset-right));display:flex;align-items:flex-end;justify-content:space-between;z-index:6;pointer-events:none}.joystick{width:110px;height:110px;border:2px solid #f5e8cb70;border-radius:50%;background:#102e38aa;position:relative;pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none}.stick-knob{position:absolute;left:calc(50% - 23px);top:calc(50% - 23px);width:46px;height:46px;border:2px solid var(--cream);border-radius:50%;background:var(--petrol);box-shadow:0 4px 0 #102e3870;pointer-events:none}.stick-arrows{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:22px monospace;letter-spacing:10px;padding-left:10px;opacity:.55;pointer-events:none}.action-buttons{display:flex;align-items:flex-end;gap:16px}.action-button{border-radius:50%;width:78px;height:78px;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none;background:var(--cream);color:var(--navy);border:3px solid var(--navy);box-shadow:0 4px 0 #102e3860}.action-button span{font:bold 30px monospace;line-height:1}.action-button small{font:bold 11px monospace;margin-top:3px}.action-button.jump{background:var(--coral);width:90px;height:90px}.action-button:active{transform:translateY(2px)}
@media(min-width:1100px) and (pointer:fine){.touch-controls{opacity:.65}.touch-controls:hover{opacity:1}}
@media(max-width:700px){.hud{top:max(8px,env(safe-area-inset-top));left:8px;right:8px;padding:8px 10px;gap:8px;flex-wrap:wrap}.stats{gap:16px;flex:1}.stats strong{font-size:21px}.hud-label{font-size:9px}.stats #lives{font-size:15px}.utility{gap:5px}.icon-btn{min-width:30px;height:32px;font-size:19px}.world-info{order:3;width:100%;display:flex;align-items:center;gap:9px;justify-content:space-between;text-align:left}.world-info strong{font-size:11px;margin:0;flex:1}.world-info>span{display:none}.world-info>div{font-size:9px}.effect-bar{top:103px;left:10px;font-size:10px}.start-copy{left:22px;right:22px;width:auto;max-width:380px;top:20%;padding:22px;max-height:calc(100% - 130px)}.start-copy h1 img{max-width:300px}.scene-caption{font-size:9px;right:18px;bottom:20px}.toast{top:109px;font-size:12px}.center,.sheet{padding:110px 12px 12px}.dialog{padding:18px}.dialog h2{font-size:26px}.panel-heading h2{font-size:22px}.legend{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr;gap:0}.power-guide{grid-template-columns:1fr}.touch-controls{left:15px;right:15px;bottom:max(14px,env(safe-area-inset-bottom))}.joystick{width:100px;height:100px}.action-button{width:67px;height:67px}.action-button.jump{width:78px;height:78px}.action-buttons{gap:9px}}
@media(max-height:520px){.hud{top:6px;padding:6px 12px}.hud-label{font-size:9px}.stats strong{font-size:20px}.start-copy{top:85px;left:5%;width:360px;max-height:calc(100% - 105px);padding:16px 22px}.start-copy h1{margin:10px 0}.start-copy h1 img{width:190px}.start-copy p{font-size:13px;margin:7px 0}.start-copy fieldset{margin:10px 0}.character canvas{width:22px;height:30px}.primary,.secondary{padding:9px 14px;font-size:13px}.center,.sheet{padding-top:80px}.dialog{padding:16px}.dialog h2{font-size:22px}.effect-bar{top:80px}.toast{top:83px}.joystick{width:84px;height:84px}.action-button{width:56px;height:56px}.action-button.jump{width:64px;height:64px}.action-button span{font-size:22px}.touch-controls{bottom:10px}.world-info strong{font-size:11px}}
#lives{white-space:nowrap}@media(max-width:420px){.stats{gap:10px}.stats strong{font-size:18px;letter-spacing:0}.stats #lives{font-size:14px;letter-spacing:0}.time-stat{padding:0 3px}.hud-label{font-size:8px;letter-spacing:.6px}.utility{gap:4px}.hud{padding:8px}.icon-btn{min-width:29px}}