*{box-sizing:border-box}body{margin:0;background:#06111e;color:#dfedf3;font:14px/1.5 system-ui,sans-serif}button,input,select{font:inherit}button,a,select{touch-action:manipulation}button,a{cursor:pointer}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #f2c06b;outline-offset:3px}.top{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px 26px;border-bottom:3px solid #37677f;background:#0c2133}.top small{color:#70c6dc;font:700 10px monospace;letter-spacing:2px}.top h1{margin:2px 0;font-size:23px;color:#f2c06b}.top a{color:#a1dceb;text-decoration:none;border:1px solid #426d82;padding:10px;font-size:12px}main{display:grid;grid-template-columns:minmax(0,1fr) 265px;gap:18px;max-width:1500px;margin:20px auto;padding:0 22px}.game{min-width:0;border:3px solid #4b8ca2;box-shadow:inset 0 0 0 2px #06111e,5px 6px #020710;background:#0a1d2e}.hud{display:grid;grid-template-columns:1fr 90px 1fr;gap:10px;padding:13px;background:#102e42;border-bottom:2px solid #416a7e}.hud>div{display:grid;align-content:center}.hud small{font:700 9px monospace;color:#8bc7d9}.hud strong{font-size:19px}.hud span{font-size:11px;color:#abc8d6}.round{justify-items:center;border:1px solid #42697d;background:#071827}.round b{font:700 27px monospace;color:#f2c06b}.hud-note{text-align:right}.hud-note b{font-size:10px;color:#f2c06b}.turn-strip{padding:9px 12px;background:#6b3039;display:flex;align-items:center;flex-wrap:wrap;gap:5px 12px}.turn-strip>strong{font:700 11px monospace;color:#ffe1b1}.turn-strip>span{font-size:11px;flex:1;min-width:100px}#order{display:flex;gap:4px}#order span{padding:3px 5px;font:700 9px monospace;background:#1b2d40;color:#aec9d6}#order span.active{background:#f2c06b;color:#152a39}.arena{position:relative;background:#101c32 url('rooftop.svg') center bottom/cover no-repeat;overflow:hidden}canvas{display:block;width:100%;aspect-ratio:1200/450;image-rendering:pixelated}.location{position:absolute;top:12px;left:14px;color:#a1dceb;font:700 10px monospace;pointer-events:none}.location span{display:block;font-size:8px;color:#9db1c7;margin-top:4px}.hero-label{position:absolute;bottom:10%;left:12%;font:700 10px monospace;color:#f2c06b;text-shadow:1px 2px #020710}#targets button{position:absolute;bottom:7%;width:15%;padding:7px 3px;transform:translateX(-50%);min-height:44px;background:#102b3be8;border:1px solid #3d6a7e;color:#e3edf1;font:700 10px monospace;white-space:normal}#targets button[aria-pressed=true]{border:2px solid #f2c06b;color:#ffe3af;background:#5e4730dd}#targets button[aria-pressed=true]::before{content:'▼ ';color:#f2c06b}#targets button small{display:block;font-size:8px;color:#abc6d3;margin-top:2px}#effect-label{position:absolute;top:19%;left:50%;transform:translateX(-50%);font:700 14px monospace;color:#ffe5ac;text-shadow:2px 2px #020710;pointer-events:none;text-align:center}.command{padding:12px;background:#0b2235;border-top:2px solid #426f83}.command-heading{display:flex;justify-content:space-between;gap:8px;color:#8bc7d9;font:700 9px monospace;margin-bottom:8px}#skills{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}#skills button{min-width:0;min-height:65px;padding:9px 5px;border:2px solid #3c6276;background:#12324a;color:#dfedf3;box-shadow:2px 3px #020710}#skills button strong{display:block;font-size:12px}#skills button small{display:block;font-size:9px;color:#9ecbd8;margin-top:4px}#skills button[aria-pressed=true]{background:#25526a;border-color:#8cdeed}#skills .ultimate{background:#6d303c;border-color:#a75760}#skills button:disabled,#targets button:disabled{cursor:default;opacity:.7}.passive{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px;font:700 9px monospace;color:#8fb7c9}.passive button{min-height:34px;border:1px solid #4d7183;color:#c8e3ed;background:#1b394b;font:500 11px system-ui;padding:5px 10px}.passive p{flex-basis:100%;font:400 12px/1.6 system-ui;margin:0}.skill-info{margin-top:12px;padding:10px;border-left:2px solid #4f9eb5;background:#071928}.skill-info strong{font-size:13px;color:#f2c06b}.skill-info p{margin:4px 0 0;font-size:12px;color:#afc8d6}.action{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:12px}.action button{min-height:46px;padding:10px 22px;border:2px solid #f6cf85;background:#e6ae5f;color:#13293a;font:700 12px monospace;box-shadow:3px 3px #020710}.action button:disabled{background:#254253;border-color:#496c7f;color:#a8beca;cursor:default}.action>span{font-size:10px;color:#a1bac9;flex:1;min-width:150px}.panel{align-self:start;padding:16px;border:1px solid #355d74;background:#0c2234}.panel h2{font-size:14px;color:#f2c06b;margin:0 0 12px}.steps{padding-left:20px;margin:0 0 18px;color:#abc6d3;font-size:12px}.steps li{margin:7px 0}.options{display:grid;gap:10px;padding:14px 0;border-block:1px solid #2f5369;margin-bottom:18px}.options label{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12px}.options select,.options button{min-height:40px;background:#071a2b;border:1px solid #496b81;color:#dbeaf1;padding:7px}.options .check{justify-content:flex-start}.options input{accent-color:#f2c06b}.options button{cursor:pointer}#log{padding-left:17px;font-size:11px;color:#b9d1dd;max-height:180px;overflow:auto}#log li{padding-block:4px}.note{font-size:10px;line-height:1.7;color:#86a5b7;border-top:1px solid #2f5369;padding-top:12px}@media(max-width:1000px){main{grid-template-columns:minmax(0,1fr);max-width:1000px}.panel{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.panel .note{grid-column:1/-1}.options{grid-column:2;grid-row:1/span 3}.panel>h2:nth-of-type(2){grid-column:1}.hud-note b{font-size:9px}}@media(max-width:600px){.top{padding:12px 14px}.top h1{font-size:18px}.top a{font-size:10px;padding:8px}.top small{font-size:8px;letter-spacing:1px}main{padding:0 7px;margin:10px auto;gap:12px}.hud{grid-template-columns:1fr 52px 1fr;gap:6px;padding:9px}.hud strong{font-size:13px}.hud span{font-size:9px}.hud small{font-size:8px}.hud-note b{font-size:8px}.round b{font-size:23px}.round small{text-align:center}.turn-strip{padding:8px;gap:5px}.turn-strip>strong{font-size:10px}.turn-strip>span{font-size:10px}#order{flex-basis:100%}canvas{aspect-ratio:1200/600}.location{font-size:8px;top:8px;left:8px}#targets button{font-size:8px;min-height:38px;bottom:5%;width:18%;padding:5px 2px}#targets button small{font-size:7px}.hero-label{font-size:8px;left:7%;bottom:7%}#effect-label{font-size:11px;top:20%}#skills{grid-template-columns:repeat(2,minmax(0,1fr))}#skills button{min-height:56px}.command{padding:10px}.command-heading{font-size:8px}.skill-info p{font-size:11px}.action button{flex:1}.action>span{flex-basis:100%}.panel{padding:12px;gap:0 12px}.options label{font-size:10px}.panel h2{font-size:12px}}
/* Actual turn controls: invisible body hit areas and one arrow above the target. */
.hud{grid-template-columns:minmax(0,1.3fr) 78px minmax(0,1fr)}.hero-resources{display:grid;gap:5px;margin-top:8px;max-width:300px}.hero-resources label{display:grid;grid-template-columns:45px 1fr auto;align-items:center;gap:6px;font:700 10px monospace}.hero-resources label b{grid-column:3;grid-row:1;font-size:11px}.hero-resources i{grid-column:2;grid-row:1;display:block;background:#03111e;height:7px;border:1px solid #3c6173}.hero-resources em{display:block;height:100%;background:#d96969;transition:width .2s}.hero-resources label:last-child em{background:#77c0df}#targets button,#targets button[aria-pressed=true]{width:16%;height:52%;bottom:21%;padding:0;min-height:0;border:0;box-shadow:none;background:transparent;color:transparent;outline:none;transform:translateX(-50%)}#targets button[aria-pressed=true]::before{content:none}#targets button:focus-visible{outline:2px dashed #8cdeed;outline-offset:1px}#targets button:disabled{opacity:1}#foe-plates>div{position:absolute;bottom:5%;width:15%;transform:translateX(-50%);pointer-events:none;text-align:center;color:#ddeaf0;font:700 9px/1.4 monospace;text-shadow:1px 1px #03101b}#foe-plates strong{display:block;color:#f3dab0;font-size:10px}#foe-plates i{display:block;height:6px;background:#281721;border:1px solid #78484c;margin:4px 0}#foe-plates em{display:block;height:100%;background:#d66d6d;transition:width .2s}#foe-plates small{display:block;color:#c4d9e5;font-size:8px}#foe-plates .is-dead{opacity:.4}#foe-plates .status{color:#8dd9ed;font-size:8px}#skill-filters{display:flex;gap:5px;flex-wrap:wrap;margin:8px 0}#skill-filters button{min-height:35px;padding:5px 9px;border:1px solid #3c6276;background:#0b263a;color:#b9d2dd;font-size:11px}#skill-filters button[aria-pressed=true]{border-color:#f2c06b;color:#ffe1a5}#skills{grid-template-columns:repeat(4,minmax(0,1fr));max-height:280px;overflow-y:auto;padding:3px}#skills button{min-height:76px;position:relative}#skills button:disabled{opacity:.5}#skills button .reason{color:#f2b4aa;font-size:9px}.direct-hint,.catalog-status{color:#a9c5d5;font-size:10px;margin:9px 0 0}.rules{font-size:11px;color:#a9c5d5;margin:12px 0}.rules summary{cursor:pointer;min-height:34px;color:#f2c06b}.rules p{font-size:11px;line-height:1.7}#result{position:absolute;inset:0;z-index:10;background:#071a2deb;display:grid;place-content:center;text-align:center;gap:8px;padding:16px}#result[hidden]{display:none}#result h2{margin:0;color:#f2c06b;font:700 27px monospace}#result p{font-size:12px;color:#c7dce5}#result button{padding:12px;border:2px solid #f2c06b;background:#e7b465;color:#142b3b;font-weight:700;min-height:44px}.panel .note{grid-column:1/-1}@media(max-width:600px){.hud{grid-template-columns:minmax(0,1.2fr) 42px minmax(0,1fr)}.hero-resources label{grid-template-columns:30px 1fr auto;font-size:8px;gap:4px}.hero-resources label b{font-size:8px}.hud-note span{font-size:8px}.hud-note b{font-size:8px}.round b{font-size:20px}#foe-plates>div{width:18%;font-size:8px;bottom:3%}#foe-plates strong{font-size:8px}#foe-plates small{font-size:7px}#foe-plates i{height:5px;margin:3px 0}#skill-filters{gap:4px}#skill-filters button{font-size:9px;padding:5px 6px;min-height:33px}#skills{grid-template-columns:repeat(2,minmax(0,1fr));max-height:240px}#skills button{min-height:65px}.rules{grid-column:1/-1}}
.reaction-review{font:400 11px/1.6 system-ui;color:#aac9d8;margin:12px 0;border-block:1px solid #31556a;padding:9px 0}.reaction-review summary{min-height:36px;cursor:pointer;color:#f2c06b;font-weight:700}.reaction-review label{display:grid;gap:5px;margin:8px 0}.reaction-review select,.reaction-review button{min-height:38px;width:100%;padding:8px;border:1px solid #4b6e82;background:#0a2134;color:#d7eaf4;font:inherit}.reaction-review button{font-weight:700;color:#f2c06b;cursor:pointer}.reaction-review button:disabled{opacity:.45;cursor:default}.reaction-review p{font-size:10px}@media(max-width:1000px){.reaction-review{grid-column:1/-1}}

.source-preview{margin-top:12px;padding:12px;border:1px solid #42697d;background:#071928;font-size:12px}.source-preview summary{cursor:pointer;color:#a1dceb;min-height:30px}.source-preview label{display:block;margin:8px 0}.source-preview select,.source-preview button{min-height:42px;border:1px solid #4b6e82;background:#102e42;color:#dfedf3;padding:8px;max-width:100%}.source-preview button{margin-left:8px}.source-preview p{color:#a9c5d5;overflow-wrap:anywhere}#skills button strong{overflow-wrap:anywhere}#skills{max-height:360px}
.mode-switch{display:flex;flex-wrap:wrap;gap:8px;max-width:1500px;padding:14px 22px 0;margin:auto}.mode-switch button,.mode-switch a{min-height:42px;padding:9px 13px;border:1px solid #4b6e82;background:#102e42;color:#dbeaf1;font-size:12px;text-decoration:none}.mode-switch button[aria-pressed=true]{border-color:#f2c06b;color:#ffe1a5;background:#324337}.mode-switch a{margin-left:auto;color:#9bcbdc}#native-toolbar{padding:12px 14px;border-bottom:1px solid #426f83;background:#102e42;display:flex;flex-wrap:wrap;gap:5px 20px}#native-toolbar strong{font:700 11px monospace;color:#f2c06b}#native-toolbar span{margin-left:auto;font:11px monospace;color:#b9d2dd}#native-toolbar p{flex-basis:100%;margin:0;font-size:10px;color:#9dbbcb}#native-controls{padding:14px;background:#0b2235;border-top:2px solid #426f83}.native-player{display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin-bottom:12px}.native-player button,#native-filters button,#native-states button{min-height:39px;padding:7px 10px;border:1px solid #4b6e82;background:#102e42;color:#c6e0ed;font-size:11px}.native-player label{font-size:10px;color:#a6c2d1}.native-player input{flex:1;min-width:130px;accent-color:#f2c06b}#native-filters{display:flex;flex-wrap:wrap;gap:5px;margin:12px 0}#native-filters button[aria-pressed=true]{border-color:#f2c06b;color:#ffe1a5}#native-moves{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;max-height:350px;overflow:auto;padding:3px}#native-moves button{min-width:0;min-height:74px;border:2px solid #3c6276;background:#12324a;box-shadow:2px 3px #020710;color:#dfedf3;padding:9px 6px}#native-moves strong{display:block;font-size:11px;overflow-wrap:anywhere}#native-moves small{display:block;font-size:9px;color:#94bdcf;margin-top:6px;overflow-wrap:anywhere}#native-moves button[aria-pressed=true]{border-color:#f2c06b;background:#3e4436}.native-detail{padding:12px;background:#071928;border-left:2px solid #60b0c4;margin-top:12px;font-size:12px}.native-detail strong{color:#f2c06b}.native-detail p{margin:6px 0;color:#b3cddb}.native-detail #native-chain{font:10px/1.7 monospace;overflow-wrap:anywhere;color:#81c9dc}.native-detail small{font-size:10px;color:#8caebe}#native-controls details{margin-top:12px;font-size:12px}#native-controls summary{min-height:36px;cursor:pointer;color:#a1dceb}#native-states{display:flex;gap:6px;flex-wrap:wrap}.native-limit{font-size:10px;line-height:1.7;color:#8aa9bb}.native-explanation p{font-size:11px;color:#a7c5d5}.native-explanation{margin-bottom:16px}body[data-mode=native] .hero-resources,body[data-mode=native] .round,body[data-mode=native] .hud-note,body[data-mode=native] .turn-strip,body[data-mode=native] .command,body[data-mode=native] .hero-label,body[data-mode=native] .panel>.steps,body[data-mode=native] .panel>h2,body[data-mode=native] .panel>.rules,body[data-mode=native] .panel>.reaction-review,body[data-mode=native] #log,body[data-mode=native] .panel>.note,body[data-mode=native] .options #reset,body[data-mode=native] #foe-plates i,body[data-mode=native] #foe-plates small{display:none}body[data-mode=native] .hud{grid-template-columns:1fr}body[data-mode=native] .hud>div:first-child{display:flex;gap:14px;align-items:baseline}body[data-mode=trial] #native-controls,body[data-mode=trial] #native-toolbar,body[data-mode=trial] .native-explanation{display:none}@media(max-width:1000px){.native-explanation{grid-column:1/-1}.panel .options{grid-column:auto;grid-row:auto}.mode-switch a{margin-left:0}}@media(max-width:600px){.mode-switch{padding:10px 7px 0}.mode-switch button,.mode-switch a{font-size:10px;padding:8px}#native-controls{padding:9px}#native-moves{grid-template-columns:repeat(2,minmax(0,1fr));max-height:310px}#native-moves button{min-height:70px}#native-toolbar span{margin-left:0}#native-toolbar strong{font-size:10px}.native-player button{font-size:10px}#native-filters button{font-size:9px}}

body[data-mode=native] .options .check{display:none}
body[data-embed=true]{min-height:100dvh;overflow:auto;background:#06111e}body[data-embed=true] .top,body[data-embed=true] .mode-switch,body[data-embed=true] .panel{display:none}body[data-embed=true] main{display:block;width:100%;max-width:none;min-height:100dvh;margin:0;padding:0}body[data-embed=true] .game{width:100%;min-height:100dvh;border:0;box-shadow:none}body[data-embed=true] .hud{border-top:0}body[data-embed=true] .hud-note span{font-size:0}body[data-embed=true] .hud-note span::after{content:'Màn Battle chính';font-size:11px}@media(max-width:600px){body[data-embed=true] main{margin:0;padding:0}body[data-embed=true] .game{border:0}body[data-embed=true] .hud-note span::after{font-size:8px}}
#defense-lab{margin-top:14px;padding:13px;background:#0b2d3b;border:1px solid #548ca1}#defense-lab[hidden]{display:none}.defense-title{display:flex;gap:10px;flex-wrap:wrap;justify-content:space-between;font-size:11px;color:#f2cf83}#defense-status{color:#92d7e6}.defense-controls{display:flex;flex-wrap:wrap;gap:12px;margin:12px 0}.defense-controls label{font-size:11px;color:#b7d1dc;display:grid;gap:5px;flex:1;min-width:145px}.defense-controls select{padding:9px;min-height:40px;background:#071b2a;color:#d9eaf1;border:1px solid #517a8c;font-size:11px}.defense-ammo{display:flex;gap:12px;align-items:center;font-size:12px;color:#e4d7aa}#defense-pips{display:flex;gap:5px}#defense-pips i{width:20px;height:13px;border:1px solid #527d91;background:#0a1928}#defense-pips i.full{background:#9ce3ee;border-color:#c3f8ff}.defense-timing{display:flex;margin:12px 0;font:10px/1.6 monospace}.defense-timing span{padding:5px 7px;flex:1}.timing-perfect{background:#174d48;color:#a9ebc9}.timing-normal{background:#233e61;color:#b4d8ff}.timing-recover{background:#493443;color:#f0b5c3}#defense-event{font-size:12px;color:#c5dbe7}.sense-toggle{display:flex;gap:8px;align-items:center;min-height:42px;font-size:11px;color:#b8d2df}.sense-toggle input{accent-color:#f2c06b}.defense-note{font-size:10px;line-height:1.7;color:#8db2c4}@media(max-width:600px){.defense-timing{font-size:8px}.defense-timing span{padding:5px}.defense-title{font-size:10px}.defense-controls{gap:8px}.defense-controls label{min-width:120px}}