:root{font-family:'Trebuchet MS',Arial,sans-serif;color:#415c4b;background:#f5f0e4;font-synthesis:none}*{box-sizing:border-box}html{height:100%;overflow:hidden;overscroll-behavior:none}body{margin:0;width:100%;height:var(--app-height,100dvh);display:grid;grid-template-rows:54px minmax(0,1fr);overflow:hidden;background:#f5f0e4}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;font-weight:700;color:inherit;cursor:pointer;touch-action:manipulation}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:3px solid #bd873b;outline-offset:3px}[hidden]{display:none!important}header{border-bottom:1px solid #dddcc8}main{min-height:0;width:100%;max-width:1440px;margin:auto;height:100%;padding:0 14px max(6px,env(safe-area-inset-bottom));display:grid;grid-template-rows:54px minmax(0,1fr) 86px}.routebar{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px}.routebar button{min-height:44px;background:none;border:0;display:flex;align-items:center;gap:8px;padding:4px}.routebar #levels{min-width:0;overflow:hidden}.routebar #levelName{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}.routebar #levelNumber{border:1px solid #cbd0b8;border-radius:9px;padding:7px;background:#e6ead5}.gate-count{white-space:nowrap;font-size:13px}.gate-count>span{color:#b6945c}.coin-icon{color:#d5ad53;font-size:22px}.shop-label{font-size:11px;color:#7a8469}.stage{position:relative;min-height:0;overflow:hidden;border:1px solid #c4ceb7;border-radius:24px;background:#e9f3e5;box-shadow:0 8px 30px #4e63400a}.stage canvas{display:block;position:absolute;inset:0;width:100%;height:100%;touch-action:none}.scene-label{position:absolute;left:22px;top:20px;display:flex;flex-direction:column;gap:5px;pointer-events:none}.scene-label>span:first-child{font-size:10px;letter-spacing:2px;font-weight:700;color:#6c8466}.scene-label>span:last-child{font-size:12px;color:#7b8a71}.control-deck{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:670px;width:100%;margin:auto}.move-controls{display:flex;gap:9px}.move-controls button,.jump{height:58px;min-width:62px;border:1px solid #b9c3a7;border-bottom:3px solid #a8b595;background:#e6ead6;border-radius:18px;font-size:27px;touch-action:none;user-select:none;-webkit-user-select:none}.move-controls button.active,.jump.active{background:#c8d8ae;transform:translateY(2px);border-bottom-width:1px}.jump{background:#d9e4bc;font-size:15px;min-width:126px;display:flex;align-items:center;justify-content:center;gap:14px}.jump span{font-size:28px}.control-caption{font-size:11px;line-height:1.6;color:#8a927d;text-align:center;font-style:italic}.control-caption b{font-weight:400}.overlay{position:absolute;inset:0;display:grid;place-items:center;padding:18px;background:#e5ecda75;backdrop-filter:blur(5px);z-index:3}.card{position:relative;background:#fffcf2;border:1px solid #c9cfb5;border-radius:24px;padding:28px;width:min(450px,100%);max-height:100%;overflow:auto;box-shadow:0 15px 50px #40523b18;text-align:center}.eyebrow{display:block;font-size:10px;font-weight:700;letter-spacing:2px;color:#97a27d;margin:8px 0 14px}.card h2{font-family:Georgia,serif;font-size:31px;line-height:1.1;letter-spacing:-.6px;font-weight:400;margin:0 0 16px;color:#45644d}.card p{font-size:13px;color:#7b846c;line-height:1.7;white-space:pre-line;margin:0 0 18px}.primary,.secondary{min-height:46px;padding:12px 19px;border-radius:13px;border:1px solid #66805a;background:#75936a;color:#fffdf3;width:100%;font-size:14px}.secondary{margin-top:9px;color:#6f7c5f;background:#f1f1e4;border-color:#c7ceb4}.close-card{position:absolute;right:9px;top:8px;width:44px;height:44px;border:0;background:transparent;font-size:26px;color:#8e987a}.toast{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);max-width:90%;width:max-content;text-align:center;background:#fffcf2ed;border:1px solid #c5ccad;border-radius:13px;padding:11px 16px;color:#60784e;font-size:12px;box-shadow:0 5px 20px #56644714;pointer-events:none}.equation{font-size:clamp(29px,7vw,43px);color:#4c694f;letter-spacing:3px;padding:11px 0 23px}.answers{display:grid;grid-template-columns:1fr 1fr;gap:10px}.answers button{background:#eef0df;color:#536b48;border:1px solid #c4ceab;border-bottom:3px solid #bac69f;border-radius:14px;min-height:65px;font-size:28px}.answers button:disabled{opacity:.36;cursor:default}.answers button.wrong{border-color:#c89886;background:#f6e3d7}.answer-note{min-height:34px;margin-top:14px;font-size:12px;color:#9f7665}.level-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;text-align:left}.level-grid button{background:#eef0df;border:1px solid #c8ceb4;border-radius:12px;padding:13px 10px;min-height:62px;display:flex;flex-direction:column;gap:6px;text-align:left;font-size:12px}.level-grid small{font-size:10px;color:#81916c}.level-grid button:disabled{opacity:.4;cursor:default}.shop-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.shop-item{display:flex;flex-direction:column;align-items:center;background:#f3f2e5;border:1px solid #d4d8c1;border-radius:17px;padding:9px;min-width:0}.shop-item.selected{border-color:#87a16c;background:#e8eed8}.shop-item canvas{position:static;width:100%;height:91px;inset:auto}.shop-item b{font-size:13px;margin-top:2px}.shop-item small{font-size:10px;line-height:1.5;color:#8a9278;min-height:31px;padding-top:6px}.shop-item button{min-height:44px;border:1px solid #bac8a1;border-radius:10px;background:#e5ebd3;padding:7px 6px;width:100%;margin-top:5px;font-size:11px}.shop-item button:disabled{opacity:.45;cursor:default}.shop-tabs{display:flex;gap:7px;margin-bottom:15px}.shop-tabs button{min-height:44px;border:1px solid #c5cdb3;background:#f2f2e5;border-radius:10px;flex:1;font-size:12px}.shop-tabs button[aria-selected=true]{background:#dce6c6}.reward-summary{display:flex;justify-content:center;gap:13px;padding:10px 0 24px}.reward-summary span{background:#f0efd9;border-radius:13px;padding:13px;font-size:12px}.reward-summary b{display:block;font-size:24px;margin-bottom:5px;color:#9b853e}#helpDialog{display:none}#cardContent:empty{display:none}
@media(max-width:600px){main{padding:0 7px max(5px,env(safe-area-inset-bottom));grid-template-rows:49px minmax(0,1fr) 83px}.routebar{gap:6px}.routebar #levelName{max-width:135px;font-size:11px}.routebar button{gap:5px}.shop-label{display:none}.stage{border-radius:19px}.scene-label{left:17px;top:17px}.scene-label>span:last-child{font-size:10px}.control-deck{padding:0 5px;gap:7px}.move-controls{gap:7px}.move-controls button{min-width:58px}.jump{min-width:107px;font-size:13px;gap:9px}.control-caption{font-size:9px}.card{padding:22px 19px;border-radius:20px}.card h2{font-size:27px}.card p{font-size:12px}.overlay{padding:12px}.gate-count{font-size:11px}.shop-item small{display:none}}
#shop{min-width:50px;justify-content:center}
@media(max-width:350px){.control-caption{display:none}.routebar #levelName{max-width:106px}.routebar #levelNumber{padding:6px}.card{padding:19px 15px}.card h2{font-size:24px}}
@media(max-height:510px){main{grid-template-rows:44px minmax(0,1fr) 64px}.control-deck{max-width:600px}.move-controls button,.jump{height:48px}.control-caption{font-size:10px}.scene-label{top:10px;left:15px}.scene-label>span:last-child{display:none}.card{width:550px;padding:17px 24px}.card h2{font-size:24px;margin-bottom:7px}.card p{font-size:11px;margin-bottom:10px}.eyebrow{margin:0 0 8px}.equation{padding:0 0 11px;font-size:32px}.answers{grid-template-columns:repeat(4,1fr)}.answers button{min-height:50px;font-size:23px}.answer-note{min-height:18px;margin-top:8px}.level-grid{grid-template-columns:repeat(4,1fr)}.shop-grid{grid-template-columns:repeat(4,1fr)}.shop-item canvas{height:72px}.shop-item small{display:none}}
