*{box-sizing:border-box;margin:0;padding:0}:root{color-scheme:dark;--pink: #ff2d9b;--pink-bright: #ff44aa;--pink-glow: rgba(255, 45, 155, .35);--pink-muted: rgba(255, 45, 155, .2);--cyan: #00e5ff;--cyan-muted: rgba(0, 229, 255, .25);--bg: #000000;--card-bg: rgba(10, 10, 10, .75);--surface: rgba(20, 20, 20, .6);--border: rgba(255, 45, 155, .3);--text: #f0f0f0;--text-muted: rgba(240, 240, 240, .55)}body{font-family:Rajdhani,Segoe UI,sans-serif;background:var(--bg);min-height:100vh;color:var(--text)}.mono{font-family:Share Tech Mono,Fira Mono,monospace}.container{max-width:1200px;margin:0 auto;padding:2rem}.card{background:var(--card-bg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:2px solid var(--border);border-radius:1rem;padding:2rem;box-shadow:0 0 40px -10px var(--pink-glow);margin-bottom:2rem}.header{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem}.icon-circle{width:3rem;height:3rem;background:linear-gradient(135deg,var(--pink) 0%,var(--cyan) 100%);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.5rem}h1{font-size:2rem;background:linear-gradient(90deg,var(--pink-bright) 0%,var(--cyan) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}h2{color:var(--pink-bright);margin-bottom:1rem}h3{color:var(--pink-bright);margin-bottom:.5rem}.intro-text{color:var(--text-muted);line-height:1.7;margin-bottom:1.5rem;font-size:1.1rem}.feature-box{border-left:4px solid var(--border);padding-left:1rem;padding-top:.5rem;padding-bottom:.5rem;background:var(--surface);margin-bottom:1rem}.btn{width:100%;padding:1rem;font-size:1rem;font-weight:600;border:2px solid var(--pink);border-radius:.5rem;cursor:pointer;transition:all .3s;background:transparent;color:var(--pink);box-shadow:0 0 20px -5px var(--pink-glow)}.btn.inline{width:auto}.btn.secondary{background:transparent;border:1px solid var(--border);color:var(--text-muted);box-shadow:none}.btn:hover{background:var(--pink);color:#000;box-shadow:0 0 30px -5px var(--pink-glow);transform:translateY(-2px)}.btn.secondary:hover{background:var(--pink-muted);color:var(--pink-bright);border-color:var(--pink)}.btn:disabled{background:transparent;border-color:#333;color:#555;cursor:not-allowed;box-shadow:none;transform:none}.progress-bar{width:100%;height:.5rem;background:#1a1a1a;border-radius:1rem;overflow:hidden;margin-bottom:2rem}.progress-fill{height:100%;background:linear-gradient(90deg,var(--pink) 0%,var(--cyan) 100%);transition:width .5s}.progress-text{display:flex;justify-content:space-between;margin-bottom:.5rem;font-size:.9rem}.question-card{border:1px solid var(--border);border-radius:.75rem;padding:1.5rem;background:var(--surface);margin-bottom:1.5rem;transition:border-color .3s,opacity .6s cubic-bezier(.4,0,.2,1),transform .6s cubic-bezier(.4,0,.2,1);opacity:0;transform:translateY(20px)}.question-card.active{opacity:1;transform:translateY(0)}.question-text{color:var(--text);font-size:1.1rem;margin-bottom:1rem}.question-number{color:var(--pink-bright);font-family:Share Tech Mono,monospace;margin-right:.5rem}.answer-buttons{display:flex;gap:.5rem;margin-bottom:.5rem}.answer-btn{flex:1;padding:.75rem;border:1px solid #333;background:var(--surface);color:#aaa;border-radius:.5rem;cursor:pointer;font-weight:600;transition:all .3s}.answer-btn:hover{background:#ff2d9b14;border-color:var(--border);color:var(--text)}.answer-btn.selected{background:var(--pink);color:#000;border-color:transparent;box-shadow:0 0 20px -5px var(--pink-glow)}.answer-labels{display:flex;justify-content:space-between;font-size:.75rem;color:#555}.score-item{display:flex;justify-content:space-between;align-items:center;padding:.75rem 0;border-bottom:1px solid rgba(255,45,155,.1)}.score-label{color:#bbb;text-transform:capitalize;width:180px}.score-bar{flex:1;height:.5rem;background:#1a1a1a;border-radius:1rem;overflow:hidden;margin:0 1rem}.score-bar-fill{height:100%;background:linear-gradient(90deg,var(--pink) 0%,var(--cyan) 100%);border-radius:1rem}.score-value{color:var(--pink-bright);font-weight:600;min-width:3rem;text-align:right}.grid{display:grid;gap:1.5rem}.grid.two{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.game-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem}.game-card{border:1px solid #333;border-radius:.75rem;padding:1.5rem;background:var(--surface);opacity:.8}.game-card.completed{border-color:#22c55e80;background:#14532d26;opacity:1}.game-card.locked{border-color:#ff2d9b4d;background:#1414144d;opacity:.6}.game-header{display:flex;justify-content:space-between;align-items:start;margin-bottom:.75rem}.game-status{font-size:.75rem;font-family:Share Tech Mono,monospace;color:#555}.alert{padding:1rem;border-radius:.5rem;margin-bottom:1.5rem;font-size:.9rem}.alert-success{background:#14532d26;border:1px solid rgba(34,197,94,.5);color:#86efac}.alert-error{background:#7f1d1d26;border:1px solid rgba(239,68,68,.5);color:#fca5a5}.alert-info{background:var(--pink-muted);border:1px solid var(--border);color:var(--pink-bright)}.input{width:100%;padding:.75rem 1rem;border-radius:.5rem;border:1px solid var(--border);background:#0f0f0fcc;color:var(--text);margin-bottom:1rem}.input:focus{outline:none;border-color:var(--pink);box-shadow:0 0 15px -5px var(--pink-glow)}.range{width:100%}.row{display:flex;gap:1rem;align-items:center}.space-between{display:flex;justify-content:space-between;align-items:center}.tag{padding:.2rem .6rem;border-radius:999px;border:1px solid var(--border);color:var(--pink-bright);font-size:.75rem}.keycard-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-bottom:1.5rem}.keycard{border-radius:.75rem;padding:1.5rem 1.25rem;text-align:center;transition:all .3s;position:relative;overflow:hidden}.keycard-icon{font-size:2.5rem;margin-bottom:.5rem;display:block}.keycard-label{font-family:Share Tech Mono,monospace;font-size:.7rem;text-transform:uppercase;letter-spacing:.15em;margin-bottom:.35rem}.keycard-name{font-weight:600;font-size:1rem;margin-bottom:.25rem}.keycard-status{font-size:.7rem;font-family:Share Tech Mono,monospace;letter-spacing:.08em}.keycard.purple{border:2px solid rgba(168,85,247,.6);background:#a855f71a;box-shadow:0 0 35px -8px #a855f766}.keycard.purple .keycard-name{color:#c084fc}.keycard.purple .keycard-label{color:#c084fcb3}.keycard.purple .keycard-status{color:#a855f7}.keycard.pink{border:2px solid rgba(255,45,155,.2);background:#ff2d9b0a;opacity:.45}.keycard.pink .keycard-name{color:#666}.keycard.pink .keycard-label{color:#444}.keycard.pink .keycard-status{color:#555}.keycard.blue{border:2px solid rgba(0,229,255,.15);background:#00e5ff08;opacity:.35}.keycard.blue .keycard-name{color:#555}.keycard.blue .keycard-label{color:#3a3a3a}.keycard.blue .keycard-status{color:#444}.landing-heading{font-size:2.2rem;font-weight:700;text-align:center;margin-bottom:.5rem;background:linear-gradient(90deg,#c084fc 0%,var(--pink-bright) 50%,var(--cyan) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.landing-sub{text-align:center;color:var(--text-muted);font-size:1.05rem;line-height:1.6;max-width:520px;margin:0 auto 2rem}.btn.purple-cta{background:linear-gradient(90deg,#7c3aed,#a855f7);border:2px solid #a855f7;color:#fff;font-size:1.15rem;padding:1.1rem 2rem;box-shadow:0 0 30px -5px #a855f773}.btn.purple-cta:hover{background:linear-gradient(90deg,#a855f7,#c084fc);box-shadow:0 0 45px -5px #a855f799;transform:translateY(-2px)}.bridge-messages{max-height:420px;overflow-y:auto;margin-bottom:1rem;padding:.5rem;border:1px solid rgba(255,45,155,.1);border-radius:.75rem;background:#0a0a0a80}.bridge-bubble{padding:.75rem 1rem;border-radius:.75rem;margin-bottom:.5rem;max-width:85%}.bridge-bubble-user{background:var(--pink-muted);border:1px solid var(--border);margin-left:auto}.bridge-bubble-assistant{background:var(--cyan-muted);border:1px solid rgba(0,229,255,.2);margin-right:auto}.bridge-role{display:block;font-size:.65rem;text-transform:uppercase;color:#555;margin-bottom:.25rem;letter-spacing:.1em}.bridge-typing{color:#555;font-style:italic}@media(max-width:768px){.container{padding:1rem}.answer-buttons{flex-wrap:wrap}.answer-btn{flex:1 1 45%}.row{flex-direction:column;align-items:stretch}}