.battle-ui{--ui-glass-top:#f6fafded;--ui-glass-bottom:#d6e4f1e6;--ui-head-top:#e2ecf6f2;--ui-head-bottom:#ceddecf2;--ui-hairline:#ffffffd9;--ui-rule:#768ca647;--ui-ink:#1c2733;--ui-ink-soft:#52616f;--ui-gold:#c39a4b;--ui-gold-wash:#d6b47080;--ui-track:#dce5ee;--ui-hp-a:#7fc485;--ui-hp-b:#c1e7ba;--ui-chk-a:#62a7e4;--ui-chk-b:#acd5f5;--ui-xp-a:#c39a4b;--ui-xp-b:#ecd7a8;--ui-cut:14px;--ui-serif:"Cinzel", Georgia, serif;--ui-sans:"Inter", system-ui, sans-serif;pointer-events:none;font-family:var(--ui-sans);color:var(--ui-ink);position:absolute;inset:0}.battle-ui button{font:inherit;color:inherit;pointer-events:auto;cursor:pointer;background:0 0;border:0;border-radius:0;margin:0;padding:0}.battle-ui button:focus-visible{outline:2px solid var(--ui-gold);outline-offset:-2px}.battle-ui button:disabled{cursor:not-allowed;opacity:.42}.panel{background:linear-gradient(180deg, var(--ui-glass-top), var(--ui-glass-bottom));clip-path:polygon(0 0, calc(100% - var(--ui-cut)) 0, 100% var(--ui-cut), 100% 100%, var(--ui-cut) 100%, 0 calc(100% - var(--ui-cut)));box-shadow:inset 0 0 0 1px var(--ui-hairline);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);pointer-events:auto;position:relative}.dock>*,.readout,.message,.result,.command-stack{filter:drop-shadow(0 3px 10px #101a2647)}.panel-head{font-family:var(--ui-serif);letter-spacing:.16em;text-transform:uppercase;color:var(--ui-ink-soft);background:linear-gradient(180deg, var(--ui-head-top), var(--ui-head-bottom));box-shadow:inset 0 -1px 0 var(--ui-rule), inset 0 1px 0 var(--ui-hairline);align-items:center;gap:.7em;padding:.5em 1.1em;font-size:clamp(11px,1vw,15px);font-weight:600;display:flex}.gold-diamond{background:var(--ui-gold);flex:none;width:.5em;height:.5em;display:inline-block;transform:rotate(45deg)}.level-diamond{aspect-ratio:1;flex:none;place-items:center;width:clamp(62px,6.2vw,92px);display:grid;position:relative}.level-diamond:before,.level-diamond:after{content:"";border:1.5px solid var(--ui-gold);position:absolute;inset:15%;transform:rotate(45deg)}.level-diamond:before{background:linear-gradient(#ffffffb3,#dbe7f380)}.level-diamond:after{opacity:.45;border-width:1px;inset:9%}.level-diamond span{font-variant-numeric:lining-nums;color:#1f2934;font-family:Crimson Pro,Georgia,serif;font-size:clamp(26px,2.7vw,40px);font-weight:500;position:relative}.bar-row{grid-template-columns:auto 1fr auto;align-items:center;gap:.65em;display:grid}.bar-label{min-width:2.3em;font-size:clamp(14px,1.3vw,19px);font-weight:500}.bar-track{background:var(--ui-track);border-radius:999px;height:clamp(8px,.85vw,12px);position:relative;overflow:hidden;box-shadow:inset 0 1px 2px #3a4e6847}.bar-fill{border-radius:inherit;background:linear-gradient(90deg, var(--ui-hp-a), var(--ui-hp-b));height:100%;box-shadow:inset 0 1px #ffffff73}.chk .bar-fill{background:linear-gradient(90deg, var(--ui-chk-a), var(--ui-chk-b))}.xp .bar-fill{background:linear-gradient(90deg, var(--ui-xp-a), var(--ui-xp-b))}.bar-number{font-variant-numeric:tabular-nums;color:var(--ui-ink-soft);text-align:right;min-width:5.5em;font-size:clamp(11px,.95vw,14px)}.bar-number small{opacity:.65}.dock{flex-direction:column;align-items:flex-end;gap:clamp(8px,1.4vh,14px);transition:opacity .12s;display:flex;position:absolute;bottom:clamp(12px,3vh,32px);right:clamp(12px,2vw,32px)}.status{width:clamp(300px,31vw,440px)}.status-body{align-items:center;gap:clamp(10px,1.4vw,20px);padding:.9em 1.2em 1em .8em;display:flex}.status-bars{flex:1;gap:.35em;display:grid}.status-name{align-items:center;gap:.6em;font-size:clamp(16px,1.6vw,23px);font-weight:500;display:flex}.command-stack{position:relative}.command{width:clamp(210px,19vw,280px)}.command-row{text-align:left;width:100%;box-shadow:inset 0 1px 0 var(--ui-hairline), inset 0 -1px 0 var(--ui-rule);align-items:center;gap:.6em;font-size:clamp(15px,1.4vw,20px);position:relative;padding:.75em 1.25em!important;display:flex!important}.command-row.selected{box-shadow:inset 4px 0 0 var(--ui-gold), inset 0 -1px 0 var(--ui-rule);background:linear-gradient(90deg, var(--ui-gold-wash), #f0e2c440 60%, transparent)!important}.command-row:not(.selected) span:first-child{padding-left:1.1em}.command-row .count{color:var(--ui-ink-soft);margin-left:auto;font-size:.85em}.submenu{position:absolute;bottom:0;right:0}.tools{width:clamp(240px,22vw,320px)}.techniques{width:clamp(330px,34vw,480px)}.technique-grid{grid-template-columns:1fr 1fr;display:grid}.technique{box-shadow:inset -1px 0 0 var(--ui-rule), inset 0 -1px 0 var(--ui-rule), inset 0 1px 0 var(--ui-hairline);align-items:center;gap:.75em;font-size:clamp(15px,1.4vw,20px);padding:1em 1.1em!important;display:flex!important}.technique.selected{background:linear-gradient(90deg, var(--ui-gold-wash), #f0e2c433 70%, transparent)!important}.technique-name{text-align:left;flex:1}.technique-acc{color:var(--ui-ink-soft);font-variant-numeric:tabular-nums;font-size:.7em}.pip{background:linear-gradient(135deg, color-mix(in srgb, var(--pip) 45%, white), var(--pip) 50%, color-mix(in srgb, var(--pip) 72%, black));width:.95em;height:.95em;box-shadow:0 0 0 1px color-mix(in srgb, var(--pip) 60%, black), inset 1px 1px 0 #ffffff80;flex:none;transform:rotate(45deg)}.pip.blank{box-shadow:0 0 0 1.5px var(--ui-gold);background:0 0}.readout{background:linear-gradient(180deg, var(--ui-glass-top), var(--ui-glass-bottom));clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px));min-width:clamp(120px,12vw,180px);box-shadow:inset 0 0 0 1px var(--ui-hairline);gap:.3em;padding:.35em .9em .5em;transition:opacity .12s;display:grid;position:absolute;transform:translate(-50%,-100%)}.readout.ally{min-width:0}.readout.foe{transform:translate(calc(-100% - 12vh),40%)}.readout-name{white-space:nowrap;justify-content:center;align-items:center;gap:.5em;font-size:clamp(12px,1.05vw,15px);font-weight:600;display:flex}.readout .bar-track{height:7px}.readout .bar-row{grid-template-columns:1fr}.state-chips{gap:.3em;display:inline-flex}.state-chip{letter-spacing:.06em;text-transform:uppercase;color:#fff;background:#6b7785;border-radius:3px;padding:.15em .5em;font-size:.62em;font-weight:700}.state-chip.burn{background:#d8453c}.state-chip.guarded{background:#8b6136}.state-chip.dazed{background:#7a6e9a}.message{white-space:nowrap;background:linear-gradient(180deg, var(--ui-glass-top), var(--ui-glass-bottom));clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px));box-shadow:inset 0 0 0 1px var(--ui-hairline);padding:.6em 1.6em;font-size:clamp(14px,1.35vw,19px);font-weight:500;position:absolute;top:clamp(52px,9vh,90px);left:50%;transform:translate(-50%)}.result{width:clamp(300px,30vw,420px);position:absolute;top:46%;left:50%;transform:translate(-50%,-50%)}.result-body{gap:.9em;padding:1.2em 1.5em 1.4em;font-size:clamp(14px,1.2vw,17px);display:grid}.result-body p{margin:0}.result-xp{font-family:var(--ui-serif);color:#8a6a2c;font-size:1.6em}.result-level{color:#2f6d3a;font-weight:600}.battle-ui .primary{box-shadow:inset 0 0 0 1px var(--ui-gold), 0 1px 0 #ffffffb3;clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px));background:linear-gradient(#f6ecd6,#e5cf9f);justify-self:end;padding:.6em 1.6em;font-weight:600}.battle-ui .primary:hover{background:linear-gradient(#fbf3e2,#ecd8ad)}.battle-ui.ui-hidden .dock,.battle-ui.ui-hidden .readout{opacity:0;pointer-events:none}:root{--ink:#f4efe2;--plate:#141a17b8;--edge:#f4efe238;--gutter:clamp(10px, 1.6vw, 20px);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:Georgia,Times New Roman,serif}*{box-sizing:border-box}html,body,#root{background:#0b0f0d;height:100%;margin:0;overflow:hidden}.page{width:100%;height:100%;position:relative}.stage{position:absolute;inset:0}.stage canvas{display:block}.hud,.hints{align-items:center;gap:var(--gutter);padding:var(--gutter);pointer-events:none;display:flex;position:absolute;left:0;right:0}.hud{top:0}.hints{flex-wrap:wrap;justify-content:flex-start;bottom:0}.title{color:var(--ink);letter-spacing:.08em;text-shadow:0 1px 6px #000000b3;margin:0;font-size:clamp(16px,2.2vw,26px);font-weight:400;position:absolute;left:50%;transform:translate(-50%)}button{pointer-events:auto;font:inherit;color:var(--ink);background:var(--plate);border:1px solid var(--edge);cursor:pointer;border-radius:6px;padding:6px 12px;font-size:14px}button:hover{border-color:var(--ink)}button:focus-visible{outline:2px solid var(--ink);outline-offset:2px}kbd{border:1px solid var(--edge);border-radius:4px;margin-right:4px;padding:0 5px;font-family:ui-monospace,monospace}