:root{--ink-deep: #08060e;--ink0: #0e0d14;--ink1: #12111a;--ink2: #1a1824;--ink3: #242232;--ink4: #302d44;--line: #4a4560;--line-dim: #322e42;--line-hot: #8a7fc0;--gold: #e8c84a;--gold-light: #f5e07a;--gold-dark: #a8892a;--gold-warm: #ffd24a;--text: #ded9e8;--text-dim: #9a94ab;--text-faint: #6c667e;--hp: #4ad06a;--hp-low: #e8503c;--xp: #5aa8e8;--rage: #f5a04a;--ok: #7ee08a;--bad: #e87070;--warn: #f5a04a;--harden: #8ab4e8;--floor-a: #292b36;--floor-b: #303340;--map-wall: #735740;--font: "Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", sans-serif;--ease: cubic-bezier(.2, .7, .3, 1)}*{box-sizing:border-box}body{font-family:var(--font);color:var(--text)}.btn{font:inherit;font-size:13px;color:var(--text);background:linear-gradient(180deg,var(--ink3),var(--ink2));border:1px solid var(--line);border-radius:4px;padding:7px 12px;cursor:pointer;transition:transform .08s var(--ease),border-color .12s,background .12s;user-select:none;white-space:nowrap}.btn:hover:not(:disabled){border-color:var(--line-hot);background:linear-gradient(180deg,var(--ink4),var(--ink3))}.btn:active:not(:disabled){transform:translateY(1px)}.btn:disabled{opacity:.42;cursor:not-allowed}.btn.gold{color:var(--ink0);background:linear-gradient(180deg,var(--gold-light),var(--gold));border-color:var(--gold-dark);font-weight:700}.btn.danger{color:#ffdede;border-color:#7a3a3a;background:linear-gradient(180deg,#4a1f24,#2a1418)}.btn.wide{width:100%;text-align:center}.hud{position:relative;width:100%;height:var(--hud-h, 48px);min-height:48px;display:flex;align-items:center;gap:10px;padding:0 10px;background:linear-gradient(180deg,var(--ink2),var(--ink0));border-bottom:1px solid var(--line-dim);font-size:12px;color:var(--text-dim);z-index:5;overflow:hidden}.hud .bar{position:relative;width:120px;height:12px;border:1px solid var(--line-dim);border-radius:3px;background:var(--ink0);overflow:hidden}.hud .bar>i{display:block;height:100%;width:0;transition:width .18s var(--ease)}.hud .bar.hp>i{background:linear-gradient(90deg,#2f9a4a,var(--hp))}.hud .bar.hp.low>i{background:linear-gradient(90deg,#a12c1e,var(--hp-low))}.hud .bar.rage>i{background:linear-gradient(90deg,#a85a10,var(--rage))}.hud .bar.sta>i{background:linear-gradient(90deg,#365a8a,var(--xp))}.hud .val{min-width:64px;color:var(--text);font-variant-numeric:tabular-nums}.hud .gold{color:var(--gold)}.hud .mats{margin-left:auto;color:var(--text-faint);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:250px}.toast-area{position:absolute;left:0;bottom:0;width:100%;padding:0 12px max(10px,env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:4px;pointer-events:none}.toast{align-self:flex-start;max-width:100%;padding:5px 10px;border-radius:4px;font-size:12px;line-height:1.5;background:#0a0810db;border:1px solid var(--line-dim);color:var(--text);animation:toast-in .16s var(--ease);white-space:pre-wrap}.toast.tutorial{border-color:var(--gold-dark);color:var(--gold-light)}@keyframes toast-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}.modal-scrim{position:absolute;inset:0;background:#040308b8;display:grid;place-items:center;z-index:30}.modal{width:min(520px,calc(100% - 24px));max-width:calc(100% - 24px);max-height:calc(100% - 24px);display:flex;flex-direction:column;background:linear-gradient(180deg,var(--ink2),var(--ink0));border:1px solid var(--line);border-radius:6px;box-shadow:0 18px 48px #0009,inset 0 1px #ffffff0f;overflow:hidden}.modal.wide{width:min(640px,calc(100% - 24px))}.modal.card{width:min(560px,calc(100% - 24px))}.modal>header{padding:10px 14px;font-size:14px;color:var(--gold-light);border-bottom:1px solid var(--line-dim);background:linear-gradient(180deg,var(--ink3),var(--ink2))}.modal>.body{padding:12px 14px;overflow-y:auto;font-size:13px;line-height:1.7;color:var(--text);min-height:0}.modal>.body .row{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px dashed var(--line-dim)}.modal>.body .row:last-child{border-bottom:none}.modal>.body .row .grow{flex:1;min-width:0}.modal>.body .row .sub{color:var(--text-dim);font-size:12px}.modal>footer{padding:10px 14px;display:flex;gap:8px;justify-content:flex-end;border-top:1px solid var(--line-dim);background:var(--ink1)}.battle{position:absolute;inset:0;padding:calc(var(--hud-h, 48px) + 8px) 12px 10px;display:flex;flex-direction:column;gap:6px;background:radial-gradient(circle at 50% 22%,#1b1526 0%,var(--ink-deep) 62%)}.battle .foe-row{display:flex;align-items:center;gap:12px;height:150px}.battle .foe-art{width:144px;height:144px;image-rendering:pixelated;filter:drop-shadow(0 6px 12px rgba(0,0,0,.6))}.battle .foe-art.hit{animation:flash .16s linear}@keyframes flash{0%{filter:brightness(3) saturate(0)}to{filter:none}}.battle .foe-info{flex:1;min-width:0}.battle .foe-name{font-size:15px;color:var(--gold-light);margin-bottom:4px}.battle .foe-name .tier{margin-left:8px;font-size:11px;color:var(--text-faint)}.battle .intent{display:inline-flex;align-items:center;gap:6px;margin-top:6px;padding:3px 8px;border:1px solid var(--line-dim);border-radius:3px;font-size:12px;color:var(--text-dim);background:var(--ink1)}.battle .intent.charge{color:var(--warn);border-color:#7a5220}.battle .intent.multi{color:var(--harden);border-color:#2f4a6a}.battle .dmg-float{position:absolute;font-size:20px;font-weight:700;color:var(--gold-warm);text-shadow:0 2px 6px #000;animation:float-up .7s var(--ease) forwards;pointer-events:none}@keyframes float-up{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-34px) scale(1.15)}}.battle .log{flex:1;min-height:0;overflow-y:auto;padding:6px 8px;border:1px solid var(--line-dim);border-radius:4px;background:#08060ea8;font-size:12px;line-height:1.6;color:var(--text-dim);white-space:pre-wrap}.battle .log b{color:var(--text)}.battle .actions{display:flex;flex-wrap:wrap;gap:6px}.battle .actions .btn{flex:1 1 auto;min-width:96px}.battle .hint{font-size:11px;color:var(--text-faint);text-align:center}.title{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding-bottom:42px;gap:8px;background-color:var(--ink-deep);background-size:cover;background-position:center}.title:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#08060e1a,#08060eeb 68%)}.title>*{position:relative;z-index:1}.title h1{margin:0 0 6px;font-size:34px;letter-spacing:6px;color:var(--gold-light);text-shadow:0 3px 0 var(--gold-dark),0 10px 24px rgba(0,0,0,.8)}.title .sub{margin-bottom:14px;font-size:12px;color:var(--text-dim);letter-spacing:2px}.title .slot{width:min(360px,88vw)}.victory{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:radial-gradient(circle at 50% 40%,#241a2e,var(--ink-deep) 70%);text-align:center;padding:40px}.victory h1{margin:0;font-size:30px;letter-spacing:4px;color:var(--gold-light)}.victory h1.lose{color:var(--bad)}.victory .stats{font-size:13px;line-height:2;color:var(--text-dim)}.victory .stats b{color:var(--text)}[data-layout=tablet] .hud .mats,[data-layout=mobile] .hud .mats{display:none}[data-layout=mobile] .hud{height:auto;min-height:48px;flex-wrap:wrap;gap:6px 8px;padding:6px 8px;font-size:11px;overflow:visible}[data-layout=mobile] #stage{align-items:flex-start;padding-top:8px}[data-layout=mobile] .hud .bar{width:clamp(68px,26vw,96px);height:10px}[data-layout=mobile] .hud .val{min-width:0;font-size:11px}[data-layout=mobile] .hud .mats{display:none}[data-layout=mobile] .toast{font-size:11.5px;padding:4px 8px}[data-layout=mobile] .modal{width:calc(100% - 16px);max-width:calc(100% - 16px);max-height:calc(100% - 16px)}[data-layout=mobile] .modal>.body{padding:10px 12px;font-size:12.5px}[data-layout=mobile] .modal>footer{flex-wrap:wrap}[data-layout=mobile] .btn{min-height:40px;padding:8px 10px}[data-layout=mobile] .battle{overflow-y:auto;padding:calc(var(--hud-h, 48px) + 6px) 8px 8px}[data-layout=mobile] .battle .foe-row{height:auto;min-height:96px;gap:10px}[data-layout=mobile] .battle .foe-art{width:88px;height:88px;flex:0 0 88px}[data-layout=mobile] .battle .foe-name{font-size:14px}[data-layout=mobile] .battle .log{flex:1 1 auto;min-height:72px;font-size:11.5px}[data-layout=mobile] .battle .actions .btn{flex:1 1 calc(50% - 6px);min-width:0;min-height:40px;white-space:normal}[data-layout=mobile] .battle .hint{display:none}[data-layout=mobile] .title{padding-bottom:max(24px,env(safe-area-inset-bottom))}[data-layout=mobile] .title h1{font-size:clamp(24px,9vw,32px);letter-spacing:3px}[data-layout=mobile] .title .sub{font-size:11px;letter-spacing:1px;text-align:center;padding:0 12px}[data-layout=mobile] .victory{padding:clamp(16px,5vw,28px);overflow-y:auto}[data-layout=mobile] .victory h1{font-size:24px}[data-layout=mobile] .victory .stats{font-size:12px;line-height:1.8;overflow-wrap:anywhere}[data-layout=mobile] .victory>div[style*="display:flex"]{flex-wrap:wrap;justify-content:center}.reduced-motion *,.reduced-motion *:before,.reduced-motion *:after{animation-duration:1ms!important;transition-duration:1ms!important}