:root{--color-void: #050608;--color-void-light: #111218;--color-hull: #2c2f3a;--color-text: #e0e6ed;--color-text-dim: #94a3b8;--color-neon-blue: #00f0ff;--color-neon-red: #ff2a2a;--color-neon-gold: #ffbd00;--color-neon-green: #00ff9d;--font-main: "Inter", system-ui, sans-serif;--border-radius: 8px;--transition-speed: .2s}body{margin:0;background-color:var(--color-void);background-image:radial-gradient(circle at 50% 50%,#151624,#050608);color:var(--color-text);font-family:var(--font-main);overflow:hidden;-webkit-user-select:none;user-select:none}#app{width:100vw;height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center}h1,h2,h3,h4{margin:0 0 10px;color:var(--color-text);text-transform:uppercase;letter-spacing:2px}h1{color:var(--color-neon-blue);text-shadow:0 0 10px rgba(0,240,255,.3)}button{background:var(--color-void-light);border:1px solid var(--color-hull);color:var(--color-text);padding:.6rem 1.2rem;border-radius:var(--border-radius);cursor:pointer;transition:all var(--transition-speed);font-weight:600;text-transform:uppercase;letter-spacing:1px}button:hover:not(:disabled){border-color:var(--color-neon-blue);box-shadow:0 0 10px #00f0ff4d;background:#1a1c25;color:var(--color-neon-blue)}button:disabled{opacity:.5;cursor:not-allowed}#main-view{width:95%!important;max-width:1400px;height:80vh!important;background:#14161e99;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--color-hull);border-radius:var(--border-radius);box-shadow:0 0 20px #00000080;overflow:hidden}#map-container{background:#0a0b1080}#game-container{position:relative;background:radial-gradient(circle at center,#1a1c25,#0a0b12);display:flex;flex-direction:column}#scene-content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px}#hand-container{min-height:220px;padding:20px;display:flex;justify-content:center;gap:15px;background:linear-gradient(to top,rgba(0,0,0,.8),transparent)}.card{width:140px;height:200px;background:#1e212b;border:1px solid var(--color-neon-blue);border-radius:10px;padding:10px;display:flex;flex-direction:column;justify-content:space-between;font-size:.9em;cursor:pointer;transition:transform .2s,box-shadow .2s;-webkit-user-select:none;user-select:none;position:relative}.card small{color:var(--color-text-dim);font-size:.8em;text-transform:uppercase}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--color-void)}::-webkit-scrollbar-thumb{background:var(--color-hull);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#4b5563}@keyframes pulse{0%{transform:scale(1);box-shadow:0 0 #00f0ff00}50%{transform:scale(1.05);box-shadow:0 0 10px #00f0ff80}to{transform:scale(1);box-shadow:0 0 #00f0ff00}}@keyframes shake{0%{transform:translate(1px,1px) rotate(0)}10%{transform:translate(-1px,-2px) rotate(-1deg)}20%{transform:translate(-3px) rotate(1deg)}30%{transform:translate(3px,2px) rotate(0)}40%{transform:translate(1px,-1px) rotate(1deg)}50%{transform:translate(-1px,2px) rotate(-1deg)}60%{transform:translate(-3px,1px) rotate(0)}70%{transform:translate(3px,1px) rotate(-1deg)}80%{transform:translate(-1px,-1px) rotate(1deg)}90%{transform:translate(1px,2px) rotate(0)}to{transform:translate(1px,-2px) rotate(-1deg)}}.anim-pulse{animation:pulse 2s infinite}.anim-shake{animation:shake .5s}.card:hover{transform:translateY(-10px) scale(1.02);box-shadow:0 0 15px var(--color-neon-blue);z-index:10}
