@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@400;600;700;900&display=swap');
:root{--paper:#f4e4c4;--muted:#c4b49a;--gold:#d9a65c;--rust:#9e3928;--ink:#120e0b;font-family:'Noto Serif SC',Georgia,serif;color:var(--paper)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#100d0b}button,a{-webkit-tap-highlight-color:transparent}button{font-family:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid #f7ce83;outline-offset:3px}a{color:inherit;text-decoration:none}#battle{display:block;width:100%;height:100%;touch-action:none;outline:none}body{user-select:none;-webkit-user-select:none}.vignette{position:fixed;inset:0;pointer-events:none;box-shadow:inset 0 0 230px rgba(14,8,5,.65);z-index:2}.vignette:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,7,8,.36),transparent 24%,transparent 70%,rgba(10,7,5,.45))}#hit-flash{position:fixed;inset:0;z-index:6;background:#c72c20;opacity:0;pointer-events:none;transition:opacity .14s}#hit-flash.active{opacity:.35;transition:none}
.hud{position:fixed;inset:0;z-index:4;pointer-events:none}.hud button,.hud a{pointer-events:auto}.topbar{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:flex-start;padding:24px 32px 0}.back{font:600 14px system-ui,sans-serif;color:var(--muted);letter-spacing:.12em;border:1px solid #c7a87566;background:#100d0b77;padding:10px 15px}.back:hover{color:white;border-color:#e5b56a}.mission{position:absolute;left:50%;top:23px;transform:translateX(-50%);text-align:center;text-shadow:0 2px 12px #080604}.mission-eyebrow{font:600 10px system-ui,sans-serif;letter-spacing:.36em;color:var(--gold);margin-bottom:5px}.mission strong{display:block;font-size:21px;letter-spacing:.12em}.mission span{display:block;margin-top:5px;color:#d3bca0;font-size:11px;letter-spacing:.2em}.top-actions{display:flex;gap:8px}.top-actions button{width:35px;height:35px;background:#130d0c99;border:1px solid #c7a87566;color:#f4e4c4;font:18px Georgia}
.hero-hud{position:absolute;top:105px;left:32px;display:flex;align-items:center;gap:14px;width:290px}.hero-emblem{width:58px;height:64px;border:1px solid #cfa662;background:radial-gradient(circle at 50% 30%,#8d3429,#30160f 67%);box-shadow:0 3px 22px #0007;color:#f0d4a0;font-size:34px;display:grid;place-items:center}.hero-data{flex:1}.hero-line{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:7px}.hero-line strong{font-size:19px}.hero-line small{font-size:11px;color:#d3bca0;font-weight:400}.hero-line span{font:10px system-ui,sans-serif;letter-spacing:.1em;color:#cdbb9d}.meter{height:15px;position:relative;background:#160d0bbb;border:1px solid #c7aa7b80;overflow:hidden;padding:2px}.meter>span{display:block;height:100%;width:100%;transition:width .18s;background:linear-gradient(90deg,#772516,#ce5139,#f19a60)}.meter.hp{height:17px}.meter em{position:absolute;inset:0;display:grid;place-items:center;font:600 9px system-ui,sans-serif;letter-spacing:.1em;color:#fff0dc;font-style:normal;text-shadow:0 1px 4px #000}.meter.energy{margin-top:5px;height:8px}.meter.energy>span{background:linear-gradient(90deg,#8b6629,#efcc79)}.counter{position:absolute;right:34px;top:94px;display:flex;flex-direction:column;align-items:end;text-shadow:0 4px 12px #100800}.counter small{font-size:12px;color:#d9c8b2;letter-spacing:.4em}.counter strong{font:italic 700 64px Georgia,serif;color:#f0d8a2;line-height:1.08}.counter span{font:600 12px system-ui,sans-serif;letter-spacing:.3em;color:#e1a757}.radar-shell{position:absolute;right:24px;bottom:27px;text-align:center}.radar-shell canvas{display:block;width:150px;height:150px;background:#140f0ea8;border:1px solid #c29c6666;border-radius:50%;box-shadow:0 0 25px #100909aa}.radar-shell span{font-size:10px;color:#cbb38e;letter-spacing:.25em}.boss-hud{position:absolute;top:calc(100% - 190px);left:50%;transform:translateX(-50%);width:min(450px,48vw);text-align:center}.boss-hud p{margin:0 0 9px;font-size:24px;font-weight:bold;letter-spacing:.18em;text-shadow:0 2px 8px #000}.boss-hud p span{font-size:12px;font-weight:normal;color:#e8be86}.meter.boss{height:15px}.meter.boss span{background:linear-gradient(90deg,#85200d,#d54a24,#f2ad67)}
.bottom-hud{position:absolute;bottom:29px;left:32px}.controls-hint{font:11px/1.6 system-ui,sans-serif;color:#eadacaad;max-width:490px;text-shadow:0 2px 6px #000}.skill-tile{display:flex;align-items:center;gap:10px;margin-bottom:14px}.skill-tile b{border:1px solid #be8f51;background:#160e0bae;color:#f4dfab;padding:7px 13px;font:700 21px Georgia}.skill-tile span{font-size:15px;letter-spacing:.14em}.skill-tile em{font-style:normal;font:11px system-ui;color:#d9b777}.combo{position:absolute;bottom:86px;left:0;display:flex;gap:10px;align-items:baseline;color:#f3c57d;text-shadow:0 0 20px #bc542a}.combo strong{font:italic 700 55px Georgia}.combo span{font:600 13px system-ui;letter-spacing:.15em}
.screen{position:fixed;inset:0;z-index:10}.start-screen{background:linear-gradient(90deg,#0e0b0af2 0%,#170e0cca 43%,#0e0b0a22 82%),linear-gradient(0deg,#090807d6,transparent 50%);display:flex;align-items:center;pointer-events:auto}.screen-content{padding:20px 0 15px clamp(34px,10vw,190px);max-width:700px;position:relative}.eyebrow{font:600 11px system-ui,sans-serif;letter-spacing:.31em;color:#dcae76}.chop{position:absolute;left:min(50vw,630px);top:22px;border:1px solid #bc7f5d;color:#cda277;font-size:16px;line-height:1.7;padding:5px 12px;transform:rotate(-8deg);opacity:.65}.start-screen h1{margin:14px 0 2px;font-size:clamp(68px,9vw,139px);line-height:1.15;letter-spacing:.1em;font-weight:900;text-shadow:0 3px 35px #000c;white-space:nowrap}.start-screen h1 span{color:#c9482e}.hero-divider{display:flex;align-items:center;gap:20px;letter-spacing:.6em;color:#ddbb87;font-size:20px;margin:12px 0 27px}.hero-divider span{height:1px;width:55px;background:linear-gradient(90deg,#c49f5c,transparent)}.lead{max-width:395px;line-height:2.1;letter-spacing:.1em;font-size:14px;color:#e5d3bd}.primary{border:1px solid #e0b16d;background:linear-gradient(110deg,#8b2f22,#bc4c2d);color:#fff2da;box-shadow:0 8px 26px #0006;min-width:205px;margin-top:25px;padding:15px 23px;font-size:17px;font-weight:bold;letter-spacing:.26em;transition:filter .2s,transform .2s}.primary:hover{filter:brightness(1.2);transform:translateY(-2px)}.primary i{font-style:normal;font-family:system-ui;font-size:21px;margin-left:15px}.start-caption{font-size:10px;line-height:1.8;letter-spacing:.1em;color:#ad9886;margin-top:22px}.loading-hint{font-size:11px;letter-spacing:.12em;color:#b29a7b}.screen-footer{position:absolute;bottom:28px;left:33px;right:33px;display:flex;justify-content:space-between;font:10px system-ui,sans-serif;letter-spacing:.2em;color:#b9a488}
.overlay-screen{display:grid;place-items:center;background:#080808ab;backdrop-filter:blur(6px)}.modal{width:min(430px,90vw);padding:48px 30px;text-align:center;background:linear-gradient(150deg,#271a17ee,#0b0a09f8);border:1px solid #b88a5677;box-shadow:0 20px 80px #000b}.modal h2{font-size:48px;letter-spacing:.14em;margin:13px 0 4px}.modal>p:not(.eyebrow){color:#c7b8a5;font-size:14px;line-height:1.9}.ghost{display:block;background:transparent;border:1px solid #b88a5677;color:#e6caa3;width:205px;max-width:100%;margin:14px auto 0;padding:12px 8px;font-size:13px;letter-spacing:.2em}.modal .primary{display:block;margin:24px auto 0}.end-stat{border-top:1px solid #ffffff21;border-bottom:1px solid #ffffff21;padding:12px;display:flex;justify-content:center;align-items:baseline;gap:19px}.end-stat span{color:#bdab90}.end-stat strong{font:700 38px Georgia;color:#f3bd77}#toast{z-index:8;position:fixed;left:50%;top:28%;transform:translate(-50%,-20px);opacity:0;transition:opacity .35s,transform .35s;white-space:nowrap;font-size:22px;font-weight:700;color:#f0c989;text-shadow:0 3px 15px #0a0706,0 0 20px #dd6137;pointer-events:none;letter-spacing:.25em}#toast.show{opacity:1;transform:translate(-50%,0)}.error-screen{position:fixed;z-index:20;inset:0;display:grid;place-content:center;text-align:center;padding:30px;background:#100d0b}.error-screen a{color:#efb575}[hidden]{display:none!important}
.mobile{position:fixed;inset:0;z-index:5;pointer-events:none}.joystick{position:absolute;bottom:38px;left:28px;width:126px;height:126px;border-radius:50%;border:2px solid #d0b08655;background:#21140c55;pointer-events:auto;touch-action:none;display:grid;place-items:center}.joystick>div{width:54px;height:54px;border-radius:50%;background:#d6a97099;border:2px solid #f7ddae55;box-shadow:0 5px 13px #0008;transform:translate(0,0)}.touch-actions{position:absolute;bottom:28px;right:23px;width:205px;height:188px;pointer-events:none}.touch-actions button{position:absolute;border-radius:50%;border:1px solid #ffd4a68c;background:#57251aba;color:#ffe2b0;font-size:17px;font-weight:700;pointer-events:auto;touch-action:none;text-shadow:0 2px 6px #000}.touch-attack{right:3px;bottom:3px;width:82px;height:82px!important;font-size:27px!important;background:#a54529c9!important}.touch-heavy{right:94px;bottom:19px;width:65px;height:65px}.touch-dodge{right:20px;bottom:94px;width:59px;height:59px}.touch-skill{right:112px;bottom:104px;width:69px;height:69px;background:#94652cbb!important;font-size:14px!important}.touch-note{position:absolute;right:18px;top:40%;font-size:10px;color:#e8d1a279;writing-mode:vertical-rl}
@media(max-width:750px){.topbar{padding:12px 14px}.back{padding:8px 10px;font-size:10px}.back span{display:none}.top-actions{gap:4px}.top-actions button{width:30px;height:30px}.mission{top:11px}.mission strong{font-size:15px}.mission span{font-size:9px}.mission-eyebrow{font-size:8px}.hero-hud{top:76px;left:13px;width:200px;gap:8px}.hero-emblem{width:44px;height:48px;font-size:25px}.hero-line strong{font-size:14px}.counter{top:80px;right:14px}.counter strong{font-size:46px}.counter span{font-size:10px}.radar-shell{top:144px;right:11px;bottom:auto}.radar-shell canvas{width:100px;height:100px}.radar-shell span{font-size:8px}.bottom-hud{left:10px;bottom:6px}.controls-hint{display:none}.skill-tile{display:none}.combo{bottom:174px}.boss-hud{width:70vw;top:auto;bottom:226px}.boss-hud p{font-size:16px}.screen-content{padding-left:7vw;padding-right:7vw}.start-screen h1{font-size:clamp(52px,12vw,90px)}.hero-divider{font-size:15px;gap:10px}.chop{display:none}.lead{font-size:13px}.screen-footer{left:16px;right:16px;font-size:8px}.mobile{display:block}}
@media(max-width:420px){.radar-shell{display:none}.start-screen h1{letter-spacing:0;font-size:58px}.start-caption{font-size:9px}}
.battle-tip{position:fixed;left:50%;top:37%;transform:translateX(-50%);font:700 17px system-ui,sans-serif;letter-spacing:.16em;color:#ffe5ab;background:#1e100bd9;border:1px solid #ffd17d66;padding:11px 22px;box-shadow:0 0 40px #d45c3255;pointer-events:none;text-align:center;white-space:nowrap}
.touch-parry{left:0;bottom:70px;width:58px;height:58px;background:#345566ba!important}
@media(max-width:750px){.battle-tip{font-size:12px;top:34%;max-width:90vw;white-space:normal}}