:root{--bg:#080d18;--bg2:#0d1526;--card:#111c2e;--border:#1e2d45;--accent:#006AA7;--accent2:#0089d6;--yellow:#FECC02;--yellow2:#f5a623;--success:#22c55e;--error:#ef4444;--text:#e8edf5;--muted:#5a7090;--subtle:#8aa0b8;}
*{margin:0;padding:0;box-sizing:border-box;}html{scroll-behavior:smooth;}body{background:var(--bg);color:var(--text);font-family:'DM Sans',sans-serif;overflow-x:hidden;}
#app-loader{display:flex;position:fixed;inset:0;z-index:999;background:var(--bg);align-items:center;justify-content:center;flex-direction:column;gap:16px;}
#app-loader .spinner{width:40px;height:40px;border:3px solid var(--border);border-top-color:var(--yellow);border-radius:50%;animation:spin .8s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}
#app-error{display:none;position:fixed;top:80px;left:50%;transform:translateX(-50%);background:rgba(239,68,68,0.15);border:1px solid var(--error);border-radius:12px;padding:16px 24px;color:var(--error);font-size:14px;z-index:200;max-width:400px;text-align:center;}
nav{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(8,13,24,0.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);padding:0 24px;height:64px;display:flex;align-items:center;justify-content:space-between;}
.nav-logo{display:flex;align-items:center;gap:10px;text-decoration:none;cursor:pointer;}.nav-logo img{height:40px;width:40px;object-fit:contain;}.nav-logo span{font-family:'Playfair Display',serif;font-size:18px;color:var(--text);font-weight:700;}.nav-logo span em{color:var(--yellow);font-style:normal;}
.nav-links{display:flex;gap:6px;align-items:center;}.nav-links a{color:var(--subtle);text-decoration:none;font-size:13px;font-weight:500;padding:7px 14px;border-radius:8px;transition:all .2s;}.nav-links a:hover{color:var(--text);background:rgba(255,255,255,0.06);}
.nav-cta{background:var(--yellow);color:#080d18;font-weight:700;font-size:13px;padding:8px 18px;border-radius:8px;border:none;cursor:pointer;transition:all .2s;font-family:'DM Sans',sans-serif;}.nav-cta:hover{background:var(--yellow2);transform:translateY(-1px);}
.hero{min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;padding:100px 24px 60px;background:radial-gradient(ellipse 80% 60% at 50% 0%,rgba(0,106,167,.25) 0%,transparent 70%),radial-gradient(ellipse 40% 40% at 80% 80%,rgba(254,204,2,.08) 0%,transparent 60%),var(--bg);position:relative;overflow:hidden;}
.hero::before{content:'';position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.03) 1px,transparent 1px);background-size:40px 40px;}
.hero-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(0,106,167,.2);border:1px solid rgba(0,106,167,.4);border-radius:100px;padding:6px 16px;font-size:12px;color:var(--accent2);margin-bottom:28px;font-weight:500;letter-spacing:1px;text-transform:uppercase;}
.hero h1{font-family:'Playfair Display',serif;font-size:clamp(36px,7vw,72px);line-height:1.1;font-weight:900;margin-bottom:12px;}.hero h1 span{color:var(--yellow);}
.hero-sub{font-size:clamp(16px,2.5vw,22px);color:var(--subtle);font-weight:300;max-width:560px;margin:0 auto 16px;line-height:1.6;}
.hero-lang{font-size:13px;color:var(--muted);margin-bottom:40px;}
.hero-stats{display:flex;justify-content:center;gap:32px;margin-bottom:48px;flex-wrap:wrap;}.hero-stat{text-align:center;}.hero-stat .num{font-family:'Playfair Display',serif;font-size:32px;font-weight:700;color:var(--yellow);}.hero-stat .lbl{font-size:12px;color:var(--muted);margin-top:2px;text-transform:uppercase;letter-spacing:1px;}
.hero-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.btn-primary{background:linear-gradient(135deg,var(--yellow) 0%,var(--yellow2) 100%);color:#080d18;font-weight:700;font-size:15px;padding:14px 32px;border-radius:12px;text-decoration:none;border:none;cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:8px;font-family:'DM Sans',sans-serif;}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(254,204,2,.3);}
.btn-secondary{background:transparent;color:var(--text);font-weight:500;font-size:15px;padding:14px 32px;border-radius:12px;text-decoration:none;border:1px solid var(--border);cursor:pointer;transition:all .2s;font-family:'DM Sans',sans-serif;}.btn-secondary:hover{background:rgba(255,255,255,.05);border-color:var(--subtle);}
.cats-strip{background:var(--bg2);border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:20px 24px;display:flex;justify-content:center;gap:12px;flex-wrap:wrap;}
.cat-pill{display:flex;align-items:center;gap:6px;background:rgba(255,255,255,.04);border:1px solid var(--border);border-radius:100px;padding:6px 14px;font-size:12px;color:var(--subtle);}
.section{padding:80px 24px;max-width:1100px;margin:0 auto;}.section-label{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--accent2);font-weight:600;margin-bottom:12px;}.section-title{font-family:'Playfair Display',serif;font-size:clamp(28px,4vw,44px);font-weight:700;margin-bottom:16px;}.section-sub{color:var(--subtle);font-size:16px;line-height:1.7;max-width:560px;}
.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin-top:48px;}.feature-card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:28px;transition:all .3s;}.feature-card:hover{border-color:var(--accent);transform:translateY(-4px);box-shadow:0 12px 32px rgba(0,106,167,.15);}.feature-icon{font-size:32px;margin-bottom:16px;}.feature-title{font-size:16px;font-weight:600;margin-bottom:8px;}.feature-desc{font-size:14px;color:var(--subtle);line-height:1.6;}
.mode-cards{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:40px;}.mode-card{background:var(--card);border:2px solid var(--border);border-radius:20px;padding:32px;cursor:pointer;transition:all .2s;text-align:center;}.mode-card:hover{border-color:var(--accent);transform:translateY(-4px);}.mode-card.mode-learn{border-color:var(--accent);}.mode-icon{font-size:48px;margin-bottom:16px;}.mode-name{font-family:'Playfair Display',serif;font-size:22px;font-weight:700;margin-bottom:8px;}.mode-desc{font-size:14px;color:var(--subtle);line-height:1.6;}.mode-badge{display:inline-block;margin-top:12px;background:rgba(0,106,167,.2);border:1px solid rgba(0,106,167,.4);border-radius:100px;padding:4px 14px;font-size:11px;color:var(--accent2);}.mode-badge.yellow{background:rgba(254,204,2,.15);border-color:rgba(254,204,2,.4);color:var(--yellow);}
#learn-section{padding:40px 24px 80px;max-width:800px;margin:0 auto;display:none;}.learn-header{display:flex;align-items:center;gap:12px;margin-bottom:32px;padding-bottom:20px;border-bottom:1px solid var(--border);}.learn-back{background:none;border:1px solid var(--border);border-radius:8px;padding:8px 14px;color:var(--text);cursor:pointer;font-family:'DM Sans',sans-serif;font-size:13px;}.learn-title{flex:1;font-family:'Playfair Display',serif;font-size:20px;font-weight:700;}
.learn-cats{display:flex;flex-direction:column;gap:12px;}.learn-cat-card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:18px 24px;display:flex;align-items:center;gap:16px;cursor:pointer;transition:all .2s;}.learn-cat-card:hover:not(.locked){border-color:var(--accent);background:rgba(0,106,167,.08);}.learn-cat-card.locked{opacity:.5;cursor:not-allowed;}.learn-cat-card.done{border-color:var(--success);background:rgba(34,197,94,.05);}.lcc-icon{font-size:28px;}.lcc-info{flex:1;}.lcc-name{font-size:15px;font-weight:600;}.lcc-sv{font-size:12px;color:var(--muted);margin-top:2px;}.lcc-status{font-size:20px;}
.learn-subs{display:flex;flex-direction:column;gap:10px;}.learn-sub-card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:16px 20px;display:flex;align-items:center;gap:14px;cursor:pointer;transition:all .2s;}.learn-sub-card:hover:not(.locked){border-color:var(--accent);}.learn-sub-card.locked{opacity:.5;cursor:not-allowed;}.learn-sub-card.done{border-color:var(--success);}.lsc-num{width:32px;height:32px;border-radius:8px;background:rgba(255,255,255,.07);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;color:var(--subtle);flex-shrink:0;}.lsc-num.done{background:rgba(34,197,94,.2);color:var(--success);}.lsc-name{flex:1;font-size:14px;font-weight:500;}.lsc-info{font-size:12px;color:var(--muted);}
.topic-card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:28px;margin-bottom:24px;}.topic-card h3{font-family:'Playfair Display',serif;font-size:20px;font-weight:700;margin-bottom:16px;color:var(--yellow);}.topic-card p{font-size:14px;color:var(--subtle);line-height:1.7;margin-bottom:12px;}.topic-card ul{margin-left:20px;}.topic-card li{font-size:14px;color:var(--subtle);line-height:1.8;}.topic-card li strong{color:var(--text);}.topic-start-btn{width:100%;background:linear-gradient(135deg,var(--yellow) 0%,var(--yellow2) 100%);color:#080d18;font-weight:700;font-size:16px;padding:18px;border-radius:12px;border:none;cursor:pointer;font-family:'DM Sans',sans-serif;}
.progress-bar{height:4px;background:var(--border);border-radius:100px;margin-bottom:24px;overflow:hidden;}.progress-fill{height:100%;background:var(--yellow);border-radius:100px;transition:width .4s ease;}
.learn-q-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;}.learn-q-prog{font-size:12px;color:var(--muted);font-family:monospace;}.learn-q-score{background:rgba(34,197,94,.15);border:1px solid rgba(34,197,94,.3);border-radius:100px;padding:4px 12px;font-size:12px;color:var(--success);}
.quiz-q{font-size:clamp(16px,2.5vw,19px);line-height:1.7;font-weight:500;margin-bottom:24px;}
.options{display:flex;flex-direction:column;gap:10px;}.option{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:14px 18px;cursor:pointer;text-align:left;color:var(--text);font-size:15px;line-height:1.5;display:flex;gap:12px;align-items:flex-start;transition:all .15s;font-family:'DM Sans',sans-serif;width:100%;}.option:hover:not(.answered){border-color:var(--accent2);background:rgba(0,137,214,.08);}.option.correct{background:rgba(34,197,94,.12);border-color:var(--success);color:var(--success);}.option.wrong{background:rgba(239,68,68,.12);border-color:var(--error);color:var(--error);}.option.dimmed{color:var(--muted);}
.opt-letter{min-width:26px;height:26px;border-radius:6px;background:rgba(255,255,255,.07);display:flex;align-items:center;justify-content:center;font-size:12px;font-family:monospace;flex-shrink:0;margin-top:1px;}
.explanation{display:none;margin-top:16px;background:rgba(0,106,167,.12);border:1px solid rgba(0,106,167,.3);border-radius:12px;padding:14px 18px;font-size:14px;color:#93c5fd;line-height:1.7;}
.next-btn{display:none;margin-top:16px;width:100%;background:linear-gradient(135deg,var(--yellow) 0%,var(--yellow2) 100%);color:#080d18;font-weight:700;font-size:15px;padding:16px;border-radius:12px;border:none;cursor:pointer;font-family:'DM Sans',sans-serif;}
.complete-card{background:var(--card);border:1px solid var(--success);border-radius:16px;padding:32px;text-align:center;}.complete-emoji{font-size:56px;margin-bottom:12px;}.complete-title{font-family:'Playfair Display',serif;font-size:24px;font-weight:700;margin-bottom:8px;}.complete-sub{color:var(--subtle);font-size:14px;margin-bottom:24px;}.complete-btns{display:flex;flex-direction:column;gap:10px;}
#exam-section{padding:40px 24px 80px;max-width:720px;margin:0 auto;display:none;}.exam-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;}.exam-counter{font-size:13px;color:var(--muted);font-family:monospace;}.exam-mode-badge{background:rgba(239,68,68,.15);border:1px solid rgba(239,68,68,.3);border-radius:100px;padding:4px 12px;font-size:11px;color:var(--error);letter-spacing:1px;text-transform:uppercase;}
.exam-q{font-size:clamp(16px,2.5vw,19px);line-height:1.7;font-weight:500;margin-bottom:24px;}
.exam-option{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:14px 18px;cursor:pointer;text-align:left;color:var(--text);font-size:15px;line-height:1.5;display:flex;gap:12px;align-items:flex-start;transition:all .15s;font-family:'DM Sans',sans-serif;width:100%;margin-bottom:10px;}.exam-option:hover:not(.selected-exam){border-color:var(--accent2);background:rgba(0,137,214,.08);}.exam-option.selected-exam{border-color:var(--accent);background:rgba(0,106,167,.15);}
.exam-next{width:100%;background:var(--accent);color:#fff;font-weight:700;font-size:15px;padding:16px;border-radius:12px;border:none;font-family:'DM Sans',sans-serif;margin-top:16px;opacity:.4;cursor:not-allowed;transition:all .2s;}.exam-next.active{opacity:1;cursor:pointer;background:linear-gradient(135deg,var(--yellow) 0%,var(--yellow2) 100%);color:#080d18;}
#results-section{padding:40px 24px 80px;max-width:560px;margin:0 auto;display:none;text-align:center;}.result-emoji{font-size:72px;margin-bottom:12px;}.result-pct{font-family:'Playfair Display',serif;font-size:72px;font-weight:900;line-height:1;}.result-label{color:var(--muted);font-size:14px;margin-top:6px;margin-bottom:24px;}.result-bar-wrap{background:var(--border);border-radius:100px;height:10px;overflow:hidden;margin:16px 0;}.result-bar{height:100%;border-radius:100px;transition:width 1s ease;}.cat-analysis{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:20px;margin:20px 0;text-align:left;}.cat-analysis h4{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--muted);margin-bottom:16px;font-family:monospace;}.cat-row{margin-bottom:12px;}.cat-row-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px;font-size:13px;}.cat-row-bar{background:var(--border);border-radius:100px;height:5px;overflow:hidden;}.cat-row-fill{height:100%;border-radius:100px;}.result-btns{display:flex;flex-direction:column;gap:10px;margin-top:20px;}
.wrong-list{text-align:left;margin-top:24px;}.wrong-item{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:16px;margin-bottom:12px;}.wrong-q{font-size:14px;font-weight:500;margin-bottom:8px;}.wrong-correct{font-size:13px;color:var(--success);margin-bottom:6px;}.wrong-exp{font-size:13px;color:var(--subtle);line-height:1.6;border-top:1px solid var(--border);padding-top:8px;margin-top:8px;}
.book-section{background:var(--bg2);border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:80px 24px;}.book-inner{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;}.book-text .coming{display:inline-block;background:rgba(254,204,2,.15);border:1px solid rgba(254,204,2,.3);color:var(--yellow);border-radius:100px;padding:4px 14px;font-size:11px;letter-spacing:2px;text-transform:uppercase;font-weight:600;margin-bottom:20px;}.book-chapters{display:flex;flex-direction:column;gap:8px;}.book-ch{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--card);border:1px solid var(--border);border-radius:10px;font-size:14px;color:var(--subtle);}
.pricing-section{padding:80px 24px;max-width:1100px;margin:0 auto;}.pricing-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-top:48px;}.price-card{background:var(--card);border:1px solid var(--border);border-radius:20px;padding:28px;text-align:center;transition:all .3s;position:relative;}.price-card.popular{border-color:var(--yellow);background:rgba(254,204,2,.05);}.popular-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--yellow);color:#080d18;font-size:11px;font-weight:700;padding:4px 14px;border-radius:100px;letter-spacing:1px;text-transform:uppercase;white-space:nowrap;}.price-name{font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:2px;margin-bottom:12px;}.price-amount{font-family:'Playfair Display',serif;font-size:42px;font-weight:700;color:var(--yellow);}.price-period{font-size:13px;color:var(--muted);margin-bottom:20px;}.price-features{text-align:left;margin-bottom:24px;}.price-feat{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--subtle);padding:6px 0;border-bottom:1px solid var(--border);}.price-feat:last-child{border:none;}.price-feat .check{color:var(--success);font-size:14px;}.price-feat .x{color:var(--muted);opacity:.4;font-size:14px;}.price-btn{width:100%;padding:12px;border-radius:10px;border:none;font-weight:700;font-size:14px;cursor:pointer;font-family:'DM Sans',sans-serif;transition:all .2s;}.price-btn.active{background:var(--yellow);color:#080d18;}.price-btn.inactive{background:rgba(255,255,255,.06);color:var(--subtle);border:1px solid var(--border);}
.test-section{background:var(--bg2);border-top:1px solid var(--border);padding:80px 24px;}.test-inner{max-width:1100px;margin:0 auto;}.test-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin-top:48px;}.test-card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:24px;}.test-stars{color:var(--yellow);font-size:14px;margin-bottom:12px;}.test-text{font-size:14px;color:var(--subtle);line-height:1.7;margin-bottom:16px;font-style:italic;}.test-author{font-size:13px;font-weight:600;color:var(--text);}
.faq-section{padding:80px 24px;max-width:800px;margin:0 auto;}.faq-item{border-bottom:1px solid var(--border);}.faq-q{width:100%;padding:20px 0;display:flex;justify-content:space-between;align-items:center;background:none;border:none;color:var(--text);font-size:15px;font-weight:500;cursor:pointer;text-align:left;font-family:'DM Sans',sans-serif;gap:16px;}.faq-a{font-size:14px;color:var(--subtle);line-height:1.7;padding-bottom:20px;display:none;}.faq-a.open{display:block;}.faq-arrow{font-size:12px;color:var(--muted);flex-shrink:0;transition:transform .2s;}.faq-arrow.open{transform:rotate(180deg);}
footer{background:var(--bg2);border-top:1px solid var(--border);padding:48px 24px;text-align:center;}.footer-logo{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:8px;}.footer-logo img{height:36px;}.footer-logo span{font-family:'Playfair Display',serif;font-size:20px;font-weight:700;}.footer-logo span em{color:var(--yellow);font-style:normal;}.footer-sub{font-size:13px;color:var(--muted);margin-bottom:24px;}.footer-links{display:flex;justify-content:center;gap:24px;flex-wrap:wrap;margin-bottom:24px;}.footer-links a{font-size:13px;color:var(--muted);text-decoration:none;}.footer-links a:hover{color:var(--text);}.footer-bottom{font-size:12px;color:var(--muted);padding-top:24px;border-top:1px solid var(--border);}
@media(max-width:768px){.book-inner{grid-template-columns:1fr;gap:40px;}.nav-links{display:none;}.mode-cards{grid-template-columns:1fr;}.hero-stats{gap:20px;}}