*{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:Arial,Helvetica,sans-serif;background:radial-gradient(circle at top left,rgba(255,204,0,.18),transparent 30%),radial-gradient(circle at bottom right,rgba(0,255,204,.12),transparent 30%),#101018;color:white}.intro-page{display:grid;place-items:center;padding:30px;overflow:hidden}.stars{position:fixed;inset:0;background-image:radial-gradient(white 1px,transparent 1px),radial-gradient(white 1px,transparent 1px);background-size:70px 70px,120px 120px;background-position:0 0,30px 50px;opacity:.12;animation:drift 18s linear infinite}@keyframes drift{from{transform:translateY(0)}to{transform:translateY(80px)}}.card{position:relative;background:rgba(27,27,43,.92);border:1px solid rgba(255,255,255,.15);box-shadow:0 25px 60px rgba(0,0,0,.45);border-radius:28px}.hero{width:min(900px,95vw);padding:55px;text-align:center}.badge{display:inline-block;padding:10px 18px;border-radius:999px;background:rgba(255,204,0,.15);color:#ffcc00;border:1px solid rgba(255,204,0,.35);font-weight:bold;letter-spacing:1px}h1{font-size:clamp(36px,6vw,68px);margin:22px 0;color:#ffcc00}.lead{font-size:23px;line-height:1.55;color:#e8e8f0}.info-grid,.result{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:35px 0}.info-grid div,.result div,.stat{background:rgba(255,255,255,.08);border-radius:18px;padding:20px}.info-grid strong,.result strong{display:block;color:#00ffcc;font-size:32px}.info-grid span,.result span{color:#d7d7e0}.btn{display:inline-block;text-decoration:none;border:0;border-radius:18px;padding:18px 32px;background:linear-gradient(135deg,#ffcc00,#ff7b00);color:#1b1600;font-weight:bold;font-size:24px;cursor:pointer;box-shadow:0 10px 25px rgba(255,174,0,.35);transition:transform .15s ease,filter .15s ease}.btn:hover{transform:translateY(-2px) scale(1.03);filter:brightness(1.08)}.game-layout{min-height:100vh;display:grid;grid-template-columns:310px 1fr}.sidebar{background:rgba(0,0,0,.32);border-right:1px solid rgba(255,255,255,.12);padding:30px}.logo{font-size:32px;color:#ffcc00;font-weight:bold;margin-bottom:30px}.progress{height:26px;background:rgba(255,255,255,.1);border-radius:99px;overflow:hidden;margin:18px 0 28px}.progress-bar{height:100%;background:linear-gradient(90deg,#00ffcc,#ffcc00);border-radius:99px;transition:width .3s ease}.stat{margin:12px 0;font-size:20px}.small-link{display:block;margin-top:30px;color:#aaa;font-size:14px}.question-card{align-self:center;justify-self:center;width:min(850px,92%);padding:45px;text-align:center}.room-title{color:#00ffcc;font-size:26px;font-weight:bold}.question-card h1{color:white;font-size:clamp(30px,4vw,48px);line-height:1.25}input{width:min(420px,90%);padding:18px 22px;border:2px solid rgba(255,255,255,.18);border-radius:18px;background:rgba(255,255,255,.09);color:white;text-align:center;font-size:28px;outline:none;margin-bottom:18px}input:focus{border-color:#00ffcc;box-shadow:0 0 0 4px rgba(0,255,204,.12)}.message,.hint{margin:24px auto 0;max-width:650px;padding:18px 22px;border-radius:18px;font-size:22px}.error{background:rgba(255,0,70,.12);border:1px solid rgba(255,0,70,.4);color:#ff6b8a;animation:shake .25s linear}.hint{background:rgba(0,255,204,.1);border:1px solid rgba(0,255,204,.35);color:#b8fff3}.note{margin-top:28px;color:#9e9ead;font-size:15px}@keyframes shake{0%{transform:translateX(-6px)}25%{transform:translateX(6px)}50%{transform:translateX(-4px)}75%{transform:translateX(4px)}100%{transform:translateX(0)}}@media(max-width:800px){.game-layout{grid-template-columns:1fr}.sidebar{border-right:none;border-bottom:1px solid rgba(255,255,255,.12)}.info-grid,.result{grid-template-columns:1fr}.hero{padding:30px}}