/* Brand-level adjustments on top of the approved motion selector. */
/* Answers and reader controls stay ahead of decorative elements. */
smart-depth-selector{--st-ink:#183330;--st-muted:#5a7166;--st-line:#dce6de;--st-accent:#17765b;--st-soft:#edf6e7}
smart-depth-selector .st-stage{margin-top:13px}
smart-depth-selector .st-chooser-heading{margin-bottom:19px}
smart-depth-selector .st-panel{margin-top:22px}
smart-depth-selector .st-article{padding:31px 39px 34px}
smart-depth-selector .st-article h2{font:400 32px/1.3 Georgia,'Times New Roman',serif;letter-spacing:-.6px;margin:0 0 21px}
smart-depth-selector .st-article .lesson-section h3{font:600 18px/1.6 system-ui,sans-serif;letter-spacing:-.2px;margin:0 0 10px}
smart-depth-selector .st-article .lesson-section p,smart-depth-selector .st-article .lesson-section li{font-size:15px;line-height:1.95;color:#47604f}
smart-depth-selector .st-article code{font-size:.88em;border-radius:4px;padding:2px 5px;background:#f0f4ed;color:#37603e;overflow-wrap:anywhere}
smart-depth-selector .st-article pre{background:#183d31;color:#e6f4d5;border-radius:10px;padding:18px 20px;overflow:auto;margin:19px 0}
smart-depth-selector .st-article pre code{background:none;color:inherit;padding:0;line-height:1.9}
smart-depth-selector .st-article .inline-sources{font-size:10px;line-height:1.5}
smart-depth-selector .st-panel-bar{padding:13px 25px}
smart-depth-selector .st-panel-bar small{font-size:10px}
smart-depth-selector .st-takeaway{margin:27px 0}
smart-depth-selector .st-takeaway p{font-size:14px}
smart-depth-selector .st-tab:focus-visible{outline-offset:5px}
@media(min-width:761px){smart-depth-selector .st-tab{padding-top:19px;padding-bottom:16px}smart-depth-selector .st-visual{height:183px}smart-depth-selector .st-portrait{width:139px;height:139px}smart-depth-selector .st-orbit{width:169px;height:169px}smart-depth-selector .st-label{font-size:23px}}
@media(max-width:760px){smart-depth-selector .st-article{padding:23px 22px 25px}smart-depth-selector .st-article h2{font-size:27px;letter-spacing:-.5px}smart-depth-selector .st-article .lesson-section h3{font-size:17px}smart-depth-selector .st-article .lesson-section p,smart-depth-selector .st-article .lesson-section li{font-size:14px;line-height:1.95}smart-depth-selector .st-panel-bar{padding:12px 16px}smart-depth-selector .st-panel-bar small{font-size:9px}smart-depth-selector .st-chooser-heading h2{font-size:17px}smart-depth-selector .st-article .quick-check legend{font-size:15px}smart-depth-selector .st-article .quiz-option{font-size:12px}smart-depth-selector .st-article .lesson-section code{font-size:.85em}smart-depth-selector .st-level-note{font-size:9px}.misconception{padding:17px}.reading-goal{font-size:12px!important}.source-section{padding-top:33px}}
@media(max-width:380px){smart-depth-selector .st-article{padding:19px 17px}smart-depth-selector .st-article h2{font-size:25px}smart-depth-selector .st-article .lesson-section p,smart-depth-selector .st-article .lesson-section li{font-size:13px}smart-depth-selector .st-panel-bar small{font-size:8px}smart-depth-selector .st-panel-bar{gap:8px}smart-depth-selector .st-panel-ident span{font-size:8px}.quiz-option{padding:11px}.quick-check .button{font-size:11px}}

/* Reader experience: compact depth choices, immediate answers, and a guided path. */
.hero h1 { font-size:clamp(46px,4.8vw,66px); line-height:1.08; letter-spacing:-2.4px }
.hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:15px; margin:24px 0 12px }
.hero-actions .button { font-size:13px; line-height:1.5; text-align:left }
.hero-actions .text-link { font-size:12px }
.hero-progress { font-size:12px; color:var(--muted); margin:0 0 25px }
.hero-search-label { font-size:12px; font-weight:600; margin:0 0 9px }
.guided-path { display:grid; grid-template-columns:.9fr 1.1fr; gap:50px; margin:55px auto 15px; padding-block:38px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); scroll-margin-top:20px }
.path-intro h2 { font:400 38px/1.15 var(--serif); letter-spacing:-1px; margin:14px 0 }
.path-intro>p { font-size:14px; line-height:1.8; color:var(--muted) }
.path-actions { display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-top:25px }
.path-actions .button { font-size:12px }
.path-actions [data-learning-progress],.local-progress-note { font-size:11px!important }
.path-steps { list-style:none; padding:0; margin:0; display:grid; gap:9px }
.path-steps a { display:flex; gap:17px; align-items:center; background:white; border:1px solid var(--line); border-radius:12px; padding:14px 17px; text-decoration:none }
.path-steps a:hover { border-color:var(--teal); background:#f0f7ef }
.path-steps a>span:last-child { margin-left:auto; color:var(--teal) }
.path-steps strong,.path-steps small,.path-status { display:block }
.path-steps strong { font-size:14px }
.path-steps small { font-size:12px; color:var(--muted); margin:5px 0 }
.path-status { font-size:10px; color:var(--teal) }
.path-step { color:var(--teal); font:400 24px var(--serif) }
.path-steps a[data-completed=true],.path-steps a.is-complete { background:#eaf5e9; border-color:#88b7a0 }
.article-intro { padding-top:30px }
.article-intro .breadcrumbs { margin-bottom:18px }
.article-intro h1 { margin:15px 0 18px; font-size:clamp(37px,5vw,55px); line-height:1.1 }
.short-answer { padding:22px 25px; border:1px solid #bfd6c7; border-left:4px solid var(--teal); border-radius:4px 15px 15px 4px; background:#edf5ea; margin:0 0 14px }
.short-answer p { font-size:17px; line-height:1.7; color:#244c3c; margin:10px 0 }
.short-answer>a { font-size:10px; color:#446653 }
.prerequisite { font-size:12px; line-height:1.6; color:var(--muted); margin:15px 0 0 }
.prerequisite a { font-weight:600; color:var(--teal) }
.article-meta { margin-top:16px; margin-bottom:5px }
.compact-reader .st-stage { padding:0; margin-top:25px; background:none; border:0; box-shadow:none; overflow:visible }
.compact-reader .st-chooser-heading { margin-bottom:10px }
.compact-reader .st-chooser-heading h2 { font-size:16px; margin:0 }
.compact-reader .st-chooser-heading p { font-size:11px; margin:5px 0 0 }
.compact-reader .st-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; padding:0; margin:0 }
.compact-reader .st-tab { display:grid; grid-template-columns:42px minmax(0,1fr); grid-template-rows:auto auto; column-gap:9px; align-items:center; align-content:center; height:auto; min-height:76px; padding:13px 14px; border-radius:12px; border:1px solid #cbdccf; background:#fff; box-shadow:none; transform:none; text-align:left; overflow:visible; text-decoration:none; isolation:auto }
.compact-reader .st-tab:before,.compact-reader .st-tab:after { display:none }
.compact-reader .st-tab img { width:38px; height:38px; grid-row:1/3; border-radius:50%; margin:0 }
.compact-reader .st-label { font-size:15px; line-height:1.3; letter-spacing:0; margin:0; padding:0; color:var(--ink) }
.compact-reader .st-description { font-size:10px; line-height:1.4; margin:3px 0 0; padding:0; color:var(--muted) }
.compact-reader .st-tab[aria-selected=true] { background:#edf6e9; border:2px solid var(--teal); padding:12px 13px; box-shadow:0 2px 5px #1b563410 }
.compact-reader .st-panel { margin-top:17px; border-radius:15px }
.compact-reader .st-panel-bar { padding:12px 23px }
.compact-reader .st-article { padding:26px 32px }
.compact-reader .st-article .lesson-section p,.compact-reader .st-article .lesson-section li { font-size:16px; line-height:1.85 }
.compact-reader .reading-goal { margin-bottom:22px }
.lesson-finish { margin-top:27px; padding-top:22px; border-top:1px solid var(--line) }
.completion-control { display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px }
.completion-control>p { font-size:11px!important; line-height:1.7!important; margin:0!important; max-width:250px }
.next-lesson { display:flex; flex-direction:column; gap:7px; background:#eaf4e8; color:#27543c; border:1px solid #cadfcb; border-radius:12px; padding:19px 21px; text-decoration:none; margin-top:17px }
.next-lesson>span { font-size:9px; font-weight:700; letter-spacing:1px }
.next-lesson>strong { display:flex; justify-content:space-between; font-size:18px }
.path-finish-note { font-size:12px!important; line-height:1.7!important }
.reader-feedback-wrap { border-top:1px solid var(--line); margin-top:24px; padding-top:22px }
.js .reader-feedback { display:block!important }
.reader-feedback fieldset { padding:0; margin:0; border:0 }
.reader-feedback legend { font-size:14px; font-weight:600; margin-bottom:12px }
.reader-feedback button,.search-suggestions button { background:white; border:1px solid #bbd1c1; border-radius:8px; padding:10px 14px; min-height:42px; font-size:12px; color:var(--ink); margin:0 6px 6px 0 }
.reader-feedback button:hover,.search-suggestions button:hover { background:#eef6e9; border-color:var(--teal) }
.reader-feedback button:disabled { opacity:.55 }
.feedback-status { font-size:12px!important; line-height:1.7!important }
.correction-link { font-size:11px; color:#48644f }
.search-suggestions { margin:16px 0 }
[data-clear-category] { margin:8px 15px 8px 0 }
.metrics-choice { align-items:start; gap:12px; font-size:15px; line-height:1.7; padding:18px; border:1px solid var(--line); border-radius:10px; background:white }
.metrics-choice input { margin-top:5px; width:18px; height:18px; accent-color:var(--teal); flex-shrink:0 }
.http-example { margin:24px 0; padding:20px; background:#f1f6f4; border:1px solid var(--line); border-radius:12px }
.http-example figcaption { display:flex; flex-direction:column; gap:8px; margin-bottom:18px }
.http-example figcaption strong { font-size:16px }
.http-example-controls { display:flex; flex-wrap:wrap; gap:15px; align-items:end }
.http-example-controls label { display:flex; flex-direction:column; gap:6px; font-size:12px; flex:1; min-width:160px }
.http-example-controls select { max-width:100%; min-height:42px; padding:8px; border:1px solid #b9cdc0; border-radius:7px; background:white; color:var(--ink); font:inherit }
.http-exchange { display:grid; grid-template-columns:1fr 16px 1fr; gap:10px; align-items:center; margin-top:18px }
.http-exchange>div { background:white; padding:14px 12px; border:1px solid #cdded2; border-radius:8px; min-width:0 }
.http-exchange>div>span { display:block; font-size:9px; font-weight:700; color:#557565; margin-bottom:10px }
.http-exchange code { display:block; font-size:12px!important; overflow-wrap:anywhere; padding:0!important; background:none!important }
.http-exchange small { display:block; font-size:10px; line-height:1.7; margin-top:8px; color:#526f5c }
.http-explanation { font-size:13px!important; line-height:1.75!important; margin-bottom:8px!important }
.example-note { font-size:10px!important; line-height:1.6!important; color:#6a7e70!important; margin:0!important }
@media(max-width:760px) {
 .hero h1 { font-size:clamp(43px,10vw,61px); letter-spacing:-2px }
 .hero-actions { gap:13px }
 .hero-actions .button { width:100%; justify-content:center }
 .hero-stage { margin-top:5px }
 .guided-path { grid-template-columns:1fr; gap:25px; margin-top:30px; padding-block:30px }
 .path-intro h2 { font-size:32px }
 .path-actions { margin-top:18px }
 .short-answer { padding:16px 18px; margin-bottom:10px }
 .short-answer p { font-size:16px; line-height:1.7; margin:7px 0 }
 .short-answer .eyebrow { font-size:9px; letter-spacing:1.4px }
 .article-intro { padding-top:21px }
 .article-intro .breadcrumbs { margin-bottom:15px }
 .article-intro h1 { font-size:40px; margin:12px 0 16px }
 .article-meta { gap:10px; font-size:10px; margin:14px 0 0 }
 .prerequisite { font-size:11px }
 .compact-reader .st-stage { margin-top:23px }
 .compact-reader .st-tabs { gap:6px }
 .compact-reader .st-tab { grid-template-columns:1fr; min-height:105px; padding:10px 6px; text-align:center; justify-items:center; border-radius:10px }
 .compact-reader .st-tab[aria-selected=true] { padding:9px 5px }
 .compact-reader .st-tab img { width:30px; height:30px; grid-row:auto; margin:0 0 5px }
 .compact-reader .st-label { font-size:13px }
 .compact-reader .st-description { font-size:9px; line-height:1.3 }
 .compact-reader .st-panel { margin-top:13px }
 .compact-reader .st-article { padding:22px 20px }
 .compact-reader .st-article .lesson-section p,.compact-reader .st-article .lesson-section li { font-size:16px; line-height:1.8 }
 .compact-reader .st-article h2 { font-size:27px }
 .compact-reader .st-panel-bar { padding:12px 17px }
 .completion-control { align-items:start; flex-direction:column }
 .http-example { padding:16px; margin-inline:0 }
 .http-exchange { grid-template-columns:1fr; gap:7px }
 .exchange-arrow { transform:rotate(90deg); justify-self:center }
}
@media(max-width:380px) {
 .article-intro h1 { font-size:36px }
 .short-answer { padding:14px 15px }
 .short-answer p { font-size:15px }
 .compact-reader .st-article { padding:20px 17px }
 .hero h1 { font-size:43px; letter-spacing:-1.9px }
 .hero-actions .button { font-size:12px; padding-inline:14px }
 .path-intro h2 { font-size:29px }
}
@media print {
 .lesson-finish,.http-example-controls,.path-actions { display:none!important }
 .short-answer { break-inside:avoid }
}
