/* Keep the illustrated journey on Aprender; quiet, static surfaces elsewhere. */
html[data-design="2026"] body.staticAppPage .appWorld{background:var(--bg)}
html[data-design="2026"] body.staticAppPage .appWorld>*{display:none!important}
html[data-design="2026"] body.staticAppPage .workspace>header{background:var(--bg);backdrop-filter:none}
/* Explicit foregrounds prevent light browser button surfaces with white labels. */
.courseLanguageChoice,.hubMode,.modePicker>button,.filters .chip,select#topic{color:var(--text);-webkit-text-fill-color:currentColor}
html .courseLanguageChoice.active,html .hubMode.selected,html .modePicker>button.selected{background:#dbf5ee;color:#143b40;border-color:#4ed8bb}
html .courseLanguageChoice.active :is(strong,b),html .hubMode.selected :is(strong,b),html .modePicker>button.selected b{color:#143b40;-webkit-text-fill-color:#143b40}
html .courseLanguageChoice.active small,html .hubMode.selected small,html .modePicker>button.selected small{color:#386067;-webkit-text-fill-color:#386067}
html .courseLanguageChoice:not(.active),html .hubMode:not(.selected){background:var(--surface);color:var(--text)}
html #main .filters .chip{background:var(--surface);color:var(--text);-webkit-text-fill-color:var(--text);border-color:var(--border)}
html #main .chip.active{background:#43d9b5;color:#103d40;-webkit-text-fill-color:#103d40;border-color:#43d9b5}
html #topic option{background:var(--surface);color:var(--text)}
html .stats .pathMissionButton{display:flex!important;align-items:center!important;justify-content:center!important;padding:0!important;line-height:1;box-sizing:border-box}
html .stats .pathMissionButton>.uiIcon{display:block;flex:none;width:25px;height:25px;margin:0!important;transform:none!important;vertical-align:initial}
.freePracticeSheet .sectionChoices strong,.freePracticeSheet .sectionChoices small{display:block}
.freePracticeSheet .sectionChoices small{margin-top:5px;line-height:1.5}
.freePracticeSheet .sectionChoices button{min-height:76px}
html[data-design] body :is(.courseLanguageChoice.active,.hubMode.selected,.modePicker>button.selected){background:#dbf5ee!important;color:#143b40!important}
html[data-design] body :is(.courseLanguageChoice.active,.hubMode.selected,.modePicker>button.selected) :is(strong,b){color:#143b40!important;-webkit-text-fill-color:#143b40!important}
html[data-design] body :is(.courseLanguageChoice.active,.hubMode.selected,.modePicker>button.selected) small{color:#386067!important;-webkit-text-fill-color:#386067!important}
html[data-design] body #main .filters .chip{background:var(--surface)!important;color:var(--text)!important;-webkit-text-fill-color:var(--text)!important}
html[data-design] body #main .chip.active{background:#43d9b5!important;color:#103d40!important;-webkit-text-fill-color:#103d40!important}
html[data-design] body .stats .pathMissionButton .iconTrophyCup{animation:none!important;transform:none!important}
html[data-design] body .hubMode.selected>span:first-child{color:#dbf5ee!important;-webkit-text-fill-color:#dbf5ee!important}

/* Labels take up real space, so the next node cannot cover their last line. */
.pathHome .trailStop>.trailTypeHint{position:static;display:block;flex:none;top:auto;left:auto;transform:none;margin:6px 0 16px calc(var(--bend)*2);width:clamp(90px,calc(100vw - 180px),140px);max-width:100%;height:auto;min-height:20px;padding:2px 0;box-sizing:border-box;white-space:normal;text-align:center;line-height:1.6;overflow:visible;overflow-wrap:break-word;text-overflow:clip}
.pathHome .trailStop:has(>.trailTypeHint){height:auto;min-height:140px;padding-bottom:0}
.foundationSectionComplete{margin:22px 0;padding:20px;background:var(--surface);border:1px solid var(--border);border-radius:22px;position:relative;z-index:2}.foundationSectionComplete>div{display:flex;align-items:center;gap:12px;margin-bottom:16px}.foundationSectionComplete>div>.uiIcon{color:var(--green);width:26px;height:26px;flex:none}.foundationSectionComplete strong{display:block;font-size:17px;color:var(--text)}.foundationSectionComplete small{display:block;font-size:12px;line-height:1.6;color:var(--sub);margin-top:6px}.foundationSectionComplete>.primary{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:48px;font-size:13px}

/* Section chooser: selected cards use dark ink on mint, including all nested labels. */
html[data-design] .sectionSheet .sectionChoices>button{color:var(--text);opacity:1;text-align:left}
html[data-design] .sectionSheet .sectionChoices>button>div{min-width:0}
html[data-design] .sectionSheet .sectionChoices strong{color:var(--text);-webkit-text-fill-color:var(--text);font-size:16px;line-height:1.45;margin:4px 0 7px;white-space:normal;overflow-wrap:anywhere}
html[data-design] .sectionSheet .sectionChoices small{display:block;color:var(--muted);-webkit-text-fill-color:var(--muted);font-size:11px;line-height:1.6;letter-spacing:.2px;white-space:normal}
html[data-design] .sectionSheet .sectionChoices .sectionDestinationHint{font-size:11px!important;line-height:1.6;color:var(--green)!important;-webkit-text-fill-color:var(--green)}
html[data-design] .sectionSheet .sectionChoices>button.selected{background:#dbf5ee!important;border-color:#4ed8bb!important;color:#143b40!important}
html[data-design] .sectionSheet .sectionChoices>button.selected strong{color:#143b40!important;-webkit-text-fill-color:#143b40!important}
html[data-design] .sectionSheet .sectionChoices>button.selected small{color:#386067!important;-webkit-text-fill-color:#386067!important}
html[data-design] .sectionSheet .sectionChoices>button.selected .sectionDestinationHint{color:#256e62!important;-webkit-text-fill-color:#256e62!important}
html[data-design] .sectionSheet .sectionChoices>button.selected>.uiIcon{color:#256e62}
html[data-design] .sectionSheet .sectionChoices>button:focus-visible{outline:2px solid var(--green);outline-offset:3px}
/* The situation selector keeps a dedicated lane for its arrow, including long labels. */
html[data-design] body #main .filters select#topic.chip{
 -webkit-appearance:none;appearance:none;padding:10px 44px 10px 16px;min-height:44px;
 background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%237caea8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")!important;
 background-repeat:no-repeat!important;background-position:right 15px center!important;background-size:18px 18px!important;
 max-width:100%;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;
}

/* Explanatory copy and answered cards must keep readable contrast in either theme. */
html[data-design] body #main .supportDetails>.note{color:var(--text);-webkit-text-fill-color:var(--text);opacity:1;font-size:14px;line-height:1.75}
html[data-design] #modal .option.correct,html[data-design] #modal .missionChoice.correct{background:#d5f5e8!important;color:#123e36!important;-webkit-text-fill-color:#123e36!important;border-color:#43d5b1!important;opacity:1}
html[data-design] #modal .option.correct :is(span,strong,small){color:inherit!important;-webkit-text-fill-color:inherit!important}
@media(max-width:760px){
 html[data-design] body #main .filters:has(>select#topic:not([hidden])){display:grid;grid-template-columns:auto auto minmax(0,1fr);gap:8px;overflow:visible}
 html[data-design] body #main .filters select#topic.chip{width:100%;min-width:0;font-size:13px;padding-left:12px;padding-right:38px;background-position:right 12px center!important}
 html[data-design] body #main .filters:has(>select#topic:not([hidden]))>.chip:not(select){padding:10px 12px;white-space:nowrap;font-size:12px}
}
