:root{--bg:#1e272e;--layer:#0f0c29e6;--accent:#54a0ff;--p1:#2ecc71;--p2:#e74c3c;--text:#fff}body{background-color:var(--bg);color:var(--text);justify-content:center;align-items:center;height:100vh;margin:0;padding:0;font-family:Nunito,sans-serif;display:flex;overflow:hidden}#back-link{color:#fff;z-index:100;background:#ffffff1a;border:1px solid #fff3;border-radius:10px;padding:10px 15px;font-weight:700;text-decoration:none;position:fixed;top:20px;left:20px}#game-container{background:linear-gradient(135deg,#0f0c29 0%,#302b63 50%,#24243e 100%);flex-direction:column;width:100%;max-width:450px;height:100vh;display:flex;position:relative;overflow:hidden}#battle-scene{justify-content:space-around;align-items:center;height:40%;padding:20px;display:flex}.fighter-p1,.fighter-p2{flex-direction:column;align-items:center;font-size:5rem;display:flex}.vs-text{color:#f1c40f;text-shadow:0 0 10px #f1c40f;font-family:Bungee,cursive;font-size:2rem}.hp-bar{background:#34495e;border-radius:5px;width:120px;height:10px;margin-top:10px;overflow:hidden}.hp-fill{height:100%;transition:width .3s cubic-bezier(.4,0,.2,1)}#p1-hp{background:var(--p1)}#p2-hp{background:var(--p2)}#rhythm-zone{background:#0000004d;flex-grow:1;justify-content:center;display:flex;position:relative}.hit-line{background:var(--accent);width:90%;height:4px;box-shadow:0 0 15px var(--accent);z-index:5;position:absolute;bottom:200px}#notes-container{position:absolute;inset:0;overflow:hidden}.note{background:#fff;border-radius:12px;justify-content:center;align-items:center;width:60px;height:60px;font-size:2rem;font-weight:900;display:flex;position:absolute;left:50%;transform:translate(-50%);box-shadow:0 4px 10px #0003}.note.up{color:#54a0ff}.note.down{color:#5f27cd}.note.left{color:#ff9f43}.note.right{color:#ee5253}#feedback{text-align:center;color:#fff;text-shadow:0 0 10px #000;pointer-events:none;opacity:0;width:100%;font-family:Bungee,cursive;font-size:2.5rem;transition:opacity .1s,transform .1s;position:absolute;bottom:280px}#feedback.show{opacity:1;transform:translateZ(0)scale(1.2)}#combo{text-align:center;color:#f1c40f;width:100%;font-family:Bungee,cursive;font-size:1.5rem;position:absolute;bottom:120px}#touch-controls{z-index:50;background:linear-gradient(#0000,#00000080);justify-content:space-around;align-items:center;height:120px;padding:0 10px 20px;display:flex;position:fixed;bottom:0;left:0;right:0}.touch-btn{color:#fff;cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;background:#ffffff1a;border:2px solid #fff3;border-radius:50%;justify-content:center;align-items:center;width:70px;height:70px;font-size:1.5rem;transition:transform .1s,background .1s,border-color .1s;display:flex}.touch-btn:active{background:var(--accent);box-shadow:0 0 20px var(--accent);border-color:#fff;transform:scale(.9)}.overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:20;text-align:center;background:#000000e6;flex-direction:column;justify-content:center;align-items:center;padding:20px;display:flex;position:absolute;inset:0}.overlay h1{color:var(--accent);margin-bottom:20px;font-family:Bungee,cursive;font-size:2.5rem}.main-btn{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:50px;padding:15px 40px;font-size:1.5rem;font-weight:900;transition:transform .2s;box-shadow:0 5px 15px #54a0ff66}.main-btn:hover{transform:translateY(-5px)scale(1.05)}.hidden{display:none}