:root{--ink: #1a1a1a;--paper: #f4f1ea;--blue: #3498db;--red: #e74c3c;--gold: #f1c40f;--shadow: rgba(0,0,0,.4)}.game-container{width:100%;height:100vh;display:flex;align-items:center;justify-content:center;background:#0a0a0a;font-family:Noto Sans SC,sans-serif}.game-viewport{width:800px;height:450px;background:var(--paper);position:relative;overflow:hidden;border:8px solid var(--ink);box-shadow:0 30px 60px #000c}.background{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1}.background img{width:100%;height:100%;object-fit:cover;opacity:.7;filter:contrast(1.1) sepia(.2)}.bg-placeholder{width:100%;height:100%;background:linear-gradient(45deg,#2c3e50,#000)}.overlay-vignette{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle,transparent 20%,rgba(0,0,0,.6) 100%)}.cloud-tag{position:absolute;top:15px;right:20px;z-index:100;background:#000000b3;color:var(--gold);padding:5px 15px;border-radius:30px;font-size:12px;display:flex;align-items:center;gap:8px;border:1px solid rgba(241,196,15,.4)}.screen-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:200;background:#000000e6;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff}.game-title{font-size:5rem;font-weight:900;letter-spacing:20px;margin:0;text-shadow:5px 5px 0 var(--red);background:linear-gradient(to bottom,#fff,#ccc);-webkit-background-clip:text}.start-btn{background:var(--red);color:#fff;border:none;padding:15px 50px;font-size:1.4rem;cursor:pointer;margin-top:30px;clip-path:polygon(10% 0,100% 0,90% 100%,0 100%);transition:.3s cubic-bezier(.175,.885,.32,1.275)}.start-btn:hover{background:var(--gold);color:#000;transform:scale(1.1) rotate(-2deg)}.game-hud{position:absolute;top:0;left:0;right:0;padding:25px;display:flex;justify-content:space-between;z-index:100}.player-stats{width:220px}.player-stats.right{text-align:right}.label{font-size:14px;font-weight:700;margin-bottom:6px;text-shadow:2px 2px 4px #000}.bar-bg{height:12px;background:#0009;border:2px solid #fff;border-radius:6px;overflow:hidden}.bar-fill{height:100%;transition:width .3s ease-out}.hp .bar-fill{background:linear-gradient(90deg,#c0392b,#e74c3c)}.energy .bar-fill{background:linear-gradient(90deg,#2980b9,#3498db)}.energy{height:6px;margin-top:5px;border:1px solid #fff}.match-info{text-align:center}.current-score{font-size:2.5rem;font-weight:900;text-shadow:0 0 10px var(--gold)}.combo-count{color:var(--gold);font-size:1.2rem;font-weight:700;font-style:italic}.entity{position:absolute;width:140px;height:140px;z-index:50;transition:transform .1s}.sprite-container{width:100%;height:100%}.sprite-container img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(5px 10px 5px rgba(0,0,0,.5))}.char-svg{width:100%;height:100%;filter:drop-shadow(4px 8px 0 rgba(0,0,0,.3))}.player.walk{animation:walk-anim .5s infinite}.player.attack{animation:attack-anim .3s forwards}.player.hit{animation:hit-anim .2s;filter:brightness(2) contrast(2) sepia(1) hue-rotate(300deg)}.player.jump{transform:scaleX(var(--dir)) translateY(-10px)}@keyframes walk-anim{0%,to{transform:scaleX(var(--dir)) translateY(0)}50%{transform:scaleX(var(--dir)) translateY(-8px)}}@keyframes attack-anim{0%{transform:scaleX(var(--dir)) rotate(0)}50%{transform:scaleX(var(--dir)) rotate(15deg) translate(20px)}to{transform:scaleX(var(--dir)) rotate(0)}}@keyframes hit-anim{0%,to{transform:scaleX(var(--dir)) translate(0)}25%{transform:scaleX(var(--dir)) translate(-15px)}75%{transform:scaleX(var(--dir)) translate(10px)}}.effect-layer{position:absolute;pointer-events:none;z-index:60}.slash{width:200px;height:100px;animation:slash-fade .4s forwards}.slash img{width:100%;height:100%;object-fit:contain}.slash-svg{width:100%;height:100%;background:var(--blue);clip-path:polygon(0 40%,100% 0,80% 100%,0 60%);opacity:.6}.hit-ink{width:80px;height:80px;background:var(--ink);clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);animation:hit-pop .3s forwards}@keyframes slash-fade{0%{opacity:1;transform:scale(.5) translate(-50%,-50%)}to{opacity:0;transform:scale(1.5) translate(-50%,-50%)}}@keyframes hit-pop{0%{transform:scale(0);opacity:1}to{transform:scale(2);opacity:0}}.aura-fx{position:absolute;top:-10px;right:-10px;bottom:-10px;left:-10px;border:3px solid var(--blue);border-radius:50%;box-shadow:0 0 20px var(--blue);animation:aura-pulse .5s infinite}@keyframes aura-pulse{0%{transform:scale(.9);opacity:.8}to{transform:scale(1.3);opacity:0}}.loader-ink{width:60px;height:60px;border:5px solid var(--red);border-right-color:transparent;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}