/* One sentence is the entry point; supporting content opens below it. */
body.sentence-mode:not(.practice-landscape) .result-head{display:flex;margin:18px 4px 0}
body.sentence-mode:not(.practice-landscape) .sentence-panel{background:var(--purple2);border:1px solid var(--line);box-shadow:none;padding:22px;margin:14px 0}
body:not(.practice-landscape) .sentence-card-top{display:flex;align-items:center;flex-wrap:wrap;gap:12px}
body:not(.practice-landscape) .sentence-card-top>small{color:var(--purple);margin-right:auto}
body:not(.practice-landscape) .card-practice-tabs{display:flex;order:3;width:100%;padding:4px;gap:3px;border-radius:13px;background:color-mix(in srgb,var(--purple) 7%,white)}
body:not(.practice-landscape) .card-practice-tabs button{flex:1;min-height:42px;padding:8px 4px;border:0;border-radius:10px;background:transparent;color:var(--ink);font:inherit;font-size:.82rem;font-weight:650}
body:not(.practice-landscape) .card-practice-tabs button.active{background:white;color:var(--purple);box-shadow:0 2px 7px #00000008}
body:not(.practice-landscape) .sentence-card-top .study-toolbar{display:none}
body.sentence-mode:not(.practice-landscape) #sentenceText{min-height:120px;margin:24px 0;font-size:clamp(1.5rem,4.8vw,2rem);line-height:1.65;color:var(--ink)}
.sentence-progress{display:block;width:80px;height:5px;margin:0 auto 20px;border:0;border-radius:10px;overflow:hidden;appearance:none;background:var(--line);color:var(--purple)}
.sentence-progress::-webkit-progress-bar{background:var(--line);border-radius:10px}
.sentence-progress::-webkit-progress-value{background:var(--purple);border-radius:10px}
.sentence-progress::-moz-progress-bar{background:var(--purple);border-radius:10px}
.sentence-listen #speed{min-height:40px;border:1px solid var(--line);border-radius:11px;padding:8px;background:white;color:var(--purple);font:inherit;font-size:.85rem}
body.sentence-mode:not(.practice-landscape) .result-actions{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
body.sentence-mode:not(.practice-landscape) .result-listen #listenBtn{font:inherit;background:var(--purple2);border:1px solid var(--purple);color:var(--purple);font-weight:750}
body:not(.practice-landscape) .result-actions #saveBtn{background:transparent;border:1px solid var(--line);color:var(--purple)}
body:not(.practice-landscape) #saveHint{font-size:.8rem;color:var(--muted,#716a66);font-weight:400}
body.sentence-mode:not(.practice-landscape) .result>.all-sentences{display:block}
#english{padding:0 16px;margin:0}
.full-sentence{display:flex;align-items:baseline;gap:12px;border-top:1px solid var(--line);padding:14px 0}
.full-sentence p{margin:0;font-family:Georgia,serif;font-size:1.15rem;line-height:1.65}
.sentence-jump{flex:0 0 36px;width:36px;height:36px;padding:0;border:1px solid var(--line);border-radius:50%;background:white;color:var(--purple);font:inherit;font-size:.8rem}
.sentence-jump[aria-current="step"]{background:var(--purple);color:white}
body.sentence-mode:not(.practice-landscape) .talk{display:block;background:var(--purple2);color:var(--purple)}
body.sentence-mode:not(.practice-landscape) .start-landscape{display:block;background:transparent;color:var(--purple);border:1px solid var(--line);box-shadow:none}
body.practice-landscape .sentence-progress{display:none}
body.practice-landscape .practice-quick-actions,body.practice-landscape .result>.all-sentences,body.practice-landscape .result>.original-writing{display:none}
/* The voice carries the friend's color, without a block behind the words. */
#sentenceText mark,#english mark{background:transparent;color:var(--purple);font-weight:700;padding:0;box-shadow:none;border-radius:0}
@media(max-width:380px){body.sentence-mode:not(.practice-landscape) .sentence-panel{padding:16px}.sentence-card-top{gap:8px}.sentence-listen #speed{padding:6px 3px}.sentence-listen button{min-width:48px}}

body.practice-landscape .result-listen{display:none}

/* Keep the four end-of-practice actions compact and in one row on every screen. */
.practice-quick-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:stretch;gap:6px;margin-top:12px}
.practice-quick-actions>.result-listen{min-width:0}
.practice-quick-actions #listenBtn,.practice-quick-actions>#allSentencesToggle,.practice-quick-actions>.start-landscape,.practice-quick-actions>.talk{display:flex;align-items:center;justify-content:center;width:100%;min-width:0;min-height:44px;margin:0;padding:7px 4px;border:1px solid var(--line);border-radius:11px;background:var(--purple2);color:var(--purple);font:inherit;font-size:.78rem;font-weight:750;line-height:1.15;text-align:center;white-space:nowrap;box-shadow:none;cursor:pointer}
.result>.all-sentences{width:100%;margin:6px 0 0;padding:0 14px 8px;border:1px solid var(--line);border-radius:14px;background:#fff}
.practice-quick-actions #listenBtn:focus-visible,.practice-quick-actions>#allSentencesToggle:focus-visible,.practice-quick-actions>.start-landscape:focus-visible,.practice-quick-actions>.talk:focus-visible{outline:3px solid var(--purple);outline-offset:2px}
@media(max-width:380px){.practice-quick-actions{gap:4px}.practice-quick-actions #listenBtn,.practice-quick-actions>#allSentencesToggle,.practice-quick-actions>.start-landscape,.practice-quick-actions>.talk{padding-inline:1px;font-size:.72rem;letter-spacing:-.04em}}