:root{--bg:#0b0d10;--panel:#121721;--text:#f2f5f9;--muted:#a7b0bd;--accent:#1aa3a3;--accent-2:#4cc2ff;--border:#1e2633}*{box-sizing:border-box}body,html{padding:0;margin:0;background:var(--bg);color:var(--text);font-family:Space Grotesk,Segoe UI,system-ui,-apple-system,sans-serif;min-height:100%}a{color:inherit;text-decoration:none}main{max-width:1100px;margin:0 auto;padding:48px 24px 96px}.app-header{justify-content:center;padding:18px 0;border-bottom:1px solid var(--border);background:rgba(10,13,18,.92);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);position:-webkit-sticky;position:sticky;top:0;z-index:10}.app-header,.header-inner{display:flex;align-items:center}.header-inner{width:100%;max-width:1100px;padding:0 24px;justify-content:space-between}.brand-link{font-weight:700;font-size:18px}.app-tabs{display:flex;gap:18px;color:#c9ced8;font-size:14px}.app-tabs a{padding:6px 4px;border-bottom:2px solid transparent}.app-tabs a.active{color:var(--text);border-color:var(--accent)}.app-actions{display:flex;align-items:center;gap:12px}.badge{padding:6px 12px;border-radius:999px;border:1px solid var(--border);background:transparent;color:var(--text);font-size:12px;cursor:pointer}.badge.premium{background:linear-gradient(120deg,#fbbf24,#f97316);color:#1a0f00;border:none;font-weight:600}.avatar-wrapper{position:relative}.avatar{width:36px;height:36px;border-radius:50%;border:1px solid hsla(0,0%,100%,.2);background:hsla(0,0%,100%,.08);color:var(--text);font-weight:700;cursor:pointer}.avatar-menu{position:absolute;right:0;top:44px;background:rgba(16,20,28,.98);border:1px solid var(--border);border-radius:12px;padding:12px;min-width:200px;box-shadow:0 20px 40px rgba(0,0,0,.35)}.avatar-title{font-size:13px;color:var(--muted);margin-bottom:8px}.menu-item{width:100%;text-align:left;padding:8px 10px;border-radius:8px;border:1px solid transparent;background:transparent;color:var(--text);cursor:pointer}.menu-item:hover{border-color:var(--border)}.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border-radius:999px;border:1px solid transparent;background:var(--accent);color:#fff;font-weight:600;cursor:pointer}.button.secondary{background:transparent;border-color:var(--border);color:var(--text)}.grid{display:grid;grid-gap:16px;gap:16px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.card{background:rgba(18,23,33,.9);border:1px solid var(--border);border-radius:14px;padding:18px;min-height:140px}.card h3{margin-top:0}.muted{color:var(--muted);font-size:14px}section{margin-top:48px}footer{padding:32px 24px 48px;border-top:1px solid var(--border);color:var(--muted);font-size:14px;text-align:center}.home-shell{max-width:1100px;margin:0 auto;padding:48px 24px 96px}.hero-band{background:radial-gradient(circle at 10% 0,rgba(76,194,255,.2),transparent 50%),radial-gradient(circle at 90% 10%,rgba(26,163,163,.25),transparent 55%),#0f141b;padding:64px 48px;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));grid-gap:48px;gap:48px;align-items:center;position:relative;overflow:hidden;border-radius:28px}.hero-content h1{font-size:clamp(2.4rem,3vw,3.6rem);margin:14px 0}.hero-content p{color:#b7bdc8;line-height:1.6;max-width:520px}.pill-ghost{text-transform:uppercase;letter-spacing:.2em;font-size:11px;color:#7dd3fc}.hero-actions{display:flex;gap:14px;margin-top:22px;flex-wrap:wrap}.cta{background:var(--accent);border-radius:999px;font-weight:600}.cta,.ghost{color:#fff;padding:10px 22px}.ghost{border:1px solid hsla(0,0%,100%,.2);border-radius:999px}.hero-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));grid-gap:16px;gap:16px;margin-top:26px;color:#b7bdc8;font-size:13px}.hero-metrics strong{display:block;font-size:22px;color:#fff}.hero-visual{position:relative;display:grid;place-items:center}.card-stack{position:relative;width:min(420px,92%);height:340px;perspective:1200px;cursor:pointer;z-index:2}.quiz-card{position:absolute;width:100%;height:210px;border-radius:22px;padding:22px;background:linear-gradient(160deg,hsla(0,0%,100%,.08),hsla(0,0%,100%,.02));border:1px solid hsla(0,0%,100%,.18);box-shadow:0 30px 60px rgba(0,0,0,.35);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#fff;transform-style:preserve-3d;animation:float-up 1s ease forwards,drift 6s ease-in-out infinite;transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease}.quiz-card:hover{transform:translateY(30px) rotate(-1deg) scale(1.03);border-color:rgba(76,194,255,.5);box-shadow:0 44px 90px rgba(0,0,0,.6)}.quiz-card h4{margin:12px 0 6px}.quiz-card p{margin:0;color:#cbd5e1;font-size:13px}.card-chip{display:inline-flex;padding:4px 10px;border-radius:999px;background:hsla(0,0%,100%,.14);font-size:12px;letter-spacing:.02em}.quiz-card.back{transform:rotate(-6deg) translate(-26px,-34px);opacity:.55;z-index:1}.quiz-card.mid{transform:rotate(3deg) translate(18px,-6px);opacity:.75;z-index:2}.quiz-card.front{transform:translateY(36px) rotate(-1deg);background:linear-gradient(135deg,rgba(76,194,255,.25),rgba(26,163,163,.35));box-shadow:0 36px 70px rgba(0,0,0,.45);z-index:3}.card-stack:hover .quiz-card.front{transform:translateY(30px) rotate(-1deg) scale(1.02);border-color:rgba(76,194,255,.4);box-shadow:0 40px 80px rgba(0,0,0,.55)}.card-stack:hover .quiz-card.mid{transform:rotate(2deg) translate(14px,-10px) scale(1.01)}.card-stack:hover .quiz-card.back{transform:rotate(-6deg) translate(-30px,-42px)}.mini-play{margin-top:14px;width:44px;height:44px;border-radius:50%;border:none;background:#fff;color:#0b0d10;font-weight:700;cursor:pointer}.orbit{position:absolute;border-radius:50%;border:1px dashed hsla(0,0%,100%,.12);animation:spin 14s linear infinite;pointer-events:none}.orbit.one{width:240px;height:240px}.orbit.two{width:320px;height:320px;animation-duration:20s}.value-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));grid-gap:20px;gap:20px;padding:32px 0 0}.value-card{background:hsla(0,0%,100%,.04);border:1px solid hsla(0,0%,100%,.08);border-radius:16px;padding:20px}.value-card p{color:#b7bdc8}.split-band{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));grid-gap:32px;gap:32px;align-items:center;padding:48px;background:#0f141b;border-radius:28px}.split-band p{color:#b7bdc8}.score-panel{background:hsla(0,0%,100%,.05);border:1px solid hsla(0,0%,100%,.12);border-radius:18px;padding:24px}.score-panel strong{font-size:28px;display:block;margin:8px 0 18px}.score-bars{display:grid;grid-gap:12px;gap:12px;font-size:13px;color:#cbd5f5}.bar{height:8px;border-radius:999px;background:hsla(0,0%,100%,.1);overflow:hidden;margin-top:6px}.bar div{height:100%;background:linear-gradient(120deg,#4cc2ff,#1aa3a3)}@keyframes float-up{0%{transform:translateY(24px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes drift{0%{transform:translateY(0) rotate(-.5deg)}50%{transform:translateY(-12px) rotate(.8deg)}to{transform:translateY(0) rotate(-.5deg)}}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes shimmer{0%{transform:translateX(-120%)}60%{transform:translateX(120%)}to{transform:translateX(120%)}}.topic-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));grid-gap:20px;gap:20px;margin-top:24px}.login-shell{display:grid;place-items:center;min-height:calc(100vh - 140px);padding:40px 0}.login-card{width:min(420px,92%);background:#f6f7fb;color:#1f2937;border-radius:16px;padding:32px;box-shadow:0 26px 60px rgba(0,0,0,.18);text-align:center}.login-brand{font-weight:700;margin-bottom:12px}.login-card h1{margin:6px 0 8px}.login-fields{display:grid;grid-gap:12px;gap:12px;margin-top:18px;text-align:left}.login-fields label span{font-size:12px;color:#6b7280}.login-fields input{width:100%;margin-top:6px;padding:10px 12px;border-radius:8px;border:1px solid #e5e7eb;background:#fff}.login-field-error{display:block;margin-top:6px;color:#dc2626;font-size:12px}.login-primary,.login-secondary{width:100%;margin-top:12px;padding:10px 12px;border-radius:8px;border:none;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px}.login-primary{background:#111827;color:#fff}.login-secondary{background:#e5e7eb;color:#111827}.login-links{display:flex;justify-content:space-between;margin-top:12px}.login-links button{border:none;background:none;color:#2563eb;cursor:pointer;font-size:12px}.signup-hint{display:flex;justify-content:center;gap:6px;margin:10px 0 4px;font-size:12px;color:#6b7280}.signup-hint button{border:none;background:none;color:#2563eb;cursor:pointer;font-size:12px}.login-divider{margin:10px 0 6px;font-size:12px;color:#6b7280;text-align:center}.spinner{width:14px;height:14px;border-radius:50%;border:2px solid hsla(0,0%,100%,.4);border-top-color:#fff;animation:spin .8s linear infinite}.login-secondary .spinner{border-color:#111827 rgba(31,41,55,.35) rgba(31,41,55,.35)}.login-error{color:#dc2626;font-size:12px}.login-notice{color:#0f766e;font-size:12px}.login-status{margin-top:16px;color:#6b7280;font-size:12px}.topic-card{background:rgba(18,23,33,.92);border:1px solid var(--border);border-radius:18px;overflow:hidden;position:relative;box-shadow:0 18px 40px rgba(0,0,0,.35);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}.topic-card.skeleton{background:rgba(18,23,33,.6)}.skeleton-line{height:12px;border-radius:999px;background:hsla(0,0%,100%,.08);position:relative;overflow:hidden}.skeleton-line.wide{width:70%;height:18px;margin-bottom:10px}.skeleton-line.short{width:60px;height:16px}.skeleton-line.tiny{width:40px;margin-top:6px}.skeleton-line:after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent,hsla(0,0%,100%,.18),transparent);transform:translateX(-120%);animation:shimmer 2.6s ease-in-out infinite}.card,.hero-band,.premium-card,.score-panel,.topic-card,.value-card{position:relative;overflow:hidden}.card:after,.hero-band:after,.premium-card:after,.score-panel:after,.topic-card:after,.value-card:after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent,hsla(0,0%,100%,.06),transparent);transform:translateX(-120%);animation:shimmer 3.6s ease-in-out infinite;pointer-events:none}.topic-card:hover{transform:translateY(-6px);border-color:rgba(76,194,255,.35);box-shadow:0 26px 60px rgba(0,0,0,.45)}.topic-hero{padding:20px;color:#fff}.topic-hero-label{font-size:12px;letter-spacing:.08em;text-transform:uppercase;opacity:.7}.topic-hero h3{margin:12px 0 6px}.topic-hero p{margin:0;font-size:13px;opacity:.85}.topic-meta{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;gap:12px;font-size:13px}.topic-meta div{display:grid;grid-gap:2px;gap:2px}.topic-meta strong{font-size:18px}.play-button{width:42px;height:42px;border-radius:50%;border:1px solid var(--border);background:#fff;color:#0b0d10;font-weight:700;cursor:pointer}.progress{height:6px;background:hsla(0,0%,100%,.08);border-radius:999px;margin:0 18px 16px;overflow:hidden}.progress div{height:100%;background:linear-gradient(120deg,var(--accent),var(--accent-2))}.modal{position:fixed;inset:0;background:rgba(6,9,14,.72);display:grid;place-items:center;z-index:20}.modal-card{background:rgba(18,23,33,.98);border:1px solid var(--border);border-radius:18px;padding:32px;text-align:center;min-width:280px;position:relative;z-index:21}.confetti{position:absolute;inset:0;overflow:hidden;pointer-events:none}.confetti span{position:absolute;top:-10px;animation-name:confetti-fall;animation-timing-function:ease-in;animation-iteration-count:1}@keyframes confetti-fall{0%{transform:translateY(0) rotate(0deg);opacity:1}to{transform:translateY(110vh) rotate(320deg);opacity:0}}.premium-page{max-width:1100px}.premium-hero{text-align:center;margin-bottom:32px}.premium-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));grid-gap:24px;gap:24px}.premium-card{background:rgba(18,23,33,.92);border:1px solid var(--border);border-radius:18px;padding:28px}.premium-card.featured{background:linear-gradient(135deg,rgba(250,204,21,.15),rgba(249,115,22,.2));border-color:rgba(249,115,22,.5)}.premium-card-header{display:flex;align-items:center;justify-content:space-between}.pill{padding:4px 10px;border-radius:999px;background:#fbbf24;color:#2b1900;font-size:12px;font-weight:600}.premium-price{display:flex;align-items:baseline;gap:8px;font-size:32px;margin:16px 0}.premium-cta{width:100%;padding:12px 16px;border-radius:10px;border:none;background:#0b0d10;color:#fff;font-weight:600;cursor:pointer}.premium-faq{display:grid;grid-template-columns:minmax(200px,280px) 1fr;grid-gap:32px;gap:32px;margin-top:48px}.faq-list{display:grid;grid-gap:16px;gap:16px}.faq-item{display:flex;align-items:center;justify-content:space-between;padding:16px 0;border-bottom:1px solid var(--border);font-size:15px}@media (max-width:900px){.app-header{flex-direction:column;gap:12px;align-items:flex-start}.hero-band,.premium-faq{grid-template-columns:1fr}}@media (max-width:720px){.app-tabs{flex-wrap:wrap}}