﻿@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;600;700;800;900&display=swap');
:root{color-scheme:dark;--ink:#e9f3ff;--muted:#92a4be;--cyan:#7bf0ed;--gold:#ffc677;--panel:#12213a}*{box-sizing:border-box}body{margin:0;background:#091426;color:var(--ink);font-family:'Noto Sans SC','Microsoft YaHei',sans-serif;font-size:14px;background-image:radial-gradient(ellipse at 50% 0%,#21344b55,transparent 70%)}button,a,input,select{-webkit-tap-highlight-color:transparent}button,select{font:inherit}button{cursor:pointer}button:disabled{cursor:wait;opacity:.6}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--gold);outline-offset:4px}button{color:inherit}button,a{touch-action:manipulation}a{text-decoration:none;color:inherit}[hidden]{display:none!important}.app{max-width:1440px;margin:auto;padding:0 48px}.topbar{height:100px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff0d}.brand{display:flex;align-items:center;gap:13px;font-size:21px;font-weight:800;letter-spacing:1px}.brand-icon{font-size:38px;color:var(--cyan);text-shadow:0 0 25px #70e5db55}.brand small{display:block;color:#92a4be;font-size:8px;letter-spacing:3.2px;margin-top:5px}.top-actions{display:flex;align-items:center;gap:23px}.local-note{font-size:11px;color:var(--muted)}i{font-style:normal}.local-note i,.live-label i{display:inline-block;width:6px;height:6px;background:#77dcc0;border-radius:50%;margin-right:6px}.quiet-button,.icon-button,.text-button{background:none;border:0}.quiet-button{padding:10px 13px;border:1px solid #ffffff20;border-radius:7px;font-size:12px}.icon-button{width:34px;height:34px;border:1px solid #ffffff20;border-radius:50%;font-size:21px;color:var(--muted)}.icon-button[aria-pressed=true]{color:var(--cyan);border-color:var(--cyan)}main{padding-top:28px}.mission-line{display:flex;align-items:center;gap:21px;margin-bottom:15px;font-size:12px;color:var(--muted)}.eyebrow{font-size:10px;letter-spacing:2px;color:var(--cyan);font-weight:700}.eyebrow b{margin-left:9px}.live-label{margin-left:auto;font-size:10px;letter-spacing:1px}.arena{position:relative;aspect-ratio:2.12;background:#263c58;border:1px solid #ffffff19;border-radius:18px;overflow:hidden;isolation:isolate;box-shadow:0 24px 75px #0004}#game{width:100%;height:100%;display:block}.battle-hud{position:absolute;left:27px;right:27px;top:23px;display:flex;align-items:center;justify-content:space-between;gap:15px;pointer-events:none}.hero-hud{display:flex;align-items:center;gap:12px;width:230px}.avatar{display:grid;place-items:center;background:#13374cbb;color:var(--cyan);border:1px solid #9ef0e266;border-radius:12px;width:44px;height:44px;font-size:28px}.hero-hud>div{flex:1}.hud-name{display:flex;align-items:center;justify-content:space-between;font-size:12px;font-weight:700;margin-bottom:9px;gap:15px}.hud-name small{font-size:9px;color:#c4d8ed;font-weight:400}.health-track{height:5px;border-radius:9px;background:#0a1b3288;overflow:hidden}.health-track>span{display:block;height:100%;width:100%;background:var(--cyan);border-radius:9px;transition:width .25s}.monster-hud{width:210px}.monster-track>span{background:#ffb593}.wave-badge{text-align:center;border:1px solid #ffffff35;background:#11223a77;border-radius:9px;padding:7px 18px;font-size:12px;backdrop-filter:blur(6px)}.wave-badge small{display:block;font-size:9px;color:#cee1ef;margin-top:3px}.welcome-layer{position:absolute;inset:0;padding:105px 0 30px 6%;background:linear-gradient(90deg,#0e203be8 0%,#0e203bbb 30%,transparent 76%)}.little-tag{font-size:11px;color:var(--gold);letter-spacing:3px}.welcome-layer h1{font-size:clamp(26px,4vw,58px);line-height:1.3;letter-spacing:3px;margin:13px 0 13px;font-weight:900}.welcome-layer h1 span{color:var(--cyan)}.welcome-layer p{color:#b7c8dc;font-size:12px;line-height:1.9}.welcome-buttons{display:flex;gap:10px;margin-top:22px}.primary-button,.secondary-button{border-radius:8px;padding:13px 19px;font-size:12px;font-weight:700;border:1px solid #ffffff35;display:inline-flex;align-items:center;justify-content:center;gap:22px}.primary-button{background:var(--cyan);border-color:var(--cyan);color:#102f3d;box-shadow:0 4px 24px #7bf0ed1c}.primary-button:hover{background:#b5fffa}.secondary-button{background:#11273ca8;color:#edf7ff}.secondary-button:hover{background:#25445b}.welcome-foot{display:block;color:#91a9c0;font-size:9px;margin-top:17px}.scene-caption{position:absolute;bottom:16px;left:24px;right:24px;display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.7px;color:#dce5f4a1;pointer-events:none}.scene-caption span:last-child{letter-spacing:.3px}.control-deck{display:grid;grid-template-columns:1fr 254px;gap:27px;margin-top:26px}.section-label{display:flex;align-items:center;justify-content:space-between;font-size:12px;letter-spacing:1px;margin-bottom:13px}.section-label small{font-size:10px;color:var(--muted);letter-spacing:0}.skill-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.skill-card{position:relative;display:flex;text-align:left;gap:18px;align-items:center;min-height:126px;padding:22px;border:1px solid #8dcae530;border-radius:12px;overflow:hidden;background:linear-gradient(120deg,#1d344d,#11233b);transition:border-color .15s,background .15s}.skill-card:hover{border-color:var(--cyan);background:#1c3951}.skill-card.disc{background:linear-gradient(120deg,#303441,#17253b);border-color:#f4c08233}.skill-card.disc:hover{border-color:var(--gold)}.skill-symbol{width:59px;height:59px;flex-shrink:0;display:grid;place-items:center;font-size:45px;color:var(--cyan);background:#7bf0ed0a;border-radius:50%;text-shadow:0 0 20px #7bf0ed88}.disc .skill-symbol{color:var(--gold);text-shadow:0 0 20px #ffcd6c77;background:#ffd48009}.skill-copy{display:flex;flex-direction:column;gap:7px}.skill-copy strong{font-size:16px;letter-spacing:1px}.skill-copy small{font-size:10px;color:#a8bad0}.skill-meta{font-size:9px;color:#74d2d9;display:flex;align-items:center;gap:12px;margin-top:5px}.disc .skill-meta{color:var(--gold)}.skill-meta b{display:inline-grid;place-items:center;border:1px solid #ffffff30;border-radius:3px;color:#a7bed0;width:20px;height:18px;font-size:9px}.cooldown{position:absolute;inset:auto 0 0;height:3px;background:var(--cyan);width:0;transition:width .1s}.disc .cooldown{background:var(--gold)}.energy-line{display:flex;align-items:center;gap:16px;justify-content:space-between;margin-top:14px;font-size:10px;color:var(--muted)}.charge-track{height:4px;background:#26374c;border-radius:9px;overflow:hidden;width:110px}.charge-track span{display:block;width:0;height:100%;background:var(--gold)}.text-button{font-size:10px;color:var(--muted);padding:0}.text-button:hover{color:var(--cyan)}.camera-card{border-left:1px solid #ffffff12;padding-left:25px}.camera-card .section-label{margin-bottom:11px}.camera-preview{height:119px;border:1px solid #ffffff16;background:#102037;border-radius:9px;position:relative;overflow:hidden}.camera-preview video,.camera-preview canvas{width:100%;height:100%;object-fit:contain;position:absolute;inset:0;transform:scaleX(-1)}#camera-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#6f899f;gap:6px}#camera-empty>span{font-size:32px;line-height:1}#camera-empty small{font-size:9px}.camera-state{position:absolute;bottom:7px;left:8px;font-size:8px;color:#b9cbdc;background:#0b192dba;padding:3px 5px;border-radius:3px}.camera-controls{display:flex;justify-content:space-between;gap:5px;margin-top:10px}.file-label{cursor:pointer}.file-label input{display:none}footer{display:flex;justify-content:space-between;padding:26px 0 24px;color:#647b96;font-size:10px}footer span:first-child{color:#9eafc3}.callout{position:absolute;left:50%;top:28%;transform:translateX(-50%);font-size:clamp(20px,3vw,40px);font-weight:900;color:#fff;white-space:nowrap;text-shadow:0 0 25px #72edee,0 3px 0 #153449;pointer-events:none;opacity:0}.callout.visible{opacity:1}.tracking-tip{position:absolute;bottom:45px;left:50%;transform:translateX(-50%);font-size:11px;background:#122239d9;padding:9px 16px;border-radius:20px;white-space:nowrap;color:#ffd9a5}.arena-pause{position:absolute;right:20px;bottom:42px;background:#10213c88;border:1px solid #ffffff40;border-radius:50%;width:34px;height:34px}.center-panel{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#0c1b32cf;backdrop-filter:blur(7px);gap:15px}.center-panel h2{font-size:32px;margin:0}.center-panel p{color:var(--muted);margin:0 0 12px}.center-panel .quiet-button{border:0}dialog{background:#12233c;border:1px solid #4d647c;border-radius:18px;color:var(--ink);max-width:650px;width:calc(100% - 32px);padding:35px;box-shadow:0 30px 100px #0008}dialog::backdrop{background:#030d20bd;backdrop-filter:blur(5px)}dialog h2{font-size:25px;margin:14px 0 24px}.dialog-close{position:absolute;right:15px;top:10px;background:none;border:0;font-size:28px;color:var(--muted)}.guide-grid{display:grid;grid-template-columns:1fr 1fr;gap:25px}.guide-grid h3{font-size:15px}.guide-grid p,.dialog-note{font-size:12px;color:#a7bdd2;line-height:1.9}.dialog-note{border-top:1px solid #ffffff18;padding-top:17px;margin-top:24px}.pose-illustration{height:100px;border-radius:10px;background:radial-gradient(ellipse,#234359,#172c43);position:relative;overflow:hidden}.pose-illustration i{position:absolute;width:18px;height:22px;border-radius:50%;background:#c7e6ed;left:calc(50% - 9px);top:12px}.pose-illustration b{position:absolute;width:20px;height:65px;left:calc(50% - 10px);top:36px;background:#d66569;border-radius:7px}.pose-illustration em{position:absolute;width:65px;height:9px;background:var(--cyan);left:calc(50% - 32px);top:53px;border-radius:5px}.pose-illustration em:after{content:'';position:absolute;width:9px;height:42px;left:35px;top:-22px;background:var(--cyan);border-radius:5px}.raise em{transform:rotate(-55deg);left:calc(50% - 50px);top:35px;width:60px}.raise em:after{width:40px;height:9px;left:31px;top:36px;transform:rotate(90deg)}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:13px;padding:15px 0;border-bottom:1px solid #ffffff12}.setting-row small{font-size:10px;color:var(--muted);margin-left:auto}select{background:#1a354d;color:var(--ink);padding:7px;border:1px solid #496079;border-radius:6px;max-width:200px}input[type=checkbox]{accent-color:var(--cyan);width:18px;height:18px}pre{font-size:11px;white-space:pre-wrap;color:var(--cyan);background:#08182c;padding:15px;border-radius:7px}#stop-input{margin-top:10px}
@media(min-width:1500px){.app{padding:0 56px}.arena{aspect-ratio:2.2}.welcome-layer{padding-top:110px}}@media(max-width:1050px){.app{padding:0 24px}.topbar{height:80px}.arena{aspect-ratio:1.8}.welcome-layer{padding-top:85px}.welcome-layer h1{font-size:38px}.control-deck{grid-template-columns:1fr 210px;gap:18px}.camera-card{padding-left:18px}.skill-card{padding:16px;gap:10px}.skill-symbol{width:43px;font-size:35px}.skill-copy strong{font-size:14px}.section-label small{display:none}}@media(max-width:700px){.app{padding:0 14px}.topbar{height:72px}.brand{font-size:17px;gap:8px}.brand-icon{font-size:30px}.brand small{font-size:6px;letter-spacing:2px}.top-actions{gap:10px}.local-note{display:none}.quiet-button{padding:8px}.mission-line{gap:10px;font-size:10px}.mission-line>span:nth-child(2){display:none}main{padding-top:19px}.arena{aspect-ratio:.96;border-radius:13px}.battle-hud{left:14px;right:14px;top:15px;gap:10px}.hero-hud{width:135px;gap:7px}.avatar{width:29px;height:35px;font-size:22px}.hud-name{font-size:10px;gap:5px;flex-wrap:wrap;margin-bottom:6px}.hud-name small{font-size:7px}.hero-hud .hud-name small{display:none}.monster-hud{width:105px}.monster-hud .hud-name small{display:none}.wave-badge{padding:5px 8px;font-size:10px}.wave-badge small{font-size:7px}.welcome-layer{padding:100px 25px 30px;background:linear-gradient(90deg,#10243bed,#10243b99 70%,#10243b33)}.welcome-layer h1{font-size:40px}.welcome-layer p{font-size:11px}.welcome-buttons{flex-direction:column;align-items:flex-start;gap:9px}.welcome-buttons button{min-width:210px}.welcome-foot{max-width:220px;line-height:1.8}.scene-caption{left:15px;right:15px;font-size:7px;bottom:12px}.control-deck{grid-template-columns:1fr;margin-top:20px;gap:20px}.skill-grid{gap:10px}.skill-card{min-height:120px;padding:14px 10px;gap:8px}.skill-symbol{width:32px;height:40px;font-size:29px}.skill-copy strong{font-size:13px;letter-spacing:0}.skill-copy small{font-size:9px}.skill-meta{font-size:8px}.camera-card{border-left:0;border-top:1px solid #ffffff12;padding:16px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:10px 18px}.camera-card .section-label{grid-column:1/-1;margin:0}.camera-preview{height:104px;grid-row:2/4}.camera-controls{flex-direction:column;justify-content:center;align-items:flex-start;gap:20px}footer{gap:15px;font-size:8px;line-height:1.8;padding-top:22px}footer span{max-width:50%}dialog{padding:27px 22px}.guide-grid{gap:16px}.guide-grid p{font-size:11px}.tracking-tip{font-size:9px;padding:8px 10px}.energy-line{font-size:9px}.charge-track{width:65px;flex-shrink:0}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.load-status{display:block;font-size:10px;color:#ffc677;margin-top:12px}.load-status.ready{color:#9cefd6}.threat{position:absolute;left:50%;top:90px;transform:translateX(-50%);padding:11px 22px;background:#291f30d9;border:1px solid #ffb79366;border-radius:10px;text-align:center;min-width:270px;backdrop-filter:blur(8px);pointer-events:none}.threat>span{font-size:10px;color:#ffd2ad;letter-spacing:2px}.threat strong{display:block;font-size:13px;margin-top:5px}.threat-progress{height:3px;margin-top:9px;background:#ffffff15;border-radius:3px;overflow:hidden}.threat-progress i{height:100%;background:#ffbd88;display:block;width:0}.guard-meter{position:absolute;left:25px;bottom:43px;font-size:9px;color:#c0f4e7;pointer-events:none}.guard-meter b{font-weight:500;margin-left:7px}.guard-meter>div{height:3px;width:84px;background:#172c41;margin-top:6px}.guard-meter i{height:100%;background:#8af3dc;width:100%;display:block}.defense-controls{display:flex;align-items:center;gap:10px;margin-top:12px}.defense-button{background:#162b41;border:1px solid #819fba30;color:#dceaf8;border-radius:7px;padding:9px 15px;font-size:11px;min-height:38px}.defense-button:hover,.defense-button[aria-pressed=true]{border-color:#7bf0ed;background:#20495b}.defense-controls>span{font-size:9px;color:var(--muted);margin-left:auto}.defense-button kbd{font:inherit;font-size:9px;color:#89a5bf;margin-left:10px}.guard-button{color:#8ef4d9}.arena-fullscreen{position:absolute;bottom:43px;right:62px;width:34px;height:34px;border:1px solid #ffffff40;border-radius:50%;background:#10213c88;font-size:21px}.arena:fullscreen{border:0;border-radius:0;width:100vw;height:100dvh;aspect-ratio:auto}.arena:fullscreen #game{height:100%;width:100%}.arena:fullscreen .welcome-layer{padding-top:18vh}.arena:fullscreen .battle-hud{left:4vw;right:4vw}.arena:fullscreen .scene-caption{bottom:22px}.arena:fullscreen .callout{top:35%}.callout{top:40%;font-size:clamp(18px,2.6vw,34px)}
@media(max-width:700px){.threat{top:74px;min-width:220px;max-width:90%;padding:9px 12px}.threat strong{font-size:11px}.threat>span{font-size:9px}.guard-meter{left:15px;bottom:40px}.defense-controls{gap:6px;flex-wrap:wrap}.defense-button{padding:9px 11px;flex:1;font-size:10px}.defense-button kbd{margin-left:5px}.defense-controls>span{flex-basis:100%;text-align:center;margin-top:2px;font-size:9px}.welcome-layer{padding-top:78px}.welcome-layer h1{font-size:32px;margin:10px 0}.welcome-layer p{font-size:10px}.welcome-buttons{margin-top:16px}.welcome-foot{margin-top:8px}.load-status{font-size:8px;margin-top:9px}.arena-fullscreen{right:57px;bottom:42px}.callout{white-space:normal;width:90%;text-align:center}}
@media(max-width:700px){.arena{aspect-ratio:.78;min-height:450px}.welcome-layer{padding-top:88px}.welcome-layer h1{font-size:36px}.welcome-foot{font-size:8px;margin-top:12px}.scene-caption span:last-child{max-width:55%;text-align:right}}
.arena-touch{display:none;position:absolute;bottom:48px;left:50%;transform:translateX(-50%);gap:8px;align-items:center}.arena:fullscreen .arena-touch{display:flex}.arena-touch button{border:1px solid #8addd777;background:#122c43c9;color:#e1fcff;border-radius:9px;min-width:48px;min-height:44px;padding:10px;font:inherit;font-size:12px;backdrop-filter:blur(6px)}.arena-touch button[aria-pressed=true]{background:#3d7b7c;border-color:#94fff0}@media(max-width:700px){.arena:fullscreen .arena-fullscreen,.arena:fullscreen .arena-pause{bottom:104px}.arena:fullscreen .guard-meter{bottom:112px}.arena:fullscreen .arena-touch{gap:5px}.arena-touch button{font-size:11px}}
/* Action diagrams and explicit readiness belong beside the skills they explain. */
.skill-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.skill-card{padding:36px 14px 17px;gap:10px;min-height:157px;align-items:center}.pose-icon{display:block;width:70px;height:90px;flex-shrink:0;color:#c6dce9}.skill-copy{min-width:0}.skill-copy strong{font-size:14px;letter-spacing:.4px}.skill-copy small{line-height:1.7;font-size:10px}.skill-status{position:absolute;right:12px;top:10px;font-size:10px;color:#94efde;letter-spacing:.3px}.skill-card.is-cooling .skill-status{color:#ffd18d}.skill-card.is-cooling{border-color:#ffd18d55}.skill-card .skill-meta{font-size:9px;gap:8px}.shield-card{background:linear-gradient(120deg,#183b3e,#13283b);border-color:#87e6c83d}.shield-card:hover,.shield-card.is-guarding{border-color:#91f6cd;background:#1b4548}.shield-card .skill-meta{color:#93efcb}.shield-charge{position:absolute;bottom:0;left:0;right:0;height:3px;background:#102b35}.shield-charge i{display:block;width:100%;height:100%;background:#8cedc6}.movement-strip{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px;padding:8px 15px;background:#0e2035;border:1px solid #ffffff12;border-radius:10px}.movement-strip>div{display:flex;align-items:center;gap:10px}.movement-strip .pose-icon{width:55px;height:67px}.movement-strip strong,.movement-strip small{display:block}.movement-strip strong{font-size:11px;font-weight:500;color:#d4edf6}.movement-strip small{font-size:9px;color:var(--muted);margin-top:7px}.defense-controls{flex-wrap:wrap}.defense-controls>span{font-size:9px}.guide-intro{color:#b9cedf;font-size:12px;line-height:1.9;margin:-10px 0 22px}#help-dialog{max-width:920px;max-height:calc(100dvh - 36px);overflow-y:auto;padding:30px}.guide-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.move-guide{background:#0d1d32;border:1px solid #ffffff15;border-radius:12px;padding:18px 15px}.move-guide>.pose-icon{width:100%;height:145px}.move-guide h3{font-size:14px;margin:13px 0 9px;color:#e3f8ff}.move-guide p{font-size:11px;line-height:1.9;margin:0 0 14px}.pose-sequence{height:145px;display:flex;align-items:center;justify-content:center;gap:0}.pose-sequence .pose-icon{width:calc(50% - 6px);height:140px}.pose-sequence>span{color:#ffd18d}.rule-pill{display:inline-block;border:1px solid #8dcac238;border-radius:5px;font-size:10px;color:#9af0d8;background:#7bf0ed08;padding:5px 7px;line-height:1.5}.move-guide .energy-explain{font-size:10px;color:#8faabd;margin:12px 0 0}.dodge-guide{border:1px solid #ffffff15;background:#102239;border-radius:12px;padding:16px 20px;margin-top:18px}.dodge-guide h3{font-size:14px;margin:0 0 12px}.dodge-steps{display:grid;grid-template-columns:1fr 1fr;gap:15px}.dodge-steps>div{display:grid;grid-template-columns:100px 1fr;align-items:center;column-gap:15px}.dodge-steps .pose-icon{width:100px;height:115px;grid-row:span 2}.dodge-steps strong{font-size:12px;align-self:end;color:#a9e7f5}.dodge-steps small{font-size:10px;line-height:1.8;align-self:start;padding-top:8px;color:#a9bdd1}.dodge-guide p{font-size:11px;line-height:1.9;color:#a1b9ce;margin-bottom:0}
@media(max-width:1100px) and (min-width:701px){.control-deck{grid-template-columns:1fr}.camera-card{display:grid;grid-template-columns:200px 1fr;gap:10px 20px;border-left:0;border-top:1px solid #ffffff12;padding:16px 0}.camera-card .section-label{grid-column:1/-1}.camera-controls{justify-content:flex-start;gap:25px;align-items:center}.skill-card{gap:15px}.skill-copy strong{font-size:15px}}
@media(max-width:700px){.skill-grid{grid-template-columns:1fr;gap:10px}.skill-card{min-height:132px;padding:24px 17px 13px;gap:20px}.skill-card>.pose-icon{width:82px;height:95px}.skill-copy strong{font-size:16px}.skill-copy small{font-size:11px}.skill-card .skill-meta{font-size:10px}.skill-status{right:15px;top:10px}.defense-controls>span{line-height:1.9}.movement-strip{padding:8px;gap:4px}.movement-strip>div{gap:3px}.movement-strip .pose-icon{width:49px;height:68px}.movement-strip strong{font-size:10px}.movement-strip small{font-size:8px;line-height:1.7;margin-top:4px}#help-dialog{padding:26px 18px;max-height:calc(100dvh - 24px)}#help-dialog h2{font-size:21px}.guide-grid{grid-template-columns:1fr;gap:12px}.move-guide{display:grid;grid-template-columns:100px 1fr;gap:0 14px;padding:15px 12px}.move-guide>.pose-icon,.move-guide>.pose-sequence{grid-row:span 4;width:100px;height:145px}.move-guide h3{margin-top:0;font-size:13px}.move-guide p{font-size:11px;margin-bottom:10px}.pose-sequence{flex-direction:column;height:190px!important;gap:0}.pose-sequence .pose-icon{width:77px;height:80px}.pose-sequence>span{transform:rotate(90deg);font-size:12px}.move-guide .energy-explain{font-size:9px;margin-top:8px}.rule-pill{font-size:9px;padding:4px 5px}.dodge-guide{padding:15px 12px}.dodge-guide h3{font-size:12px}.dodge-steps{gap:8px}.dodge-steps>div{display:flex;flex-direction:column;text-align:center;gap:5px}.dodge-steps .pose-icon{width:100%;height:115px}.dodge-steps strong{font-size:10px;align-self:center}.dodge-steps small{font-size:9px;align-self:center;padding-top:0}.dodge-guide p{font-size:10px}}
.prep-summary{display:flex;align-items:center;gap:25px;margin-top:24px;padding:19px 22px;border:1px solid #7bf0ed24;background:#11283a;border-radius:12px}.prep-summary strong{font-size:14px}.prep-summary p{font-size:11px;line-height:1.9;color:#b6cbdc;margin:8px 0}.prep-summary small{font-size:10px;color:#8fabbe}.prep-summary button{flex-shrink:0}.punch-guide{display:flex;gap:24px;align-items:center;border:1px solid #8bc6d52b;border-radius:12px;background:#10273b;padding:15px 22px;margin-bottom:16px}.punch-guide .pose-icon{width:110px;height:110px}.punch-guide h3{font-size:14px;margin:0 0 10px}.punch-guide p{font-size:11px;color:#b3c7d9;line-height:1.8}.in-battle{overflow:hidden;background:#091426}.in-battle .app{max-width:none;padding:0}.in-battle .topbar,.in-battle .mission-line,.in-battle .control-deck,.in-battle .prep-summary,.in-battle footer{display:none!important}.in-battle main{padding:0}.in-battle .arena,.in-battle .arena:fullscreen{position:fixed;inset:0;width:100vw;height:100dvh;aspect-ratio:auto;min-height:0;border:0;border-radius:0;box-shadow:none;z-index:1000}.in-battle .arena>*:not(#game){display:none!important}.in-battle #game{display:block;width:100%;height:100%;cursor:default;touch-action:none}
@media(max-width:700px){.prep-summary{padding:16px;gap:12px;flex-direction:column;align-items:stretch}.prep-summary p{font-size:10px}.prep-summary small{font-size:9px;line-height:1.9}.punch-guide{gap:12px;padding:12px}.punch-guide .pose-icon{width:85px;flex-shrink:0}.punch-guide h3{font-size:12px}.punch-guide p{font-size:10px}.punch-guide .rule-pill{font-size:8px}}
.recognition-ready{display:flex;align-items:center;gap:16px;margin-bottom:12px;font-size:11px;color:#ffd08d}.recognition-ready [data-state=ready]{color:#8be9c5}.recognition-ready [data-state=error]{color:#ffb2a6}.recognition-ready #retry-pose{color:#8be9e2;text-decoration:underline;text-underline-offset:3px}
#credits-dialog{max-width:760px;max-height:calc(100dvh - 36px);overflow:auto}.credits-intro{font-size:12px;line-height:1.9;color:#a6bed1;margin:-10px 0 22px}.credits-list{display:grid;grid-template-columns:1fr 1fr;gap:13px}.credit-item{padding:17px;border:1px solid #ffffff18;border-radius:11px;background:#0d2035}.featured-credit{grid-column:1/-1;border-color:#8be8da40;background:linear-gradient(120deg,#153640,#12283d)}.credit-heading{display:flex;align-items:center;gap:12px;justify-content:space-between}.credit-item h3{font-size:14px;margin:0;color:#e0f4ff}.license-tag{font-size:9px;color:#91ebd2;border:1px solid #87dac53d;border-radius:5px;padding:4px 7px;white-space:nowrap}.credit-item p{font-size:11px;line-height:1.9;color:#afc4d7;margin:12px 0}.credit-item a{font-size:11px;color:#87dfdc;text-decoration:underline;text-underline-offset:3px}.credit-item .credit-note{font-size:10px;color:#91acbf;margin-bottom:0}.credit-note a{font-size:10px}#credits-dialog>.primary-button{margin-top:2px}@media(max-width:700px){#credits-dialog{padding:28px 20px}.credits-list{grid-template-columns:1fr}.featured-credit{grid-column:auto}.credit-item{padding:15px}.credit-heading{gap:8px}.credit-item h3{font-size:12px}.credit-item p,.credit-item a{font-size:10px}.license-tag{font-size:8px;padding:4px 5px}.credits-intro{font-size:11px}}
.in-battle #game:focus{outline:none}.shield-card.is-cooling .shield-charge i{background:var(--gold)}

.skill-grid,.guide-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:600px){.guide-grid{grid-template-columns:1fr}}

/* During combat only the two health bars remain above the world. */
.in-battle .arena>.battle-hud:not(#game){display:flex!important;position:fixed;top:max(18px,env(safe-area-inset-top));left:4vw;right:4vw;gap:24px;z-index:3;align-items:flex-start}
.in-battle .battle-hud .wave-badge,.in-battle .battle-hud .avatar,.in-battle .battle-hud small{display:none}
.in-battle .hero-hud,.in-battle .monster-hud{width:min(32vw,290px);padding:10px 13px 12px;background:linear-gradient(110deg,#0b203bd9,#0b203b70);border:1px solid #c1e8ff22;border-radius:10px}
.in-battle .health-track{height:7px;background:#0007}.in-battle .hud-name{font-size:12px;margin-bottom:8px;flex-wrap:nowrap;white-space:nowrap;text-shadow:0 1px 2px #000}
.hud-name b{font-size:10px;font-variant-numeric:tabular-nums;font-weight:500;color:#dce9f2}.monster-hud .hud-name{flex-wrap:wrap;gap:5px}.monster-hud #monster-type{display:none}
@media(max-width:600px){.in-battle .hero-hud,.in-battle .monster-hud{width:44vw;padding:8px}.in-battle .battle-hud{gap:12px;left:3vw;right:3vw}.in-battle .hud-name{font-size:10px}.hud-name b{font-size:9px}}

.celebration{position:absolute;left:50%;top:15%;transform:translateX(-50%);display:grid;gap:8px;justify-items:center;padding:20px 34px 24px;border-radius:20px;border:1px solid #8ff0e4a8;background:linear-gradient(180deg,#0d2436e0,#0a1a29cc);box-shadow:0 0 60px #59e6d53d,inset 0 0 40px #59e6d51f;text-align:center;z-index:5;pointer-events:none;animation:celebration-in .55s cubic-bezier(.2,.9,.25,1) 3.2s both}
.celebration h2{margin:2px 0 0;font-size:clamp(24px,3.4vw,42px);letter-spacing:4px;font-weight:900;color:#fff;text-shadow:0 0 26px #7bf0ed,0 3px 0 #16404d}
.celebration p{margin:0;font-size:12px;color:#c9dcec;letter-spacing:1px}
body.celebrating .battle-hud{opacity:.4;transition:opacity .6s}
body.celebrating .callout{top:32%}
@keyframes celebration-in{from{opacity:0;transform:translate(-50%,14px) scale(.94)}to{opacity:1;transform:translate(-50%,0) scale(1)}}
@media(prefers-reduced-motion:reduce){.celebration{animation:none}}
.in-battle .arena > #celebration:not([hidden]){display:grid!important;position:fixed;top:max(12vh,88px);left:50%;z-index:6}


.in-battle .arena>#wave-loading:not(#game):not([hidden]){display:flex!important;z-index:5;position:fixed}dialog{overscroll-behavior:contain}
