:root{--learn-paper:#eee7d9;--learn-ink:#39372f;--learn-muted:#767167;--learn-soft:#33332f;--learn-mark:#d5c6a7}
html[data-theme="light"]{--learn-soft:#f1ece3;--learn-mark:#6a614e}
.learn-shell{min-height:100dvh;max-width:1160px;margin:auto;padding:var(--safe-top) 40px 28px}.learn-top{height:96px;display:flex;align-items:center;border-bottom:1px solid var(--line);gap:16px}.learn-label{font-size:12px;color:var(--muted-ui);margin-left:auto}.learn-theme{border:1px solid var(--line);border-radius:50%;width:40px;height:40px;color:var(--muted-ui);background:none;display:grid;place-items:center}.learn-theme .icon{width:16px;height:16px}.welcome{display:grid;grid-template-columns:1.1fr 1fr;gap:72px;align-items:center;min-height:650px;padding:64px 0}.welcome h1,.learn-copy h1,.learn-finish h1{font-size:64px;line-height:1.08;letter-spacing:-2px;margin:22px 0 24px}.welcome h1 em,.demo-content h1 em,.learn-finish h1 em{font-weight:400;color:var(--learn-mark)}.welcome-copy>p{max-width:420px;font-size:16px;line-height:1.8}.welcome-actions{display:grid;gap:12px;max-width:340px;margin-top:28px}.welcome-copy .learn-caption{font-size:11px;max-width:310px;line-height:1.6;margin-top:18px}.learn-footer-note{color:var(--muted-ui);font-size:10px;letter-spacing:.4px;text-align:center}.welcome-art{padding:26px;border:1px solid var(--line);border-radius:24px;background:var(--learn-soft)}.paper-label{text-transform:uppercase;letter-spacing:1.5px;font-size:9px;color:var(--muted-ui);margin:0 0 18px}.welcome-paper{padding:28px;border-radius:10px;background:var(--learn-paper);color:var(--learn-ink);transform:rotate(-2deg)}.paper-top{display:flex;justify-content:space-between;gap:12px;font-size:10px;color:var(--learn-muted)}.welcome-paper h2{font-size:34px;margin:30px 0 20px}.paper-lesson{display:flex;align-items:center;gap:12px;border-top:1px solid #d3cbbb;padding:20px 0;font-size:12px}.paper-lesson>span{align-self:flex-start;padding-top:2px;font-variant-numeric:tabular-nums}.paper-lesson>div{flex:1}.paper-lesson strong{font-size:12px;font-weight:500;display:block;line-height:1.5}.paper-lesson small{font-size:10px;color:var(--learn-muted);display:block;margin-top:4px}.paper-lesson .icon{width:16px;height:16px}.paper-bottom{font-size:9px;color:var(--learn-muted);border-top:1px solid #d3cbbb;padding-top:16px}.welcome-note{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:28px;font-size:11px;color:var(--muted-ui)}.welcome-note .icon{width:14px;height:14px}
.learn-layout{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:72px;padding:62px 0 36px;min-height:500px}.learn-step-label{display:flex;align-items:center;gap:20px}.learn-step-label>span:last-child{font-size:11px;color:var(--muted-ui);font-variant-numeric:tabular-nums}.learn-copy h1{font-size:52px}.learn-copy .learn-description{font-size:15px;line-height:1.8;max-width:440px}.learn-note{display:flex;align-items:flex-start;gap:12px;padding:18px 0 0;margin-top:24px;border-top:1px solid var(--line)}.learn-note .icon{width:16px;height:16px;margin-top:4px;color:var(--learn-mark)}.learn-note p{font-size:12px;line-height:1.75}.learn-visual{min-width:0}.specimen{background:var(--learn-paper);color:var(--learn-ink);padding:28px;border-radius:16px;min-height:290px;display:flex;flex-direction:column;justify-content:center}.visual-caption{display:block;text-align:center;font-size:9px;line-height:1.5;color:var(--muted-ui);margin-top:14px}.spec-head{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:12px}.spec-head .icon{width:18px;height:18px}.spec-tag{font-size:9px;padding:5px 8px;border-radius:20px;border:1px solid #cfc5b3;white-space:nowrap;color:#675f50}.spec-date{display:flex;align-items:center;gap:16px;margin:22px 0}.spec-date b{font:64px/1 var(--font-serif);letter-spacing:-2px}.spec-date>div{font-size:14px}.spec-date small{display:block;color:var(--learn-muted);font-size:10px;margin-top:6px}.spec-lesson{display:flex;gap:18px;padding:16px 0;border-top:1px solid #cfc5b3;font-size:12px}.spec-lesson strong{font-size:13px;font-weight:500;display:block}.spec-lesson small{display:block;color:var(--learn-muted);font-size:10px;margin-top:6px}.spec-question{font:28px/1.2 var(--font-serif);letter-spacing:-.6px;margin:26px 0}.spec-options{display:flex;gap:6px}.spec-options>span{font-size:10px;padding:10px 12px;border:1px solid #cfc5b3;border-radius:6px}.spec-options .chosen{background:#49493f;color:#faf9f5;border-color:#49493f}.spec-callout{display:flex;align-items:center;gap:12px;font-size:12px;background:#e2dacb;padding:16px;border-radius:8px;margin-top:22px}.spec-callout .icon{width:18px;height:18px}.spec-callout strong{font-size:12px;font-weight:500}.spec-callout small{font-size:10px;display:block;margin-top:6px;color:#686053}.spec-person{display:flex;align-items:center;gap:12px;margin:24px 0}.spec-avatar{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#d1c9b9;font:24px var(--font-serif)}.spec-avatar.second{margin-left:auto;background:#535a4d;color:#faf9f5}.spec-person strong{font-size:12px;font-weight:500}.spec-person small{display:block;font-size:10px;color:var(--learn-muted);margin-top:5px}.spec-timeline{list-style:none;margin:0;padding:0}.spec-timeline li{font-size:12px;border-left:1px solid #bfb6a5;padding:8px 0 8px 18px;position:relative;margin-left:5px}.spec-timeline li:before{content:'';position:absolute;left:-4px;top:14px;width:7px;height:7px;background:#59644f;border-radius:50%}.spec-metric{display:flex;align-items:baseline;gap:12px;margin:30px 0 16px}.spec-metric b{font:48px var(--font-serif);letter-spacing:-1px}.spec-metric b span{font-size:26px;color:var(--learn-muted)}.spec-metric small{font-size:11px;color:var(--learn-muted)}.specimen progress,.demo-work progress{appearance:none;-webkit-appearance:none;width:100%;height:4px;border:0;border-radius:4px;overflow:hidden;background:#cfc5b3}.specimen progress::-webkit-progress-bar{background:#cfc5b3}.specimen progress::-webkit-progress-value{background:#59644f}.specimen progress::-moz-progress-bar{background:#59644f}.specimen .spec-disclaimer{color:var(--learn-muted);font-size:10px;margin-top:16px}.spec-lock{width:56px;height:56px;border:1px solid #cfc5b3;border-radius:50%;display:grid;place-items:center}.privacy-lines{display:grid;gap:14px}.privacy-lines>span{display:flex;gap:10px;align-items:center;font-size:11px}.privacy-lines .icon{width:14px;height:14px;color:#59644f}
.learn-controls{max-width:460px;margin:0 0 0 auto;display:grid;grid-template-columns:1fr auto;gap:18px 24px;align-items:center}.learn-tracks{display:flex;gap:5px;align-items:center}.learn-tracks span{height:3px;flex:1;border-radius:3px;background:var(--line)}.learn-tracks .passed{background:var(--learn-mark)}.learn-controls small{grid-column:1/-1;text-align:right;font-size:10px}.learn-finish{text-align:center;max-width:760px;margin:48px auto}.finish-seal{margin:0 auto 26px;width:64px;height:64px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;color:var(--work-success)}.learn-finish>p{max-width:400px;margin:0 auto;font-size:15px}.finish-choices{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:36px}.finish-choice{border:1px solid var(--line);background:var(--learn-soft);border-radius:16px;text-align:left;padding:24px;color:var(--on-dark);display:grid;gap:14px}.finish-choice h3{font-size:18px}.finish-choice p{font-size:12px;line-height:1.7}.finish-choice>.icon{justify-self:end}.choice-icon{width:44px;height:44px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center}.main-choice{background:var(--learn-paper);color:var(--learn-ink);border-color:var(--learn-paper)}.main-choice p{color:#686053}.main-choice .choice-icon{border-color:#cfc5b3}.profile-discovery{background:var(--learn-soft);border:1px solid var(--line);border-radius:14px;padding:22px}.profile-discovery h3{font-family:var(--font-serif);font-size:25px;margin:12px 0}.profile-discovery p{font-size:12px;margin-bottom:18px}.signup-demo{display:flex;justify-content:center;padding:0 24px 40px}
.demo-shell{max-width:900px;margin:auto;padding-top:var(--safe-top)}.demo-banner{position:sticky;top:0;background:var(--product-bg);z-index:15;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:14px 24px;gap:12px}.demo-banner>div{display:flex;gap:10px;align-items:center;font-size:10px;color:var(--muted-ui)}.demo-badge{font-size:10px;letter-spacing:1px;text-transform:uppercase;border:1px solid var(--learn-mark);border-radius:5px;padding:5px 8px;color:var(--learn-mark)}.demo-exit{display:flex;align-items:center;gap:8px;background:none;border:0;color:var(--on-dark);font-size:12px;padding:8px 0}.demo-exit .icon{width:16px;height:16px}.demo-content{padding:36px 28px 124px;max-width:704px;margin:auto}.demo-content h1{font-size:46px;letter-spacing:-1.2px;margin:14px 0 18px}.demo-content .demo-lead{font-size:14px;line-height:1.7;margin-bottom:24px;max-width:500px}.demo-day-card{background:var(--learn-paper);color:var(--learn-ink);padding:26px;border-radius:16px}.demo-day-card .eyebrow{color:var(--learn-muted)}.demo-big-time{font:46px var(--font-serif);letter-spacing:-1px;margin:24px 0 14px}.demo-big-time span{font-size:24px;color:var(--learn-muted)}.demo-day-card h2{font-size:28px;margin-bottom:8px}.demo-day-card p{color:var(--learn-muted);font-size:12px;margin-bottom:24px}.demo-quick{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}.demo-quick button{background:var(--learn-soft);color:var(--on-dark);border:1px solid var(--line);padding:20px;text-align:left;border-radius:12px}.demo-quick .icon{margin-bottom:18px;color:var(--learn-mark)}.demo-quick h3{font-size:14px;line-height:1.5}.demo-quick p{font-size:11px;margin-top:8px}.demo-date{display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:12px;margin:30px 0 12px}.demo-date strong{font-weight:500}.demo-date span{font-size:10px;color:var(--muted-ui)}.demo-lesson{display:flex;gap:20px;border-top:1px solid var(--line);padding:24px 0}.demo-time{font-size:15px;font-weight:500;font-variant-numeric:tabular-nums}.demo-time small{display:block;font-size:11px;margin-top:8px}.demo-lesson>div:last-child{min-width:0;flex:1}.demo-lesson h3{font-size:16px;margin:8px 0}.demo-lesson p{font-size:12px}.demo-plan{display:flex;gap:5px;margin-top:16px;flex-wrap:wrap}.demo-plan button{background:none;color:var(--muted-ui);font-size:10px;border:1px solid var(--line);padding:10px;border-radius:6px;min-height:38px}.demo-plan .selected{background:var(--learn-paper);color:var(--learn-ink);border-color:var(--learn-paper)}.demo-panel{border:1px solid var(--line);background:var(--learn-soft);border-radius:14px;padding:24px;margin-bottom:16px}.demo-panel h3{font-size:18px;margin:12px 0}.demo-panel p{font-size:13px;line-height:1.7;margin-bottom:18px}.demo-panel .row{flex-wrap:wrap}.demo-status{display:flex;gap:10px;align-items:center;font-size:13px;margin:20px 0;color:var(--work-success);line-height:1.6}.demo-person{font-size:14px;padding:16px 0}.demo-person small{display:block;line-height:1.6;margin:8px 0}.demo-toggle{width:100%;border:1px solid var(--line);border-radius:12px;background:none;color:var(--on-dark);display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px;text-align:left;margin-bottom:18px}.demo-toggle strong{font-size:13px;font-weight:500}.demo-toggle small{display:block;font-size:10px;margin-top:6px;line-height:1.5}.demo-switch{width:36px;height:22px;border:1px solid var(--line);border-radius:20px;flex:none;padding:3px}.demo-switch:after{content:'';display:block;background:var(--learn-mark);width:14px;height:14px;border-radius:50%}.demo-switch.on{background:#657364}.demo-switch.on:after{transform:translateX(13px);background:#faf9f5}.demo-form-empty{border:1px dashed var(--line);border-radius:16px;padding:32px 24px;text-align:center}.demo-form-empty>.icon{width:32px;height:32px;margin-bottom:20px;color:var(--learn-mark)}.demo-form-empty h2{font-size:30px;margin-bottom:12px}.demo-form-empty p{font-size:12px;margin-bottom:24px}.demo-work-head{display:flex;gap:12px;align-items:center}.demo-work-head h3{font-size:17px;line-height:1.4}.demo-count{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:24px 0 14px}.demo-count strong{font-size:23px;font-weight:500}.demo-count strong small{font-size:12px}.demo-count>span{font-size:10px;color:var(--muted-ui)}.demo-work progress::-webkit-progress-bar{background:var(--line)}.demo-work progress::-webkit-progress-value{background:var(--learn-mark)}.demo-work progress::-moz-progress-bar{background:var(--learn-mark)}.demo-answer{padding:16px 0;border-bottom:1px solid var(--line);display:grid;gap:8px}.demo-answer span{font-size:11px;color:var(--muted-ui)}.demo-answer strong{font-size:13px;font-weight:400}.demo-work>.primary,.demo-work>.secondary{margin-top:24px}.demo-profile{display:flex;align-items:center;gap:16px;margin:30px 0}.demo-profile-avatar{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:var(--learn-paper);color:var(--learn-ink);font:30px var(--font-serif)}.demo-profile h3{font-size:17px;margin:0 0 6px}.demo-profile p{font-size:11px}.demo-feedback{position:fixed;bottom:90px;left:50%;transform:translateX(-50%);width:calc(100% - 32px);max-width:560px;background:var(--learn-paper);border:1px solid #cfc5b3;color:var(--learn-ink);padding:16px;border-radius:12px;display:flex;gap:12px;align-items:flex-start;z-index:20}.demo-feedback p{font-size:12px;color:var(--learn-ink);line-height:1.6;flex:1}.demo-feedback>.icon{width:18px;height:18px}.demo-feedback .text-button{padding:0;color:var(--learn-ink)}.demo-feedback .text-button .icon{width:18px;height:18px}
@media(max-width:680px){.learn-shell{padding:var(--safe-top) 22px 24px}.learn-top{height:72px}.learn-label{font-size:10px}.learn-top .brand{font-size:26px}.learn-theme{width:34px;height:34px}.welcome{display:flex;flex-direction:column;gap:30px;padding:34px 0;min-height:0;align-items:stretch}.welcome h1{font-size:48px;letter-spacing:-1.6px;margin:18px 0}.welcome-copy>p{font-size:14px;line-height:1.7}.welcome-actions{max-width:none;margin-top:22px}.welcome-art{padding:20px}.welcome-paper{padding:20px}.welcome-paper h2{font-size:30px;margin:20px 0 16px}.paper-lesson{padding:14px 0}.welcome-note{margin-top:20px}.learn-layout{display:flex;flex-direction:column;align-items:stretch;gap:24px;padding:28px 0 24px;min-height:0}.learn-step-label{justify-content:space-between}.learn-copy h1{font-size:38px;letter-spacing:-1.1px;margin:16px 0}.learn-copy .learn-description{font-size:13px;line-height:1.75}.learn-note{padding-top:14px;margin-top:16px;gap:9px}.learn-note p{font-size:11px;line-height:1.65}.learn-visual{order:2}.specimen{padding:20px;min-height:210px}.spec-date{margin:16px 0}.spec-date b{font-size:48px}.spec-lesson{padding:12px 0}.spec-lesson strong{font-size:12px}.spec-question{font-size:25px;margin:20px 0}.spec-callout{margin-top:18px;padding:12px}.spec-person{margin:18px 0}.spec-timeline li{font-size:11px;padding:7px 0 7px 16px}.spec-metric{margin:20px 0 12px}.spec-metric b{font-size:38px}.spec-lock{width:42px;height:42px}.privacy-lines{gap:12px}.privacy-lines>span{font-size:10px}.visual-caption{font-size:8px;margin-top:10px}.learn-controls{max-width:none;grid-template-columns:1fr;gap:14px;padding:0 0 max(12px,env(safe-area-inset-bottom));margin:0}.learn-controls .primary{width:100%;min-height:52px}.learn-controls small{text-align:center;font-size:9px}.learn-tracks{max-width:120px;margin:auto;width:100%}.learn-finish{margin:32px auto}.learn-finish h1{font-size:42px;margin:18px 0}.learn-finish>p{font-size:13px}.finish-seal{width:52px;height:52px;margin-bottom:22px}.finish-choices{grid-template-columns:1fr;gap:12px;margin-top:26px}.finish-choice{padding:20px;grid-template-columns:40px 1fr 20px;gap:8px 14px;align-items:center}.choice-icon{grid-row:1/3;width:38px;height:38px}.finish-choice h3{font-size:16px;grid-column:2}.finish-choice p{grid-column:2;font-size:11px}.finish-choice>.icon{grid-column:3;grid-row:1/3;width:18px}.demo-banner{padding:12px 18px}.demo-banner>div{gap:8px;font-size:9px}.demo-content{padding:28px 20px 124px}.demo-content h1{font-size:38px;letter-spacing:-1px}.demo-content .demo-lead{font-size:13px}.demo-day-card{padding:22px}.demo-big-time{font-size:40px}.demo-quick{gap:10px}.demo-quick button{padding:18px 14px}.demo-quick h3{font-size:13px}.demo-lesson{gap:16px}.demo-panel{padding:20px}.demo-panel h3{font-size:16px}.demo-toggle{padding:14px}.demo-count{align-items:flex-start}.demo-count>span{max-width:130px;text-align:right;line-height:1.5}}
@media(prefers-reduced-motion:reduce){.welcome-paper{transform:none}}
