/* Owner editor workspace. Reader and upload screens keep their own layout. */
.editor-mode{--editor-header:72px;font-family:var(--font);background:#e7e8e7;color:var(--ink)}
/* The editor shares the site header, just a little more compact. */
.editor-mode .studio-header{position:fixed;z-index:30;top:0;left:0;right:0;height:var(--editor-header);padding-block:0}
.editor-mode .brand img{width:60px;height:48px}
.editor-mode .brand-name{font-size:18px}
.editor-nav{margin-left:auto}
.editor-mode main{margin:var(--editor-header) 0 0 280px;padding:0;max-width:none;min-height:calc(100vh - var(--editor-header))}
.editor-sidebar{position:fixed;top:var(--editor-header);bottom:0;left:0;width:280px;overflow-y:auto;background:#f5f3f3;border-right:2px solid #ddd5d5;z-index:20;padding-bottom:12px}
.editor-main-actions{display:flex;gap:20px;padding:15px 10px;background:#ebe7e7}
.editor-main-actions button{flex:1;background:var(--brand);color:#fff;border:0;border-radius:5px;height:29px;padding:5px 8px;font:12px var(--font)}
.editor-main-actions button:hover{background:var(--brand-dark)}
.editor-sidebar section{margin-bottom:25px}
.editor-sidebar h2{font:500 13px var(--font);margin:0 0 8px;padding:10px 14px;background:#ebe7e7}
.editor-option{display:flex;align-items:center;gap:10px;width:calc(100% - 26px);margin:8px 8px;border:1px solid #ebe3e3;background:#fcfbfb;border-radius:9px;padding:8px 12px;text-align:left;font:12px var(--font);min-height:35px;color:var(--ink)}
.editor-option span:first-child{font-size:18px;width:17px;color:var(--brand);line-height:1}
.editor-option:hover{background:var(--brand-soft);border-color:var(--brand)}
.editor-message{margin:10px;font:12px/1.5 var(--font);color:#5c5556;overflow-wrap:anywhere}
.editor-mode .reader{padding:20px 10px 0;position:relative}
.editor-mode .reader-layout{display:block}
.editor-mode .reader-settings,.editor-mode footer,.editor-mode .reader-actions,.editor-mode .reader-heading .eyebrow{display:none}
.editor-mode .reader-heading{position:absolute;left:11px;top:20px;max-width:190px;padding:20px 15px;background:#ffffffed;border-radius:5px;z-index:5;pointer-events:none}
.editor-mode .reader-heading h1{font:500 26px/1.3 var(--font);margin:0 0 12px;color:#161616}
.editor-mode #reader-subtitle{font:20px/1.4 var(--font);color:#858585;margin:0}
.editor-mode .reading-surface{border-radius:0;padding:0 10px;background:#e7e8e7}
.editor-mode .book-viewport{height:calc(100vh - var(--editor-header) - 75px);min-height:320px}
.editor-mode .reader-hint{display:none}
.editor-mode .toolbar{border:0;background:transparent;border-radius:0;padding:7px 15px;gap:10px}
.editor-mode .toolbar button{font:18px var(--font);padding:5px 12px;border:0;border-radius:4px}
.editor-mode .page-controls{margin:auto;font:12px var(--font)}
.editor-mode .page-controls input{padding:5px}
.editor-mode .view-controls{position:absolute;right:25px;top:20px;z-index:6;gap:0;background:#ffffffed;border-radius:5px;padding:4px}
.editor-mode .view-controls output{font:12px var(--font);min-width:36px}
.editor-mode #fullscreen span{display:none}
.editor-mode #status-box{position:fixed;bottom:20px;left:calc(50% + 140px);transform:translateX(-50%);z-index:50;min-width:260px}
.editor-mode #reader:fullscreen{padding:20px;background:#e7e8e7}
.editor-mode #reader:fullscreen .book-viewport{height:calc(100vh - 100px)}
.editor-dialog{width:min(520px,calc(100vw - 28px));max-height:88vh;overflow:auto;border:1px solid #e8dfdf;border-radius:10px;background:#fcfbfb;color:var(--ink);padding:26px;font:14px/1.5 var(--font);box-shadow:0 20px 80px #0003}
.editor-dialog::backdrop{background:#231f2080}
.editor-dialog h2{font:500 21px var(--font);margin:0 25px 22px 0}
.editor-dialog button{font:13px var(--font);border-radius:5px;padding:9px 14px;border-color:var(--brand);color:var(--brand-dark);margin:7px 8px 5px 0}
.editor-dialog .editor-dialog-close{position:absolute;right:10px;top:6px;border:0;font-size:23px;background:transparent;margin:0}
.editor-field{display:block;margin:15px 0;font-size:13px}
.editor-field input:not([type=checkbox]),.editor-field textarea,.editor-dialog select,.editor-dialog-content>input,#editor-dialog-content>input{display:block;width:100%;margin:7px 0 0;padding:10px 12px;border:1px solid #e0d8d8;border-radius:5px;font:14px var(--font);color:var(--ink);background:#fff}
.editor-field input[type=checkbox]{float:left;margin:3px 10px 3px 0;accent-color:var(--brand)}
.editor-field input[type=color]{height:42px;padding:4px}
.editor-help{font:13px/1.6 var(--font);color:var(--muted)}
.editor-dialog .editor-done{background:var(--brand);color:white;min-width:95px}
#editor-dialog-error{color:#a44032;font-size:13px}
.editor-entry{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #ece5e5;padding:5px 0}
.reader-extras{display:flex;align-items:center;flex-wrap:wrap;gap:15px;padding:12px}
.reader-extras:empty{display:none}
.reader-custom-logo{max-width:145px;max-height:65px;object-fit:contain}
.reader-extras audio{height:35px;max-width:100%}
.reader-extras details{position:relative;background:white;padding:10px;border-radius:6px}
.reader-extras details button{display:block;margin:5px 0;font-size:13px;font-weight:400}
.page-interaction{position:absolute!important;z-index:12;pointer-events:auto!important;object-fit:contain;inset:auto;min-width:0}
a.page-interaction{display:flex;align-items:center;justify-content:center;background:#ffffffd9;border:1px solid var(--brand);border-radius:4px;color:var(--brand-dark);padding:4px;font:14px var(--font);overflow:hidden}
#book-mount .flip-page img.page-interaction,#book-mount .deck-page img.page-interaction{object-fit:contain;pointer-events:auto}
@media(max-width:1050px){.editor-mode .reader-heading{position:static;max-width:none;margin:0 0 8px;padding:8px 15px}.editor-mode .reader-heading h1{font-size:20px;margin:0}.editor-mode #reader-subtitle{font-size:14px}.editor-mode .book-viewport{height:calc(100vh - var(--editor-header) - 145px)}.editor-mode .view-controls{top:20px}.editor-nav{gap:16px}}
@media(max-width:700px){.editor-mode .studio-header{padding-inline:12px}.editor-mode .brand img{width:50px;height:40px}.editor-mode .brand-name{font-size:14px}.editor-nav a:first-child{display:none}.editor-sidebar{position:relative;top:auto;width:100%;height:auto;max-height:300px;margin-top:var(--editor-header);border-bottom:1px solid #ddd5d5;display:block}.editor-sidebar section{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:12px;padding:0 8px}.editor-sidebar h2{width:100%;margin:0 -8px}.editor-option{width:calc(50% - 3px);margin:0;font-size:11px}.editor-main-actions{position:sticky;top:0;z-index:1}.editor-mode main{margin:0;min-height:0}.editor-mode{display:flex;flex-direction:column}.editor-sidebar{order:0}.editor-mode main{order:1}.editor-mode .book-viewport{height:55vh}.editor-mode .view-controls{position:static}.editor-mode .toolbar{flex-wrap:wrap;justify-content:center}.editor-mode .page-controls{margin:0}.editor-mode #status-box{left:50%;max-width:95vw}.editor-mode .reader-heading{padding:8px}.editor-message{margin:5px 10px}}

/* Embedded reader used by the dashboard preview popup. */
.embedded-preview{background:#f2f3f2;font-family:var(--font)}
.embedded-preview>.studio-header,.embedded-preview>footer{display:none}
.embedded-preview main{max-width:none;margin:0;padding:0}
.embedded-preview .reader{position:relative;padding:0;min-height:100vh}
.embedded-preview .reader-heading{position:absolute;top:20px;left:20px;z-index:5;background:#ffffffed;border-radius:4px;padding:20px 6px;max-width:210px;pointer-events:none}
.embedded-preview .reader-heading .eyebrow,.embedded-preview .reader-actions{display:none}
.embedded-preview .reader-heading h1{font:500 27px/1.3 var(--font);margin:0 0 14px;color:var(--ink)}
.embedded-preview #reader-subtitle{font:20px/1.4 var(--font);color:#858585;margin:0}
.embedded-preview .reader-layout{display:block}
.embedded-preview .reading-surface{border-radius:0;padding:12px 8px 0}
.embedded-preview .book-viewport{height:calc(100dvh - 60px);min-height:200px}
.embedded-preview .reader-hint{display:none}
.embedded-preview .toolbar{border:0;border-radius:0;background:transparent;padding:8px 16px;justify-content:center}
.embedded-preview .page-controls{font:12px var(--font)}
.embedded-preview .page-controls button{padding:5px 12px;border:0;font-size:19px}
.embedded-preview .page-controls input{padding:5px}
.embedded-preview .view-controls{position:absolute;right:20px;top:8px;z-index:6;background:#ffffffed;border-radius:5px;padding:5px;gap:2px}
.embedded-preview .view-controls button{border:0;background:transparent;padding:5px 8px;font-size:23px}
.embedded-preview .view-controls output{font:12px var(--font);min-width:35px}
.embedded-preview #fullscreen span{display:none}
.embedded-preview .reader-lock{margin:25px auto;width:calc(100% - 30px)}
.embedded-preview #status-box{position:fixed;bottom:15px;left:50%;transform:translateX(-50%);min-width:240px;max-width:90%;z-index:10;margin:0}
.embedded-preview .reader-extras{background:#f2f3f2}
@media(max-width:760px){.embedded-preview .reader-heading{position:static;max-width:none;margin:0;padding:12px 16px;min-height:60px;padding-right:190px}.embedded-preview .reader-heading h1{font-size:19px;margin:0 0 4px}.embedded-preview #reader-subtitle{font-size:14px}.embedded-preview .book-viewport{height:calc(100dvh - 140px)}.embedded-preview .view-controls{right:8px}.embedded-preview .toolbar{padding:6px}.embedded-preview .page-controls{gap:5px}}

/* Public share links use the entire window, without the studio shell. */
.standalone-reader .reader{min-height:100dvh}
.standalone-reader .reading-surface{padding-top:20px}
.standalone-reader .book-viewport{height:calc(100dvh - 78px)}
.standalone-reader .reader-heading{left:20px;top:20px;max-width:min(320px,22vw);padding:20px 16px}
.standalone-reader .view-controls{top:20px;right:24px}
.standalone-reader .reader-extras:empty{display:none}
@media(max-width:760px){
 .standalone-reader .reader-heading{max-width:none;padding:14px 175px 14px 16px;min-height:70px}
 .standalone-reader .view-controls{top:12px;right:8px}
 .standalone-reader .reading-surface{padding-top:8px}
 .standalone-reader .book-viewport{height:calc(100dvh - 150px)}
}

/* A quiet, centered spinner while PDF pages are being prepared. */
.loading-spinner{display:none}
body #status-box.is-loading{position:fixed;left:50%;top:50%;bottom:auto;transform:translate(-50%,-50%);width:48px;min-width:0;max-width:none;margin:0;padding:0;border:0;border-radius:0;box-shadow:none;background:transparent;z-index:50;text-align:center}
body #status-box.is-loading .loading-spinner{display:block;position:relative;width:48px;height:48px}
.loading-spinner i{position:absolute;left:22px;top:3px;width:4px;height:8px;border-radius:4px;background:#7c8e96;transform-origin:2px 21px;transform:rotate(calc(var(--tick)*30deg));opacity:.12;animation:spinner-fade 1.2s linear infinite;animation-delay:calc(var(--tick)*.1s - 1.2s)}
body #status-box.is-loading #progress{display:none}
body #status-box.is-loading #status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
body #status-box.is-loading #cancel{position:absolute;top:58px;left:50%;transform:translateX(-50%);margin:0;white-space:nowrap}
@keyframes spinner-fade{0%{opacity:1}100%{opacity:.12}}
@media(prefers-reduced-motion:reduce){.loading-spinner i{animation:none;opacity:calc(.15 + var(--tick)*.07)}}
