/* Consistent dark blue workspace and navigation. */
:root{--hub-accent:#367bf5;--hub-muted:#9aa7bf;--hub-border:#293650}
body{background:#0b111d;color:#e5edf9;-webkit-font-smoothing:antialiased}
body>aside{background:#101421;border-right:1px solid #242e43;padding:30px 17px 20px;box-shadow:8px 0 35px #00000015}
body>aside .brand{position:relative;display:block;padding:4px 4px 4px 42px;margin:0 9px 30px;font-size:27px;font-weight:700;letter-spacing:-.8px;color:#f0f3ff;line-height:1.15}
body>aside .brand-flower{position:absolute;left:0;top:1px;width:28px;height:37px;color:#eeb36d;display:block}
body>aside .brand-flower svg{width:100%;height:100%}
body>aside .brand-small{display:block;font-size:9px;letter-spacing:2.9px;font-weight:600;color:#8e99b2;margin:7px 0 0;line-height:1.2}
body .site-nav{display:grid;gap:22px;padding:0 0 10px}
body .site-nav .nav-group{gap:5px}
body .site-nav .nav-group-label{font-size:9px;letter-spacing:.55px;line-height:1.6;font-weight:650;color:#7e8aa3;margin:0 8px 8px}
body .site-nav button{box-sizing:border-box;display:flex;align-items:center;gap:13px;width:100%;min-height:48px;padding:12px 14px;border:1px solid transparent;border-radius:13px;background:transparent;color:#aeb9ce;text-align:left;transition:background .18s,color .18s,border-color .18s}
body .site-nav button span{font-size:13px;line-height:1.45;font-weight:450}
body .nav-icon{width:21px;height:21px;flex:0 0 21px;display:block;color:inherit}
body .site-nav button:hover{background:#1a2539;border-color:#293b56;color:#e9f2ff}
body .site-nav button.active{background:linear-gradient(110deg,#2863df,#367ef5);border-color:#478afc;color:#fff;box-shadow:0 5px 18px #1e62df25}
body .site-nav button.active span{font-weight:650}
body .site-nav button:focus-visible{outline:2px solid #8fc6ff;outline-offset:3px}
body #cloud-status{border-radius:10px;background:#142034;border:1px solid #2d405d;font-size:10px;line-height:1.6;padding:10px 12px;color:#a5bcda}
body>aside .side-note{border:1px solid #263750;border-radius:13px;background:#111c2f;padding:17px;margin-top:16px;color:#7e9ac0}
body>aside .side-note h3{font-size:13px;line-height:1.6;color:#d3e2f7;margin:8px 0}
body>aside .side-note p{font-size:11px;line-height:1.8;color:#8d9fba}
body main>header{background:transparent;border-color:#26334a;padding-bottom:19px;margin-bottom:26px;color:#8fa3c1}
body .header-actions button{background:#131e30;border:1px solid #2e405d;border-radius:9px;color:#bbcee9;font-size:11px;transition:background .18s}
body .header-actions button:hover:not(:disabled){background:#203653;color:#fff}
body main .panel{border-radius:15px;box-shadow:0 5px 22px #00000012}
body #app>.page-heading{margin-bottom:26px}
body .primary{border-radius:9px;box-shadow:0 3px 10px #1e63dc1a}
body .secondary{border-radius:9px}
body input:focus-visible,body select:focus-visible,body textarea:focus-visible{outline:2px solid #5995ee;outline-offset:2px}
body main>footer{border-top:1px solid #23324a;padding-top:20px;color:#6f829f}
body #mobile-more-menu button{display:flex;align-items:center;gap:12px}
@media(min-width:701px){body>aside{scrollbar-width:thin;scrollbar-color:#314460 transparent}}
@media(max-width:700px){body>aside{padding:15px 18px 12px;background:#101421;border-right:0;border-bottom:1px solid #26344b}body>aside .brand{font-size:23px;margin:0;padding-left:35px}body>aside .brand-flower{width:23px;height:30px}body>aside .brand-small{display:block;font-size:8px;letter-spacing:2.2px;margin:5px 0 0}body .site-nav{display:none}body>aside .side-note{display:none}body #cloud-status{margin-top:10px;padding:5px 9px}body #mobile-bottom-nav{background:#101a2b;border-color:#293c56;box-shadow:0 -6px 25px #0003}body #mobile-bottom-nav button{color:#91a6c5;gap:4px}body #mobile-bottom-nav button.active{background:#1e3e6c;color:#b8daff}body #mobile-bottom-nav .nav-icon{width:21px;height:21px}body main>header{gap:12px;flex-wrap:wrap;margin-bottom:20px}body .header-actions{gap:6px}body .header-actions button{padding:8px}}
@media(prefers-reduced-motion:reduce){body .site-nav button,body .header-actions button{transition:none}}
/* Eye mark, adapted to the compact wordmark. */
body>aside .brand{padding-left:55px;margin-left:5px;margin-right:5px;min-height:40px}
body>aside .brand-eye{position:absolute;left:0;top:3px;width:43px;height:34px;display:flex;align-items:center;justify-content:center}
body>aside .brand-eye img{display:block;width:43px;height:auto;max-width:none;filter:drop-shadow(0 0 7px #5c9dff20)}
@media(max-width:700px){body>aside .brand{padding-left:48px;min-height:35px}body>aside .brand-eye{width:37px;height:30px;top:1px}body>aside .brand-eye img{width:37px}}
/* A welcoming, study-first home. */
body .friendly-hero{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 200px;gap:25px;align-items:center;padding:36px;border:1px solid #304b70;border-radius:22px;background:linear-gradient(120deg,#162a46,#10213a);margin:25px 0 18px;overflow:hidden}
body .friendly-kicker{font-size:10px;letter-spacing:1.6px;color:#94bdf7;font-weight:600}
body .friendly-hero h2{font-size:clamp(25px,3vw,36px);line-height:1.35;color:#f0f5ff;margin:13px 0;overflow-wrap:anywhere}
body .friendly-hero p{font-size:14px;line-height:1.8;color:#a8bdd9;max-width:480px;margin-bottom:23px}
body .friendly-hero .primary{padding:13px 22px;min-height:46px}
body .friendly-art{display:flex;align-items:center;justify-content:center;flex-direction:column;position:relative;min-height:180px;color:#b2d2ff}
body .friendly-art img{width:92px;height:70px;z-index:1;opacity:.85}body .friendly-art>span{font-size:23px;letter-spacing:6px;margin-top:7px;z-index:1}body .friendly-art small{font-size:10px;letter-spacing:1px;color:#779cc9;margin-top:8px}
body .friendly-orbit{position:absolute;border:1px solid #3a5b803f;border-radius:50%;width:190px;height:190px;transform:rotate(-18deg)}body .friendly-orbit:before{content:'';position:absolute;width:155px;height:155px;border:1px solid #5380b52b;border-radius:50%;inset:16px}
body .friendly-actions{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-bottom:34px}
body .friendly-action{position:relative;text-align:left;display:grid;grid-template-columns:44px minmax(0,1fr) 16px;gap:4px 14px;padding:20px;background:#111e31;color:#e2edff;border:1px solid #293e5c;border-radius:15px}
body .friendly-icon{grid-row:span 2;display:grid;place-items:center;background:#1a3455;border-radius:12px;width:44px;height:44px;color:#90bdff}body .friendly-icon svg{width:23px;height:23px}
body .friendly-action strong{font-size:15px}body .friendly-action small{font-size:12px;color:#8da7ca;grid-column:2}body .friendly-arrow{grid-column:3;grid-row:1 / span 2;align-self:center;color:#8fbafa}
body .friendly-section .section-title span{font-size:9px;color:#7d93b2;letter-spacing:.8px}body .friendly-section .section-title h2{font-size:20px}
body .friendly-paths{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:18px 0 28px}
body .friendly-path{padding:22px;text-align:left;border:1px solid #253951;border-radius:15px;background:#101b2b;color:#e2ecfa}body .friendly-path>span{width:42px;height:42px;display:grid;place-items:center;background:#1a2e48;border-radius:11px;font-size:23px;color:#9dc7ff;margin-bottom:15px}body .friendly-path h3{font-size:15px;margin:0 0 8px}body .friendly-path p{font-size:12px;line-height:1.7;color:#8da3c3;min-height:40px}body .friendly-path small{color:#9cc3f9;font-size:11px}
body .friendly-latest{display:flex;justify-content:space-between;align-items:center;gap:20px}body .friendly-latest h3{font-size:17px;overflow-wrap:anywhere;margin:8px 0}body .friendly-latest small{font-size:10px;letter-spacing:1px;color:#80a8d9}body .friendly-latest p{font-size:12px;color:#91a9c9}
body .friendly-action:hover,body .friendly-path:hover{border-color:#527bb0;background:#16283f}
body #friendly-nav-toggle{position:absolute;right:12px;top:8px;display:grid;place-items:center;width:28px;height:26px;border-radius:7px;background:transparent;border:0;color:#7e9dc6;cursor:pointer}
body .friendly-toc-toggle{display:none}
body .friendly-audio-status{width:100%;min-height:20px;display:flex;gap:8px;align-items:center;color:#a8bfdc}
body .friendly-audio-status:before{content:'';width:6px;height:6px;border-radius:50%;background:#6882a5}body .friendly-audio-status[data-playing="true"]{color:#6cdbb0}body .friendly-audio-status[data-playing="true"]:before{background:#6cdbb0;box-shadow:0 0 0 3px #6cdbb019}
body .ds-session{min-height:500px}body .ds-flash{height:340px;min-height:340px;overflow-y:auto;justify-content:center;padding:22px 12px}body .ds-flash+.lesson-toolbar{min-height:52px;margin-bottom:0}
body .ds-course{position:relative;padding:22px;transition:background .15s,border-color .15s}body .ds-course:hover{background:#19314d;border-color:#567daf}
body .ds-course .friendly-topic-glyph{width:45px;height:45px;display:grid;place-items:center;font-size:25px;border-radius:12px;background:#213b5b;color:#a6d2ff;margin-bottom:4px}
@media(min-width:701px){body.friendly-nav-small>aside{width:78px;padding:44px 11px 20px}body.friendly-nav-small main{margin-left:78px}body.friendly-nav-small .site-nav .nav-group-label,body.friendly-nav-small .site-nav button span,body.friendly-nav-small>aside .brand-small,body.friendly-nav-small>aside #cloud-status,body.friendly-nav-small>aside .side-note{display:none}body.friendly-nav-small>aside .brand{font-size:0;padding:0;margin:0 0 28px;height:35px;min-height:35px}body.friendly-nav-small>aside .brand-eye{left:6px;top:0}body.friendly-nav-small .site-nav{gap:19px}body.friendly-nav-small .site-nav button{padding:13px;justify-content:center;border-radius:12px}body.friendly-nav-small #friendly-nav-toggle svg{transform:rotate(180deg)}}
@media(max-width:950px){body .friendly-hero{grid-template-columns:minmax(0,1fr) 130px;padding:27px}body .friendly-art{min-height:150px}body .friendly-orbit{width:140px;height:140px}body .friendly-orbit:before{width:106px;height:106px}body .friendly-art img{width:70px}body .friendly-art>span{font-size:17px;letter-spacing:3px}body .ds-toc .friendly-toc-toggle{display:flex;width:100%;justify-content:space-between;align-items:center;margin:0}body .ds-toc>h3{display:none}body .ds-toc>button[data-ds-open]{display:none}body .ds-toc.friendly-toc-open>button[data-ds-open]{display:block}body .ds-toc{grid-row:1;max-height:260px}body .ds-toc.friendly-toc-open{overflow:auto}}
@media(max-width:700px){body #friendly-nav-toggle{display:none}body .friendly-hero{grid-template-columns:1fr;padding:25px;gap:0}body .friendly-art{display:none}body .friendly-actions{gap:10px}body .friendly-action{padding:16px;grid-template-columns:32px minmax(0,1fr);gap:7px 10px}body .friendly-icon{width:32px;height:32px;border-radius:9px}body .friendly-icon svg{width:19px;height:19px}body .friendly-action strong{font-size:13px}body .friendly-action small{font-size:11px}body .friendly-arrow{display:none}body .friendly-paths{grid-template-columns:1fr}body .friendly-path{display:grid;grid-template-columns:44px 1fr;gap:2px 15px;padding:18px}body .friendly-path>span{grid-row:span 3;margin:0}body .friendly-path p{min-height:0;margin:0}body .friendly-path small{grid-column:2;margin-top:8px}body .friendly-latest{align-items:flex-start;flex-direction:column}body .ds-flash{height:320px;min-height:320px}body .ds-session button{min-height:42px}body .friendly-section .section-title{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){body .ds-course{transition:none}}
