@font-face{font-family:"DejaVu Review";src:url("assets/DejaVuSans-cyrillic.woff") format("woff");font-display:swap;font-weight:400}
@font-face{font-family:"DejaVu Review";src:url("assets/DejaVuSans-Bold-cyrillic.woff") format("woff");font-display:swap;font-weight:700}
:root{color-scheme:light;--paper:#f7f6f2;--surface:#fff;--ink:#242421;--muted:#62625b;--line:#d8d7cf;--accent:#8b3e28;--tint:#f4e9e1;--display:Georgia,"Times New Roman",serif;--body:"DejaVu Review",sans-serif}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.55;-webkit-text-size-adjust:100%}
button,input,textarea{font:inherit}
button,a,input,summary,textarea{-webkit-tap-highlight-color:transparent}
button{cursor:pointer;touch-action:manipulation}
button:disabled{cursor:default;opacity:.48}
button,a,input,summary,textarea{outline-offset:4px}
:focus-visible{outline:3px solid var(--accent)}
[hidden]{display:none!important}
button{min-height:46px;border:1px solid transparent;border-radius:7px;color:var(--ink);background:transparent}
a{color:var(--accent);text-underline-offset:3px}
main{max-width:740px;padding:0 28px 170px;margin:auto}
.skip-link{position:absolute;left:16px;top:-80px;padding:12px;background:var(--surface);z-index:20}
.skip-link:focus{top:12px}
.intro{padding-top:55px;padding-bottom:35px}
.eyebrow{font-size:11px;letter-spacing:.065em;margin:0 0 25px;color:var(--muted)}
h1{font:400 clamp(43px,8.7vw,67px)/1.03 var(--display);letter-spacing:-.045em;margin:0 0 25px}
.lead{font-size:17px;line-height:1.6;max-width:510px;margin:0 0 14px}
.instruction{font-size:13px;color:var(--muted);margin:0 0 17px}
.sample-text{font-size:13px;color:var(--muted)}
.sample-text summary{min-height:44px;display:list-item;width:fit-content;padding:11px 0;cursor:pointer;color:var(--ink)}
.sample-text p{border-left:2px solid var(--line);padding:3px 0 3px 18px;margin:10px 0;max-width:570px}
.section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:17px}
h2{font:400 29px/1.2 var(--display);letter-spacing:-.025em;margin:0}
.count{font-size:12px;color:var(--muted);white-space:nowrap}
.filters{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:22px}
.filters button{min-width:44px;font-size:12px;padding:10px 12px;border-color:var(--line);min-height:44px}
.filters button[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.filters button span{font-size:11px;margin-left:3px}
.voice-list{border-top:1px solid var(--line)}
.voice-card{padding:23px 0 22px;border-bottom:1px solid var(--line)}
.voice-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:7px}
.voice-title{display:flex;align-items:baseline;gap:14px;min-width:0}
.voice-title h3{font:400 35px/1.1 var(--display);letter-spacing:-.035em;margin:0}
.voice-title span{color:var(--muted);font-size:12px}
.like-button{flex-shrink:0;border:1px solid var(--line);padding:9px 12px;font-size:12px;min-width:111px}
.like-button[aria-pressed="true"]{background:var(--tint);border-color:var(--accent);color:var(--accent)}
.voice-description{font-size:14px;color:var(--muted);margin:0 0 17px;min-height:22px}
.player{display:flex;align-items:center;gap:14px}
.play-button{border:1px solid var(--ink);width:49px;height:49px;min-width:49px;display:grid;place-items:center;background:var(--ink);color:var(--surface);border-radius:50%}
.play-symbol{display:block;width:0;height:0;border-top:7px solid transparent;border-bottom:7px solid transparent;border-left:11px solid currentColor;margin-left:3px}
.play-button[data-state="playing"] .play-symbol{width:10px;height:14px;margin-left:0;border:0;border-left:3px solid currentColor;border-right:3px solid currentColor}
.play-button[data-state="loading"] .play-symbol{width:15px;height:15px;margin-left:0;border:2px solid currentColor;border-top-color:transparent;border-radius:50%;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.seek-wrap{flex:1;min-width:0}
.seek{width:100%;display:block;margin:0;height:44px;accent-color:var(--accent);cursor:pointer;background:transparent}
.time-row{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:11px;font-variant-numeric:tabular-nums;margin-top:-2px}
.player-state{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-right:10px}
.original-link{display:inline-flex;align-items:center;min-height:44px;font-size:11px;margin-top:5px;color:var(--muted)}
.voice-error{margin:13px 0 0;font-size:13px;color:var(--accent)}
.role-field{display:block;margin-top:16px;font-size:12px;color:var(--muted)}
.role-field input{display:block;width:100%;margin-top:7px;min-height:46px;border:1px solid var(--line);border-radius:6px;background:var(--surface);color:var(--ink);padding:10px 12px;font-size:14px}
.role-field input::placeholder{color:var(--muted)}
.direction-note{font-size:12px;color:var(--muted);line-height:1.7;margin:23px 0 0}
.notice{font-size:13px;padding:13px 15px;background:var(--tint);border-radius:7px;color:var(--accent)}
.empty-state{padding:30px 0 35px;border-block:1px solid var(--line)}
.empty-state h3{font:400 25px/1.3 var(--display);margin:0 0 8px}
.empty-state p,.list-message{color:var(--muted);font-size:14px}
.empty-state button{padding:10px 15px;border-color:var(--line);background:var(--surface)}
.page-footer{margin-top:32px;padding-top:19px;border-top:1px solid var(--line);color:var(--muted);font-size:12px;line-height:1.8}
.page-footer p{margin:0 0 12px}
.text-button{padding:10px 0;min-height:46px;text-align:left;color:var(--accent);text-decoration:underline;text-underline-offset:4px}
.selection-bar{position:fixed;bottom:0;left:0;right:0;background:var(--paper);border-top:1px solid var(--line);padding:13px 24px max(13px,env(safe-area-inset-bottom));z-index:5}
.selection-inner{max-width:684px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:14px}
.selection-caption{display:block;font-size:10px;color:var(--muted);margin-bottom:2px}
#selected-count{display:block;font-size:13px;font-weight:400}
.primary{background:var(--accent);color:#fff;padding:12px 18px;font-weight:700;font-size:13px;min-height:48px}
.selection-inner .primary{min-width:175px}
.secondary{border-color:var(--line);background:var(--surface);padding:12px 18px;font-size:13px}
dialog{max-width:540px;width:calc(100% - 28px);max-height:calc(100dvh - 38px);padding:0;border:1px solid var(--line);border-radius:12px;background:var(--paper);color:var(--ink);overflow:auto}
dialog::backdrop{background:rgb(20 20 18 / .48)}
.dialog-content{padding:22px}
.dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.close-button{font-size:28px;line-height:1;width:46px;height:46px;flex-shrink:0;border-color:var(--line)}
.dialog-help{font-size:13px;color:var(--muted);margin:0 0 20px}
.dialog-content label{font-size:12px;color:var(--muted)}
#choice-text{display:block;resize:vertical;width:100%;min-height:170px;max-height:40vh;margin-top:7px;border:1px solid var(--line);border-radius:6px;padding:12px;background:var(--surface);color:var(--ink);font-size:13px;line-height:1.7}
.dialog-actions{display:grid;gap:9px;margin-top:18px}
.dialog-actions .text-button{text-align:center}
.inline-status{font-size:12px;color:var(--accent);min-height:20px;margin:8px 0}
.small-note{font-size:11px;line-height:1.7;color:var(--muted);margin:10px 0 0}
@media(min-width:700px){.intro{padding-top:76px}.voice-card{padding-block:27px}.voice-description{padding-right:130px}.player{max-width:580px}.role-field{max-width:580px}}
@media(max-width:360px){main{padding-inline:18px}.selection-bar{padding-inline:18px}.selection-inner{gap:10px}.selection-inner .primary{min-width:0;padding-inline:13px}.filters{gap:4px}.filters button{padding-inline:9px;font-size:11px}.voice-title{gap:8px}.voice-title h3{font-size:32px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;scroll-behavior:auto!important}}