:root{font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#28483d;background:#f5f5ec}*{box-sizing:border-box}body{margin:0}header{padding:25px 5vw;border-bottom:1px solid #d9dfd0;display:flex;justify-content:space-between;align-items:center;gap:20px}header b{font-size:24px;letter-spacing:-1px}header b span{color:#83a26e}header>span,.eyebrow,.badge{font-size:10px;font-weight:700;letter-spacing:2px}main{max-width:1400px;padding:38px 5vw 60px;margin:auto}.intro h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(38px,4.5vw,60px);line-height:1.05;margin:14px 0}.intro>p:last-child{color:#65776b}.layout{display:grid;grid-template-columns: minmax(300px,.85fr) minmax(400px,1.15fr);gap:28px;margin-top:32px}.editor,.player{background:#fffef8;border:1px solid #dce2d4;border-radius:20px;padding:26px}h2{font-size:18px;margin:0 0 24px}em{font-style:normal;color:#8a9d7c;font-size:12px;margin-right:12px}label{font-size:12px;display:block;margin-bottom:8px}textarea,input,select{font:inherit;color:inherit;border:1px solid #ccd5c5;border-radius:9px;padding:11px;background:white}textarea{width:100%;resize:vertical;line-height:1.6;margin-bottom:12px}button{font:inherit;font-size:12px;border:1px solid #ccd5c5;background:#f8f9f1;color:inherit;border-radius:9px;padding:11px 14px;cursor:pointer}button:hover{background:#e6eddb}button:disabled{opacity:.45;cursor:default}.primary{background:#315944;color:white;border-color:#315944}.primary:hover{background:#447458}.examples{display:flex;gap:7px;margin:14px 0}.examples button{font-size:10px;padding:7px 10px}.note,details,#status{font-size:12px;line-height:1.6;color:#687568}#status{padding:12px;background:#eff3e7;border-radius:8px}.word-row{border-bottom:1px solid #e5e9dd;padding:12px 0;display:grid;grid-template-columns:80px 1fr;gap:8px;align-items:center}.word-row b{font-size:13px}.word-row select,.word-row input{width:100%;font-size:11px;padding:8px}.word-row small{grid-column:2;font-size:10px;color:#8e5739}#approve{margin-top:20px}.stage-title{display:flex;justify-content:space-between}.badge{font-size:8px;color:#758267}canvas{width:100%;display:block;border-radius:14px;background:#f2f4eb}.controls{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;margin:18px 0}.controls label{margin:0}.controls select{padding:9px;font-size:12px}#caption{text-align:center;padding:12px;font-size:14px;min-height:44px}#track{display:flex;gap:6px;overflow:auto;padding:4px 0}#track button{white-space:nowrap;font-size:10px}#track button[aria-current=true]{background:#dce9cb;border-color:#55754a}details{margin-top:22px}a{color:inherit}@media(max-width:850px){.layout{grid-template-columns:1fr}header>span{font-size:8px}.editor,.player{padding:20px}main{padding:25px 5vw}}
#transcript{max-height:220px;overflow:auto;line-height:1.9;font-size:15px}.live-line{margin:8px 0}.active{background:#dce9cb;border-radius:4px;padding:3px}.done{color:#6b826d}.skipped{color:#9b593e;text-decoration:underline dotted}h3{font-size:14px;margin-top:25px}#interim{min-height:42px;font-style:italic}#queue{letter-spacing:1px}#track{font-size:13px;line-height:1.6;min-height:24px}
/* Mobile: listening first, avatar second, supporting input below. */
@media(max-width:850px){
 header{padding:16px 5vw;gap:10px}header b{font-size:21px}header>span{font-size:7px;letter-spacing:1px}
 main{padding:16px 4vw 32px}.intro{display:none}
 .layout{display:flex;flex-direction:column;gap:14px;margin-top:0}
 .editor{display:contents}
 .editor>h2{display:none}
 .editor>.controls{order:0;position:sticky;top:0;z-index:10;margin:0 -4vw;padding:12px 4vw;background:#f5f5ecf5;border-bottom:1px solid #dce2d4;display:grid;grid-template-columns:1fr 1fr auto;gap:7px;backdrop-filter:blur(10px)}
 .editor>.controls button{min-height:46px;font-size:12px;padding:10px 8px}
 .editor>#status{order:1;margin:0;padding:10px 13px;font-size:12px}
 .player{order:2;padding:14px;border-radius:16px}
 .stage-title{align-items:center;margin-bottom:8px}.stage-title h2{margin:0;font-size:16px}.stage-title .badge{font-size:7px;letter-spacing:1px}
 canvas{width:100%;max-height:44svh;object-fit:contain;background:#f2f4eb}
 #caption{min-height:30px;padding:7px;font-size:16px;font-weight:600}
 .player>.controls{margin:7px 0;justify-content:space-between}.player>.controls button{min-height:42px}
 #track{min-height:20px;font-size:12px;margin-top:8px}.player>.note{margin:6px 0 0;font-size:10px}
 .editor>p,.editor>label,.editor>select,.editor>h3,.editor>#transcript,.editor>details{order:3;margin:0;padding-left:8px;padding-right:8px}
 .editor>select{margin:0 8px;min-height:44px;width:calc(100% - 16px)}
 .editor>h3{margin-top:8px}.editor>details{padding:14px;background:#fffef8;border:1px solid #dce2d4;border-radius:12px}
 .editor>details summary{min-height:24px;font-size:13px}.editor>details textarea{margin-top:10px}
 #transcript{max-height:180px;overflow:auto;padding:10px 14px;background:#fffef8;border-radius:12px}
 #interim{min-height:32px;font-size:13px}
 button,input,select,textarea{touch-action:manipulation}textarea{font-size:16px}#pace{font-size:16px}
}
@media(max-width:380px){.editor>.controls{grid-template-columns:1fr 1fr}.editor>.controls #clear{grid-column:1/-1;min-height:34px;padding:6px}canvas{max-height:38svh}}

.feedback{margin-top:28px;padding:26px;border:1px solid #dce2d4;border-radius:20px;background:#fffef8}.feedback h2{margin-bottom:8px}.feedback form{max-width:720px}.feedback select{margin-bottom:18px;width:100%;max-width:360px}.feedback textarea{font-size:16px}.feedback-consent{display:flex;align-items:center;gap:8px;line-height:1.5}.feedback-consent input{width:18px;height:18px}.feedback-actions{display:flex;gap:8px;flex-wrap:wrap}.feedback-actions button{min-height:44px}#feedbackStatus:empty{display:none}@media(max-width:850px){.feedback{padding:20px}}

.diagnostics{margin-top:24px;padding:20px;background:#fffef8;border:1px solid #dce2d4;border-radius:16px}.diagnostics summary{font-weight:600;font-size:14px;cursor:pointer}.diagnostics pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:11px;line-height:1.7;max-height:300px;overflow:auto}.diagnostics button{min-height:44px}

:root{color:#204b3e;background:#f8f6ee}.primary{background:#204b3e;border-color:#204b3e}.primary:hover{background:#326654}.eyebrow{color:#a24c30}.brand-link{display:block;width:230px;max-width:54%;line-height:0}.brand-link img{width:100%;height:auto}header>span{letter-spacing:1.5px}header i{font-style:normal;color:#a24c30;margin-left:6px}.badge{color:#a24c30}.active{background:#ede1d5}.editor>.controls{background:#f8f6eef5}@media(max-width:850px){.brand-link{width:190px;max-width:58%}header>span{font-size:8px;letter-spacing:1px}}
#signout{font-size:12px;min-height:34px;padding:5px 12px;margin-left:auto;margin-right:16px}