@import"https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700;800;900&display=swap";:root{font-family:Space Grotesk,system-ui,Segoe UI,sans-serif;line-height:1.5;font-weight:500;background:linear-gradient(135deg,#0a0a1f,#1a0a2e,#0f0524);color:#fff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{margin:0;background:linear-gradient(135deg,#0a0a1f,#1a0a2e,#0f0524);min-height:100vh;overflow-x:hidden;position:relative}body:before{content:"";position:fixed;inset:0;background:radial-gradient(circle at 20% 50%,rgba(139,69,255,.15) 0%,transparent 50%),radial-gradient(circle at 80% 80%,rgba(255,41,117,.15) 0%,transparent 50%),radial-gradient(circle at 40% 20%,rgba(139,69,255,.1) 0%,transparent 50%);pointer-events:none;z-index:-1}h1{margin:0 0 12px;font-size:3.2rem;line-height:1.1;font-weight:900;background:linear-gradient(135deg,#8b45ff,#ff2975);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;filter:drop-shadow(0 0 40px rgba(139,69,255,.5));position:relative;z-index:1}p{margin:0}.page{max-width:1400px;margin:0 auto;padding:32px 20px 64px;color:#fff;background:linear-gradient(135deg,#0a0a1f,#1a0a2e,#0f0524);min-height:100vh}.hero{background:linear-gradient(135deg,#8b45ff26,#ff297526);border:2px solid rgba(139,69,255,.4);border-radius:24px;padding:40px;display:grid;grid-template-columns:1.2fr 1fr;gap:32px;box-shadow:0 0 40px #8b45ff4d,0 20px 60px #00000080,inset 0 0 60px #8b45ff1a;margin-bottom:32px;position:relative;overflow:hidden}.hero:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(139,69,255,.1) 0%,transparent 70%);animation:pulse 4s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1);opacity:.5}50%{transform:scale(1.1);opacity:.8}}.eyebrow{letter-spacing:.3em;text-transform:uppercase;font-size:13px;margin:0 0 8px;color:#ff2975;font-weight:800;text-shadow:0 0 10px rgba(255,41,117,.8);position:relative;z-index:1}.lede{color:#c8c8ff;max-width:540px;font-size:16px;line-height:1.6;position:relative;z-index:1}.cta-card{background:#141428cc;border-radius:20px;padding:24px;border:2px solid rgba(139,69,255,.5);display:grid;gap:16px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 0 30px #8b45ff66,inset 0 0 30px #8b45ff1a;position:relative;z-index:1}.cta-card label{display:grid;gap:8px;font-weight:700;font-size:14px;color:#fff;text-transform:uppercase;letter-spacing:.05em}.cta-card input{background:#0a0a1ecc;border:2px solid rgba(139,69,255,.3);border-radius:12px;padding:12px 16px;font-size:16px;color:#fff;transition:all .3s ease}.cta-card input:focus{outline:none;border-color:#8b45ff;box-shadow:0 0 20px #8b45ff80}.cta-actions{display:flex;gap:12px}button{background:linear-gradient(135deg,#8b45ff,#ff2975);color:#fff;padding:14px 24px;border-radius:16px;border:2px solid transparent;font-weight:800;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.05em;font-size:14px;box-shadow:0 0 20px #8b45ff80,0 4px 15px #0000004d;position:relative;overflow:hidden}button:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#ffffff4d;transform:translate(-50%,-50%);transition:width .6s,height .6s}button:hover:not(:disabled):before{width:300px;height:300px}button:disabled{opacity:.4;cursor:not-allowed;filter:grayscale(.5)}button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 0 30px #8b45ffcc,0 8px 25px #0006}button:active:not(:disabled){transform:translateY(0)}button.ghost{background:#1e1e3c99;border:2px solid rgba(139,69,255,.6);box-shadow:0 0 15px #8b45ff4d,0 4px 15px #0000004d}button.ghost:hover:not(:disabled){background:#8b45ff33;border-color:#8b45ff}button.accent{background:linear-gradient(135deg,#ff2975,#ff6b35);box-shadow:0 0 25px #ff297599,0 4px 15px #0000004d}button.accent:hover:not(:disabled){box-shadow:0 0 35px #ff2975e6,0 8px 25px #0006}.error{color:#ff6b6b;margin:0;font-weight:600;text-shadow:0 0 10px rgba(255,107,107,.5)}.game{display:grid;gap:24px}.topline{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;background:#141428cc;padding:20px;border-radius:20px;border:2px solid rgba(139,69,255,.4);align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 0 30px #8b45ff4d,inset 0 0 30px #8b45ff0d}.chip{background:linear-gradient(135deg,#8b45ff,#ff2975);color:#fff;padding:10px 16px;border-radius:14px;width:fit-content;font-weight:800;box-shadow:0 0 15px #8b45ff80,0 4px 10px #0000004d;text-shadow:0 2px 4px rgba(0,0,0,.3)}.invite input{width:100%;background:#0a0a1ecc;border:2px solid rgba(139,69,255,.3);border-radius:12px;padding:10px 14px;font-size:13px;color:#fff;transition:all .3s ease}.invite input:focus{outline:none;border-color:#8b45ff;box-shadow:0 0 15px #8b45ff66}.label{font-size:11px;color:#b8b8ff;text-transform:uppercase;letter-spacing:.15em;margin:0 0 6px;font-weight:700}.controls{display:grid;gap:12px}.control-card{background:#141428e6;border:2px solid rgba(139,69,255,.5);border-radius:20px;padding:20px;display:grid;gap:16px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 0 30px #8b45ff66,inset 0 0 30px #8b45ff1a}.control-card>p{font-size:16px;font-weight:600;color:#fff;margin:0}.control-actions{display:flex;flex-wrap:wrap;gap:12px}.control-card select{background:#0a0a1ecc;border:2px solid rgba(139,69,255,.4);border-radius:12px;padding:12px 16px;color:#fff;font-weight:600;transition:all .3s ease;cursor:pointer}.control-card select:focus{outline:none;border-color:#8b45ff;box-shadow:0 0 20px #8b45ff80}.control-card select option{background:#1a1a3e;color:#fff}.players{display:grid;gap:16px}.player{background:#141428b3;border:2px solid rgba(139,69,255,.3);border-radius:20px;padding:20px;display:grid;gap:16px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 0 20px #8b45ff33,inset 0 0 20px #8b45ff0d;transition:all .4s ease}.player.turn{border-color:#ff2975;box-shadow:0 0 40px #ff297599,0 8px 30px #0006,inset 0 0 30px #ff29751a;transform:scale(1.02);animation:turnGlow 2s ease-in-out infinite}@keyframes turnGlow{0%,to{box-shadow:0 0 40px #ff297599,0 8px 30px #0006,inset 0 0 30px #ff29751a}50%{box-shadow:0 0 60px #ff2975e6,0 8px 30px #0006,inset 0 0 40px #ff297533}}.player-header{display:flex;align-items:center;justify-content:space-between}.player-header .label{color:#fff;font-size:14px;margin:0 0 4px}.status{margin:0;color:#ff2975;font-weight:800;text-transform:uppercase;font-size:13px;text-shadow:0 0 10px rgba(255,41,117,.8)}.scores{display:flex;gap:16px;font-weight:800;font-size:16px}.scores span{background:#8b45ff4d;padding:8px 16px;border-radius:12px;border:2px solid rgba(139,69,255,.5);box-shadow:0 0 15px #8b45ff4d}.card-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px}.card{border:3px solid;border-radius:16px;padding:16px;background:#0a0a1ee6;display:grid;gap:8px;min-height:100px;position:relative;transition:all .3s ease;box-shadow:0 0 20px #00000080,inset 0 0 20px #ffffff0d}.card:before{content:"";position:absolute;inset:0;border-radius:13px;background:linear-gradient(135deg,rgba(255,255,255,.1) 0%,transparent 100%);pointer-events:none}.card:hover{transform:translateY(-4px) scale(1.05);box-shadow:0 0 30px currentColor,0 10px 30px #0009,inset 0 0 30px #ffffff1a}.card.highlight{background:#8b000066;border-color:#ff6b6b;box-shadow:0 0 30px #ff6b6bcc,0 6px 20px #d9252580;animation:errorPulse 1s ease-in-out infinite}@keyframes errorPulse{0%,to{box-shadow:0 0 30px #ff6b6bcc,0 6px 20px #d9252580}50%{box-shadow:0 0 50px #ff6b6b,0 6px 20px #d92525cc}}.card-label{font-size:28px;font-weight:900;text-shadow:0 0 10px currentColor;position:relative;z-index:1}.card-meta{color:#fffc;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;position:relative;z-index:1}.card.faded{opacity:.5;filter:grayscale(.5)}.note{color:#c8c8ff;margin:0;font-weight:500;font-size:14px}.last-draw{display:grid;gap:8px}.summary{background:#141428f2;color:#fff;padding:24px;border-radius:24px;border:2px solid rgba(139,69,255,.6);box-shadow:0 0 40px #8b45ff80,inset 0 0 40px #8b45ff1a;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px)}.summary h3{margin:0 0 20px;font-size:24px;font-weight:900;text-transform:uppercase;letter-spacing:.1em;background:linear-gradient(135deg,#8b45ff,#ff2975);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:0 0 30px rgba(139,69,255,.5)}.summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px}.summary-card{background:#0a0a1ecc;border-radius:16px;padding:16px;border:2px solid rgba(139,69,255,.4);box-shadow:0 0 20px #8b45ff4d,inset 0 0 20px #8b45ff0d;transition:all .3s ease}.summary-card:hover{transform:translateY(-4px);border-color:#8b45ff;box-shadow:0 0 30px #8b45ff99,inset 0 0 30px #8b45ff1a}.summary-card .label{color:#fff;font-size:13px;margin-bottom:8px}.summary-card p{margin:6px 0;font-size:16px;font-weight:700;color:#c8c8ff}@media(max-width:860px){.hero{grid-template-columns:1fr;padding:24px}.card-row{grid-template-columns:repeat(auto-fit,minmax(110px,1fr))}.summary-grid{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}.topline{grid-template-columns:1fr 1fr}}