:root{--ink:#172d35;--muted:#617078;--line:#dbe3e4;--wash:#f3f6f4;--accent:#176b60;--warm:#b95321;--paper:#fff;font:15px/1.55 system-ui,sans-serif;color:var(--ink);background:var(--wash);color-scheme:light}*{box-sizing:border-box}body{margin:0}a{color:var(--accent);text-underline-offset:3px}button,input,select,textarea{font:inherit}button{background:white;border:1px solid #c9d6d5;border-radius:6px;color:var(--ink);padding:8px 12px;cursor:pointer;min-height:38px}button:hover{border-color:var(--accent);background:#eff7f4}button:disabled{opacity:.5;cursor:wait}.primary{background:var(--accent);color:white;border-color:var(--accent)}.primary:hover{background:#13594f;color:white}.selected{outline:2px solid var(--accent);outline-offset:1px}input,select,textarea{border:1px solid #c5d2d3;border-radius:5px;background:#fff;color:var(--ink);padding:8px;width:100%}input[type=checkbox]{width:auto;accent-color:var(--accent)}input[type=range]{width:125px;padding:0}input[type=number]{width:110px;font-variant-numeric:tabular-nums}label{display:block;font-size:.87rem;font-weight:550;margin:10px 0 6px}label input,label select,label textarea{margin-top:4px}label.inline,label.check{display:flex;align-items:center;gap:7px;font-weight:400}.inline select{width:auto}.inline input{margin:0}h1,h2{font-family:Georgia,serif;line-height:1.2;font-weight:500}h1{font-size:clamp(2rem,5vw,3rem);margin:0}h2{font-size:1.25rem;margin:0 0 14px}p{margin:10px 0 16px}.topbar{border-bottom:1px solid var(--line);background:#fff;padding:14px max(24px,calc((100vw - 1400px)/2));display:flex;align-items:center;gap:20px}.topbar a{text-decoration:none;font-family:Georgia,serif;font-size:1.2rem}.topbar span{font-size:.8rem;color:var(--muted)}.topbar .pill{margin-left:auto}.topbar button{min-height:30px;padding:3px 10px}main{max-width:1400px;padding:28px 24px;margin:auto}.intro{display:flex;align-items:center;justify-content:space-between;margin:8px 0 24px}.eyebrow{font-size:.69rem;letter-spacing:.16em;font-weight:700;color:var(--accent);margin:0 0 10px}.intro .muted{margin:9px 0 0}.muted{color:var(--muted)}.tiny{font-size:.78rem}.pill{font-size:.69rem;letter-spacing:.05em;border:1px solid var(--line);border-radius:20px;padding:4px 10px;white-space:nowrap}.identity{text-align:right;color:var(--muted);font-size:.85rem}.panel{background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:22px;margin-bottom:16px;box-shadow:0 3px 10px #16372b03}.login{max-width:680px;margin:35px auto;padding:36px}.login h2{font-size:1.8rem}.login form{margin:25px 0}.login .row input{flex:1;min-width:160px}.layout{display:grid;grid-template-columns:265px minmax(0,1fr);gap:22px}.queue{align-self:start;position:sticky;top:16px;padding:18px}.queue-top strong{font-size:.9rem}progress{width:100%;height:5px;accent-color:var(--accent);display:block;margin:12px 0 18px}.queue nav{max-height:55vh;overflow:auto;margin-top:14px}.task{width:100%;text-align:left;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:12px 8px;display:block}.task.current{background:#eaf4ef;border-left:3px solid var(--accent)}.task strong{display:block;font-size:.85rem}.task small{color:var(--muted);font-size:.72rem}.task .taskword{float:right;font-family:'Traditional Arabic','Times New Roman',serif;font-size:1.3rem;color:var(--ink)}.export{width:100%;font-size:.78rem;margin-top:12px}.row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.between{justify-content:space-between}.word{font-family:'Traditional Arabic','Times New Roman',serif;font-size:3.5rem;text-align:center;padding:10px;color:#183e36}.ayah{font-family:'Traditional Arabic','Times New Roman',serif;font-size:1.8rem;line-height:2.2}.event summary{cursor:pointer;color:var(--accent);font-size:.85rem}.event .muted{font-size:.87rem;margin:14px 0 0}.warning{font-size:.8rem;color:#92601c;background:#fff9e9;padding:8px 12px;border-radius:5px;margin:12px 0 0}#notice{padding:12px 18px;border-radius:6px;background:#e7f1ec;border:1px solid #bbd7c8;margin-bottom:18px}#notice.error{background:#fff0ed;border-color:#e9beb1;color:#973c25}.audio-panel{padding:20px 22px}#waveform{margin:18px 0 12px;min-height:130px}#waveform::part(region-handle){width:5px!important;background:#176b6066}#waveform::part(region-content){font-size:11px;white-space:nowrap}.transport{padding-bottom:12px;border-bottom:1px solid var(--line);margin-bottom:12px}.transport output{font-variant-numeric:tabular-nums;font-size:.8rem;min-width:70px}kbd{background:#edf2ef;border:1px solid #cfdcd5;border-radius:3px;font-size:.7rem;padding:1px 5px}.fields{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.target-color{background:#def3ed;color:var(--accent)}#target-controls{margin:12px 0}#target-controls strong{font-size:.85rem}.ref{border:1px solid var(--line);border-left:4px solid #b57d32;border-radius:6px;padding:12px;margin:12px 0;background:#fffdf8}.ref.natural{border-left-color:#5573b5;background:#fafbff}.ref .row{gap:10px}.ref input.ref-label{flex:1;min-width:180px}.ref label{margin:0}.ref .remove{margin-left:auto;padding:4px 8px;font-size:.8rem}.ref .duration{font-size:.8rem}.ref .eligible{font-weight:400;font-size:.8rem}.review #save-state{font-size:.8rem;color:var(--muted)}footer{color:var(--muted);font-size:.75rem;text-align:center;padding:20px}#reference-counts{font-size:.8rem}article{min-width:0}.guide{max-width:850px}.guide h1{margin:20px 0 30px}.guide h2{margin-top:25px}.guide li{margin:8px 0}.guide table{width:100%;border-collapse:collapse;font-size:.87rem}.guide td,.guide th{padding:12px;border-bottom:1px solid var(--line);text-align:left}.guide pre{white-space:pre-wrap}[hidden]{display:none!important}:focus-visible{outline:3px solid #d8a752;outline-offset:2px}@media(max-width:1000px){.layout{grid-template-columns:220px minmax(0,1fr)}.panel{padding:18px}.fields{gap:10px}.transport{gap:9px}}@media(max-width:760px){main{padding:20px 12px}.topbar{padding:12px}.topbar .pill{display:none}.layout{display:block}.queue{position:static}.queue nav{max-height:180px}.intro{align-items:flex-start}.identity{max-width:110px}.fields{grid-template-columns:1fr}.fields label{margin:4px 0}.login{padding:24px}.row{gap:9px}#target-controls label{flex:1}#target-controls strong{width:100%}.transport label{margin:3px 0}.event .row a{font-size:.8rem}.queue .export{width:auto;margin-right:8px}}
dialog{width:min(520px,calc(100vw - 32px));border:1px solid var(--line);border-radius:10px;padding:28px;color:var(--ink);box-shadow:0 16px 60px #172d3533}dialog::backdrop{background:#172d3566}dialog form{justify-content:flex-end}dialog p{margin-bottom:24px}