File size: 1,372 Bytes
1b2da16
 
 
 
 
 
 
319d860
1b2da16
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
color:#eee; width:100%;
[hidden] { display:none!important; }
.script-stage { width:100%; }
textarea, .reading-window { box-sizing:border-box; width:100%; height:2.8em; padding:0; margin:0; color:#f2f2ef; background:transparent; border:0; text-align:center; font:400 clamp(24px,3vw,35px)/1.4 Arial,Helvetica,sans-serif; letter-spacing:-.6px; }
textarea { display:block; resize:none; overflow-y:auto; border-radius:0; scrollbar-width:thin; scrollbar-color:#444 transparent; }
.reading-window { overflow:hidden; position:relative; }
.reading-track { white-space:pre-wrap; overflow-wrap:anywhere; transition:transform .22s ease; }
.word { color:#777; transition:color .12s linear; }
.word.spoken { color:#f2f2ef; }
.script-tools { display:flex; min-height:44px; align-items:center; justify-content:center; gap:16px; margin-top:8px; color:#888; font:10px ui-monospace,monospace; }
.script-tools button { color:#aaa; font:11px ui-monospace,monospace; border:0; background:none; min-height:44px; padding:6px 10px; cursor:pointer; }
[data-pages] { display:inline-flex; }
:focus-visible { outline:1px solid #aaa; outline-offset:4px; }
.sr { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
@media(max-width:600px) { textarea,.reading-window { font-size:24px; } }
@media(prefers-reduced-motion:reduce) { .reading-track,.word { transition:none; } }