/* RoadSafe layout reference; navy/sky-blue palette and local AI-learning artwork. */
:root { --ink:#13233c; --muted:#657080; --green:#083b7e; --mint:#50deff; --paper:#f0f4f7; --line:#d4dde5; --radius:24px; }
body { background:radial-gradient(ellipse at 90% 0, #dfedf4, transparent 65%),var(--paper); }
.topbar { position:fixed;top:0;left:0;right:0;z-index:30;height:84px;padding:0 28px;background:#fffffff5;border-color:var(--line);box-shadow:0 2px 18px #071f3c10; }
.wordmark { font-family:var(--font);font-size:21px;font-weight:600;letter-spacing:-.7px; }
.wordmark::before { content:'✦';display:inline-grid;place-items:center;width:42px;height:42px;margin-right:12px;background:linear-gradient(140deg,#176ac7,#02214a);color:#6aebff;border-radius:13px;box-shadow:0 6px 18px #04377d30;font:33px/1 Arial;vertical-align:middle; }
.wordmark b { color:#004296; }
.top-actions { gap:13px; }
.search { max-width:35%;background:#f1f4f7;border:1px solid #dee4eb;padding:7px 16px;border-radius:13px; }
.rail { top:84px;width:264px;padding:27px 16px 22px;background:linear-gradient(160deg,#102c4d,#04152b 64%,#030f20);align-items:stretch;box-shadow:5px 0 22px #071f3c09; }
.rail>.brand-symbol { display:none; }
.side-scope { padding:0 12px 22px;border-bottom:1px solid #caecff18;margin-bottom:18px; }
.side-scope>span { display:block;color:#7d9fc1;letter-spacing:1.2px;font-size:11px;font-weight:700; }
.side-scope strong { display:block;color:white;font-size:18px;margin-top:8px; }
.side-scope small { display:block;color:#8ba0b4;font-size:12px;margin-top:7px; }
.workspace-switch { display:flex;gap:5px;padding:6px;background:#ffffff05;border:1px solid #ffffff12;border-radius:14px;margin:0 10px 25px; }
.workspace-switch a { flex:1;text-align:center;padding:12px 7px;border-radius:9px;color:#9aa9b7;font-size:13px;font-weight:700; }
.workspace-switch .selected { background:#07428d;color:#fff;box-shadow:inset 0 -3px #45e9ff; }
.rail nav { gap:5px; }
.nav-item { width:100%;height:49px;justify-content:flex-start;gap:13px;padding:0 16px;border-radius:13px;font-weight:600;color:#a4b2c1; }
.nav-item .icon { width:22px;height:22px; }
.nav-label { position:static;background:none;padding:0;color:inherit;font-size:13px;box-shadow:none;opacity:1;visibility:visible;white-space:normal; }
.nav-item.active,.nav-item.active:hover { color:#fff;background:linear-gradient(90deg,#0b3e7f,#072c5a);box-shadow:inset 4px 0 #48dcff; }
.nav-item:hover { background:#ffffff0a;color:#dbf0ff; }
.rail-bottom { align-items:flex-start;flex-direction:row;gap:8px;letter-spacing:0;border-top:1px solid #ffffff12;padding:17px 15px 0;color:#7f93a5; }
.rail-bottom strong { font-size:13px;line-height:1.65; }
.shell { margin-left:264px;padding-top:84px; }
.learning-steps { display:flex;gap:0;max-width:730px;margin:18px auto 0;padding:0 20px; }
.learning-steps a { display:flex;align-items:center;justify-content:center;gap:9px;flex:1;border:1px solid #cfdbe4;border-right:0;min-height:48px;background:#ffffffc9;color:#687480;font-size:13px;font-weight:700; }
.learning-steps a:first-child { border-radius:13px 0 0 13px; }.learning-steps a:last-child { border-right:1px solid #cfdbe4;border-radius:0 13px 13px 0; }
.learning-steps a[aria-current] { background:linear-gradient(110deg,#063a7d,#0e4b98);color:white;box-shadow:inset 0 -3px #5ae6ff;border-color:#0e4b98; }
.learning-steps a span { font-size:10px;opacity:.65; }
main { max-width:1600px;padding:28px 30px 45px; }
.page-heading { margin-bottom:24px; }.page-heading h1 { font-size:clamp(25px,2.15vw,36px);font-weight:750; }
.eyebrow { font-size:10px;font-weight:750;color:#728196; }.intro { font-size:13px; }
.welcome-grid { background:linear-gradient(125deg,#04162d,#041d3e 70%,#123861);border-radius:32px;overflow:hidden;gap:0;padding:25px 15px 25px 12px;box-shadow:0 18px 42px #061f3c20;align-items:end;position:relative; }
.welcome-grid::before { content:'';position:absolute;width:530px;height:530px;right:-210px;top:-180px;border:1px solid #c5f0ff1a;border-radius:50%;box-shadow:0 0 0 80px #c5f0ff06,0 0 0 160px #c5f0ff06;pointer-events:none; }
.hero { background:none;min-height:420px;padding:25px 25px 20px;border-radius:0;overflow:visible; }
.hero-copy { width:100%; }.hero h2 { font-size:clamp(35px,3.6vw,61px);line-height:1.35;font-weight:800;letter-spacing:-1.5px;max-width:690px; }
.hero-label { color:#b9c9d8;font-size:10px;letter-spacing:1px; }.live-dot { width:7px;height:7px;background:#5298ea;box-shadow:0 0 0 4px #398eef30; }
.hero-copy>p { color:#b4c1cf;font-size:15px;max-width:530px; }.hero-art { width:35%;right:-36%;top:25px;bottom:165px;opacity:.27;pointer-events:none; }.art-caption { display:none; }
.hero-bottom { color:#93a6be;font-size:12px; }.hero em { color:#60e1ff; }
.start-card { z-index:2;background:#eef3f8ed;border:1px solid #ffffffb0;border-radius:24px;margin:80px 15px 0 10px;padding:26px;box-shadow:0 12px 30px #001c2430; }
.start-card .spark-text { color:#084290; }.start-card h2 { font-size:23px; }.start-steps { margin-top:18px; }.start-steps a { padding:12px 0; }
.button { border-radius:12px;font-size:13px;min-height:45px;font-weight:750; }.button.primary { background:linear-gradient(125deg,#073e86,#0e50a6);box-shadow:0 7px 18px #073e8618; }.button.primary:hover { background:#09336e; }
.button.lime { background:linear-gradient(120deg,#2eeaff,#55aee7);color:#062142;min-height:53px;padding:13px 23px;box-shadow:0 7px 22px #5ce2ff18; }.button.lime:hover { background:#79ebff; }
.button.outline { background:#ffffff8a;border-color:#c4d1de; }.hero .button.outline { background:transparent;color:#fff;border-color:#5f7589; }
.panel,.course-card,.artifact-item,.community-post,.admin-plan,.admin-status,.admin-stat,.news-item { border:1px solid #d9e0e7;border-radius:22px;box-shadow:0 8px 25px #071f3c07; }
.principles { background:#fff;border:1px solid #dce2e8;border-radius:20px;margin-top:24px;padding:20px; }.principles>div { padding:0 13px; }
.course-card { overflow:hidden;transition:transform .2s,box-shadow .2s; }.course-card:hover { box-shadow:0 13px 35px #08203c12; }.course-card h3 { font-weight:750; }
.lab-banner { border-radius:24px;background:linear-gradient(110deg,#dfeef5,#ecf4f7);border:1px solid #cddce4; }
.progress-track { background:#d4dce5; }.progress-track>span { background:linear-gradient(90deg,#0d4799,#69cced); }
.member-access { display:flex;align-items:center;gap:9px;max-width:240px;font-weight:700;font-size:13px; }
.member-label { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:145px; }.member-avatar { display:grid;place-items:center;width:38px;height:38px;border-radius:12px;flex-shrink:0;background:linear-gradient(130deg,#5feeff,#1669d5);color:#042347;font-size:20px;font-weight:800;box-shadow:0 6px 16px #0b539e20; }
.member-auth { display:grid;grid-template-columns:1fr 1fr;max-width:1100px;margin:12px auto;border:1px solid #d7dfe6;border-radius:28px;overflow:hidden;background:white;box-shadow:0 18px 50px #08203d10; }
.member-story { padding:45px 40px;background:linear-gradient(145deg,#03172f,#072550);color:white;position:relative;overflow:hidden; }
.member-story::after { content:'✦';position:absolute;bottom:-75px;right:-42px;font:340px/1 Arial;color:#4de0ff0f;transform:rotate(-15deg);pointer-events:none; }.member-story-mark { display:block;font:58px/1 Arial;color:#60e1ff;margin-bottom:38px; }
.member-story .eyebrow { color:#789bc1; }.member-story h1 { font-size:clamp(30px,3vw,44px);font-weight:800;line-height:1.45; }.member-story em { color:#60e1ff;font-style:normal; }.member-story>p:not(.eyebrow) { color:#acbdcd;margin-top:22px;font-size:14px; }
.member-story-points { display:grid;gap:12px;margin-top:45px;font-size:12px;color:#a8bbce; }
.member-form-panel { padding:40px; }.member-form-panel h2 { font-size:28px;font-weight:800;margin-bottom:8px; }.member-form { display:flex;flex-direction:column;align-items:stretch; }
.member-form label:not(.member-consent) { margin-top:20px;margin-bottom:7px;font-size:13px;font-weight:700; }.member-form input:not([type="checkbox"]),.member-form textarea { width:100%;border:1px solid #d4dce4;border-radius:11px;background:#f8fafb;padding:12px 14px;min-height:46px;color:var(--ink); }
.member-form .hint { margin-top:5px;color:#7f8a94;font-size:11px; }.password-field { display:flex;position:relative; }.password-field input { padding-right:45px!important; }.password-toggle { position:absolute;right:6px;top:6px;width:34px;height:34px;color:#65788c; }
.member-consent { display:flex;align-items:flex-start;gap:11px;margin-top:22px;font-size:12px;color:#506274; }.member-consent input { accent-color:#074796;flex-shrink:0;width:17px;height:17px;margin-top:4px; }.member-consent small { display:block;color:#808a92;margin-top:6px;font-size:11px; }
.member-error { color:#ae3f30;font-size:13px;margin-top:12px;white-space:pre-wrap; }.member-error:empty { margin:0; }
.auth-other { border-top:1px solid #e4e9ec;padding-top:22px;margin-top:25px;font-size:13px; }.auth-other a { color:#003d8c;font-weight:750; }.member-form-panel>.text-link { margin-top:20px; }
.member-welcome { background:linear-gradient(125deg,#04172f,#0d3261);color:white;padding:32px 38px;border-radius:27px;display:flex;justify-content:space-between;gap:25px;box-shadow:0 15px 30px #071f3c10; }.member-welcome h2 { font-size:32px;margin-top:12px;font-weight:800; }.member-welcome em { color:#58e2ff;font-style:normal; }.member-welcome p { color:#a7bdd4;font-size:12px;margin-top:14px; }.member-welcome .sync-error { color:#ffe0aa; }
.member-progress { align-self:center;min-width:240px;padding:25px;background:#ffffff0c;border:1px solid #ffffff14;border-radius:20px;display:flex;flex-direction:column;gap:10px; }.member-progress>strong { color:#62e7ff;font-size:58px;line-height:1.15; }.member-progress strong small { font-size:24px; }.member-progress>span { font-size:12px;color:#c1cedb; }.member-progress>small { font-size:10px;color:#92a6ba; }
.member-stats { display:grid;grid-template-columns:repeat(3,1fr);gap:17px;margin:22px 0; }.member-stats>div { background:white;border:1px solid #d5dee6;border-radius:18px;padding:20px 24px;display:flex;flex-direction:column; }.member-stats span { font-size:12px;color:#7b8691; }.member-stats strong { font-size:35px;color:#073168;line-height:1.5; }.member-stats small { font-size:14px;color:#929ba5; }
.member-account-grid { display:grid;grid-template-columns:1fr 1fr;gap:22px; }.member-account-grid .button { margin-top:20px; }.member-recent { margin:20px 0;display:grid;gap:12px; }.member-recent article { padding:12px 16px;border:1px solid #e1e7ec;border-radius:13px;background:#f8fafb; }.member-recent article span { color:#84909b;font-size:10px; }.member-recent h3 { font-size:15px; }.member-security { border-top:1px solid #e4eaee;margin-top:25px;padding-top:18px; }.member-security summary { cursor:pointer;font-size:13px;font-weight:700; }.member-import { display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:22px; }.member-import p { color:#727c87;font-size:12px; }.member-loading { text-align:center;padding:60px; }
.admin-main { max-width:1550px;padding-top:34px; }.admin-rail { overflow:auto; }.admin-rail nav { gap:3px; }.admin-rail .rail-bottom { margin-top:24px; }.admin-rail .side-scope { margin-bottom:18px; }.admin-top { padding:0 28px; }.admin-chip { background:#e5edf2;color:#496987; }.admin-top>a[href="/"] { margin-left:auto;font-size:13px;color:#365b86;font-weight:700; }
.admin-login { margin-left:0; }.login-story { background:linear-gradient(135deg,#04152b,#0b305d); }.login-story h1 { font-weight:800; }.login-mark { color:#5ee0ff; }
.admin-stat strong { color:#053d85; }.admin-plan { background:linear-gradient(125deg,#04172e,#0a2e5d);color:#e0ebf8; }.admin-plan h2 { color:#fff; }.admin-plan p { color:#c7d9ee; }.admin-plan .eyebrow { color:#60e0ff; }.admin-plan .admin-report-bar>div,.admin-plan .admin-audit { color:#e0ebf8; }.admin-plan .admin-note { color:#214368; }
.member-admin-layout { display:grid;grid-template-columns:minmax(0,1.4fr) minmax(300px,1fr);gap:23px;align-items:start; }.member-admin-summary { display:flex;gap:10px;flex-wrap:wrap;margin:20px 0; }.member-admin-summary span { font-size:12px;background:#eaf1f5;padding:7px 12px;border-radius:8px;color:#566c83; }
.member-work-preview { margin-top:22px; }.member-work-preview>h3 { margin-bottom:12px; }.member-work-preview article { border:1px solid #dce3e9;padding:14px;border-radius:13px;margin-bottom:10px;background:#f8fafb; }.member-work-preview article p { white-space:pre-wrap;word-break:break-word;font-size:12px;margin-top:10px; }.member-work-preview summary { cursor:pointer;font-weight:700;font-size:13px; }
.reset-link-panel { margin-top:20px;border-top:1px solid #e4e9ec;padding-top:18px; }.reset-link-panel p { font-size:12px;color:#828a91; }.reset-link-panel input { width:100%;margin-top:12px; }.member-note { padding:14px 18px;background:#e7f0f5;border:1px solid #d0dde4;border-radius:13px;color:#586d81;font-size:12px;margin-bottom:22px; }
#member-save-notice { margin:15px 30px 0;background:#fff4d7;color:#795e27;border:1px solid #eeddb0;border-radius:11px;padding:12px 16px;font-size:12px; }#member-save-notice button { font-weight:700;text-decoration:underline;margin-left:12px; }
footer { border-top:1px solid #d9e0e7; }
@media(min-width:1101px) and (max-height:780px) { .rail { padding-top:18px; }.side-scope { padding-bottom:14px;margin-bottom:12px; }.workspace-switch { margin-bottom:14px; }.nav-item { height:43px; } }
@media(max-width:1200px) { .welcome-grid { grid-template-columns:minmax(0,1.5fr) minmax(260px,1fr); }.hero h2 { font-size:41px; }.hero { padding:25px 18px; }.start-card { padding:22px 20px;margin:60px 5px 0; }.principles { grid-template-columns:repeat(2,1fr);gap:18px; }.hero-copy>p { font-size:13px; }.member-admin-layout { grid-template-columns:1fr; } }
@media(min-width:801px) and (max-width:1100px) { .rail { width:88px;padding:26px 14px;align-items:center; }.rail>.brand-symbol { display:block;font-size:37px;margin-bottom:24px; }.side-scope,.workspace-switch { display:none; }.nav-item { width:58px;justify-content:center;padding:0;height:53px; }.nav-label { position:absolute;left:65px;top:10px;background:#072142;color:#fff;padding:7px 13px;opacity:0;visibility:hidden;white-space:nowrap; }.rail-bottom { flex-direction:column;align-items:center;padding:12px 0; }.shell { margin-left:88px; }.search { max-width:32%; }.prototype-tag { display:none; } }
@media(max-width:900px) { .member-auth { grid-template-columns:1fr 1.15fr; }.member-story { padding:35px 25px; }.member-form-panel { padding:30px 24px; }.member-story h1 { font-size:31px; }.member-welcome { padding:30px 25px; }.member-welcome h2 { font-size:28px; }.member-progress { min-width:190px;padding:22px; } }
@media(max-width:800px) {
 .topbar,.admin-top { height:72px;padding:0 16px;gap:12px; }.wordmark { font-size:16px;letter-spacing:-.6px; }.wordmark::before { width:33px;height:33px;font-size:27px;margin-right:8px;border-radius:10px; }.wordmark b { font-size:16px; }.top-actions { gap:8px; }.search,.prototype-tag { display:none; }.member-label { display:none; }.member-avatar { width:33px;height:33px;font-size:17px;border-radius:10px; }.icon-button { width:32px;height:32px; }.mobile-toggle { display:inline-flex; }.shell { margin-left:0;padding-top:72px; }.rail { top:72px;bottom:0;width:264px;transform:translateX(-100%);transition:transform .2s;display:flex;padding:25px 16px;box-shadow:15px 0 40px #04142c30; }.rail.menu-open { transform:translateX(0); }.rail nav { flex-direction:column; }.rail .brand-symbol { display:none; }.rail .nav-item { width:100%;height:49px;justify-content:flex-start;padding:0 16px;gap:13px; }.rail .nav-label { position:static;opacity:1;visibility:visible;background:none;padding:0;font-size:13px;white-space:normal; }.rail-bottom { display:flex;margin-top:auto; }.admin-mobile-toggle { display:inline-flex; }.admin-chip { display:none; }.admin-top>a[href="/"] { font-size:11px; }.admin-top .wordmark { font-size:15px; }
 main,.admin-main { padding:24px 20px 35px; }.learning-steps { margin-top:15px;padding:0 20px; }.learning-steps a { min-height:42px;font-size:12px;gap:6px; }.learning-steps a span { font-size:9px; }.page-heading { align-items:flex-start;gap:12px; }.page-heading h1 { font-size:27px; }.top-link { display:none; }.welcome-grid { grid-template-columns:1fr;padding:5px 8px 18px;border-radius:25px; }.hero { min-height:355px;padding:25px 22px 15px; }.hero h2 { font-size:44px;line-height:1.35;letter-spacing:-1.2px; }.hero-copy { width:100%; }.hero-copy>p { font-size:14px; }.hero-art { right:-15px;width:42%;top:95px;bottom:-45px;opacity:.12; }.start-card { margin:0 15px;padding:23px; }.start-card>p { font-size:12px; }.start-card h2 { font-size:22px; }.start-steps { margin:14px 0; }.start-steps a { padding:10px 0; }.hero-bottom { margin-top:20px; }.principles { padding:20px 12px;grid-template-columns:1fr 1fr;gap:18px 7px;margin-top:20px; }.principles>div { padding:0 8px;border:0; }.principles>div>span { font-size:12px; }.principles b { font-size:25px; }.principles small { font-size:9px; }
 .member-auth { grid-template-columns:1fr;margin:4px auto; }.member-story { padding:28px; }.member-story-mark { margin-bottom:18px;font-size:42px; }.member-story h1 { font-size:32px; }.member-story>p:not(.eyebrow) { margin-top:14px; }.member-story-points { display:none; }.member-form-panel { padding:28px; }.member-welcome { flex-direction:column;padding:27px; }.member-progress { min-width:0;width:100%;padding:20px; }.member-progress strong { font-size:43px; }.member-stats { gap:9px; }.member-stats>div { padding:13px 11px; }.member-stats span { font-size:10px; }.member-stats strong { font-size:28px; }.member-stats small { font-size:11px; }.member-account-grid { grid-template-columns:1fr; }.member-import { flex-direction:column;align-items:flex-start; }.member-admin-layout { grid-template-columns:1fr; }.member-welcome h2 { font-size:29px; }.panel { border-radius:19px; }
 #member-save-notice { margin:12px 20px 0; }.admin-rail .rail-bottom { margin-top:20px; }.admin-login { grid-template-columns:1fr; }.login-story { display:none; }.login-panel { min-height:100vh;padding:32px 24px; }.login-panel h2 { font-size:28px; }
}
@media(max-width:380px) { main,.admin-main { padding:22px 16px; }.learning-steps { padding:0 16px; }.learning-steps a span { display:none; }.hero { padding:22px 17px 14px; }.hero h2 { font-size:36px; }.hero-copy>p { font-size:12px; }.hero-label { font-size:8px; }.start-card { margin:0 8px;padding:20px; }.top-actions { gap:6px; }#help-button { display:none; }.wordmark::before { width:30px;height:30px;margin-right:6px; }.wordmark,.wordmark b { font-size:14px; }.member-form-panel { padding:25px 20px; }.member-story { padding:26px 22px; }.member-stats strong { font-size:25px; }.member-welcome { padding:22px; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none!important;scroll-behavior:auto!important; } }

.member-admin-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:24px;align-items:start}.member-summary{display:grid;gap:5px;padding:18px 0;color:#243f5e}.member-summary span,.member-work small{font-size:12px;color:#6a7785}.member-work{border-top:1px solid #dee6ea;padding:15px 0}.member-work small{display:block}.member-work p{white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px}.admin-form hr{border:0;border-top:1px solid #dce3e8;margin:20px 0}.admin-table td small{display:block}.admin-form input[readonly]{font-size:12px}#member-reset-result:empty{display:none}
@media(max-width:1200px){.member-admin-grid{grid-template-columns:1fr}}
.member-admin-grid>div,.member-admin-grid>form{min-width:0}.member-admin-grid .admin-table-wrap{max-width:100%;overflow:auto}@media(max-width:1200px){.member-admin-grid{grid-template-columns:minmax(0,1fr)}}

main,.admin-main{scroll-margin-top:100px}.skip-link{z-index:60}

@media(max-width:800px){.rail{height:auto;flex-direction:column;border-radius:0;left:0;right:auto;overflow-y:auto}.rail nav,.rail.menu-open nav{display:flex;flex-direction:column;justify-content:flex-start;grid-template-columns:none;gap:5px}.rail-bottom{width:100%}#member-save-notice small{display:block;margin-top:6px}}

/* Local, compressed AI-learning artwork shared by learner and account pages. */
.welcome-grid{background-color:#071d49;background-image:linear-gradient(90deg,#041636ee 0%,#061b42bd 47%,#0b245957 100%),url('assets/ai-learning-blue.webp');background-size:cover;background-position:center;}
.hero-art{display:none;}
.hero em{color:#6bdcff;}
.member-story,.login-story{background-color:#082451;background-image:linear-gradient(135deg,#031c49ef,#0d3775ad),url('assets/ai-learning-blue.webp');background-size:cover;background-position:68% center;}
.member-welcome,.admin-plan{background-color:#0a2b5e;background-image:linear-gradient(90deg,#061e4aee,#0c3675b8),url('assets/ai-learning-blue.webp');background-size:cover;background-position:center;}
@media(max-width:800px){.welcome-grid{background-image:linear-gradient(180deg,#041636ba,#051a40e8 56%),url('assets/ai-learning-blue.webp');background-position:68% top;background-size:auto 660px;}.member-story{background-position:65% center;}}
.course-visual .module-cover{width:100%;height:100%;object-fit:cover;display:block;}
.course-visual .module-number,.course-visual .visual-arrow{z-index:1;color:#fff;background:#061a459c;opacity:1;border:1px solid #c4edff40;border-radius:8px;line-height:1;}
.course-visual .module-number{padding:7px 9px;}
.course-visual .visual-arrow{padding:4px 8px;}
.lesson-title-row>div{width:160px;height:90px;flex-shrink:0;background:transparent;}
.lesson-title-row .module-cover{width:160px;height:90px;object-fit:cover;border-radius:12px;display:block;}
@media(max-width:600px){.lesson-title-row>div{width:100px;height:64px;}.lesson-title-row .module-cover{width:100px;height:64px;}}