html,body{margin:0;padding:0;width:100%;height:100%;overflow:hidden;touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}#game-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;touch-action:none}canvas{display:block}@keyframes fadeInOut{0%{opacity:0;transform:translate(-50%,-50%) scale(.8)}10%{opacity:1;transform:translate(-50%,-50%) scale(1)}90%{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-50%) scale(.8)}}.hud-container{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1000;font-family:Arial,sans-serif}.hud-panel{position:absolute;background:#000000bf;border:2px solid rgba(255,255,255,.3);border-radius:8px;padding:12px 16px;color:#fff;font-size:14px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);box-shadow:0 4px 12px #00000080;pointer-events:auto}.top-left{top:20px;left:20px}.top-right{top:20px;right:20px}.top-center{top:20px;left:50%;transform:translate(-50%)}.bottom-left{bottom:20px;left:20px}.bottom-right{bottom:20px;right:20px}.bottom-center{bottom:20px;left:50%;transform:translate(-50%)}.hud-title{font-size:16px;font-weight:700;margin-bottom:8px;color:gold;text-transform:uppercase;letter-spacing:1px;border-bottom:1px solid rgba(255,215,0,.3);padding-bottom:4px}.battle-title{font-size:24px;font-weight:700;color:#f44;text-transform:uppercase;letter-spacing:2px;text-shadow:0 0 10px rgba(255,68,68,.8)}.stat-row{display:flex;align-items:center;gap:8px;margin:6px 0}.stat-row-small{display:flex;align-items:center;gap:6px;margin:4px 0;font-size:12px}.stat-label{min-width:40px;color:#aaa;font-size:13px}.stat-label-small{min-width:30px;color:#aaa;font-size:11px}.stat-value{color:#fff;font-weight:700}.stat-value-small{color:#fff;font-weight:700;font-size:11px}.stat-bar-container{flex:1;height:18px;background:#0009;border:1px solid rgba(255,255,255,.3);border-radius:4px;overflow:hidden;position:relative}.stat-bar-container-small{flex:1;height:12px;background:#0009;border:1px solid rgba(255,255,255,.3);border-radius:3px;overflow:hidden}.stat-bar{height:100%;transition:width .3s ease-out;position:relative}.health-bar{background:linear-gradient(90deg,#f44,#f66);box-shadow:inset 0 2px 4px #fff3}.health-bar:after{content:"";position:absolute;top:0;left:0;right:0;height:50%;background:linear-gradient(180deg,rgba(255,255,255,.3) 0%,transparent 100%)}.control-row{display:flex;align-items:center;gap:8px;margin:4px 0;font-size:13px;color:#ccc}kbd{background:linear-gradient(180deg,#4a4a4a,#2a2a2a);border:1px solid #666666;border-radius:4px;padding:3px 8px;font-family:Courier New,monospace;font-size:12px;font-weight:700;color:#fff;box-shadow:0 2px 4px #0006,inset 0 1px #fff3;text-shadow:0 1px 1px rgba(0,0,0,.8)}.status-item{display:flex;justify-content:space-between;align-items:center;margin:6px 0;gap:12px}.status-label{color:#aaa;font-size:13px}.status-value{color:gold;font-weight:700;font-size:16px}#enemy-list{max-height:300px;overflow-y:auto}.enemy-item{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:6px;padding:8px;margin:6px 0}.enemy-name{font-weight:700;color:#f88;margin-bottom:4px;font-size:13px}.hud-message{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#000000e6;border:2px solid;border-radius:8px;padding:16px 32px;font-size:18px;font-weight:700;text-align:center;opacity:0;transition:opacity .3s ease-in-out;pointer-events:auto;z-index:2000}.hud-message.show{opacity:1}.message-info{border-color:#48f;color:#48f}.message-success{border-color:#4f4;color:#4f4}.message-warning{border-color:#fa4;color:#fa4}.message-error{border-color:#f44;color:#f44}.victory-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle,#ffd7001a,#000c);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .5s ease-in-out;pointer-events:auto;z-index:3000}.victory-overlay.show{opacity:1}.victory-content{text-align:center;animation:victoryPulse 2s ease-in-out infinite}.victory-title{font-size:72px;font-weight:700;color:gold;text-transform:uppercase;letter-spacing:8px;margin:0;text-shadow:0 0 20px rgba(255,215,0,.8),0 0 40px rgba(255,215,0,.6),0 0 60px rgba(255,215,0,.4),0 4px 8px rgba(0,0,0,.8)}.victory-subtitle{font-size:24px;color:#fff;margin-top:16px;text-shadow:0 2px 4px rgba(0,0,0,.8)}@keyframes victoryPulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@media (max-width: 768px){.hud-panel{padding:8px 12px;font-size:12px}.hud-title{font-size:14px}.battle-title{font-size:18px}.victory-title{font-size:48px}}#enemy-list::-webkit-scrollbar{width:6px}#enemy-list::-webkit-scrollbar-track{background:#0000004d;border-radius:3px}#enemy-list::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:3px}#enemy-list::-webkit-scrollbar-thumb:hover{background:#ffffff80}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.hud-panel{animation:fadeIn .3s ease-out}.status-value,.stat-value{text-shadow:0 0 4px rgba(255,255,255,.3)}#npcs-defeated{color:#4f4;text-shadow:0 0 6px rgba(68,255,68,.5)}#npcs-remaining{color:#fa4;text-shadow:0 0 6px rgba(255,170,68,.5)}