:root{color-scheme:light;--ink: #183546;--muted: #5e7480;--panel: #f8fcfb;--line: #c7dedb;--accent: #2c7886;--accent-2: #e2b65b;--good: #23765a;--try: #a55b37}*{box-sizing:border-box}html,body,#app{width:100%;min-height:100%}body{margin:0;min-height:100vh;overflow-x:hidden;background:radial-gradient(circle at 15% 0,#d8eef0,#eef6f2 50%,#e8efe8);color:var(--ink);font-family:ui-rounded,Avenir Next,system-ui,sans-serif}button,select{font:inherit}button{cursor:pointer}[hidden]{display:none!important}.panel{background:#ffffffc9;border:1px solid #cfe1dd;border-radius:28px;box-shadow:0 14px 38px #35606a18}.main-screen{min-height:0}.close-btn{border:1px solid var(--line);border-radius:14px;background:#ffffffb8;color:var(--ink);font-size:1.25rem}.main-copy{max-width:720px;margin:0 auto}.main-summary{display:block;align-self:start;max-height:4.65em;overflow:hidden}.cover-wrap{position:relative;width:min(100%,390px);aspect-ratio:1;margin:0 auto 18px;border-radius:24px;overflow:hidden}@media(min-width:700px){.cover-wrap{width:420px}}.cover-wrap img{display:block;width:100%;height:100%;object-fit:cover}.cover-badge{position:absolute;left:16px;bottom:14px;max-width:calc(100% - 32px);padding:8px 12px;border-radius:999px;background:#ffffffde;font-size:.85rem}.eyebrow{margin:.2rem 0 .45rem;color:var(--accent);font-size:.76rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}h1,h2,h3{line-height:1.1}h1,h2{margin:.15rem 0 .7rem}h1{font-size:clamp(2rem,6vw,3.7rem)}h2{font-size:clamp(1.5rem,4vw,2.25rem)}h3{margin:1.2rem 0 .5rem}.intro,.prompt,.rule{max-width:680px;color:var(--muted);font-size:1.08rem;line-height:1.55}.main-progress{height:42px;min-height:42px;max-height:42px;display:grid;align-items:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;line-height:1;margin:18px 0 0;padding:8px 14px;border:1px solid #b9d9d5;border-radius:15px;background:#e5f1ef;color:var(--accent);font-weight:700}.main-actions,.battle-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}.primary,.secondary{min-height:48px;border:1px solid transparent;border-radius:15px;padding:11px 17px;font-weight:700}.primary{background:var(--accent);color:#fff}.secondary{border-color:var(--line);background:#fff;color:var(--ink)}button:disabled{opacity:.48;cursor:not-allowed}.best{margin-top:20px;color:var(--muted)}.battle-screen{color:var(--ink)}.pill{justify-self:end;display:block;width:max-content;margin:8px 0 0 auto;padding:8px 12px;border-radius:999px;background:#e5f1ef;color:var(--accent);font-weight:700;white-space:nowrap}.prompt{margin-bottom:8px}.rule{margin-top:0}.sequence{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:22px 0}.sign{min-width:84px;min-height:88px;display:grid;place-content:center;gap:4px;padding:10px;border:1px solid var(--line);border-radius:18px;background:#fff;text-align:center}.sign-icon{font-size:2.2rem}.sign small{color:var(--muted)}.sign.next{border-style:dashed;background:#f6faf8;color:var(--muted)}.choice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:12px}.choice{min-height:100px;display:grid;place-content:center;gap:3px;border:2px solid var(--line);border-radius:18px;background:#fff;color:var(--ink);text-align:center}.choice[aria-pressed=true]{border-color:var(--accent);background:#e5f3f0;box-shadow:0 0 0 3px #2c788622}.choice .sign-icon{font-size:2rem}.selection{min-height:1.5em;color:var(--accent);font-weight:700}.status{min-height:1.7em;margin:18px 0 0;font-weight:700}.status.good{color:var(--good)}.status.try{color:var(--try)}.result-panel{position:relative;z-index:2;min-height:100%;padding:24px;border:1px solid #cfe1dd;border-radius:22px;background:#f8fcfbf7;overflow:auto}body[data-wp-game-id=animal-weather-watch] #resultScreen{display:none!important}body[data-wp-game-id=animal-weather-watch][data-weather-state=result] #resultScreen{display:grid!important}.result-icon{color:var(--accent-2);font-size:4rem;text-align:center}.result-icon.result-guide-wrap{width:min(100%,240px);height:230px;display:grid;place-items:end center;margin:0 auto 16px;background:transparent;font-size:0}.result-guide{display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom}body[data-wp-game-id=animal-weather-watch][data-weather-state=result] #battleScreen>:is(.battle-header,#progressPill,#prompt,#rule,#sequence,#selection,#choiceGrid,.battle-actions,#status){display:none!important}.modal{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:20px;background:#17374655}.modal-card{position:relative;width:min(100%,420px);padding:24px;border-radius:22px;background:var(--panel)}.close-btn{position:absolute;top:14px;right:14px}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0;border-top:1px solid var(--line)}.toggle{min-width:64px;min-height:44px;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--ink)}select{min-height:44px;max-width:62%;border:1px solid var(--line);border-radius:12px;padding:8px;background:#fff;color:var(--ink)}@media(max-width:700px){.choice-grid{gap:8px}.choice{min-height:88px}}@media(max-width:480px){.sequence{gap:6px}.sign{min-width:calc(25% - 5px);padding:7px}.sign-icon{font-size:1.8rem}.main-actions,.battle-actions{flex-direction:column}.primary,.secondary{width:100%}}.stage-workspace{position:relative;min-width:0;min-height:0;overflow:hidden}.stage-tabs[data-wp-frame-stage-nav]{margin:0}.weather-battle-live{min-width:0;min-height:0;overflow:auto;overscroll-behavior:contain;padding:12px}.result-panel .main-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.result-panel .main-actions button{width:100%;margin:0}.weather-leave-layer{position:absolute;inset:0;z-index:40;display:grid;place-items:center;padding:12px;background:#0b1724e8}.weather-leave-layer[hidden]{display:none!important}.weather-leave-card{width:min(100%,520px);max-height:100%;overflow:auto;padding:18px;border:2px solid var(--wp-ui-border);border-radius:var(--wp-ui-radius);background:var(--wp-ui-surface);color:var(--wp-ui-text);text-align:center}.weather-leave-card h2{margin:0 0 10px}.weather-leave-card p{margin:0;line-height:1.45}.weather-leave-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:16px}#weatherBattleLive{display:grid;grid-template-rows:58px 52px minmax(240px,1fr) 30px 104px 54px 48px;gap:8px;padding:12px 16px 16px;background:#101f2fee;color:#f1f6f9}#progressPill{justify-self:start;align-self:center;margin:0;min-width:58px;padding:4px 9px;border:1px solid #507785;border-radius:6px;background:#183947;color:#b8e9e2;font-size:12px;text-align:center}.observation-heading{display:grid;grid-template-columns:minmax(0,1fr) 96px;gap:8px;align-items:center}#prompt{margin:0;color:#f2f7fa;font-size:21px;font-weight:800;line-height:1.25}#hintBtn{min-height:42px;padding:6px;font-size:12px;border-color:#5e8792;background:#183947;color:#ccefe9}#rule{margin:0;color:#b8cbd5;font-size:14px;line-height:1.5}#sequence{margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:1fr;gap:8px;align-content:center;direction:ltr;padding:16px 12px;border:1px solid #557680;border-radius:12px;background:linear-gradient(#14313be8,#132d3de8),url(/assets/interface7-redrawn/animal-weather-watch.webp) center/cover}#sequence .sign{position:relative;min-width:0;min-height:100px;padding:14px 4px 9px;gap:3px;border:1px solid #58717d;border-radius:7px;background:#e9eff0;color:#203d4a;align-content:center;box-shadow:0 4px #091a24}#sequence .sign strong{font-size:13px}#sequence .sign-icon{width:48px;height:48px;margin:auto}#sequence .unknown{display:grid;place-items:center;color:#6cd8c1;font-weight:900;font-size:34px}#sequence .editable{border:2px dashed #7aa5b0;background:#193948;color:#d5edf0;transition:border-color .12s,background .12s}#sequence .active-slot{border:3px solid #80efcd;background:#245564;box-shadow:0 0 0 3px #80efcd24,0 4px #081821}.reading-number{position:absolute;top:5px;left:7px;font:700 10px ui-monospace,monospace;color:#5c707b}.editable .reading-number{color:#b3d5da}.cycle-mark{visibility:hidden;position:absolute;bottom:3px;right:5px;width:17px;height:17px;border-radius:4px;background:#c5e8dc;color:#1b493a;font-size:11px;font-weight:800}.show-groups .cycle-mark{visibility:visible}#selection{margin:0;min-height:0;font-size:13px;color:#b8e9df;align-self:center}#choiceGrid{margin:0;gap:8px}#choiceGrid .choice{min-height:0;border:2px solid #65818e;border-radius:8px;background:#ecf2f1;color:#183a48;transition:border-color .12s,background .12s}#choiceGrid .choice[aria-pressed=true]{border-color:#80efcd;background:#d8f9ec;box-shadow:0 0 0 2px #80efcd33}#choiceGrid .sign-icon{width:48px;height:48px}#choiceGrid strong{font-size:14px}#weatherBattleLive .battle-actions{display:grid;grid-template-columns:2fr 1fr;gap:8px;margin:0}#weatherBattleLive .battle-actions button{min-height:48px;padding:7px;font-size:14px;border-radius:8px}#checkBtn{background:#86dfbf;color:#102c2f;border:1px solid #b4ffe2}#resetBtn{background:#203c4c;color:#daebef;border-color:#567783}#status{margin:0;min-height:0;font-size:13px;line-height:1.4;color:#b5cbd5}#status.try{color:#ffce93}#status.good{color:#9ff5cc}#sequence[data-feedback=correct]{animation:forecast-success .5s ease-out}#sequence .mismatch{border-color:#ffb56d;animation:forecast-error .22s ease-out}#sequence .active-slot .weather-art{animation:forecast-card .16s ease-out}body[data-weather-state=result] #resultScreen{position:absolute;inset:0;min-height:0;height:100%;max-height:100%;padding:24px;grid-template-rows:minmax(100px,1fr) auto auto auto auto auto auto;gap:12px;align-content:start;border:0;border-radius:0;background:#112332;color:#f3f7f8;overflow-y:auto;overscroll-behavior:contain;text-align:center}#resultScreen .result-guide-wrap{width:100%;height:100%;min-height:100px;max-height:300px;margin:0}#resultScreen .result-guide{width:100%;height:100%;object-fit:cover;border-radius:10px;object-position:center 40%}#resultScreen h2{margin:0;font-size:25px;color:#a7f1ce}#resultScreen .eyebrow{margin:0;color:#b9ced8}#resultScreen .intro{margin:0;max-width:none;color:#e0ebef;font-size:14px}#resultScreen .result-reason{margin:0;padding:14px;border:1px solid #4c717a;background:#183d48;border-radius:8px;font-size:15px;line-height:1.5;color:#ddf3ef}#resultProgress{margin:0;font-size:13px;color:#b9ced8}#resultScreen .main-actions{margin:0;align-self:end}#resultScreen .main-actions button{font-size:13px;padding:8px 4px;min-height:52px;border-radius:8px}#resultScreen #nextBtn{background:#86dfbf;color:#102c2f}#resultScreen .secondary{background:#243e4d;color:#f0f7fa;border-color:#64818c}#resultScreen>:not(.result-icon){width:100%}#resultScreen{padding-bottom:24px!important}@media(max-aspect-ratio:3/2){#resultScreen{padding-bottom:100px!important}}@media(min-aspect-ratio:3/2){#weatherBattleLive{grid-template-columns:minmax(0,1fr) 300px;grid-template-rows:42px 46px 30px minmax(92px,1fr) 50px 44px;gap:6px 14px;padding:8px 14px}#sequence{grid-column:1;grid-row:2/7;padding:12px}#sequence .sign{min-height:100px}.observation-heading{grid-column:2;grid-row:1;grid-template-columns:minmax(0,1fr) 82px}#prompt{font-size:16px}#rule{grid-column:2;grid-row:2;font-size:12px;line-height:1.25;overflow:auto}#selection{grid-column:2;grid-row:3}#choiceGrid{grid-column:2;grid-row:4;height:92px;align-self:end}#weatherBattleLive .battle-actions{grid-column:2;grid-row:5}#status{grid-column:2;grid-row:6}body[data-weather-state=result] #resultScreen{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;grid-template-rows:20px 36px 38px minmax(60px,1fr) 28px 52px;gap:6px 20px;padding:16px 20px 24px;align-items:center!important}#resultScreen .result-guide-wrap{grid-column:1;grid-row:1/7;max-height:none;align-self:stretch}#resultScreen>:not(.result-icon){grid-column:2}#resultScreen h2{font-size:23px}#resultScreen .result-reason{padding:8px;font-size:14px}#resultScreen .main-actions{width:100%}}#weatherBattleLive:not([hidden]),#resultScreen:not([hidden]){animation:forecast-enter .18s ease-out}@keyframes forecast-enter{0%{opacity:.3}to{opacity:1}}@keyframes forecast-card{0%{transform:translateY(-5px);opacity:.5}to{transform:translateY(0);opacity:1}}@keyframes forecast-error{50%{background:#78502f}}@keyframes forecast-success{50%{box-shadow:inset 0 0 50px #6ee2ab66}}@media(prefers-reduced-motion:reduce){#weatherBattleLive,#sequence,#sequence *,#resultScreen{animation:none!important;transition:none!important}}