:root{color-scheme:dark;--cream:#fff2cc;--gold:#f6cc72;--ink:#153930;--muted:#b5c1af}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#112b25;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--cream)}body:before{content:"";position:fixed;inset:0;background:linear-gradient(90deg,#102c27e8,#142e25c7),url('assets/concept-odyssey.webp') center/cover;filter:blur(15px);transform:scale(1.05);pointer-events:none}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;touch-action:none;user-select:none;-webkit-user-select:none}button:focus-visible,a:focus-visible{outline:3px solid #fff8ce;outline-offset:4px}button:disabled{cursor:wait;opacity:.6}button[hidden],[hidden]{display:none!important}#app{position:relative;max-width:1800px;margin:auto;padding:0 12px 10px}.topbar{height:54px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{font-weight:950;font-size:23px;letter-spacing:-1.5px;text-decoration:none;color:var(--cream);line-height:1}.brand span{color:#bcdf6f}.brand small{display:block;font-size:7px;letter-spacing:1.7px;margin-top:8px;font-weight:650;color:#acb7a0}.game-name{font-family:Georgia,serif;font-weight:900;font-size:21px;letter-spacing:2px}.game-name span{display:block;font:8px system-ui;letter-spacing:3px;text-align:center;margin-top:4px;color:var(--muted)}.tools{display:flex;gap:6px}.tool{border:1px solid #d5e0bd26;background:#c8d7b308;color:#f6e4bd;border-radius:50%;width:35px;height:35px;font-size:20px;transition:.2s}.tool:hover{background:#ffffff18}.play-layout{display:flex;flex-direction:column;align-items:center;gap:8px;width:min(100%,calc((100dvh - 256px)*1.3333));margin:0 auto}.game-column{grid-area:game;min-width:0;width:100%}.session-hud{display:flex;height:34px;align-items:center;gap:20px;padding:0 11px;font-size:10px;letter-spacing:1.2px}.session-hud b{font-size:11px;color:var(--gold);margin-left:5px}#hearts{color:#efaa80;letter-spacing:4px;white-space:nowrap;font-size:18px;margin-left:auto}#score{font-size:17px;color:#fff1c6;font-variant-numeric:tabular-nums;font-weight:700}.clock{font-variant-numeric:tabular-nums;font-size:17px;white-space:nowrap}.clock small{font-size:10px;opacity:.6;margin-left:2px}.clock.urgent{color:#ffa079}.arena{position:relative;width:100%;height:calc(100dvh - 256px);border-radius:15px;overflow:hidden;isolation:isolate;box-shadow:0 0 0 1px #d2b56d65,0 14px 45px #0007;background:#274b37}#game{display:block;width:100%;height:100%;touch-action:none;user-select:none}canvas{image-rendering:auto}.poster{position:absolute;inset:0;overflow:hidden;transition:opacity .5s;pointer-events:none}.poster img{width:100%;height:100%;object-fit:contain;object-position:center top}.poster.out{opacity:0}.overlay{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:center;padding:26px 22px;background:linear-gradient(transparent 15%,#09251c25 40%,#062319bd);pointer-events:none}.menu-card{max-height:100%;overflow-y:auto;text-align:center;width:min(100%,420px);border:1px solid #efda9b6b;border-radius:17px;background:linear-gradient(140deg,#f7eed8f5,#efe0bdf7);box-shadow:0 12px 40px #04180d7a;color:var(--ink);padding:22px 24px 16px;pointer-events:auto}.eyebrow{display:block;font-size:9px;font-weight:800;letter-spacing:2px;color:#cfbd8c}.menu-card .eyebrow{color:#80764e;font-size:8px;letter-spacing:2.3px}.menu-card h1{font-family:Georgia,serif;font-size:clamp(29px,4vw,47px);letter-spacing:-2px;line-height:1;margin:13px 0 5px;font-weight:950;white-space:pre-line}.menu-card h1 em{font-style:normal;color:#b47425}.menu-subtitle{font:italic 17px Georgia,serif;margin:0 0 13px;color:#6e754c}.menu-card p#menu-copy{font-size:13px;line-height:1.55;margin:12px 0 17px;white-space:pre-line}.primary{width:100%;background:linear-gradient(#f6d57d,#e2ae4d);color:#203d2f;border:1px solid #9c7227;border-radius:9px;box-shadow:0 4px 0 #9f742d,0 7px 16px #35230b22;padding:13px 10px;font-size:15px;font-weight:850;transition:transform .1s}.primary:active{transform:translateY(3px);box-shadow:0 1px 0 #9f742d}.menu-hint{font-size:10px;line-height:1.7;color:#62684d;margin:13px 0 0}.loading{font-size:10px;margin:13px 0;color:#657448}.loading span{width:7px;height:7px;background:#94a861;display:inline-block;border-radius:50%;margin-right:6px;animation:pulse 1s infinite}.text-button{background:none;border:0;color:#45634d;font-size:12px;text-decoration:underline;padding:13px 8px 0}.control-deck{display:flex;align-items:center;justify-content:center;gap:32px;min-height:150px;padding:0}.move-label{display:none;font-size:9px;letter-spacing:1.1px;line-height:1.5;flex:1}.move-label span{display:block;font-size:9px;letter-spacing:0;color:#99ac97;margin-top:5px}.dpad{display:grid;grid-template-columns:repeat(3,52px);grid-template-rows:repeat(3,48px);gap:3px;filter:drop-shadow(0 5px 3px #0005)}.dpad button{background:linear-gradient(#f5e2ab,#d8bb75);border:1px solid #b58f4a;color:#34472e;font-size:19px;line-height:1;padding:0;border-radius:8px;box-shadow:inset 0 1px #fff9,0 3px #806c38;display:flex;align-items:center;justify-content:center}.dpad button:active,.dpad button.pressed{background:#e5b95c;transform:translateY(2px);box-shadow:inset 0 2px 4px #84673466}.dpad .up{grid-area:1/2}.dpad .left{grid-area:2/1}.dpad .right{grid-area:2/3}.dpad .down{grid-area:3/2}.dpad-center{grid-area:2/2;display:grid;place-items:center;color:#ae9563;background:#253f32;border:1px solid #d4b76b44;border-radius:5px;font-size:14px}.croak{position:relative;flex:0 0 auto;width:96px;max-width:96px;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 25%,#ffe5a0,#e3b14c 65%,#bb8328);border:3px solid #b2853d;box-shadow:inset 0 0 0 3px #ffe7a78c,0 5px 0 #75582c,0 9px 17px #0005;color:#354126;display:flex;align-items:center;justify-content:center;flex-direction:column;overflow:hidden;isolation:isolate}.croak strong{font:900 17px Georgia,serif;transform:rotate(-7deg)}.croak span{font-size:9px;font-weight:750;margin-top:4px}.croak i{position:absolute;bottom:0;height:0;background:#213b34a6;width:100%;z-index:-1;transition:height .1s;pointer-events:none}.croak:active,.croak.pressed{transform:translateY(3px);box-shadow:inset 0 0 0 3px #ffe7a78c,0 2px 0 #75582c}.croak.charging{color:#f6e2ab}footer{display:none;text-align:center;font:italic 11px Georgia,serif;color:#92a18b;padding:12px 0 16px}.toast{position:absolute;top:13%;left:50%;transform:translate(-50%,-8px);width:max-content;max-width:90%;text-align:center;padding:10px 15px;border-radius:10px;background:#153e32ed;box-shadow:0 4px 15px #0003;color:#fff1b9;font-size:12px;line-height:1.5;opacity:0;transition:.2s;pointer-events:none;white-space:pre-line;border:1px solid #e0bf7270}.toast.visible{opacity:1;transform:translate(-50%,0)}@keyframes pulse{50%{opacity:.3}}@keyframes poster-breathe{to{transform:scale(1.04)}}

.poster{background:linear-gradient(#214933,#102f27)}
/* One wide board and a bottom control deck, on every screen. */
@media(max-width:700px) and (orientation:portrait){
 #app{padding:0 8px 8px}.topbar{height:52px;gap:10px}.brand{font-size:20px}.brand small{display:none}.game-name{font-size:17px}.game-name span{font-size:6px;letter-spacing:2px}.tools{gap:4px}.tool{width:31px;height:31px;font-size:17px}.wide-only{display:none}
 .play-layout{width:min(100%,calc((100svh - 236px)*.9091))}.arena{height:auto;aspect-ratio:10/11}.session-hud{height:30px}
 .control-deck{gap:28px;min-height:138px}.dpad{grid-template-columns:repeat(3,48px);grid-template-rows:repeat(3,44px)}.croak{width:86px;max-width:86px}
 .overlay{padding:20px 17px}.menu-card{padding:20px 20px 15px}.menu-card h1{font-size:36px}
}
@media(max-width:460px){
 .topbar{gap:8px}.game-name{font-size:14px;letter-spacing:.8px}.game-name span{font-size:5px;letter-spacing:1px}.brand{font-size:18px}.tools{gap:3px}.tool{width:29px;height:29px}
 .session-hud{gap:12px;padding:0 6px;font-size:8px}.session-hud b{font-size:9px}#hearts{font-size:16px;letter-spacing:2px}#score,.clock{font-size:14px}.arena{border-radius:12px}
 .croak strong{font-size:16px}.menu-card h1{font-size:31px}.menu-card #menu-copy{font-size:12px}.menu-card .eyebrow{font-size:7px}.menu-hint{font-size:9px}.primary{font-size:14px;padding:12px 8px}.overlay{padding:16px}.menu-card{padding:17px 20px 14px}.toast{font-size:11px}
}
@media(max-height:700px) and (min-width:600px){
 #app{padding:0 8px 8px}.topbar{height:40px}.session-hud{height:26px}.play-layout{gap:6px;width:min(100%,calc((100dvh - 184px)*1.3333))}.arena{height:calc(100dvh - 184px)}
 .control-deck{min-height:100px;gap:25px}.dpad{grid-template-columns:repeat(3,44px);grid-template-rows:repeat(2,44px)}.dpad-center{display:none}.dpad .down{grid-area:2/2}.croak{width:72px;max-width:72px}
 .overlay{padding:12px;overflow-y:auto;align-items:flex-start}.menu-card{padding:12px;margin-top:auto}.menu-card h1{font-size:27px}.menu-card p#menu-copy{font-size:12px;line-height:1.35;margin:8px 0}.menu-hint{display:none}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}