/* Presentation only. Learning data, navigation and progress remain untouched. */
:root{--bg:#f7f8fc;--line:#dde3ef;--fz-shadow:0 12px 36px #1835670a}
body{background:var(--bg)}
header{border-top-width:6px;box-shadow:0 3px 20px #17264406}
header::after{height:6px;top:-6px;background:linear-gradient(90deg,#efc65b 0 48%,#c9212c 48%)}
.layout{max-width:1600px;grid-template-columns:222px minmax(0,1fr)}
.layout>aside{background:var(--surface);padding:34px 16px}
.layout>aside>nav{gap:10px}
.layout>aside>nav button{border-radius:16px;transition:background .18s,transform .18s}
.layout>aside>nav button.active{background:#244aa5;color:white;box-shadow:0 5px 14px #244aa526}
.layout>aside>nav button.active span{color:#ffe291}
.side-label{letter-spacing:1.8px;font-size:10px}
.side-bottom{background:var(--warm);border:1px solid var(--warm-line);padding:20px 16px;border-radius:24px 24px 7px 24px}
main{padding:42px 4.5% 64px;max-width:1320px;width:100%;box-sizing:border-box}
h1,h2,.fz-tile strong,.book-chapter strong{font-family:Manrope,'DM Sans',sans-serif;letter-spacing:-.035em}
h1{font-size:clamp(30px,3.5vw,46px);line-height:1.18;margin:12px 0 16px}
.intro{gap:24px;margin-bottom:30px}.intro .muted{line-height:1.7;max-width:610px}.eyebrow{letter-spacing:1.8px;font-size:11px;font-weight:800}
.day{background:var(--surface);border:1px solid var(--line);white-space:nowrap}
/* An illustrated welcome, made from the brand's speech-bubble geometry. */
main:has(.journey-form)>.intro,main:has(.journey-resume)>.intro{position:relative;isolation:isolate;overflow:hidden;border-radius:28px;background:linear-gradient(115deg,#17377d,#244aa5 62%,#4876cf);color:#fff;padding:44px 36px;min-height:230px;align-items:center;box-sizing:border-box}
main:has(.journey-form)>.intro>div:first-child,main:has(.journey-resume)>.intro>div:first-child{width:70%;position:relative;z-index:1}
main:has(.journey-form)>.intro h1,main:has(.journey-resume)>.intro h1{font-size:clamp(34px,4.4vw,58px);max-width:650px;letter-spacing:-.05em}
main:has(.journey-form)>.intro .muted,main:has(.journey-resume)>.intro .muted{color:#e3ebff;font-size:17px}
main:has(.journey-form)>.intro .eyebrow,main:has(.journey-resume)>.intro .eyebrow{color:#ffe19b}
main:has(.journey-form)>.intro .day,main:has(.journey-resume)>.intro .day{position:absolute;right:22px;top:18px;background:#ffffff12;color:#fff;border-color:#ffffff30;font-size:11px}
main:has(.journey-form)>.intro::after,main:has(.journey-resume)>.intro::after{content:'';position:absolute;right:-20px;bottom:-30px;width:260px;height:250px;background:url('/conversation-art.svg') center/contain no-repeat;z-index:0;pointer-events:none}
.journey-form{max-width:none!important;grid-template-columns:1fr 1fr;gap:24px 32px!important;padding:32px!important;border-radius:26px!important}
.journey-form fieldset{grid-column:1/-1;background:var(--faint);border-radius:18px}.journey-form fieldset label{padding:8px 0}.journey-form .field{margin-top:0}
.journey-resume{border:0!important;border-left:6px solid #efc65b!important;background:var(--surface)!important;box-shadow:var(--fz-shadow);padding:30px!important;border-radius:8px 24px 24px 8px!important}.journey-resume .eyebrow{color:var(--green)}
.primary,.secondary{border-radius:14px;transition:transform .18s,box-shadow .18s}.primary{box-shadow:0 5px 0 #8d182020}.primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 7px 16px #bd202a23}.secondary:hover:not(:disabled){background:var(--soft)}
.fz-panel,.scene-card,.study,.profile-card,.work-card{border-radius:24px;box-shadow:var(--fz-shadow)}
.fz-grid{gap:18px}.fz-tile{position:relative;border-radius:22px;padding:26px 22px;border-top:5px solid #244aa5;box-shadow:var(--fz-shadow);transition:transform .2s,box-shadow .2s;background:var(--surface);min-height:155px}
.fz-tile:nth-child(3n+2){border-top-color:#e4b83e}.fz-tile:nth-child(3n){border-top-color:#c9212c}.fz-tile strong{font-size:20px;padding-right:15px}.fz-tile span{color:var(--muted);font-size:15px}.fz-tile::after{content:'↗';color:var(--green);font-size:24px;margin-top:auto;align-self:flex-end}.fz-tile:hover{transform:translateY(-4px);box-shadow:0 14px 30px #17377d15;background:var(--surface)}
.book-catalog{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.book-chapter{align-items:flex-start;padding:24px 20px;border-radius:21px;box-shadow:var(--fz-shadow);transition:transform .18s,border-color .18s}.book-chapter:hover{transform:translateY(-3px);border-color:#8da7de}.book-number{background:var(--soft);width:46px;height:46px;min-width:46px;display:grid;place-items:center;border-radius:15px;font-size:19px}.book-chapter:nth-child(3n+2) .book-number{background:var(--warm);color:#806111}.book-chapter:nth-child(3n) .book-number{background:#fff0f1;color:#b02330}.book-chapter strong{font-size:17px}.book-chapter small{font-size:13px}.book-chapter>span:last-child{flex-shrink:0}
.book-paper{border-radius:22px;border-top-width:6px;box-shadow:var(--fz-shadow)}.book-margin{border-radius:22px}.book-pronounce{border-radius:14px}.book-controls{border-radius:14px}.book-tabs button,.journey-groups button{border-radius:12px}.site-footer{border-top:1px solid var(--line)}
:root[data-theme=dark]{--bg:#101827;--fz-shadow:0 12px 36px #00000015}
[data-theme=dark] .fz-tile{background:var(--surface)}[data-theme=dark] .fz-tile:hover{background:var(--soft)}[data-theme=dark] .book-chapter:nth-child(3n) .book-number{background:#422833;color:#ffadb2}[data-theme=dark] .book-chapter:nth-child(3n+2) .book-number{color:#f0d183}
@media(min-width:1100px){.layout>aside>nav{position:sticky;top:24px}}
@media(max-width:1100px){.book-catalog{grid-template-columns:1fr}.fz-grid{grid-template-columns:repeat(2,minmax(0,1fr))}main{padding:32px 25px}.journey-form{grid-template-columns:1fr}.journey-form fieldset{grid-column:auto}}
@media(max-width:800px){.layout{display:block}.layout>aside{padding:6px 4px}.layout>aside>nav{gap:3px}.layout>aside>nav button{font-size:12px;border-radius:12px;min-height:60px}.layout>aside>nav button.active{box-shadow:none}.fz-tile{min-height:140px}.intro{gap:12px}main:has(.journey-form)>.intro,main:has(.journey-resume)>.intro{padding:32px 25px;min-height:245px}main:has(.journey-form)>.intro::after,main:has(.journey-resume)>.intro::after{width:190px;height:195px;right:-25px;bottom:-35px}.journey-form{padding:24px!important}.journey-resume{padding:24px!important}}
@media(max-width:540px){main{padding:25px 16px 45px}h1{font-size:30px}.fz-grid{grid-template-columns:1fr}.fz-tile{min-height:125px;padding:22px}.fz-tile::after{position:absolute;right:20px;bottom:16px}.fz-tile span{padding-right:25px}.book-chapter{gap:12px;padding:20px 16px}.book-number{width:38px;height:38px;min-width:38px;border-radius:12px}.journey-form{padding:20px!important}.journey-form fieldset{padding:16px}main:has(.journey-form)>.intro,main:has(.journey-resume)>.intro{border-radius:22px;padding:28px 23px 75px;min-height:0}main:has(.journey-form)>.intro>div:first-child,main:has(.journey-resume)>.intro>div:first-child{width:100%}main:has(.journey-form)>.intro h1,main:has(.journey-resume)>.intro h1{font-size:38px}main:has(.journey-form)>.intro::after,main:has(.journey-resume)>.intro::after{width:140px;height:130px;right:-8px;bottom:-48px}main:has(.journey-form)>.intro .muted,main:has(.journey-resume)>.intro .muted{font-size:16px}.fz-panel{border-radius:20px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}
