/* Interface surfaces follow the OS. Document theme variables are scoped in reader-design.css. */
:root[data-theme=dark]{color-scheme:dark;--paper:#151515;--canvas:#111;--ink:#ededed;--quiet:#b0b0b0;--accent:#e0a3a7;--selected:#303030;--rule:#383838;--line:#383838;--surface:#202020;--soft:#242424;--vilna-accent:#e0a3a7;--app-paper:#151515;--app-ink:#ededed;--app-quiet:#b0b0b0;--app-selected:#303030}
:root[data-theme=dark] :is(.sidebar,.library-header,.sources-page){background:var(--app-paper);color:var(--app-ink)}
:root[data-theme=dark] :is(.library-search input,.resume-reading,.tractate-popover,.font-popover,#appearance.vaul-appearance){background:var(--surface);color:var(--ink);border:1px solid var(--rule);box-shadow:none}
:root[data-theme=dark] .library-search input::placeholder{color:var(--quiet);opacity:1}
:root[data-theme=dark] .library-search input:focus{border-color:var(--vilna-accent);outline:2px solid var(--vilna-accent);outline-offset:2px;box-shadow:none}
:root[data-theme=dark] :is(.appearance-open,.segment-indicator,.font-option,.resume-sheet){box-shadow:none}
:root[data-theme=dark] #appearance .animated-segments>button{border:0}
:root[data-theme=dark] #appearance .segment-indicator{background:#363636;border:1px solid #505050;box-shadow:none}
:root[data-theme=dark] #appearance .animated-segments>button[aria-pressed=true]{color:#fff}
:root[data-theme=dark] .font-option[aria-selected=true]{background:#363636;color:#fff;box-shadow:none}
:root[data-theme=dark] .font-option:hover,:root[data-theme=dark] .tractate-option:hover{background:#303030}
:root[data-theme=dark] .tractate-option[aria-selected=true]{background:#363636;color:#fff}
:root[data-theme=dark] .drawer-overlay{background:#0009;backdrop-filter:none}
:root[data-theme=dark] .size-slider::-webkit-slider-runnable-track{background:linear-gradient(to right,var(--vilna-accent) var(--size-progress),var(--rule) var(--size-progress))}
:root[data-theme=dark] .size-slider::-webkit-slider-thumb{background:var(--vilna-accent);box-shadow:none}
:root[data-theme=dark] .size-slider::-moz-range-progress,:root[data-theme=dark] .size-slider::-moz-range-thumb{background:var(--vilna-accent)}
:root[data-theme=dark] .sources-page :is(h1,h2,h3){color:var(--app-ink)}
:root[data-theme=dark] .about-tabs::before{background:#363636;border:1px solid #505050}
:root[data-theme=dark] .history-warning{background:#202020;border-color:#e0a3a7}
:root[data-theme=dark] .history-examples small{opacity:1;color:var(--quiet)}
:root[data-theme=dark] [data-sonner-toast]{border:1px solid #454545!important;box-shadow:none!important}
:root[data-theme=dark] ::selection{background:#514043;color:#fff}
/* Review exports use the same neutral palette, including marked source spans. */
:root[data-theme=dark] .commentary-review{background:var(--app-paper);color:var(--app-ink)}
:root[data-theme=dark] .commentary-review article{border-color:var(--rule)}
:root[data-theme=dark] .commentary-review a{color:var(--accent)}
:root[data-theme=dark] .commentary-review .status{color:var(--quiet)}
:root[data-theme=dark] .commentary-review mark{background:#514043;color:#fff}
:root[data-theme=dark] .commentary-review :is(summary,a):focus-visible{outline-color:var(--accent)}
:root[data-theme=dark] #appearance{background:var(--surface);border:1px solid var(--rule);box-shadow:none}
:root[data-theme=dark] #appearance::backdrop{background:#0009;backdrop-filter:none}
:root[data-theme=dark] .theme-options button>span{border-color:#555}
/* The OS theme must not lighten red annotations on light reading paper. */
:is(#reader,.turn-measure)[data-theme=light] .unplaced-comments,:is(#reader,.turn-measure)[data-theme=cream] .unplaced-comments,:is(#reader,.turn-measure)[data-theme=paper] .unplaced-comments{color:#a13939}

/* The homepage preview must blend into live interface colors, including OS changes. */
.library-page .resume-reading.resume-full{--home-fade:var(--app-paper);border:0;outline:0;box-shadow:none}
.library-page .resume-full .resume-continue{background:var(--app-ink);color:var(--app-paper)}
:root[data-theme=dark] .library-page .resume-reading.resume-full,
:root[data-theme=dark] .library-page .resume-full .resume-sheet{
 --paper:var(--app-paper);--ink:var(--app-ink);--quiet:var(--app-quiet);--comment:#bbb5ad;
 background:var(--app-paper);color:var(--app-ink);border:0;outline:0;box-shadow:none;color-scheme:dark;
}
:root[data-theme=dark] .library-page .library-name::before{background:#b8b2aa}
:root[data-theme=dark] #resume-reading.resume-full{border:0;background:var(--app-paper);color:var(--app-ink)}

/* A paper edge with the same fade as the preview, never a closed box. */
.library-page .resume-full{cursor:pointer;text-decoration:none}
.library-page .resume-full::after{content:'';position:absolute;inset:0;pointer-events:none;border:1px solid color-mix(in srgb,var(--app-ink) 18%,transparent);border-radius:2px;mask-image:linear-gradient(black 0%,black 35%,transparent 82%);-webkit-mask-image:linear-gradient(black 0%,black 35%,transparent 82%)}
.library-page .resume-full:focus-visible{outline:2px solid var(--vilna-accent);outline-offset:5px}
.startup-failed> :not(.startup-error){display:none!important}
.startup-error{min-height:100dvh;width:100%;max-width:none;margin:0;padding:32px 24px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;text-align:center;background:var(--app-paper,var(--paper));color:var(--app-ink,var(--ink));font:15px/1.5 'Google Sans',sans-serif}
.startup-error .startup-mark{width:46px;height:64px;color:var(--vilna-accent);margin-bottom:8px}
.startup-error h1{font:500 23px/1.3 'Google Sans',sans-serif;letter-spacing:0;margin:0}
.startup-error p{margin:0;color:var(--app-quiet,var(--quiet))}
.startup-error button{min-height:44px;min-width:140px;padding:10px 24px;background:var(--app-ink,var(--ink));color:var(--app-paper,var(--paper));border-radius:4px;text-decoration:none;margin-top:8px}
.startup-error a{font-size:13px;color:var(--app-quiet,var(--quiet));padding:8px}
.app-loading{background:var(--app-paper,var(--paper));gap:18px}
.app-loading .loading-mark{width:46px;height:64px;color:var(--vilna-accent)}
.app-loading .loading-label{position:static;clip:auto;clip-path:none;width:auto;height:auto;overflow:visible;white-space:normal;font:14px 'Google Sans',sans-serif;color:var(--app-quiet,var(--quiet))}
