/* Weiss & Co. — flipbook reader */
.reader-mode { background: #0C0C0A; }
.reader { position: fixed; inset: 0; display: flex; flex-direction: column; background: #0C0C0A; color: var(--d-ink); z-index: 200; }

.reader-bar { display: flex; align-items: center; gap: 16px; padding: 0 18px; height: 56px; background: var(--obsidian); border-bottom: 1px solid var(--d-line); }
.rb-back { font-family: var(--mono); font-size: 0.68rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--d-ink-soft); white-space: nowrap; }
.rb-back:hover { color: var(--gold); }
.rb-title { font-family: var(--serif); font-size: 1.15rem; color: var(--ivory); flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rb-title span { font-family: var(--mono); font-size: 0.6rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--d-ink-mute); }
.rb-tools { display: flex; align-items: center; gap: 6px; }
.rb-tools button { width: 34px; height: 34px; border: 1px solid var(--d-line); background: transparent; color: var(--d-ink-soft); border-radius: 3px; font-size: 1rem; line-height: 1; transition: .2s; }
.rb-tools button:hover { border-color: var(--gold); color: var(--gold); }
.rb-zoom, .rb-page { font-family: var(--mono); font-size: 0.68rem; color: var(--d-ink-soft); min-width: 42px; text-align: center; }
.rb-dl { font-family: var(--mono); font-size: 0.62rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--obsidian); background: var(--gold); padding: 0.55em 0.9em; border-radius: 3px; white-space: nowrap; }
.rb-dl:hover { background: var(--gold-soft); }
.rb-cta { font-family: var(--mono); font-size: 0.62rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--obsidian); background: var(--gold); padding: 0.62em 0.95em; border-radius: 3px; white-space: nowrap; }
.rb-cta:hover { background: var(--gold-soft); }
.preview-ribbon { display: flex; justify-content: center; align-items: center; gap: 18px; min-height: 38px; padding: 8px 16px; background: var(--green); border-bottom: 1px solid var(--d-line); color: var(--ivory); font-family: var(--mono); font-size: 0.64rem; letter-spacing: 0.12em; text-transform: uppercase; }
.preview-ribbon a { color: var(--gold-soft); border-bottom: 1px solid rgba(201,174,119,.45); }
.preview-ribbon a:hover { color: var(--gold); border-color: var(--gold); }
@media (max-width: 720px){ .rb-tools button[data-act="zoomout"], .rb-tools button[data-act="zoomin"], .rb-zoom { display: none; } .rb-title { font-size: 1rem; } }

.reader-body { flex: 1; display: flex; overflow: hidden; }
.reader-side { width: 300px; background: var(--graphite); border-right: 1px solid var(--d-line); display: flex; flex-direction: column; }
.reader-side[hidden] { display: none; }
.side-head { display: flex; justify-content: space-between; align-items: center; padding: 16px 18px; border-bottom: 1px solid var(--d-line); font-family: var(--mono); font-size: 0.66rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold); }
.side-head button { background: none; border: 0; color: var(--d-ink-mute); font-size: 1rem; }
.side-search { padding: 12px 14px; border-bottom: 1px solid var(--d-line); }
.side-search input { width: 100%; background: var(--obsidian); border: 1px solid var(--d-line); border-radius: 3px; color: var(--ivory); padding: 8px 10px; }
.side-list { overflow-y: auto; padding: 8px; }
.side-item { padding: 10px 12px; border-radius: 4px; cursor: pointer; font-size: 0.85rem; color: var(--d-ink-soft); border-bottom: 1px solid var(--d-line-soft); }
.side-item:hover { background: var(--charcoal); color: var(--ivory); }
.side-item .pg { font-family: var(--mono); font-size: 0.6rem; color: var(--gold); }
.side-thumb { display: flex; gap: 10px; align-items: center; }
.side-thumb canvas { width: 54px; height: auto; border: 1px solid var(--d-line); background:#fff; }

.reader-stage { flex: 1; position: relative; overflow: auto; display: flex; align-items: flex-start; justify-content: center; padding: 30px; }
.reader-pages canvas { display: block; box-shadow: 0 30px 80px -20px rgba(0,0,0,0.8); background: #fff; max-width: 100%; transition: opacity .35s var(--ease); }
.reader-pages.turning canvas { opacity: 0; }
.reader-loading { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); font-family: var(--mono); font-size: 0.7rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--d-ink-mute); }
.reader-watermark { position: fixed; bottom: 76px; right: 26px; font-family: var(--mono); font-size: 0.6rem; letter-spacing: 0.12em; color: rgba(185,154,91,0.45); pointer-events: none; user-select: none; transform: rotate(-90deg); transform-origin: right bottom; }
.reader-preview .reader-watermark { color: rgba(185,154,91,0.58); }