:root{--panel:#0a2237;--text:#f8fbff;--muted:#9bb3c7;--aqua:#42f5e6;--blue:#2452e6;--purple:#b21cff;--pink:#f7157d;--orange:#ff7a00;--yellow:#ffd226;--line:rgba(89,242,232,.23);--shadow:0 28px 80px rgba(0,0,0,.36)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;color:var(--text);font-family:"Manrope",system-ui,sans-serif;background:radial-gradient(circle at 86% 8%,rgba(47,51,216,.22),transparent 27%),radial-gradient(circle at 8% 54%,rgba(0,224,209,.09),transparent 31%),linear-gradient(145deg,#031626,#06111f 70%);overflow-x:hidden}body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.16;background-image:linear-gradient(120deg,transparent 0 49%,rgba(255,255,255,.05) 50%,transparent 51%),radial-gradient(circle,rgba(255,255,255,.12) 1px,transparent 1px);background-size:73px 73px,23px 23px}body[data-theme="light"]{--panel:#fff;--text:#061b2d;--muted:#52677a;--line:rgba(13,75,111,.18);background:radial-gradient(circle at 85% 5%,rgba(87,83,255,.18),transparent 26%),#f4fbff}body[data-theme="cool"]{--panel:#0b3150;--aqua:#79fff5;--text:#fff;--muted:#b3cee0;background:radial-gradient(circle at 50% 0,rgba(31,193,255,.2),transparent 33%),#051d30}
button,input{font:inherit}.app-header{max-width:1240px;margin:auto;padding:22px 28px;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:4}.brand{display:flex;align-items:center;gap:11px;color:var(--aqua);text-decoration:none;font-weight:800;letter-spacing:.12em;font-size:13px}.brand-mark{width:40px;height:40px;display:grid;place-items:center;border:2px solid var(--aqua);border-radius:50%;box-shadow:0 0 22px rgba(66,245,230,.25)}.header-actions{display:flex;gap:8px}.header-button,.install-button,.back-button{border:1px solid var(--line);background:rgba(13,43,66,.72);color:var(--text);cursor:pointer;backdrop-filter:blur(12px)}.header-button{width:42px;height:42px;border-radius:50%;font-weight:800}.install-button{padding:10px 16px;border-radius:999px;color:var(--aqua);font-weight:800}
.app-shell{max-width:1240px;margin:auto;padding:18px 28px 70px;position:relative;z-index:1}.screen{display:none;animation:appear .4s ease both}.screen.active{display:block}@keyframes appear{from{opacity:0;transform:translateY(10px)}}
.hero{min-height:650px;display:grid;grid-template-columns:1fr .88fr;align-items:center;gap:40px;padding:clamp(36px,6vw,78px);border:1px solid var(--line);border-radius:38px;background:linear-gradient(135deg,rgba(6,29,48,.96),rgba(4,16,30,.92));box-shadow:var(--shadow);overflow:hidden;position:relative}.hero:after{content:"";position:absolute;width:420px;height:420px;border-radius:50%;background:rgba(18,78,224,.12);filter:blur(40px);right:-100px;top:-120px}.hero-copy{position:relative;z-index:2}.eyebrow{margin:0 0 13px;color:var(--aqua);font-size:13px;font-weight:800;letter-spacing:.2em;text-transform:uppercase}.eyebrow span{color:var(--pink)}h1,h2{font-family:"Playfair Display",Georgia,serif}h1{font-size:clamp(56px,8.2vw,106px);line-height:.89;letter-spacing:-.055em;margin:0}.title-line{display:block;color:transparent;-webkit-background-clip:text;background-clip:text}.title-one{background-image:linear-gradient(90deg,#fff 2%,#72fff0 45%,#43a7ff 95%)}.title-two{background-image:linear-gradient(90deg,#4ef3e2,#4e79ff 42%,#c942ff 72%,#ff7d2d)}.hero-subtitle{max-width:650px;font-size:clamp(17px,2vw,22px);line-height:1.65;color:var(--muted);margin:28px 0}.hero-actions,.result-actions{display:flex;gap:12px;flex-wrap:wrap}.primary-button,.outline-button,.certificate-button{border-radius:17px;padding:16px 24px;font-weight:800;cursor:pointer;letter-spacing:.03em}.primary-button{border:0;color:#fff;background:linear-gradient(120deg,#1745dd,#3261f3 55%,#8137f2);box-shadow:0 15px 35px rgba(36,82,230,.3)}.primary-button span{margin-left:10px}.outline-button{color:var(--aqua);border:1px solid var(--aqua);background:transparent}.primary-button:hover,.outline-button:hover,.category-card:hover,.daily-button:hover{transform:translateY(-3px)}
.question-stage{min-height:510px;display:grid;place-items:center;position:relative;z-index:1}.question-stage img{width:min(470px,90%);border-radius:31%;box-shadow:0 0 80px rgba(0,174,255,.17);animation:float 4s ease-in-out infinite;position:relative;z-index:2}.question-glow{position:absolute;width:70%;aspect-ratio:1;border-radius:50%;background:conic-gradient(from 40deg,var(--aqua),var(--blue),var(--purple),var(--pink),var(--orange),var(--aqua));filter:blur(70px);opacity:.22}.orbit{position:absolute;border-radius:50%;border:1px dashed rgba(66,245,230,.26);animation:spin 16s linear infinite}.orbit-a{width:94%;aspect-ratio:1}.orbit-b{width:72%;aspect-ratio:1;animation-direction:reverse;animation-duration:11s}@keyframes spin{to{transform:rotate(360deg)}}@keyframes float{50%{transform:translateY(-10px) scale(1.015)}}
.home-toolbar{display:grid;grid-template-columns:1fr auto;gap:18px;margin:24px 0 54px}.difficulty-select,.daily-button{background:rgba(10,34,55,.9);border:1px solid var(--line);border-radius:21px;padding:13px;box-shadow:0 15px 40px rgba(0,0,0,.18)}.difficulty-select{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.difficulty-select>span{color:var(--muted);font-size:12px;font-weight:800;margin:0 7px}.difficulty{border:0;color:var(--muted);background:transparent;padding:10px 12px;border-radius:12px;cursor:pointer}.difficulty.active{color:#031626;background:var(--aqua);font-weight:800}.daily-button{display:grid;grid-template-columns:auto auto;column-gap:9px;align-items:center;text-align:left;color:var(--text);cursor:pointer;min-width:190px}.daily-button>span{grid-row:1/3;font-size:27px;color:var(--yellow)}.daily-button small{color:var(--muted)}
.section-title{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:22px}.section-title h2{font-size:clamp(38px,5vw,60px);margin:0}.section-title>p{max-width:390px;color:var(--muted)}.category-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.category-card{min-height:190px;border-radius:23px;padding:23px;text-align:left;color:#fff;border:1px solid rgba(255,255,255,.15);cursor:pointer;position:relative;overflow:hidden;transition:.2s;box-shadow:0 20px 38px rgba(0,0,0,.18)}.category-card:before{content:"";position:absolute;width:130px;height:130px;border-radius:50%;background:rgba(255,255,255,.13);right:-45px;top:-45px}.category-card:after{content:attr(data-count);position:absolute;right:17px;bottom:15px;font-size:11px;opacity:.74}.category-icon{font-size:35px;display:block;margin-bottom:28px}.category-card h3{font-size:21px;margin:0 0 5px}.category-card p{margin:0;opacity:.76;font-size:13px;line-height:1.45}.category-card:nth-child(8n+1){background:linear-gradient(145deg,#003a5c,#007d8a)}.category-card:nth-child(8n+2){background:linear-gradient(145deg,#57219b,#a11bdd)}.category-card:nth-child(8n+3){background:linear-gradient(145deg,#005032,#05a168)}.category-card:nth-child(8n+4){background:linear-gradient(145deg,#9b2a18,#f46420)}.category-card:nth-child(8n+5){background:linear-gradient(145deg,#1243a1,#2376ef)}.category-card:nth-child(8n+6){background:linear-gradient(145deg,#7e165c,#e11a89)}.category-card:nth-child(8n+7){background:linear-gradient(145deg,#674d00,#d79a00)}.category-card:nth-child(8n){background:linear-gradient(145deg,#39238d,#6558f5)}
.certificate-intro{margin:54px 0 24px;padding:clamp(26px,5vw,54px);display:grid;grid-template-columns:1fr .75fr;align-items:center;gap:30px;border:1px solid var(--line);border-radius:30px;background:linear-gradient(125deg,rgba(10,34,55,.95),rgba(44,23,91,.65))}.certificate-intro h2{font-size:42px;margin:0}.certificate-intro p:not(.eyebrow){color:var(--muted);line-height:1.6}.mini-certificate{aspect-ratio:1.5;background:#fff8e8;color:#10213c;border:9px double #d7a019;padding:22px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;box-shadow:0 20px 45px rgba(0,0,0,.28);transform:rotate(2deg)}.mini-certificate>span{font-size:10px;letter-spacing:.12em;font-weight:900;color:#147e82}.mini-certificate strong{font-family:"Playfair Display";font-size:23px;margin-top:8px}.mini-certificate small{color:#6f6043}.mini-certificate img{width:72px;height:72px;object-fit:cover;border-radius:18px;margin-top:10px;box-shadow:0 8px 20px rgba(20,39,70,.22)}.mini-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;border:1px solid var(--line);border-radius:22px;overflow:hidden;background:var(--line)}.mini-stats div{background:rgba(10,34,55,.92);padding:20px;text-align:center}.mini-stats strong,.mini-stats span{display:block}.mini-stats strong{font-size:25px;color:var(--aqua)}.mini-stats span{font-size:11px;color:var(--muted)}
.quiz-screen{max-width:1040px;margin:auto}.quiz-topbar{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px}.back-button{width:46px;height:46px;border-radius:50%;font-size:22px}.quiz-meta{display:flex;justify-content:space-between;color:var(--muted)}.quiz-meta strong{color:var(--aqua)}.score-pill{padding:10px 15px;border-radius:99px;background:rgba(255,210,38,.13);color:var(--yellow)}.progress-track{height:8px;background:rgba(255,255,255,.09);border-radius:99px;overflow:hidden;margin:18px 0 27px}.progress-track div{height:100%;background:linear-gradient(90deg,var(--aqua),var(--blue),var(--purple));transition:.35s}.quiz-layout{display:grid;grid-template-columns:190px 1fr;gap:18px}.money-ladder{border:1px solid var(--line);border-radius:22px;padding:18px;background:rgba(7,29,47,.88);align-self:start}.money-ladder p{font-size:11px;letter-spacing:.14em;color:var(--aqua);font-weight:800}.money-ladder ol{list-style:none;padding:0;margin:0;display:flex;flex-direction:column-reverse;gap:4px}.money-ladder li{display:flex;justify-content:space-between;padding:7px 9px;border-radius:8px;color:var(--muted);font-size:12px}.money-ladder li.current{background:linear-gradient(90deg,var(--blue),var(--purple));color:#fff;font-weight:800}.money-ladder li.safe{color:var(--yellow)}.question-card{padding:clamp(25px,5vw,45px);border:1px solid var(--line);border-radius:28px;background:linear-gradient(145deg,rgba(15,46,71,.97),rgba(8,28,47,.96));box-shadow:var(--shadow)}.question-header{display:flex;justify-content:space-between;align-items:center}.difficulty-pill{padding:8px 12px;border-radius:99px;background:rgba(66,245,230,.13);color:var(--aqua);font-size:11px;font-weight:800}.timer{width:58px;height:58px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(145deg,var(--blue),var(--purple));font-weight:800}.question-kicker{margin:27px 0 10px;color:var(--muted);font-size:11px;letter-spacing:.15em;font-weight:800}.question-card h2{font-size:clamp(30px,5vw,49px);line-height:1.12;margin:0}.yoruba-hint{color:var(--aqua);font-weight:700}.answers{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:16px}.answer-button{min-height:88px;padding:17px;border:1px solid var(--line);border-radius:18px;background:rgba(12,40,62,.94);color:var(--text);text-align:left;display:flex;align-items:center;gap:13px;cursor:pointer;font-weight:700;transition:.18s}.answer-button:hover:not(:disabled){transform:translateY(-2px);border-color:var(--aqua)}.answer-letter{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:rgba(66,245,230,.12);color:var(--aqua);flex:none}.answer-button.correct{background:rgba(0,168,105,.32);border-color:#26e89e}.answer-button.wrong{background:rgba(232,37,93,.27);border-color:#ff477d}.answer-button.revealed{background:rgba(255,174,27,.2);border-color:#ffbd3f;box-shadow:0 0 0 1px rgba(255,189,63,.18)}.answer-button.removed{opacity:.18;pointer-events:none}.lifelines{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:16px 0}.lifelines button{padding:11px;border:1px solid var(--line);border-radius:15px;background:rgba(10,34,55,.9);color:var(--text);cursor:pointer}.lifelines strong,.lifelines span{display:block}.lifelines strong{color:var(--aqua)}.lifelines span{font-size:10px;color:var(--muted)}.lifelines button:disabled{opacity:.32}.audience-poll{height:128px;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;align-items:end;margin:4px 0 16px;padding:15px 17px 10px;border:1px solid var(--line);border-radius:18px;background:rgba(7,29,47,.88)}.audience-poll[hidden]{display:none}.audience-poll div{height:100%;display:grid;grid-template-rows:1fr auto auto;justify-items:center;align-items:end;gap:2px}.audience-poll div>span{width:72%;min-height:3px;border-radius:8px 8px 2px 2px;background:linear-gradient(0deg,var(--blue),var(--aqua));box-shadow:0 0 18px rgba(66,245,230,.2)}.audience-poll b{color:var(--aqua)}.audience-poll small{color:var(--muted);font-size:10px}.feedback-panel{padding:18px;border-radius:20px;border:1px solid var(--line);background:rgba(12,40,62,.97);align-items:center;justify-content:space-between;gap:14px}.feedback-panel:not([hidden]){display:flex}.feedback-panel>div{display:flex;align-items:center;gap:12px}.feedback-panel p{margin:4px 0 0;color:var(--muted)}.feedback-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:#0b9f71;font-size:22px}
.result-screen{max-width:760px;margin:auto}.result-card{text-align:center;padding:clamp(30px,6vw,60px);border-radius:33px;border:1px solid var(--line);background:linear-gradient(145deg,rgba(10,34,55,.98),rgba(26,20,67,.94));box-shadow:var(--shadow)}.result-emblem{font-size:58px}.result-card h2{font-size:55px;margin:5px 0}.result-card>p:not(.eyebrow){color:var(--muted)}.score-ring{width:190px;height:190px;border-radius:50%;display:grid;place-items:center;margin:28px auto;position:relative;background:conic-gradient(var(--aqua) 0deg,var(--purple) 0deg,rgba(255,255,255,.08) 0deg)}.score-ring:before{content:"";position:absolute;inset:13px;border-radius:50%;background:#0c2037}.score-ring div{position:relative;z-index:1;display:grid}.score-ring strong{font-family:"Playfair Display";font-size:56px}.score-ring span{color:var(--muted)}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-radius:17px;overflow:hidden}.result-stats div{padding:16px}.result-stats div+div{border-left:1px solid var(--line)}.result-stats strong,.result-stats span{display:block}.result-stats strong{color:var(--aqua);font-size:22px}.result-stats span{font-size:11px;color:var(--muted)}.certificate-form{text-align:left;margin:25px 0;padding:19px;border:1px solid var(--line);border-radius:18px;background:rgba(0,0,0,.13)}.certificate-form label{display:block;font-size:12px;color:var(--aqua);font-weight:800;margin-bottom:8px}.certificate-form>div{display:flex;gap:8px}.certificate-form input{min-width:0;flex:1;border:1px solid var(--line);background:#071a2d;color:#fff;border-radius:13px;padding:13px}.certificate-button{border:0;color:#201300;background:linear-gradient(120deg,var(--yellow),var(--orange))}.certificate-form p{margin:7px 0 0;color:#ff7794;font-size:12px;min-height:16px}.result-actions{justify-content:center}.app-footer{max-width:1240px;margin:auto;padding:22px 28px 38px;display:flex;justify-content:space-between;gap:12px;color:var(--muted);font-size:11px;letter-spacing:.06em}.online-status{color:var(--aqua)}
@media(max-width:900px){.hero{grid-template-columns:1fr}.question-stage{min-height:410px}.category-grid{grid-template-columns:repeat(2,1fr)}.certificate-intro{grid-template-columns:1fr}.quiz-layout{grid-template-columns:1fr}.money-ladder{order:2}.money-ladder ol{display:grid;grid-template-columns:repeat(5,1fr)}.money-ladder li{display:none}.money-ladder li.current,.money-ladder li.safe{display:flex}.section-title{align-items:start;flex-direction:column}}
@media(max-width:600px){.app-header,.app-shell,.app-footer{padding-left:15px;padding-right:15px}.brand>span:last-child{display:none}.hero{padding:30px 21px;border-radius:27px;min-height:auto}.question-stage{min-height:300px}.question-stage img{width:285px}h1{font-size:55px}.hero-subtitle{font-size:16px}.hero-actions>*{width:100%}.home-toolbar{grid-template-columns:1fr}.difficulty-select{overflow:auto;flex-wrap:nowrap}.difficulty{white-space:nowrap}.category-grid{grid-template-columns:1fr}.category-card{min-height:160px}.mini-stats{grid-template-columns:1fr 1fr}.answers{grid-template-columns:1fr}.lifelines button span{display:none}.feedback-panel:not([hidden]){align-items:stretch;flex-direction:column}.feedback-panel .primary-button{width:100%}.certificate-form>div{flex-direction:column}.result-card h2{font-size:43px}.app-footer{flex-direction:column;text-align:center}.money-ladder{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}