@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');
:root{--bg:#090b16;--panel:#12172b;--line:#303653;--text:#f4f6ff;--muted:#969fbc;--purple:#b49aff;--pink:#f4a1d0;--cyan:#67e8f9}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 50% -15%,#30264f,transparent 55%),var(--bg);color:var(--text);font-family:'DM Sans',sans-serif}.app{max-width:1000px;margin:auto;padding:0 22px}header{height:75px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #ffffff18}.brand{font:700 15px 'Space Grotesk';color:white;text-decoration:none;letter-spacing:2px}.brand b{display:inline-grid;place-items:center;background:linear-gradient(130deg,var(--purple),var(--pink));color:#160f27;width:34px;height:34px;border-radius:10px;font-size:23px;margin-right:8px}.brand span{color:var(--purple)}header small{color:var(--muted);letter-spacing:2px;font-size:10px}.hero{text-align:center;padding:55px 0 35px}.hero label{font-size:10px;letter-spacing:2px;color:var(--purple);border:1px solid #b49aff55;padding:8px 12px;border-radius:30px}.hero h1{font:700 clamp(43px,7vw,70px)/1.05 'Space Grotesk';letter-spacing:-3px;margin:25px 0 12px}.hero em{font-style:normal;background:linear-gradient(90deg,var(--purple),var(--pink),var(--cyan));color:transparent;background-clip:text}.hero p,.panel>p{color:var(--muted);line-height:1.6;font-size:14px}.grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;max-width:850px;margin:0 auto 65px}.panel{background:linear-gradient(145deg,#171d35,#101426);border:1px solid var(--line);border-radius:19px;padding:25px;box-shadow:0 15px 50px #0003}.symbol{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:#b49aff20;color:var(--purple);font-size:23px}.symbol.cyan{background:#67e8f920;color:var(--cyan)}h2{font:600 22px 'Space Grotesk';margin:16px 0 5px}.panel>p{margin:0 0 20px}form label{display:block;font-size:12px;color:#cbd0e3;margin:14px 0 7px}input,select{width:100%;background:#0a0e1d;border:1px solid var(--line);border-radius:10px;padding:13px;color:white;outline:none}input:focus,select:focus{border-color:var(--purple)}input::placeholder{color:#737c9b}button{cursor:pointer}form button{width:100%;border:0;border-radius:10px;padding:14px;margin-top:19px;background:linear-gradient(100deg,var(--purple),var(--pink));color:#171025;font-weight:700}.alt{background:#173342;color:var(--cyan);border:1px solid #67e8f955}.code{text-align:center;letter-spacing:6px;font:700 20px 'Space Grotesk';text-transform:uppercase}.public{border-top:1px solid var(--line);margin-top:22px;padding-top:15px;font-size:12px}.public>button{float:right;background:none;border:0;color:var(--cyan)}#publicRooms{clear:both;padding-top:12px;color:var(--muted)}.room{display:flex;align-items:center;justify-content:space-between;padding:10px;margin-top:7px;background:#0a0e1d;border:1px solid var(--line);border-radius:9px}.room button{background:#173342;color:var(--cyan);border:0;padding:8px;border-radius:7px}.gamebar{display:flex;justify-content:space-between;align-items:center;margin:25px 0;color:var(--muted);font-size:12px}.gamebar a{color:var(--muted);text-decoration:none}.gamebar strong{color:var(--cyan);letter-spacing:3px}.gamebar button{background:#202741;color:white;border:1px solid var(--line);border-radius:6px}.game-panel{max-width:760px;margin:25px auto 65px}.tag{display:inline-block;padding:7px 10px;border:1px solid #b49aff55;border-radius:30px;color:var(--purple);font-size:10px;margin-right:7px}.question{margin:22px 0;padding:27px 18px;text-align:center;background:radial-gradient(ellipse at top,#39305f,#191b36);border:1px solid #b49aff55;border-radius:15px}.question small{color:var(--purple);letter-spacing:2px}.question h2{font-size:clamp(22px,4vw,32px);line-height:1.25}.players{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:18px 0}.player{display:flex;align-items:center;gap:10px;text-align:left;background:#0a0e1d;border:1px solid var(--line);border-radius:10px;padding:11px;color:white}.player.pick{cursor:pointer}.player.pick:hover,.player.selected{border-color:var(--cyan);background:#67e8f911}.avatar{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:10px;background:linear-gradient(130deg,var(--purple),var(--pink));color:#171025;font-weight:bold}.pmeta{font-size:12px;font-weight:700}.pmeta small{display:block;color:var(--muted);font-weight:400;margin-top:3px}.votes{margin-left:auto;color:var(--cyan);font-size:11px}.actions{display:flex;gap:10px;margin-top:18px}.actions button{flex:1;padding:13px;border:0;border-radius:10px;background:linear-gradient(100deg,var(--purple),var(--pink));color:#171025;font-weight:700}.actions .ghost{background:#ffffff0b;color:#ddd;border:1px solid var(--line)}.note{text-align:center;color:var(--muted);font-size:12px;margin:15px}.score{display:flex;gap:12px;padding:12px;background:#0a0e1d;border:1px solid var(--line);border-radius:9px;margin:8px 0}.score b{color:var(--purple)}.score span{flex:1}footer{display:flex;justify-content:center;padding:22px;border-top:1px solid #ffffff15;color:var(--muted);font-size:10px;letter-spacing:1px}#toast{position:fixed;bottom:20px;left:50%;transform:translate(-50%,20px);opacity:0;transition:.2s;background:#282e49;border:1px solid #505a7c;padding:12px 17px;border-radius:10px;font-size:13px;z-index:5}#toast.show{opacity:1;transform:translate(-50%,0)}@media(max-width:700px){.app{padding:0 14px}.grid{grid-template-columns:1fr}.hero{padding:43px 0 28px}.panel{padding:21px}.players{grid-template-columns:1fr}.actions{flex-direction:column}header small{font-size:8px}footer{text-align:center}}