:root{font-family:'DM Sans',system-ui,-apple-system,sans-serif;color:#20352f;background:#f8f5ef;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}html{min-height:100%;background:#f8f5ef}body{margin:0;min-height:100vh}button,a{font:inherit}button{cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible{outline:3px solid #bd7b2f;outline-offset:3px}svg{flex:none}#app{min-height:100vh}html[dir=rtl]{font-family:'Tajawal',system-ui,sans-serif}html[dir=rtl] h1,html[dir=rtl] h2,html[dir=rtl] strong{font-family:'Tajawal',sans-serif;letter-spacing:0}
.topbar{height:78px;max-width:900px;padding:env(safe-area-inset-top) 24px 0;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:16px}.topbar.compact{height:76px}.brand{display:inline-flex;align-items:center;gap:10px;border:0;background:none;color:#1c342d;font-family:Outfit,system-ui,sans-serif;font-weight:800;font-size:20px;letter-spacing:-.8px;padding:0}.brand-mark{width:34px;height:34px;display:grid;place-items:center;flex:none;border-radius:11px;overflow:hidden}.brand-mark img{display:block;width:100%;height:100%}.language-switch{display:flex;align-items:center;gap:2px;border:1px solid #e6e4dd;border-radius:100px;background:#f0eee8;padding:3px;white-space:nowrap}.language-switch button{border:0;background:transparent;color:#75847d;border-radius:100px;padding:5px 8px;font-size:11px;font-weight:800;min-width:29px}.language-switch button.active{background:#fff;color:#17352c;box-shadow:0 1px 5px #17352c1a}
.page{max-width:900px;margin:0 auto;padding:13px 24px calc(105px + env(safe-area-inset-bottom));animation:appear .25s ease}.home-page{padding-top:9px}@keyframes appear{from{opacity:.5;transform:translateY(7px)}to{opacity:1;transform:none}}.hero{min-height:276px;border-radius:26px;position:relative;overflow:hidden;background:#17352e;color:white;display:flex;align-items:center;padding:33px 32px;isolation:isolate;box-shadow:0 18px 36px #17352e16}.hero:before{content:'';position:absolute;inset:auto -80px -140px auto;width:340px;height:340px;background:radial-gradient(circle,#3f7563a0,transparent 65%);z-index:-1}.hero-content{position:relative;z-index:2;max-width:460px}.eyebrow{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:1.8px;display:flex;align-items:center;gap:9px}.eyebrow.light{color:#d8e8d9}.eyebrow-dot{height:7px;width:7px;border-radius:100%;background:#f6be77;box-shadow:0 0 0 4px #f6be772b}.hero h1{font-family:Outfit,system-ui,sans-serif;font-size:clamp(35px,6vw,54px);letter-spacing:-2.3px;line-height:1.03;max-width:380px;margin:22px 0 12px}.hero p{font-size:15px;line-height:1.6;color:#d5e5dc;max-width:390px;margin:0}.hero-meta{display:inline-flex;align-items:center;gap:8px;font-weight:700;color:#f7c88b;font-size:12px;margin-top:27px}.hero-emblem{position:absolute;width:210px;height:210px;right:-20px;bottom:-48px;border:1px solid #ffffff2c;border-radius:100%;display:grid;place-items:center;transform:rotate(-20deg)}.hero-emblem:before,.hero-emblem:after{content:'';position:absolute;border-radius:100%;border:1px solid #ffffff2c}.hero-emblem:before{inset:22px}.hero-emblem:after{inset:46px}.emblem-inner{font-size:110px;font-family:serif;color:#ffc680;line-height:1;text-shadow:0 6px 18px #0002}.hero-orbit{position:absolute;border:1px solid #ffffff14;border-radius:100%;z-index:-1}.orbit-one{width:370px;height:370px;right:-130px;top:-190px}.orbit-two{width:280px;height:280px;right:110px;bottom:-220px}
.section{margin-top:33px}.section-heading{display:flex;justify-content:space-between;align-items:end;margin:0 0 15px}.kicker{text-transform:uppercase;letter-spacing:1.75px;font-size:10px;font-weight:800;color:#b77a39}.section-heading h2,.section h2{font-family:Outfit,system-ui,sans-serif;font-size:24px;letter-spacing:-.7px;margin:5px 0 0}.exam-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.exam-card{position:relative;text-align:start;background:#fff;border:1.5px solid #e8e7df;border-radius:20px;padding:17px 17px 21px;min-height:167px;display:flex;flex-direction:column;box-shadow:0 5px 16px #1b352208;color:#20372e;transition:transform .18s,box-shadow .18s,border-color .18s}.exam-card:hover,.mode-card:hover,.topic-card:hover{transform:translateY(-2px);box-shadow:0 11px 24px #1b352213}.exam-card.selected{border-color:#345f4d;box-shadow:0 0 0 2px #345f4d16,0 8px 25px #1b35220d}.exam-top{display:flex;justify-content:space-between;align-items:start;margin-bottom:auto}.exam-icon{width:40px;height:40px;display:grid;place-items:center;border-radius:13px;background:#e9f2ed;color:#2c6350}.exam-card:nth-child(2) .exam-icon{background:#fdf0de;color:#b97532}.exam-num{font-family:Outfit;font-weight:800;color:#cdd8d0;font-size:22px}.exam-title{font-family:Outfit,system-ui,sans-serif;font-size:17px;font-weight:800;letter-spacing:-.5px;line-height:1.12;margin-top:17px;padding-right:22px}.exam-note{font-size:11px;color:#718078;line-height:1.4;margin-top:5px;padding-right:14px}.exam-select{position:absolute;right:16px;bottom:17px;color:#4d8064}.mode-card,.resume-card{width:100%;display:flex;align-items:center;gap:15px;border:1px solid #e9e6df;background:#fff;color:#24392f;border-radius:18px;padding:15px;text-align:start;margin-bottom:10px;box-shadow:0 3px 14px #1b352208;transition:transform .18s,box-shadow .18s}.mode-icon,.resume-icon{width:48px;height:48px;border-radius:14px;display:grid;place-items:center}.mode-icon.soft{background:#e7f0e9;color:#347255}.mode-icon.warm{background:#fdf1df;color:#c17b36}.mode-text{display:flex;flex-direction:column;gap:4px;flex:1}.mode-text strong,.resume-card strong{font-family:Outfit;font-size:16px}.mode-text small,.resume-card small{font-size:12px;color:#77827a}.mode-arrow{color:#708f7a}.resume-card{background:#f6efe1;border-color:#eed8b7}.resume-icon{background:#eac180;color:#513c24}.resume-card>span:nth-child(2){flex:1;display:flex;flex-direction:column;gap:4px}.exam-language,.content-note{display:flex;align-items:start;gap:8px;color:#79847d;font-size:12px;line-height:1.5;margin:16px 3px}.exam-language svg{margin-top:1px}.footnote{text-align:center;color:#879189;font-size:11px;margin-top:36px}.footnote button{border:0;background:none;color:#446954;font-weight:700;font-size:11px;display:inline-flex;align-items:center;gap:3px}
.bottom-nav{position:fixed;z-index:10;bottom:0;left:0;right:0;background:#fffefaef;backdrop-filter:blur(18px);border-top:1px solid #e8e9e2;display:flex;justify-content:space-around;padding:8px max(15px,calc((100vw - 850px)/2)) calc(7px + env(safe-area-inset-bottom));box-shadow:0 -8px 24px #17352c08}.bottom-nav button{background:transparent;border:0;color:#9aa69e;display:flex;flex-direction:column;align-items:center;gap:4px;padding:5px 17px;min-width:80px;font-size:10px;font-weight:800}.bottom-nav button.active{color:#2c6248}.bottom-nav button.active svg{filter:drop-shadow(0 3px 5px #2c62482b)}.page-heading{margin:26px 0 28px}.page-heading h1{font-family:Outfit,system-ui,sans-serif;font-size:clamp(36px,5vw,50px);line-height:1.05;letter-spacing:-1.8px;margin:11px 0}.page-heading p{color:#7a8980;font-size:15px;line-height:1.6;max-width:560px;margin:0}.resource-card{background:#1e493a;color:#fff;border-radius:22px;padding:24px;display:flex;gap:18px;box-shadow:0 12px 30px #1b4a3820}.resource-icon{background:#ffffff20;border-radius:15px;width:50px;height:50px;display:grid;place-items:center;flex:none;color:#f3c68e}.resource-label{font-size:10px;font-weight:800;letter-spacing:1.4px;color:#b7d1bd}.resource-card h2{font-family:Outfit;font-size:22px;letter-spacing:-.5px;margin:4px 0 5px}.resource-card p{font-size:13px;line-height:1.5;color:#d6e7da;margin:0 0 14px}.resource-card a{color:#f4cb8f;text-decoration:none;font-size:12px;font-weight:800;display:inline-flex;align-items:center;gap:6px}.topic-card{width:100%;display:flex;align-items:center;gap:17px;padding:18px 15px;border:1px solid #e7e9e1;border-radius:16px;background:white;color:#20382e;text-align:start;margin:10px 0;box-shadow:0 3px 12px #20382e08;transition:transform .18s,box-shadow .18s}.topic-index{font:800 20px Outfit;color:#c1d3c7}.topic-text{display:flex;flex:1;flex-direction:column;gap:3px}.topic-text strong{font-size:15px}.topic-text small{color:#8b968e;font-size:11px}.topic-card>svg{color:#7b9a82}.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.stat-card{background:white;border:1px solid #e9e9e2;border-radius:17px;padding:21px 11px;text-align:center;display:flex;flex-direction:column;gap:4px}.stat-card strong{font:800 27px Outfit;color:#2b6048}.stat-card span{font-size:10px;font-weight:700;color:#88968c}.history-row{width:100%;background:white;border:1px solid #e9e9e2;border-radius:15px;padding:13px;display:flex;align-items:center;gap:12px;text-align:start;color:#284033;margin:8px 0}.history-icon{width:35px;height:35px;border-radius:10px;display:grid;place-items:center;background:#e4f1e8;color:#478660}.history-icon.miss{background:#fff0e4;color:#c27b4d}.history-row>span:nth-child(2){flex:1;display:flex;flex-direction:column;gap:2px}.history-row strong{font-size:13px}.history-row small{font-size:10px;color:#8b968e}.history-row b{font:800 16px Outfit}.empty-state{text-align:center;background:white;border:1px dashed #cddbd0;border-radius:18px;padding:29px;color:#7d9382}.empty-state svg{color:#86a891}.empty-state p{font-size:13px;line-height:1.5}.pill-button{border:0;border-radius:100px;background:#e6f0e9;color:#2e6d4d;padding:9px 15px;font-weight:800;font-size:12px;display:inline-flex;align-items:center;gap:8px}.text-button{border:0;background:none;color:#477157;font-size:13px;font-weight:800;display:block;margin:18px auto;padding:10px}.text-button.danger{color:#ad6b51}.back-button{border:0;background:none;color:#627969;font-size:13px;font-weight:800;display:inline-flex;align-items:center;gap:6px;padding:0;transform:rotate(0)}.back-button svg{transform:rotate(180deg)}.source-row{display:flex;align-items:center;justify-content:space-between;text-decoration:none;border-bottom:1px solid #e1e5dd;padding:17px 2px;font-size:13px;font-weight:700;color:#345d47}.about-highlight{display:flex;align-items:center;gap:14px;background:#f7eddc;padding:16px;border-radius:15px;color:#6e532f}.about-highlight p{font-size:13px;line-height:1.5;margin:0}
.quiz-shell{min-height:100vh;background:#fbfaf6;display:flex;flex-direction:column}.quiz-header{width:min(900px,100%);margin:0 auto;padding:calc(13px + env(safe-area-inset-top)) 24px 14px;display:flex;align-items:center;gap:13px;color:#40594b;font-size:13px;font-weight:800}.quiz-header>span{flex:1;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.icon-button{border:0;background:#edf1eb;border-radius:11px;width:38px;height:38px;display:grid;place-items:center;color:#466651}.quiz-timer{display:flex;align-items:center;gap:6px;background:#e9f1e9;border-radius:100px;padding:8px 11px;color:#3f7855;font:800 13px Outfit}.quiz-timer.urgent{background:#fae8df;color:#b15945}.quiz-progress{height:5px;background:#e6ebe4}.quiz-progress>div{height:100%;background:#d9a262;transition:width .2s}.quiz-main{width:min(650px,100%);margin:0 auto;flex:1;padding:23px 24px 110px}.quiz-language{display:flex;justify-content:flex-end;margin:0 0 24px}.question-meta{display:flex;justify-content:space-between;gap:10px;text-transform:uppercase;letter-spacing:1.2px;font-size:10px;font-weight:800;color:#9caa9d}.question-meta>span:last-child{color:#b9884d;text-align:end}.question-title{font-family:Outfit,system-ui,sans-serif;font-size:clamp(26px,6vw,38px);line-height:1.22;letter-spacing:-1.1px;color:#20392e;margin:23px 0 28px}.question-note{background:#edf5ee;color:#5d7b66;border-radius:10px;padding:9px 12px;font-size:12px;line-height:1.45;display:flex;align-items:start;gap:7px;margin-top:-9px;margin-bottom:20px}.answers{display:flex;flex-direction:column;gap:11px}.answer{display:flex;align-items:center;gap:13px;width:100%;min-height:67px;text-align:start;background:#fff;border:1.5px solid #e1e7de;border-radius:16px;padding:12px 16px;color:#294035;box-shadow:0 3px 11px #20382e08;font-size:14px;font-weight:600;line-height:1.4;transition:border-color .15s,background .15s,transform .15s}.answer:hover:not(:disabled){transform:translateY(-1px);border-color:#a1bba6}.answer.chosen{border-color:#418364;background:#f2f8f2;box-shadow:0 0 0 2px #41836414}.answer.correct{border-color:#4e9a6a;background:#f0f8f0}.answer.wrong{border-color:#db947c;background:#fff3ec}.answer-letter{width:34px;height:34px;display:grid;place-items:center;flex:none;border:1px solid #e2e8e0;border-radius:9px;color:#8b9b8f;font:800 13px Outfit}.answer.chosen .answer-letter{background:#477e60;border-color:#477e60;color:white}.answer>span:nth-child(2){flex:1}.answer-status{color:#4b9066;display:grid;place-items:center}.feedback{margin-top:24px;padding:17px;border-radius:15px;background:#eaf5eb;color:#35644b}.feedback.bad{background:#fff1e8;color:#875b46}.feedback strong{display:flex;align-items:center;gap:7px;font-size:14px}.feedback p{font-size:13px;line-height:1.55;margin:8px 0 0}.notice{color:#bd6244;font-size:12px;font-weight:700}.quiz-action{position:fixed;bottom:0;left:0;right:0;padding:12px 24px calc(16px + env(safe-area-inset-bottom));background:#fbfaf6eF;backdrop-filter:blur(12px);border-top:1px solid #e7ede5}.quiz-action .primary-button{max-width:602px;margin:auto}.primary-button,.secondary-button{display:flex;align-items:center;justify-content:center;gap:10px;border:0;border-radius:14px;padding:15px 18px;min-height:54px;font-size:14px;font-weight:800;width:100%;background:#24563e;color:white;box-shadow:0 7px 15px #24563e22}.primary-button:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}.secondary-button{background:#e8f0e8;color:#2d6446;box-shadow:none;margin-top:10px}.result-page{text-align:center;max-width:550px;padding-top:35px}.result-medal{width:78px;height:78px;border-radius:25px;display:grid;place-items:center;background:#dcf0dc;color:#3f8958;margin:0 auto 23px;transform:rotate(-8deg)}.result-medal.retry{background:#f9e9d5;color:#bc8540}.result-page h1{font:800 clamp(30px,6vw,41px) Outfit;line-height:1.1;letter-spacing:-1.3px;margin:9px 0}.result-sub{font-size:13px;color:#869388;margin:0}.score-ring{margin:31px auto 22px;width:215px;height:215px;border-radius:50%;background:conic-gradient(#3e865d var(--score),#e6eee5 0);display:grid;place-items:center;box-shadow:0 10px 28px #1d49331a}.score-ring>div{width:178px;height:178px;border-radius:50%;background:#fbfaf6;display:flex;flex-direction:column;align-items:center;justify-content:center}.score-ring strong{font:800 52px Outfit;letter-spacing:-2px}.score-ring strong span{font-size:22px;color:#a4afa5}.score-ring small{font-size:12px;color:#7c8d7e}.result-metrics{display:flex;justify-content:center;gap:22px;border-top:1px solid #e5eae2;border-bottom:1px solid #e5eae2;margin:0 0 22px;padding:17px}.result-metrics span{font-size:12px;color:#87948a}.result-metrics strong{display:block;font:800 19px Outfit;color:#294e38}.pilot-note{font-size:12px;color:#7d8d7e;display:flex;align-items:center;justify-content:center;gap:7px;margin:0 0 23px}.result-page .content-note{justify-content:center;margin-top:24px}.review-page{max-width:650px}.review-card{background:#fff;border:1px solid #e5e9e2;border-radius:17px;padding:20px;margin:12px 0}.review-top{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:11px;font-weight:800;color:#95a39a}.review-badge{border-radius:100px;padding:5px 9px;background:#e4f2e8;color:#44845d}.review-badge.wrong{background:#fff0e6;color:#b97354}.review-badge.pilot{background:#f1f0e8;color:#8b8b78}.review-card h2{font-family:Outfit;font-size:17px;line-height:1.35;letter-spacing:-.3px;margin:15px 0}.review-card p{font-size:12px;line-height:1.5;color:#617769}.review-explanation{background:#f5f8f2;padding:12px;border-radius:9px}.review-page>.primary-button{margin-top:23px}
html[dir=rtl] .hero-emblem{right:auto;left:-20px}html[dir=rtl] .exam-select{right:auto;left:16px}html[dir=rtl] .exam-title,html[dir=rtl] .exam-note{padding-right:0;padding-left:22px}html[dir=rtl] .back-button svg{transform:none}html[dir=rtl] .mode-arrow svg,html[dir=rtl] .topic-card>svg,html[dir=rtl] .primary-button>svg,html[dir=rtl] .footnote svg{transform:scaleX(-1)}html[dir=rtl] .quiz-timer{direction:ltr}
.visual-answers{flex-direction:row;gap:9px}.visual-answer{position:relative;flex:1;min-width:0;height:154px;display:flex;align-items:center;justify-content:center;background:white;border:1.5px solid #e1e7de;border-radius:17px;color:#3a7458;box-shadow:0 3px 11px #20382e08}.visual-answer>svg{width:51px;height:51px}.visual-answer.chosen{border-color:#418364;background:#f2f8f2;box-shadow:0 0 0 2px #41836414}.visual-answer.correct{border-color:#4e9a6a;background:#f0f8f0}.visual-answer.wrong{border-color:#db947c;background:#fff3ec}.visual-letter{position:absolute;top:10px;left:11px;font:800 12px Outfit;color:#9daea0}.visual-check{position:absolute;bottom:10px;right:11px;color:#4b9066}
@media(min-width:700px){.home-page{padding-top:20px}.hero{min-height:330px}.hero-emblem{right:38px;bottom:-25px;width:250px;height:250px}.exam-card{min-height:180px;padding:20px}.exam-title{font-size:21px}.exam-note{font-size:12px}.section{margin-top:39px}.mode-card{padding:18px}.page{padding-left:32px;padding-right:32px}.quiz-main{padding-top:42px}}
@media(max-width:400px){.topbar{padding-left:16px;padding-right:16px}.page{padding-left:16px;padding-right:16px}.hero{padding:26px 23px;min-height:260px}.hero h1{font-size:34px}.hero-emblem{opacity:.35}.exam-grid{gap:8px}.exam-card{padding:13px;min-height:167px}.exam-title{font-size:15px}.exam-note{font-size:10px}.exam-select{right:12px;bottom:12px}.language-switch button{padding:5px 6px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}
.bottom-nav button{flex:1;min-width:0;padding:5px 6px;line-height:1.15}
.learn-page{max-width:660px}.learn-area-list{display:grid;gap:12px}.learn-area-card{width:100%;display:flex;align-items:center;gap:17px;text-align:start;border:1px solid #e2e8df;border-radius:20px;background:#fff;color:#244332;padding:18px;min-height:104px;box-shadow:0 4px 16px #1b35220a;transition:transform .18s,box-shadow .18s}.learn-area-card:hover,.learn-practice-card:hover,.learn-lesson-row:hover{transform:translateY(-2px);box-shadow:0 10px 22px #1b352216}.learn-area-icon{display:grid;place-items:center;flex:none;width:54px;height:54px;border-radius:16px;background:#e5f0e8;color:#387054}.learn-area-icon.family{background:#fcf0df;color:#bb7737}.learn-area-icon.norway{background:#e8edf4;color:#527090}.learn-area-copy{display:flex;flex:1;min-width:0;flex-direction:column;gap:5px}.learn-area-copy small{font-size:10px;font-weight:800;letter-spacing:.7px;text-transform:uppercase;color:#9a8063}.learn-area-copy strong{font:800 18px/1.3 Outfit,system-ui,sans-serif}.learn-area-card>svg{color:#63876f}.learn-source-link{display:flex;align-items:center;gap:10px;margin-top:24px;padding:15px 3px;color:#426c52;font-size:13px;font-weight:800;text-decoration:none}.learn-source-link span{flex:1}.learn-practice-card{display:flex;align-items:center;gap:15px;width:100%;min-height:92px;padding:17px;text-align:start;border:0;border-radius:19px;background:#1e493a;color:#fff;box-shadow:0 10px 24px #1b4a3820;transition:transform .18s,box-shadow .18s}.learn-practice-icon{display:grid;place-items:center;flex:none;width:52px;height:52px;border-radius:15px;background:#ffffff21;color:#f3c68e}.learn-practice-card span:nth-child(2){display:flex;flex:1;flex-direction:column;gap:5px}.learn-practice-card strong{font:800 17px Outfit,system-ui,sans-serif}.learn-practice-card small{font-size:11px;color:#cee2d1}.learn-lesson-list{display:grid;gap:9px}.learn-lesson-row{display:flex;align-items:center;gap:13px;min-height:64px;padding:14px;border:1px solid #e5e9e2;border-radius:15px;background:#fff;color:#254332;text-decoration:none;font-size:14px;font-weight:700;box-shadow:0 3px 12px #20382e08;transition:transform .18s,box-shadow .18s}.learn-lesson-row>span:nth-child(2){flex:1}.learn-lesson-row>svg{color:#62876f}.lesson-index{font:800 13px Outfit;color:#9ab9a3}html[dir=rtl] .learn-area-card>svg,html[dir=rtl] .learn-practice-card>svg{transform:scaleX(-1)}
.learn-lesson-row{width:100%;text-align:start;cursor:pointer}.lesson-copy{display:flex;flex:1;min-width:0;flex-direction:column;gap:4px}.lesson-copy strong{font-size:14px;line-height:1.3}.lesson-copy small{font-size:11px;font-weight:600;color:#819185}html[dir=rtl] .learn-lesson-row>svg{transform:scaleX(-1)}
.mistake-tabs{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:0 0 22px}.mistake-tabs button{display:flex;align-items:center;justify-content:space-between;gap:7px;text-align:start;border:1.5px solid #e3e9e1;border-radius:13px;background:#fff;color:#52685a;padding:12px;font-size:12px;font-weight:800}.mistake-tabs button.active{border-color:#3f7b59;background:#eff6ef;color:#24573d}.mistake-tabs span{min-width:24px;text-align:center;border-radius:100px;background:#edf1e9;padding:4px 6px;font-size:11px}.mistake-count{font-size:13px;color:#697f70;margin:0 0 13px}.mistake-list{margin-top:23px}.mistake-card{background:#fff;border:1px solid #e5e9e2;border-radius:17px;padding:18px;margin:10px 0;box-shadow:0 3px 12px #20382e08}.mistake-card h2{font-family:Outfit,system-ui,sans-serif;font-size:17px;line-height:1.35;letter-spacing:-.3px;margin:10px 0 13px}.mistake-card details{border-top:1px solid #edf0e9;padding-top:10px}.mistake-card summary{cursor:pointer;color:#3c7652;font-size:12px;font-weight:800}.mistake-card details p{font-size:12px;line-height:1.55;color:#5f7365;margin:10px 0 0}.mistakes-page .empty-state{margin-top:25px}
.lesson-article{background:#fff;border:1px solid #e3e9e0;border-radius:20px;padding:22px 24px;margin:12px 0 22px;box-shadow:0 5px 18px #1b35220a;color:#34483c;font-size:16px;line-height:1.75}.lesson-article p{margin:0 0 16px}.lesson-article p:last-child{margin-bottom:0}.learn-page>.primary-button{width:100%;justify-content:center}
.lesson-context{margin-top:12px;padding-top:10px;border-top:1px solid #dce7dc;color:#465d4e;font-size:13px;line-height:1.65}.lesson-context summary{cursor:pointer;color:#286447;font-weight:800}.lesson-context p{margin:9px 0 0}.lesson-context p:last-child{margin-bottom:0}
/* One illustrated scene with three tappable places, rather than separate picture cards. */
.visual-answers{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;overflow:hidden;border:2px solid #b8d1c4;border-radius:22px;background:linear-gradient(#dfeeea 0 61%,#cad9c4 61% 67%,#b7c5b3 67% 100%);box-shadow:0 9px 25px #20382e13;padding:22px 8px 15px}.visual-answer{height:156px;border:0;border-radius:14px;background:transparent;box-shadow:none;color:#245b49;display:grid;place-items:center;position:relative;transition:background .15s,box-shadow .15s}.visual-answer:not(:last-child){border-right:1px dashed #6e9b8660}.visual-answer>svg{width:64px;height:64px;padding:10px;border:2px solid #759d89;border-radius:15px;background:#fffdf7;box-shadow:0 5px 9px #244b3121}.visual-answer:hover:not(:disabled),.visual-answer:focus-visible{background:#ffffff71;outline:2px solid #397b5d;outline-offset:-2px}.visual-answer.chosen{background:#f2f8f299;box-shadow:inset 0 0 0 3px #418364}.visual-answer.correct{background:#e0f6df9c}.visual-answer.wrong{background:#ffe2d69c}

/* Compact phone layout and personal settings. */
html,body,#app{width:100%;max-width:100%;overflow-x:hidden}
.topbar{width:100%;min-width:0;height:auto;min-height:calc(66px + env(safe-area-inset-top));padding-top:env(safe-area-inset-top);padding-bottom:10px}
.topbar.compact{height:auto}
.brand{min-width:0}.brand>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.profile-control{display:grid;place-items:center;flex:none;width:43px;height:43px;border:1px solid #dce6dd;border-radius:15px;background:#fff;color:#2b6048;box-shadow:0 3px 12px #17352c0b}
.profile-control.active{background:#e5f0e8;border-color:#8eb79b}
.page{width:100%;min-width:0}.hero-content{min-width:0}.hero h1{overflow-wrap:break-word}
.exam-picker{width:100%;min-width:0;border:1px solid #e0e7de;background:#fff;border-radius:20px;padding:17px 18px;box-shadow:0 5px 16px #1b352208}
.exam-picker label{display:block;margin-bottom:9px;color:#75887a;font-size:11px;font-weight:800;letter-spacing:.8px;text-transform:uppercase}
.exam-select-wrap{position:relative;min-width:0}
.exam-select-wrap select{display:block;width:100%;max-width:100%;min-height:55px;padding:11px 44px 11px 15px;appearance:none;-webkit-appearance:none;border:1.5px solid #abc7b4;border-radius:13px;background:#f5faf5;color:#203b2d;font:800 16px Outfit,system-ui,sans-serif;white-space:normal}
.exam-select-wrap select:focus-visible{outline:3px solid #bd7b2f;outline-offset:2px}
.exam-dropdown-arrow{pointer-events:none;position:absolute;right:16px;top:50%;transform:translateY(-50%) rotate(90deg);display:grid;place-items:center;color:#386e50}
.exam-picker p{margin:10px 2px 0;color:#78877c;font-size:12px;line-height:1.45}
.settings-page{max-width:660px}.settings-page .page-heading{margin-top:20px;margin-bottom:20px}
.settings-panel{border:1px solid #e3e9e1;border-radius:22px;background:#fff;padding:20px;margin:12px 0;box-shadow:0 5px 18px #1b35220a;min-width:0}
.settings-panel h2{font:800 17px Outfit,system-ui,sans-serif;margin:0 0 13px;color:#213c30}
.settings-panel .exam-picker{padding:0;border:0;box-shadow:none}.settings-panel .exam-picker label{display:none}
.settings-profile{display:flex;align-items:center;gap:14px;min-width:0}.settings-avatar{display:grid;place-items:center;flex:none;width:54px;height:54px;border-radius:18px;background:#e7f1e9;color:#2c6a4c}
.settings-profile>div{display:flex;min-width:0;flex-direction:column;gap:3px}.settings-profile strong{font:800 19px Outfit,system-ui,sans-serif}.settings-profile small,.settings-hint{color:#77867c;font-size:12px;line-height:1.5}
.settings-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:18px}.settings-stats button{display:flex;min-width:0;flex-direction:column;gap:3px;align-items:flex-start;border:1px solid #e3ebe1;border-radius:14px;background:#f7faf6;padding:13px;color:#335c42;text-align:start}.settings-stats strong{font:800 24px Outfit,system-ui,sans-serif}.settings-stats span{font-size:11px;font-weight:700;line-height:1.3}
.settings-divider{height:1px;background:#edf0e9;margin:20px 0}.settings-panel .language-switch{width:100%;max-width:350px}.settings-panel .language-switch button{flex:1;min-height:42px;font-size:13px}
.settings-hint{margin:-4px 0 13px}.settings-link{width:100%;display:flex;align-items:center;gap:11px;min-height:49px;padding:11px 0;border:0;border-top:1px solid #edf0e9;background:transparent;color:#2e5d42;text-align:start;font-size:14px;font-weight:800}.settings-link span{flex:1}.settings-link.danger{color:#9b4e43}
.mode-text{min-width:0}.mode-text small{line-height:1.4}
html[dir=rtl] .exam-select-wrap select{padding:11px 15px 11px 44px}html[dir=rtl] .exam-dropdown-arrow{right:auto;left:16px}html[dir=rtl] .settings-link>svg:last-child{transform:scaleX(-1)}
@media(max-width:600px){.home-page .hero{min-height:220px;padding:25px 23px}.home-page .hero h1{font-size:clamp(31px,8vw,38px);margin:15px 0 9px}.home-page .hero p{font-size:14px}.home-page .hero-meta{margin-top:16px}.home-page .hero-emblem{opacity:.24}.home-page .section{margin-top:24px}}
@media(max-width:400px){.profile-control{width:40px;height:40px}.hero{padding:25px 22px}.hero h1{font-size:clamp(31px,9vw,36px)}.settings-panel{padding:17px}}

/* The home screen begins with a real, tappable practice question. */
.home-page{max-width:680px}
.home-exam{margin-bottom:14px}
.home-exam .exam-picker{display:flex;align-items:center;gap:15px;padding:10px 13px;border-radius:16px}
.home-exam .exam-picker label{flex:none;margin:0;font-size:10px}
.home-exam .exam-select-wrap{flex:1}
.home-exam .exam-select-wrap select{min-height:44px;padding-block:7px;font-size:14px}
.home-exam .exam-picker p{display:none}
.home-mcq{overflow:hidden;border:1px solid #dce7dd;border-radius:24px;background:#fff;box-shadow:0 12px 30px #17352e0e;padding:0 17px 18px}
.home-mcq-head{margin:0 -17px 17px;padding:22px 21px 24px;background:radial-gradient(circle at 95% 0%,#3d6b59,#17352e 65%);color:#fff}
.home-mcq-kicker{display:flex;align-items:center;gap:8px;color:#f5c489;font-size:11px;font-weight:800;letter-spacing:.5px}
.home-mcq-head h1{font:800 clamp(24px,5.8vw,34px)/1.2 Outfit,system-ui,sans-serif;letter-spacing:-.7px;max-width:610px;margin:16px 0 0;overflow-wrap:break-word}
.home-question-note{display:flex;align-items:start;gap:7px;padding:8px 10px;border-radius:9px;background:#f0f6ed;color:#637968;font-size:11px;line-height:1.4;margin:0 0 12px}
.home-answers{display:grid;gap:9px}
.home-answer{width:100%;min-height:61px;display:flex;align-items:center;gap:11px;text-align:start;border:1.5px solid #dfe8df;border-radius:14px;background:#fff;color:#254335;padding:11px 13px;font-size:14px;font-weight:700;line-height:1.35;transition:transform .15s,border-color .15s,background .15s}
.home-answer:hover{transform:translateY(-1px);border-color:#6eaa83;background:#f6faf5}
.home-answer:active{transform:scale(.99);background:#eaf4ea}
.home-answer-letter{display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:9px;background:#e8f2e9;color:#2d7150;font:800 13px Outfit,system-ui,sans-serif}
.home-answer-text{flex:1;min-width:0;overflow-wrap:break-word}
.home-answer>svg{color:#729b7d}
.home-answer-hint{margin:14px 3px 0;color:#718378;font-size:11px;line-height:1.4}
.home-more{margin-top:22px}
.home-more>.kicker{display:block;margin-bottom:12px}
.home-more .mode-card{margin-bottom:0}
.home-more .exam-language{margin-top:12px}
html[dir=rtl] .home-answer>svg{transform:scaleX(-1)}
@media(max-width:600px){.home-page .home-mcq{min-height:0}.home-page .home-exam{margin-bottom:12px}.home-page .home-more{margin-top:18px}}
@media(max-width:400px){.home-exam .exam-picker{gap:9px;padding:9px 10px}.home-exam .exam-select-wrap select{font-size:13px}.home-mcq-head{padding:20px 18px 21px}.home-mcq-head h1{font-size:24px}.home-answer{font-size:13px;min-height:58px}}

/* A small flag beside the profile button opens the language menu. */
.topbar-actions{display:flex;align-items:center;gap:7px;flex:none}
.language-menu{position:relative;display:flex;align-items:center}
.flag-control{display:grid;place-items:center;width:39px;height:43px;border:0;border-radius:13px;background:transparent;color:#244e3b;font-size:25px;line-height:1}
.flag-control:hover,.flag-control[aria-expanded=true]{background:#eaf1e8}
.flag-control>span{display:block;line-height:1;filter:drop-shadow(0 1px 1px #17352e24)}
.language-popover{position:absolute;z-index:30;top:calc(100% + 7px);right:0;width:174px;padding:5px;border:1px solid #dfe8dd;border-radius:15px;background:#fff;box-shadow:0 14px 36px #17352e28}
.language-popover button{display:flex;align-items:center;gap:10px;width:100%;min-height:43px;padding:7px 9px;border:0;border-radius:10px;background:transparent;color:#294b38;text-align:start;font-size:13px;font-weight:700}
.language-popover button:hover,.language-popover button[aria-checked=true]{background:#edf5ed}
.language-popover button span:nth-child(2){flex:1}
.menu-flag{font-size:20px;line-height:1}
.language-popover svg{color:#327953}
html[dir=rtl] .language-popover{right:auto;left:0}
.language-popover{max-height:min(330px,65vh);overflow-y:auto}
.language-select-wrap{position:relative;display:inline-flex;align-items:center;min-width:155px;max-width:100%}
.language-select{appearance:none;-webkit-appearance:none;width:100%;min-height:39px;padding:7px 34px 7px 13px;border:1px solid #d6e4d9;border-radius:12px;background:#fff;color:#294b38;font:700 13px system-ui,sans-serif;cursor:pointer}
.language-select-wrap>svg{position:absolute;right:11px;transform:rotate(90deg);pointer-events:none;color:#4d785b}
html[dir=rtl] .language-select{padding:7px 13px 7px 34px}
html[dir=rtl] .language-select-wrap>svg{right:auto;left:11px}
.settings-panel .language-select-wrap{width:100%;max-width:350px}
html[data-theme=dark] .language-select{background:#1d3049;border-color:#405b79;color:#edf3fb}
html[data-theme=dark] .language-select-wrap>svg{color:#c5d4e5}

/* A small exam sheet and timer make the mock exam visible at a glance. */
.home-more{margin-top:16px}
.mock-feature{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;gap:15px;width:100%;min-height:123px;padding:18px;border:1.5px solid #e9d4b5;border-radius:23px;background:linear-gradient(115deg,#fff4df 0%,#f4dfbd 100%);box-shadow:0 8px 22px #9f67391c;color:#244235;text-align:start;transition:transform .18s,box-shadow .18s}
.mock-feature:before{content:'';position:absolute;z-index:-1;width:190px;height:190px;border:1px solid #c88e4b33;border-radius:50%;right:-45px;top:-90px;box-shadow:0 0 0 24px #ffffff23,0 0 0 48px #c88e4b12}
.mock-feature:hover{transform:translateY(-2px);box-shadow:0 12px 28px #9f67392b}
.mock-feature:active{transform:scale(.99)}
.mock-visual{position:relative;display:grid;place-items:center;flex:none;width:76px;height:78px}
.mock-paper{display:grid;place-items:center;width:59px;height:71px;border:2px solid #c6dbc9;border-radius:11px;background:#fffdf7;color:#387856;box-shadow:0 5px 11px #7b63432b;transform:rotate(-8deg)}
.mock-clock{position:absolute;right:-4px;bottom:0;display:grid;place-items:center;width:35px;height:35px;border:2px solid #fff7e9;border-radius:50%;background:#d99342;color:#fff;box-shadow:0 4px 8px #8e5a2e38}
.mock-feature-copy{display:flex;flex:1;min-width:0;flex-direction:column;gap:3px;position:relative;z-index:1}
.mock-feature-copy strong{font:800 19px/1.15 Outfit,system-ui,sans-serif;letter-spacing:-.35px}
.mock-feature-copy small{font-size:11px;font-weight:700;color:#936c3d}
.mock-facts{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}
.mock-facts>span{display:inline-flex;align-items:center;gap:4px;padding:5px 7px;border:1px solid #e4c9a2;border-radius:8px;background:#fff9edc9;color:#6c5438;font-size:10px;font-weight:800;white-space:nowrap}
.mock-go{display:grid;place-items:center;flex:none;width:31px;height:31px;border-radius:50%;background:#295b43;color:#fff}
html[dir=rtl] .mock-feature:before{right:auto;left:-45px}
html[dir=rtl] .mock-go svg{transform:scaleX(-1)}
@media(max-width:400px){.mock-feature{gap:11px;padding:14px}.mock-visual{width:66px}.mock-feature-copy strong{font-size:17px}.mock-facts>span{font-size:9px;padding:4px 5px}.mock-go{width:27px;height:27px}}

/* Review saved mistakes as one interactive question at a time. */
.mistakes-page{max-width:680px}
.mistakes-page .page-heading{margin-bottom:15px}
.mistake-exam{margin-bottom:13px}
.mistake-mcq .home-mcq-head h2{font:800 clamp(24px,5.8vw,34px)/1.2 Outfit,system-ui,sans-serif;letter-spacing:-.7px;margin:16px 0 0;overflow-wrap:break-word}
.mistake-head-row{display:flex;align-items:center;justify-content:space-between;gap:10px}
.mistake-head-row .home-mcq-kicker{min-width:0}
.mistake-remove-top{flex:none;display:inline-flex;align-items:center;gap:5px;min-height:32px;padding:5px 8px;border:1px solid #ffffff6b;border-radius:9px;background:#ffffff12;color:#f5e0cb;font-size:11px;font-weight:800}
.mistake-remove-top:hover{background:#ffffff28}
.mistake-mcq .home-answer:disabled{opacity:1;cursor:default;transform:none}
.mistake-mcq .home-answer.chosen{border-color:#4e906a;background:#f2f8f2}
.mistake-mcq .home-answer.correct{border-color:#4e9a6a;background:#ecf8ed}
.mistake-mcq .home-answer.wrong{border-color:#d98d78;background:#fff1e9}
.mistake-mcq .home-answer.chosen .home-answer-letter{background:#3f8261;color:#fff}
.mistake-mcq .home-answer.wrong .home-answer-letter{background:#c9765f;color:#fff}
.mistake-mcq .home-answer>svg{color:#43865b}
.mistake-mcq .feedback{margin-top:17px}
.mistake-mcq .feedback p{margin-top:7px}
.mistake-actions{margin-top:13px}
.mistakes-page .empty-state{margin-top:15px}
.mistakes-page .empty-state h2{font:800 21px Outfit,system-ui,sans-serif;color:#294735;margin:12px 0 4px}
html[dir=rtl] .mistake-actions .primary-button svg{transform:scaleX(-1)}
@media(max-width:400px){.mistake-mcq .home-mcq-head h2{font-size:24px}.mistake-remove-top{font-size:10px}}
.home-mcq-head h1[dir=rtl],.mistake-mcq .home-mcq-head h2[dir=rtl]{font-family:Tajawal,system-ui,sans-serif;letter-spacing:0}

.account-offer{margin:20px 0 24px;padding:22px;border:1px solid #d7e6d9;border-radius:22px;background:#f0f8ef;text-align:start}.account-offer h2{margin:0 0 8px;font:800 21px Outfit,system-ui,sans-serif;color:#204634}.account-offer p{margin:0 0 17px;color:#6a8171;font-size:14px;line-height:1.5}.account-offer .primary-button{width:100%;justify-content:center}.account-offer .text-button{display:block;margin:10px auto 0}.account-panel{padding:24px}.account-provider{display:block;width:100%;margin:0 0 12px;text-align:center;justify-content:center}.account-divider{text-align:center;color:#8a9b8e;font-size:13px;margin:18px 0}.account-panel form{display:grid;gap:14px}.account-panel label{display:grid;gap:7px;color:#405c49;font-size:13px;font-weight:700}.account-panel input{box-sizing:border-box;width:100%;min-height:48px;border:1px solid #cfddce;border-radius:12px;padding:12px 14px;background:#fff;color:#1f3b2d;font:500 16px system-ui,sans-serif}.account-panel input:focus{outline:2px solid #79ac87;outline-offset:1px}.account-panel form .primary-button{margin-top:8px;width:100%;justify-content:center}.account-panel>.text-button{display:block;margin:10px auto 0}.account-page>.content-note{margin-top:20px}.account-panel .notice{margin-top:14px}.account-panel button:disabled{opacity:.55}
.consent-backdrop{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:calc(20px + env(safe-area-inset-top)) 20px calc(20px + env(safe-area-inset-bottom));background:#102b23b8;backdrop-filter:blur(5px)}.consent-dialog{box-sizing:border-box;width:min(100%,410px);max-height:100%;overflow-y:auto;padding:27px;border-radius:26px;background:#fff;box-shadow:0 24px 70px #071b1959;text-align:start}.consent-symbol{display:grid;place-items:center;width:54px;height:54px;margin-bottom:18px;border-radius:17px;background:#e7f3e7;color:#377455}.consent-dialog h2{margin:0 0 10px;color:#203b2b;font:800 24px/1.2 Outfit,system-ui,sans-serif}.consent-dialog p{margin:0 0 23px;color:#62796a;font-size:15px;line-height:1.55}.consent-dialog .primary-button{width:100%;justify-content:center}.consent-dialog .text-button{display:block;margin:12px auto 0}
.confirm-dialog .secondary-button{margin:0 0 10px}.confirm-dialog .primary-button{background:#a64a39;box-shadow:0 7px 15px #a64a3922}html[dir=rtl] .confirm-dialog h2,html[dir=rtl] .confirm-dialog p{font-family:Tajawal,system-ui,sans-serif}html[data-theme=dark] .confirm-dialog .primary-button{background:#ac5949}

/* Progress shows mastery against the complete bank for the selected exam. */
.progress-exam{margin:-8px 0 14px}
.mastery-card{padding:23px;border:1px solid #cddfcf;border-radius:23px;background:linear-gradient(130deg,#eaf5e8,#fffaf0);box-shadow:0 9px 24px #17352e0d}
.mastery-top{display:flex;align-items:center;gap:9px;color:#3a7051;font-size:13px;font-weight:800}
.mastery-symbol{display:grid;place-items:center;width:34px;height:34px;border-radius:11px;background:#d9ecd9}
.mastery-card>strong{display:block;margin:13px 0 16px;font:800 42px/1 Outfit,system-ui,sans-serif;letter-spacing:-1px;color:#1e4432}
.mastery-card>strong span{font-size:22px;color:#748b78}
.mastery-track{height:10px;overflow:hidden;border-radius:100px;background:#d6e5d8}
.mastery-track span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#3d8a5d,#9abf6b);transition:width .3s}
.mastery-bottom{display:flex;justify-content:space-between;margin-top:9px;color:#647d69;font-size:12px;font-weight:700}
.mastery-note{display:flex;align-items:flex-start;gap:8px;margin:12px 3px 22px;color:#64796b;font-size:12px;line-height:1.5}
.mastery-note svg{margin-top:1px}
.theme-options{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.theme-options button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:47px;border:1.5px solid #dce7db;border-radius:13px;background:#f7faf6;color:#466c52;font-size:13px;font-weight:800}
.theme-options button.active{border-color:#3e8060;background:#eaf4e9;color:#1d5338}
.mistake-head-row{flex-wrap:wrap}
.mistake-remove-top{margin-inline-start:auto;max-width:100%;white-space:normal;text-align:start;line-height:1.2}
.mistake-remove-note{margin:0 2px 13px;color:#6b8071;font-size:11px;line-height:1.4}

/* Dark appearance is applied across every screen, including practice and account forms. */
html[data-theme=dark]{color-scheme:dark;background:#0b1424;color:#edf3fb}
html[data-theme=dark] body,html[data-theme=dark] #app{background:#0b1424}
html[data-theme=dark] .brand{color:#edf3fb}
html[data-theme=dark] .brand-mark{background:transparent}
html[data-theme=dark] .profile-control,html[data-theme=dark] .exam-picker,html[data-theme=dark] .home-mcq,html[data-theme=dark] .mode-card,html[data-theme=dark] .exam-card,html[data-theme=dark] .topic-card,html[data-theme=dark] .stat-card,html[data-theme=dark] .history-row,html[data-theme=dark] .empty-state,html[data-theme=dark] .learn-area-card,html[data-theme=dark] .learn-lesson-row,html[data-theme=dark] .lesson-article,html[data-theme=dark] .settings-panel,html[data-theme=dark] .review-card,html[data-theme=dark] .mistake-card{background:#152338;border-color:#334862;color:#edf3fb;box-shadow:0 5px 18px #0003}
html[data-theme=dark] .hero,html[data-theme=dark] .home-mcq-head{background:radial-gradient(circle at 95% 0%,#294566,#102139 68%);color:#fff}
html[data-theme=dark] .hero:before{background:radial-gradient(circle,#41689188,transparent 65%)}
html[data-theme=dark] .resource-card,html[data-theme=dark] .learn-practice-card{background:#1a304b;color:#edf3fb;box-shadow:0 10px 25px #0003}
html[data-theme=dark] .resource-card p,html[data-theme=dark] .learn-practice-card small,html[data-theme=dark] .hero p{color:#c8d7e8}
html[data-theme=dark] .profile-control.active,html[data-theme=dark] .pill-button,html[data-theme=dark] .settings-stats button,html[data-theme=dark] .theme-options button.active{background:#274261;border-color:#5b7897;color:#eaf3fd}
html[data-theme=dark] .bottom-nav,html[data-theme=dark] .quiz-action{background:#101c30eb;border-color:#334862;box-shadow:0 -7px 24px #0003}
html[data-theme=dark] .bottom-nav button{color:#9eb1c8}
html[data-theme=dark] .bottom-nav button.active{color:#e4bd81}
html[data-theme=dark] .page-heading p,html[data-theme=dark] .content-note,html[data-theme=dark] .exam-language,html[data-theme=dark] .exam-picker p,html[data-theme=dark] .home-answer-hint,html[data-theme=dark] .mistake-remove-note,html[data-theme=dark] .mastery-note,html[data-theme=dark] .footnote,html[data-theme=dark] .result-sub,html[data-theme=dark] .pilot-note,html[data-theme=dark] .settings-hint,html[data-theme=dark] .settings-profile small,html[data-theme=dark] .account-divider{color:#adbed2}
html[data-theme=dark] .mode-text small,html[data-theme=dark] .topic-text small,html[data-theme=dark] .lesson-copy small,html[data-theme=dark] .history-row small,html[data-theme=dark] .stat-card span,html[data-theme=dark] .exam-note{color:#adbed2}
html[data-theme=dark] .section-heading h2,html[data-theme=dark] .settings-panel h2,html[data-theme=dark] .mistakes-page .empty-state h2,html[data-theme=dark] .account-offer h2{color:#edf3fb}
html[data-theme=dark] .exam-select-wrap select,html[data-theme=dark] .account-panel input{background:#101c30;border-color:#526b86;color:#edf3fb}
html[data-theme=dark] .exam-picker label,html[data-theme=dark] .account-panel label{color:#c5d4e5}
html[data-theme=dark] .exam-dropdown-arrow,html[data-theme=dark] .back-button,html[data-theme=dark] .settings-link,html[data-theme=dark] .text-button,html[data-theme=dark] .footnote button{color:#e4bd81}
html[data-theme=dark] .settings-divider,html[data-theme=dark] .settings-link,html[data-theme=dark] .result-metrics,html[data-theme=dark] .lesson-context{border-color:#334862}
html[data-theme=dark] .settings-divider{background:#334862}
html[data-theme=dark] .settings-stats button,html[data-theme=dark] .theme-options button,html[data-theme=dark] .icon-button,html[data-theme=dark] .language-switch,html[data-theme=dark] .quiz-timer,html[data-theme=dark] .secondary-button{background:#1d3049;border-color:#405b79;color:#e0ebf7}
html[data-theme=dark] .language-switch button{color:#adbed2}
html[data-theme=dark] .language-switch button.active{background:#385a7d;color:#fff}
html[data-theme=dark] .flag-control{color:#dce8f5}
html[data-theme=dark] .flag-control:hover,html[data-theme=dark] .flag-control[aria-expanded=true],html[data-theme=dark] .language-popover,html[data-theme=dark] .language-popover button:hover,html[data-theme=dark] .language-popover button[aria-checked=true]{background:#1d3049}
html[data-theme=dark] .language-popover{border-color:#405b79}
html[data-theme=dark] .language-popover button{color:#edf3fb}
html[data-theme=dark] .home-answer,html[data-theme=dark] .answer,html[data-theme=dark] .visual-answer{background:#1c2e46;border-color:#405775;color:#edf3fb}
html[data-theme=dark] .home-answer:hover,html[data-theme=dark] .answer:hover:not(:disabled){background:#284461}
html[data-theme=dark] .home-answer-letter,html[data-theme=dark] .answer-letter{background:#2c4767;border-color:#526b86;color:#e4edf7}
html[data-theme=dark] .home-answer.chosen,html[data-theme=dark] .answer.chosen,html[data-theme=dark] .mistake-mcq .home-answer.chosen{background:#294b70;border-color:#8fb4dc}
html[data-theme=dark] .quiz-shell{background:#0b1424}
html[data-theme=dark] .quiz-header,html[data-theme=dark] .question-title{color:#edf3fb}
html[data-theme=dark] .quiz-progress{background:#334862}
html[data-theme=dark] .question-note,html[data-theme=dark] .home-question-note{background:#203753;color:#d1e1f1}
html[data-theme=dark] .feedback,html[data-theme=dark] .account-offer{background:#1c3049;border-color:#405b79;color:#e0ebf7}
html[data-theme=dark] .consent-backdrop{background:#060d1cbd}
html[data-theme=dark] .consent-dialog{background:#152338}html[data-theme=dark] .consent-dialog h2{color:#edf3fb}html[data-theme=dark] .consent-dialog p{color:#c5d4e5}html[data-theme=dark] .consent-symbol{background:#284461;color:#d9e7f6}
html[data-theme=dark] .feedback.bad{background:#53362d;color:#f9d9c8}
html[data-theme=dark] .lesson-context,html[data-theme=dark] .lesson-context summary,html[data-theme=dark] .review-card p,html[data-theme=dark] .mistake-card details p{color:#c5d4e5}
html[data-theme=dark] .review-explanation{background:#203753}
html[data-theme=dark] .score-ring>div{background:#101c30}
html[data-theme=dark] .score-ring strong,html[data-theme=dark] .result-metrics strong,html[data-theme=dark] .stat-card strong{color:#e4bd81}

/* Account actions stay at the profile icon, including a direct sign-out. */
.topbar{position:relative;z-index:12}
.profile-menu{position:relative;display:flex;align-items:center}
.profile-popover{position:absolute;z-index:35;top:calc(100% + 8px);right:0;width:min(260px,calc(100vw - 32px));max-height:min(350px,70vh);overflow-y:auto;padding:7px;border:1px solid #dfe8dd;border-radius:16px;background:#fff;color:#284735;box-shadow:0 16px 40px #17352e2b}
.profile-popover-heading{padding:10px 11px 12px;font-size:13px;font-weight:800;border-bottom:1px solid #e7ece5}
.profile-popover-heading small{display:block;margin-top:4px;font-size:11px;font-weight:500;color:#687d6d;overflow-wrap:anywhere;text-align:start}
.profile-popover button{display:flex;align-items:center;gap:10px;width:100%;min-height:46px;padding:9px 11px;border:0;border-radius:10px;background:transparent;color:#2d6042;text-align:start;font-size:13px;font-weight:800}
.profile-popover button:hover,.profile-popover button:focus-visible{background:#edf5ed}
.profile-popover button:disabled{opacity:.5}
.profile-popover-message{margin:8px 10px;color:#a95743;font-size:11px;line-height:1.4}
.profile-popover-message.success,.notice.success{color:#348452}
html[dir=rtl] .profile-popover{right:auto;left:0}
html[data-theme=dark] .profile-popover{background:#152338;border-color:#405b79;color:#edf3fb}
html[data-theme=dark] .profile-popover-heading{border-color:#334862}
html[data-theme=dark] .profile-popover-heading small{color:#adbed2}
html[data-theme=dark] .profile-popover button{color:#edf3fb}
html[data-theme=dark] .profile-popover button:hover,html[data-theme=dark] .profile-popover button:focus-visible{background:#274261}
html[data-theme=dark] .profile-popover-message.success,html[data-theme=dark] .notice.success{color:#8de5a8}

/* Profile menu and selectable illustrated avatars. */
.profile-control{padding:3px;overflow:hidden;border-radius:16px;transition:transform .18s,border-color .18s,box-shadow .18s}
.profile-control:hover,.profile-control:focus-visible{transform:translateY(-1px);box-shadow:0 8px 18px #17352c24}
.profile-control .avatar-art{width:100%;height:100%;border-radius:12px}
.avatar-art{display:inline-grid;place-items:center;flex:none;width:48px;height:48px;border-radius:16px;color:#fff;box-shadow:inset 0 1px #ffffff70,0 6px 15px #13253c20}
.avatar-north{background:linear-gradient(145deg,#2f7f87,#263c78);color:#fff0bd}
.avatar-fjord{background:linear-gradient(145deg,#5a99b5,#27627d);color:#fff}
.avatar-mountain{background:linear-gradient(145deg,#a88770,#795572);color:#fff3df}
.avatar-book{background:linear-gradient(145deg,#6378ac,#353e76);color:#fff0d7}
.avatar-star{background:linear-gradient(145deg,#d69a56,#b66b65);color:#fff9dc}
.profile-popover{width:min(320px,calc(100vw - 28px));max-height:min(420px,70vh);padding:9px;border-radius:23px;border-color:#dbe5e2;background:#fbfcfa;box-shadow:0 24px 60px #11233235,0 3px 12px #1123320d}
.profile-popover .profile-card-link{display:flex;align-items:center;gap:12px;width:100%;min-height:78px;padding:12px;border:1px solid #d6e4e3;border-radius:17px;background:linear-gradient(110deg,#eff7f3,#f6f9f5);color:#193a39;text-align:start}
.profile-card-copy{display:flex;flex:1;min-width:0;flex-direction:column;gap:3px}
.profile-card-copy strong{font:800 17px Outfit,system-ui,sans-serif}
.profile-card-copy small{font-size:11px;line-height:1.3;color:#59736d;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:start}
.profile-card-link>svg{color:#62847e;flex:none}
.profile-menu-actions{display:grid;gap:3px;padding:7px 2px 0}
.profile-menu-actions button{min-height:47px;border-radius:12px;font-size:13px;font-weight:750;color:#2b514d}
.profile-menu-actions button span{flex:1}
.profile-menu-actions button>svg:last-child{opacity:.55}
.profile-popover-message{margin:9px 10px 2px;font-size:12px}
.avatar-section{margin:0 0 18px;padding:20px;border:1px solid #e1e9e4;border-radius:21px;background:#fff;box-shadow:0 8px 24px #13253c0b}
.avatar-section-head h2{margin:0;font:800 20px Outfit,system-ui,sans-serif;color:#243e35}
.avatar-section-head p{margin:4px 0 17px;color:#73837d;font-size:12px;line-height:1.4}
.avatar-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}
.avatar-choice{position:relative;display:flex;align-items:center;flex-direction:column;gap:7px;min-width:0;min-height:90px;padding:8px 2px 6px;border:1.5px solid transparent;border-radius:15px;background:transparent;color:#52655f;font-size:10px;font-weight:750;line-height:1.1;text-align:center;transition:transform .18s,background .18s,border-color .18s}
.avatar-choice:hover,.avatar-choice:focus-visible{transform:translateY(-2px);background:#f0f6f1}
.avatar-choice.selected{background:#edf5ef;border-color:#8aae9b;color:#214c39}
.avatar-choice .avatar-art{width:46px;height:46px;border-radius:15px}
.avatar-choice b{position:absolute;top:5px;right:3px;width:19px;height:19px;border-radius:50%;display:grid;place-items:center;background:#24694d;color:white}
.account-identity{display:flex;align-items:center;gap:16px;margin-bottom:18px;padding:20px;border:1px solid #c7ddd5;border-radius:23px;background:linear-gradient(120deg,#e8f4ee,#f7f8f2);color:#23453a}
.account-identity .avatar-art{width:64px;height:64px;border-radius:20px}
.account-identity>div{display:flex;min-width:0;flex-direction:column;gap:5px}
.account-identity strong{font:800 19px Outfit,system-ui,sans-serif}
.account-identity span{font-size:13px;overflow-wrap:anywhere}
.account-identity small{font-size:11px;line-height:1.4;color:#637e71}
.account-actions{padding:9px 20px}
.account-actions .settings-link:first-child{border-top:0}
html[dir=rtl] .avatar-choice b{right:auto;left:3px}
html[data-theme=dark] .profile-popover{background:#14233a;border-color:#3b5878;box-shadow:0 24px 60px #0008,0 3px 12px #0004}
html[data-theme=dark] .profile-popover .profile-card-link{background:linear-gradient(120deg,#233d5b,#1b304a);border-color:#537091;color:#f3f7fc}
html[data-theme=dark] .profile-card-copy small{color:#bfd0e2}
html[data-theme=dark] .profile-card-link>svg{color:#d9b984}
html[data-theme=dark] .profile-menu-actions button{color:#e9f2fb}
html[data-theme=dark] .profile-menu-actions button:hover,html[data-theme=dark] .profile-menu-actions button:focus-visible{background:#294562}
html[data-theme=dark] .avatar-section{background:#152338;border-color:#334862;box-shadow:0 8px 24px #0003}
html[data-theme=dark] .avatar-section-head h2{color:#edf3fb}
html[data-theme=dark] .avatar-section-head p{color:#adbed2}
html[data-theme=dark] .avatar-choice{color:#b5c5d7}
html[data-theme=dark] .avatar-choice:hover,html[data-theme=dark] .avatar-choice:focus-visible{background:#203955}
html[data-theme=dark] .avatar-choice.selected{background:#294b6d;border-color:#91b5d2;color:#fff}
html[data-theme=dark] .account-identity{background:linear-gradient(120deg,#243f59,#172a42);border-color:#4d6b87;color:#edf3fb}
html[data-theme=dark] .account-identity small{color:#c4d4e4}

/* Correct answers use mint; ordinary surfaces stay navy. */
html[data-theme=dark] .answer.correct,html[data-theme=dark] .mistake-mcq .home-answer.correct{background:#a4eabd;border-color:#ddffe8;color:#113827;box-shadow:0 0 0 2px #a4eabd55}
html[data-theme=dark] .answer.correct .answer-letter,html[data-theme=dark] .mistake-mcq .home-answer.correct .home-answer-letter{background:#14563b;border-color:#14563b;color:#f0fff4}
html[data-theme=dark] .answer.correct .answer-status,html[data-theme=dark] .mistake-mcq .home-answer.correct .answer-status{color:#14563b}
html[data-theme=dark] .answer.wrong,html[data-theme=dark] .mistake-mcq .home-answer.wrong{background:#783e39;border-color:#ffab92;color:#fff}
html[data-theme=dark] .feedback:not(.bad){background:#173b3c;border:1px solid #6fd99b;color:#eafff1}

/* Scrolling content should not show through the native iPhone status area. */
html[data-platform=ios] body::before{content:"";position:fixed;z-index:40;inset:0 0 auto;height:env(safe-area-inset-top);background:#f8f5ef;pointer-events:none}
html[data-platform=ios][data-theme=dark] body::before{background:#0b1424}
html[data-theme=dark] .result-metrics span,html[data-theme=dark] .score-ring small,html[data-theme=dark] .score-ring strong span{color:#adbed2}
html[data-theme=dark] .mastery-card{background:linear-gradient(130deg,#223b59,#14253b);border-color:#46627f;box-shadow:0 9px 24px #0003}
html[data-theme=dark] .mastery-top,html[data-theme=dark] .mastery-card>strong{color:#edf3fb}
html[data-theme=dark] .mastery-symbol,html[data-theme=dark] .mastery-track{background:#31506f}
html[data-theme=dark] .mastery-track span{background:linear-gradient(90deg,#648cb8,#e4bd81)}
html[data-theme=dark] .mastery-card>strong span,html[data-theme=dark] .mastery-bottom{color:#adbed2}
html[data-theme=dark] .theme-options button{background:#1d3049;border-color:#405b79;color:#e0ebf7}
html[data-theme=dark] .mock-feature{background:linear-gradient(115deg,#263a55,#16283f);border-color:#5b7493;color:#fff2dd}
html[data-theme=dark] .mock-feature-copy small,html[data-theme=dark] .mock-facts>span{color:#e4bd81}
html[data-theme=dark] .mock-facts>span{background:#304761;border-color:#6983a2}
html[data-theme=dark] .mock-paper{background:#e8edf5}
html[data-theme=dark] .visual-answers{background:linear-gradient(#274561 0 61%,#3a536c 61% 67%,#1b3048 67% 100%);border-color:#6386aa}
html[data-theme=dark] .visual-answer>svg{background:#dce7f4}
.visual-answer>svg.recycling-symbol,.visual-answer>svg.source-pictogram{color:#245b49}
.visual-answer>svg.source-pictogram{width:min(110px,94%);height:auto;aspect-ratio:1;padding:4px}
.visual-answer:has(>.source-pictogram){grid-template-columns:minmax(0,1fr)}
html[data-theme=dark] .about-highlight{background:#3a332b;color:#e6d5af}
html[data-theme=dark] .primary-button{background:#375f88;color:#fff;box-shadow:0 7px 15px #0003}
.pass-row{display:flex;align-items:center;gap:13px;width:100%;min-height:62px;margin-top:12px;padding:12px 16px;border:1.5px solid #d7e6d9;border-radius:18px;background:#f0f8ef;color:#204634;text-align:start}.pass-row-copy{display:flex;flex:1;min-width:0;flex-direction:column;gap:2px}.pass-row-copy strong{font:800 15px/1.2 Outfit,system-ui,sans-serif}.pass-row-copy small{font-size:11px;font-weight:700;color:#6a8171}.pass-row>svg:last-child{opacity:.55}html[data-theme=dark] .pass-row{background:#1c3049;border-color:#405b79;color:#edf3fb}html[data-theme=dark] .pass-row-copy small{color:#adbed2}.pass-alternative{margin:0 0 18px}.account-offer .secondary-button{width:100%;justify-content:center}
.pass-page{max-width:560px;padding-top:30px}.pass-card{margin-top:26px;padding:clamp(25px,6vw,42px);border:1px solid #d6e3da;border-radius:28px;background:#fff;box-shadow:0 18px 48px #1b3c3020;text-align:center}.pass-emblem{width:72px;height:72px;margin:0 auto 24px;border-radius:21px;background:#e9f2e9;color:#2f7757;display:grid;place-items:center}.pass-card h1{font:800 clamp(30px,6vw,42px)/1.12 Outfit,system-ui,sans-serif;letter-spacing:-1px;margin:12px 0}.pass-card>p{line-height:1.55;color:#647a6e}.pass-price{display:grid;gap:7px;margin:30px 0;padding:23px;border-radius:18px;background:#f3f6f1}.pass-price strong{font:800 27px Outfit,system-ui,sans-serif;color:#1b4936}.pass-price span{font-size:13px;color:#67796f}.pass-card .primary-button,.pass-card .secondary-button{width:100%;justify-content:center;margin-top:11px}.pass-card button:disabled{opacity:.48;cursor:not-allowed}.pass-status{min-height:22px;font-size:13px}html[data-theme=dark] .pass-card{background:#152338;border-color:#334862}html[data-theme=dark] .pass-card>p,html[data-theme=dark] .pass-price span{color:#adbed2}html[data-theme=dark] .pass-price{background:#1d3149}html[data-theme=dark] .pass-price strong,html[data-theme=dark] .pass-card h1{color:#edf3fb}html[data-theme=dark] .pass-emblem{background:#284969;color:#f0c381}
html[data-theme=dark] .exam-card.selected{border-color:#98b6d4;box-shadow:0 0 0 2px #98b6d433,0 8px 25px #0003}
html[data-theme=dark] .exam-select,html[data-theme=dark] .home-answer>svg,html[data-theme=dark] .mode-arrow,html[data-theme=dark] .topic-card>svg,html[data-theme=dark] .learn-area-card>svg,html[data-theme=dark] .learn-lesson-row>svg{color:#e4bd81}
html[data-theme=dark] .score-ring{background:conic-gradient(#d6aa6b var(--score),#334862 0)}
html[data-theme=dark] .settings-avatar,html[data-theme=dark] .learn-area-icon,html[data-theme=dark] .history-icon,html[data-theme=dark] .mode-icon.soft,html[data-theme=dark] .result-medal,html[data-theme=dark] .review-badge,html[data-theme=dark] .mock-go{background:#294663;color:#e4bd81}
html[data-theme=dark] .learn-area-icon.family,html[data-theme=dark] .history-icon.miss,html[data-theme=dark] .mode-icon.warm,html[data-theme=dark] .result-medal.retry,html[data-theme=dark] .review-badge.wrong{background:#4a3a36;color:#f2c69a}
html[data-theme=dark] .mistake-mcq .home-answer.chosen:not(.correct) .home-answer-letter,html[data-theme=dark] .answer.chosen:not(.correct) .answer-letter{background:#466d98;border-color:#8fb4dc;color:#fff}
html[data-theme=dark] .visual-answer.chosen{background:#294b70;border-color:#8fb4dc}
html[data-theme=dark] .visual-answer.correct{background:#a4eabd;border-color:#ddffe8;color:#113827}
html[data-theme=dark] .visual-answer.wrong{background:#783e39;border-color:#ffab92;color:#fff}
html[data-theme=dark] .visual-answer:hover:not(:disabled),html[data-theme=dark] .visual-answer:focus-visible{background:#315578;outline-color:#a9c6e3}
html[data-theme=dark] .mistake-tabs button{background:#152338;border-color:#334862;color:#c5d4e5}
html[data-theme=dark] .mistake-tabs button.active{background:#274261;border-color:#8fb4dc;color:#edf3fb}
html[data-theme=dark] .mistake-tabs span{background:#2d4969;color:#edf3fb}
html[data-theme=dark] .mistake-count,html[data-theme=dark] .account-offer p{color:#adbed2}
html[data-theme=dark] .lesson-context summary,html[data-theme=dark] .mistake-card summary,html[data-theme=dark] .learn-source-link,html[data-theme=dark] .source-row{color:#e4bd81}
html[data-theme=dark] .mistake-card details,html[data-theme=dark] .source-row{border-color:#334862}

/* Apple-provided localized Sign in with Apple button artwork. */
.apple-provider{display:flex;align-items:center;justify-content:center;width:min(100%,250px);min-height:50px;margin:0 auto 12px;padding:0;border:0;border-radius:12px;background:#000;overflow:hidden}
.apple-provider img{display:block;width:100%;height:auto}
html[data-theme=dark] .apple-provider{background:#fff}

/* An answer selected before grading is blue in both themes; green means correct. */
html:not([data-theme=dark]) .answer.chosen:not(.correct):not(.wrong),
html:not([data-theme=dark]) .visual-answer.chosen:not(.correct):not(.wrong),
html:not([data-theme=dark]) .mistake-mcq .home-answer.chosen:not(.correct):not(.wrong){background:#eaf2fc;border-color:#658cba;box-shadow:0 0 0 2px #658cba24}
html:not([data-theme=dark]) .answer.chosen:not(.correct):not(.wrong) .answer-letter,
html:not([data-theme=dark]) .mistake-mcq .home-answer.chosen:not(.correct):not(.wrong) .home-answer-letter{background:#315f91;border-color:#315f91;color:#fff}

/* A wrong choice must never carry the green success mark. */
.answer.chosen.wrong .answer-letter{background:#bd614d;border-color:#bd614d;color:#fff}
.answer.wrong .answer-status,.visual-answer.wrong .visual-check{color:#b84f3b}
.answer.chosen.wrong{box-shadow:0 0 0 2px #bd614d26}
.visual-answer.chosen.wrong{box-shadow:inset 0 0 0 3px #bd614d}
html[data-theme=dark] .answer.chosen.wrong .answer-letter{background:#a9443d;border-color:#ffab92;color:#fff}
html[data-theme=dark] .answer.wrong .answer-status,html[data-theme=dark] .visual-answer.wrong .visual-check{color:#ffd2c4}
html[data-theme=dark] .visual-answer.chosen.wrong{box-shadow:inset 0 0 0 3px #ffab92}
html[data-theme=dark] .mistake-mcq .home-answer.chosen.wrong .home-answer-letter{background:#a9443d;border-color:#ffab92;color:#fff}

/* Keep the account path calm and obvious; every apparent action has a full touch target. */
.profile-control{width:48px;height:48px}
.flag-control{width:44px;height:48px}
.icon-button{width:48px;height:48px}
.back-button{min-height:48px;min-width:48px;padding:0 8px;margin-inline-start:-8px}
.text-button,.pill-button{min-height:48px}
.language-popover button,.profile-menu-actions button{min-height:48px}
.theme-options button{min-height:48px}
.profile-popover{width:min(278px,calc(100vw - 28px));max-height:min(320px,60vh);padding:8px;border-radius:20px;box-shadow:0 20px 42px #1123322e}
.profile-popover .profile-card-link{min-height:76px;padding:10px 11px;gap:10px;border-radius:14px;background:#edf4f0;border-color:#c8dcd2}
.profile-card-link .avatar-art{width:42px;height:42px;border-radius:13px}
.profile-card-copy strong{font-size:16px}
.profile-card-copy small{font-size:12px;white-space:normal;line-height:1.3}
.profile-menu-actions{padding-top:5px}
.profile-menu-actions button{font-size:14px;font-weight:700}
.profile-menu-actions button+button{border-top:1px solid #e6ece8;border-radius:0 0 12px 12px}
.avatar-north{background:linear-gradient(145deg,#2d6d79,#1d3e5e);color:#f8dfa7}
.avatar-fjord{background:linear-gradient(145deg,#367d85,#24576a);color:#f8f2de}
.avatar-mountain{background:linear-gradient(145deg,#53677c,#2b415b);color:#fff0d7}
.avatar-book{background:linear-gradient(145deg,#3e6180,#273e5f);color:#f8dfa7}
.avatar-star{background:linear-gradient(145deg,#b98b51,#8e6840);color:#fff5df}
.avatar-choice b{background:#bd8648;color:#102139}
.settings-account-panel{padding:8px}
.settings-account-link{display:flex;align-items:center;gap:13px;width:100%;min-height:76px;padding:10px 12px;border:0;border-radius:15px;background:transparent;color:#243e35;text-align:start}
.settings-account-link:hover,.settings-account-link:focus-visible{background:#eff5f0}
.settings-account-link>.avatar-art{width:48px;height:48px}
.settings-account-link>span:nth-child(2){display:flex;flex:1;min-width:0;flex-direction:column;gap:4px}
.settings-account-link strong{font:800 16px Outfit,system-ui,sans-serif}
.settings-account-link small{font-size:12px;line-height:1.3;color:#61786a;overflow-wrap:anywhere;text-align:start}
.settings-account-link>svg{color:#5b856b}
.settings-account-panel .notice{margin:0 12px 12px}
html[data-theme=dark] .profile-popover .profile-card-link{background:#1c334e;border-color:#476481}
html[data-theme=dark] .profile-menu-actions button+button{border-color:#334862}
html[data-theme=dark] .settings-account-link{color:#edf3fb}
html[data-theme=dark] .settings-account-link:hover,html[data-theme=dark] .settings-account-link:focus-visible{background:#223a56}
html[data-theme=dark] .settings-account-link small{color:#adbed2}
html[data-theme=dark] .settings-account-link>svg{color:#e4bd81}

/* Reading and tapping remain easy in daylight and on smaller phones. */
.mistake-remove-top{min-height:48px;padding:9px 12px;font-size:12px}
.lesson-context summary{min-height:48px;display:flex;align-items:center}
.footnote button{min-height:48px}
html:not([data-theme=dark]) .kicker,
html:not([data-theme=dark]) .question-meta>span:last-child{color:#895723}
html:not([data-theme=dark]) .page-heading p,
html:not([data-theme=dark]) .content-note,
html:not([data-theme=dark]) .exam-language,
html:not([data-theme=dark]) .home-answer-hint,
html:not([data-theme=dark]) .mistake-remove-note,
html:not([data-theme=dark]) .mastery-note,
html:not([data-theme=dark]) .footnote,
html:not([data-theme=dark]) .result-sub,
html:not([data-theme=dark]) .pilot-note,
html:not([data-theme=dark]) .settings-hint,
html:not([data-theme=dark]) .account-divider,
html:not([data-theme=dark]) .question-meta,
html:not([data-theme=dark]) .home-question-note,
html:not([data-theme=dark]) .mode-text small,
html:not([data-theme=dark]) .topic-text small,
html:not([data-theme=dark]) .lesson-copy small,
html:not([data-theme=dark]) .history-row small,
html:not([data-theme=dark]) .stat-card span,
html:not([data-theme=dark]) .exam-note,
html:not([data-theme=dark]) .exam-picker label,
html:not([data-theme=dark]) .exam-picker p,
html:not([data-theme=dark]) .answer-letter,
html:not([data-theme=dark]) .lesson-index{color:#53695c}
html:not([data-theme=dark]) .bottom-nav button{color:#54665a}
html:not([data-theme=dark]) .bottom-nav button.active{color:#245a3d}

/* Analytics is offered after the result without interrupting the learner's next step. */
.analytics-inline{margin:28px 0 10px;padding:19px;border:1px solid #dce7df;border-radius:20px;background:#f7faf6;text-align:start}
.analytics-inline-symbol{display:grid;place-items:center;width:39px;height:39px;margin-bottom:10px;border-radius:12px;background:#e4efe8;color:#315f49}
.analytics-inline h2{margin:0 0 8px;font:800 19px Outfit,system-ui,sans-serif;color:#20392e}
.analytics-inline p{margin:0 0 9px;color:#53695c;font-size:13px;line-height:1.55}
.analytics-inline>a{color:#275b43;font-size:12px;font-weight:800;text-decoration:underline;text-underline-offset:3px}
.analytics-choices{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:15px}
.analytics-choices button{min-height:50px;padding:9px;border:1.5px solid #9bb8a7;border-radius:13px;background:#fff;color:#275b43;font-size:12px;font-weight:800;line-height:1.25}
.analytics-choices button:hover,.analytics-choices button:focus-visible{background:#e6f1e8}
html[data-theme=dark] .analytics-inline{background:#152338;border-color:#334862}
html[data-theme=dark] .analytics-inline-symbol{background:#294663;color:#e4bd81}
html[data-theme=dark] .analytics-inline h2{color:#edf3fb}
html[data-theme=dark] .analytics-inline p{color:#adbed2}
html[data-theme=dark] .analytics-inline>a{color:#e4bd81}
html[data-theme=dark] .analytics-choices button{background:#1d3049;border-color:#5b7897;color:#e8f1fb}
html[data-theme=dark] .analytics-choices button:hover,html[data-theme=dark] .analytics-choices button:focus-visible{background:#294866}

/* A finished round leads into the complete question bank and next steps. */
.session-complete{display:flex;align-items:baseline;justify-content:center;gap:9px;margin:18px auto 0;color:#345f48}
.session-complete strong{font:800 23px Outfit,system-ui,sans-serif;white-space:nowrap}
.session-complete span{font-size:12px;font-weight:700}
.result-page .score-ring{margin-top:22px}
.result-page .result-metrics{padding:10px 0;margin-bottom:19px}
.result-page .result-metrics strong{display:inline;margin-inline-start:5px;font-size:14px}
.result-bank{margin:20px 0 17px;padding:19px;border:1px solid #d9e5da;border-radius:20px;background:#fff;text-align:start;box-shadow:0 7px 22px #17352e0a}
.result-bank-heading{display:flex;align-items:center;gap:9px;color:#2b6347}
.result-bank-heading h2{flex:1;margin:0;font:800 16px Outfit,system-ui,sans-serif}
.result-bank-heading>strong{font:800 24px Outfit,system-ui,sans-serif}
.result-bank-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}
.result-bank-stats>div{min-width:0;padding:13px;border-radius:13px;background:#edf5ee}
.result-bank-stats strong{display:block;font:800 28px Outfit,system-ui,sans-serif;color:#22523b}
.result-bank-stats span{display:block;font-size:11px;font-weight:700;color:#496b55;line-height:1.35}
.result-bank>p{margin:13px 1px 0;color:#53695c;font-size:11px;line-height:1.45}
.result-guide{margin:16px 0 21px;padding:18px;border:1px solid #e2e5d9;border-radius:18px;background:#fbf5e9;text-align:start}
.result-guide p{margin:8px 0 14px;color:#4c5e51;font-size:13px;line-height:1.5}
.result-guide-actions{display:flex;flex-wrap:wrap;gap:8px}
.result-guide-actions button{display:inline-flex;align-items:center;gap:7px;min-height:40px;padding:8px 11px;border:1px solid #d9c6a4;border-radius:11px;background:#fff;color:#315d44;font-size:12px;font-weight:800}
.result-guide-actions button:hover{background:#f1e8d7}
html[data-theme=dark] .session-complete{color:#e4bd81}
html[data-theme=dark] .result-bank{background:#152338;border-color:#3a526e;box-shadow:0 7px 22px #0002}
html[data-theme=dark] .result-bank-heading,html[data-theme=dark] .result-bank-stats strong{color:#edf3fb}
html[data-theme=dark] .result-bank-stats>div{background:#203651}
html[data-theme=dark] .result-bank-stats span,html[data-theme=dark] .result-bank>p{color:#adbed2}
html[data-theme=dark] .result-guide{background:#202d40;border-color:#5d4d3b}
html[data-theme=dark] .result-guide p{color:#d0d9e4}
html[data-theme=dark] .result-guide-actions button{background:#29435f;border-color:#56708d;color:#edf3fb}
html[data-theme=dark] .result-guide-actions button:hover{background:#365675}
@media(max-width:400px){.session-complete{flex-direction:column;align-items:center;gap:0}}

/* Approved monochrome question illustrations retain black lines and white faces in both themes. */
.visual-answer>svg.approved-pictogram{width:min(110px,94%);height:auto;aspect-ratio:1;padding:5px;border:0;border-radius:12px;background:#fff;box-shadow:none;color:#000}
html[data-theme=dark] .visual-answer>svg.approved-pictogram{background:#fff;color:#000}
.visual-answer:has(>.approved-pictogram){grid-template-columns:minmax(0,1fr)}

/* Waste choices share one scale and palette so appearance does not give away the answer. */
.visual-answer>svg.waste-pictogram{width:min(110px,94%);height:auto;aspect-ratio:1;padding:12px;border:0;border-radius:12px;background:#fff;box-shadow:none;color:#000}
html[data-theme=dark] .visual-answer>svg.waste-pictogram{background:#fff;color:#000}
.visual-answer:has(>.waste-pictogram){grid-template-columns:minmax(0,1fr)}

/* Immediate feedback for access checks and the next free-round step. */
.access-feedback{position:fixed;z-index:80;inset-inline:16px;bottom:calc(86px + env(safe-area-inset-bottom));max-width:680px;margin-inline:auto;padding:16px 18px;display:flex;align-items:center;gap:14px;justify-content:space-between;background:var(--card,#fff);color:var(--text,#203b32);border:1px solid var(--line,#cbd7d0);border-radius:18px;box-shadow:0 12px 36px #0003}
.access-feedback>span{display:flex;align-items:center;gap:10px;font-weight:650}.access-feedback>div{display:flex;gap:8px}.access-feedback button{border:0;border-radius:10px;background:transparent;color:inherit;min-height:44px;padding:8px 12px;font:inherit;font-weight:650;cursor:pointer}.access-feedback.error{border-color:#bf7940}.access-spinner{display:inline-block;width:18px;height:18px;border:2px solid currentColor;border-inline-end-color:transparent;border-radius:50%;animation:access-spin .8s linear infinite;flex-shrink:0}
.practice-limit{padding:18px 20px;margin-block:0 20px;border:1px solid var(--line,#cbd7d0);border-radius:20px;background:var(--card,#fff)}.practice-limit h2{font-size:20px;margin:0 0 6px}.practice-limit p{margin:0 0 14px;line-height:1.5}.practice-limit .primary-button{margin:0;min-height:46px;font-size:15px}
[data-theme="dark"] .access-feedback,[data-theme="dark"] .practice-limit{background:#17263b;border-color:#38536f;color:#e5edf7}@keyframes access-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.access-spinner{animation:none}}@media(max-width:480px){.access-feedback{align-items:flex-start;flex-direction:column;gap:6px}.access-feedback>div{align-self:flex-end}}

/* Website privacy controls: optional categories are never preselected. */
.web-privacy-banner { position: fixed; z-index: 120; inset-inline: 18px; bottom: calc(86px + env(safe-area-inset-bottom)); max-width: 900px; margin-inline: auto; padding: 24px; display: grid; grid-template-columns: auto 1fr; gap: 12px 18px; border: 1px solid var(--border, #dbe6dd); border-radius: 24px; background: var(--card, #fff); color: var(--ink, #19332a); box-shadow: 0 16px 64px #0003; }
.web-privacy-banner h2 { font-family: inherit; font-size: 21px; font-weight: 700; line-height: 1.3; margin: 0 0 8px; }
.web-privacy-banner p, .web-privacy-dialog p { font-size: 14px; line-height: 1.6; margin: 6px 0 10px; color: inherit; }
.privacy-mark { font-size: 27px; color: #b87c39; }
.privacy-actions { display: flex; flex-wrap: wrap; gap: 10px; grid-column: 1 / -1; }
.privacy-actions button { flex: 1 1 160px; min-height: 46px; border: 1px solid #9aafa5; background: transparent; color: inherit; border-radius: 14px; padding: 10px 14px; font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
.privacy-actions button:hover { background: #7da28f1c; }
.privacy-actions .privacy-manage { flex: 0 1 auto; border-color: transparent; text-decoration: underline; font-weight: 500; }
.web-privacy-banner a, .web-privacy-dialog a { color: inherit; text-decoration: underline; font-size: 14px; }
.web-privacy-backdrop { position: fixed; inset: 0; z-index: 140; background: #07112099; backdrop-filter: blur(6px); display: flex; justify-content: center; align-items: center; padding: 18px; }
.web-privacy-dialog { width: min(100%, 560px); max-height: calc(100dvh - 36px); overflow: auto; border-radius: 26px; padding: 26px; background: var(--card, #fff); color: var(--ink, #19332a); box-shadow: 0 24px 96px #0004; }
.web-privacy-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.web-privacy-heading h2 { font-size: 23px; margin: 0; }
.web-privacy-heading button { font: inherit; font-size: 28px; color: inherit; background: transparent; border: 0; min-width: 44px; min-height: 44px; cursor: pointer; }
.privacy-purpose { padding: 18px 0; border-block-end: 1px solid #78918555; }
.privacy-toggle { display: flex; justify-content: space-between; gap: 18px; align-items: center; font-weight: 700; }
.privacy-adult { display: flex; align-items: flex-start; gap: 12px; font-size: 14px; line-height: 1.5; padding-top: 6px; }
.privacy-purpose input { appearance: auto; accent-color: #2a7457; min-width: 22px; min-height: 22px; margin: 0; cursor: pointer; }
.web-privacy-dialog small { display: block; margin: 5px 0 20px; color: inherit; opacity: .75; font-size: 12px; }
.privacy-retention { opacity: .8; }
.privacy-modal-open { overflow: hidden; }
[data-theme="dark"] .web-privacy-dialog, [data-theme="dark"] .web-privacy-banner { background: #17263b; color: #e6eef9; border-color: #3a536e; }
@media (max-width: 540px) { .web-privacy-banner { inset-inline: 12px; padding: 18px; gap: 10px; max-height: 65dvh; overflow: auto; border-radius: 20px; } .web-privacy-banner p { font-size: 13px; } .web-privacy-banner h2 { font-size: 19px; } .privacy-mark { display: none; } .web-privacy-banner { grid-template-columns: 1fr; } .privacy-actions .privacy-manage { flex-basis: 100%; } .web-privacy-dialog { padding: 22px; } }

.web-privacy-dialog { display: flex; flex-direction: column; overflow: hidden; }
.web-privacy-heading { flex-shrink: 0; padding-block-end: 8px; }
.web-privacy-body { min-height: 0; overflow: auto; }
.web-privacy-dialog > .privacy-actions { flex-shrink: 0; padding-block-start: 14px; border-block-start: 1px solid #78918555; }

/* Theme switching is available beside the language control on every screen. */
.theme-control{display:grid;place-items:center;flex:none;width:44px;height:48px;padding:0;border:0;border-radius:14px;background:transparent;color:#365e51;cursor:pointer;transition:background .15s,color .15s}
.theme-control:hover{background:#eaf1e8;color:#193d2e}
.theme-control:focus-visible,.flag-control:focus-visible{outline:2px solid #a37237;outline-offset:2px}
html[data-theme=dark] .theme-control{color:#e4bd81}
html[data-theme=dark] .theme-control:hover{background:#1d3049;color:#ffe0a6}
html[data-theme=dark] .theme-control:focus-visible,html[data-theme=dark] .flag-control:focus-visible{outline-color:#e4bd81}
.topbar .brand{min-width:0}
.topbar .brand>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:480px){.topbar{gap:8px}.topbar-actions{gap:3px}.topbar .brand{font-size:18px;gap:7px}.topbar .brand-mark{width:30px;height:30px}.profile-control{width:44px;height:48px}.quiz-header{gap:6px;padding-inline:16px}.quiz-header>span{min-width:0;flex:1;white-space:normal;font-size:11px;line-height:1.25}.quiz-header .quiz-timer{padding:6px 8px;font-size:11px}.quiz-header .theme-control,.quiz-header .flag-control{width:44px}}
@media(prefers-reduced-motion:reduce){.theme-control{transition:none}}
@media(max-width:360px){.topbar .brand{font-size:14px;gap:6px}.topbar .brand-mark{width:28px;height:28px}}
