:root{font-family:ui-rounded,system-ui,-apple-system,sans-serif;color:#fff7df;background:#b7ceb1;font-synthesis:none}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}button{font:inherit;touch-action:none;cursor:pointer;border:0;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:3px solid #fff;outline-offset:-5px}button:disabled{cursor:default}#game{position:fixed;inset:0;overflow:hidden;touch-action:none;user-select:none}#battle{width:100%;height:100%;display:block}.hud{position:absolute;top:max(12px,env(safe-area-inset-top));left:max(20px,env(safe-area-inset-left));right:max(16px,env(safe-area-inset-right));display:flex;align-items:center;justify-content:space-between;pointer-events:none;z-index:4}.hud-tools{display:flex;gap:8px;align-items:center}.hud button{pointer-events:auto;background:#203b40e8;color:#f9f3da;width:42px;height:42px;border-radius:14px;box-shadow:0 3px 0 #142c31;font-size:22px;font-weight:900;display:grid;place-items:center}.hud svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:2.5}#clock{color:#29443d;font-size:15px;font-weight:900;margin-right:8px;font-variant-numeric:tabular-nums}#stages{display:flex;gap:8px}#stages span{width:28px;height:28px;display:grid;place-items:center;background:#49645455;color:#fff9df;border:2px solid #ffffff55;border-radius:50%;font-weight:900;font-size:12px}#stages .current{background:#f5d581;color:#263e37;border-color:#fff5c6;box-shadow:0 0 0 4px #f5d58133}#stages .done{background:#416e55;border-color:#a9d691}.lane{position:absolute;background:transparent;border-radius:30px;z-index:1;transition:background .15s}.lane:hover:enabled{background:#fff8d712}.lane:active:enabled{background:#fff8d745}#dock{position:absolute;bottom:max(18px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);padding:10px 12px;background:#203b40f5;border:2px solid #5c7771;border-radius:22px;box-shadow:0 5px 0 #10292ed0;z-index:3;pointer-events:none}#queue{display:flex;gap:8px}.card{width:58px;height:58px;display:grid;place-items:center;border:2px solid #ffffff18;background:#ffffff0a;border-radius:13px}.card.front{border-color:#aee4ef;background:#39606a;box-shadow:inset 0 0 10px #8addfa20}.card.empty{border-style:dashed}.card canvas{width:48px;height:48px}.card.front:after{content:'';position:absolute;width:6px;height:6px;border-radius:50%;background:#e6f9fc;bottom:19px}#refill{height:4px;background:#ffffff18;border-radius:9px;margin-top:9px;overflow:hidden}#refill i{display:block;height:100%;background:#a2def2;border-radius:9px;transition:width .09s linear}#tutorial{position:absolute;z-index:5;width:54px;height:72px;pointer-events:none;transform:translate(-30%,-15%)}#tutorial svg{width:100%;height:100%;filter:drop-shadow(0 3px 1px #2345);animation:tap 1.2s infinite}.tap-ring{position:absolute;left:6px;top:-6px;width:42px;height:42px;border:4px solid #fff2b9;border-radius:50%;animation:ring 1.2s infinite}#tutorial[hidden]{display:none}@keyframes tap{0%,100%{transform:translateY(-9px) rotate(-12deg)}45%,60%{transform:translateY(2px) rotate(-12deg)}}@keyframes ring{0%,100%{transform:scale(.5);opacity:0}45%{opacity:1}80%{transform:scale(1.5);opacity:0}}#overlay{position:absolute;inset:0;z-index:6;display:grid;place-items:center;padding:16px;background:#183b3dcc;backdrop-filter:blur(6px)}#overlay[hidden]{display:none}.panel{width:min(620px,100%);text-align:center}#medal{font-size:50px;line-height:1;color:#f5d581;text-shadow:0 4px 0 #956c36}#eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:3px;font-weight:800;color:#c6d8c0;margin:14px 0 8px}h1{font-size:clamp(25px,5vw,40px);line-height:1.1;margin:8px 0 22px;letter-spacing:-1px}#choices{display:flex;gap:12px;justify-content:center}.reward{flex:1;max-width:185px;background:#fff4d8;color:#284346;border-radius:20px;padding:16px 10px;border:3px solid #fffaf0;box-shadow:0 6px 0 #a39470;transition:transform .15s}.reward:hover{transform:translateY(-4px)}.reward canvas{display:block;width:76px;height:76px;margin:auto}.reward strong{display:block;font-size:18px;white-space:nowrap}.reward small{display:block;font-size:11px;margin-top:6px;opacity:.7}.primary{min-width:130px;min-height:52px;border-radius:16px;background:#f5d581;color:#264448;font-weight:900;font-size:20px;padding:12px 25px;box-shadow:0 4px 0 #b29754}.secondary{display:block;background:none;color:#d4ded3;margin:20px auto 0;text-decoration:underline;font-size:13px;padding:10px}#continue[hidden],#restart[hidden],#choices[hidden]{display:none}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}@media(orientation:landscape){#dock{left:max(12px,env(safe-area-inset-left));top:50%;bottom:auto;transform:translateY(-50%);padding:10px}#queue{flex-direction:column}.card{width:52px;height:52px}.card.front:after{bottom:auto;top:14px;left:50%;width:5px;height:5px}#refill{margin-top:9px}.hud{left:100px}}@media(max-height:420px) and (orientation:landscape){.hud{top:8px}.hud button{width:34px;height:34px;border-radius:10px}.card{width:44px;height:44px}.card canvas{width:39px;height:39px}#dock{padding:7px;border-radius:17px}#queue{gap:5px}.reward{padding:8px}.reward canvas{width:55px;height:55px}.reward strong{font-size:16px}#medal{font-size:30px}h1{margin:5px 0 13px;font-size:26px}#eyebrow{margin:8px 0 5px}#restart{margin-top:10px}}@media(max-width:380px){.reward{padding:12px 5px;border-radius:15px}#choices{gap:7px}.reward strong{font-size:15px}.reward canvas{width:66px;height:66px}.hud{left:12px;right:12px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

#deployFx{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:4}#resultTransition{position:absolute;inset:0;z-index:10;display:grid;place-items:center;background:#123b3b55;touch-action:none}#resultTransition[hidden]{display:none}.victory-slice{width:120%;padding:24px;text-align:center;background:linear-gradient(90deg,#d69c3d,#ffe7a0 40%,#ffe7a0 60%,#d69c3d);color:#203f43;font-size:clamp(38px,8vw,86px);font-weight:1000;font-style:italic;letter-spacing:3px;border-block:5px solid #fff4d2;box-shadow:0 10px 0 #102e3a55;transform:rotate(-10deg);animation:victory-in .18s ease-out both}@keyframes victory-in{from{transform:translateX(-100%) rotate(-10deg)}to{transform:translateX(0) rotate(-10deg)}}

#dock.full{border-color:#ffe39a;animation:queue-ready 1.15s ease-in-out infinite}#tutorial.urgent svg{animation-duration:.45s}#tutorial.urgent .tap-ring{animation-duration:.45s}@keyframes queue-ready{50%{box-shadow:0 0 0 5px #ffe39a55,0 0 24px #ffe39a99;border-color:#fff8d7}}@media(max-width:430px){#stages{gap:4px}#stages span{width:23px;height:23px;font-size:10px}.hud-tools{gap:5px}#clock{margin-right:2px;font-size:13px}}@media(prefers-reduced-motion:reduce){#dock.full{animation:none;box-shadow:0 0 0 3px #ffe39a77}#tutorial.urgent svg,#tutorial.urgent .tap-ring{animation:none}}

/* Audio remains reachable while pause/reward panels cover the battlefield. */
.hud{z-index:7}
#sound svg{pointer-events:none}

/* Toybox interface: carved wood edges, parchment faces and blue enamel controls. */
.hud button{background:linear-gradient(#5687a4,#30516c);border:2px solid #d6b174;box-shadow:0 3px 0 #654622,inset 0 1px 0 #c5e4eb66;color:#fff1d3}
#clock{padding:5px 8px;background:#f8e8c8d9;border-radius:9px;color:#594327;box-shadow:0 2px 0 #7c64334d}
#stages span{background:#8e7451;color:#ffefd0;border-color:#d8b478;box-shadow:0 2px 0 #674b2c}
#stages .current{background:#e6b650;color:#523b21;border-color:#fff0b7;box-shadow:0 0 0 3px #fff0b733,0 2px 0 #845924}
#stages .done{background:#527b69;border-color:#c9d5a8}
#dock{background:repeating-linear-gradient(3deg,#6a4729 0px,#6a4729 8px,#704d2d 9px,#704d2d 12px);border:3px solid #d2ae76;box-shadow:0 5px 0 #4b321e,inset 0 0 0 2px #4c341d;border-radius:20px}
.card{background:#332e2590;border-color:#caa77566;box-shadow:inset 0 2px 4px #24180766}
.card.front{background:#416b82;border-color:#d0edee;box-shadow:inset 0 0 9px #a6d8e644}
.card.empty{background:#3d2b1e55;border-color:#caa77544}
#refill{background:#2e2119}#refill i{background:linear-gradient(90deg,#78b6d1,#cef2e6)}
#overlay{background:#233c35d9}
.reward{background:linear-gradient(#fff3d6,#ecd4a5);border:3px solid #b58a4f;color:#523a20;box-shadow:0 5px 0 #684823,inset 0 0 0 2px #fff6df;border-radius:17px}
.reward small{opacity:1;color:#765b38}.reward canvas{width:86px;height:86px}
.primary{background:linear-gradient(#efd18b,#d7a955);border:2px solid #fff0bf;color:#4d351c;box-shadow:0 4px 0 #79552d}
#medal{color:#f5d581}#medal canvas{width:76px;height:76px;display:block;margin:auto}
.victory-slice{color:#51371d;border-color:#fff2c5;box-shadow:0 8px 0 #64442188}
.tap-ring{border-color:#fff0bf}
@media(max-width:380px){.reward canvas{width:66px;height:66px}}
@media(max-height:420px) and (orientation:landscape){.reward canvas{width:55px;height:55px}#medal canvas{width:45px;height:45px}}

#runScore{font-size:13px;margin:0 0 12px;color:#f5e6bb}#newRun{font-size:13px;margin-top:6px}

#clock.overtime{background:#8f3926;color:#fff3cb}#overtimeHint{position:absolute;top:68px;left:50%;transform:translateX(-50%);z-index:3;pointer-events:none;background:#8f3926ed;color:#fff3cb;border-radius:7px;padding:5px 10px;font-size:11px;font-weight:800;white-space:nowrap}

/* The loading diorama uses CSS only, so it never waits for its own artwork. */
#loading{position:fixed;inset:0;z-index:30;display:flex;align-items:center;justify-content:center;gap:clamp(24px,5vw,72px);padding:max(24px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left));background:radial-gradient(ellipse at 30% 40%,#527768,#233e37 75%);color:#fff0d1;text-align:center}
#loading[hidden],#loadingRetry[hidden]{display:none}
.loading-copy{width:min(340px,100%)}.loading-kicker{font-size:10px;letter-spacing:2.5px;font-weight:800;color:#c8d8b6;margin:0 0 15px}
#loadingTitle{font-size:clamp(42px,6vw,68px);font-weight:1000;line-height:.94;letter-spacing:-2px;text-shadow:0 4px 0 #846037,0 7px 0 #142f2b;margin:0 0 30px;transform:rotate(-3deg)}#loadingTitle span{display:block;color:#f4ce82}
#loadingStatus{font-size:14px;min-height:20px;margin:0 0 12px}.loading-meter{display:flex;align-items:center;gap:12px}#loadingPercent{font-size:12px;font-weight:800;font-variant-numeric:tabular-nums;width:36px}
#loadingProgress{appearance:none;display:block;flex:1;min-width:0;height:19px;padding:3px;border:2px solid #c49a61;border-radius:12px;background:#352e24;overflow:hidden}#loadingProgress::-webkit-progress-bar{background:#352e24;border-radius:8px}#loadingProgress::-webkit-progress-value{background:linear-gradient(#b9e5e9,#599cb6);border-radius:8px;transition:width .18s}#loadingProgress::-moz-progress-bar{background:#8ac7d7;border-radius:8px}.loading-tip{font-size:12px;line-height:1.6;color:#b8cdbd;margin:22px 0 0}#loadingRetry{font-size:15px;min-height:42px;margin-top:18px}
.loading-scene{width:280px;height:240px;flex-shrink:0;display:grid;place-items:center}.loading-board{position:relative;width:260px;height:200px;background:repeating-linear-gradient(30deg,#9ab87c 0 3px,#9fbc80 3px 6px);border:9px solid #c7a16b;border-radius:35px;box-shadow:0 9px 0 #87603c,0 14px 0 #5b412a,0 30px 30px #112b2866;transform:rotate(-9deg)}
.mini-lane{position:absolute;left:14px;right:14px;top:37px;height:35px;background:#e4ce98;border:3px solid #bb9f69;border-radius:12px}.mini-lane.second{top:110px}.mini-river{position:absolute;left:0;right:0;top:85px;height:10px;background:#6bafbb;border-block:2px solid #cae0b1}
.mini-fort{position:absolute;top:61px;width:42px;height:60px;background:linear-gradient(90deg,#ead4ac,#fff0cf);border:3px solid #9a7847;border-radius:6px;box-shadow:0 5px 0 #70522e}.mini-fort.blue{left:8px}.mini-fort.coral{right:8px}.mini-fort:after{content:'';position:absolute;width:16px;height:26px;border-radius:10px 10px 0 0;background:#486578;bottom:0;left:10px}.mini-fort.coral:after{background:#a95849}.mini-fort i{position:absolute;width:3px;height:36px;top:-36px;left:19px;background:#e6d4a5}.mini-fort i:after{content:'';position:absolute;width:25px;height:17px;background:#7cc7e5;clip-path:polygon(0 0,100% 0,75% 50%,100% 100%,0 100%)}.mini-fort.coral i:after{background:#ed9178}
.mini-troop{position:absolute;width:20px;height:25px;border-radius:9px 9px 6px 6px;background:linear-gradient(#9cdded 45%,#426d89 45% 65%,#e8c294 65%);border:2px solid #426179;box-shadow:0 4px 0 #5e724f;top:40px;left:72px;animation:loading-march .85s ease-in-out infinite alternate}.mini-troop.two{left:105px;animation-delay:-.3s}.mini-troop.three{left:137px;top:114px;animation-delay:-.6s}.mini-tree{position:absolute;left:82px;top:4px;width:30px;height:28px;background:#4d8060;border-radius:50%;box-shadow:3px 4px 0 #365d46}.mini-tree.other{left:172px;top:150px;width:23px;height:22px}@keyframes loading-march{to{transform:translateY(-4px) rotate(5deg)}}
@media(orientation:portrait){#loading{flex-direction:column;gap:24px}.loading-scene{width:260px;height:210px}#loadingTitle{font-size:54px}.loading-copy{width:min(310px,100%)}}
@media(max-height:650px) and (orientation:portrait){#loading{gap:12px}.loading-scene{height:160px;transform:scale(.78)}#loadingTitle{font-size:44px;margin-bottom:20px}.loading-kicker{margin-bottom:10px}.loading-tip{margin-top:14px}}
@media(max-height:400px) and (orientation:landscape){.loading-scene{width:230px;transform:scale(.85)}#loadingTitle{font-size:44px;margin-bottom:22px}.loading-tip{margin-top:14px}}

/* Author display rules must never reveal a hidden menu action. */
button[hidden]{display:none!important}