/* Shared reading hierarchy: expression, meaning, reading aid, then controls. */
body[data-view=studio] #workspace{width:min(calc(100% - 48px),max(1080px,68vw));max-width:1760px;margin-inline:auto;padding-inline:0!important}
body[data-view=studio] #main{width:100%;max-width:none}
#studio-view:has(.studio-exercise),#studio-view:has(.studio-audio-player){width:100%;max-width:none}
body[data-view=studio] .site-header{box-sizing:border-box;width:min(calc(100% - 48px),max(1080px,68vw));max-width:1760px;margin-inline:auto;padding-inline:0!important}
#studio-view{--studio-ink:#173c39;--studio-secondary:#486560;color:var(--studio-ink)}
#studio-view .studio-heading h1{color:var(--studio-ink);font-weight:700;letter-spacing:-.025em}
#studio-view .studio-answer>.studio-phrase{font-size:clamp(28px,1.6vw,36px);font-weight:700;line-height:1.55;color:#163b38;overflow-wrap:anywhere;word-break:normal;letter-spacing:normal}
#studio-view .studio-answer>.studio-meaning{font-size:clamp(20px,1.1vw,24px);font-weight:500;line-height:1.65;color:#284e48;word-break:normal;overflow-wrap:anywhere}
#studio-view .studio-answer>.studio-phonetics{font-size:18px;line-height:1.65;color:#526a65;font-weight:400;letter-spacing:normal}
#studio-view .studio-answer>.studio-example{font-size:clamp(22px,1.25vw,28px);line-height:1.65;font-weight:500;color:#173c39;border-color:#d1dfda;padding-top:16px;word-break:normal;overflow-wrap:anywhere}
#studio-view .studio-answer{column-gap:24px;row-gap:10px}
#studio-view:has(.studio-exercise) .studio-task{padding:24px 30px}
#studio-view:has(.studio-exercise) .studio-item-meta{font-size:16px;color:#486560;line-height:1.5}
#studio-view:has(.studio-exercise) .studio-phase-label{font-size:18px;line-height:1.6;color:#284e48;font-weight:500}
#studio-view:has(.studio-exercise) .studio-automatic .studio-actions button{font-size:17px;min-height:46px}
#studio-view:has(.studio-exercise) .studio-automatic>.studio-shortcut{font-size:14px;color:#526a65}
#studio-view:has(.studio-exercise) .studio-automatic>.studio-countdown{font-size:15px;color:#486560}
#studio-view .studio-answer>button{font-size:16px;min-height:44px;line-height:1.4;padding:10px 14px;border-color:#a2bcb1;color:#17634c;background:#f4f9f6}
#studio-view .studio-answer>button:hover{background:#e6f2eb;border-color:#3e8469}
#studio-view .studio-answer>button:focus-visible,#studio-view button:focus-visible{outline:3px solid #20795e;outline-offset:3px}
/* A single centred reading column keeps the current task and its controls together. */
#studio-view:has(.studio-exercise){grid-template-rows:32px auto auto 18px auto auto minmax(280px,1fr);row-gap:12px}
#studio-view:has(.studio-exercise) .studio-automatic{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:18px 24px;text-align:center;min-height:0;border-color:#d5e5df;border-radius:18px;box-shadow:none}
#studio-view:has(.studio-exercise) .studio-automatic .studio-phase-label{flex:0 1 auto;margin:0;max-width:58ch;line-height:1.6;text-wrap:pretty}
#studio-view:has(.studio-exercise) .studio-automatic .studio-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:10px}
#studio-view:has(.studio-exercise) .studio-automatic>.studio-shortcut{justify-content:center;margin:0;font-size:13px;line-height:1.5}
#studio-view:has(.studio-exercise) .studio-automatic>.studio-countdown{position:static;width:min(100%,440px);margin:0;justify-content:center}
#studio-view:has(.studio-exercise) .studio-task{align-items:center;text-align:center;padding:clamp(24px,3.5vh,48px) clamp(20px,4vw,64px);border-radius:22px;border-color:#d5e5df;background:#fff;box-shadow:0 8px 30px #193f3510;gap:14px}
#studio-view:has(.studio-exercise) .studio-task>h2{font-size:clamp(21px,1.35vw,26px);line-height:1.55;margin:0;color:#264d43;text-wrap:pretty}
#studio-view:has(.studio-exercise) .studio-task>.studio-note{font-size:17px;line-height:1.7;margin:0;max-width:52ch;color:#567067}
#studio-view .studio-task>.studio-eyebrow{font-size:13px;line-height:1.5;color:#627e72;letter-spacing:.03em}
#studio-view .studio-answer{width:min(100%,760px);margin-inline:auto;display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px}
#studio-view .studio-answer>p{width:100%;margin:0;text-wrap:pretty}
#studio-view .studio-answer>.studio-phrase{line-height:1.5}
#studio-view .studio-answer>.studio-example{margin-top:10px;padding-top:20px;border-top:1px solid #dbe7e1}
#studio-view .studio-answer>button{align-self:center;margin:2px 0 6px;border-radius:10px;max-width:none}
#studio-view .studio-answer>.studio-eyebrow{font-size:12px;color:#627e72;letter-spacing:.04em}
#studio-view .studio-recall-cue{display:grid;place-items:center;width:64px;height:64px;border-radius:20px;background:#edf6f0;color:#27765b;margin-bottom:4px}
#studio-view .studio-recall-cue svg{width:30px;height:30px}
#studio-view:has(.studio-exercise) .studio-prompt{width:min(100%,760px);text-align:center}
#studio-view:has(.studio-exercise) .studio-options{width:min(100%,760px)}
@media(max-width:800px){
 body[data-view=studio]:has(.studio-exercise){height:auto;min-height:100svh;overflow-y:auto}
 #studio-view:has(.studio-exercise){height:auto;min-height:0;grid-template-rows:auto auto auto auto auto auto minmax(280px,auto)}
 #studio-view:has(.studio-exercise) .studio-automatic{padding:16px;gap:10px}
 #studio-view:has(.studio-exercise) .studio-task{padding:28px 20px;min-height:280px}
 #studio-view .studio-answer{gap:10px}
 #studio-view:has(.studio-exercise) .studio-task>.studio-note{font-size:16px}
}
#studio-view .studio-audio-player>[data-audio-current]{font-size:clamp(28px,1.8vw,38px);line-height:1.6;color:#173c39;word-break:normal}
#studio-view .studio-audio-player .studio-phonetics{font-size:19px;line-height:1.65;color:#526a65}
#studio-view .studio-audio-position,#studio-view .studio-speech-status{font-size:16px;color:#486560}
.language-result strong{font-size:18px;line-height:1.4}
.language-result .language-result-autonym{font-size:15px;line-height:1.45;color:#486560}
.language-result>span:last-child{font-size:14px;line-height:1.4;color:#526a65}
#load-state .loading-heading{font-size:clamp(24px,3vw,32px);line-height:1.5;color:#173c39;max-width:28em;word-break:keep-all}
@media(max-width:1100px){
 body[data-view=studio] #workspace,body[data-view=studio] .site-header{width:calc(100% - 32px)}
}
@media(max-width:800px){
 body[data-view=studio] #workspace,body[data-view=studio] .site-header{width:calc(100% - 24px)}
 #studio-view:has(.studio-exercise) .studio-task{padding:20px 18px}
 #studio-view .studio-answer>.studio-phrase{font-size:26px;line-height:1.6}
 #studio-view .studio-answer>.studio-meaning{font-size:20px;line-height:1.65}
 #studio-view .studio-answer>.studio-phonetics{font-size:17px}
 #studio-view .studio-answer>.studio-example{font-size:22px;line-height:1.65}
 #studio-view:has(.studio-exercise) .studio-phase-label{font-size:17px}
 #studio-view:has(.studio-exercise) .studio-automatic .studio-actions button{font-size:16px}
}
/* Reordering is a separate, comfortably sized target from selecting a mode. */
.studio-route-settings-list{gap:9px}
.studio-route-settings-row{gap:8px;padding:9px 12px 9px 4px;min-height:68px;border-color:#dce7df;box-shadow:0 1px 2px #163b3803;transition:box-shadow .15s,border-color .15s}
.studio-route-drag{display:flex;align-items:center;justify-content:center;flex:0 0 40px;width:40px;min-height:46px;padding:0;border:0;border-radius:8px;background:transparent;color:#879b91;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}
.studio-route-drag:hover,.studio-route-drag:focus-visible{color:#176f53;background:#edf5ef}
.studio-route-settings-row.is-dragging{position:relative;z-index:2;border-color:#328667;background:#f3faf5;box-shadow:0 7px 20px #1b5b4020;user-select:none}
.studio-route-settings-row.is-dragging .studio-route-drag{color:#176f53;cursor:grabbing;background:#e0efe5}
.studio-route-settings-title{color:#234b41;font-size:16px}
.studio-route-settings-row[data-selected=false] .studio-route-drag{color:#a0aea7}
.studio-route-settings-footer{position:sticky;bottom:0;padding:14px 0 4px;background:var(--surface,#fff);border-top:1px solid #e5ece7;z-index:3}
.studio-route-settings .studio-route-order-move{width:36px;min-width:36px;border-color:transparent;background:transparent;color:#678577}
.studio-route-settings .studio-route-order-move:hover:not(:disabled){background:#edf5ef;color:#176f53}
@media(max-width:600px){.studio-route-settings-row{padding:7px 8px 7px 0;gap:4px}.studio-route-drag{flex-basis:36px;width:36px}.studio-route-mode-label{gap:7px}.studio-route-settings-title{font-size:15px}.studio-route-settings .studio-route-order-move{width:32px;min-width:32px;min-height:44px}.studio-route-settings-footer{padding-bottom:max(4px,env(safe-area-inset-bottom))}}
@media(prefers-reduced-motion:reduce){.studio-route-settings-row{transition:none}}
.studio-route-settings-footer [data-route-order-save]{background:#176f53;border-color:#176f53;color:#fff;min-width:112px;border-radius:10px}
.studio-route-settings-footer [data-route-order-save]:hover{background:#105b43}

/* Quiet, readable daily cards. Shared spacing keeps both cards aligned. */
body.has-learning-studio #library-view .library-heading > :is(.home-curiosity,.daily-quote){position:relative;padding:24px 28px 20px;border:1px solid #dbe5dc;border-radius:20px;box-shadow:0 3px 16px #244b3d05}
body.has-learning-studio #library-view .library-heading > .home-curiosity{background:#fcfaf3;border-color:#e5dfcf}
body.has-learning-studio #library-view .library-heading > .daily-quote{background:#fff}
#library-view .daily-learning-heading{position:relative;min-height:62px;gap:8px;padding:0 36px 16px 0;border-bottom:1px solid #dfe7df;box-sizing:border-box}
#library-view .daily-learning-heading :is(.curiosity-kicker,h2){font-size:15px;font-weight:650;color:#36574a}
#library-view .daily-learning-heading :is(.curiosity-language,.quote-language){padding:3px 9px;border-color:#d4dfd4;background:#f4f8f2;font-size:12px;color:#4c6556}
#library-view .library-heading > .home-curiosity .daily-learning-heading .curiosity-topic{min-height:40px;max-width:160px;margin:0 0 0 auto;padding:7px 26px 7px 10px;border-color:#c6d3c8;border-radius:8px;background-color:#fff;font-size:14px;line-height:1.5}
#library-view .daily-learning-heading > details{position:absolute;inset-inline-end:-8px;top:-2px;width:36px;height:40px;margin:0}
#library-view .daily-learning-heading summary{position:static;width:36px;height:40px;min-height:40px;color:#607569}
#library-view .daily-learning-heading :is(.curiosity-note,.quote-source-content){top:44px;font-size:13px}
#library-view .daily-learning-content{min-height:300px;padding:24px 0;text-align:center}
#library-view .library-heading > .home-curiosity .curiosity-paper{min-height:300px;padding:24px 0}
#library-view .curiosity-content{display:grid;align-content:center;justify-items:center;width:100%}
#library-view .library-heading > .home-curiosity .curiosity-prompt{width:100%;max-width:34rem;margin-inline:auto}
#library-view .library-heading > .home-curiosity h2,
body.has-learning-studio #library-view .daily-quote .outro-quote,
#library-view .curiosity-answer .curiosity-expression{max-width:32ch;margin-inline:auto;font-size:clamp(23px,1.65vw,28px);font-weight:600;line-height:1.65;letter-spacing:-.02em;color:#193f35;text-wrap:pretty}
#library-view .library-heading > .home-curiosity h2[data-prompt-size='medium']{font-size:clamp(22px,1.55vw,26px)}
#library-view .library-heading > .home-curiosity h2[data-prompt-size='long']{font-size:clamp(21px,1.45vw,24px);line-height:1.7}
#library-view .curiosity-answer{width:100%;max-width:38rem}
#library-view :is(.curiosity-meaning,.daily-quote .quote-meaning){max-width:44ch;margin:14px auto 0;font-size:18px;font-weight:500;line-height:1.75;color:#354f43}
#library-view :is(.curiosity-reading-line,.quote-sentence-ipa){max-width:48ch;margin:12px auto 0;font-size:16px;line-height:1.8;color:#536b5e}
#library-view .curiosity-reading-label{font-size:13px}
#library-view :is(.curiosity-audio-controls,.quote-audio){gap:8px;margin-top:18px}
#library-view :is(.curiosity-audio-controls,.quote-audio) button{min-height:44px;padding:10px 16px;border-radius:10px;font-size:15px;font-weight:600}
#library-view [data-quote-voice]{padding:5px 8px;background:transparent;font-size:13px;color:#536b5e}
#library-view .curiosity-audio-status:empty{display:none}
#library-view .quote-vocabulary{box-sizing:border-box;margin-top:22px;padding:14px 16px;border:1px solid #e0e8df;border-radius:12px;background:#f6f9f4}
#library-view .quote-vocabulary h3{margin:0 0 12px;font-size:14px;font-weight:650;line-height:1.5;color:#4b6555}
#library-view .quote-vocabulary dl{gap:16px;padding:0;border:0}
#library-view .quote-vocabulary dt{font-size:16px;font-weight:600;line-height:1.5;color:#244a3b}
#library-view .quote-vocabulary dd{margin-top:5px;font-size:14px;line-height:1.65;color:#4c6556}
#library-view .daily-learning-actions{min-height:44px;padding-top:14px;border-color:#dfe7df}
#library-view .daily-learning-actions button{min-height:44px;padding:10px 14px;border-radius:10px;font-size:15px}
#library-view .daily-learning-actions .curiosity-reveal{min-width:108px}
#library-view .daily-learning-actions :is(.curiosity-next,[data-quote-next]){background:transparent;color:#34604c}
body.has-learning-studio #library-view .daily-quote .banner-quote-reference{padding:0;font-size:12px;line-height:1.6;color:#607367}
@media(max-width:650px){
 body.has-learning-studio #library-view .library-heading > :is(.home-curiosity,.daily-quote){padding:20px;border-radius:18px}
 #library-view .daily-learning-heading{gap:8px;padding-bottom:14px}
 #library-view .library-heading > .home-curiosity .daily-learning-heading .curiosity-topic{flex:0 0 100%;max-width:100%;margin:4px 0 0}
 #library-view .daily-learning-content,#library-view .library-heading > .home-curiosity .curiosity-paper{min-height:240px;padding:24px 0}
 #library-view .library-heading > .home-curiosity h2,body.has-learning-studio #library-view .daily-quote .outro-quote,#library-view .curiosity-answer .curiosity-expression{font-size:23px;line-height:1.65}
 #library-view :is(.curiosity-meaning,.daily-quote .quote-meaning){font-size:17px}
 #library-view :is(.curiosity-reading-line,.quote-sentence-ipa){font-size:15px}
 #library-view .quote-vocabulary{padding:14px}
 #library-view .quote-vocabulary dl{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
 #library-view .daily-learning-actions{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:6px}
 #library-view .daily-learning-actions > .curiosity-reveal{grid-column:2;justify-self:center;min-width:96px;padding-inline:10px}
 #library-view .daily-learning-actions > .curiosity-next{grid-column:3;justify-self:end;padding-inline:0;font-size:13px}
 #library-view .daily-learning-actions > [data-quote-next]{grid-column:2}
 #library-view .daily-learning-actions button{font-size:14px}
}
@media(max-width:380px){#library-view .quote-vocabulary dl{grid-template-columns:1fr}#library-view .daily-learning-actions > .curiosity-reveal{grid-column:1 / -1}#library-view .daily-learning-actions > .curiosity-next{grid-column:1 / -1;justify-self:center}}
[data-theme='dark'] body.has-learning-studio #library-view .library-heading > :is(.home-curiosity,.daily-quote){background:#22362c;border-color:#4b6051;box-shadow:none}
[data-theme='dark'] #library-view .daily-learning-heading,[data-theme='dark'] #library-view .daily-learning-actions{border-color:#496151}
[data-theme='dark'] #library-view .library-heading > .home-curiosity h2,[data-theme='dark'] body.has-learning-studio #library-view .daily-quote .outro-quote,[data-theme='dark'] #library-view .curiosity-answer .curiosity-expression{color:#e2efe3}
[data-theme='dark'] #library-view :is(.curiosity-meaning,.daily-quote .quote-meaning,.curiosity-reading-line,.quote-sentence-ipa,.daily-learning-heading .curiosity-kicker,.daily-learning-heading h2,[data-quote-voice]){color:#c8decd}
[data-theme='dark'] #library-view .daily-learning-heading :is(.curiosity-language,.quote-language,.curiosity-topic){background:#2b4232;border-color:#58725f;color:#d5e7d7}
[data-theme='dark'] #library-view .quote-vocabulary{background:#2a4031;border-color:#496151}
[data-theme='dark'] #library-view .quote-vocabulary :is(h3,dt,dd),[data-theme='dark'] #library-view .daily-learning-actions :is(.curiosity-next,[data-quote-next]){color:#c8decd}
[data-theme='dark'] #library-view .quote-vocabulary dl > div + div{border-color:#496151}