/* Friendly Learning UI v17 — uses the existing app theme and RGB tokens. */
html:root{--bg:247 248 252;--surface:255 255 255;--surface2:238 242 250;--line:218 225 237;--ink:23 36 59;--muted:83 100 125;--navy:231 239 255;--accent:53 89 217;--accent-ink:255 255 255;--ok:16 116 89;--warn:142 91 13;--bad:185 43 68;--friendly-hero:linear-gradient(115deg,#e8efff 0%,#edf8f3 100%);--friendly-shadow:0 5px 20px rgb(30 50 90 / .045);color-scheme:light}
html.dark{--bg:17 25 41;--surface:25 37 57;--surface2:33 48 70;--line:54 72 96;--ink:233 240 250;--muted:171 187 208;--navy:29 49 75;--accent:154 178 255;--accent-ink:17 29 60;--ok:113 221 185;--warn:242 202 120;--bad:255 157 177;--friendly-hero:linear-gradient(115deg,#21365b 0%,#1c3b3a 100%);--friendly-shadow:0 5px 20px rgb(0 0 0 / .10);color-scheme:dark}
html body{background:rgb(var(--bg));color:rgb(var(--ink));font-family:Geist,Inter,system-ui,sans-serif;line-height:1.6}
html h1,html h2,html h3{letter-spacing:-.025em;text-wrap:balance}
html button,html input,html select,html textarea{font-family:inherit}
html button,html a,html input,html select,html textarea{touch-action:manipulation}
html :is(button,a,input,select,textarea):focus-visible{outline:3px solid rgb(var(--accent));outline-offset:3px}
html :is(button,a){transition:background-color .16s ease,border-color .16s ease,box-shadow .16s ease}
html input:not([type=checkbox]):not([type=radio]):not([type=range]),html select,html textarea{border-radius:12px;min-height:44px}
html input::placeholder,html textarea::placeholder{color:rgb(var(--muted));opacity:.9}
html #root aside{background:rgb(var(--surface));border-color:rgb(var(--line))}
html #root aside > a{padding-top:28px;padding-bottom:28px}
html #root aside nav{padding:0 16px 20px}
html #root aside nav a{margin-bottom:6px;padding:12px 14px;border-radius:13px}
html #root nav a[aria-current=page]{background:rgb(var(--accent)/.11);color:rgb(var(--accent));font-weight:700;box-shadow:inset 3px 0 rgb(var(--accent))}
html #root header{background:rgb(var(--bg)/.96);backdrop-filter:blur(12px)}
/* Reserve a separate top row for the existing account controls. */
html #root header > div{padding-top:62px;padding-bottom:16px}
html #root main{padding-top:28px}
html #root main :is(.rounded-2xl,.rounded-xl).border.bg-surface{box-shadow:var(--friendly-shadow)}
html #root main button.bg-surface:hover,html #root main a.bg-surface:hover{border-color:rgb(var(--accent)/.5);box-shadow:0 7px 24px rgb(var(--accent)/.08)}
html #root main .rounded-2xl{border-radius:18px}
html #root main .bg-accent{color:rgb(var(--accent-ink))}
html #root main section.bg-navy{background:var(--friendly-hero);color:rgb(var(--ink));border:1px solid rgb(var(--accent)/.15);padding:32px;border-radius:26px;box-shadow:var(--friendly-shadow)}
html #root main section.bg-navy > .grid-bg{background-image:none;opacity:0}
html #root main section.bg-navy > svg{opacity:.12;color:rgb(var(--accent))}
html #root main section.bg-navy h1{max-width:750px;font-size:clamp(27px,3.2vw,40px);line-height:1.15}
html #root main section.bg-navy .text-slate-300{color:rgb(var(--muted))}
html #root main section.bg-navy .text-cyan-200{color:rgb(var(--accent));border-color:rgb(var(--accent)/.2);background:rgb(var(--surface)/.65);font-family:inherit;font-weight:600}
html #root main section.bg-navy [data-testid=cta-learn]{background:rgb(var(--accent));color:rgb(var(--accent-ink));border-color:rgb(var(--accent));box-shadow:0 5px 14px rgb(var(--accent)/.18)}
html #root main section.bg-navy :is([data-testid=cta-exam],[data-testid=cta-questions]){background:rgb(var(--surface)/.85)!important;color:rgb(var(--ink))!important;border-color:rgb(var(--line))!important}
html .ap2-dash-card{background:rgb(var(--surface));color:rgb(var(--ink));border:1px solid rgb(var(--line));border-radius:18px;padding:20px;box-shadow:var(--friendly-shadow)}
html .ap2-dashboard-error-card{margin-top:28px}
html .ap2-dash-mini{background:rgb(var(--surface2)/.65);border:1px solid rgb(var(--line)/.65);padding:14px;border-radius:13px}
html .ap2-dash-mini:nth-child(1){background:rgb(var(--bad)/.06)}
html .ap2-dash-mini:nth-child(3){background:rgb(var(--ok)/.07)}
html .ap2-dash-btn{background:rgb(var(--surface2));color:rgb(var(--ink));border-color:rgb(var(--line));min-height:42px;border-radius:11px}
html .ap2-dash-btn.primary{background:rgb(var(--accent));color:rgb(var(--accent-ink))!important;border-color:rgb(var(--accent))}
html .ap2-sync-pill{background:rgb(var(--surface));color:rgb(var(--muted));border-color:rgb(var(--line));font-size:11px;box-shadow:var(--friendly-shadow)}
html .ap2-gv7-card{border-radius:16px;box-shadow:var(--friendly-shadow);margin-bottom:10px}
html .ap2-gv7-toggle{padding:17px}
html .ap2-gv7-card:has([aria-expanded=true]){border-color:rgb(var(--accent)/.55)}
html .ap2-gv7-term{font-size:16px}
html .ap2-gv7-alpha button{width:38px;height:38px}
html .ap2-gv7-topic{text-decoration:underline;text-underline-offset:4px}
html .ap2-gv7-btn,html .ap2-routing-btn{min-height:42px}
html .ap2-auth-shell,html .ap2-cloud-shell{background:rgb(var(--bg)/.94);color:rgb(var(--ink));overflow-y:auto}
html .ap2-auth-card,html .ap2-cloud-card{background:rgb(var(--surface));color:rgb(var(--ink));border-color:rgb(var(--line));box-shadow:0 24px 80px rgb(24 44 80 / .14)}
html .ap2-auth-logo{background:rgb(var(--accent)/.1);color:rgb(var(--accent));border-color:rgb(var(--accent)/.2)}
html .ap2-auth-sub,html .ap2-auth-label,html .ap2-auth-msg,html .ap2-cloud-text{color:rgb(var(--muted))}
html .ap2-auth-input{background:rgb(var(--bg));color:rgb(var(--ink));border-color:rgb(var(--line))}
html .ap2-auth-input:focus{border-color:rgb(var(--accent));box-shadow:0 0 0 3px rgb(var(--accent)/.12)}
html .ap2-auth-btn,html .ap2-cloud-actions button.primary,html .ap2-admin-btn.primary{background:rgb(var(--accent));color:rgb(var(--accent-ink));border-color:rgb(var(--accent))}
html .ap2-auth-btn.secondary,html .ap2-auth-guest,html .ap2-cloud-actions button{background:rgb(var(--surface2));color:rgb(var(--ink));border-color:rgb(var(--line))}
html .ap2-auth-link{color:rgb(var(--accent))}
html .ap2-cloud-status{background:rgb(var(--surface2));border-color:rgb(var(--line))}
html .ap2-user-pill{background:rgb(var(--surface));color:rgb(var(--ink));border-color:rgb(var(--line));box-shadow:var(--friendly-shadow);top:10px;right:24px}
html .ap2-user-pill button,html .ap2-user-pill .ap2-login-btn,html .ap2-user-pill .ap2-register-btn,html .ap2-user-pill .ap2-admin-btn{background:rgb(var(--accent)/.09);color:rgb(var(--accent));min-height:30px}
html .ap2-admin-tab.active{background:rgb(var(--accent)/.1);border-color:rgb(var(--accent)/.35);color:rgb(var(--accent))}
html .ap2-auth-msg.error,html .ap2-admin-error,html .ap2-admin-btn.danger,html .ap2-admin-status-archived{color:rgb(var(--bad))}
html .ap2-auth-msg.ok,html .ap2-admin-success,html .ap2-admin-status-published{color:rgb(var(--ok))}
html .ap2-admin-status-review{color:rgb(var(--warn))}
html table{font-variant-numeric:tabular-nums}
html pre{max-width:100%;overflow:auto;border-radius:12px}
html .prose,html article{overflow-wrap:anywhere}
@media(max-width:1023px){html .ap2-sync-pill{bottom:calc(76px + env(safe-area-inset-bottom))}html #root main{padding-bottom:140px}html #root nav[aria-label="Mobile Navigation"]{background:rgb(var(--surface)/.98);box-shadow:0 -4px 20px rgb(30 50 90 / .05)}html #root nav[aria-label="Mobile Navigation"] a[aria-current=page]{box-shadow:inset 0 3px rgb(var(--accent))}}
@media(max-width:600px){html #root main section.bg-navy{padding:22px 18px;border-radius:20px}html #root main section.bg-navy .text-cyan-200{font-size:10px}html .ap2-dash-card{padding:15px}html .ap2-dash-grid{gap:8px}html .ap2-dash-mini{padding:10px}html .ap2-user-pill{right:8px;max-width:calc(100vw - 16px)}html .ap2-gv7-toggle{padding:14px}html #root header > div{gap:8px}html #root main section.bg-navy [data-testid^=cta-]{flex:1 1 150px;justify-content:center}html .ap2-auth-shell,html .ap2-cloud-shell{padding:12px}html .ap2-admin-grid{grid-template-columns:minmax(0,1fr)}}
@media(prefers-reduced-motion:reduce){html *,html *::before,html *::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}