*{box-sizing:border-box;margin:0;padding:0}:root{--gold: #E4A853;--gold-light: #F5C97A;--ink: #0D0D0D;--surface: #141414;--surface2: #1E1E1E;--surface3: #252525;--border: rgba(228, 168, 83, .2);--text: #F0EDE6;--muted: #888580;--green: #4CAF7D;--red: #ff6b6b}html,body,#root{height:100%;overflow:hidden}body{background:var(--surface);color:var(--text);font-family:Segoe UI,system-ui,sans-serif}.app{height:100vh;display:flex;flex-direction:column;overflow:hidden}.nav{display:flex;align-items:center;justify-content:space-between;padding:1.1rem 2.5rem;border-bottom:.5px solid var(--border);background:#141414f2;flex-shrink:0}.logo{display:flex;align-items:center;gap:10px}.logo-icon{width:32px;height:32px;background:var(--gold);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:16px}.logo-text{font-size:1.2rem;font-weight:800;color:var(--text);letter-spacing:-.5px}.gold{color:var(--gold)}.outline{-webkit-text-stroke:1.5px var(--gold);color:transparent}.btn-primary{background:var(--gold);color:var(--ink);border:none;padding:.55rem 1.25rem;border-radius:8px;font-size:.875rem;font-weight:700;cursor:pointer;transition:opacity .2s,transform .2s}.btn-primary:hover:not(:disabled){opacity:.85;transform:translateY(-1px)}.btn-primary.large{padding:.8rem 1.8rem;font-size:1rem;border-radius:10px}.btn-secondary{background:transparent;color:var(--text);border:.5px solid rgba(240,237,230,.25);padding:.55rem 1.25rem;border-radius:8px;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s}.btn-secondary:hover{border-color:var(--gold);color:var(--gold)}.btn-secondary.large{padding:.8rem 1.8rem;font-size:1rem;border-radius:10px}.wallet-wrapper{display:flex;flex-direction:column;align-items:flex-end;gap:6px}.wallet-connected{display:flex;align-items:center;gap:10px}.wallet-info{display:flex;align-items:center;gap:8px;background:var(--surface2);border:.5px solid var(--border);border-radius:100px;padding:6px 14px;font-size:.82rem}.wallet-dot{width:7px;height:7px;background:var(--green);border-radius:50%;animation:pulse 2s infinite}.wallet-key{color:var(--text);font-weight:600;font-family:monospace;font-size:.85rem}.wallet-divider{color:var(--border)}.wallet-balance{color:var(--gold);font-weight:700}.btn-disconnect{background:transparent;color:var(--muted);border:.5px solid rgba(136,133,128,.3);padding:6px 12px;border-radius:8px;font-size:.78rem;cursor:pointer;transition:all .2s}.btn-disconnect:hover{color:var(--red);border-color:var(--red)}.btn-loading{display:flex;align-items:center;gap:8px}.spinner{width:14px;height:14px;border:2px solid var(--ink);border-top-color:transparent;border-radius:50%;animation:spin .7s linear infinite;display:inline-block}.spinner-sm{width:11px;height:11px;border:2px solid currentColor;border-top-color:transparent;border-radius:50%;animation:spin .7s linear infinite;display:inline-block;margin-right:6px;vertical-align:middle}@keyframes spin{to{transform:rotate(360deg)}}.wallet-ready{margin-top:1rem;font-size:.85rem;color:var(--green);font-weight:500}.main{flex:1;display:flex;flex-direction:column;justify-content:space-evenly;padding:0 2.5rem;max-width:960px;width:100%;margin:0 auto;overflow:hidden}.hero{text-align:center}.hero-badge{display:inline-flex;align-items:center;gap:8px;background:#e4a8531a;border:.5px solid var(--border);border-radius:100px;padding:5px 14px;font-size:.78rem;color:var(--gold-light);margin-bottom:1.2rem;font-weight:500}.badge-dot{width:6px;height:6px;background:var(--gold);border-radius:50%;display:inline-block;animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.3}}h1{font-size:clamp(2.2rem,5vw,3.8rem);font-weight:800;line-height:1.05;letter-spacing:-2px;color:var(--text);margin-bottom:1rem}.hero-sub{font-size:1rem;color:var(--muted);max-width:480px;margin:0 auto 1.5rem;line-height:1.6}.hero-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}.stats{display:flex;justify-content:center;gap:3rem;padding:1.5rem 2rem;border:.5px solid var(--border);border-radius:16px;background:var(--surface2);flex-wrap:wrap}.stat{text-align:center}.stat-num{font-size:1.6rem;font-weight:800;color:var(--gold)}.stat-label{font-size:.72rem;color:var(--muted);margin-top:2px;text-transform:uppercase;letter-spacing:1px}.how-section{text-align:center}.section-label{font-size:.72rem;color:var(--gold);text-transform:uppercase;letter-spacing:2px;font-weight:600;margin-bottom:1.2rem}.steps{display:flex;gap:1.5rem;justify-content:center;flex-wrap:wrap}.step{flex:1;min-width:160px;max-width:220px;display:flex;flex-direction:column;align-items:center;text-align:center;background:var(--surface2);border:.5px solid var(--border);border-radius:14px;padding:1.25rem 1rem;transition:border-color .2s}.step:hover{border-color:var(--gold)}.step-done{border-color:var(--green)!important}.step-done .step-num{border-color:var(--green);color:var(--green)}.step-num{width:36px;height:36px;border:1.5px solid var(--gold);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.9rem;color:var(--gold);margin-bottom:.75rem}.step-title{font-weight:600;font-size:.9rem;color:var(--text);margin-bottom:.35rem}.step-desc{font-size:.78rem;color:var(--muted);line-height:1.5}.quiz-container{flex:1;display:flex;align-items:center;justify-content:center;padding:1.5rem;overflow:hidden}.quiz-start-card{background:var(--surface2);border:.5px solid var(--border);border-radius:20px;padding:3rem 2.5rem;text-align:center;max-width:420px;width:100%}.quiz-start-icon{font-size:3rem;margin-bottom:1rem}.quiz-start-title{font-size:1.6rem;font-weight:800;color:var(--text);margin-bottom:.5rem;letter-spacing:-.5px}.quiz-start-sub{font-size:.875rem;color:var(--muted);margin-bottom:1.5rem;line-height:1.6}.quiz-start-reward{display:flex;align-items:center;justify-content:space-between;background:#e4a85314;border:.5px solid var(--border);border-radius:10px;padding:.75rem 1.25rem;margin-bottom:1.5rem}.reward-label{font-size:.82rem;color:var(--muted)}.reward-amount{font-size:1.2rem;font-weight:800;color:var(--gold)}.quiz-card{background:var(--surface2);border:.5px solid var(--border);border-radius:20px;padding:1.75rem;width:100%;max-width:580px}.quiz-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.75rem}.quiz-progress-text{font-size:.8rem;color:var(--muted);font-weight:500}.quiz-category{font-size:.72rem;background:#e4a8531a;color:var(--gold);border:.5px solid var(--border);border-radius:100px;padding:3px 10px;font-weight:600;text-transform:uppercase;letter-spacing:1px}.quiz-timer{font-size:1rem;font-weight:800;min-width:32px;text-align:right;transition:color .3s}.timer-bar-bg{height:3px;background:var(--surface3);border-radius:100px;margin-bottom:.85rem;overflow:hidden}.timer-bar-fill{height:100%;border-radius:100px}.quiz-score-row{display:flex;align-items:center;gap:.5rem;margin-bottom:1.25rem;font-size:.8rem}.quiz-score-label,.quiz-earned-label{color:var(--muted)}.quiz-score-val{color:var(--text);font-weight:600;margin-right:.75rem}.quiz-earned-val{font-weight:700}.quiz-question{font-size:1.05rem;font-weight:600;color:var(--text);line-height:1.5;margin-bottom:1.25rem}.quiz-options{display:grid;grid-template-columns:1fr 1fr;gap:.65rem;margin-bottom:1rem}.option{background:var(--surface3);border:.5px solid rgba(240,237,230,.1);border-radius:10px;padding:.7rem .9rem;color:var(--text);font-size:.875rem;font-weight:500;cursor:pointer;text-align:left;transition:all .15s;display:flex;align-items:center;justify-content:space-between;gap:8px}.option:hover:not(:disabled){border-color:var(--gold);background:#e4a85314}.option.correct{border-color:var(--green);background:#4caf7d1f;color:var(--green)}.option.wrong{border-color:var(--red);background:#ff6b6b1f;color:var(--red)}.option.dimmed{opacity:.4}.option-tick{color:var(--green);font-weight:700}.option-cross{color:var(--red);font-weight:700}.quiz-feedback{text-align:center;font-size:.875rem;font-weight:600;padding:.6rem;border-radius:8px}.feedback-correct{color:var(--green);background:#4caf7d1a}.feedback-wrong{color:var(--red);background:#ff6b6b1a}.quiz-result-card{background:var(--surface2);border:.5px solid var(--border);border-radius:20px;padding:2rem 2.5rem;width:100%;max-width:500px;text-align:center}.result-emoji{font-size:2.5rem;margin-bottom:.75rem}.result-title{font-size:1.5rem;font-weight:800;color:var(--text);margin-bottom:1.25rem;letter-spacing:-.5px}.result-stats{display:flex;justify-content:center;gap:2rem;margin-bottom:1rem;padding:1rem;background:var(--surface3);border-radius:12px}.result-stat{text-align:center}.result-stat-num{font-size:1.4rem;font-weight:800;color:var(--text)}.result-stat-num.gold{color:var(--gold)}.result-stat-label{font-size:.72rem;color:var(--muted);text-transform:uppercase;letter-spacing:1px;margin-top:2px}.tx-status{font-size:.82rem;font-weight:500;padding:.6rem 1rem;border-radius:8px;margin-bottom:1rem;display:flex;align-items:center;justify-content:center;gap:6px}.tx-loading{background:#e4a8531a;color:var(--gold);border:.5px solid var(--border)}.tx-success{background:#4caf7d1a;color:var(--green);border:.5px solid rgba(76,175,125,.3)}.tx-failed{background:#ff6b6b1a;color:var(--red);border:.5px solid rgba(255,107,107,.3)}.tx-link{color:var(--gold);text-decoration:underline;font-weight:600}.result-breakdown{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1.5rem;max-height:160px;overflow-y:auto}.result-row{display:flex;align-items:center;gap:.75rem;padding:.4rem .75rem;background:var(--surface3);border-radius:8px;font-size:.82rem}.result-icon{font-weight:700;font-size:.9rem}.result-icon.correct{color:var(--green)}.result-icon.wrong{color:var(--red)}.result-q{color:var(--muted);min-width:24px}.result-status{margin-left:auto;font-weight:600;color:var(--text)}.result-actions{display:flex;gap:1rem;justify-content:center}.leaderboard-card{background:var(--surface2);border:.5px solid var(--border);border-radius:20px;padding:2rem;width:100%;max-width:620px;display:flex;flex-direction:column;gap:1.25rem;max-height:calc(100vh - 120px);overflow:hidden}.lb-header{display:flex;flex-direction:column;gap:4px}.lb-back{background:transparent;border:none;color:var(--muted);font-size:.82rem;cursor:pointer;text-align:left;padding:0;transition:color .2s;width:fit-content}.lb-back:hover{color:var(--gold)}.lb-title{font-size:1.5rem;font-weight:800;color:var(--text);letter-spacing:-.5px}.lb-subtitle{font-size:.78rem;color:var(--muted)}.lb-empty{text-align:center;padding:2rem 1rem}.lb-empty-icon{font-size:2.5rem;margin-bottom:.75rem}.lb-empty-text{font-size:1.1rem;font-weight:700;color:var(--text);margin-bottom:.35rem}.lb-empty-sub{font-size:.82rem;color:var(--muted)}.lb-table{display:flex;flex-direction:column;gap:.4rem;overflow-y:auto}.lb-table-header{display:grid;grid-template-columns:48px 1fr 90px 90px 70px;padding:.4rem .75rem;font-size:.7rem;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:1px}.lb-row{display:grid;grid-template-columns:48px 1fr 90px 90px 70px;align-items:center;padding:.65rem .75rem;background:var(--surface3);border:.5px solid transparent;border-radius:10px;font-size:.84rem;transition:border-color .2s}.lb-row:hover{border-color:var(--border)}.lb-row-you{border-color:var(--gold)!important;background:#e4a8530f}.lb-col-rank{font-size:1rem}.lb-col-player{display:flex;align-items:center;gap:8px}.lb-key{font-family:monospace;font-size:.82rem;color:var(--text);font-weight:600}.lb-you-badge{font-size:.65rem;font-weight:700;background:var(--gold);color:var(--ink);border-radius:100px;padding:2px 7px}.lb-col-score{display:flex;flex-direction:column}.lb-score-num{font-weight:700;color:var(--text);font-size:.85rem}.lb-score-pct{font-size:.7rem;color:var(--muted)}.lb-col-earned{font-weight:700}.lb-col-date{font-size:.75rem}.muted{color:var(--muted)}.lb-clear{background:transparent;border:.5px solid rgba(255,107,107,.3);color:var(--red);border-radius:8px;padding:.5rem 1rem;font-size:.78rem;cursor:pointer;transition:all .2s;width:fit-content;align-self:center}.lb-clear:hover{background:#ff6b6b1a}.footer{text-align:center;padding:.85rem;border-top:.5px solid var(--border);color:var(--muted);font-size:.75rem;flex-shrink:0}