@font-face { font-family:"Site Inter"; font-style:normal; font-weight:100 900; font-display:swap; src:url('./assets/fonts/inter/InterVariable.woff2') format('woff2'); }
:root { --accent-700:#7b3aed; --accent-750:#6430dc; --accent-800:#5b27cd; --accent-75:#f6f1ff; --accent-shadow:#5a339c; --paper:#fff; --page:#f0f8ff; --ink:#050b1a; --muted:#697386; --line:#d5e3ed; }
* { box-sizing:border-box; }
body { margin:0; font:15px/1.5 "Site Inter",system-ui,sans-serif; color:var(--ink); }
button,input,select { font:inherit; }
button,a,select { -webkit-tap-highlight-color:transparent; }
[hidden] { display:none !important; }
a { color:var(--accent-700); }
button { cursor:pointer; }
button:disabled { cursor:default; opacity:.55; }
:is(button,a,input,select):focus-visible { outline:2px solid var(--accent-700); outline-offset:4px; }
.site-header { width:100%; height:88px; padding:0 max(64px,calc((100% - 1312px)/2)); display:flex; align-items:center; justify-content:space-between; gap:20px; background:var(--paper); }
.wordmark { flex:0 0 auto; color:var(--ink); font-size:20px; font-weight:700; text-decoration:none; letter-spacing:-.04em; }
.account-tools { display:flex; min-width:0; align-items:center; gap:18px; }
#authSlot .auth-apple-icon { opacity:.6; }
#accountEmail { max-width:240px; overflow:hidden; text-overflow:ellipsis; color:var(--muted); font-size:13px; }
.text-button { border:0; background:none; padding:8px 0; color:var(--accent-700); font-size:14px; font-weight:550; }
.landing-layout.pdf-layout { display:flex; flex-direction:column; align-items:center; width:100%; max-width:808px; margin:0 auto; padding:60px 24px 0; gap:40px; color:var(--ink); }
.pdf-layout .landing-intro { display:flex; width:100%; flex-direction:column; align-items:center; gap:16px; text-align:center; }
.pdf-layout .landing-intro h1 { font-size:64px; line-height:78px; }
.pdf-layout .converter { width:100%; border:0; border-radius:0; background:none; box-shadow:none; overflow:visible; }
.converter-body { display:flex; flex-direction:column; gap:28px; padding:0; }
.conversion-files { display:flex; flex-direction:column; gap:20px; margin-top:52px; }
.drop-zone { display:flex; min-height:190px; flex-direction:column; align-items:center; justify-content:center; gap:16px; padding:24px; border:1px dashed var(--line); border-radius:20px; background:var(--paper); text-align:center; }
.drop-zone.is-dragging { background:var(--accent-75); border-color:var(--accent-700); }
.upload-prompt { display:flex; flex-direction:column; align-items:center; gap:16px; }
.drop-zone p { margin:0; color:var(--muted); font-size:14px; line-height:22px; }
.drop-zone .landing-choose-file { width:240px; min-height:48px; margin:0; border-color:transparent; font-weight:700; }
.drop-zone .file-limit { font-size:13px; line-height:18px; }
.word-limit-panel { display:flex; width:100%; flex-direction:column; align-items:center; gap:10px; }
.word-limit-panel h2 { margin:0; color:var(--ink); font-size:20px; font-weight:600; line-height:28px; }
.drop-zone .word-limit-reset { display:flex; width:286px; max-width:100%; min-height:38px; align-items:center; justify-content:center; padding:8px 12px; border-radius:999px; color:var(--accent-700); background:var(--accent-75); font-size:14px; font-weight:600; line-height:20px; }
.drop-zone[data-state="few-words"] { min-height:244px; }
.drop-zone[data-state="few-words"] .word-limit-panel { gap:12px; }
.word-limit-panel .landing-choose-file { max-width:100%; border-radius:999px; color:var(--paper); background:var(--accent-700); box-shadow:inset 0 1px 0 #ffffff47,0 8px 18px #7b3aed24; font-size:14px; line-height:20px; }
.results { margin:0; }
.audio-file { display:flex; min-height:64px; width:100%; align-items:center; gap:20px; padding:0; border:0; background:none; }
.audio-copy { display:flex; min-width:0; flex:1; flex-direction:column; gap:12px; }
.audio-file .audio-name { margin:0; overflow:hidden; color:var(--ink); font-size:16px; font-weight:600; line-height:24px; text-overflow:ellipsis; white-space:nowrap; }
.audio-play { display:grid; width:61px; height:61px; flex:0 0 auto; place-items:center; padding:0; border:1px solid #6c28d9; border-radius:999px; color:#fff; background:#7b3aed; box-shadow:inset 0 1px 0 #ffffff5c,0 14px 28px #7b3aed3d,0 5px 10px #232a3b1a,0 1px 2px #232a3b14; }
.audio-play:hover:not(:disabled) { color:#fff; background:#6c28d9; box-shadow:inset 0 1px 0 #ffffff66,0 19px 36px #7b3aed4d,0 7px 14px #232a3b1f,0 2px 4px #232a3b14; }
.audio-play:active:not(:disabled) { transform:scale(.96); }
.audio-play:focus-visible { outline:3px solid #7b3aed47; outline-offset:4px; }
.audio-play svg { width:28px; height:28px; overflow:visible; fill:#fff; stroke:#fff; stroke-linecap:round; stroke-linejoin:round; stroke-width:2.4; }
.audio-play .play-icon { width:30px; height:30px; transform:translate(2px,1px); }
.audio-play .pause-icon,.audio-play.is-playing .play-icon { display:none; }
.audio-play.is-playing .pause-icon { display:block; fill:none; transform:none; }
@media (prefers-reduced-motion:no-preference) { .audio-play { transition:color 160ms ease,background 160ms ease,transform 160ms ease,box-shadow 160ms ease; } }
.audio-file audio { display:none; }
.audio-seek { --progress:0%; appearance:none; width:100%; height:18px; margin:-7px 0; padding:0; border:0; background:transparent; cursor:pointer; }
.audio-seek::-webkit-slider-runnable-track { height:4px; border-radius:999px; background:linear-gradient(to right,var(--accent-700) var(--progress),var(--line) var(--progress)); }
.audio-seek::-moz-range-track { height:4px; border-radius:999px; background:linear-gradient(to right,var(--accent-700) var(--progress),var(--line) var(--progress)); }
.audio-seek::-webkit-slider-thumb { appearance:none; width:12px; height:12px; margin-top:-4px; border:0; border-radius:50%; background:var(--accent-700); opacity:0; }
.audio-seek::-moz-range-thumb { width:12px; height:12px; border:0; border-radius:50%; background:var(--accent-700); opacity:0; }
.audio-seek:is(:hover,:focus-visible)::-webkit-slider-thumb,.audio-seek:is(:hover,:focus-visible)::-moz-range-thumb { opacity:1; }
.audio-seek:disabled { cursor:default; }
.download-button { display:inline-flex; width:166px; min-height:46px; flex:0 0 auto; align-items:center; justify-content:center; gap:10px; padding:10px 16px; border:1px solid transparent; border-radius:999px; color:var(--ink); background:linear-gradient(180deg,#f3f4f6,#e6e9ef); box-shadow:inset 0 1px 0 #fff; font:600 14px/20px "Site Inter",system-ui,sans-serif; text-decoration:none; white-space:nowrap; cursor:pointer; }
.download-button:hover:not(:disabled) { filter:brightness(.97); }
.download-button>img { width:18px; height:18px; flex:0 0 auto; }
.download-button:disabled { color:#8a919e; opacity:1; cursor:default; }
.download-button:disabled>img { opacity:.4; }
#jobs { display:flex; flex-direction:column; gap:20px; }
.job { padding:20px 22px; border:1px solid var(--line); border-radius:24px; background:var(--paper); }
.job-ready { padding:0; border:0; background:none; }
.job-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.job h3 { font-size:14px; font-weight:700; margin:0; overflow-wrap:anywhere; }
.job-status { font-size:11px; padding:3px 8px; background:var(--accent-75); color:var(--accent-700); border-radius:20px; white-space:nowrap; }
.job-status.failed { color:#9d3333; background:#fceeee; }
.job p { font-size:12px; color:var(--muted); line-height:1.7; margin:9px 0 0; }
.job-actions { display:flex; align-items:center; gap:18px; margin-top:14px; }
.job-ready>.job-actions { margin-top:0; }
.remove-button { color:var(--muted); font-size:13px; line-height:20px; }
.job-ready .partial-note { font-size:13px; line-height:20px; }
.usage-row { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:4px 12px; color:var(--muted); font-size:13px; line-height:18px; }
#resetText:empty { display:none; }
.notice { margin:0; color:var(--muted); font-size:14px; line-height:20px; }
.notice.error { padding:12px 14px; border-radius:10px; background:#fff0f0; color:#9d3333; }
.verify-panel { display:flex; width:100%; flex-direction:column; align-items:center; gap:10px; }
.verify-panel h2 { margin:0; font-size:18px; font-weight:600; line-height:24px; }
.drop-zone .verify-panel p { font-size:13px; line-height:18px; }
.verify-panel button { padding:3px 0; line-height:20px; }
.secondary-button { border:1px solid var(--line); border-radius:999px; background:var(--paper); color:var(--ink); padding:9px 14px; font-size:12px; }
.conversion-state { display:flex; width:100%; flex-direction:column; align-items:center; gap:10px; }
.conversion-state h2 { margin:0; font-size:18px; font-weight:600; line-height:24px; }
.drop-zone .conversion-file { max-width:100%; overflow:hidden; font-size:13px; line-height:18px; text-overflow:ellipsis; white-space:nowrap; }
.drop-zone #conversionHint { font-size:13px; line-height:18px; }
.conversion-state .text-button { padding:3px 0; line-height:20px; }
.conversion-state.has-action { gap:8px; }
.conversion-actions { display:flex; width:100%; flex-wrap:wrap; align-items:center; justify-content:center; gap:12px 20px; }
.conversion-actions .landing-choose-file { max-width:100%; border-radius:999px; background:var(--accent-700); color:var(--paper); box-shadow:inset 0 1px 0 #ffffff47,0 8px 18px #7b3aed24; font-size:14px; line-height:20px; }
.conversion-actions .landing-choose-file:disabled { color:#8a919e; background:linear-gradient(180deg,#f3f4f6,#e6e9ef); box-shadow:inset 0 1px 0 #fff; opacity:1; }
.conversion-progress { width:min(360px,100%); height:6px; overflow:hidden; border-radius:999px; background:var(--line); }
.conversion-progress>span { display:block; width:100%; height:100%; border-radius:inherit; background:var(--accent-700); transform:scaleX(0); transform-origin:left; transition:transform .4s linear; }
.conversion-progress.is-indeterminate>span { width:35%; animation:conversion-progress 1.8s ease-in-out infinite; }
@keyframes conversion-progress { from { transform:translateX(-100%); } to { transform:translateX(300%); } }
@media (prefers-reduced-motion:reduce) { .conversion-progress>span { transition:none; } .conversion-progress.is-indeterminate>span { animation:none; transform:translateX(95%); } }
.site-footer { margin:0 auto; padding:64px 24px 36px; color:var(--muted); font-size:13px; line-height:20px; text-align:center; }
body.landing-page:not(.is-focus-mode):not(.is-small-window):not(.mcp-reader) .site-footer { color:var(--muted); }
dialog { width:min(460px,calc(100% - 32px)); padding:28px; border:1px solid var(--line); border-radius:24px; color:var(--ink); box-shadow:0 24px 80px #274f6c25; }
dialog::backdrop { background:#19233755; }
.upload-dialog { width:min(560px,calc(100% - 32px)); max-height:calc(100dvh - 32px); padding:28px; border:1px solid #fffffff5; border-radius:26px; background:rgb(255 255 255 / 94%); box-shadow:inset 0 1px 0 #fff,0 26px 74px #232a3b2b; backdrop-filter:blur(34px) saturate(1.32); }
.upload-dialog::backdrop { background:rgb(5 11 26 / 18%); backdrop-filter:blur(6px); }
body.is-upload-dialog-open { overflow:hidden; }
.upload-dialog-header { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; }
.upload-dialog-header h2 { margin:0; color:#111827; font-size:26px; font-weight:800; letter-spacing:-.035em; line-height:34px; }
.upload-dialog-close { display:grid; width:34px; height:34px; flex:0 0 auto; place-items:center; padding:0; border:1px solid #7e86982e; border-radius:999px; background:transparent; }
.upload-dialog-close:hover { border-color:#7b3aed38; background:var(--accent-75); }
.upload-dialog-close img { opacity:.65; }
.upload-file-details { margin:8px 0 22px; color:var(--muted); font-size:13px; line-height:19px; overflow-wrap:anywhere; }
.upload-language-field legend { color:#596174; font-size:13px; font-weight:700; line-height:18px; }
.upload-language-field { min-width:0; margin:0; padding:0; border:0; }
.upload-language-field legend { padding:0; }
.upload-language-field p { margin:5px 0 12px; color:var(--muted); font-size:13px; line-height:19px; }
.upload-language-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; padding:8px; border:1px solid #7b3aed21; border-radius:17px; background:#eef3fc; }
.upload-language-choice { display:flex; min-width:0; min-height:43px; align-items:center; gap:9px; padding:9px 10px; border-radius:11px; color:#4f586c; font-size:13px; font-weight:550; line-height:18px; cursor:pointer; }
.upload-language-choice:hover { background:#ffffffb8; }
.upload-language-choice:has(input:checked) { color:var(--accent-700); background:#ece4fc; font-weight:700; }
.upload-language-choice:has(input:focus-visible) { outline:2px solid var(--accent-700); outline-offset:1px; }
.upload-language-choice img { width:20px; height:20px; flex:0 0 auto; object-fit:contain; }
.upload-dialog-actions { display:flex; justify-content:space-between; gap:12px; padding-top:24px; }
.upload-back-button,.upload-submit-button { display:flex; min-height:42px; align-items:center; justify-content:center; gap:8px; padding:10px 18px; border:1px solid transparent; border-radius:999px; font-size:13px; font-weight:700; line-height:20px; }
.upload-back-button { color:#596174; background:#f3f5f8; }
.upload-back-button:hover { background:#e9ecf1; }
.upload-submit-button { color:#fff; background:var(--accent-700); box-shadow:0 8px 18px #7b3aed26; }
.upload-submit-button:hover { background:var(--accent-750); }
.upload-submit-button img { filter:brightness(0) invert(1); }
@media (max-width:560px) { .upload-dialog { padding:20px; } .upload-dialog-header h2 { font-size:22px; line-height:28px; } }
@media (max-width:560px) and (max-height:700px) { .upload-file-details { margin:6px 0 16px; } .upload-language-field p { margin:4px 0 10px; } .upload-language-choice { min-height:40px; padding-block:8px; } .upload-dialog-actions { padding-top:18px; } }
@media (max-width:360px) { .upload-language-choice { gap:7px; padding-inline:7px; } }
#authDialog { inset:0; margin:auto; transform:none; color:#111827; }
#authDialog:not([open]) { display:none; }
#authDialog::backdrop { background:rgb(5 11 26 / 18%); backdrop-filter:blur(6px); }
.sign-in-choice>img { position:absolute; left:18px; width:16px; height:16px; }
.sign-in-choice-apple>img { filter:invert(.4); }
.sign-in-dialog-close>img { opacity:.65; }
.sign-in-choice-email>img,.sign-in-field>img { flex:0 0 auto; filter:invert(24%) sepia(87%) saturate(3630%) hue-rotate(255deg) brightness(92%) contrast(96%); }
.sign-in-email-submit>img { filter:brightness(0) invert(1); }
.email-account-tools { display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:12px; }
.create-account { display:flex; align-items:center; gap:6px; color:#596174; }
.create-account input { accent-color:var(--accent-700); }
.email-account-tools .text-button { color:#596174; font-size:12px; font-weight:500; padding:4px 0; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
#authError.error { color:#9d3333; background:#fff0f0; }
@media (max-width:1100px) { .site-header { padding-inline:40px; } }
@media (max-width:760px) { .site-header { height:76px; padding-inline:24px; } .landing-layout.pdf-layout { padding-top:44px; gap:32px; } .pdf-layout .landing-intro h1 { font-size:44px; line-height:56px; } #accountEmail { max-width:140px; } .account-tools { gap:10px; } .site-footer { padding-top:64px; } }
@media (max-width:480px) { .site-header { padding-inline:16px; } .landing-layout.pdf-layout { padding-inline:16px; padding-top:36px; gap:28px; } .pdf-layout .landing-intro h1 { font-size:36px; line-height:46px; } .drop-zone { padding:24px 14px; } .audio-file { flex-wrap:wrap; gap:16px; } .audio-copy { flex-basis:calc(100% - 77px); } .audio-file .download-button { margin-left:77px; } .wordmark { font-size:18px; } }
@media (prefers-reduced-motion:no-preference) { .landing-choose-file,.download-button { transition:background .15s; } }

.document-player-note { display:flex; flex-direction:column; align-items:center; width:100%; gap:8px; margin-top:60px; padding-top:16px; text-align:center; }
.document-player-note-copy { display:flex; width:100%; max-width:680px; min-width:0; flex-direction:column; align-items:center; gap:10px; }
.document-player-note h2 { margin:0; color:var(--ink); font-family:"Libre Baskerville",Baskerville,"Times New Roman",serif; font-size:26px; font-weight:400; line-height:36px; letter-spacing:-.03em; }
.document-player-note p { margin:0; color:var(--muted); font-size:15px; line-height:24px; }
.document-player-note-link { display:flex; min-height:44px; flex:0 0 auto; align-items:center; color:var(--accent-700); font-size:15px; font-weight:600; line-height:24px; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:4px; }
.document-player-note-link:hover { color:var(--accent-800); }
