/* Shared learner/admin top navigation, blue atmosphere and readable surfaces. */
:root { --ink:#16324f; --muted:#556c83; --paper:#f5f9ff; --line:#d9e6f4; --green:#1460ba; --mint:#d7f4ff; }
html { scroll-padding-top:150px; }
body { background:radial-gradient(ellipse at 90% 0,#d9efff 0,transparent 48%),linear-gradient(145deg,#f9fbff,#edf5ff 60%,#f8fbff);color:var(--ink); }
.shell { margin-left:0;padding-top:0; }
.topbar { position:sticky;top:0;left:auto;right:auto;height:auto;min-height:134px;display:flex;flex-wrap:wrap;gap:18px;padding:18px max(24px,calc((100vw - 1260px)/2));background:#fffffff5;backdrop-filter:blur(16px);border-bottom:1px solid var(--line);box-shadow:0 4px 22px #244f8710;z-index:30; }
.wordmark { margin-right:auto;font-size:20px;white-space:nowrap; }
.wordmark::before { background:linear-gradient(135deg,#39b5ff,#3867d9);color:white;box-shadow:0 5px 14px #217cc82b; }
.top-actions { margin-left:auto;gap:10px; }
.search { max-width:310px;width:25%;background:#f5f8fd; }
.rail { position:static;inset:auto;width:100%;padding:0;background:none;box-shadow:none;display:block;transform:none;order:10;border:0; }
.rail nav { display:flex;flex-direction:row;flex-wrap:wrap;gap:5px;justify-content:center; }
.rail .brand-symbol,.rail .side-scope,.rail .workspace-switch,.rail .rail-bottom { display:none; }
.rail .nav-item { width:auto;min-height:44px;height:auto;gap:8px;padding:10px 14px;color:#50677e;border:1px solid transparent;border-radius:12px;white-space:nowrap; }
.rail .nav-label { font-size:13px;white-space:nowrap;opacity:1;visibility:visible;position:static;background:none;color:inherit;padding:0;box-shadow:none; }
.rail .nav-item:hover { color:#164ea3;background:#edf5ff; }
.rail .nav-item.active,.rail .nav-item.active:hover { color:#1353a7;background:linear-gradient(120deg,#e3f2ff,#e8edff);border-color:#bedaff;box-shadow:none; }
.rail .nav-item::after { display:none; }
.rail .nav-item .icon { width:20px;height:20px;flex-shrink:0; }
.learning-steps { margin:22px auto 0;max-width:700px; }
.learning-steps a[aria-current] { background:linear-gradient(110deg,#2876d3,#4689e1);box-shadow:none; }
main,.admin-main { position:relative;isolation:isolate;max-width:1260px;margin:auto;padding:30px 24px 54px;min-height:65vh; }
main::before { content:'';position:absolute;z-index:-1;pointer-events:none;inset:0;background:var(--page-art,url('assets/ai-learning-blue.webp')) no-repeat right 0 top 20px / min(700px,85vw) auto;opacity:.055;mask-image:linear-gradient(to bottom,#000,transparent 680px); }
main[data-page='courses'],main[data-page='lessons'] { --page-art:url('assets/module-1-foundations-blue.webp'); }
main[data-page='lab'],main[data-page='assessments'] { --page-art:url('assets/module-2-content-blue.webp'); }
main[data-page='portfolio'],main[data-page='members'] { --page-art:url('assets/module-5-project-blue.webp'); }
main[data-page='community'],main[data-page='news'],main[data-page='banner'] { --page-art:url('assets/module-3-multimedia-blue.webp'); }
main[data-page='project'],main[data-page='reports'],main[data-page='settings'],main[data-page='participants'] { --page-art:url('assets/module-4-code-blue.webp'); }
.page-heading h1 { font-size:clamp(26px,3vw,40px);line-height:1.4;color:#16375c; }
.eyebrow { color:#356baa;letter-spacing:1.5px; }.intro,.muted { color:var(--muted); }
.welcome-grid { background:linear-gradient(115deg,#edf6ff 0,#e4efff 55%,#d4eaff);padding:24px;border:1px solid #ccdef4;border-radius:28px;box-shadow:0 15px 35px #3266a30e;align-items:stretch; }
.welcome-grid::before { display:none; }
.welcome-grid::after { content:'';position:absolute;inset:0;background:url('assets/ai-learning-blue.webp') no-repeat right center / cover;opacity:.1;pointer-events:none; }
.welcome-grid>* { position:relative;z-index:1; }
.hero { min-height:370px;padding:24px;background:none;color:var(--ink); }
.hero::before,.hero::after { display:none; }.hero h1,.hero h2 { color:#173d70; }.hero h1 em,.hero h2 em,.hero em { color:#1674c8; }
.hero p,.hero .hero-description,.hero .hero-note,.hero .eyebrow,.hero .trust-row,.hero .hero-trust { color:#426184; }
.hero .hero-label { display:inline-flex;align-items:center;gap:8px;width:max-content;max-width:100%;padding:7px 11px;border:1px solid #c6d9ed;border-radius:999px;color:#315f8e;background:#ffffffb8; }
.hero .hero-bottom,.hero .little-orbit { color:#456386; }
.button.lime { background:linear-gradient(115deg,#2375d2,#3c88e1);color:white; }
.button.lime:hover { background:#195db3;color:white; }
.hero .button.outline { color:#225ca3;border-color:#93bce7;background:#ffffffb8; }
.button.primary { background:linear-gradient(115deg,#2375d2,#3c88e1);color:white;box-shadow:0 5px 14px #2b6bc31b; }
.button.primary:hover { background:#195db3;color:white; }.panel,.progress-panel,.admin-note,.member-form-panel { background:#ffffffed;border:1px solid var(--line);color:var(--ink); }
.member-story,.admin-login-story { position:relative;isolation:isolate;color:#193e6b;background:linear-gradient(135deg,#e9f5ff,#dfeaff);border:1px solid #d0e2f7; }
.member-story::before,.admin-login-story::before { content:'';position:absolute;inset:0;background:url('assets/ai-learning-blue.webp') center / cover;opacity:.1;z-index:-1;pointer-events:none; }
.member-story::after,.admin-login-story::after { display:none; }.member-story h1,.member-story h1 em,.admin-login-story h1 { color:#1b579e; }.member-story p,.member-story .eyebrow,.member-story-points,.member-story-points span,.admin-login-story p { color:#365b83; }
.member-story>p:not(.eyebrow) { color:#365b83; }
.member-story-mark { color:#2d83d6; }.member-auth { max-width:1050px;margin:12px auto; }
.social-buttons { display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:20px 0 14px; }
.social-button { display:flex;align-items:center;justify-content:center;gap:10px;border:1px solid #cfdef0;background:white;color:#24486d;min-height:48px;padding:12px;border-radius:12px;font:600 14px var(--font);cursor:pointer; }
.social-button:hover { background:#eff7ff;border-color:#76b8f0; }.social-button:disabled { opacity:.65;cursor:wait; }
.provider-mark { display:grid;place-items:center;min-width:25px;height:25px;border-radius:7px;font:bold 14px Arial; }.line-mark { background:#06c755;color:white;font-size:9px; }.google-mark { color:#4285f4;background:#f1f5ff; }
.auth-divider { display:flex;gap:12px;align-items:center;color:#73879d;font-size:12px;margin:18px 0; }.auth-divider::before,.auth-divider::after { content:'';height:1px;background:#dce6f2;flex:1; }
.social-consent { font-size:12px;line-height:1.6;margin:12px 0; }.guest-access { display:flex;align-items:center;justify-content:center;min-height:48px;border:1px dashed #acc9e8;border-radius:12px;margin-top:18px;padding:10px;color:#315f91; }.social-error { color:#a52b35;font-size:13px; }
.admin-top { min-height:140px; }.admin-chip { color:#527395;background:#eef5ff;border-color:#d5e4f7; }.admin-main { padding-top:30px; }
.admin-rail .nav-item { padding:9px 11px; }.admin-main .stat-card,.admin-main .metric-card,.admin-main .summary-card { color:var(--ink);background:white;border:1px solid var(--line); }.admin-main .stat-card *,.admin-main .metric-card *,.admin-main .summary-card * { color:inherit; }
.admin-mobile-toggle,.mobile-toggle { display:none; }.admin-top>.top-actions>a { min-height:44px;display:flex;align-items:center;font-size:13px; }
footer { max-width:1260px;margin:0 auto;padding:24px;color:#5f7892; }
.footer-help { border:0;background:none;color:#315f91;font:inherit;min-height:44px;padding:8px;cursor:pointer; }
.member-welcome,.admin-plan { color:#193e6b;background:linear-gradient(135deg,#e7f4ff,#dfeaff);border:1px solid #ccdef4; }
.member-welcome h2,.member-welcome h2 em,.member-welcome .member-progress,.member-welcome .hero-label,.member-welcome p,.member-welcome small { color:#315f8e; }
.admin-plan h2,.admin-plan h3 { color:#193e6b; }
.admin-plan p,.admin-plan .eyebrow,.admin-plan .admin-report-bar>div,.admin-plan .admin-audit,.admin-plan .admin-audit small { color:#365b83; }
input,select,textarea { max-width:100%; }button,a,input,select,textarea { touch-action:manipulation; }button:focus-visible,a:focus-visible { outline:3px solid #70b7f4;outline-offset:3px; }
@media(max-width:1100px) { .rail .nav-item { padding:10px; }.rail .nav-label { font-size:12px; }.search { display:none; }.admin-chip { display:none; } }
@media(max-width:800px) {
 html { scroll-padding-top:100px; } .topbar,.admin-top { min-height:76px;padding:14px max(14px,env(safe-area-inset-left)) 14px max(14px,env(safe-area-inset-right));gap:10px; }
 .shell { padding-top:0;margin:0; }.wordmark { font-size:16px; }.wordmark::before { width:34px;height:34px;font-size:26px;margin-right:8px; }
 .top-actions { gap:7px; }.prototype-tag,#help-button { display:none; }.member-access { min-height:44px; }.member-access .member-label { display:none; }.member-avatar { width:38px;height:38px; }
 .mobile-toggle,.admin-mobile-toggle { display:grid;min-width:44px;min-height:44px; }.rail { display:none;position:static;transform:none;max-height:70dvh;overflow-y:auto;width:100%;padding:8px 0 2px; }
 .rail.menu-open { display:block; }.rail nav { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px; }.rail .nav-item { width:100%;white-space:normal;justify-content:flex-start;padding:12px 10px;min-height:48px; }.rail .nav-label { font-size:13px;white-space:normal; }
 main,.admin-main { padding:22px 16px 38px;max-width:100%; }.welcome-grid { padding:12px;border-radius:22px; }.hero { padding:18px 14px;min-height:0; }.hero h1 { font-size:clamp(30px,7.5vw,46px); }.hero p { font-size:15px; }
 .learning-steps { margin-top:16px;padding:0 16px; }.learning-steps a { min-height:44px;font-size:12px;gap:4px; }.learning-steps a span { display:none; }
 .member-auth { display:flex;flex-direction:column;border-radius:22px; }.member-story { padding:25px;min-height:0; }.member-story h1 { font-size:30px; }.member-story-points { display:none; }.member-story-mark { display:none; }.member-form-panel { padding:26px 22px; }
 .admin-top>.top-actions>a { font-size:12px; }.admin-main .admin-columns,.member-account-grid { grid-template-columns:1fr; }.admin-login { padding:16px; }.admin-login-story { padding:28px;min-height:0; }
 input,select,textarea { font-size:16px!important;min-height:44px; }.icon-button { min-width:44px;min-height:44px; }.button { min-height:44px; }
 footer { display:flex;flex-direction:column;gap:8px;padding:20px 16px calc(20px + env(safe-area-inset-bottom));font-size:11px; }
}
@media(max-width:360px) { .wordmark { font-size:14px; }.wordmark::before { width:30px;height:30px;margin-right:5px; }.top-actions { gap:3px; }.social-buttons { grid-template-columns:1fr; }.hero-actions { flex-direction:column; }.member-form-panel { padding:24px 18px; }.admin-top>.top-actions>a { display:none; } }
@media(prefers-reduced-motion:reduce) { * { scroll-behavior:auto!important;animation:none!important;transition:none!important; } }
