:root{--page-bg:#2b2621;--board-bg:#e8c98f;--board-line:#5a3a1a;--debug-point:#0a7cff;--debug-palace:#d6249f;--debug-river:#008cff2e;--debug-center:#00a86b;--red:#b3261e;--blue:#1e4fa3;--gold-hi:#f6e3a1;--gold:#c9a24a;--gold-lo:#7a5a1c;--wood-hi:#f7e7c1;--wood-lo:#d9b77a;--jade:#3f9a6b;--crimson:#c8321f;--chrome-h:56px;--side-panel-w:244px;font-family:system-ui,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{color:#f5f0e6;background:radial-gradient(ellipse 60% 70% at 50% 45%, #78583459, transparent 70%), radial-gradient(ellipse 120% 90% at 50% 110%, #461e1459, transparent 60%), var(--page-bg)}body:after{content:"";pointer-events:none;z-index:0;background:radial-gradient(85% 85%,#0000 55%,#00000073 100%);position:fixed;inset:0}.app{z-index:1;flex-direction:column;justify-content:center;align-items:center;gap:8px;min-height:100%;padding:8px 16px;display:flex;position:relative}.toolbar{align-items:center;gap:16px;min-height:32px;font-size:14px;display:flex}.toolbar__button{font:inherit;border:1px solid var(--gold);color:inherit;cursor:pointer;background:#ffffff0f;border-radius:6px;padding:3px 10px}.toolbar__button:hover{background:#ffffff1f}.status-panel{align-items:center;gap:10px;min-width:0;display:flex}.status{letter-spacing:.06em;white-space:nowrap;background:#ffffff0f;border:1px solid;border-radius:999px;align-items:center;gap:8px;padding:3px 12px;font-weight:700;transition:background .2s,box-shadow .2s;animation:.24s ease-out both status-enter;display:flex}.status--red{color:#ff8a80}.status--blue{color:#8ab4ff}.status--red{background:#b3261e38}.status--blue{background:#1e4fa347}.status--red.status--idle{box-shadow:0 0 12px #ff8a804d}.status--blue.status--idle{box-shadow:0 0 12px #8ab4ff4d}.status__dot{background:currentColor;border-radius:50%;width:8px;height:8px;box-shadow:0 0 6px}.status--thinking .status__dot,.status--moving .status__dot,.status--combat .status__dot{animation:.9s ease-in-out infinite status-dot}.status--combat{background:#f6e3a124}.status--check{border-color:#ff5a4a;box-shadow:0 0 10px #ff5a4a73}.status__check{color:#fff;background:#b3261e;border-radius:999px;padding:0 8px;font-size:12px}.status__detail{opacity:.85;letter-spacing:.02em;font-size:12px;font-weight:500}.status--over{background:#f6e3a11f}.status-hint{opacity:.75;white-space:nowrap;text-overflow:ellipsis;font-size:12px;overflow:hidden}.status-hint--wait{opacity:.9;font-style:italic}@keyframes status-enter{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}@keyframes status-dot{50%{opacity:.35;transform:scale(.8)}}@media (prefers-reduced-motion:reduce){.status,.status__dot{animation:none!important}}.board-frame{width:min(calc(100vw - 32px - var(--side-w,0px)), calc((100dvh - var(--chrome-h)) * var(--frame-aspect)));background-image:repeating-linear-gradient(92deg,#78501e09 0 2px,#0000 2px 9px),radial-gradient(80% 70% at 50% 40%,#fff0cd59,#0000 70%),linear-gradient(#ecd098,#e0bd80);background-color:var(--board-bg);border-radius:1.2%;flex:none;position:relative;box-shadow:0 0 0 1px #7a5a1ce6,0 0 0 4px #5a3a1ae6,0 0 0 5px #c9a24a8c,0 18px 40px #0000008c,inset 0 0 22px #5a3a1a47}.board{aspect-ratio:9/10;position:absolute;bottom:0;left:0;right:0;container-type:inline-size}.board__svg,.board__layer{width:100%;height:100%;position:absolute;inset:0}.board__layer{pointer-events:none}.board__layer--ground{z-index:1}.board__layer--pieces{z-index:2}.board__layer--badges{z-index:3}.board__layer--markers{z-index:4}.board__layer--debug{z-index:5}.board__layer--banner{z-index:6;place-items:center;display:grid}.board-frame--locked .piece__img,.board-frame--locked .piece-badge{cursor:default}.board-frame--waiting,.board-frame--waiting .piece__img,.board-frame--waiting .piece-badge{cursor:progress}.board-frame:before{content:"";border-radius:inherit;pointer-events:none;opacity:0;z-index:0;transition:opacity .3s,box-shadow .3s;position:absolute;inset:0}.board-frame--turn-red:before{opacity:1;box-shadow:inset 0 -10px 18px -10px #d646328c}.board-frame--turn-blue:before{opacity:1;box-shadow:inset 0 10px 18px -10px #4678dc8c}.board-frame--view-blue.board-frame--turn-red:before{box-shadow:inset 0 10px 18px -10px #d646328c}.board-frame--view-blue.board-frame--turn-blue:before{box-shadow:inset 0 -10px 18px -10px #4678dc8c}.board__line{stroke:var(--board-line);stroke-width:.025px;stroke-linecap:square}.board__frame{fill:none;stroke:var(--board-line);stroke-width:.05px}.board__mark{fill:none;stroke:var(--board-line);stroke-width:.02px}.board__river-text{fill:var(--board-line);text-anchor:middle;dominant-baseline:central;opacity:.8;font-family:Noto Serif TC,Songti TC,STSong,PMingLiU,serif;font-size:.42px}.debug__river{fill:var(--debug-river)}.debug__river-label{fill:var(--debug-point);font-size:.14px;font-weight:600}.debug__palace{stroke:var(--debug-palace);stroke-width:.05px;stroke-dasharray:.12 .06}.debug__point{fill:var(--debug-point)}.debug__point--palace{fill:var(--debug-palace)}.debug__coord{fill:#102a43;font-family:ui-monospace,monospace;font-size:.14px}.debug__center line{stroke:var(--debug-center);stroke-width:.03px}.debug__center circle{fill:var(--debug-center)}.board-anchor{position:absolute}.piece__img{cursor:default;-webkit-user-select:none;user-select:none;pointer-events:auto;width:auto;transition:filter .12s;display:block}.piece__img.is-actionable,.piece-badge.is-actionable{cursor:pointer}.piece.is-hovered .piece__img{filter:brightness(1.08)}.piece.is-selected .piece__img--red{filter:drop-shadow(0 0 .5cqw #ffc478f2)brightness(1.06)}.piece.is-selected .piece__img--blue{filter:drop-shadow(0 0 .5cqw #96c8fff2)brightness(1.06)}.piece-ring{border-radius:50%}.piece-ring--hover{border:.22cqw solid #c9a24abf;animation:.14s ease-out both ring-in;box-shadow:0 0 .6cqw #f6e3a173}.piece-ring--selected{border:.3cqw solid var(--gold-hi);animation:.2s ease-out both ring-pop;box-shadow:0 0 0 .25cqw #7a5a1c8c,0 0 1.3cqw .25cqw #f6e3a1cc,inset 0 0 .8cqw #f6e3a199}.piece-ring--selected.piece-ring--red{background:radial-gradient(closest-side,#b3261e52,#0000)}.piece-ring--selected.piece-ring--blue{background:radial-gradient(closest-side,#1e4fa352,#0000)}.piece-ring--capture{background:radial-gradient(closest-side,#c0392b29,#0000);border:.28cqw dashed #c0392b;box-shadow:0 0 .8cqw #c0392b80}.piece-ring--check{background:radial-gradient(closest-side,#dc281e99,#dc281e2e 70%,#0000);animation:.7s ease-in-out 3 check-pulse;box-shadow:0 0 1.6cqw .4cqw #dc281e80}.piece-ring--checker{border:.22cqw solid #dc3c2dd9;box-shadow:0 0 .8cqw #dc3c2d73}.piece-ring--defeated{background:radial-gradient(closest-side,#281e198c,#281e1926 70%,#0000);border:.22cqw solid #a0281eb3}.piece-ring--last-move{background:radial-gradient(closest-side,#f6e3a147,#0000);border:.22cqw solid #c9a24ad9}.piece-ring--last-move.piece-ring--red{box-shadow:0 0 .9cqw #d65a3c73}.piece-ring--last-move.piece-ring--blue{box-shadow:0 0 .9cqw #5a8cdc80}.last-move-from{background:#f6e3a138;border:.22cqw dashed #aa8032e6;border-radius:50%;place-items:center;display:grid}.last-move-from__dot{background:#c9a24acc;border-radius:50%;width:30%;height:30%}.last-move--red .last-move-from__dot{background:#be4632bf}.last-move--blue .last-move-from__dot{background:#3c64bebf}.move-marker{pointer-events:auto;cursor:pointer;background:0 0;border:0;border-radius:50%;place-items:center;padding:0;animation:.16s ease-out both marker-in;display:grid;position:relative}.move-marker:before{content:"";opacity:0;border:.2cqw solid #2e7d50b3;border-radius:50%;transition:opacity .12s,transform .12s;position:absolute;inset:22.5%;transform:scale(.6)}.move-marker:hover:before{opacity:1;transform:none}.move-marker__dot{background:radial-gradient(circle at 40% 35%,#5fb07f,#2e6e48 70%);border-radius:50%;transition:transform .12s;box-shadow:0 0 0 .18cqw #fffaebcc,0 .15cqw .35cqw #0000004d}.move-marker:hover .move-marker__dot{transform:scale(1.25)}.move-marker:focus{outline:none}.move-marker:focus-visible .move-marker__dot{outline:2px solid var(--gold-hi);outline-offset:2px}.capture-reticle{pointer-events:none;background:linear-gradient(#c0392be6,#c0392be6) top/.22cqw 22% no-repeat,linear-gradient(#c0392be6,#c0392be6) bottom/.22cqw 22% no-repeat,linear-gradient(#c0392be6,#c0392be6) 0/22% .22cqw no-repeat,linear-gradient(#c0392be6,#c0392be6) 100%/22% .22cqw no-repeat;border:.22cqw solid #c0392bd9;border-radius:50%;transition:transform .12s,box-shadow .12s;animation:.16s ease-out both marker-in;display:block;box-shadow:0 0 .7cqw #c0392b73}.capture-reticle.is-hovered{transform:scale(1.12);box-shadow:0 0 1.2cqw #dc4632b3}@keyframes ring-in{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:none}}@keyframes ring-pop{0%{opacity:0;transform:scale(.7)}70%{opacity:1;transform:scale(1.06)}to{transform:none}}@keyframes check-pulse{50%{box-shadow:0 0 2.4cqw .8cqw #e63223a6}}@keyframes marker-in{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}.piece-badge__slot{flex-direction:column;align-items:center;display:flex;position:relative}.piece-badge{pointer-events:auto;cursor:default;border:max(.22cqw, 1.5px) solid var(--gold);background:radial-gradient(circle at 35% 30%, var(--wood-hi), var(--wood-lo) 75%);box-shadow:0 0 0 max(.12cqw, 1px) var(--gold-lo), inset 0 max(.12cqw, 1px) 0 #ffffff8c, inset 0 -.15cqw .3cqw #5a3c1459, 0 .2cqw .45cqw #00000059;border-radius:50%;place-items:center;padding:0;font-family:Noto Serif TC,Songti TC,STSong,PMingLiU,MingLiU,serif;font-weight:700;line-height:1;transition:transform .12s,box-shadow .12s;display:grid}.piece-badge--red{color:var(--red)}.piece-badge--blue{color:var(--blue)}.piece-badge.is-hovered{transform:translateY(-.15cqw)scale(1.08)}.piece-badge.is-capturable{box-shadow:0 0 0 max(.2cqw,1.5px) #c0392b,0 0 .8cqw #c0392bb3}.piece-badge.is-alert{border-color:#e0463a;box-shadow:0 0 0 max(.12cqw,1px) #7a1a12,0 0 1cqw #e63c2dcc}.piece-badge.is-selected{border-color:var(--gold-hi);box-shadow:0 0 0 max(.12cqw, 1px) var(--gold-lo), 0 0 .9cqw .15cqw #f6e3a1e6, inset 0 max(.12cqw, 1px) 0 #ffffff8c}.piece-badge:focus{outline:none}.piece-badge:focus-visible{outline:2px solid var(--gold-hi);outline-offset:2px}.piece-tooltip{white-space:nowrap;border:1px solid var(--gold);color:var(--gold-hi);letter-spacing:.03em;pointer-events:none;background:#211a12eb;border-radius:max(.5cqw,4px);padding:max(.3cqw,2px) max(.8cqw,6px);font-size:max(1.35cqw,11px);font-weight:600;position:absolute;top:calc(100% + max(.4cqw,3px));box-shadow:0 .3cqw .8cqw #00000059}.piece-tooltip--above{top:auto;bottom:calc(100% + 15.5cqw)}.piece--debug{outline:1px dashed #102a4399}.debug-anchor{border:.3cqw solid #fff;border-radius:50%;width:1.4cqw;height:1.4cqw;display:block;box-shadow:0 0 0 .15cqw #000}.debug-anchor--red{background:var(--red)}.debug-anchor--blue{background:var(--blue)}.combat-overlay{z-index:100;--pad-l:max(16px, env(safe-area-inset-left,0px));--pad-r:max(16px, env(safe-area-inset-right,0px));padding:max(12px, env(safe-area-inset-top,0px)) var(--pad-r) max(12px, env(safe-area-inset-bottom,0px)) var(--pad-l);-webkit-backdrop-filter:blur(1.5px)saturate(.7);backdrop-filter:blur(1.5px)saturate(.7);background:#0c090699;place-items:center;animation:.18s ease-out both combat-fade-in;display:grid;position:fixed;inset:0;overflow:hidden}.combat-overlay--red{box-shadow:inset 0 0 12vmin #b3261e59}.combat-overlay--blue{box-shadow:inset 0 0 12vmin #1e4fa359}.combat-flash{pointer-events:none;opacity:0;animation:.22s ease-out both combat-flash;position:absolute;inset:0}.combat-flash--red{background:radial-gradient(circle,#ffd696e6,#d65a2859 45%,#0000 75%)}.combat-flash--blue{background:radial-gradient(circle,#e8f4ffe6,#5a8cdc59 45%,#0000 75%)}@keyframes combat-flash{0%{opacity:0}25%{opacity:var(--fx-flash,.5)}to{opacity:0}}.combat-overlay__stage{--stage-w:calc(100vw - var(--pad-l) - var(--pad-r));--caption-w:100px;--card-h:min(clamp(120px, calc((100dvh - 200px) / 2), 340px), calc((var(--stage-w) - var(--caption-w)) * 16 / 9));--ax:0;--ay:1;--attack-angle:90deg;--fx-unit:calc(var(--card-h) / 3.4);flex-direction:column;align-items:center;gap:6px;max-width:100%;display:flex}.combat-overlay--impact .combat-overlay__stage{animation:.15s linear scene-shake}.combat-card{opacity:0;align-items:center;gap:14px;margin:0;transition:opacity .18s ease-out,transform .22s cubic-bezier(.2,.9,.3,1.2),filter .2s;display:flex}.combat-card--defender{flex-direction:row-reverse}.combat-card--attacker{transform:translate(calc(var(--ax) * -40px), calc(var(--ay) * -40px))}.combat-card--defender{transform:translate(calc(var(--ax) * 40px), calc(var(--ay) * 40px))}.combat-card.is-visible{opacity:1;transform:none}.combat-card--attacker.is-active{transform:translate(calc(var(--ax) * 4px), calc(var(--ay) * 4px))}.combat-card--defender.is-active{transform:translate(calc(var(--ax) * -3px), calc(var(--ay) * -3px))}.combat-card--attacker.is-impact{transform:translate(calc(var(--ax) * 12px), calc(var(--ay) * 12px)) scale(1.03);transition-duration:90ms}.combat-card--defender.is-impact{animation:.38s ease-out defender-hit}.combat-card.is-defeated{filter:grayscale(.85)brightness(.55);opacity:.75;transform:none}@keyframes defender-hit{0%{filter:brightness();transform:none}15%{transform:translate(calc(var(--ax) * 14px + 2px), calc(var(--ay) * 14px - 2px));filter:brightness(1.9)saturate(.5)}30%{transform:translate(calc(var(--ax) * 11px - 2px), calc(var(--ay) * 11px + 2px))}45%{transform:translate(calc(var(--ax) * 12px + 1px), calc(var(--ay) * 12px));filter:brightness(1.3)}to{transform:translate(calc(var(--ax) * 6px), calc(var(--ay) * 6px));filter:brightness(.95)}}@keyframes scene-shake{0%,to{transform:none}25%{transform:translate(2px,-1px)}50%{transform:translate(-2px,1px)}75%{transform:translate(1px,1px)}}.combat-card__frame{height:var(--card-h);aspect-ratio:9/16;border:2px solid var(--gold);box-shadow:0 0 0 1px var(--gold-lo), 0 10px 30px #0000008c;background:#1b140d;border-radius:10px;transition:box-shadow .2s;overflow:hidden}.combat-card--red .combat-card__frame{box-shadow:0 0 0 1px var(--gold-lo), 0 0 22px #b3261ebf, 0 10px 30px #0000008c}.combat-card--blue .combat-card__frame{box-shadow:0 0 0 1px var(--gold-lo), 0 0 22px #1e4fa3cc, 0 10px 30px #0000008c}.combat-card.is-active .combat-card__frame{border-color:var(--gold-hi)}.combat-card--attacker.combat-card--red.is-active .combat-card__frame{box-shadow:0 0 0 1px var(--gold-lo), 0 0 34px 4px #d65a28cc, 0 10px 30px #0000008c}.combat-card--attacker.combat-card--blue.is-active .combat-card__frame{box-shadow:0 0 0 1px var(--gold-lo), 0 0 34px 4px #5a96e6d9, 0 10px 30px #0000008c}.combat-card__portrait{object-fit:cover;width:100%;height:100%;display:block}.combat-card__caption{flex-direction:column;align-items:center;gap:2px;min-width:84px;display:flex}.combat-card__role{letter-spacing:.18em;color:var(--gold-hi);opacity:.8;font-size:11px}.combat-card__name{letter-spacing:.06em;font-size:clamp(16px,2.6vh,24px);font-weight:800}.combat-card__glyph{border:2px solid var(--gold);background:radial-gradient(circle at 35% 30%, var(--wood-hi), var(--wood-lo) 75%);width:clamp(36px,6vh,56px);height:clamp(36px,6vh,56px);box-shadow:0 0 0 1px var(--gold-lo), inset 0 1px 0 #ffffff8c;border-radius:50%;place-items:center;font-family:Noto Serif TC,Songti TC,STSong,PMingLiU,serif;font-size:clamp(20px,3.6vh,34px);font-weight:700;line-height:1;display:grid}.combat-card--red .combat-card__name{color:#ff8a80}.combat-card--blue .combat-card__name{color:#8ab4ff}.combat-card--red .combat-card__glyph{color:var(--red)}.combat-card--blue .combat-card__glyph{color:var(--blue)}.combat-clash{z-index:2;place-items:center;display:grid;position:relative}.combat-vs{letter-spacing:.08em;color:var(--gold-hi);text-shadow:0 0 12px #f6e3a1b3, 0 2px 0 var(--gold-lo);opacity:0;font-size:clamp(22px,4vh,38px);font-style:italic;font-weight:900;transition:opacity .15s ease-out,transform .15s ease-out;transform:scale(.6)}.combat-vs.is-visible{opacity:1;transform:none}.combat-vs.is-impact{animation:.3s ease-out both vs-impact}.combat-vs.is-gone{opacity:0;transition-duration:.2s;transform:scale(.8)}@keyframes vs-impact{0%{transform:scale(1)}20%{color:#fff;text-shadow:0 0 22px #fff4d6, 0 2px 0 var(--gold-lo);transform:scale(1.45)translate(1px,-1px)}40%{transform:scale(1.3)translate(-1px,1px)}60%{transform:scale(1.3)translate(1px)}to{transform:scale(1.15)}}.combat-impact{--spark-core:#fff1c9;--spark:#ffb347;--ember:#c0392b;--frag:#9ab8ff;width:0;height:0;transform:rotate(var(--attack-angle));pointer-events:none;position:absolute;top:50%;left:50%}.combat-impact.fx-from-blue{--spark-core:#eef6ff;--spark:#8ec5ff;--ember:#3d6fc4}.combat-impact.fx-to-red{--frag:#e0664f}.combat-impact.fx-to-blue{--frag:#7fa8ea}.fx-core,.fx-ring,.fx-streak,.fx-slash,.fx-particle,.fx-smoke{pointer-events:none;position:absolute;top:0;left:0}.fx-core{width:calc(var(--fx-unit) * .8 * var(--fx-size));height:calc(var(--fx-unit) * .8 * var(--fx-size));margin:calc(var(--fx-unit) * -.4 * var(--fx-size));background:radial-gradient(circle, var(--spark-core), var(--spark) 45%, transparent 70%);border-radius:50%;animation:.26s ease-out both fx-core}.fx-ring{width:calc(var(--fx-unit) * .4);height:calc(var(--fx-unit) * .4);margin:calc(var(--fx-unit) * -.2);border:2px solid var(--spark);box-shadow:0 0 10px var(--spark);border-radius:50%;animation:.34s ease-out both fx-ring}.fx-streak{width:calc(var(--fx-unit) * 2.2);height:3px;margin:-1.5px 0 0 calc(var(--fx-unit) * -1.3);background:linear-gradient(90deg, transparent, var(--spark) 55%, var(--spark-core) 80%, transparent);transform-origin:0;border-radius:3px;animation:.24s ease-out both fx-streak}.combat-impact--heavy .fx-streak{height:6px;margin-top:-3px}.fx-slash{width:calc(var(--fx-unit) * 1.3);height:calc(var(--fx-unit) * 1.3);margin:calc(var(--fx-unit) * -.65);border:3px solid #0000;border-right-color:var(--spark-core);border-top-color:var(--spark);filter:drop-shadow(0 0 6px var(--spark));border-radius:50%;animation:.3s ease-out both fx-slash}.combat-impact--regal .fx-slash{border-right-color:#f6e3a1;border-top-color:var(--gold)}.fx-particle{width:calc(var(--fx-unit) * .14 * var(--s));height:calc(var(--fx-unit) * .04 * var(--s));margin:calc(var(--fx-unit) * -.02 * var(--s)) 0 0 calc(var(--fx-unit) * -.07 * var(--s));background:linear-gradient(90deg, transparent, var(--spark) 40%, var(--spark-core));box-shadow:0 0 6px var(--spark);opacity:0;border-radius:2px;animation:.38s cubic-bezier(.15,.7,.3,1) both fx-particle}.fx-particle--defender{width:calc(var(--fx-unit) * .07 * var(--s));height:calc(var(--fx-unit) * .055 * var(--s));background:var(--frag);box-shadow:0 0 4px var(--frag);border-radius:1px}.combat-impact--streak .fx-particle--attacker{width:calc(var(--fx-unit) * .22 * var(--s))}.combat-impact--light .fx-particle{box-shadow:none}.fx-smoke{width:calc(var(--fx-unit) * .55);height:calc(var(--fx-unit) * .55);margin:calc(var(--fx-unit) * -.275);background:radial-gradient(circle,#7868588c,#463c3200 70%);border-radius:50%;animation:.4s ease-out both fx-smoke}@keyframes fx-core{0%{opacity:1;transform:scale(.2)}to{opacity:0;transform:scale(1.6)}}@keyframes fx-ring{0%{opacity:.9;transform:scale(.3)}to{opacity:0;transform:scale(3)}}@keyframes fx-streak{0%{opacity:1;transform:scaleX(0)}50%{opacity:1;transform:scaleX(1)}to{transform:scaleX(1) translateX(calc(var(--fx-unit) * .3));opacity:0}}@keyframes fx-slash{0%{opacity:0;transform:rotate(-70deg)scale(.7)}30%{opacity:1}to{opacity:0;transform:rotate(40deg)scale(1.05)}}@keyframes fx-particle{0%{transform:translate(0, 0) rotate(var(--a)) scaleX(.4);opacity:1}70%{opacity:1}to{transform:translate(calc(var(--dx) * var(--fx-unit)), calc(var(--dy) * var(--fx-unit))) rotate(var(--a)) scaleX(1);opacity:0}}@keyframes fx-smoke{0%{transform:rotate(calc(var(--i) * 360deg / var(--n))) translateX(0) scale(.4);opacity:.9}to{transform:rotate(calc(var(--i) * 360deg / var(--n))) translateX(calc(var(--fx-unit) * .45)) scale(1.4);opacity:0}}.board-frame--impact{animation:.14s linear board-shake}@keyframes board-shake{0%,to{transform:none}25%{transform:translate(var(--shake), calc(var(--shake) * -.5))}50%{transform:translate(calc(var(--shake) * -1), calc(var(--shake) * .5))}75%{transform:translate(calc(var(--shake) * .5), 0)}}@media (height<=640px) and (orientation:landscape){.combat-overlay__stage{--card-h:min(clamp(120px, calc(100dvh - 90px), 340px), calc(((var(--stage-w) - 98px) / 2 - var(--caption-w)) * 16 / 9));--ax:1;--ay:0;--attack-angle:0deg;flex-direction:row;gap:14px}.combat-card--attacker{flex-direction:row-reverse}.combat-card--defender{flex-direction:row}}@keyframes combat-fade-in{0%{opacity:0}to{opacity:1}}.combat-overlay--reduced .combat-card,.combat-overlay--reduced .combat-vs{transition:opacity .15s linear}.combat-overlay--reduced .combat-card,.combat-overlay--reduced .combat-card.is-active,.combat-overlay--reduced .combat-card.is-impact{transform:none}.combat-overlay--reduced .combat-card--defender.is-impact,.combat-overlay--reduced .combat-vs.is-impact,.combat-overlay--reduced.combat-overlay--impact .combat-overlay__stage{animation:none}.combat-overlay--reduced .combat-vs{transform:none}@media (prefers-reduced-motion:reduce){.combat-overlay,.board-frame--impact,.combat-overlay--impact .combat-overlay__stage,.combat-card--defender.is-impact,.combat-vs.is-impact,.fx-ring,.fx-streak,.fx-slash{animation:none}.fx-ring,.fx-streak,.fx-slash{opacity:0}.combat-card,.combat-card.is-active,.combat-card.is-impact,.combat-vs{transition:opacity .15s linear;transform:none}}.toolbar__button:disabled{opacity:.45;cursor:default}.piece__img{transform-origin:50% 95%}.piece__img.is-moving,.piece-badge__slot.is-moving,.piece-token.is-moving{animation:piece-travel var(--move-duration) var(--move-easing) both, piece-lift var(--move-duration) linear both}.piece__img.is-landing,.piece-badge__slot.is-landing,.piece-token.is-landing{animation:80ms ease-out both piece-land}@keyframes piece-travel{0%{translate:0}to{translate:var(--move-x) var(--move-y)}}@keyframes piece-lift{0%{transform:none}10%{transform:translateY(-2px)scale(1.015)}80%{transform:translateY(-1.5px)scale(1.015)}to{transform:translateY(0)scale(1.015)}}@keyframes piece-land{0%{transform:scale(1.015)}to{transform:none}}@media (prefers-reduced-motion:reduce){.piece__img.is-moving,.piece-badge__slot.is-moving,.piece-token.is-moving,.piece__img.is-landing,.piece-badge__slot.is-landing,.piece-token.is-landing{animation:none}.piece__img.is-moving{filter:none}}.board-frame--over .board__layer--pieces,.board-frame--over .board__layer--badges{filter:saturate(.75)brightness(.9);transition:filter .4s}.game-over{pointer-events:auto;border:2px solid var(--gold);box-shadow:0 0 0 1px var(--gold-lo), 0 1.2cqw 3cqw #0000008c;color:var(--gold-hi);text-align:center;background:linear-gradient(#281e14eb,#18120ce6);border-radius:1.4cqw;flex-direction:column;align-items:center;gap:.6cqw;padding:2.2cqw 4.5cqw 2.4cqw;animation:.36s cubic-bezier(.22,1,.36,1) both banner-in;display:flex}.game-over--red{box-shadow:0 0 0 1px var(--gold-lo), 0 0 3cqw #d6463273, 0 1.2cqw 3cqw #0000008c}.game-over--blue{box-shadow:0 0 0 1px var(--gold-lo), 0 0 3cqw #4678dc80, 0 1.2cqw 3cqw #0000008c}.game-over__title{letter-spacing:.14em;font-size:max(3.6cqw,16px);font-weight:900}.game-over__winner{letter-spacing:.1em;font-size:max(2.6cqw,13px);font-weight:800}.game-over--red .game-over__winner{color:#ff8a80}.game-over--blue .game-over__winner{color:#8ab4ff}.game-over__detail{opacity:.85;font-size:max(1.6cqw,11px)}.game-over__button{font:inherit;border:1px solid var(--gold);color:var(--gold-hi);cursor:pointer;background:#f6e3a124;border-radius:999px;margin-top:.8cqw;padding:.5cqw 2cqw;font-size:max(1.7cqw,12px);font-weight:700}.game-over__button:hover{background:#f6e3a142}@keyframes banner-in{0%{opacity:0;transform:translateY(1.5cqw)scale(.96)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.piece-ring--hover,.piece-ring--selected,.piece-ring--check,.move-marker,.capture-reticle,.game-over{animation:none}}.piece__img.is-moving{filter:drop-shadow(0 .6cqw .5cqw #00000059)drop-shadow(0 0 .5cqw #f6e3a18c)}.landing-pulse{opacity:0;background:radial-gradient(circle,#f6e3a18c,#c9a24a40 45%,#0000 70%);border:.15cqw solid #c9a24a99;border-radius:50%;animation:.2s ease-out both landing-pulse;display:block}@keyframes landing-pulse{0%{opacity:.9;transform:scale(.35)}to{opacity:0;transform:scale(1)}}.piece-ring--selected{animation:.26s cubic-bezier(.22,1,.36,1) both ring-bloom}@keyframes ring-bloom{0%{opacity:0;transform:scale(.75);box-shadow:0 0 #f6e3a100}55%{opacity:1;transform:scale(1.12);box-shadow:0 0 2cqw .6cqw #f6e3a1d9}to{transform:none}}.move-marker__dot{animation:1.2s ease-in-out .18s 2 dot-pulse}@keyframes dot-pulse{50%{transform:scale(1.18);box-shadow:0 0 0 .18cqw #fffaebcc,0 0 .8cqw #5fb07fb3}}.capture-reticle{animation:.16s ease-out both marker-in,1.2s ease-in-out .18s 2 reticle-pulse}@keyframes reticle-pulse{50%{box-shadow:0 0 1.3cqw #dc4632bf}}.combat-vignette{pointer-events:none;opacity:0;animation:.42s ease-out both combat-vignette;position:absolute;inset:0}.combat-vignette--red{background:radial-gradient(#0000 45%,#c8461e8c 100%)}.combat-vignette--blue{background:radial-gradient(#0000 45%,#3c6ed28c 100%)}@keyframes combat-vignette{0%{opacity:0}20%{opacity:1}to{opacity:0}}.piece-ring--check{animation:.7s ease-in-out check-pulse;position:relative}.piece-ring--check:after{content:"";opacity:0;border:.25cqw solid #eb4632cc;border-radius:50%;animation:.8s ease-out check-wave;position:absolute;inset:-12%}@keyframes check-wave{0%{opacity:.9;transform:scale(.7)}to{opacity:0;transform:scale(1.25)}}.piece-badge.is-alert{animation:.6s ease-out alert-pulse}@keyframes alert-pulse{40%{transform:scale(1.22);box-shadow:0 0 0 max(.12cqw,1px) #7a1a12,0 0 1.6cqw #f04632f2}}.piece-ring--checker{animation:.7s ease-in-out checker-pulse}@keyframes checker-pulse{50%{box-shadow:0 0 1.4cqw .3cqw #e63c2db3}}.status--thinking{animation:.24s ease-out both status-enter,2.4s ease-in-out .24s infinite thinking-breathe}@keyframes thinking-breathe{50%{box-shadow:0 0 14px}}.status__ellipsis{clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}.status__dots{gap:3px;margin-left:-4px;display:inline-flex}.status__dots i{opacity:.3;background:currentColor;border-radius:50%;width:4px;height:4px;animation:1.2s ease-in-out infinite thinking-dot}.status__dots i:nth-child(2){animation-delay:.2s}.status__dots i:nth-child(3){animation-delay:.4s}@keyframes thinking-dot{40%{opacity:1;transform:translateY(-2px)}}.game-over{background:linear-gradient(#281e14db,#18120cd6);gap:.35cqw;padding:1.3cqw 3cqw 1.5cqw;animation:.42s cubic-bezier(.22,1,.36,1) .15s both banner-in}.game-over__title{letter-spacing:.12em;font-size:max(2.6cqw,14px)}.game-over__winner{font-size:max(1.9cqw,12px)}.game-over__detail{font-size:max(1.3cqw,10px)}.game-over__button{margin-top:.4cqw;padding:.35cqw 1.6cqw;font-size:max(1.35cqw,11px)}.piece-ring--victor{border:.28cqw solid var(--gold-hi);background:radial-gradient(closest-side,#f6e3a166,#0000);animation:.5s cubic-bezier(.22,1,.36,1) both ring-bloom;box-shadow:0 0 1.6cqw .35cqw #f6e3a1b3}.piece-ring--defeated{box-shadow:0 0 1.4cqw .3cqw #961e148c}@media (prefers-reduced-motion:reduce){.landing-pulse,.move-marker__dot,.capture-reticle,.piece-ring--check,.piece-ring--check:after,.piece-badge.is-alert,.piece-ring--checker,.piece-ring--victor,.status--thinking,.status__dots i{animation:none}.status__dots i{opacity:.8}.combat-vignette{opacity:0;animation:none}.piece__img.is-moving{filter:none}}.combat-overlay--reduced .combat-vignette{opacity:0;animation:none}html,body{overscroll-behavior:none}body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}img{-webkit-user-drag:none}:where(button,select,input,[tabindex]):focus-visible{outline:2px solid var(--gold-hi);outline-offset:2px}.btn,.toolbar__button,.game-over__button{transition:background-color .14s,filter .14s,transform 90ms,border-color .14s,box-shadow .14s}.btn:not(:disabled):hover,.toolbar__button:not(:disabled):hover,.game-over__button:hover{filter:brightness(1.15)}.btn:not(:disabled):active,.toolbar__button:not(:disabled):active,.game-over__button:active{transform:scale(.96)}.btn{font:inherit;letter-spacing:.08em;border:1px solid var(--gold);min-height:40px;color:var(--gold-hi);cursor:pointer;background:#f6e3a114;border-radius:999px;padding:8px 22px;font-weight:700}.btn--primary{color:#2a1a0c;border-color:var(--gold-hi);background:linear-gradient(#f6e3a1,#c9a24a);box-shadow:0 0 0 1px #7a5a1c99,0 4px 14px #00000059,0 0 18px #f6e3a140}.btn--large{letter-spacing:.14em;min-height:52px;padding:12px 44px;font-size:18px}.btn--icon{place-items:center;min-width:40px;min-height:40px;padding:0;font-size:16px;display:inline-grid}.btn:disabled{opacity:.45;cursor:default}.toolbar__button{white-space:nowrap;justify-content:center;align-items:center;gap:6px;min-width:30px;min-height:30px;display:inline-flex}.toolbar__button--accent{border-color:var(--gold-hi);color:var(--gold-hi);font-weight:700}.toolbar__button.is-on{border-color:var(--gold-hi);background:#f6e3a129}.modal-backdrop{z-index:200;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#0a07049e;place-items:center;padding:16px;animation:.18s ease-out both modal-fade;display:grid;position:fixed;inset:0}.modal{border:1px solid var(--gold);max-width:min(440px,100%);max-height:calc(100dvh - 32px);box-shadow:0 0 0 1px var(--gold-lo), 0 20px 50px #0009;color:#f5f0e6;text-align:center;background:linear-gradient(#2e2216f7,#1a130df7);border-radius:14px;padding:22px 26px;animation:.22s cubic-bezier(.22,1,.36,1) both modal-in;position:relative;overflow:auto}.modal:focus{outline:none}.modal__title{letter-spacing:.12em;color:var(--gold-hi);margin:0 0 8px;font-size:20px;font-weight:900}.modal__text{opacity:.85;margin:0 0 18px}.modal__actions{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}@keyframes modal-fade{0%{opacity:0}}@keyframes modal-in{0%{opacity:0;transform:translateY(8px)scale(.97)}}.start-screen{-webkit-backdrop-filter:blur(4px)saturate(.7);backdrop-filter:blur(4px)saturate(.7);background:radial-gradient(60% 60% at 50% 45%,#78461e59,#0000 70%),#0c0906cc;transition:opacity .26s}.start-screen .modal{box-shadow:none;background:0 0;border:0;max-width:560px;padding:8px 16px;transition:opacity .26s,transform .26s;animation:.52s cubic-bezier(.22,1,.36,1) both start-in;overflow:visible}.start-screen.is-leaving{opacity:0;pointer-events:none}.start-screen.is-leaving .modal{opacity:0;transform:scale(1.04)}.start{flex-direction:column;align-items:center;gap:14px;display:flex}.start__seal{color:#fff4dc;width:64px;height:64px;box-shadow:0 0 0 3px var(--gold), 0 0 0 5px #7a5a1ccc, 0 0 30px #d6463273;background:radial-gradient(circle at 40% 35%,#d8493a,#8f1d14 75%);border-radius:50%;place-items:center;font-family:Noto Serif TC,Songti TC,serif;font-size:34px;font-weight:900;display:grid}.start__title{letter-spacing:.16em;color:var(--gold-hi);text-shadow:0 2px 0 var(--gold-lo), 0 0 30px #f6e3a14d;margin:0;font-size:clamp(36px,8vmin,72px);font-weight:900;line-height:1}.start__subtitle{letter-spacing:.5em;opacity:.7;margin:-4px 0 8px;padding-left:.5em;font-size:13px}.start__resume{flex-direction:column;align-items:center;gap:10px;display:flex}.start__question{letter-spacing:.1em;margin:0;font-weight:800}.start__actions{gap:12px;display:flex}.start__row{align-items:center;gap:12px;display:flex}.start__label{letter-spacing:.16em;opacity:.75;text-align:right;min-width:72px;font-size:12px;font-weight:700}.start__row .sound-toggle{min-width:44px;min-height:36px;font-size:16px}.start__hint{opacity:.6;margin:4px 0 0;font-size:12px}@keyframes start-in{0%{opacity:0;transform:scale(.96)}}@media (height<=460px){.start{gap:8px}.start__seal{width:44px;height:44px;font-size:24px}.start__title{font-size:34px}.start__subtitle{margin:-2px 0 2px}.btn--large{min-height:44px;padding:8px 36px;font-size:16px}}.difficulty-select{font:inherit;border:1px solid var(--gold);min-height:30px;color:inherit;cursor:pointer;background:#2b221a;border-radius:6px;padding:2px 6px;font-size:13px}.difficulty-select:disabled{opacity:.5;cursor:default}.volume-slider{width:84px;accent-color:var(--gold);cursor:pointer}.toolbar{gap:10px;max-width:100%}.toolbar .status-panel{flex:auto}.hud__secondary{align-items:center;gap:10px;display:flex}.hud__field{align-items:center;gap:6px;display:inline-flex}.hud__label{opacity:.7;white-space:nowrap;font-size:12px}.hud__more{display:none;position:relative}.hud__menu{z-index:50;border:1px solid var(--gold);background:#1e160ff7;border-radius:10px;flex-direction:column;align-items:stretch;gap:10px;min-width:210px;padding:12px;animation:.16s ease-out both modal-in;display:flex;position:absolute;top:calc(100% + 6px);right:0;box-shadow:0 12px 30px #00000080}.hud__menu .hud__field{justify-content:space-between}.hud__menu .volume-slider{width:110px}.hud__menu .toolbar__button{min-height:36px}.toolbar__debug{opacity:.7;white-space:nowrap;font-size:12px}@media (width<=1099px){.hud__secondary{display:none}.hud__more{display:block}.status-hint{display:none}}.game-layout{grid-auto-flow:column;justify-content:center;align-items:stretch;gap:12px;max-width:100%;display:grid}.side-panel{width:calc(var(--side-panel-w) - 12px);background:#140f0a8c;border:1px solid #c9a24a73;border-radius:10px;flex-direction:column;gap:8px;height:0;min-height:100%;padding:10px;font-size:13px;animation:.2s ease-out both modal-fade;display:flex;overflow:hidden}.side-panel__title{letter-spacing:.2em;color:var(--gold-hi);opacity:.8;margin:2px 0 0;font-size:11px}.captures{scrollbar-width:thin;flex-direction:column;flex:none;gap:6px;max-height:45%;display:flex;overflow-y:auto}.captures__row{align-items:center;gap:6px;min-height:26px;display:flex}.captures__label{white-space:nowrap;letter-spacing:.06em;flex:none;width:70px;font-size:11px;font-weight:700}.captures__row--red .captures__label{color:#ff8a80}.captures__row--blue .captures__label{color:#8ab4ff}.captures__icons{flex-wrap:wrap;align-items:center;gap:3px 4px;display:flex}.captures__token{padding-bottom:2px;animation:.22s ease-out both modal-in;display:inline-flex}.captures__none{opacity:.4}.history{overscroll-behavior:contain;font-variant-numeric:tabular-nums;scrollbar-width:thin;scrollbar-color:var(--gold-lo) transparent;flex:auto;min-height:0;margin:0;padding:0 4px 0 0;list-style:none;position:relative;overflow-y:auto}.history__row{border-bottom:1px solid #ffffff0a;grid-template-columns:30px 1fr 1fr;gap:4px;padding:2px 0;display:grid}.history__num{opacity:.5;text-align:right;padding-right:2px}.history__move{white-space:nowrap;border-radius:4px;padding:0 4px}.history__move--red{color:#ffb0a6}.history__move--blue{color:#a9c6ff}.history__move.is-current{box-shadow:inset 0 0 0 1px var(--gold);background:#f6e3a133}.history__empty{opacity:.5;font-style:italic}.help .modal{text-align:left;max-width:min(640px,100%);padding:18px 22px}.help__head{justify-content:space-between;align-items:center;gap:12px;display:flex}.help__head .modal__title{margin:0}.help__body h3{letter-spacing:.14em;color:var(--gold-hi);text-transform:uppercase;margin:14px 0 6px;font-size:13px}.help__body p{margin:0;font-size:14px;line-height:1.5}.help__body .red{color:#ff8a80}.help__body .blue{color:#8ab4ff}.help__pieces,.help__rules{gap:6px;margin:0;padding:0;font-size:13.5px;line-height:1.45;list-style:none;display:grid}.help__pieces li{grid-template-columns:34px 52px 64px 1fr;align-items:center;gap:8px;display:grid}.help__pieces .piece-token{justify-self:center}.help__glyphs{font-size:16px;font-weight:800}.help__name{font-weight:700}.help__rules li{padding-left:14px;position:relative}.help__rules li:before{content:"◆";color:var(--gold);font-size:8px;position:absolute;top:6px;left:0}.help__river{opacity:.9;align-items:center;gap:12px;margin-top:8px;font-size:13px;display:flex}.help__river-board{flex:none;width:120px;height:auto}@media (width<=560px){.help__pieces li{grid-template-columns:28px 60px 1fr}.help__pieces .help__text{grid-column:1/-1;margin-top:-4px;padding-left:36px}}.game-over__actions{justify-content:center;gap:.8cqw;display:flex}.game-over__button--primary{color:#2a1a0c;border-color:var(--gold-hi);background:linear-gradient(#f6e3a1,#c9a24a)}.game-over__button--primary:hover{background:linear-gradient(#fff0bf,#d6b05a)}.toolbar--replay{gap:8px}.replay__title{letter-spacing:.16em;color:var(--gold-hi);font-weight:900}.replay__count{font-variant-numeric:tabular-nums;opacity:.85;min-width:84px}.landing-pulse--capture{background:radial-gradient(circle,#ff8c6e99,#c8321f4d 45%,#0000 70%);border-color:#c8321fb3;animation-duration:.26s}@media (pointer:coarse){:root{--chrome-h:68px}.toolbar{min-height:44px}.toolbar__button{min-width:42px;min-height:40px;padding:3px 12px}.difficulty-select{min-height:40px}.game-over__button{min-width:64px;min-height:36px}.hud__menu .toolbar__button{min-height:44px}.volume-slider{height:32px}}@media (pointer:coarse) and (height<=460px){.app{gap:6px;padding-top:6px;padding-bottom:6px}}@media (prefers-reduced-motion:reduce){.modal-backdrop,.modal,.start-screen .modal,.hud__menu,.side-panel,.captures__token{animation:none}.start-screen,.start-screen .modal,.btn,.toolbar__button,.game-over__button{transition:none}.btn:active,.toolbar__button:active,.game-over__button:active{transform:none}}.hud__menu .toolbar__button{justify-content:flex-start;padding-left:14px}.hud__text{font-size:13px}@media (hover:none){.piece-tooltip{display:none}}:root{--token-ivory-hi:#fbf3df;--token-ivory-lo:#e6d3aa;--token-red-hi:#b8322a;--token-red-lo:#6e1510;--token-red-ink:#9e1b14;--token-red-trim:#d9b25c;--token-blue-hi:#2d5aa8;--token-blue-lo:#132f63;--token-blue-ink:#183f86;--token-blue-trim:#c9d2dc}.piece-token{--ring-hi:var(--token-red-hi);--ring-lo:var(--token-red-lo);--ink:var(--token-red-ink);--trim:var(--token-red-trim);width:var(--token);height:var(--token);pointer-events:auto;cursor:default;color:var(--ink);font:inherit;background:radial-gradient(circle at 34% 28%, var(--ring-hi), var(--ring-lo) 78%);box-shadow: 0 0 0 max(.1cqw, 1px) var(--trim), 0 0 0 max(.2cqw, 1.5px) #28180a8c,  0 max(.28cqw, 2px) 0 #231408bf,  0 max(.45cqw, 3px) max(.6cqw, 4px) #1e120673, inset 0 max(.1cqw, 1px) 0 #ffffff47;-webkit-tap-highlight-color:transparent;border:0;border-radius:50%;place-items:center;padding:0;transition:transform .14s,box-shadow .14s,filter .14s;display:grid;position:relative}.piece-token--blue{--ring-hi:var(--token-blue-hi);--ring-lo:var(--token-blue-lo);--ink:var(--token-blue-ink);--trim:var(--token-blue-trim)}.token-face{background:radial-gradient(circle at 38% 30%, var(--token-ivory-hi), var(--token-ivory-lo) 82%);pointer-events:none;border-radius:50%;place-items:center;width:80%;height:80%;display:grid;position:relative;box-shadow:inset 0 max(.12cqw,1px) max(.2cqw,1.5px) #3c230a66,inset 0 -1px #ffffff80}.token-face:before{content:"";border:max(.08cqw, 1px) solid var(--ink);opacity:.45;border-radius:50%;position:absolute;inset:9%}.token-face__glyph{font-family:Noto Serif TC,Songti TC,STSong,PMingLiU,MingLiU,serif;font-weight:700;font-size:calc(var(--token) * .54);color:var(--ink);text-shadow:0 1px #ffffff8c;line-height:1;position:relative;transform:translateY(-2%)}.piece-token.is-actionable{cursor:pointer}.piece-token.is-hovered:not(.is-moving){filter:brightness(1.08);transform:translateY(-1px)}.piece-token.is-selected{box-shadow:0 0 0 max(.16cqw, 1.5px) var(--gold-hi), 0 0 0 max(.34cqw, 3px) #c99628e6, 0 0 max(1.2cqw, 8px) max(.2cqw, 2px) #f6d278b3, 0 max(.5cqw, 4px) 0 #23140899, 0 max(.8cqw, 6px) max(.8cqw, 6px) #1e120666;transform:translateY(max(-.3cqw,-3px))}.piece-token.is-capturable{box-shadow:0 0 0 max(.12cqw, 1px) var(--trim), 0 0 0 max(.3cqw, 2.5px) var(--crimson), 0 0 max(.8cqw, 6px) #c8321f99, 0 max(.28cqw, 2px) 0 #231408bf}.piece-token.is-alert{animation:.7s ease-in-out 2 token-alert;box-shadow:0 0 0 max(.14cqw,1.5px) #ffd2c8,0 0 0 max(.36cqw,3px) #d92a1c,0 0 max(2cqw,14px) max(.5cqw,4px) #eb3223cc,0 max(.28cqw,2px) #231408bf}@keyframes token-alert{50%{transform:scale(1.1)}}.piece-token:focus{outline:none}.piece-token:focus-visible{outline:2px solid var(--gold-hi);outline-offset:3px}.piece-token.is-moving{box-shadow:0 0 0 max(.1cqw, 1px) var(--trim), 0 max(.9cqw, 6px) max(1cqw, 7px) #1e120673, 0 0 max(.8cqw, 6px) #f6e3a18c}.piece-token--debug{outline:1px dashed #102a43b3}.piece-token--static{pointer-events:none;vertical-align:middle;box-shadow:0 0 0 1px var(--trim), 0 0 0 2px #28180a8c, 0 2px 0 #231408b3, 0 3px 5px #0006;flex:none;display:inline-grid}.piece-ring--selected{box-shadow:0 0 0 .2cqw #7a5a1c73,0 0 1.1cqw .2cqw #f6e3a199}@media (prefers-reduced-motion:reduce){.piece-token,.piece-token.is-alert{transition:none;animation:none}.piece-token.is-selected{transform:none}}.character-card{--card-accent:var(--token-red-hi);z-index:40;color:#f5f0e6;pointer-events:none;background:linear-gradient(#281d13f5,#16100bf5);border:1px solid #c9a24ab3;border-radius:12px;flex-direction:column;gap:8px;padding:10px;animation:.2s cubic-bezier(.22,1,.36,1) both card-in;display:flex;position:fixed;overflow:hidden;box-shadow:0 0 0 1px #0006,0 14px 34px #00000080,inset 0 1px #f6e3a11f}.character-card--blue{--card-accent:var(--token-blue-hi)}.character-card:before{content:"";background:linear-gradient(90deg, transparent, var(--card-accent), transparent);height:3px;position:absolute;inset:0 0 auto}.character-card__head{align-items:center;gap:10px;display:flex}.character-card__names{flex:1;justify-content:space-between;align-items:baseline;gap:8px;min-width:0;display:flex}.character-card__title{letter-spacing:.12em;color:var(--gold-hi);white-space:nowrap;font-size:14px;font-weight:900}.character-card__glyph{color:#ff8a80;font-family:Noto Serif TC,Songti TC,STSong,PMingLiU,serif;font-size:26px;font-weight:700;line-height:1}.character-card--blue .character-card__glyph{color:#9cc0ff}.character-card__portrait{aspect-ratio:3/4;background:radial-gradient(circle at 50% 30%,#78583480,#140e09e6);border-radius:8px;flex:auto;min-height:70px;max-height:260px;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #c9a24a80}.character-card__portrait img{object-fit:cover;object-position:50% 18%;opacity:0;width:100%;height:100%;transition:opacity .22s}.character-card__portrait img.is-loaded{opacity:1}.character-card__body{flex-direction:column;flex:none;gap:6px;display:flex}.character-card__row{justify-content:space-between;align-items:baseline;gap:8px;display:flex}.character-card__name{font-size:15px;font-weight:800}.character-card__moves{letter-spacing:.06em;color:#9fd8b4;white-space:nowrap;font-size:11px}.character-card__rule{align-items:flex-start;gap:8px;display:flex}.character-card__rule p{opacity:.9;margin:0;font-size:12px;line-height:1.4}.move-diagram{flex:none;width:46px;height:46px}.move-diagram__grid{stroke:#f6e3a138;stroke-width:1.5px}.move-diagram__path{stroke:#5fb07f;stroke-width:5px;stroke-linecap:round}.move-diagram__dot{fill:#5fb07f}.move-diagram__dot--alt{fill:none;stroke:#5fb07f;stroke-width:3px}.move-diagram__piece{fill:var(--card-accent);stroke:var(--gold-hi);stroke-width:3px}.character-card--panel .character-card__portrait{max-height:150px}.character-card--below{grid-template-columns:72px minmax(0,1fr);grid-template-areas:"portrait head""portrait body";align-content:start;gap:4px 10px;padding:8px;display:grid}.character-card--below .character-card__head{grid-area:head;gap:8px}.character-card--below .character-card__head .piece-token{--token:26px!important}.character-card--below .character-card__title{font-size:13px}.character-card--below .character-card__glyph{font-size:22px}.character-card--below .character-card__portrait{aspect-ratio:auto;grid-area:portrait;width:72px;height:96px;min-height:0}.character-card--below .character-card__body{grid-area:body;gap:3px;min-width:0}.character-card--below .character-card__name{font-size:13px}.character-card--below .character-card__rule p{font-size:11.5px;line-height:1.35}.character-card--below .move-diagram{width:34px;height:34px}@media (height<=460px){.character-card{gap:6px;padding:8px}.character-card__rule p{font-size:11px}.move-diagram{width:38px;height:38px}}@keyframes card-in{0%{opacity:0;transform:translate(-8px)}}@media (prefers-reduced-motion:reduce){.character-card{animation:none}.character-card__portrait img{transition:none}}.board__layer--ground{overflow:clip}.piece-ring--check:after{inset:-4%}@media (orientation:portrait) and (width<=700px){.app{justify-content:flex-start;padding-top:12px;--side-w:0px!important}.game-layout{grid-auto-flow:row;justify-items:center;width:100%}.side-panel{width:min(100%,100vw - 32px);height:180px;min-height:0}.hud__away{display:none!important}}@media (width<=560px){.toolbar--replay{flex-wrap:wrap;justify-content:center;row-gap:6px;max-width:calc(100vw - 32px)}.toolbar--replay .replay__title{text-align:center;flex:100%}}.board-frame--context .piece-token:not(.is-attacking):not(.is-targeted){filter:brightness(.72)saturate(.55);transition:filter .2s}.piece-token.is-attacking{animation:.26s cubic-bezier(.22,1,.36,1) both ctx-attacker-in;transform:translateY(max(-.35cqw,-4px));box-shadow:0 0 0 max(.16cqw,1.5px) #fff1c4,0 0 0 max(.4cqw,3.5px) #d9a33a,0 0 max(1.6cqw,12px) max(.3cqw,3px) #f6c864bf,0 max(.55cqw,5px) #23140899,0 max(.9cqw,7px) max(.9cqw,7px) #1e120666}.piece-token.is-targeted{box-shadow:0 0 0 max(.14cqw, 1.5px) #ffd9d0, 0 0 0 max(.4cqw, 3.5px) var(--crimson), 0 0 max(1.4cqw, 10px) max(.3cqw, 2px) #dc3223b3, 0 max(.28cqw, 2px) 0 #231408bf;animation:.52s ease-in-out 2 ctx-target-pulse}@keyframes ctx-attacker-in{0%{transform:none}}@keyframes ctx-target-pulse{50%{transform:scale(1.07)}}.piece-token.is-targeted:not(.board-frame--context *){animation:none}.board__layer--context{z-index:5;pointer-events:none}.capture-context__svg{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.capture-context__trail{stroke-width:.085px;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1px;filter:drop-shadow(0 0 .06px #0009)drop-shadow(0 0 .12px #f6d278cc);animation:ctx-draw var(--ctx-draw) cubic-bezier(.5, 0, .25, 1) var(--ctx-trajectory) forwards}.capture-context__streak{stroke:#fff6da;stroke-width:.05px;stroke-linecap:round;stroke-dasharray:.18 1;stroke-dashoffset:.18px;opacity:0;animation:ctx-streak var(--ctx-draw) ease-in var(--ctx-trajectory) forwards}.capture-context__impact{fill:none;stroke:#e0463a;stroke-width:.06px;opacity:0;transform-box:fill-box;transform-origin:50%;animation:ctx-impact .42s ease-out var(--ctx-label) forwards}.capture-context__label{border:1px solid var(--gold);letter-spacing:.1em;white-space:nowrap;opacity:0;animation:ctx-label .22s ease-out var(--ctx-label) forwards;background:linear-gradient(#281d13f0,#16100bf0);border-radius:999px;align-items:center;gap:.8cqw;padding:max(.5cqw,3px) max(1.6cqw,9px);font-size:max(2.3cqw,11px);font-weight:900;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)scale(.92);box-shadow:0 0 0 1px #0006,0 .6cqw 1.6cqw #00000073}.capture-context__piece--red{color:#ff8a80}.capture-context__piece--blue{color:#9cc0ff}.capture-context__sword{color:var(--gold-hi);font-size:1.15em}@keyframes ctx-draw{to{stroke-dashoffset:0}}@keyframes ctx-streak{0%{opacity:1;stroke-dashoffset:.18px}to{opacity:1;stroke-dashoffset:-.82px}}@keyframes ctx-impact{0%{opacity:.95;transform:scale(.4)}to{opacity:.35;transform:scale(1)}}@keyframes ctx-label{to{opacity:1;transform:translate(-50%,-50%)}}.board__layer--context.is-reduced .capture-context__trail{stroke-dashoffset:0;animation:none}.board__layer--context.is-reduced .capture-context__streak{display:none}.board__layer--context.is-reduced .capture-context__impact{opacity:.6;animation:none}.board__layer--context.is-reduced .capture-context__label{opacity:1;animation:none;transform:translate(-50%,-50%)}@media (prefers-reduced-motion:reduce){.piece-token.is-attacking,.piece-token.is-targeted{animation:none}.piece-token.is-attacking{transform:none}}.start{gap:10px}.start__subtitle{margin:-2px 0 6px}.start .btn--large{margin-top:2px}.start__settings{background:linear-gradient(#281d13b3,#16100bb3);border:1px solid #c9a24a73;border-radius:12px;width:min(280px,100%);margin-top:6px;padding:2px 14px;display:grid;box-shadow:inset 0 1px #f6e3a114}.start__settings .start__row{cursor:default;justify-content:space-between;gap:16px;min-height:50px}.start__settings .start__row+.start__row{border-top:1px solid #c9a24a38}.start__settings .start__label{text-align:left;letter-spacing:.2em;text-transform:uppercase;min-width:0;font-size:11.5px}.start__settings .sound-toggle{min-width:52px;min-height:40px;font-size:16px}.start__settings .difficulty-select,.difficulty-select{appearance:none;background-color:#2b221a;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%23f6e3a1' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-position:right 10px center;background-repeat:no-repeat;background-size:11px 8px;padding-right:28px}.start__settings .difficulty-select{border-color:var(--gold);letter-spacing:.08em;min-width:150px;min-height:40px;color:var(--gold-hi);cursor:pointer;border-radius:999px;padding-left:14px;font-weight:800}.start__settings .difficulty-select:hover{border-color:var(--gold-hi)}.start__hint{margin:2px 0 0}@media (height<=460px){.start{gap:6px}.start__settings .start__row{min-height:44px}}.music-control{align-items:center;gap:6px;display:inline-flex}.music-toggle{font-size:15px}.music-toggle:disabled{opacity:.4;cursor:not-allowed}.volume-slider--music{width:64px}.volume-slider:disabled{opacity:.35;cursor:not-allowed}.hud__menu .music-control{flex:1;justify-content:flex-end}.hud__menu .volume-slider--music{width:96px}.visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.btn--online{color:#d6e4ff;background:linear-gradient(#2d5aa859,#132f6373);border-color:#9cc0ffb3;min-width:220px}.btn--online:not(:disabled):hover{border-color:#b9d0ff}.btn--ghost{color:#f5f0e6bf;background:0 0;border-color:#0000}.btn--danger{color:#fff1ee;background:linear-gradient(#c8321f,#8e1f13);border-color:#e0463a}.toolbar__button--danger{color:#ffb3a8;border-color:#d0493a;font-weight:700}.online-lobby .modal{text-align:left;gap:12px;width:min(400px,100%);display:grid}.online-lobby .modal__title{text-align:center;margin:0}.online-lobby__lead{text-align:center;opacity:.85;margin:0;font-size:14px}.online-lobby__form{gap:10px;display:grid}.online-lobby__create{width:100%;min-height:46px}.online-lobby__or{opacity:.6;text-transform:uppercase;letter-spacing:.2em;align-items:center;gap:10px;font-size:12px;display:flex}.online-lobby__or:before,.online-lobby__or:after{content:"";background:#c9a24a59;flex:1;height:1px}.online-lobby__join{grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:10px;display:grid}.online-lobby__join .btn{min-height:44px}.online-lobby__status{text-align:center;opacity:.8;margin:0;font-size:13px}.online-lobby__problem{color:#ffc9c0;background:#8e1f134d;border:1px solid #e0463a99;border-radius:8px;margin:0;padding:8px 12px;font-size:13px}.online-lobby__back{justify-self:center}.field{gap:5px;display:grid}.field__label{letter-spacing:.14em;text-transform:uppercase;opacity:.75;font-size:11.5px;font-weight:700}.field__input{font:inherit;color:#f5f0e6;-webkit-user-select:text;user-select:text;background:#00000059;border:1px solid #c9a24a99;border-radius:10px;min-height:44px;padding:8px 12px;font-size:16px}.field__input:focus{outline:2px solid var(--gold-hi);outline-offset:1px}.field__input[aria-invalid=true]{border-color:#e0463a}.field__input--code{letter-spacing:.3em;text-transform:uppercase;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.field__error{color:#ffb3a8;margin:-4px 0 0;font-size:12.5px}.room-code{letter-spacing:.18em;color:var(--gold-hi);font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.waiting-room .modal{gap:10px;width:min(400px,100%);display:grid}.waiting-room__eyebrow{letter-spacing:.3em;opacity:.7;margin:0;font-size:11.5px}.waiting-room__code{margin:-4px 0 0;font-size:clamp(30px,9vw,42px);font-weight:800}.waiting-room__side{margin:0}.side-red{color:#ff8a80}.side-blue{color:#9cc0ff}.waiting-room__wait{opacity:.85;justify-content:center;align-items:center;gap:8px;margin:0;display:inline-flex}.waiting-room__spinner{border:2px solid #f6e3a14d;border-top-color:var(--gold-hi);border-radius:50%;width:14px;height:14px;animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.waiting-room__link{text-align:left}.waiting-room__link .field__input{font-size:13px}.waiting-room__hint{opacity:.8;margin:0;font-size:12.5px}.waiting-room__connection{justify-content:center;display:flex}.connection-badge{white-space:nowrap;align-items:center;gap:6px;font-size:12px;display:inline-flex}.connection-badge__dot{border-radius:50%;flex:none;width:9px;height:9px}.connection-badge--ok .connection-badge__dot{background:#4cc97a;box-shadow:0 0 6px #4cc97acc}.connection-badge--wait .connection-badge__dot{background:#f2c14e;animation:.9s ease-in-out infinite status-dot}.connection-badge--bad .connection-badge__dot{background:#e0463a}.hud__online{align-items:center;gap:8px;min-width:0;font-size:12px;display:inline-flex}.hud__room{letter-spacing:.1em;opacity:.8;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.hud__opponent{text-overflow:ellipsis;white-space:nowrap;max-width:110px;font-weight:700;overflow:hidden}.hud__away{color:#f2c14e;white-space:nowrap;display:none}.hud__away--reconnected{color:#4cc97a!important}@media (width>=701px){.hud__away{display:inline}}@media (width<=700px){.hud__room,.hud__opponent,.hud__away{display:none!important}}@media (prefers-reduced-motion:reduce){.waiting-room__spinner,.connection-badge--wait .connection-badge__dot{animation:none}}@media (width<=480px){.toolbar{gap:6px}.status{letter-spacing:.03em;gap:6px;padding:3px 10px;font-size:13px}.hud__online{flex:none;gap:0}.hud__away{display:none!important}.toolbar__button--danger,.toolbar__button--accent{padding-left:10px;padding-right:10px}}.field__input{width:100%;min-width:0}.field{min-width:0}@media (height<=460px){.waiting-room .modal,.online-lobby .modal{gap:6px;padding:14px 20px}.waiting-room__code{font-size:28px}.waiting-room__link .field__input{min-height:36px}}.game-board-area{flex-direction:column;align-items:center;width:100%;min-width:0;display:flex}.connection-banner{letter-spacing:.03em;z-index:10;border-radius:999px;justify-content:center;align-items:center;gap:8px;max-width:min(100vw - 32px,360px);margin-top:8px;padding:4px 14px;font-size:13px;font-weight:600;animation:.2s ease-out both banner-enter;display:inline-flex}@keyframes banner-enter{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}.connection-banner--wait,.connection-banner--bad{color:#f2c14e;background:#78281473;border:1px solid #f2c14eb3;box-shadow:0 2px 10px #00000059}.connection-banner--ok{color:#4cc97a;background:#1e503273;border:1px solid #4cc97ab3;box-shadow:0 2px 10px #00000059}.connection-banner__dot{border-radius:50%;flex:none;width:8px;height:8px}.connection-banner--wait .connection-banner__dot{background:#f2c14e;animation:.9s ease-in-out infinite status-dot;box-shadow:0 0 6px #f2c14e}.connection-banner--bad .connection-banner__dot{background:#e0463a;box-shadow:0 0 6px #e0463a}.connection-banner--ok .connection-banner__dot{background:#4cc97a;box-shadow:0 0 6px #4cc97a}@media (width>=701px){.connection-banner{display:none!important}}@media (height<=460px){.connection-banner{display:none!important}}@media (prefers-reduced-motion:reduce){.connection-banner,.connection-banner--wait .connection-banner__dot{animation:none}}.game-board-3d-wrapper{width:min(calc(100vw - 32px - var(--side-w,0px)), calc((100dvh - var(--chrome-h)) * .9));aspect-ratio:9/10;background:radial-gradient(#231912f2,#120c08fa);border-radius:1.2%;flex:none;position:relative;overflow:hidden;box-shadow:0 0 0 1px #7a5a1ce6,0 0 0 4px #5a3a1ae6,0 0 0 5px #c9a24a8c,0 18px 40px #0000008c,inset 0 0 22px #5a3a1a47}.game-board-3d-canvas-container{touch-action:none;width:100%;height:100%}.game-board-3d-canvas-container canvas{outline:none;display:block;width:100%!important;height:100%!important}.game-board-3d-controls{z-index:10;pointer-events:auto;position:absolute;bottom:12px;right:12px}.game-board-3d-btn{border:1px solid var(--gold);color:var(--gold-hi);cursor:pointer;-webkit-backdrop-filter:blur(6px);background:#211a12e0;border-radius:999px;padding:6px 12px;font-size:12px;font-weight:600;transition:background .15s,transform .15s,border-color .15s;box-shadow:0 4px 12px #00000073}.game-board-3d-btn:hover{border-color:var(--gold-hi);background:#322819f2;transform:translateY(-1px)}.game-board-3d-btn:active{transform:translateY(1px)}.game-board-3d-fallback{text-align:center;width:min(calc(100vw - 32px - var(--side-w,0px)), calc((100dvh - var(--chrome-h)) * .9));aspect-ratio:9/10;border:1px solid var(--gold);color:var(--gold-hi);background:#211a12d9;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;gap:16px;padding:32px;display:flex}
