:root{color-scheme:dark;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100vh;background:#0a0a0a;color:#fafafa}.app{min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:2rem 1.5rem;max-width:42rem;margin:0 auto}.header{text-align:center;margin-bottom:1.5rem}.header h1{margin:0;font-size:2rem;font-weight:700;letter-spacing:-.03em}.subtitle{margin:.25rem 0 0;color:#ffffff73;font-size:.95rem}.input-section{width:100%;display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.5rem}.text-input{width:100%;background:#ffffff0f;border:1px solid rgba(255,255,255,.12);border-radius:.5rem;padding:.75rem 1rem;color:#fafafa;font-family:inherit;font-size:.9rem;resize:vertical;outline:none;transition:border-color .2s}.text-input:focus{border-color:#63b3ed99}.text-input::placeholder{color:#ffffff4d}.btn{cursor:pointer;border:none;border-radius:.4rem;font-family:inherit;font-weight:500;transition:background .15s,transform .1s}.btn:active{transform:scale(.97)}.btn-load{align-self:flex-end;background:#63b3ed;color:#0a0a0a;padding:.5rem 1.25rem;font-size:.85rem}.btn-load:hover{background:#4299e1}.reader{width:100%;text-align:center;margin-bottom:1.25rem}.word-display{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:.75rem;padding:2.5rem 1rem;margin-bottom:1rem;min-height:5rem;display:flex;align-items:center;justify-content:center;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.word-pre{font-size:2.5rem;color:#ffffff73}.word-pivot{font-size:2.5rem;color:#63b3ed;font-weight:700}.word-post{font-size:2.5rem;color:#ffffffd9}.progress-bar{width:100%;height:4px;background:#ffffff14;border-radius:2px;overflow:hidden;margin-bottom:.35rem}.progress-fill{height:100%;background:#63b3ed;border-radius:2px;transition:width .15s ease}.progress-text{font-size:.75rem;color:#ffffff59;font-variant-numeric:tabular-nums}.controls{display:flex;align-items:center;justify-content:center;gap:.75rem;margin-bottom:1.25rem}.btn-icon{background:#ffffff14;color:#ffffffb3;width:3rem;height:3rem;border-radius:50%;font-size:.8rem;display:flex;align-items:center;justify-content:center}.btn-icon:hover{background:#ffffff24}.btn-play{background:#63b3ed;color:#0a0a0a;width:4rem;height:4rem;border-radius:50%;font-size:1rem;font-weight:600;display:flex;align-items:center;justify-content:center}.btn-play:hover{background:#4299e1}.speed-control{width:100%;text-align:center}.speed-label{display:block;margin-bottom:.5rem;font-size:.85rem;color:#fff9}.speed-label strong{color:#fafafa}.speed-slider{width:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;height:4px;background:#ffffff1a;border-radius:2px;outline:none;margin-bottom:.75rem}.speed-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;background:#63b3ed;border-radius:50%;cursor:pointer}.speed-slider::-moz-range-thumb{width:16px;height:16px;background:#63b3ed;border-radius:50%;border:none;cursor:pointer}.speed-presets{display:flex;gap:.5rem;justify-content:center;flex-wrap:wrap}.btn-preset{background:#ffffff0f;color:#fff9;padding:.3rem .75rem;font-size:.75rem;border-radius:1rem}.btn-preset:hover{background:#ffffff1f}.btn-preset.active{background:#63b3ed33;color:#63b3ed;border:1px solid rgba(99,179,237,.3)}