:root{--navy:#18354b;--ink:#243746;--muted:#63737d;--paper:#f8f5ee;--line:#dce4df;--coral:#d76d5d;--coral-dark:#a84337;--sage:#e5ede5;--white:#fffefa;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--paper)}*{box-sizing:border-box}body{margin:0;min-width:0}button,input{font:inherit}button,a{touch-action:manipulation}a{color:var(--coral-dark);text-underline-offset:3px}.skip-link{position:absolute;left:8px;top:-60px;padding:12px;background:white;z-index:5}.skip-link:focus{top:8px}:focus-visible{outline:3px solid #39735d;outline-offset:3px}.page-header{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:80px;padding:16px max(24px,calc((100vw - 1240px)/2));background:var(--navy);color:white}.page-header .brand{color:white;text-decoration:none;font-size:22px;font-weight:750;letter-spacing:-.04em}.page-header .brand span{font-size:15px;font-weight:550;letter-spacing:0}.page-header nav{display:flex;flex-wrap:wrap;gap:10px}.page-header nav a{display:inline-flex;align-items:center;min-height:44px;padding:6px 12px;color:#e8eeec;text-decoration:none;border-radius:9px}.page-header nav a:hover{background:#2a4b5d}.page-shell{max-width:1240px;margin:auto;padding:34px 24px 72px}.page-intro{margin-bottom:28px}.eyebrow{text-transform:uppercase;letter-spacing:.13em;color:#688476;font-size:12px;font-weight:700}.page-intro h1{margin:8px 0 10px;color:var(--navy);font-family:Georgia,"Songti SC",serif;font-weight:600;font-size:clamp(34px,5vw,56px)}.page-intro>p:last-child{max-width:700px;color:var(--muted);line-height:1.6}.workspace{display:grid;grid-template-columns:240px minmax(0,1fr);gap:22px;align-items:start}.catalog,.practice-card{min-width:0;background:var(--white);border:1px solid var(--line);border-radius:18px;box-shadow:0 10px 30px rgba(25,53,70,.045)}.catalog{padding:18px;position:sticky;top:18px}.catalog h2{margin:10px 8px 8px;font-size:12px;color:var(--muted);font-weight:750;letter-spacing:.08em}.catalog h2:not(:first-child){margin-top:26px}.template-list{display:grid;gap:5px}.template-choice{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:48px;padding:10px 12px;text-align:left;color:var(--ink);background:transparent;border:0;border-radius:10px;cursor:pointer}.template-choice:hover{background:#f1f4f0}.template-choice[aria-pressed="true"]{background:var(--sage);color:var(--navy);font-weight:700}.template-choice small{color:var(--muted);font-size:12px}.other-types{margin-top:26px;padding:16px 8px 2px;border-top:1px solid var(--line);font-size:13px;line-height:1.6}.other-types summary{cursor:pointer;font-weight:650;min-height:44px;display:flex;align-items:center}.other-types p{color:var(--muted)}.practice-card{padding:clamp(20px,3vw,36px)}.card-top{display:flex;align-items:center;justify-content:space-between;gap:16px}.card-top .eyebrow{margin:0 0 6px}.card-top h2{margin:0;color:var(--navy);font-family:Georgia,"Songti SC",serif;font-size:clamp(26px,3vw,36px);font-weight:600}.count-pill{white-space:nowrap;background:#f8e9e5;color:var(--coral-dark);border-radius:100px;padding:7px 12px;font-size:12px;font-weight:750}.template-description{color:var(--muted);line-height:1.6;margin:14px 0 20px}.template-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-bottom:18px;border-bottom:1px solid var(--line);font-size:14px}.template-toolbar label{display:inline-flex;align-items:center;gap:9px;min-height:44px;cursor:pointer}.template-toolbar input{width:18px;height:18px;accent-color:#628c77}.template-toolbar a{display:inline-flex;align-items:center;min-height:44px;font-weight:600}.template-lines{counter-reset:line;display:grid;gap:12px;padding:23px 0}.template-line{position:relative;min-width:0;margin:0;padding:17px 18px 17px 52px;border-radius:12px;background:#f6f7f3;color:var(--navy);font-size:clamp(17px,2vw,21px);line-height:1.6;overflow-wrap:anywhere}.template-line:before{counter-increment:line;content:counter(line,decimal-leading-zero);position:absolute;left:17px;top:21px;font:700 11px -apple-system,BlinkMacSystemFont,sans-serif;color:#84968a}.template-section{margin:15px 0 0;color:#577464;font-size:13px;font-weight:750}.template-fixed{font-weight:600}.template-slot{display:inline-block;min-width:68px;padding:0 5px;border-bottom:2px solid #8ca99a;color:#657b6c;font-size:.82em;vertical-align:baseline}.template-slot.is-hidden{min-width:74px;font-size:18px;color:#8ca99a}.template-variants{padding:4px 0 18px}.template-variants details{border-top:1px solid var(--line);padding:10px 2px}.template-variants summary{min-height:44px;display:flex;align-items:center;cursor:pointer;font-weight:650}.template-variants p{font-size:13px;color:var(--muted);line-height:1.55}.variant-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.variant-list article{padding:12px;border-radius:10px;background:#f6f7f3}.variant-list strong{color:var(--navy)}.variant-list p{margin:6px 0 0}.oral-controls{border-top:1px solid var(--line);padding-top:22px}.timer-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;color:var(--muted);font-size:14px}.timer-row strong{font-variant-numeric:tabular-nums;font-size:28px;color:var(--navy)}.timer-row #recorderState{margin-left:auto;color:#547660}.control-row{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}.control-row button{min-height:48px;padding:9px 18px;border-radius:10px;font-weight:700;cursor:pointer}.control-row button:disabled{cursor:not-allowed;opacity:.5}.primary-button{border:1px solid var(--coral);background:var(--coral);color:white}.primary-button:not(:disabled):hover{background:#bd5a4b}.secondary-button{border:1px solid var(--line);background:white;color:var(--navy)}.secondary-button:not(:disabled):hover{background:var(--sage)}audio{width:100%;margin:3px 0 8px}.privacy-note{color:var(--muted);font-size:12px;line-height:1.55}.source-row{margin-top:20px;padding-top:18px;border-top:1px solid var(--line);font-size:12px;line-height:1.6;color:var(--muted)}.source-row a{font-weight:600}@media(max-width:760px){.page-header{padding:12px 16px}.page-shell{padding:26px 16px 50px}.workspace{grid-template-columns:1fr}.catalog{position:static;padding:15px}.catalog h2{margin-top:5px}.catalog h2:not(:first-child){margin-top:16px}.template-list{display:flex;overflow-x:auto;gap:8px;padding:0 0 4px;scrollbar-width:thin}.template-choice{flex:0 0 auto;width:auto;min-height:44px;gap:9px;padding:8px 12px;border:1px solid var(--line)}.other-types{margin-top:15px}.variant-list{grid-template-columns:1fr}.timer-row #recorderState{margin-left:0;width:100%}}@media(max-width:390px){.page-header .brand{font-size:18px}.page-header nav{gap:0}.page-header nav a{padding:5px 7px;font-size:12px}.page-shell{padding-left:12px;padding-right:12px}.practice-card{padding:16px}.control-row button{flex:1 1 100%}.template-line{padding-left:43px}.template-line:before{left:12px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}

[hidden] { display: none !important; }
.section-nav { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 5px; max-width: 1240px; margin: 14px auto 0; padding: 0 24px; }
.section-nav a { display: flex; justify-content: center; align-items: center; min-height: 46px; padding: 7px 5px; border-radius: 9px; text-align: center; text-decoration: none; color: var(--navy); background: #fffefa; border: 1px solid var(--line); font-size: 14px; font-weight: 650; }
.section-nav a:hover { background: var(--sage); }
.section-nav a[aria-current="page"] { color: #fff; background: var(--navy); border-color: var(--navy); }
.dictation-panel { padding-top: 22px; }
.dictation-progress { margin: 0 0 15px; color: #547660; font-weight: 700; font-size: 14px; }
.dictation-cue { min-height: 70px; display: flex; align-items: center; margin: 0 0 18px; padding: 16px 18px; border-radius: 12px; color: var(--navy); background: #f6f7f3; font-size: 17px; line-height: 1.5; }
.dictation-panel label { display: block; margin-bottom: 9px; font-size: 14px; font-weight: 650; }
.dictation-panel textarea { display: block; width: 100%; min-height: 110px; padding: 14px; border: 1px solid #adc0b5; border-radius: 10px; background: #fff; color: var(--ink); resize: vertical; font-size: 18px; line-height: 1.5; }
.dictation-panel .control-row { margin: 14px 0; }
#dictationFeedback { min-height: 24px; color: #355d49; font-weight: 650; line-height: 1.5; }
.dictation-reference { margin-top: 10px; }
.dictation-reference .template-line { margin-bottom: 0; }
@media(max-width:760px) { .section-nav { padding: 0 16px; grid-template-columns: repeat(4, minmax(0, 1fr)); } .section-nav a { font-size: 13px; } }
@media(max-width:390px) { .section-nav { padding: 0 12px; } .section-nav a { font-size: 12px; } }
.mobile-template-picker { display: none; }
@media(max-width:760px) {
  .page-shell { padding-top: 16px; }
  .page-intro { margin-bottom: 16px; }
  .page-intro h1 { margin: 4px 0; }
  .page-intro > p:last-child { margin: 5px 0 0; }
  .catalog { display: none; }
  .mobile-template-picker { display: grid; gap: 7px; margin-bottom: 14px; color: var(--navy); font-size: 14px; font-weight: 700; }
  .mobile-template-picker select { width: 100%; min-height: 46px; padding: 8px 12px; border: 1px solid #adc0b5; border-radius: 10px; color: var(--navy); background: #fffefa; font: inherit; }
  .practice-card { padding: 18px; }
  .template-description { margin: 9px 0 11px; }
  .template-toolbar { padding-bottom: 9px; }
  .dictation-panel { padding-top: 14px; }
  .dictation-cue { min-height: 54px; margin-bottom: 12px; padding: 12px; }
}