/* Skillfolio Brand Guide v1.0 (2026). Shared across the course, resource and legal pages.
   Keep this last: older collection styles also support independent resource demos. */
@font-face{font-family:'Nunito Sans';src:url('./assets/fonts/nunito-sans-latin-wght-normal.woff2') format('woff2');font-style:normal;font-weight:200 900;font-display:swap}
:root{color-scheme:light;--bg:#f1f1ee;--panel:#fff;--panel-2:#eeeee8;--line:#d8d9d2;--text:#20251f;--muted:#62675e;--signal:#e0582e;--accent:#d43b1c;--green:#d43b1c;--font:'Avenir Next','Nunito Sans',sans-serif;--radius:12px;--paper-grain:none}
body{font-family:var(--font);font-size:15px;line-height:1.55;background:var(--bg);color:var(--text)}
body,.header,#main-dialog,.paths-section,.pathfinder-invite{background-image:none}
::selection{background:var(--panel-2);color:var(--text)}
.wrap,.header-inner,.vault-page .header-inner{width:min(1240px,calc(100% - 96px));margin-inline:auto}
.section-space,.paths-section,.difference,.learning-page .catalog.section-space{padding-block:86px}
.header{background:var(--bg);backdrop-filter:none;border-color:var(--line)}
.header-inner,.vault-page .header-inner{height:88px;gap:24px}
.brand,.header-inner .brand,.footer-top .brand{font-family:var(--font);font-size:33px;font-weight:650;letter-spacing:-1.9px;gap:12px}
.brand .brand-symbol,.header-inner .brand-symbol{order:-1;width:32px;height:32px;flex:none;margin:12px 0 12px 12px;filter:none;transform:none}
.desktop-nav{gap:22px}.desktop-nav a{font-size:13px;font-weight:500}
.nav-icon,.desktop-nav a>svg,.mobile-nav a>svg,.mobile-nav button>svg,.header-library>svg,.value-item>svg,.catalog-footnote>svg,.package-card li>svg,.course-time>svg,.course-lessons>svg,.saved-empty>.ui-icon,.footer-status .status-dot,.success-icon{display:none}
.header-actions{gap:8px}.header-library{margin:0}
.eyebrow{font:700 10px/1.55 var(--font);letter-spacing:1.65px;color:var(--muted)}
.learning-page .hero-copy>.eyebrow,.exhibit-caption,.exhibit-note{color:var(--muted)}
h1,h2,h3,.section-heading h2,.difference h2,.vault-workflow h2,.vault-collection-heading h2,.index-heading h2,.path-card h3,.package-card h3,.template-title-row h3,.dialog-title,.lesson-reader .lesson-header .dialog-title,.closing-cta h2,.value-item h3{font-family:var(--font);font-weight:500;text-transform:none;color:var(--text)}
h2,.section-heading h2,.difference h2,.vault-workflow h2,.vault-collection-heading h2,.index-heading h2,.closing-cta h2{font-size:38px;line-height:1.1;letter-spacing:-1.6px}
h3,.course-title,.path-card h3,.package-card h3,.template-title-row h3,.value-item h3{font-size:21px;line-height:1.1;letter-spacing:-.6px;font-weight:500}
.learning-page .hero{grid-template-columns:1fr 1fr;column-gap:48px;row-gap:0;padding-top:86px;padding-bottom:0}
.learning-page .hero-copy{padding:0}
.learning-page .hero h1,.resource-intro h1{font-family:var(--font);font-size:65px;font-weight:500;line-height:1.09;letter-spacing:-3px;max-width:none;white-space:normal}
.hero h1>span{width:auto;transform:none;white-space:normal}.learning-page .hero h1>span:last-child{color:var(--text)}
.learning-page .hero-intro{padding:24px 0 36px;max-width:440px}
.learning-page .hero-intro>p,.resource-intro>div>p:not(.eyebrow){font-size:15px;line-height:1.55;letter-spacing:0;color:var(--muted)}
.project-exhibit{background:var(--panel-2);background-image:none;border:1px solid var(--line);border-radius:12px;min-height:350px;margin-bottom:36px}
.exhibit-piece{border-color:var(--line);border-radius:4px;box-shadow:0 6px 16px #20251f14;transition:transform .25s ease}
.exhibit-piece:hover,.exhibit-piece:focus-visible{transform:translateY(-2px);box-shadow:0 6px 16px #20251f14}
.exhibit-caption{font:10px/1.55 ui-monospace,monospace;gap:16px}.exhibit-note{font-size:12px}
.learning-page .index-facts{border-color:var(--line)}.learning-page .index-facts span{font-size:13px}.learning-page .index-facts b{font-weight:500}
.button{border-radius:9px;font-size:14px;min-height:44px;transition:transform .2s ease,background .2s ease,color .2s ease}
.button:hover{transform:translateY(-2px)}


.button-outline{background:var(--panel);border-color:var(--accent);color:var(--accent)}.button-outline:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.icon-button,.bookmark-button,.template-save{border-radius:9px;color:var(--text)}.icon-button:hover{background:var(--panel-2);color:var(--text)}
.button svg,.icon-button svg,.text-button svg,.bookmark-button svg,.template-save svg,.search-box svg,.ui-icon{width:20px;height:20px}
.skip-link{background:var(--text);color:#fff}.skip-link:focus{top:16px}
/* Signal ink is used for links; Signal is used for primary CTAs, the mark and focus. */
a:hover,.text-button:hover{color:var(--accent)}
body :focus-visible{outline:2px solid var(--signal)!important;outline-offset:5px!important}
.catalog-controls{gap:12px;border:0;border-bottom:1px solid var(--line);padding-bottom:20px;align-items:center}
.category-tabs{gap:4px;flex-wrap:wrap;overflow:visible}.category{border-radius:7px;border:1px solid transparent;font-size:13px;padding:10px 12px}
.category.active,.category.active:hover,.vault-category.active,.vault-category.active:hover{background:var(--panel-2);color:var(--text);border-color:var(--line)}
.category:hover,.vault-category:hover{background:var(--panel-2);color:var(--text)}.vault-category.active span{color:var(--text)}
.search-box,.vault-search{border:1px solid var(--muted);border-radius:7px;background:#fff;min-height:44px;margin:0;padding:10px 12px}
.search-box input,.vault-search input{font-size:15px}
.sort-controls select,.vault-controls select{font-size:13px;border-radius:7px}
.course-grid,.path-grid,.package-grid,.template-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.course-card,.path-card,.path-card+.path-card,.package-card,.package-card.package-featured,.template-card{background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:none;min-width:0;transition:transform .25s ease}
.course-card{padding:7px;overflow:visible}.course-card:hover{transform:translateY(-5px);box-shadow:none}
.course-card .art-link{border:0;border-radius:7px;overflow:hidden}.course-card .art-link:hover,.course-card .art-link:focus-visible{transform:none;box-shadow:none;opacity:1}
.course-card .art-link:after{content:none}.course-art,.course-art:has(.studio-art){border-radius:7px}
.course-content{padding:18px 12px 12px}.course-meta{font:12px/1.55 var(--font);color:var(--muted)}
.course-outcome,.path-card>p,.template-description,.difference-intro>p,.value-item p{font-size:15px;line-height:1.55}
.course-spec,.course-time,.course-bottom{font-size:13px}.course-bottom{border-color:var(--line)}
.bookmark-button.saved,.template-save[aria-pressed=true]{background:var(--text);color:#fff;border-radius:9px}
.paths-section{background:var(--bg);border-color:var(--line)}.path-grid{border:0}
.path-card,.path-card+.path-card{padding:24px;display:flex;flex-direction:column}.path-card:hover{background:#fff;transform:translateY(-4px);box-shadow:none}
.path-card h3{margin-top:0}.path-card>p{margin:16px 0 24px}.path-top svg{transition:none}.path-card:hover .path-top svg{transform:none}
.path-work{height:190px;border-radius:7px}.path-card:hover .work-orbits{transform:translate(-50%,-50%) rotate(-30deg)}
.path-number,.path-footer{font-size:12px}.bundle-tag{border-radius:4px;background:var(--panel-2);border-color:var(--line);color:var(--text);font-size:12px;font-weight:500}
.specialist-path{border-radius:12px;background:#fff;border-color:var(--line)}.specialist-path:hover{background:var(--panel-2)}
.package-card{padding:28px}.package-card h3{font-size:21px}.package-price,.package-checkout-price{font-weight:500}
.package-label{font-size:10px;letter-spacing:1.65px}.package-card li:before{content:'·';padding-inline:4px}
.package-checkout-notice,.basket-message{background:var(--panel-2);border-color:var(--line);border-radius:7px;color:var(--text)}
.value-number{background:none;color:var(--muted);font-family:ui-monospace,monospace}
.closing-cta.pathfinder-invite{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:48px;color:var(--text)}

.finder-invite-route>div{border-color:var(--line)}
.footer{padding-top:86px;padding-bottom:32px}.footer-top{flex-wrap:wrap;gap:24px}.footer-top>div{flex-wrap:wrap}.footer-bottom{font-size:12px;color:var(--muted);border-color:var(--line)}
.footer-top>p{font-size:15px}.footer-top>div{column-gap:24px}
dialog,.saved-dialog{background:#fff;color:var(--text);border:1px solid var(--line);border-radius:18px;box-shadow:0 16px 60px #20251f26}
.dialog-close{background:#fff}.dialog-title{font-size:38px;line-height:1.1;letter-spacing:-1.6px}
.skill-chips span,.template-tags span,.compare-chip{border-radius:4px;background:var(--panel-2);color:var(--muted)}
.curriculum-row,.radio-card,.recommendation,.path-step,.library-stat,.knowledge-check,.guided-lab,.lesson-contents,.reference-response{border-radius:12px}
.notes-field,.code-editor,.goal-select,input,textarea,select{border-radius:7px}
.compare-tray{background:#fff;border:1px solid var(--line);border-radius:12px}.toast{border-radius:9px}
.resource-intro{padding-block:86px;gap:48px}.resource-intro:before{content:none}.resource-intro .eyebrow{font-size:10px}
.vault-collection{padding-top:86px}.vault-collection-heading h2{font-size:38px}.template-card{padding:8px 8px 20px}
.template-cover{border:0;border-radius:7px;box-shadow:none}.template-card:hover .template-cover{transform:none;box-shadow:none}
.template-card:hover{transform:translateY(-5px)}.template-card>:not(.template-cover){margin-inline:12px}
.template-title-row h3{font-size:21px;line-height:1.1}.template-description{min-height:0}.template-meta,.template-typography,.template-tags span{font-size:12px}
.template-format{border-radius:4px;background:#fff;color:var(--text)}.template-save{background:#fff;border-color:var(--line)}
.cover-hover>span{background:var(--text);color:#fff;border:0;border-radius:9px;box-shadow:none;backdrop-filter:none}
.cover-open .cover-hover{background:transparent;backdrop-filter:none}
.vault-category,.vault-saved-filter{border-radius:7px}.vault-workflow{padding-block:86px}.vault-bottom{margin-top:0;background:#fff;border:1px solid var(--line);border-radius:14px}
.resource-facts-line,.vault-results{font-size:12px}.resource-facts-line{flex-wrap:wrap}.resource-card-actions{gap:12px;flex-wrap:wrap}
.resource-card-actions>a,.resource-card-actions>button{font-size:14px}
.terms-note{margin-top:16px;font-size:14px;line-height:1.55;color:var(--muted)}.terms-note a{text-decoration:underline;text-underline-offset:3px;color:var(--accent)}
@media(max-width:1100px){.header-library{display:none}.desktop-nav{gap:14px}.header-inner,.vault-page .header-inner{gap:18px}.learning-page .hero h1,.resource-intro h1{font-size:54px}.project-exhibit{min-height:350px}.catalog-controls{flex-direction:column;align-items:stretch}.search-box{width:100%;max-width:none;flex:auto}.path-footer{flex-wrap:wrap}}
@media(max-width:900px){.desktop-nav{display:none}.mobile-menu{display:inline-flex}.header-actions{margin-left:auto}.course-grid,.template-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.path-grid,.package-grid{grid-template-columns:1fr}.path-card{display:flex}.path-work{max-width:400px;height:210px}.learning-page .hero{column-gap:24px}.project-exhibit{min-height:330px}.learning-page .hero h1{font-size:48px;letter-spacing:-2px}.exhibit-caption{font-size:8px}.exhibit-note{font-size:10px}}
@media(max-width:680px){.wrap,.header-inner,.vault-page .header-inner{width:calc(100% - 40px)}.header-inner,.vault-page .header-inner{height:76px;gap:12px}.brand,.header-inner .brand,.footer-top .brand{font-size:27px;letter-spacing:-1.5px;gap:9px}.brand .brand-symbol,.header-inner .brand-symbol{width:24px;height:24px;margin:9px 0 9px 9px}.header-actions{gap:3px}.header-actions .saved-trigger,.header-actions .basket-trigger{min-width:44px;width:44px;padding:0}.header-actions .saved-trigger>span:not(.count-dot),.basket-label{display:none}.header-actions .saved-trigger svg{display:block}.header-actions .count-dot{font-size:10px}.mobile-nav{padding:16px 20px}.section-space,.paths-section,.difference,.learning-page .catalog.section-space{padding-block:56px}.learning-page .hero{grid-template-columns:1fr;padding-top:56px}.learning-page .hero h1,.resource-intro h1{font-size:46px;line-height:1.09;letter-spacing:-2px}.learning-page .hero-intro{padding:24px 0 32px}.project-exhibit{min-height:320px}.exhibit-caption{font-size:9px}.learning-page .index-facts span{font-size:12px;padding:12px 8px}.learning-page .index-facts b{font-size:21px}.course-grid,.template-grid{grid-template-columns:1fr;gap:24px}.category-tabs{gap:4px}.category{padding-inline:10px}.search-box input,.vault-search input{font-size:16px}.section-heading h2,.difference h2,.index-heading h2,.vault-collection-heading h2,.vault-workflow h2,.closing-cta h2{font-size:32px;letter-spacing:-1.2px}.course-title,.path-card h3{font-size:21px}.course-content{padding:18px 12px 12px}.closing-cta.pathfinder-invite{padding:28px}.footer{padding-top:56px}.footer-top>div{gap:8px 20px}.footer-top>p{font-size:15px}.resource-intro{grid-template-columns:1fr;padding-block:56px;gap:24px}.vault-collection{padding-top:56px}.vault-workflow{padding-block:56px}.vault-controls-right{gap:8px}.vault-controls-right select{max-width:48%;font-size:13px}.vault-collection-heading{flex-wrap:wrap}.collection-download{font-size:13px}.dialog-title{font-size:30px}.dialog-pad{padding:32px 24px}.pathfinder-invite h2{font-size:32px}}
@media(max-width:360px){.header-inner,.vault-page .header-inner{gap:4px}.header-inner .brand{font-size:24px;gap:8px}.header-actions{gap:0}.learning-page .hero h1,.resource-intro h1{font-size:42px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.button:hover,.course-card:hover,.path-card:hover,.template-card:hover,.course-card .art-link:hover{transform:none!important}.exhibit-system:hover,.exhibit-system:focus-visible{transform:rotate(-5deg)}.exhibit-type:hover,.exhibit-type:focus-visible{transform:rotate(-8deg)}.exhibit-space:hover,.exhibit-space:focus-visible{transform:rotate(7deg)}}
.footer-legal{display:flex;flex-wrap:wrap;gap:4px 24px;margin-top:24px}.footer-legal a{display:inline-flex;align-items:center;min-height:44px;font-size:14px;text-decoration:underline;text-underline-offset:4px}
.project-exhibit .exhibit-type,.project-exhibit .exhibit-space{bottom:18%}.exhibit-note{bottom:12px}
/* Keep small text in Ink; Signal ink needs a white surface for AA contrast. */
.mini-site-copy,.motion-caption,.react-ui>small{color:var(--text)}.react-ui .mini-pill{background:var(--text);color:#fff}
.finder-invite-route>div>b{background:var(--panel-2);color:var(--text)}
.vault-category span{opacity:1;color:var(--muted);font-size:12px}
.vault-categories{flex-wrap:wrap;overflow:visible}.vault-filter-row{flex-wrap:wrap}
.empty-state>svg{display:none}
.finder-question,#finder-options{animation-duration:.25s}.finder-choice{border-radius:12px;transition:transform .2s ease,background .2s ease}.finder-choice.is-selected{background:var(--panel-2)}
.header a:hover,.footer a:hover{color:var(--text);text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:5px}
#main-dialog,#vault-dialog,.saved-dialog{background:#fff;background-image:none;border-radius:18px;border-color:var(--line)}
.finder-summary li>span,.finder-summary li.is-set>span{color:var(--muted)}
.finder-preview h3,.finder-question h2,.finder-result>h2{font-weight:500}
.finder-mark,.finder-fit>svg{display:none}
.finder-choice:has(input:focus-visible){outline:2px solid var(--signal);outline-offset:5px}
.finder-route-art .route-ink{transition:stroke-dashoffset .25s ease}
.studio-announcement,.curriculum-library{background:var(--panel-2)}
@media(prefers-reduced-motion:reduce){.finder-question,#finder-options,.finder-result{animation:none!important}.finder-route-art .route-ink{transition:none!important}}
.finder-question>.finder-micro{color:var(--muted)}.finder-main{background:#fff}
/* Flat subject studies; embedded downloadable demos keep their original styling. */
.course-art [fill*="-sphere"]{fill:#c99e74}.course-art [fill*="-metal"]{fill:#a8b9b3}
.skill-cover,.skill-cover.audit{background:var(--panel-2);color:var(--text)}.skill-cover>*{color:var(--text)}.skill-cover strong{font-family:var(--font);font-weight:500}
.react-orbit{font-family:ui-monospace,monospace;font-size:24px}

/* CTA emphasis is shared by course, package and resource actions. */

.header .button-outline{color:var(--accent)}.header .button-outline:hover{background:var(--accent);color:#fff;text-decoration:none}

/* One primary CTA treatment, including card actions and dynamically opened dialogs. */
:root{--cta-background:var(--signal);--cta-label:#10130f}
body .button:is(.button-primary,.button-green,.button-dark),
body .button:is(.button-primary,.button-green,.button-dark):hover,
body .button:is(.button-primary,.button-green,.button-dark):focus-visible,
body .button:is(.button-primary,.button-green,.button-dark):disabled{
  background:var(--cta-background);border-color:var(--cta-background);color:var(--cta-label);
}
body .button:is(.button-primary,.button-green,.button-dark):hover:not(:disabled){border-color:var(--cta-label)}
body .button:is(.button-primary,.button-green,.button-dark):disabled{opacity:.5;transform:none}
.course-bottom .course-view,.resource-card-actions .button{padding:10px 14px;border-radius:9px;min-height:44px;gap:8px;font-size:13px;line-height:1.4}
@media(prefers-reduced-motion:no-preference){.course-bottom .course-view:hover,.resource-card-actions .button:hover{transform:translateY(-2px)}}

/* Shared brand treatment for course outlines and customer-service pages. */
.public-page .public-header,.public-page .public-footer,.public-page main{width:min(1240px,calc(100% - 96px));margin-inline:auto}
.public-page .public-header,.public-page .public-footer,.public-page .content-section,.public-page .curriculum li{border-color:var(--line)}
.public-page main{padding-block:86px}.public-page .content-section{padding-block:43px}
.public-page .public-header .brand img{order:-1;width:32px;height:32px}
.public-page .button:not(.secondary),.public-page .button:not(.secondary):hover,.public-page .button:not(.secondary):focus-visible{background:var(--signal);border:1px solid var(--signal);color:#10130f}
.public-page .button.secondary{background:var(--panel);border:1px solid var(--accent);color:var(--accent)}
.public-page input,.public-page select,.public-page textarea,.public-page .review-box{background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:9px}
.public-page .course-index article{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:24px}
.public-page .byline,.public-page .meta{color:var(--muted)}
.public-page :is(a,button,input,select,textarea):focus-visible{outline:2px solid var(--signal);outline-offset:5px}
@media(max-width:760px){.public-page .public-header,.public-page .public-footer,.public-page main{width:calc(100% - 40px)}.public-page main{padding-block:56px}.public-page h1{font-size:38px}.public-page h2{font-size:30px}}
.instructor-profile,.instructor-summary{display:grid;grid-template-columns:minmax(0,360px) 1fr;gap:48px;align-items:center}.instructor-profile img,.instructor-summary img{display:block;width:100%;height:auto;border-radius:12px}.example-image{display:block;width:100%;height:auto;border:1px solid var(--line);border-radius:12px}.example-memo{background:white;border:1px solid var(--line);padding:24px;border-radius:12px}.faq-list details{border-bottom:1px solid var(--line);padding:18px 0}.faq-list summary{cursor:pointer;font-weight:600}.sync-status{font-size:13px;padding:12px 20px;margin:0;background:var(--panel-2)}.learning-preview{white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;max-height:280px;overflow:auto}.measurement-preferences{display:inline-block;background:none;color:var(--text);font:inherit;text-decoration:underline;min-height:44px;border:0;cursor:pointer;padding:12px 0}.measurement-panel{padding:28px}.measurement-panel h2{font-size:28px}.measurement-panel p{max-width:62ch}#measurement-dialog{max-width:680px;width:calc(100% - 40px);max-height:calc(100% - 40px);overflow:auto;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--text)}#measurement-dialog::backdrop{background:#20251f55}@media(max-width:760px){.instructor-profile,.instructor-summary{grid-template-columns:1fr;gap:24px}.instructor-profile img,.instructor-summary img{max-width:360px}.measurement-panel{padding:20px}}

/* Consistent navigation across catalogue, resources, course and service pages. */
.shared-header{position:relative;z-index:20;border-bottom:1px solid var(--line);background:var(--bg)}
.shared-header .header-inner{display:flex;align-items:center;justify-content:space-between;min-height:88px;height:auto;padding-block:16px;gap:24px}
.shared-header .brand,.shared-footer .brand{display:inline-flex;align-items:center;flex-shrink:0;text-decoration:none;font-size:30px;line-height:1.2;color:var(--text)}
.shared-header nav,.shared-footer nav{display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center}
.shared-header :is(nav a,nav button,.shared-menu),.shared-footer :is(nav a,button,.shared-resource-links a){display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 0;font:500 13px/1.5 var(--font);color:var(--text);background:none;border:0;text-decoration:none;cursor:pointer}
.shared-header :is(a,button):hover,.shared-footer :is(a,button):hover{text-decoration:underline;text-underline-offset:5px;text-decoration-color:var(--signal)}
.shared-header .shared-actions{gap:18px}.shared-header .shared-menu{display:none}
.shared-header .shared-mobile[hidden]{display:none!important}.shared-header .shared-mobile{width:calc(100% - 40px);margin:auto;padding:8px 0 20px}
.shared-footer{width:min(1240px,calc(100% - 96px));margin:0 auto;padding:40px 0 24px;border-top:1px solid var(--line)}
.shared-footer>p{margin:16px 0}.shared-footer .shared-copyright{color:var(--muted);font-size:12px}.shared-resource-links{display:flex;gap:24px}.shared-footer .shared-help{margin-top:8px}
.purchase-status{font-size:14px;line-height:1.6;max-width:75ch;margin:18px 0;color:var(--text)}
[data-purchase-entry][aria-disabled="true"]{opacity:.65;cursor:not-allowed}
@media(max-width:1100px){.shared-header .shared-desktop,.shared-header .shared-actions{display:none}.shared-header .shared-menu{display:inline-flex;padding:8px 12px;border:1px solid var(--line);border-radius:8px}.shared-header .header-inner{min-height:76px}}
@media(max-width:680px){.shared-footer{width:calc(100% - 40px)}.shared-header .header-inner{width:calc(100% - 40px)}.shared-header .brand{font-size:27px}}

.shared-header [data-saved-count],.shared-header [data-cart-count]{margin-left:6px;font-size:12px;font-weight:700}.shared-header [hidden]{display:none!important}

/* Clear targets, separated exhibit caption and an edge-to-edge mobile reader. */
.faq-list details{padding:0}.faq-list summary{min-height:44px;padding:18px 0}.faq-list details>p{margin:0;padding:0 0 18px}
.project-exhibit{display:flex;flex-direction:column;overflow:hidden}.exhibit-stage{position:relative;flex:1;min-height:330px}.project-exhibit .exhibit-note{position:static;display:block;flex:none;padding:14px 18px;margin:0;border-top:1px solid var(--line);background:var(--panel-2);z-index:3}.exhibit-stage .exhibit-system{width:58%;top:10%}.exhibit-stage .exhibit-type,.exhibit-stage .exhibit-space{bottom:12%}
.reader-navigation .back-button{display:inline-flex;align-items:center;min-height:44px;text-decoration:none}.reader-navigation{margin-bottom:24px}
@media(max-width:680px){
 .exhibit-stage{min-height:300px}
 #main-dialog[data-view="lesson"]{position:fixed;inset:0;width:100%;max-width:none;height:100dvh;max-height:100dvh;margin:0;padding:0;border:0;border-radius:0;background:var(--panel)}
 #main-dialog[data-view="lesson"]>.dialog-shell{min-height:100%;border-radius:0}
 #main-dialog[data-view="lesson"] .dialog-close{display:none}
 #main-dialog[data-view="lesson"] .lesson-reader{padding:0 20px 32px}
 .lesson-reader .reader-navigation{position:sticky;top:0;z-index:6;background:var(--panel);margin:0 -20px 24px;padding:env(safe-area-inset-top,0px) 20px 8px;border-bottom:1px solid var(--line)}
 .reader-navigation .course-contents{margin:0}.reader-navigation .course-contents summary{padding:10px 12px;min-height:44px}.reader-navigation .course-contents summary>span:last-child{display:inline;margin:0 0 0 8px}.reader-navigation .course-contents nav{max-height:45dvh;overflow:auto}
 .lesson-reader .lesson-header .dialog-title{padding-right:0}.lesson-reader .lesson-body section{scroll-margin-top:140px}
}

.shared-footer .footer-brand-row{display:flex;align-items:center;gap:24px;margin-bottom:16px}.footer-brand-row>p{margin:0;font-size:14px;line-height:1.5}.footer-brand-row .brand{flex-shrink:0}@media(max-width:480px){.shared-footer .footer-brand-row{gap:12px}.shared-footer .footer-brand-row .brand{font-size:24px;gap:8px;letter-spacing:-1.3px}.shared-footer .footer-brand-row .brand-symbol{width:24px;height:24px;margin-left:0}.footer-brand-row>p{font-size:12px}}

.shared-header .navigation-icon{display:inline-block;width:18px;height:18px;flex:none;vertical-align:middle}.shared-header :is(nav a,nav button,.shared-menu){gap:7px}.shared-menu .menu-cross,.shared-menu[aria-expanded="true"] .menu-bars{display:none}.shared-menu[aria-expanded="true"] .menu-cross{display:inline}

.shared-header :is(a,button):has(.navigation-label):hover{text-decoration:none}.shared-header :is(a,button):hover>.navigation-label{text-decoration:underline;text-decoration-color:var(--signal);text-underline-offset:5px}

/* Collection icons reflect the same live counts used by their badges. */
.shared-header :is(a,button):has(>[data-saved-count]:not([hidden]),>[data-cart-count]:not([hidden]))>.navigation-icon>path:first-child{fill:currentColor}

/* Keep navigation within reach and gently signal a populated basket. */
.shared-header{position:sticky;top:0;z-index:40}
html{scroll-padding-top:110px}
.shared-header .shared-mobile{max-height:calc(100dvh - 88px);overflow-y:auto}
@keyframes basket-jiggle{0%,10%,100%{transform:rotate(0)}2%,6%{transform:rotate(-5deg)}4%,8%{transform:rotate(5deg)}}
@media(prefers-reduced-motion:no-preference){.shared-header :is(a,button):has(>[data-cart-count]:not([hidden]))>.navigation-icon{transform-origin:50% 25%;animation:basket-jiggle 8s ease-in-out infinite}}
@media(max-width:1100px){html{scroll-padding-top:96px}.shared-header .shared-mobile{max-height:calc(100dvh - 76px)}}

/* Progressively frost the sticky header over the first 160px of scrolling. */
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
 .shared-header{background:rgba(241,241,238,var(--header-opacity,1));-webkit-backdrop-filter:blur(var(--header-blur,0px));backdrop-filter:blur(var(--header-blur,0px));transition:background-color 180ms ease-out,backdrop-filter 180ms ease-out,-webkit-backdrop-filter 180ms ease-out}
}

.shared-footer nav .shared-help{margin-top:0}

.instructor-summary .actions{display:flex;flex-wrap:wrap;gap:16px;margin-top:24px}

.instructor-summary .eyebrow{margin-bottom:5px}.instructor-summary #instructor-heading{margin-top:0}

.lesson-progress-status{display:flex;align-items:center;flex-wrap:wrap;gap:8px 20px;margin:16px 0 28px;padding-bottom:16px;border-bottom:1px solid var(--line);font-size:14px;line-height:1.6}
.lesson-progress-status a,.lesson-progress-status button{min-height:44px;display:inline-flex;align-items:center}
.shared-header .header-sign-in{white-space:nowrap}
@media(min-width:1101px) and (max-width:1250px){.shared-header .shared-desktop,.shared-header .shared-actions{gap:12px}.shared-header .header-inner{gap:16px}}

.shared-header .mobile-account-link{display:none}@media(max-width:1100px){.shared-header .mobile-account-link{display:inline-flex;align-items:center;min-height:44px;margin-left:auto}.shared-header .shared-menu{padding-inline:8px}}

.sync-toggle{display:inline-flex;align-items:center;gap:12px;min-height:48px;padding:8px 0;border:0;background:transparent;color:var(--text);font:inherit;cursor:pointer;text-align:left}
.sync-toggle-track{position:relative;flex:none;width:44px;height:26px;border:2px solid #62675E;border-radius:20px;background:#62675E}
.sync-toggle-track::after{content:"";position:absolute;left:2px;top:2px;width:18px;height:18px;border-radius:50%;background:white;transition:transform 150ms ease}
.sync-toggle[aria-checked="true"] .sync-toggle-track{background:#E0582E;border-color:#E0582E}
.sync-toggle[aria-checked="true"] .sync-toggle-track::after{transform:translateX(18px)}
.sync-toggle:focus-visible{outline:3px solid #D43B1C;outline-offset:5px;border-radius:4px}
.sync-toggle:disabled{cursor:wait}.sync-toggle #sync-toggle-state{font-size:14px;color:var(--muted)}
@media(prefers-reduced-motion:reduce){.sync-toggle-track::after{transition:none}}

.project-showcase{margin:24px 0 32px}.project-showcase img{display:block;width:100%;max-width:900px;height:auto;border:1px solid var(--line)}.project-showcase figcaption{max-width:70ch;margin-top:12px;font-size:14px;line-height:1.6;color:var(--muted)}

/* Long-form lesson chapters keep reading and navigation comfortable. */
.extended-reading { margin-block: 32px; }
.reading-outline { margin-block: 24px 36px; padding: 20px; border: 1px solid var(--border, #d9d5cc); }
.reading-outline li + li { margin-top: 10px; }
.reading-section { margin-block: 36px; }
.reading-section h4 { scroll-margin-top: 150px; }
.reading-section p { max-width: 72ch; line-height: 1.75; margin-block: 18px; }