:root{--bg: #0d0d1a;--bg2: #14142a;--bg3: #1e1e3a;--gold: #c9a84c;--gold-dim: #8a6f2e;--red: #e63946;--green: #2dc653;--yellow: #f4d03f;--text: #e8e8f0;--text-dim: #8888aa;--border: #2a2a4a;--color-hp-high: #2dc653;--color-hp-mid: #f4d03f;--color-hp-low: #e63946}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:Segoe UI,system-ui,sans-serif;font-size:14px;min-height:100dvh;overscroll-behavior:none}button{cursor:pointer;border:none;background:none;font:inherit;color:inherit}input{font:inherit;color:inherit;background:var(--bg3);border:1px solid var(--border);border-radius:8px;padding:8px 12px;outline:none;width:100%}input:focus{border-color:var(--gold)}.app{max-width:480px;margin:0 auto;min-height:100dvh;display:flex;flex-direction:column}.screen{flex:1;display:flex;flex-direction:column;gap:12px;padding:16px;overflow-y:auto}.home-screen{align-items:center;padding-top:32px}.home-header{text-align:center;margin-bottom:8px}.home-logo{font-size:64px;line-height:1;margin-bottom:8px}.home-title{font-size:28px;font-weight:800;letter-spacing:4px;color:var(--gold)}.home-subtitle{color:var(--text-dim);margin-top:4px}.player-tag{background:var(--bg2);border:1px solid var(--border);border-radius:20px;padding:6px 16px;font-size:13px;color:var(--text-dim)}.home-actions{width:100%;display:flex;flex-direction:column;gap:12px;margin-top:8px}.big-btn{display:flex;flex-direction:column;align-items:center;padding:16px;border-radius:12px;font-size:16px;font-weight:700;background:var(--bg3);border:1px solid var(--border);transition:transform .1s,border-color .1s;width:100%}.big-btn:active{transform:scale(.97)}.big-btn__sub{font-size:12px;font-weight:400;color:var(--text-dim);margin-top:4px}.big-btn--pve{border-color:var(--green)}.big-btn--pve:hover{background:#1a2e1a}.big-btn--pvp{border-color:var(--gold)}.big-btn--pvp:hover{background:#2a2010}.error-banner{background:#2a0a0a;border:1px solid var(--red);border-radius:8px;padding:10px 14px;color:var(--red);font-size:13px;width:100%;text-align:center}.join-panel{background:var(--bg2);border:1px solid var(--border);border-radius:12px;padding:14px;width:100%}.join-panel__label{color:var(--text-dim);font-size:13px;margin-bottom:8px}.join-panel__row{display:flex;gap:8px}.join-input{text-transform:uppercase;letter-spacing:2px;font-weight:700}.join-btn{background:var(--gold);color:#000;border-radius:8px;padding:8px 16px;font-weight:700;flex-shrink:0}.join-panel__error{color:var(--red);font-size:12px;margin-top:6px}.lobby-screen{gap:16px}.lobby-header{display:flex;flex-direction:column;align-items:center;gap:8px}.lobby-header h2{font-size:22px;font-weight:800}.room-code{display:flex;align-items:center;gap:8px;background:var(--bg3);border:2px solid var(--gold);border-radius:10px;padding:8px 20px;font-size:24px;font-weight:900;letter-spacing:4px;color:var(--gold)}.copy-btn{font-size:18px;opacity:.7}.copy-btn:hover{opacity:1}.lobby-players{display:flex;flex-direction:column;gap:8px}.lobby-players__label{color:var(--text-dim);font-size:13px}.lobby-player{background:var(--bg2);border:1px solid var(--border);border-radius:8px;padding:10px 14px;font-weight:600}.lobby-player--empty{opacity:.4;font-style:italic}.lobby-status{text-align:center;padding:12px;background:var(--bg2);border-radius:8px;color:var(--text-dim)}.lobby-status--starting{color:var(--green);border:1px solid var(--green)}.lobby-hint{text-align:center;color:var(--text-dim);font-size:13px}.back-btn{padding:12px;border-radius:8px;background:var(--bg2);border:1px solid var(--border);color:var(--text-dim);text-align:center}.battle-screen{gap:10px;padding:12px}.round-timer{display:flex;justify-content:space-between;align-items:center;background:var(--bg2);border:1px solid var(--border);border-radius:8px;padding:8px 14px}.round-timer__round{font-weight:700;color:var(--gold)}.round-timer__seconds{font-size:20px;font-weight:800;font-variant-numeric:tabular-nums}.round-timer--urgent .round-timer__seconds{color:var(--red);animation:pulse .5s infinite alternate}@keyframes pulse{0%{opacity:1}to{opacity:.5}}.hp-bars{display:flex;flex-direction:column;gap:8px}.player-bar{display:flex;flex-direction:column;gap:4px}.player-bar.flip{align-items:flex-end}.player-bar__name{font-size:13px;font-weight:600}.bar-track{height:10px;background:var(--bg3);border-radius:5px;overflow:hidden}.bar-fill{height:100%;border-radius:5px;transition:width .4s ease}.player-bar__hp{font-size:12px;color:var(--text-dim)}.player-bar__distance{font-size:12px;color:var(--text-dim);font-weight:400}.distance-bar{display:flex;flex-direction:column;align-items:center;gap:6px}.distance-bar__label{font-size:13px;color:var(--text-dim)}.distance-bar__dots{display:flex;gap:6px}.dot{width:12px;height:12px;border-radius:50%;background:var(--bg3);border:1px solid var(--border)}.dot--active{background:var(--gold);border-color:var(--gold)}.battle-log{background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:12px;max-height:160px;overflow-y:auto;flex-shrink:0}.battle-log--scrollable{max-height:220px}.battle-log__round{margin-bottom:12px}.battle-log__round:last-child{margin-bottom:0}.battle-log--empty{color:var(--text-dim);font-style:italic;font-size:13px}.battle-log__header{font-weight:700;color:var(--gold);margin-bottom:8px}.battle-log__events{display:flex;flex-direction:column;gap:5px}.log-event{font-size:13px;line-height:1.4}.log-event--shot{color:var(--red)}.log-event--grenade{color:var(--yellow)}.log-event--miss{color:var(--text-dim)}.log-event--move{color:var(--green)}.log-event--skipped{color:var(--text-dim);opacity:.6}.log-dmg{color:var(--red);font-weight:700}.action-panel{background:var(--bg2);border:1px solid var(--border);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:12px}.action-panel--waiting{align-items:center;justify-content:center;min-height:100px}.waiting-msg{color:var(--text-dim);font-size:16px}.action-group{display:flex;flex-direction:column;gap:6px}.action-group--disabled{opacity:.4;pointer-events:none}.action-group__label{font-size:13px;font-weight:700;color:var(--text-dim)}.action-group__hint{font-size:11px;font-weight:400;font-style:italic}.btn-row{display:flex;gap:6px}.dir-btn{flex:1;padding:10px 4px;border-radius:8px;background:var(--bg3);border:1px solid var(--border);font-size:13px;font-weight:600;text-align:center;transition:all .12s}.dir-btn:active{transform:scale(.95)}.dir-btn--active.shoot{background:#2a0a0a;border-color:var(--red);color:var(--red)}.dir-btn--active.dodge{background:#0a1a0a;border-color:var(--green);color:var(--green)}.action-extras{display:flex;gap:8px}.extra-btn{flex:1;padding:10px 8px;border-radius:8px;background:var(--bg3);border:1px solid var(--border);font-size:13px;font-weight:600;text-align:center;transition:all .12s}.extra-btn--active{background:#1a1a0a;border-color:var(--yellow);color:var(--yellow)}.extra-btn--disabled{opacity:.35;cursor:not-allowed}.target-list{display:flex;flex-direction:column;gap:6px}.target-btn{display:flex;justify-content:space-between;align-items:center;background:var(--bg3);border:1px solid var(--border);border-radius:8px;padding:8px 12px;color:var(--text);font-size:13px;cursor:pointer;text-align:left;transition:border-color .15s}.target-btn--selected{border-color:var(--gold);background:color-mix(in srgb,var(--gold) 12%,var(--bg3))}.target-btn__name{font-weight:600}.target-btn__info{display:flex;align-items:center;gap:4px;font-size:12px}.target-btn__dist{color:var(--text-dim)}.submit-btn{background:var(--gold);color:#000;border-radius:10px;padding:14px;font-size:15px;font-weight:800;text-align:center;transition:transform .1s}.submit-btn:active{transform:scale(.97)}.battle-home-btn{align-self:flex-start;background:none;border:none;color:var(--text-dim);font-size:13px;cursor:pointer;padding:0}.battle-home-btn:active{opacity:.6}.dead-banner{text-align:center;padding:20px;font-size:24px;color:var(--text-dim)}.result-screen{align-items:center;justify-content:center;gap:20px}.result-banner{font-size:40px;font-weight:900;letter-spacing:2px;padding:20px 40px;border-radius:16px;text-align:center}.result-banner.win{background:#0a2a0a;color:var(--green);border:2px solid var(--green)}.result-banner.loss{background:#2a0a0a;color:var(--red);border:2px solid var(--red)}.result-banner.draw{background:var(--bg2);color:var(--text-dim);border:2px solid var(--border)}.result-winner{color:var(--text-dim);font-size:14px}.result-stats{display:flex;gap:20px;background:var(--bg2);border-radius:12px;padding:16px 24px}.result-stat{display:flex;flex-direction:column;align-items:center;gap:4px}.result-stat__label{font-size:12px;color:var(--text-dim)}.result-stat__value{font-size:24px;font-weight:800;color:var(--gold)}.battle-history{width:100%;display:flex;flex-direction:column;gap:8px;margin-top:4px}.battle-history__title{font-size:13px;font-weight:700;color:var(--text-dim)}.battle-history__empty{font-size:13px;color:var(--text-dim);font-style:italic;padding:12px 0}.battle-history__list{display:flex;flex-direction:column;gap:6px}.history-entry{display:flex;align-items:center;gap:10px;background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:10px 12px;cursor:pointer;text-align:left;color:var(--text);transition:border-color .15s;width:100%}.history-entry:active{opacity:.8}.history-entry--win{border-left:3px solid var(--green)}.history-entry--loss{border-left:3px solid var(--red)}.history-entry--draw{border-left:3px solid var(--text-dim)}.history-entry--active{border-left:3px solid var(--accent);animation:pulse-border 1.5s ease-in-out infinite}@keyframes pulse-border{0%,to{border-left-color:var(--accent)}50%{border-left-color:transparent}}.history-entry__icon{font-size:18px;flex-shrink:0}.history-entry__info{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}.history-entry__opponent{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.history-entry__sub{font-size:11px;color:var(--text-dim)}.history-entry__hp{font-size:12px;color:var(--text-dim);flex-shrink:0}.history-entry__arrow{font-size:18px;color:var(--text-dim);flex-shrink:0}.history-detail-screen{gap:12px}.history-detail__header{display:flex;align-items:center;gap:12px}.result-banner--compact{font-size:20px;padding:6px 16px;letter-spacing:1px}.history-detail__meta{display:flex;gap:12px;font-size:13px;color:var(--text-dim);flex-wrap:wrap}.history-detail__hp{color:var(--green)}.resume-battle-btn{width:100%;padding:12px;background:var(--accent);color:#000;border:none;border-radius:10px;font-size:14px;font-weight:700;cursor:pointer;letter-spacing:.5px}.resume-battle-btn:active{opacity:.85}