:root{
  color-scheme:light;
  --ink:#17212b;--muted:#66727c;--paper:#f3f0e9;--card:#fff;
  --accent:#e75b36;--accent-dark:#bf3f20;--teal:#157f78;--line:#ddd7cc;
  --soft:#f8f6f1;--danger:#a83a31;--shadow:0 18px 60px rgba(26,35,42,.1)
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.45 Inter,Segoe UI,system-ui,sans-serif}
button,input{font:inherit}
button{cursor:pointer}
.site-header,main{max-width:1180px;margin:auto}
.site-header{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;padding:42px 28px 28px}
h1{font-size:44px;line-height:1.05;letter-spacing:-.035em;margin:5px 0 10px}
h2{font-size:27px;line-height:1.15;letter-spacing:-.02em;margin:5px 0 12px}
h3,p{margin-top:0}
.lede{color:var(--muted);margin:0;max-width:640px}
.eyebrow{letter-spacing:.15em;font-weight:850;font-size:11px;color:var(--accent);margin:0}
.header-actions{display:flex;align-items:center;gap:12px;flex-shrink:0}
.server-state{display:flex;align-items:center;gap:8px;color:var(--teal);font-weight:750;font-size:13px}
.server-state i{width:9px;height:9px;border-radius:50%;background:#27b49f;box-shadow:0 0 0 4px #27b49f1c}
main{padding:0 28px 70px}
.publisher-card{display:grid;grid-template-columns:310px minmax(0,1fr);background:var(--card);border:1px solid var(--line);border-radius:26px;overflow:hidden;box-shadow:var(--shadow)}
.publish-intro{padding:34px;background:var(--ink);color:#fff}
.publish-intro>p:not(.eyebrow){color:#c3ccd3}
.steps{list-style:none;margin:32px 0 0;padding:0;display:grid;gap:22px}
.steps li{display:flex;align-items:center;gap:13px}
.steps li>span{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#ffffff13;border:1px solid #ffffff26;color:#ffb08e;font-weight:850}
.steps div{display:grid}.steps small{color:#aebac3;margin-top:2px}
.publish-form{padding:32px;display:grid;gap:24px;min-width:0}
.field-row,.picker-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
label{display:block;font-size:13px;font-weight:800}
input[type=text],input[type=password],input[type=time],input:not([type]){display:block;width:100%;margin-top:7px;border:1px solid #cdd2d5;border-radius:11px;padding:12px 13px;background:#fff;color:var(--ink);outline:none}
input:focus{border-color:var(--teal);box-shadow:0 0 0 3px #157f7818}
.picker-panel{min-width:0;border:1px solid var(--line);border-radius:17px;padding:16px;background:var(--soft)}
.picker-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px}
.picker-heading div{display:grid}.picker-heading small,.chapter-title small{font-weight:400;color:var(--muted);margin-top:2px}
#audio-summary{font-size:12px;color:var(--teal);font-weight:750;text-align:right}
.drop-zone,.cover-picker{position:relative;display:grid;place-items:center;text-align:center;border:1.5px dashed #aab3b8;border-radius:13px;background:#fff;min-height:146px;padding:20px;transition:.18s ease}
.drop-zone:hover,.drop-zone.dragover,.cover-picker:hover{border-color:var(--teal);background:#f5fffc}
.drop-zone input,.cover-picker input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.drop-zone span,.drop-zone strong,.drop-zone small,.cover-picker span{pointer-events:none}
.drop-icon{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#e8f5f2;color:var(--teal);font-size:22px;margin-bottom:8px}
.drop-zone small,.cover-picker small{display:block;color:var(--muted);font-weight:400;margin-top:3px}
.folder-choice{display:flex;justify-content:center;align-items:center;gap:6px;color:var(--muted);font-size:12px;margin-top:9px}.text-button{border:0;background:none;color:var(--teal);font:inherit;font-weight:800;padding:2px;text-decoration:underline;text-underline-offset:2px}
.cover-picker{overflow:hidden;min-height:230px}.cover-picker img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.cover-picker #cover-placeholder{display:grid;place-items:center}.cover-picker b{font-size:30px;color:var(--teal);font-weight:400}
.chapter-panel{margin-top:13px}.chapter-title{display:grid;margin-bottom:8px}
#chapter-list{list-style:none;padding:0;margin:0;display:grid;gap:6px;max-height:225px;overflow:auto}
#chapter-list li{display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:8px;background:#fff;border:1px solid #e3ded5;border-radius:9px;padding:7px 8px;font-size:12px}
.chapter-number{display:grid;place-items:center;width:24px;height:24px;border-radius:7px;background:#edf2f2;color:var(--teal);font-weight:850}
.chapter-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chapter-size{color:var(--muted)}
.chapter-buttons{display:flex;gap:3px}.chapter-buttons button{border:0;background:#f0eee9;color:var(--ink);border-radius:6px;width:27px;height:27px;padding:0;font-weight:850}.chapter-buttons button:hover{background:#dedbd4}.chapter-buttons button:disabled{opacity:.32;cursor:default}
.publish-action{display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid var(--line);padding-top:20px}
.progress-wrap{flex:1;min-width:0}progress{display:block;width:100%;height:8px;accent-color:var(--teal);margin-bottom:8px}#status{color:var(--muted);font-size:13px;margin:0;min-height:20px}.status-success{color:var(--teal)!important;font-weight:750}.status-error{color:var(--danger)!important;font-weight:750}
.button{border:1px solid transparent;border-radius:10px;padding:10px 15px;font-weight:800;background:none;color:var(--ink)}.button:disabled{opacity:.55;cursor:wait}.primary{background:var(--accent);color:#fff;padding:13px 20px}.primary:hover{background:var(--accent-dark)}.secondary{background:#fff;border-color:var(--line)}.secondary:hover{background:#f5f3ee}.danger{color:var(--danger);border-color:#e8c9c4;background:#fff}.danger:hover{background:#fff3f1}
.library-section{margin-top:48px}.section-title{display:flex;justify-content:space-between;align-items:flex-end;gap:25px;margin-bottom:16px}.section-title h2{margin-bottom:0}.catalogue-state{text-align:right;display:grid}.catalogue-state span{font-weight:850}.catalogue-state small{color:var(--muted)}
.library{display:grid;gap:12px}.book-card{display:grid;grid-template-columns:92px minmax(0,1fr) auto;align-items:center;gap:20px;background:var(--card);padding:13px;border:1px solid var(--line);border-radius:17px}.book-cover{width:92px;height:92px;object-fit:cover;border-radius:12px;background:#e8e5df}.book-info h3{font-size:19px;margin:0 0 3px}.book-info p{margin:0}.creator{color:var(--muted)}.book-meta{color:#8b949b;font-size:12px;margin-top:7px!important}.book-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.book-actions .button{font-size:12px;padding:8px 10px}
.empty-state{background:#fff;border:1px dashed #cfc8bc;border-radius:17px;padding:36px;text-align:center;color:var(--muted)}
.devices-section{margin-bottom:28px}.devices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.device-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:0 8px 28px rgba(26,35,42,.06)}.device-heading{display:flex;justify-content:space-between;align-items:center;gap:16px}.device-heading>div{display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:9px}.device-heading h3{margin:0}.device-heading small{grid-column:2;color:var(--teal)}.device-dot{grid-row:1/3;width:11px;height:11px;border-radius:50%;background:#27b49f;box-shadow:0 0 0 4px #27b49f1c}.device-paused .device-dot{background:var(--danger);box-shadow:0 0 0 4px #a83a311c}.device-paused .device-heading small{color:var(--danger)}.schedule-row{display:grid;grid-template-columns:minmax(155px,1fr) 95px 95px auto;align-items:end;gap:10px;margin-top:17px;padding-top:15px;border-top:1px solid var(--line)}.schedule-switch{align-self:center}.schedule-switch input{margin-right:6px}.schedule-row input[type=time]{padding:8px;margin-top:4px}.schedule-row .button{white-space:nowrap}
dialog{border:0;border-radius:20px;padding:0;width:min(460px,calc(100% - 30px));box-shadow:0 24px 100px #0006}dialog::backdrop{background:#17212bcc}.dialog-form{padding:28px;display:grid;gap:16px}.dialog-form h2{margin:0}.dialog-form>p:not(.eyebrow){color:var(--muted)}.dialog-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:5px}.dialog-status{min-height:20px;margin:0;font-size:13px}.compact-file{border:1px solid var(--line);border-radius:11px;padding:13px}.compact-file input{display:block;margin-top:8px;width:100%}
.account-dialog{max-height:min(760px,90vh);overflow:auto}.account-dialog-heading{display:flex;justify-content:space-between;gap:20px}.icon-button{border:0;background:#eeeae2;border-radius:50%;width:34px;height:34px;font-size:23px;line-height:1}.account-list{display:grid;gap:8px}.account-row{display:flex;align-items:center;gap:11px;padding:10px;border:1px solid var(--line);border-radius:12px;background:var(--soft)}.account-avatar{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--teal);color:#fff;font-weight:900}.account-row div{display:grid}.account-row small{color:var(--muted)}.account-form{border-top:1px solid var(--line);padding-top:16px;display:grid;gap:12px}.account-form h3{margin:0}
.login-body{min-height:100vh;background:var(--ink);display:grid;place-items:center;padding:28px}.login-shell{width:min(940px,100%);padding:0;display:grid;grid-template-columns:1.05fr .95fr;background:#10202b;border:1px solid #ffffff18;border-radius:28px;overflow:hidden;box-shadow:0 30px 100px #0008}.login-brand{padding:58px;color:#fff;background:radial-gradient(circle at 10% 10%,#157f7866,transparent 45%),#17212b}.login-brand h1{font-size:44px}.login-brand>p:not(.eyebrow){color:#bec8cf;max-width:430px;margin:20px 0 30px}.login-mark{display:grid;place-items:center;width:62px;height:62px;border-radius:18px;background:var(--accent);color:#fff;font-size:24px;margin-bottom:32px}.login-feature{display:flex;gap:10px;align-items:center;color:#dce4e8;margin-top:13px}.login-feature i{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#157f78;font-style:normal;font-size:12px}.login-card{background:#fff;padding:58px 48px}.login-card h2{font-size:34px;margin-top:7px}.login-card>p:not(.eyebrow){color:var(--muted);margin-bottom:28px}.login-card form{display:grid;gap:17px}.login-button{width:100%;margin-top:4px}.login-status{min-height:22px;color:var(--danger);margin:0;font-size:13px;font-weight:750}.login-help{display:block;text-align:center;color:var(--muted);margin-top:24px}
@media(max-width:850px){.login-shell{grid-template-columns:1fr}.login-brand{display:none}.login-card{padding:42px 30px}.devices{grid-template-columns:1fr}.publisher-card{grid-template-columns:1fr}.publish-intro{padding:27px}.steps{grid-template-columns:repeat(3,1fr);gap:10px}.steps li{align-items:flex-start}.steps small{display:none}.book-card{grid-template-columns:76px 1fr}.book-cover{width:76px;height:76px}.book-actions{grid-column:1/-1;justify-content:flex-start}}
@media(max-width:650px){.site-header{align-items:flex-start;flex-direction:column;padding:28px 18px 20px}.header-actions{width:100%;justify-content:space-between}main{padding:0 18px 50px}h1{font-size:36px}.devices-section .section-title .primary{width:100%}.device-heading{align-items:flex-start}.schedule-row{grid-template-columns:1fr 1fr}.schedule-switch,.save-schedule{grid-column:1/-1}.field-row,.picker-grid{grid-template-columns:1fr}.publish-form{padding:20px}.steps{grid-template-columns:1fr;margin-top:20px}.steps small{display:block}.publish-action{align-items:stretch;flex-direction:column}.primary{width:100%}.section-title{align-items:flex-start;flex-direction:column}.catalogue-state{text-align:left}.book-card{grid-template-columns:68px 1fr;gap:13px}.book-cover{width:68px;height:68px}.book-actions .button{flex:1}.book-actions{display:grid;grid-template-columns:1fr 1fr}.book-actions .delete{grid-column:1/-1}}
