:root{font-family:'Arial Rounded MT Bold','Trebuchet MS',sans-serif;color:#26344e;background:#f24b51;font-synthesis:none}*{box-sizing:border-box}html{height:100%;width:100%;overflow:hidden;overscroll-behavior:none;-webkit-text-size-adjust:100%}body{margin:0;height:var(--app-height,100dvh);overflow:hidden;display:grid;grid-template-rows:55px minmax(0,1fr);background:#f24b51}button{font:inherit;cursor:pointer;touch-action:manipulation;color:inherit}button,a,canvas{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:3px solid #19baf6;outline-offset:3px}button:disabled{cursor:default;opacity:.45}a{color:inherit;text-decoration:none}[hidden]{display:none!important}header{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 22px;border-bottom:3px solid #26344e;color:#fff5ba}h1{font-size:32px;line-height:1;font-weight:1000;letter-spacing:-1.5px;margin:0;transform:rotate(-2deg);text-shadow:2px 3px #b93243}h1 span{color:#ffdc45}h1 b{color:#8cea9c}.back{display:flex;align-items:center;gap:5px;font-size:34px;font-weight:900}.back span{font-size:11px}.tools{display:flex;gap:7px}.tools button{width:32px;height:32px;background:#ffe35c;border:2px solid #26344e;border-bottom-width:4px;border-radius:9px;font-size:18px;font-weight:900}.tools button:first-child{background:#9ce4bd}main{height:100%;min-height:0;align-self:stretch;display:grid;grid-template-rows:44px minmax(0,1fr) 103px 18px;width:100%;max-width:1600px;margin:0 auto;padding:0 14px 5px}.mission{display:flex;align-items:center;justify-content:space-between;gap:10px;color:#fff7cf}.mission>button{display:flex;align-items:center;gap:10px;min-width:0;border:0;background:none;color:inherit;padding:4px 0}.mission>button span{background:#ffdc45;color:#26344e;border:2px solid #26344e;border-radius:7px;padding:3px 7px;font-size:17px;font-weight:900;transform:rotate(-4deg)}.mission>button b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mission>button small{font-size:13px}.score{display:flex;align-items:center;gap:12px;white-space:nowrap}.score>span{color:#ffe35c;font-size:19px}.score b{font-size:11px;color:#fff8df}.score button{background:none;border:0;font-size:23px;color:#fff7cf;font-weight:900;padding:2px}.stage{position:relative;min-height:0;border:3px solid #26344e;border-radius:20px;background:#a4e8ef;overflow:hidden;box-shadow:0 5px #26344e}.stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}.clue{position:absolute;top:9px;left:10px;display:flex;align-items:center;gap:8px;background:#fff5ba;border:2px solid #26344e;border-bottom-width:4px;border-radius:12px;padding:6px 8px;max-width:calc(100% - 175px);pointer-events:none}.clue>div{min-width:0}.clue small{font-size:7px;letter-spacing:.8px;display:block;color:#a74840;font-weight:900}.clue b{font-size:12px;line-height:1.2;display:block;margin-top:3px}.clue button{pointer-events:auto;border:0;background:#ffdc45;border-radius:50%;width:28px;height:28px;font-size:20px;flex-shrink:0}.word-lock{position:absolute;right:10px;top:9px;display:flex;flex-direction:column;align-items:center;gap:3px;transform:rotate(2deg);background:#26344e;color:#fff5ba;border:2px solid #26344e;border-bottom:4px solid #162038;border-radius:10px;padding:6px 12px;max-width:170px}.word-lock span{font-size:7px;letter-spacing:1px;font-weight:900}.word-lock b{font-size:20px;letter-spacing:3px;white-space:nowrap}.word-lock.open{background:#b3ec75;color:#26344e}.toast{position:absolute;left:50%;top:78px;transform:translateX(-50%);max-width:90%;width:max-content;background:#26344e;color:#fff5ba;border:2px solid #fff5ba;border-radius:10px;padding:8px 13px;font-size:12px;text-align:center;font-weight:900;pointer-events:none;z-index:3}.context{position:absolute;bottom:9px;left:50%;transform:translateX(-50%);background:#fff7d7ee;border:2px solid #26344e;border-radius:8px;padding:5px 10px;max-width:94%;width:max-content;font-size:10px;font-weight:900;pointer-events:none}.paused{position:absolute;inset:0;background:#26344e88;backdrop-filter:blur(4px);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:15px;color:#fff7d7;font-size:25px;z-index:5}.paused button{border:2px solid #26344e;border-bottom-width:5px;background:#ffdc45;border-radius:12px;padding:12px 20px;font-size:17px;font-weight:900}.deck{display:flex;align-items:center;justify-content:center;gap:38px;padding:12px 10px 0;min-height:0}.joystick{width:78px;height:78px;flex-shrink:0;border:3px solid #26344e;border-bottom-width:5px;border-radius:50%;background:#c93e50;position:relative;touch-action:none;user-select:none;box-shadow:inset 0 3px #aa3547}.cross{position:absolute;background:#f77274;border-radius:5px}.cross.h{width:53px;height:5px;left:10px;top:33px}.cross.v{height:53px;width:5px;top:10px;left:33px}.knob{position:absolute;left:17px;top:16px;width:39px;height:39px;border:3px solid #26344e;border-radius:50%;background:#ffe35c;box-shadow:0 3px #26344e,inset 0 3px #fff5ad;display:grid;place-items:center;font-size:21px;pointer-events:none;color:#9d4e35}.bag{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:138px}.bag>span{color:#fff7cf;font-size:8px;font-weight:900;letter-spacing:1px}.bag>span b{margin-left:8px;letter-spacing:0;background:#bf3844;border-radius:5px;padding:2px 5px}.bag-tiles{display:flex;gap:6px}.bag-tiles button{width:34px;height:33px;border:2px solid #26344e;border-bottom-width:4px;border-radius:6px;background:#ffe35c;color:#26344e;font-size:21px;font-weight:900;box-shadow:inset 0 2px #fff5ba}.bag-tiles button.empty{background:#da4a51;color:#ff9a91;box-shadow:none;border-style:dashed;border-bottom-width:2px}.stash{border:0;padding:2px 5px;background:none;color:#fff5ba;font-size:10px;font-weight:900;white-space:nowrap}.stash.ready{background:#b3ec75;color:#26344e;border-radius:5px}.stash small{font-size:8px;display:inline-block;border:1px solid currentColor;border-radius:3px;padding:0 2px;margin-left:4px}.jump{display:flex;flex-direction:column;align-items:center;justify-content:center;width:79px;height:79px;border:3px solid #26344e;border-bottom-width:6px;border-radius:26px;background:#8cea9c;font-size:40px;line-height:.9;font-weight:900;box-shadow:inset 0 3px #ceffc6;user-select:none;touch-action:none;transform:rotate(4deg)}.jump b{font-size:9px;letter-spacing:1px;margin-top:7px}.jump.active{translate:0 3px;border-bottom-width:3px}.status{text-align:center;font-size:9px;color:#fff5ba;margin:3px 0 0;font-weight:700;line-height:1.2}:is(dialog,.stash-panel){border:3px solid #26344e;border-radius:22px;box-shadow:0 7px #26344e;background:#fff5ca;color:#26344e;padding:25px;max-width:min(540px,calc(100vw - 24px));max-height:calc(var(--app-height,100dvh) - 30px);overscroll-behavior:contain}dialog::backdrop{background:#1b304485;backdrop-filter:blur(4px)}:is(dialog,.stash-panel) h2{font-size:29px;letter-spacing:-1px;margin:5px 24px 18px 0;line-height:1.1}:is(dialog,.stash-panel) p,:is(dialog,.stash-panel) li{font-size:13px;line-height:1.5}:is(dialog,.stash-panel) ol{padding-left:18px}:is(dialog,.stash-panel) li{padding-left:5px;margin:11px 0}.small{font-size:11px!important}.eyebrow{font-size:9px;letter-spacing:1.4px;font-weight:900;color:#c24942}.close{position:absolute;right:13px;top:11px;width:29px;height:29px;background:#ffda45;border:0;border-radius:50%;font-size:25px;font-weight:900}.primary,.secondary{display:block;width:100%;padding:12px 18px;font-size:15px;font-weight:900;border:2px solid #26344e;border-bottom-width:5px;border-radius:11px;background:#ed5b52;color:white;margin-top:12px}.secondary{background:#a9e782;color:#26344e}.text-button{display:block;margin:15px auto 0;background:none;border:0;text-decoration:underline;font-size:12px}.route-list{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.route-list button{background:#ffbd6a;border:2px solid #26344e;border-bottom-width:5px;border-radius:12px;min-height:85px;text-align:left;padding:8px}.route-list button:nth-child(n+5){background:#9fe6c0}.route-list button:nth-child(n+9){background:#83d8f4}.route-list strong{font-size:22px;display:block}.route-list span{display:block;font-size:10px;margin:4px 0;line-height:1.2}.route-list small{color:#a35c2f}.outfit-list{display:grid;grid-template-columns:1fr 1fr;gap:12px}.outfit-list button{border:2px solid #26344e;border-bottom-width:5px;border-radius:12px;padding:18px 9px;font-size:14px;font-weight:900}.outfit-list small{display:block;font-size:11px;margin-top:7px}.stash-dialog{width:515px}.stash-panel>p:first-of-type{text-align:center;font-size:15px;font-weight:900}.word-slots{display:flex;justify-content:center;gap:6px;flex-wrap:nowrap;margin:20px 0 12px}.word-slots button{width:49px;height:57px;min-width:0;flex-shrink:1;background:#ffe164;border:2px solid #26344e;border-bottom-width:5px;border-radius:9px;font-size:28px;font-weight:900}.word-slots button.blank{background:#f4e3a8;border-style:dashed;border-bottom-width:2px;color:#b6a16b}.slot-message{min-height:36px;text-align:center;font-size:11px!important}.satchel{background:#c7864f;border:3px solid #75492f;border-radius:13px;padding:10px;text-align:center;box-shadow:inset 0 4px #ad6a3a}.satchel>span{font-size:9px;font-weight:900;color:#ffe8b0;letter-spacing:1px}.inventory{display:flex;justify-content:center;gap:12px;margin:10px 0}.inventory button{width:55px;height:54px;background:#fff4bf;border:2px solid #26344e;border-bottom-width:5px;border-radius:8px;font-weight:900;font-size:29px;box-shadow:0 2px #75492f}.inventory button.selected{background:#a6e87c;outline:3px solid #fff4bf;outline-offset:2px}.inventory button.empty{background:#a56b3f;border-style:dashed;border-bottom-width:2px;color:#d29d6e;box-shadow:none}.discard{border:0;background:none;color:#fff0bd;font-size:10px;text-decoration:underline;padding:3px}.stash-footer{display:flex;align-items:center;gap:12px;margin-top:15px}.stash-footer .primary{width:auto;flex:1;margin:0;font-size:12px;padding:10px}.hint{background:none;border:0;font-size:11px;font-weight:900;text-decoration:underline;white-space:nowrap}.win-dialog{text-align:center;width:405px}.win-stars{font-size:44px;letter-spacing:5px;color:#edab17;text-shadow:0 2px #bd6230}.stolen-word{font-size:34px!important;font-weight:1000;letter-spacing:5px;margin:12px 0;color:#d24b3c}.win-checks{text-align:left;background:#ffe69a;border-radius:12px;padding:12px 16px;font-size:13px;line-height:2}.win-checks .earned{color:#25724f;font-weight:900}
@media(max-width:600px){body{grid-template-rows:49px minmax(0,1fr)}header{padding:0 12px;gap:6px}h1{font-size:27px}.back span{display:none}.tools{gap:5px}.tools button{width:28px;height:29px;font-size:16px}main{padding:0 7px 4px;grid-template-rows:41px minmax(0,1fr) 99px 17px}.mission{gap:5px}.mission>button{gap:7px}.mission>button span{font-size:14px;padding:3px 5px}.mission>button b{font-size:11px;max-width:150px}.score{gap:8px}.score>span{font-size:17px}.score b{font-size:10px}.score button{font-size:21px}.stage{border-radius:15px}.clue{top:7px;left:6px;gap:5px;padding:5px;max-width:calc(100% - 116px);border-radius:9px}.clue small{font-size:6px;letter-spacing:.4px}.clue b{font-size:10px}.clue button{width:23px;height:25px;font-size:17px}.word-lock{right:6px;top:7px;padding:6px;max-width:106px}.word-lock span{font-size:6px}.word-lock b{font-size:16px;letter-spacing:1px}.toast{font-size:11px;top:76px;padding:7px 9px}.context{bottom:6px;font-size:9px;padding:4px 7px}.deck{gap:25px;padding:11px 4px 0}.status{font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bag{min-width:118px}.bag-tiles button{width:32px;height:32px}.stash{font-size:9px}.jump{width:72px;height:74px;font-size:36px}.jump b{font-size:8px}.joystick{width:75px;height:75px}.knob{left:15px;top:15px}.cross.h{left:9px;top:32px}.cross.v{top:9px;left:32px}:is(dialog,.stash-panel){padding:23px 18px}.word-slots{gap:4px}.word-slots button{height:46px;font-size:23px}.stash-footer{gap:7px}.stash-footer .primary{padding:10px;font-size:11px}}
@media(max-width:365px){h1{font-size:24px}.tools button{width:26px;height:27px}.mission>button b{max-width:109px}.score{gap:5px}.deck{gap:14px}.bag{min-width:108px}.bag-tiles{gap:4px}.bag-tiles button{width:30px}.jump{width:66px}.clue b{font-size:9px}.clue small{display:none}}
@media(max-height:510px){body{grid-template-rows:39px minmax(0,1fr)}header h1{font-size:25px}main{grid-template-rows:32px minmax(0,1fr) 75px 13px;padding-bottom:2px}.deck{padding-top:8px;gap:36px}.joystick{width:61px;height:61px}.knob{width:33px;height:33px;left:11px;top:10px;font-size:19px}.cross.h{width:40px;top:25px;left:8px}.cross.v{height:40px;left:25px;top:8px}.jump{height:59px;width:65px;border-radius:20px;font-size:28px}.jump b{font-size:7px;margin-top:4px}.bag{gap:3px}.bag-tiles button{width:28px;height:28px;font-size:19px}.bag>span{font-size:7px}.stash{font-size:9px}.status{font-size:8px;margin-top:1px}.clue{top:5px;padding:4px 6px}.clue b{font-size:10px}.word-lock{top:5px;padding:4px 8px}.word-lock b{font-size:16px}.context{font-size:9px;bottom:4px}.toast{top:59px;font-size:10px}}
@media(prefers-reduced-motion:reduce){h1,.word-lock,.jump{transform:none}}

/* Larger touch target; the knob stays centered regardless of screen size. */
.joystick{width:86px;height:86px;overflow:visible;touch-action:none;-webkit-user-select:none}
.knob{left:50%;top:50%;margin-left:-20px;margin-top:-20px;will-change:transform}
.cross.h{left:15%;top:calc(50% - 2px);width:70%}.cross.v{top:15%;left:calc(50% - 2px);height:70%}
.joystick.active{background:#a83248;border-color:#fff5ba}.joystick.active .knob{background:#fff0a0}


@media(max-width:600px){.deck{gap:20px}.joystick{width:84px;height:84px}}
@media(max-width:365px){header{padding:0 8px}h1{font-size:23px}.tools{gap:3px}.deck{gap:12px}}
@media(max-height:510px){.joystick{width:63px;height:63px}.knob{margin-left:-16.5px;margin-top:-16.5px}}

/* Full labels and explicit states, including a dedicated row on small phones. */
.audio-controls{display:flex;align-items:center;justify-content:center;gap:8px}
.audio-controls .audio-tool{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:38px;min-width:120px;padding:5px 7px 5px 12px;border:2px solid #26344e;border-bottom-width:4px;border-radius:12px;background:#fff5ca;color:#26344e;font-size:12px;font-weight:900;white-space:nowrap}
.audio-tool small{display:inline-flex;align-items:center;gap:4px;padding:4px 6px;border-radius:6px;background:#dfd5b8;font-size:10px;line-height:1}
.audio-tool small:before{content:'−';font-size:12px}.audio-controls .audio-tool.on{background:#9ce4bd}.audio-tool.on small{background:#26704d;color:white}.audio-tool.on small:before{content:'✓'}
@media(max-width:600px) and (min-height:511px){body{grid-template-rows:91px minmax(0,1fr)}header{display:grid;grid-template-columns:30px minmax(0,1fr) auto;grid-template-rows:39px 44px;gap:0 8px;padding:2px 12px 4px}header h1{justify-self:center}.tools{grid-column:3;grid-row:1}.audio-controls{grid-column:1/-1;grid-row:2}.audio-controls .audio-tool{min-height:38px;min-width:130px}header .tools button{width:30px;height:30px}}
@media(max-height:510px){header{padding:0 10px;gap:6px}.audio-controls{gap:5px}.audio-controls .audio-tool{min-width:104px;min-height:30px;padding:3px 5px 3px 8px;font-size:11px;gap:6px}.audio-tool small{font-size:9px;padding:3px 4px}header .back span{display:none}}

@media(max-width:600px) and (max-height:510px){body{grid-template-rows:80px minmax(0,1fr)}header{display:grid;grid-template-columns:28px minmax(0,1fr) auto;grid-template-rows:33px 39px;gap:0 6px;padding:2px 8px 4px}header h1{justify-self:center}.tools{grid-column:3;grid-row:1}.audio-controls{grid-column:1/-1;grid-row:2}.audio-controls .audio-tool{min-width:125px;min-height:33px}}

.custom-modal{position:fixed;inset:0;z-index:30;width:100%;height:100%;padding:15px 12px;display:flex;align-items:center;justify-content:center;background:#1b304485;backdrop-filter:blur(4px);overscroll-behavior:contain}
.stash-panel{position:relative;width:515px;max-width:100%;overflow:auto;touch-action:pan-y}
