﻿:root { color-scheme: light; font-family: Tahoma, Arial, sans-serif; color: #203443; background: #e8edf0; }
* { box-sizing: border-box; }
html, body { height: 100%; margin: 0; overflow: hidden; }
button, input, select, a { font: inherit; }
button, select, .reader-actions a { min-height: 44px; border: 1px solid #ccd7de; border-radius: 6px; background: #fff; color: #203443; padding: 7px 10px; }
button, select { cursor: pointer; }
button:hover:not(:disabled), .reader-actions a:hover { background: #edf5f7; }
button:disabled, select:disabled { opacity: .45; cursor: default; }
button:focus-visible, input:focus-visible, select:focus-visible, a:focus-visible, #viewer-container:focus-visible { outline: 3px solid #b55b25; outline-offset: -3px; }
[hidden] { display: none !important; }
.reader { height: 100%; display: flex; flex-direction: column; }
.toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; padding: 8px 12px; background: #f8fafb; border-bottom: 1px solid #ccd7de; }
.page-controls, .zoom-controls, .reader-actions { display: flex; align-items: center; gap: 6px; }
.page-controls { font-size: 14px; white-space: nowrap; }
.page-controls button, .zoom-controls button { width: 44px; font-size: 22px; }
#page-number { width: 62px; height: 44px; border: 1px solid #ccd7de; border-radius: 6px; padding: 4px; text-align: center; font-size: 16px; appearance: textfield; }
#page-number::-webkit-inner-spin-button { appearance: none; }
#zoom { max-width: 145px; font-size: 14px; }
.reader-actions { font-size: 14px; }
.reader-actions a { display: inline-flex; align-items: center; text-decoration: none; color: #196b84; }
.reader-status { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 5px 12px; min-height: 28px; background: #fff; font-size: 12px; line-height: 1.6; }
.reader-status button { min-height: 28px; padding: 2px 8px; font-size: 12px; }
.reader.is-error .reader-status { background: #fff3f0; color: #923820; padding: 12px; font-size: 14px; }
.viewer-shell { flex: 1; min-height: 0; position: relative; }
#viewer-container { position: absolute; inset: 0; overflow: auto; overscroll-behavior: contain; direction: ltr; touch-action: pan-x pan-y; }
.pdfViewer { min-height: 100%; }
.pdfViewer .page { border-image: none; border-color: transparent; margin: 8px auto; }
.search-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 8px 12px; background: #fff; border-bottom: 1px solid #ccd7de; font-size: 14px; }
#search-query { flex: 1; min-width: 100px; height: 44px; border: 1px solid #ccd7de; border-radius: 6px; padding: 8px; font-size: 16px; }
#search-status { width: 100%; color: #52616c; font-size: 12px; }
.no-script { margin: 8px; }
@media (max-width: 600px) {
  .toolbar { gap: 6px; padding: 6px; justify-content: center; }
  .page-controls { flex: 1 0 100%; justify-content: center; }
  .zoom-controls { justify-content: center; }
  .reader-actions { flex: 1 0 100%; justify-content: center; }
  .reader-actions a, .reader-actions button { flex: 1; text-align: center; justify-content: center; }
  .reader-status { padding: 4px 8px; }
  .search-bar { padding: 6px; }
  .search-bar label { width: 100%; }
}

#fullscreen { display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
.fullscreen-icon { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.fullscreen-exit, .is-fullscreen .fullscreen-enter { display: none; }
.is-fullscreen .fullscreen-exit { display: inline; }
.reader-status a { color: #196b84; }

.reader-status:has(#status:empty):not(:has(button:not([hidden]), a:not([hidden]))) { display: none; }
