:root{font-family:system-ui,Segoe UI,sans-serif;color:#124c67;background:#effcf9;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:linear-gradient(120deg,#e4fcf4,#fffdf2 60%,#f5edff);min-height:100vh}header{display:flex;align-items:center;justify-content:space-between;padding:23px max(24px,calc((100vw - 1160px)/2));background:linear-gradient(110deg,#0b858a,#225de1);color:white;gap:20px}.brand{font-size:22px;letter-spacing:1px}.brand strong{font-weight:800}a{color:inherit}.brand,.back{text-decoration:none}.back{border:1px solid #ffffff70;border-radius:9px;padding:9px 14px}main{max-width:1160px;margin:34px auto;padding:0 22px 50px}.intro{border-left:5px solid #ffbe36;padding:2px 0 2px 22px;margin:0 0 26px}.eyebrow{font-size:12px;font-weight:800;letter-spacing:2px;color:#a86800}h1{font-size:32px;line-height:1.2;margin:12px 0}h2{font-size:20px;margin:0}.intro p,.hint{color:#648295;line-height:1.65}.studio,.results-panel{background:#ffffffde;border:1px solid #aadcd6;border-radius:18px;padding:25px;margin-bottom:24px;box-shadow:0 7px 24px #286a8210}.studio{border-top:4px solid #159e9e}.section-title{display:flex;justify-content:space-between;align-items:center;gap:15px;flex-wrap:wrap}.badge{border-radius:20px;background:#fff0b9;color:#855b00;font-size:13px;font-weight:700;padding:7px 13px}.hint{font-size:13px}.voice-fields{display:grid;grid-template-columns:140px 1fr 1.6fr;gap:16px;margin-top:22px}label{display:block;font-size:14px;font-weight:650}input,select,textarea{font:inherit;color:#164d66;border:1px solid #abd5d3;border-radius:8px;background:#fafffe;padding:12px;width:100%;margin-top:8px}textarea{resize:vertical;min-height:180px;line-height:1.65}input:focus,select:focus,textarea:focus{outline:2px solid #13a9ad;outline-offset:2px}.sample{display:flex;align-items:center;justify-content:space-between;gap:15px;min-height:58px;margin:12px 0 20px;font-size:13px;color:#648295}.sample audio{max-width:300px;height:36px}.actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:16px}#count{margin-right:auto;font-size:13px;color:#648295}button{font:inherit;font-size:14px;font-weight:650;border:1px solid #8acbc9;border-radius:9px;padding:12px 18px;cursor:pointer;background:#eaf8f6;color:#136376}.primary{background:linear-gradient(105deg,#09969a,#245ede);color:white;border:0}button:disabled{opacity:.5;cursor:default}#status{font-weight:650;line-height:1.6;margin:20px 0 5px}.error{color:#b23139}.result{display:grid;grid-template-columns:1fr auto;gap:12px;padding:18px 0;border-bottom:1px solid #dfebe8}.result:last-child{border-bottom:0}.result p{color:#718b98;font-size:13px;margin:6px 0;overflow-wrap:anywhere}.result audio{width:100%;max-width:450px;height:38px}.download{display:inline-block;align-self:center;background:#e1f5eb;padding:10px 15px;border-radius:8px;color:#177858;font-weight:650;text-decoration:none;font-size:13px}#progress{font-size:13px;color:#648295}[hidden]{display:none!important}@media(max-width:650px){header{padding:18px;flex-wrap:wrap}.brand{font-size:18px}.back{font-size:13px}main{padding:0 14px 30px;margin-top:22px}h1{font-size:26px}.studio,.results-panel{padding:18px}.voice-fields{grid-template-columns:1fr}.sample{align-items:flex-start;flex-direction:column}.result{grid-template-columns:1fr}.badge{font-size:11px}.actions button{padding:11px 12px}}

/* Compact workspace with independently scrolling results. */
header{height:52px;padding:8px 22px}.brand{font-size:19px}.back{font-size:12px;padding:6px 10px}
main{height:calc(100dvh - 52px);max-width:1600px;margin:0 auto;padding:12px 18px 16px;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);gap:12px}
.intro{grid-column:1/-1;margin:0;padding:0;border:0;display:flex;align-items:center;justify-content:space-between;gap:10px}h1{font-size:22px;margin:0}h2{font-size:16px}.badge{font-size:11px;padding:5px 10px}
.studio,.results-panel{margin:0;padding:14px;min-height:0;display:flex;flex-direction:column;gap:9px;border-radius:12px}.studio{border-top-width:3px}
.voice-fields{grid-template-columns:120px minmax(0,1fr);gap:8px;margin:0}.voice-choice{grid-column:1/-1}label{font-size:12px}input,select,textarea{padding:8px 10px;margin-top:4px;font-size:13px}
.sample{margin:0;min-height:32px;font-size:11px;gap:8px}.sample audio{width:210px;max-width:50%;height:30px}.sample span{overflow-wrap:anywhere}
textarea{flex:1;min-height:70px;resize:none;margin:0;line-height:1.6}.actions{margin:0;gap:6px}button{font-size:12px;padding:9px 12px}#count{font-size:11px;flex-basis:100%}#status{font-size:12px;margin:0;line-height:1.4}details{font-size:11px;color:#648295}details p{margin:5px 0}.hint{font-size:11px}
#progress{font-size:11px}.section-title{gap:6px}.merge-panel{padding:10px;background:#fff9e4;border:1px solid #f3d686;border-radius:9px}.merge-panel p{font-size:11px;color:#7b6940;margin:6px 0 0}
#mergedResult{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:9px}#mergedAudio{height:34px;flex:1;min-width:160px;width:100%}
#results{overflow:auto;min-height:0;flex:1}.result{padding:10px 0;gap:8px;grid-template-columns:minmax(0,1fr) auto}.result strong{font-size:12px}.result p{font-size:11px;margin:4px 0}.result audio{height:32px}.download{font-size:11px;padding:8px 10px}
@media(max-width:760px){header{height:50px;flex-wrap:nowrap;padding:8px 12px}.brand{font-size:16px}.back{font-size:11px}main{height:auto;min-height:calc(100dvh - 50px);padding:12px;grid-template-columns:1fr;grid-template-rows:auto auto auto}.intro{align-items:flex-start;flex-direction:column;gap:6px}h1{font-size:20px}.studio{min-height:490px}textarea{min-height:130px}.results-panel{min-height:270px;max-height:650px}#results{max-height:420px}.result{grid-template-columns:1fr}.badge{font-size:10px}.sample{flex-direction:row;align-items:center}.sample audio{width:170px}}

@media(min-width:761px) and (max-height:760px){header{height:44px}main{height:calc(100dvh - 44px);padding:8px 12px;gap:8px}.studio,.results-panel{padding:10px;gap:6px}.voice-fields{grid-template-columns:85px minmax(0,1fr) minmax(0,1.25fr);gap:7px}.voice-choice{grid-column:auto}.actions{flex-wrap:nowrap}#count{flex-basis:auto;margin-right:auto;max-width:90px}button{font-size:11px;padding:8px 10px}.sample{min-height:30px}textarea{min-height:50px}h1{font-size:20px}}
