:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#090b0f;color:#f5f7fb}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at 20% 0%,rgba(20,184,166,.14),transparent 34rem),linear-gradient(180deg,#0f141b,#080a0d)}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}svg{width:1rem;height:1rem}label{display:block;margin-bottom:.4rem;color:#aab4c3;font-size:.78rem;font-weight:700}input,select,textarea{width:100%;border:1px solid #283341;border-radius:.55rem;background:#0b1017;color:#f5f7fb;outline:none}input,select{min-height:2.4rem;padding:0 .75rem}textarea{min-height:8rem;resize:vertical;padding:.75rem;line-height:1.5}input:focus,select:focus,textarea:focus{border-color:#2dd4bf;box-shadow:0 0 0 3px #2dd4bf1f}.login-shell{min-height:100vh;display:grid;place-items:center;padding:1.5rem}.login-panel{width:min(100%,30rem);border:1px solid #25303d;border-radius:.75rem;background:#0e141cf0;padding:2rem;box-shadow:0 24px 80px #00000059}.brand-mark,.brand-icon{display:inline-grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:.55rem;background:#2dd4bf;color:#03110f}.brand-mark svg,.brand-icon svg{width:1.35rem;height:1.35rem}.eyebrow{margin:0 0 .25rem;color:#2dd4bf;font-size:.72rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.login-panel h1,.topbar h1,.reader-header h1{margin:0;line-height:1.1}.login-copy{color:#aab4c3;line-height:1.6}.login-form,.stack{display:grid;gap:1rem}.checkbox-row{display:flex;align-items:center;gap:.55rem;margin:0}.checkbox-row input{width:1rem;min-height:auto}.primary-button,.secondary-button,.round-button,.icon-button{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;border:1px solid transparent;border-radius:.55rem;font-weight:800}.primary-button{min-height:2.65rem;padding:0 1rem;background:#2dd4bf;color:#03110f}.primary-button:hover{background:#5eead4}.secondary-button,.icon-button{min-height:2.35rem;padding:0 .8rem;border-color:#283341;background:#111821;color:#d8dee8}.secondary-button:hover,.icon-button:hover{border-color:#3f5268;background:#172232}.round-button{width:3rem;height:3rem;border-radius:999px;background:#f5f7fb;color:#0b1017}.round-button svg{width:1.25rem;height:1.25rem}.form-error,.inline-error{margin:0;border:1px solid rgba(248,113,113,.35);border-radius:.55rem;background:#7f1d1d42;color:#fecaca;padding:.7rem .8rem;font-size:.86rem}.app-shell{min-height:100vh}.topbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:1rem;border-bottom:1px solid #25303d;background:#090b0fe0;padding:1rem clamp(1rem,2.5vw,2rem);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.app-nav{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:.75rem;min-height:4rem;border-bottom:1px solid #25303d;background:#090b0feb;padding:.65rem clamp(.75rem,2.5vw,1.5rem);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.app-nav.source-nav{display:grid;grid-template-columns:auto minmax(0,1fr) auto}.nav-title{overflow:hidden;color:#f5f7fb;font-size:1rem;text-align:center;text-overflow:ellipsis;white-space:nowrap}.compact-brand,.nav-actions{display:flex;align-items:center}.compact-brand{min-width:0;gap:.55rem;color:#f5f7fb}.compact-brand strong{overflow:hidden;font-size:1rem;line-height:1;text-overflow:ellipsis;white-space:nowrap}.brand-icon.compact{width:2rem;height:2rem;border-radius:.5rem}.brand-icon.compact svg{width:1.1rem;height:1.1rem}.nav-actions{flex:0 0 auto;gap:.45rem}.nav-button,.control-button{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;min-height:2.45rem;border:1px solid #283341;border-radius:.55rem;background:#111821;color:#d8dee8;font-weight:800}.nav-button{padding:0 .7rem}.nav-button.icon-only,.control-button{width:2.45rem;padding:0}.nav-button:hover,.control-button:hover{border-color:#3f5268;background:#172232}.brand,.panel-title,.inline-control,.metrics,.transport{display:flex;align-items:center}.brand,.panel-title{gap:.75rem}.workspace{width:min(96rem,100%);margin:0 auto;padding:clamp(1rem,2.5vw,2rem);display:grid;grid-template-columns:minmax(18rem,26rem) minmax(0,1fr);gap:1.25rem}.player-page,.source-page{width:min(100%,96rem);margin:0 auto;padding:clamp(.75rem,2.5vw,1.5rem)}.source-page{width:min(100%,56rem)}.player-stack{display:grid;gap:.8rem;width:min(100%,58rem);margin:0 auto}.sidebar,.reader-column{display:grid;gap:1.25rem;align-content:start}.panel,.reader-stage,.transport,.player-control-panel{border:1px solid #25303d;border-radius:.55rem;background:#0e141ceb;box-shadow:0 18px 55px #0000003d}.panel{padding:1rem}.panel-title{margin-bottom:1rem;color:#d8dee8}.panel-title h2{margin:0;font-size:1rem}.segmented{display:grid;grid-template-columns:1fr 1fr;gap:.25rem;margin-bottom:1rem;border:1px solid #283341;border-radius:.6rem;background:#0b1017;padding:.25rem}.segmented button{border:0;border-radius:.45rem;background:transparent;color:#aab4c3;padding:.6rem .5rem;font-weight:800}.segmented button.active{background:#163c38;color:#99f6e4}.two-column,.range-grid{display:grid;grid-template-columns:1fr 1fr;gap:.85rem}.range-grid{grid-template-columns:7rem 1fr;align-items:center}.range-grid label{margin:0}.inline-control{gap:.55rem}.inline-control .icon-button{flex:0 0 auto;width:2.4rem;padding:0}.preset-list{display:grid;gap:.55rem}.preset-list button{display:grid;grid-template-columns:auto 1fr;gap:.15rem .55rem;align-items:center;border:1px solid #283341;border-radius:.55rem;background:#0b1017;color:#eef2f7;padding:.7rem;text-align:left}.preset-list small{grid-column:2;color:#8190a3}.reader-stage{min-height:auto;padding:clamp(.65rem,2vw,1rem)}.player-control-panel{position:sticky;top:4.55rem;z-index:12;display:grid;gap:.8rem;padding:clamp(.8rem,2vw,1rem);background:#0d131bf7;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.player-summary-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.8rem;align-items:start}.player-summary-row h2{display:-webkit-box;overflow:hidden;margin:0;-webkit-box-orient:vertical;-webkit-line-clamp:2;color:#f5f7fb;font-size:clamp(1.15rem,3.6vw,1.55rem);line-height:1.12}.reader-header{display:flex;justify-content:space-between;gap:1rem;border-bottom:1px solid #25303d;padding-bottom:1rem}.metrics{flex-wrap:wrap;gap:.55rem;justify-content:flex-end}.compact-metrics{max-width:16rem}.metrics span{display:inline-flex;align-items:center;gap:.35rem;border:1px solid #283341;border-radius:999px;background:#0b1017;color:#b8c4d4;padding:.35rem .65rem;font-size:.8rem}.sentence-counter{display:flex;align-items:center;justify-content:space-between;gap:1rem;border:1px solid #283341;border-radius:.55rem;background:#0b1017;color:#aab4c3;padding:.55rem .7rem}.sentence-counter span{font-size:.8rem;font-weight:800}.sentence-counter strong{color:#f8fafc;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.95rem}.live-dot:before{content:"";width:.48rem;height:.48rem;border-radius:999px;background:#64748b}.live-dot.active:before{background:#2dd4bf;box-shadow:0 0 0 5px #2dd4bf1f}.transcript-window{display:grid;gap:.55rem}.transcript-row{display:grid;grid-template-columns:2.5rem 1fr;gap:.75rem;align-items:center;border:1px solid transparent;border-radius:.65rem;background:transparent;color:#aab4c3;padding:.7rem;text-align:left}.transcript-row strong{font-size:.9rem;line-height:1.45}.transcript-row:hover{border-color:#283341;background:#101821}.transcript-row span{color:#6f7f92;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.78rem;font-weight:900}.transcript-row.active{border-color:#2dd4bf73;background:#14b8a61f;color:#ccfbf1;padding:.95rem .85rem}.transcript-row.active .active-transcript-text{font-size:clamp(1.15rem,2vw,1.5rem);line-height:1.6}.empty-state{color:#8190a3}.transport{flex-wrap:wrap;gap:.75rem;justify-content:center;padding:1rem}.player-action-row{display:grid;grid-template-columns:2.75rem 3.25rem 2.75rem 2.75rem;justify-content:center;gap:.65rem}.player-action-row .round-button{width:3.25rem;height:3.25rem}.player-progress{margin-top:-.1rem}.progress-row{display:grid;grid-template-columns:2rem minmax(10rem,1fr) 2rem;gap:.55rem;align-items:center;width:100%;color:#8190a3;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.78rem;font-weight:900}@media(max-width:980px){.workspace{grid-template-columns:1fr}.reader-header{flex-direction:column}.metrics{justify-content:flex-start}}@media(max-width:620px){.topbar{align-items:flex-start;flex-direction:column}.two-column,.range-grid{grid-template-columns:1fr}.transport .secondary-button{flex:1 1 42%}.app-nav{min-height:3.75rem}.player-page,.source-page{padding:.75rem}.player-control-panel{top:4.25rem}.player-summary-row{grid-template-columns:1fr}.metrics,.compact-metrics{max-width:none;justify-content:flex-start}.reader-stage{padding:.55rem}.transcript-row{grid-template-columns:2rem 1fr;gap:.55rem;padding:.65rem .55rem}.transcript-row.active{padding:.75rem .6rem}.transcript-row.active .active-transcript-text{font-size:1.08rem;line-height:1.55}}@media(max-width:360px){.nav-button span{display:none}.nav-button{width:2.45rem;padding:0}}.settings-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:30;display:flex;justify-content:flex-end;background:#02060c9e}.settings-drawer{width:min(100%,26rem);min-height:100%;overflow:auto;border-left:1px solid #25303d;background:#0b1017;padding:1rem;box-shadow:-24px 0 70px #00000059}.drawer-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem}.drawer-header h2{margin:0;font-size:1.05rem}.settings-drawer .panel{border:0;background:transparent;box-shadow:none;padding:0}@media(max-width:620px){.settings-overlay{align-items:flex-end}.settings-drawer{width:100%;min-height:0;max-height:82vh;border-top:1px solid #25303d;border-left:0;border-radius:.75rem .75rem 0 0;box-shadow:0 -18px 70px #0000006b}}
