/* Direct source: GuidedExperienceView, GuidedRoadmapHero, OnboardingView.
   The native source owns typography, spacing, colors and disabled destinations. */
.guided-shell:has(.guided-native){max-width:none;grid-template-rows:minmax(0,1fr)}
.guided-shell:has(.guided-native)>.shell-header{display:none}
.guided-content:has(>.guided-native){padding:0;overflow:hidden;gap:0}
.guided-native{flex:1;height:100%;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;background:#f8fafc;color:#1e293b;container-type:size;container-name:guided}
.guided-viewport{min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable}
.guided-centered{width:100%;max-width:568px;min-height:100%;margin:auto;padding:16px 24px;display:flex;flex-direction:column;justify-content:safe center;align-items:stretch;gap:16px;text-align:center}
.guided-native:not(.guided-native--browse) .guided-centered p{font-size:17px;line-height:1.4;margin:0;overflow-wrap:anywhere}.guided-centered .error{font-size:14px;color:#b42318}
.guided-native-icon{display:inline-block;width:24px;height:24px;flex-shrink:0;background:currentColor;mask:var(--guided-icon) center/contain no-repeat;-webkit-mask:var(--guided-icon) center/contain no-repeat}
.guided-progress-header{padding:0 24px}.guided-progress-position{position:relative;height:48px;margin:0 -8px;display:flex;align-items:center;justify-content:center;font-size:15px;color:#151515}.guided-close{position:absolute;right:0;top:2px;width:44px;min-height:44px;display:grid;place-items:center;padding:0;color:#334155;background:#f1f5f9;border:.7px solid #e2e8f0;border-radius:22px}
.guided-progress-track{display:flex;gap:4px;height:4px}.guided-progress-track>span{height:4px;flex:1;background:#d1d5db;border-radius:2px}.guided-progress-track>span[data-completed=true]{background:black}
.guided-signup-title{font-size:34px;font-weight:700;line-height:1.2;margin:0;color:#151515}.guided-description{color:#6b7280;font-size:17px;line-height:1.4}.guided-native--signup .guided-description{margin-bottom:12px}
.guided-choices{display:flex;flex-direction:column;gap:10px}.guided-choice{display:block;width:100%;min-height:56px;padding:18px;background:white;border:1px solid #0003;border-radius:16px;text-align:left;font-size:17px;font-weight:400;line-height:1.35;color:#151515}.guided-choice[aria-pressed=true]{background:#4f46e50f;border:2px solid #4f46e5;font-weight:600}
.guided-dock{display:flex;flex-direction:column;align-items:center;gap:20px;padding:24px;width:100%;max-width:568px;margin:auto;background:inherit;max-height:45cqh;overflow:auto}.guided-dock:empty{display:none}.guided-primary{min-height:54px;padding:12px 16px;display:block;width:100%;border:0;border-radius:16px;background:#4f46e5;color:white;font-size:17px;font-weight:600;line-height:1.3;text-align:center}.guided-primary:disabled{opacity:.45}.guided-back{width:48px;min-height:48px;padding:0;display:grid;place-items:center;background:#333;color:white;border-radius:50%;box-shadow:0 3px 6px #0003}.guided-back>.guided-native-icon{width:25px;height:25px}
.guided-text-action{min-height:44px;padding:8px 12px;background:none;color:#4f46e5;font-size:17px;font-weight:400}
.guided-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1px solid #e2e8f0;padding:0 4px max(0px,env(safe-area-inset-bottom));background:white;min-height:74px}.guided-tab{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px;min-width:0;padding:10px 0;font-size:11px;font-weight:400;line-height:1.1;color:#64748b;background:none}.guided-tab[aria-current=page]{color:#4f46e5}.guided-tab:disabled{opacity:.35}.guided-tab-icon,.guided-tab-training{width:36px;height:36px;display:grid;place-items:center}.guided-tab-training{background:#4f46e5;color:white;border-radius:50%}.guided-tabs--disabled{opacity:.35}.guided-tabs--disabled .guided-tab:disabled{opacity:1}
.guided-roadmap-header{height:56px;padding:0 16px;display:flex;align-items:center;justify-content:space-between;background:white;gap:8px}.guided-roadmap-header h1{font-size:22px;font-weight:700;line-height:1.2;text-align:center;flex:1;margin:0}.guided-roadmap-header>button{width:44px;min-height:44px;padding:0;display:grid;place-items:center;background:none;color:#1e293b}.guided-roadmap-header>.guided-quit{border:1px solid #cbd5e1;background:#f1f5f9;border-radius:50%;color:#64748b}
.guided-native--roadmap,.guided-native--browse{background:#f2f5fa}.guided-native--roadmap .guided-centered{max-width:552px;padding:16px;gap:16px}.guided-hero{display:flex;flex-direction:column;gap:4px;text-align:center;padding-bottom:8px;color:#1e293b}.guided-gift{display:flex;align-items:center;justify-content:center;gap:14px;color:#4f46e5;margin:0 0 12px}.guided-gift>.guided-native-icon{width:44px;height:44px}.guided-gift-rays{width:12px;height:28px;display:block;opacity:.4;position:relative;border-top:2px solid;border-bottom:2px solid;transform:skewY(24deg)}.guided-gift-rays:after{content:'';width:12px;position:absolute;left:0;top:12px;border-top:2px solid;transform:skewY(-24deg)}.guided-gift-rays:first-child{transform:rotate(180deg) skewY(24deg)}.guided-hero h2{font-size:26px;font-weight:600;line-height:1.3;margin:0 0 6px}.guided-hero p{font-size:18px;font-weight:400;line-height:1.4}
.guided-level-select{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:50px;padding:14px;background:white;color:#4f46e5;border:1px solid #0000004d;border-radius:12px;text-align:left;font-size:17px;font-weight:600;line-height:1.3}.guided-down{font-size:24px;font-weight:400;line-height:20px}
.guided-lesson{display:flex;align-items:center;gap:12px;padding:14px;min-height:68px;background:white;border:1px solid #00000026;border-radius:16px;text-align:left;line-height:1.3;color:#1e293b}.guided-lesson[data-open=true]{border:1.5px solid #4f46e5}.guided-lesson:disabled{opacity:1}.guided-lesson-number{display:grid;place-items:center;flex-shrink:0;width:38px;height:38px;border-radius:50%;font-size:20px;font-weight:600;color:#475569;background:#e2e8f0}.guided-lesson[data-open=true]>.guided-lesson-number{color:#4f46e5;background:#dfd8fa}.guided-lesson-label{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}.guided-lesson-label small{font-size:15px;color:#475569;font-weight:400}.guided-lesson-label strong{font-size:17px;line-height:1.35;font-weight:600}.guided-lesson>.guided-native-icon{width:22px;height:22px;color:#1e293b}.guided-lesson[data-open=true]>.guided-native-icon{color:#4f46e5}
.guided-flow-header{display:flex;align-items:center;gap:8px;min-height:56px;padding:16px;background:#f8fafc}.guided-flow-header h1{font-size:17px;font-weight:600;margin:0;flex:1}.guided-flow-header>button{width:44px;min-height:44px;display:grid;place-items:center;padding:0}.guided-ai-title,.guided-presentation-title{font-size:24px;font-weight:700;margin:0}.guided-topic-input{height:110px;min-height:110px;padding:8px;background:white;border-radius:12px;border:0;font-size:17px}.guided-native--ai .guided-viewport select{align-self:center;width:auto}.guided-native--ai .guided-dock{gap:20px;padding:20px}.guided-native--browse .guided-centered{max-width:none;padding:0;justify-content:flex-start;min-height:100%}.guided-browse-content{min-height:100%;display:flex;flex-direction:column;gap:12px}
.guided-native-dialog{width:calc(100% - 48px);max-width:400px;max-height:calc(100dvh - 48px);padding:20px;border-radius:24px;box-shadow:0 0 24px #0003}.guided-native-dialog::backdrop{background:#00000052}.guided-native-dialog h2{font-size:22px;font-weight:600;line-height:1.4;text-align:center;margin:0}.guided-native-dialog .modal-content{padding:12px 0;max-height:65dvh;font-size:17px;line-height:1.4}.guided-native-dialog .modal-actions{display:flex;flex-direction:column;gap:8px}.guided-native-dialog .modal-actions>button{min-height:44px;border:0;background:none;color:#4f46e5;font-size:17px;font-weight:400}.guided-level-options{display:flex;flex-direction:column;gap:12px}.guided-level-option{width:100%;min-height:56px;padding:12px;display:flex;gap:12px;align-items:center;justify-content:space-between;font-size:17px;font-weight:500;text-align:left;border:1px solid #e2e8f0;border-radius:12px;background:white}.guided-level-option[aria-pressed=true]{border-color:#4f46e5;background:#f5f3ff;font-weight:600}.guided-radio{width:22px;height:22px;border:1.7px solid #8e8e93;border-radius:50%;flex-shrink:0;position:relative}.guided-radio[data-selected=true]{border-color:#4f46e5}.guided-radio[data-selected=true]:after{content:'';position:absolute;inset:3px;border-radius:50%;background:#4f46e5}
.onboarding-native .guided-centered{padding:28px 24px;gap:18px}.onboarding-native .guided-dock{gap:18px;padding:12px 24px}.onboarding-native .guided-primary{min-height:56px;font-size:16px;font-weight:700}.onboarding-native .guided-primary:disabled{background:#dcdfe2;color:gray;opacity:1}.onboarding-native .guided-back{background:black}.onboarding-title{font-size:30px;font-weight:700;margin:0;line-height:1.25}.onboarding-language-heading{font-size:20px;font-weight:600;line-height:1.3;margin:0}.onboarding-choice{position:relative;min-height:48px;padding:14px 30px;border:1px solid #00000040;border-radius:16px;background:white;display:block;width:100%;font-size:17px;font-weight:400;line-height:1.3;text-align:center;color:#151515}.onboarding-choice[aria-pressed=true]{background:#2563eb14;border:2px solid #2563eb}.onboarding-choice>.guided-native-icon{position:absolute;right:8px;top:calc(50% - 10px);width:20px;height:20px;color:#2563eb}
.onboarding-banner{white-space:pre-line;font-size:20px!important;font-weight:700;color:white;background:#2563eb;padding:16px;border-radius:16px;line-height:1.3;text-align:center;margin:0}.onboarding-feature-icon{display:grid;place-items:center;align-self:center;width:76px;height:76px;border-radius:50%;background:#2563eb14;color:#2563eb}.onboarding-feature-icon>.guided-native-icon{width:36px;height:36px}.onboarding-package-name{font-size:20px;font-weight:700;color:#2563eb;margin:0}.onboarding-native .guided-description{font-size:17px;color:#6b7280}
@container guided (max-height:500px){.onboarding-native .guided-centered{padding:12px 24px;gap:10px}.onboarding-language-heading{font-size:17px}.onboarding-title{font-size:22px}.onboarding-native .guided-description{font-size:14px}.onboarding-choice{font-size:15px;padding-top:10px;padding-bottom:10px}.guided-native--signup .guided-signup-title{font-size:30px}}
@container guided (max-height:250px){.onboarding-native .guided-centered{padding-top:4px;padding-bottom:4px;gap:6px}.onboarding-native .guided-choices{flex-direction:row}.onboarding-native .guided-choices>button{flex:1;min-width:0}.onboarding-feature-icon{width:52px;height:52px}.onboarding-native .guided-dock{gap:8px}}

/* Keep every language/level choice whole above the fixed action area on phones.
   The viewport can still scroll for larger accessibility text or landscape. */
.guided-native--signup .guided-centered>*{flex-shrink:0}
@container guided (max-height:700px){
 .guided-native--signup .guided-centered{padding:12px 24px;gap:10px}
 .guided-native--signup .guided-description{margin-bottom:0}
 .guided-native--signup .guided-choice{padding:12px 18px;min-height:56px}
 .guided-native--signup .guided-dock{padding:12px 24px;gap:12px}
 .guided-native--signup .guided-back{width:44px;min-height:44px}
}
/* Gift-window roadmap: match native compact geometry, keep all five actions
   visible on a normal-text phone. Extreme landscape/large text can scroll. */
@container guided (max-height:1000px){
 .guided-native--roadmap .guided-centered{padding:8px 16px;gap:8px;justify-content:safe center}.guided-native--roadmap .guided-centered>*{flex-shrink:0}
 .guided-native--roadmap .guided-hero{gap:3px;padding-bottom:0}
 .guided-native--roadmap .guided-gift{margin:0;gap:10px}
 .guided-native--roadmap .guided-gift>.guided-native-icon{width:28px;height:28px}
 .guided-native--roadmap .guided-gift-rays{height:20px;transform:scale(.72)}
 .guided-native--roadmap .guided-gift-rays:first-child{transform:rotate(180deg) scale(.72)}
 .guided-native--roadmap .guided-hero h2{font-size:22px;margin:0}
 .guided-native--roadmap .guided-hero p{font-size:15px;line-height:1.3}
 .guided-native--roadmap .guided-level-select{min-height:44px;padding:8px 12px}
 .guided-native--roadmap .guided-lesson{min-height:48px;padding:8px;gap:12px}
 .guided-native--roadmap .guided-lesson-number{width:32px;height:32px;font-size:18px}
 .guided-native--roadmap .guided-lesson-label small{display:none}
 .guided-native--roadmap .guided-dock{padding:8px 16px;gap:0}
 .guided-native--roadmap .guided-gift-decline{padding:4px 8px;line-height:1.25}
}

/* Gift exit stays a distinct, readable two-line action. */
.guided-native--roadmap .guided-gift-decline{border:1px solid #000;white-space:pre-line;background:#e2e8f0;color:#475569;border-radius:14px;font-weight:600;padding:10px 12px;min-height:56px;width:100%}
@container guided (min-height:720px){
 .guided-native--roadmap .guided-centered{gap:12px;padding-block:16px}
 .guided-native--roadmap .guided-hero{gap:10px;padding-bottom:8px}
 .guided-native--roadmap .guided-gift>.guided-native-icon{width:44px;height:44px}
 .guided-native--roadmap .guided-hero h2{font-size:26px}
 .guided-native--roadmap .guided-hero p{font-size:18px}
 .guided-native--roadmap .guided-level-select{min-height:50px;padding:12px 14px}
 .guided-native--roadmap .guided-lesson{min-height:56px;padding:12px}
 .guided-native--roadmap .guided-lesson-label strong{font-size:19px}
}
.guided-gift-confirm{max-width:560px;padding:24px;border-radius:28px}
.guided-gift-confirm h2{font-size:24px;line-height:1.25;font-weight:400;text-align:left}
.guided-gift-confirm .modal-content{padding:16px 0 24px;font-size:14px;line-height:1.35}
.guided-gift-confirm .modal-content p{margin:0}
.guided-gift-confirm .modal-actions{flex-direction:row;justify-content:flex-end;flex-wrap:wrap;gap:8px}
.guided-gift-confirm .modal-actions>button{width:auto;font-size:14px;font-weight:600;padding:0 12px;min-height:44px;color:#2563eb}
.guided-gift-confirm .modal-actions>.primary{padding:0 24px;border-radius:999px;background:#2563eb;color:white}
@container guided (max-height:719px){.guided-native--roadmap .guided-gift-decline{font-size:15px;min-height:48px;padding:6px 12px}}

.guided-primary.guided-preparing:disabled{opacity:1;color:#fff;background:#4f46e5}

.guided-gift-benefit{background:#2563eb;color:#fff;border-radius:12px;padding:8px 12px;width:100%;box-sizing:border-box;display:flex;flex-direction:column;gap:3px}
.guided-gift-benefit p{color:inherit;margin:0}
@container guided (min-height:720px){.guided-gift-benefit{padding-block:12px;gap:4px}}
@container guided (max-height:719px){.guided-native--roadmap .guided-hero .guided-gift-benefit p{font-size:15px;line-height:1.2}.guided-native--roadmap .guided-gift-benefit{gap:2px}.guided-native--roadmap .guided-centered{gap:7px}}