body.tactics-page{color:#1b2823;background:#161b18;margin:0}body.tactics-page *{box-sizing:border-box}.tactics-demo{--cream:#f4ecd9;--paper:#e6dbc1;--ink:#17231f;--blue:#173d62;--blue-bright:#4f9fc5;--red:#8d2e2a;--gold:#c99d4d;--green:#314f3e;background:linear-gradient(#e8dec8,#d8c8a8);min-height:100vh;font-family:PingFang SC,Microsoft YaHei,sans-serif;overflow:hidden}.topbar{background:#f4ecd9eb;border-bottom:1px solid #1e2a2359;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;min-height:76px;padding:0 clamp(1rem,4vw,3.5rem);display:grid}.topbar>a{color:var(--ink);align-items:center;gap:.8rem;text-decoration:none;display:flex}.topbar>a span{aspect-ratio:1;background:var(--blue);color:#fff;border-radius:50%;place-items:center;width:38px;font:700 .75rem Georgia,serif;display:grid}.topbar>a strong{letter-spacing:.12em;font-family:Songti SC,serif;font-size:1.1rem}.topbar>div{flex-direction:column;align-items:center;display:flex}.topbar>div b{color:var(--red);letter-spacing:.18em;font:italic .64rem Georgia,serif}.topbar>div span{color:#676d67;margin-top:.1rem;font-size:.68rem}.topbar>button{border:0;border-bottom:1px solid var(--ink);color:var(--ink);cursor:pointer;background:0 0;justify-self:end}.mission{grid-template-columns:1fr minmax(260px,420px);align-items:end;gap:3rem;width:min(1420px,100% - 6rem);margin:0 auto;padding:clamp(2rem,5vw,4rem) 0 2rem;display:grid}.mission p{color:#5e675f;margin:0;line-height:1.8}.mission>div>p{color:var(--red);letter-spacing:.16em;font:italic .68rem Georgia,serif}.mission h1{letter-spacing:-.06em;margin:.5rem 0 0;font:500 clamp(2.8rem,5vw,5.4rem)/.95 Songti SC,serif}.mission h1 em{color:var(--blue);font-style:normal}.game-layout{background:var(--cream);border:1px solid #716f61;grid-template-columns:minmax(600px,1.4fr) minmax(340px,.6fr);width:min(1500px,100% - 3rem);margin:0 auto 4rem;display:grid;box-shadow:0 30px 80px #1f211b33}.battlefield-wrap{background:radial-gradient(circle at 50% 40%,#ffffffb3,#0000 55%),linear-gradient(145deg,#aabd87,#71865d);min-width:0;padding:1.2rem}.turn-banner{background:#f4ecd9e6;border:1px solid #182d2173;grid-template-columns:auto auto 1fr;align-items:baseline;gap:.8rem 1rem;min-height:54px;padding:.75rem 1rem;display:grid}.turn-banner span{color:var(--red);font:italic .7rem Georgia,serif}.turn-banner strong{font-family:Songti SC,serif;font-size:1.2rem}.turn-banner small{color:#5c665e;justify-self:end}.battlefield{--hex-w:clamp(65px,7vw,104px);--hex-h:calc(var(--hex-w) * .86);grid-template-columns:repeat(7,var(--hex-w));grid-auto-rows:calc(var(--hex-h) * .78);min-height:560px;padding:2rem calc(var(--hex-w) / 2) 4rem 0;filter:drop-shadow(0 16px 15px #24301f38);place-content:center;display:grid}.hex{width:var(--hex-w);height:var(--hex-h);clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);cursor:default;background:linear-gradient(145deg,#d2c99c,#b8b080);border:0;padding:0;transition:filter .18s,transform .18s;position:relative}.hex:nth-child(14n+8),.hex:nth-child(14n+9),.hex:nth-child(14n+10),.hex:nth-child(14n+11),.hex:nth-child(14n+12),.hex:nth-child(14n+13),.hex:nth-child(14n+14){transform:translateX(calc(var(--hex-w) / 2))}.hex:after{content:"";z-index:-1;clip-path:inherit;background:#ffffff2b;position:absolute;inset:4px}.hex:has(.unit){z-index:2;clip-path:none;pointer-events:none;background:0 0;overflow:visible}.hex:has(.unit):before{content:"";z-index:0;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);background:linear-gradient(145deg,#d2c99c,#b8b080);position:absolute;inset:0}.hex:has(.unit):after{z-index:1;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)}.hex.attack-range:has(.unit):before{background:linear-gradient(145deg,#e6927d,#b74d41)}.hex.reachable{cursor:pointer;background:linear-gradient(145deg,#84c6dd,#4a91b4);animation:1.8s ease-in-out infinite cell-pulse}.hex.attack-range{cursor:pointer;background:linear-gradient(145deg,#e6927d,#b74d41)}.hex.rock{background:linear-gradient(145deg,#898678,#66675d)}.hex:focus-visible{filter:brightness(1.2)drop-shadow(0 0 5px #fff);outline:0}.boulder{filter:drop-shadow(3px 7px 2px #14191440);position:absolute;inset:18% 16%}.boulder i{background:linear-gradient(145deg,#8d8c82,#454c46);border-radius:48% 52% 42% 58%;display:block;position:absolute}.boulder i:first-child{inset:20% 4% 0 26%}.boulder i:nth-child(2){inset:5% 42% 31% 8%}.boulder i:last-child{inset:35% 45% 2% 2%}.unit{z-index:4;pointer-events:none;background:0 0;border:0;width:100%;height:160%;padding:0;position:absolute;bottom:8%;left:50%;overflow:visible;transform:translate(-50%)}.unit-target{z-index:6;cursor:pointer;pointer-events:auto;background:0 0;border:0;border-radius:45%;width:58%;height:78%;padding:0;position:absolute;top:12%;left:21%}.unit-target:focus-visible{outline-offset:2px;outline:2px solid #ffe7a1}.unit.enemy{width:114%;height:152%}.unit-art{filter:drop-shadow(0 9px 4px #151b1652);transform-origin:50% 100%;background-repeat:no-repeat;position:absolute}.unit.player .unit-art{background-image:url(/images/games/tactics/swordsman/idle.png);background-position:0 0;background-size:1200px 400px;width:200px;height:400px;bottom:-5%;left:50%;transform:translate(-50%)scale(.36)}.cleave-rune{z-index:3;aspect-ratio:1;opacity:0;pointer-events:none;filter:drop-shadow(0 0 8px #61c8ff);width:122%;position:absolute;bottom:4%;left:50%;transform:translate(-50%,18%)rotateX(64deg)scale(.35)}.cleave-rune:before,.cleave-rune:after,.cleave-rune i{content:"";border-radius:50%;position:absolute}.cleave-rune:before{border:3px solid #7fd7ff;inset:5%;box-shadow:inset 0 0 12px #168de1,0 0 13px #3ebcff}.cleave-rune:after{border:2px dashed #d3f3ff;inset:19%}.cleave-rune i:first-child{background:repeating-conic-gradient(from 7deg,#a7e6ff 0 2deg,transparent 2deg 17deg);inset:0;mask:radial-gradient(circle,#0000 57%,#000 58% 69%,#0000 70%)}.cleave-rune i:nth-child(2){clip-path:polygon(50% 0,61% 38%,100% 50%,61% 62%,50% 100%,39% 62%,0 50%,39% 38%);border:4px double #63caff;inset:27%}.cleave-rune i:last-child{border:3px solid #ecfbff;inset:37%;box-shadow:0 0 14px #21a9ff}.unit.player[data-animation=cleave] .cleave-rune{animation:.78s cubic-bezier(.18,.74,.25,1) both cleave-rune-burst}.unit.player[data-animation=cleave]:after{content:"";z-index:5;opacity:0;filter:blur(1px)drop-shadow(0 0 7px #2daaff);transform-origin:50% 12%;pointer-events:none;background:linear-gradient(90deg,#0000,#bff0ff 34%,#fff 52%,#3aaeff 72%,#0000);border-radius:50% 50% 65% 35%;width:15%;height:185%;animation:.78s cubic-bezier(.2,.75,.25,1) both cleave-blade-trail;position:absolute;top:-58%;left:61%;transform:rotate(27deg)scaleY(.25)}.unit.enemy .unit-art{background-image:url(/images/games/tactics/dark-ranger.png);background-position:bottom;background-size:contain;animation:1.9s ease-in-out infinite enemy-idle;inset:0}.unit-name{color:#fff;white-space:nowrap;background:#0f1914d1;border-radius:999px;padding:.12rem .4rem;font-size:clamp(.48rem,.7vw,.65rem);position:absolute;bottom:-18px;left:50%;transform:translate(-50%)}.unit-health{z-index:3;opacity:1;background:#351d1d;border:1px solid #000000b3;border-radius:8px;height:7px;transition:opacity .16s;position:absolute;top:-4px;left:7%;right:7%;overflow:hidden}.unit-health[hidden]{opacity:0;display:block}.unit-health i{background:#6ac177;width:100%;height:100%;transition:width .26s;display:block}.unit.enemy.attackable .unit-art{filter:drop-shadow(0 0 9px #ffdf86)drop-shadow(0 9px 4px #151b1652)}.damage-number{z-index:10;color:#fff;text-shadow:0 2px #6d1f1f,0 0 8px #d3342b;pointer-events:none;font:900 1.5rem Georgia,serif;animation:.8s ease-out forwards damage-rise;position:absolute;top:5%;left:50%}.damage-number.heal{color:#caffc7;text-shadow:0 2px #236833,0 0 9px #61db76}.unit.enemy.moving .unit-art{animation:.42s ease-in-out infinite enemy-move}.unit.enemy.strike .unit-art,.unit.enemy.heavy-strike .unit-art{aspect-ratio:362/724;background-image:url(/images/games/tactics/dark-ranger-slash-sheet.png);background-position:0 0;background-size:600% 100%;width:auto;height:150%;inset:auto auto -5% 50%;transform:translate(-50%)}.unit.enemy.strike .unit-art{animation:.54s steps(5,end) forwards enemy-slash-frames}.unit.enemy.heavy-strike .unit-art{animation:.78s steps(5,end) forwards enemy-slash-frames}.unit.enemy.hit .unit-art{animation:.44s ease-in-out enemy-hit}.unit.enemy.defeated .unit-art{transform-origin:50% 88%;animation:.85s cubic-bezier(.42,0,.72,.3) forwards enemy-fall}.legend{color:#f7f1df;text-shadow:0 1px 2px #30402e;flex-wrap:wrap;justify-content:center;gap:1rem;font-size:.7rem;display:flex}.legend span{align-items:center;gap:.4rem;display:flex}.swatch{clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);width:13px;height:10px}.swatch.movable{background:#58a4c6}.swatch.attackable{background:#bd5446}.swatch.blocked{background:#66675d}.command-panel{background:#f1e8d4;border-left:1px solid #817b69;min-width:0}.combatants{border-bottom:1px solid #aaa18c;grid-template-columns:1fr 1fr;display:grid}.combatant{grid-template-columns:64px 1fr;gap:.8rem;padding:1rem;display:grid}.combatant+.combatant{border-left:1px solid #aaa18c}.portrait{background-color:#e0d2b7;background-image:url(/images/games/tactics-character-concept.png);background-size:200% 100%;border:1px solid #827966;width:64px;height:82px}.portrait.player{background-position:0}.portrait.enemy{background-position:100%}.combatant span{color:var(--red);letter-spacing:.1em;font:italic .55rem Georgia,serif}.combatant h2{margin:.25rem 0 0;font:600 1rem Songti SC,serif}.combatant p{color:#6d6a61;margin:.2rem 0;font-size:.65rem}.combatant dl{grid-column:1/-1;grid-template-columns:1fr 1fr;gap:.35rem;margin:.5rem 0 0;display:grid}.combatant dl div{background:#ffffff73;justify-content:space-between;padding:.3rem .45rem;font-size:.68rem;display:flex}.combatant dt{color:#6d6a61}.combatant dd{margin:0}.enemy-card [data-enemy-hp]{color:var(--red)}.player-card [data-player-hp]{color:var(--blue)}.resources{border-bottom:1px solid #aaa18c;grid-template-columns:1fr 1fr;display:grid}.resources>div{justify-content:space-between;align-items:center;padding:.8rem 1rem;display:flex}.resources>div+div{border-left:1px solid #aaa18c}.resources span{color:#6d6a61;font-size:.7rem}.resources strong{font-size:.8rem}.resources i{color:#b47b16;font-style:normal}.resources small{color:#777;font-weight:400}.actions{background:#aaa18c;border-bottom:1px solid #aaa18c;gap:1px;display:grid}.actions button{text-align:left;color:var(--ink);cursor:pointer;background:#f7efdc;border:0;grid-template-columns:2.2rem 1fr;gap:0 .7rem;padding:.7rem 1rem;display:grid}.actions button:hover:not(:disabled){background:#fff9ec}.actions button:disabled{opacity:.45;cursor:not-allowed}.actions button span{color:var(--red);grid-row:1/3;font:italic .65rem Georgia,serif}.actions button b{font-size:.78rem}.actions button b i{color:#a46e15;margin-left:.35rem;font:700 .68rem Georgia,serif}.actions button small{color:#777;font-size:.62rem}.actions button.is-prepared{color:#123d60;background:linear-gradient(90deg,#d7effb,#eef8fa);position:relative;box-shadow:inset 4px 0 #278fc8,inset 0 0 0 1px #62b9e3}.actions button.is-prepared span{color:#177fb4}.actions button.is-prepared small{color:#39718a}.shop{border-bottom:1px solid #aaa18c}.shop summary{cursor:pointer;color:var(--blue);letter-spacing:.1em;justify-content:space-between;padding:.75rem 1rem;font:italic .62rem Georgia,serif;display:flex}.shop-item{grid-template-columns:38px 1fr auto;align-items:center;gap:.7rem;padding:.2rem 1rem 1rem;display:grid}.potion-icon{background:linear-gradient(#0000 38%,#6ec4bb 39%);border:2px solid #315f68;border-radius:5px 5px 11px 11px;width:25px;height:29px;margin:auto;position:relative}.potion-icon:before{content:"";background:#d2bf97;border:2px solid #315f68;height:7px;position:absolute;top:-8px;left:5px;right:5px}.shop-item strong,.shop-item small{display:block}.shop-item strong{font-size:.75rem}.shop-item small{color:#777;font-size:.62rem}.shop-item button{color:#251f12;cursor:pointer;background:#d1a852;border:1px solid #8c713b;padding:.5rem .65rem;font-size:.68rem;font-weight:700}.shop-item button:disabled{opacity:.4;cursor:not-allowed}.battle-log{padding:.8rem 1rem}.battle-log>span{color:var(--red);letter-spacing:.12em;font:italic .58rem Georgia,serif}.battle-log ol{color:#62655e;max-height:92px;margin:.45rem 0 0;padding-left:1.2rem;font-size:.65rem;line-height:1.7;overflow:auto}.battle-log li:first-child{color:var(--ink)}.tactics-demo dialog{width:min(520px,100% - 2rem);color:var(--ink);text-align:center;background:#f2e7cd;border:1px solid #927a4a;padding:2.5rem;box-shadow:0 28px 90px #0006}.tactics-demo dialog::backdrop{background:#0c1310c7}.tactics-demo dialog span{color:var(--red);letter-spacing:.2em;font:italic .7rem Georgia,serif}.tactics-demo dialog h2{margin:.7rem 0;font:500 2.4rem Songti SC,serif}.tactics-demo dialog p{color:#66685f}.tactics-demo dialog button{background:var(--blue);color:#fff;cursor:pointer;border:0;padding:.75rem 1.5rem}.concept-sheet{border-top:1px solid #827a69;width:min(1200px,100% - 3rem);margin:0 auto 5rem}.concept-sheet summary{cursor:pointer;justify-content:space-between;padding:1rem 0;font-family:Songti SC,serif;display:flex}.concept-sheet summary span{color:var(--red);letter-spacing:.12em;font:italic .65rem Georgia,serif}.concept-sheet img{border:1px solid #827a69;width:100%}@keyframes cell-pulse{50%{filter:brightness(1.12)}}@keyframes enemy-idle{0%,to{transform:translateY(0)scale(1)}45%{transform:translateY(-3px)scale(1.015,.985)}65%{transform:translateY(-1px)scale(.995,1.01)}}@keyframes enemy-move{0%,to{transform:translate(-2px)rotate(-2.5deg)}50%{transform:translate(3px,-5px)rotate(2.5deg)}}@keyframes enemy-slash-frames{0%{background-position:0 0}to{background-position:100% 0}}@keyframes enemy-hit{0%,to{filter:drop-shadow(0 9px 4px #151b1652);transform:translate(0)}28%{filter:brightness(1.8)sepia()saturate(3);transform:translate(11px)rotate(5deg)}62%{transform:translate(-4px)rotate(-2deg)}}@keyframes enemy-fall{0%{filter:grayscale(0);opacity:1;transform:translate(0)rotate(0)}38%{transform:translate(5px,-3px)rotate(12deg)}to{filter:grayscale();opacity:.18;transform:translate(18px,17px)rotate(82deg)}}@keyframes damage-rise{to{opacity:0;transform:translate(-10px,-45px)}}@keyframes cleave-rune-burst{0%{opacity:0;transform:translate(-50%,18%)rotateX(64deg)rotate(-35deg)scale(.3)}22%{opacity:1;transform:translate(-50%,18%)rotateX(64deg)rotate(0)scale(1.05)}66%{opacity:1;transform:translate(-50%,18%)rotateX(64deg)rotate(44deg)scale(.92)}to{opacity:0;transform:translate(-50%,18%)rotateX(64deg)rotate(78deg)scale(1.22)}}@keyframes cleave-blade-trail{0%,28%{opacity:0;transform:rotate(-18deg)scaleY(.16)}40%{opacity:.95;transform:rotate(2deg)scaleY(.7)}58%{opacity:1;transform:rotate(32deg)scaleY(1)}to{opacity:0;transform:rotate(48deg)scaleY(1.08)}}@keyframes drink{25%{transform:translateY(5px)rotate(-3deg)}55%{filter:drop-shadow(0 0 10px #75db88);transform:translateY(-4px)rotate(5deg)}80%{transform:translateY(2px)}}@media (width<=1050px){.game-layout{grid-template-columns:1fr}.command-panel{border-top:1px solid #817b69;border-left:0}.battlefield{min-height:500px}.mission{width:calc(100% - 3rem)}}@media (width<=700px){.topbar{grid-template-columns:1fr auto;min-height:64px}.topbar>div{display:none}.mission{grid-template-columns:1fr;gap:1rem;width:calc(100% - 2rem);padding-top:2rem}.mission h1{font-size:3rem}.game-layout{border-inline:0;width:100%}.battlefield-wrap{padding:.5rem}.turn-banner{grid-template-columns:auto 1fr}.turn-banner small{grid-column:1/-1;justify-self:start}.battlefield{--hex-w:min(12.8vw,72px);min-height:400px;padding-left:0}.unit{width:118%;height:190%;bottom:5%}.unit.enemy{width:112%;height:130%}.unit.player .unit-art{transform:translate(-50%)scale(.28)}.combatants{grid-template-columns:1fr}.combatant+.combatant{border-top:1px solid #aaa18c;border-left:0}.concept-sheet{width:calc(100% - 2rem)}.legend{font-size:.6rem}}