:root{--theme-canvas:#f5f7fa;--theme-surface:#fff;--theme-surface-raised:#f1f5f8;--theme-text:#142238;--theme-muted:#66758a;--theme-border:#dfe7ee;--theme-accent:#147d91;--theme-input:#fff}
.theme-toggle{display:inline-grid;place-items:center;flex:none;width:38px;height:38px;margin-left:12px;padding:0;border:1px solid #d8e0e8;border-radius:50%;background:transparent;color:#42556c;cursor:pointer;transition:background .18s,border-color .18s,color .18s}
.theme-toggle:hover{background:#edf4f6;border-color:#9ac9ce;color:#087f91}
.theme-toggle:focus-visible{outline:3px solid #63ddd0;outline-offset:2px}
.theme-icon{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.theme-icon-sun{display:none}

html[data-theme="dark"]{color-scheme:dark;--ink:#e7edf5;--muted:#aab7c8;--paper:#0b1220;--line:#283649;--deep:#102f3c;--theme-canvas:#0b1220;--theme-surface:#111d30;--theme-surface-raised:#172438;--theme-text:#e7edf5;--theme-muted:#b2bfd0;--theme-border:#293a50;--theme-accent:#73d7d2;--theme-input:#111d30}
html[data-theme="dark"] body{background:var(--theme-canvas);color:var(--theme-text)}
html[data-theme="dark"] h1,html[data-theme="dark"] h2,html[data-theme="dark"] h3,html[data-theme="dark"] h4,html[data-theme="dark"] h5,html[data-theme="dark"] h6{color:var(--theme-text)}
html[data-theme="dark"] p,html[data-theme="dark"] li,html[data-theme="dark"] label{color:var(--theme-muted)}
html[data-theme="dark"] .site-header{background:rgba(11,18,32,.96);border-color:#263449;box-shadow:0 3px 14px #0005}
html[data-theme="dark"] .brand,html[data-theme="dark"] .site-footer .brand{color:#e8eef6}
html[data-theme="dark"] .brand-name{color:#e8eef6}
html[data-theme="dark"] .brand-name b{color:#b5c4d5}
html[data-theme="dark"] .brand-dot{color:#73d7d2}
html[data-theme="dark"] .main-nav,html[data-theme="dark"] .hero-note,html[data-theme="dark"] .eyebrow,html[data-theme="dark"] .hero-bottom,html[data-theme="dark"] .site-footer{color:#9cacc0}
html[data-theme="dark"] .main-nav .nav-active,html[data-theme="dark"] .main-nav a:hover,html[data-theme="dark"] .main-nav a:focus-visible{color:#f4f7fb}
html[data-theme="dark"] .theme-toggle{border-color:#3b4b61;background:#111d30;color:#e4edf7}
html[data-theme="dark"] .theme-toggle:hover{background:#1b2c42;border-color:#63c9cd;color:#75e1dc}
html[data-theme="dark"] .theme-icon-moon{display:none}
html[data-theme="dark"] .theme-icon-sun{display:block}
html[data-theme="dark"] .hero h1,html[data-theme="dark"] .art-title,html[data-theme="dark"] .section-heading h2,html[data-theme="dark"] .newsletter h2{color:#eef3fa}
html[data-theme="dark"] .headline-accent,html[data-theme="dark"] .section-heading h2 span{color:#98c87d}
html[data-theme="dark"] .hero-intro,html[data-theme="dark"] .intro-description,html[data-theme="dark"] .section-aside,html[data-theme="dark"] .newsletter>div>p:last-child{color:#aab7c8}
html[data-theme="dark"] .hero,html[data-theme="dark"] .projects-hero{background:#0b1220}
html[data-theme="dark"] .hero h1,html[data-theme="dark"] .projects-hero h1,html[data-theme="dark"] .about-platform .about-copy h2,html[data-theme="dark"] .learning-model-card h3{color:#eef3fa}
html[data-theme="dark"] .projects-hero h1 span,html[data-theme="dark"] .about-platform .about-copy h2 span{color:#73d7d2}
html[data-theme="dark"] .projects-hero>p:not(.eyebrow),html[data-theme="dark"] .about-lead{color:#b2bfd0}
html[data-theme="dark"] .about-platform .about-detail,html[data-theme="dark"] .about-aside p,html[data-theme="dark"] .about-footnote{color:#aab7c8}
html[data-theme="dark"] .about-platform,html[data-theme="dark"] .domains-section,html[data-theme="dark"] .learning-model{background:#0d1727}
html[data-theme="dark"] .about-aside{background:#142237;border-color:#293a50}
html[data-theme="dark"] .site-footer{background:#0d1727;border-color:#293a50;color:#aab7c8}
html[data-theme="dark"] .art-orbit{border-color:#26364b}
html[data-theme="dark"] .art-card,html[data-theme="dark"] .content-card,html[data-theme="dark"] .course-card,html[data-theme="dark"] .buildbook-card,html[data-theme="dark"] .benefit-card,html[data-theme="dark"] .about-aside,html[data-theme="dark"] .domain-card,html[data-theme="dark"] .project-list-card,html[data-theme="dark"] .project-brief,html[data-theme="dark"] .project-prereq,html[data-theme="dark"] .buildbook-feature,html[data-theme="dark"] .learning-stage,html[data-theme="dark"] .specialty-grid article,html[data-theme="dark"] .specialty-card,html[data-theme="dark"] .search-result,html[data-theme="dark"] .domain-resource-card,html[data-theme="dark"] .library-filter-empty{background:#111d30;border-color:#293a50;color:#e5edf6;box-shadow:0 12px 30px #0002}
html[data-theme="dark"] .about-platform,html[data-theme="dark"] .domains-section{background:#0d1727}
html[data-theme="dark"] .art-top,html[data-theme="dark"] .art-bottom,html[data-theme="dark"] .card-meta,html[data-theme="dark"] .content-card>p,html[data-theme="dark"] .buildbook-copy>p,html[data-theme="dark"] .learning-article p,html[data-theme="dark"] .learning-article li,html[data-theme="dark"] .comparison-table th,html[data-theme="dark"] .comparison-table td,html[data-theme="dark"] .domain-resource-card>p,html[data-theme="dark"] .domain-page-description,html[data-theme="dark"] .search-result p{color:#b2bfd0}
html[data-theme="dark"] .content-card h3,html[data-theme="dark"] .buildbook-copy h3,html[data-theme="dark"] .learning-article h2,html[data-theme="dark"] .learning-article h3,html[data-theme="dark"] .specialty-card h3,html[data-theme="dark"] .domain-resource-heading h2,html[data-theme="dark"] .domain-resource-card h3,html[data-theme="dark"] .domain-contribute h2,html[data-theme="dark"] .search-result h2,html[data-theme="dark"] .buildbook-note strong{color:#edf3fa}
html[data-theme="dark"] .intro-strip,html[data-theme="dark"] .library-filter-bar,html[data-theme="dark"] .library-tools,html[data-theme="dark"] .comparison-table,html[data-theme="dark"] .comparison-table thead th,html[data-theme="dark"] .domain-library-note,html[data-theme="dark"] .domain-empty,html[data-theme="dark"] .domain-tag,html[data-theme="dark"] .lesson-outcome,html[data-theme="dark"] .project-step-nav,html[data-theme="dark"] .project-step-number{background:#111d30;border-color:#293a50;color:#dbe5f1}
html[data-theme="dark"] .domain-contribute,html[data-theme="dark"] .learning-figure,html[data-theme="dark"] .learning-note,html[data-theme="dark"] .learning-article blockquote,html[data-theme="dark"] .stage-outcome{background:#142b39;border-color:#285064;color:#d9e8f2}
html[data-theme="dark"] .domain-tag:hover,html[data-theme="dark"] .domain-tag.current{background:#173b43;border-color:#34727a;color:#8de3dd}
html[data-theme="dark"] .filter{color:#a8b6c8}
html[data-theme="dark"] .filter.active{color:#ecf4fb}
html[data-theme="dark"] .filter span,html[data-theme="dark"] .search-box{color:#9aaec0}
html[data-theme="dark"] .search-box,html[data-theme="dark"] .newsletter form{border-color:#34465c}
html[data-theme="dark"] .search-box input,html[data-theme="dark"] .newsletter input{color:#e7edf5}
html[data-theme="dark"] .search-box input::placeholder,html[data-theme="dark"] .newsletter input::placeholder{color:#8494a9}
html[data-theme="dark"] .site-search{background:#111d30;border-color:#34465c}
html[data-theme="dark"] .site-search input{color:#e7edf5}
html[data-theme="dark"] .site-search input::placeholder{color:#91a0b4}
html[data-theme="dark"] .site-footer,html[data-theme="dark"] .content-actions,html[data-theme="dark"] .learning-next{border-color:#293a50}
html[data-theme="dark"] .learning-article{color:#d8e2ef}
html[data-theme="dark"] .learning-sources{background:#111d30;border-color:#293a50}
html[data-theme="dark"] .learning-figure figcaption,html[data-theme="dark"] .learning-sources p{color:#aab7c8}
html[data-theme="dark"] .comparison-table-wrap{border-color:#293a50}
html[data-theme="dark"] .comparison-table th,html[data-theme="dark"] .comparison-table td{border-color:#293a50}
html[data-theme="dark"] .domain-resource-card,html[data-theme="dark"] .domain-resource-card h3{color:#edf3fa}
html[data-theme="dark"] .project-spec-grid>div,html[data-theme="dark"] .project-list-facts span,html[data-theme="dark"] .architecture-flow span,html[data-theme="dark"] .course-topics span,html[data-theme="dark"] .buildbook-card-topics span,html[data-theme="dark"] .course-card .course-topics span,html[data-theme="dark"] .project-highlights span{background:#142237;border-color:#344a62;color:#d6e4f3}
html[data-theme="dark"] .project-spec-grid strong,html[data-theme="dark"] .project-list-facts b{color:#edf3fa}
html[data-theme="dark"] .article-callout,html[data-theme="dark"] .courses-note,html[data-theme="dark"] .buildbook-coverage,html[data-theme="dark"] .learning-model-card,html[data-theme="dark"] .learning-model-courses,html[data-theme="dark"] .learning-model-project{background:#111d30;border-color:#293a50;color:#dce7f3}
html[data-theme="dark"] .article-section code,html[data-theme="dark"] .article-section pre,html[data-theme="dark"] .article-section pre code{background:#101a29;color:#dce7f3}
html[data-theme="dark"] .library-filter-bar select{background:#111d30;border-color:#34465c;color:#e7edf5}
html[data-theme="dark"] .footer-social a{background:#142237;border-color:#344a62;color:#cbd9e8}
html[data-theme="dark"] .footer-social a:hover{background:#173b43;border-color:#34727a;color:#8de3dd}
html[data-theme="dark"] .about-stamp{background:#d8f36f;color:#17261d}

/* Keep account actions after the site search in every shared header. */
.site-header .brand{order:1}
.site-header .main-nav{order:2}
.site-header .site-search{order:3}
.site-header .account-nav-link,.site-header .account-nav-home{order:4}
.site-header .account-signout{order:5}
.site-header .theme-toggle{order:6}
@media(min-width:851px){
  .site-header{display:grid;grid-template-columns:max-content minmax(0,max-content) minmax(0,1fr) max-content max-content max-content minmax(0,1fr) max-content;justify-content:initial;column-gap:10px;row-gap:0}
  .site-header .brand{grid-column:1}
  .site-header .main-nav{grid-column:2;min-width:0}
  .site-header .site-search{grid-column:4;width:clamp(155px,19vw,235px);margin:0}
  .site-header .account-nav-link,.site-header .account-nav-home{grid-column:5;margin-left:0}
  .site-header .account-signout{grid-column:6;margin-left:0}
  .site-header .theme-toggle{grid-column:8;margin-left:0}
}
@media(max-width:850px){
  .site-header{justify-content:space-between}
  .site-header .brand{order:1}
  .site-header .theme-toggle{order:2}
  .site-header .mobile-menu-toggle{order:3}
  .site-header .main-nav{order:4}
  .site-header .site-search{order:5}
  .site-header .account-nav-link,.site-header .account-nav-home{order:6}
  .site-header .account-signout{order:7;align-self:flex-end;margin:0 0 10px 8px}
}
html[data-theme="dark"] .domain-status{background:#1a2a40;color:#b6c6d8}
html[data-theme="dark"] .domain-empty a,html[data-theme="dark"] .domain-library-note a{color:#70d6d2}
html[data-theme="dark"] .content-action{background:#142237;border-color:#344a62;color:#d6e4f3}
html[data-theme="dark"] .content-action:hover,html[data-theme="dark"] .content-like[aria-pressed="true"]{background:#173b43;border-color:#34727a;color:#8de3dd}
html[data-theme="dark"] .learning-meta span{color:#dbe8f2}
html[data-theme="dark"] .project-step{color:#b4c1d1}
html[data-theme="dark"] .project-step.current{background:#1c4556;border-color:#34727a;color:#fff}
html[data-theme="dark"] .buildbook-index,html[data-theme="dark"] .domain-hero,html[data-theme="dark"] .learning-hero,html[data-theme="dark"] .projects-hero{background:linear-gradient(135deg,#10263f 45%,#123c4c);border-color:#285064}
html[data-theme="dark"] .path-band{background:#102f31}
html[data-theme="dark"] .newsletter{background:#0e1929}
html[data-theme="dark"] .button-dark{background:#d8f36f;color:#17261d}
html[data-theme="dark"] .button-dark span{color:#183d32}
html[data-theme="dark"] .button-light{background:#d8f36f;color:#17261d}
html[data-theme="dark"] .site-footer .footer-contact{color:#73d6d1}
html[data-theme="dark"] .site-footer .footer-contact:hover{color:#b2f0eb}
html[data-theme="dark"] .header-cta{border-color:#36475d;color:#dce7f3}
html[data-theme="dark"] .header-cta span{color:#80ded8}

/* New pages should use the --theme-* semantic colors for page surfaces, text,
   borders, links, and form controls. These values switch with the theme. */
html[data-theme="dark"] .site-search,html[data-theme="dark"] input,html[data-theme="dark"] textarea,html[data-theme="dark"] select{background-color:var(--theme-input);color:var(--theme-text);border-color:var(--theme-border)}
html[data-theme="dark"] ::placeholder{color:#91a0b4}
html[data-theme="dark"] .learning-article h1,html[data-theme="dark"] .search-shell h1{color:#eef3fa}
html[data-theme="dark"] .learning-article a,html[data-theme="dark"] .learning-next a,html[data-theme="dark"] .inline-learning-link{color:#73d7d2}
html[data-theme="dark"] .learning-article a:hover,html[data-theme="dark"] .learning-next a:hover{color:#a7efea}
html[data-theme="dark"] .project-list-card h3,html[data-theme="dark"] .project-brief h2,html[data-theme="dark"] .project-spec-grid strong{color:#edf3fa}
html[data-theme="dark"] .learning-model-number,html[data-theme="dark"] .project-list-kicker{color:#73d7d2}
html[data-theme="dark"] .learning-model-card p,html[data-theme="dark"] .learning-model-card a{color:#b2bfd0}
html[data-theme="dark"] .about-stamp{background:#d8f36f;color:#17261d}

@media(max-width:850px){.theme-toggle{margin-left:8px}}
@media(max-width:850px){.site-header{height:auto;min-height:68px;flex-wrap:wrap;align-items:center;row-gap:10px;padding:10px 5% 0}.site-header .brand{order:1;min-width:0}.theme-toggle{order:2;width:34px;height:34px;margin-left:auto;margin-right:8px}.theme-icon{width:16px;height:16px}.mobile-menu-toggle{display:none;order:3;flex:none}.site-header .main-nav{order:4;display:flex;width:100%;flex-direction:row;align-items:center;justify-content:flex-start;gap:clamp(14px,4vw,26px);overflow-x:auto;padding:0 0 7px;border-top:0;scrollbar-width:none;-webkit-overflow-scrolling:touch;white-space:nowrap}.site-header .main-nav::-webkit-scrollbar{display:none}.site-header.has-mobile-menu .mobile-menu-toggle{display:inline-flex}.site-header.has-mobile-menu:not(.is-menu-open) .main-nav{display:none}.site-header.has-mobile-menu.is-menu-open .main-nav{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;overflow:visible;padding:8px 0 12px;border-top:1px solid var(--theme-border);white-space:normal}.site-header .main-nav a{min-height:40px;padding:8px 2px;font-size:12px}.site-header .main-nav a::after{display:none}.site-header .site-search{order:5;flex:0 0 100%;width:100%;height:40px;min-width:0;margin:0 0 0}.site-header .site-search input{min-width:0}.site-header .site-search button{height:38px}.site-header .account-nav-link{order:6;align-self:flex-end;min-height:38px;margin:0 0 10px auto;padding:0 14px}}
@media(prefers-reduced-motion:reduce){.theme-toggle{transition:none}}

.site-header .account-nav-link{min-height:36px;padding:0 14px;border:1px solid #142238;border-radius:8px;background:#142238;color:#fff!important;font:700 11px/1 var(--sans);white-space:nowrap;box-shadow:0 4px 10px #14223814;transition:background .18s,border-color .18s,box-shadow .18s;cursor:pointer}
.site-header a.account-nav-link::after{display:none}
.site-header .account-nav-link:hover{background:#1e3757;border-color:#1e3757;color:#fff!important;box-shadow:0 6px 14px #14223824}
.site-header .account-nav-link:focus-visible,.mobile-menu-toggle:focus-visible{outline:3px solid #63ddd0;outline-offset:3px}
.site-header .account-nav-link[hidden]{display:none}
.site-header .account-nav-home{color:var(--theme-accent)!important;font-weight:700!important}
.site-header .account-nav-link:disabled{cursor:wait;opacity:.72}
.mobile-menu-toggle{display:none;align-items:center;justify-content:center;gap:8px;min-height:38px;padding:0 11px;border:1px solid #d8e0e8;border-radius:8px;background:var(--theme-surface);color:var(--theme-text);font:600 11px var(--sans);cursor:pointer}
.mobile-menu-icon{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
html[data-theme="dark"] .site-header .account-nav-link{border-color:#d8f36f;background:#d8f36f;color:#17261d!important;box-shadow:0 4px 10px #0002}
html[data-theme="dark"] .site-header .account-nav-link:hover{border-color:#c9e960;background:#c9e960;color:#17261d!important}
html[data-theme="dark"] .site-header .account-nav-home{color:var(--theme-accent)!important}
html[data-theme="dark"] .mobile-menu-toggle{border-color:#3b4b61;background:#111d30;color:#e4edf7}
.library-card-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:18px}
.library-dashboard-action{min-height:40px;border:0;border-radius:8px;font-family:var(--sans);cursor:pointer}
.library-dashboard-action.is-saved{background:#e2f1e8;color:#173d32}
html[data-theme="dark"] .library-dashboard-action.is-saved{background:#173b43;color:#8de3dd}
.library-dashboard-action:disabled{cursor:wait;opacity:.75}

/* Keep the full navigation readable at medium desktop widths. */
@media(min-width:851px) and (max-width:1199px){
  .site-header{display:grid;grid-template-columns:max-content minmax(0,1fr) max-content max-content;grid-template-rows:auto auto;align-items:center;column-gap:14px;row-gap:10px;height:auto;min-height:82px;padding:12px 5%}
  .site-header .brand{grid-column:1;grid-row:1}
  .site-header .main-nav{grid-column:2/4;grid-row:1;min-width:0;overflow-x:auto;white-space:nowrap;scrollbar-width:none}
  .site-header .main-nav::-webkit-scrollbar{display:none}
  .site-header .theme-toggle{grid-column:4;grid-row:1;margin:0}
  .site-header .site-search{grid-column:2;grid-row:2;width:clamp(190px,28vw,260px);margin:0}
  .site-header .account-nav-link,.site-header .account-nav-home,.site-header .account-signout{grid-column:3;grid-row:2;justify-self:start;margin:0}
}
.site-header .account-nav-link,.site-header .account-signout,.button-dark,.button-light,.header-cta,
.library-dashboard-action,.account-google-button{
  display:inline-flex;align-items:center;justify-content:center;text-align:center;line-height:1.25
}
.main-nav a::after{background:var(--theme-accent)}
.main-nav .nav-active,.main-nav a:hover,.main-nav a:focus-visible{color:var(--theme-accent)}
@media(max-width:700px){
  .hero-art{height:390px;margin-top:22px;max-width:100%}
  .hero-art .art-orbit,.hero-art .orbit-two{width:min(340px,100%);height:auto;aspect-ratio:1}
  .hero-art .art-card{width:min(310px,88%);height:265px;transform:none;padding:16px}
  .hero-art .art-sticker{right:0;bottom:0;width:64px;height:64px;transform:none;font-size:8px}
}
@media(max-width:420px){
  .hero-art{height:360px}
  .hero-art .art-orbit,.hero-art .orbit-two{width:min(330px,100%)}
  .hero-art .art-card{width:min(285px,86%);height:245px;padding:15px}
  .hero-art .art-title{font-size:29px;margin:14px 0 9px}
  .hero-art .art-sticker{width:60px;height:60px;font-size:7px}
}

/* Center the desktop navigation while keeping search and account actions grouped at the right. */
@media(min-width:1200px){
  .site-header{display:flex;position:sticky;justify-content:space-between;gap:clamp(12px,1.2vw,22px)}
  .site-header .brand{flex:none}
  .site-header .main-nav{position:absolute;left:50%;transform:translateX(-50%);gap:clamp(16px,2vw,34px);white-space:nowrap}
  .site-header .site-search{flex:0 1 clamp(165px,16vw,230px);margin:0 0 0 auto}
  .site-header .account-nav-link,.site-header .account-nav-home,.site-header .account-signout{flex:none;margin:0}
  .site-header .theme-toggle{flex:none;margin:0 0 0 4px}
}

@media(min-width:851px) and (max-width:1199px){
  .site-header .main-nav{justify-self:center}
  .site-header .site-search{justify-self:end}
  .site-header .account-nav-link,.site-header .account-nav-home,.site-header .account-signout{justify-self:start}
}

/* Give account buttons a fixed, centered label box in every theme and header layout. */
.site-header .account-nav-link,.site-header .account-signout{
  box-sizing:border-box;height:40px;min-height:40px;padding:0 16px;line-height:1.2;vertical-align:middle
}
