/* Dedicated touch-first shell. Business logic and reader controls remain shared with index.html. */
html.mobile-library { color-scheme: light; }
.mobile-library body { padding-bottom: max(18px, env(safe-area-inset-bottom)); }
.mobile-library .top { position: sticky; top: 0; z-index: 5; min-height: 54px; padding: 8px 12px; gap: 8px; background: #fcfaf5f2; backdrop-filter: blur(12px); }
.mobile-library .top > div { display:flex; align-items:center; gap:8px; }
.mobile-library .top a, .mobile-library .top button { min-height:44px; display:inline-flex; align-items:center; justify-content:center; padding:8px; margin:0; font-size:12px; white-space:nowrap; }
.mobile-library main { padding:14px 14px 24px; }
.mobile-library .reading-nav { position:sticky; top:54px; z-index:4; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:4px; padding:5px; margin:0 -6px 18px; background:#f3efe6; border:1px solid var(--line); border-radius:12px; }
.mobile-library .reading-nav button { min-height:44px; padding:7px 4px; border-radius:8px; font-size:13px; white-space:nowrap; }
.mobile-library .reading-nav button.selected { background:var(--red); color:white; }
.mobile-library .author-index #authors { grid-template-columns:1fr; gap:0; }
.mobile-library .author-index #authors button { min-height:56px; padding:12px 10px; font-size:16px; text-align:left; }
.mobile-library .catalog-head { align-items:center; gap:10px; }
.mobile-library .catalog-head h2 { font-size:23px; }
.mobile-library .search { min-height:48px; gap:10px; padding:10px 12px; }
.mobile-library .search input { min-height:28px; font-size:16px; }
.mobile-library .filters { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; align-items:center; }
.mobile-library .filters button { min-height:44px; padding:7px 5px; font-size:12px; }
.mobile-library #count { grid-column:1/-1; }
.mobile-library .book { padding:18px 0; }
.mobile-library .book h3 { font-size:18px; line-height:1.5; }
.mobile-library .book-links { gap:8px 14px; font-size:13px; }
.mobile-library .book-links button, .mobile-library .book-links a { min-height:44px; display:inline-flex; align-items:center; }
.mobile-library footer { gap:10px 18px; padding-bottom:calc(28px + env(safe-area-inset-bottom)); font-size:12px; }
.mobile-library dialog#reader { position:fixed; inset:0; inset-inline:0; width:100vw!important; min-width:0; max-width:100vw!important; height:100vh; height:100dvh; min-height:100dvh; max-height:100dvh; margin:0; border:0; padding:0 0 env(safe-area-inset-bottom); box-sizing:border-box; overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain; }
.mobile-library .reader-head { position:sticky; top:0; z-index:7; display:flex; min-height:66px; height:auto; padding:8px 12px; align-items:center; background:#fcfaf5f5; backdrop-filter:blur(12px); }
.mobile-library .reader-head h2 { font-size:20px; line-height:1.35; }
.mobile-library #closeReader { width:48px; height:48px; border-radius:50%; background:#f0ebe2; }
.mobile-library .reader-tools { position:sticky; top:66px; z-index:6; display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:8px 10px; background:#fcfaf5f5; backdrop-filter:blur(12px); }
.mobile-library .reader-tools [aria-label="阅读模式"] { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-column:1/-1; gap:4px; }
.mobile-library .reader-tools button { min-height:44px; padding:8px 4px; font-size:12px; }
.mobile-library .reader-tools label { min-height:42px; gap:5px; font-size:12px; }
.mobile-library .reader-tools select { width:100%; min-height:40px; max-width:none; padding:6px; font-size:12px; }
.mobile-library .reader-tools input { width:min(90px,27vw); min-height:32px; }
.mobile-library .language-settings { position:sticky; top:166px; z-index:5; padding:8px 12px; background:#fcfaf5f5; }
.mobile-library .language-settings summary { min-height:44px; display:flex; align-items:center; font-size:14px; }
.mobile-library #languageTools { gap:8px; }
.mobile-library #languageTools select { min-height:44px; font-size:14px; }
.mobile-library .language-checks { gap:6px; }
.mobile-library .language-checks label { min-height:44px; padding:5px 8px; border:1px solid var(--line); border-radius:8px; }
.mobile-library .language-checks input { width:22px; height:22px; }
.mobile-library .reader-personal { position:sticky; top:220px; z-index:4; gap:8px; padding:8px 12px; background:#fcfaf5f5; font-size:13px; }
.mobile-library .reader-personal select { min-height:40px; font-size:14px; }
.mobile-library .reader-meta, .mobile-library .reader-bottom { padding:12px 14px; font-size:12px; }
.mobile-library .sentence-read-hint { padding:0 14px 10px; font-size:12px; }
.mobile-library #paragraphs { padding:0 14px 12px; }
.mobile-library .paragraph { padding:18px 0; }
.mobile-library .paragraph-text { font-size:var(--read-size,18px); line-height:1.85; }
.mobile-library .paragraph-text.focus-layout { max-width:none; gap:10px; }
.mobile-library .focus-layout .primary-language { font-size:max(20px,calc(var(--read-size,18px) * 1.15)); line-height:1.9; }
.mobile-library .focus-layout .comparison-language { padding:10px 0 0 10px; font-size:max(16px,calc(var(--read-size,18px) * .9)); line-height:1.75; }
.mobile-library .paragraph-text.multilingual:not(.focus-layout) { grid-template-columns:repeat(var(--language-count),minmax(78vw,1fr)); gap:12px; margin-right:-14px; padding-right:14px; }
.mobile-library .bookmark-toggle { width:44px!important; min-height:44px!important; right:-8px!important; top:6px!important; }
.mobile-library .load { min-height:48px; font-size:14px; }
.mobile-library #status { right:12px; bottom:max(12px,env(safe-area-inset-bottom)); left:12px; max-width:none; text-align:center; border-radius:10px; }
@media(min-width:751px) { .mobile-library body { max-width:650px; margin:0 auto; box-shadow:0 0 36px #20180f12; } .mobile-library .reading-nav { top:54px; } }
@media(prefers-reduced-motion:reduce) { .mobile-library * { scroll-behavior:auto!important; transition:none!important; } }

/* Keep the layout viewport equal to the phone screen: overflowing catalog
   controls must never trigger the browser's whole-page shrink-to-fit. */
html.mobile-library { width:100%; max-width:100%; overflow-x:hidden; overflow-x:clip; -webkit-text-size-adjust:100%; text-size-adjust:100%; }
.mobile-library body { width:100%; min-width:0; overflow-x:hidden; overflow-x:clip; }
.mobile-library .top { flex-wrap:wrap; }
.mobile-library .top > div { min-width:0; max-width:100%; flex-wrap:wrap; }
.mobile-library .brand { flex-shrink:0; }
.mobile-library main, .mobile-library .catalog, .mobile-library .books,
.mobile-library .book > div, .mobile-library .catalog-head > div,
.mobile-library .reader-head > div, .mobile-library .reader-tools > *,
.mobile-library .reader-personal > * { min-width:0; max-width:100%; }
.mobile-library .book h3, .mobile-library .reader-head h2,
.mobile-library .reader-meta, .mobile-library .reader-bottom { overflow-wrap:anywhere; }
.mobile-library .reader-tools { grid-template-columns:repeat(2,minmax(0,1fr)); }
.mobile-library .reader-tools label { flex-wrap:wrap; }
.mobile-library .reader-tools select { min-width:0; max-width:100%; }
.mobile-library .reader-personal { flex-wrap:wrap; }
.mobile-library dialog#reader { width:100%!important; max-width:100%!important; max-height:100vh; max-height:100dvh; }
.mobile-library:has(#reader[open]), .mobile-library body:has(#reader[open]) { overflow:hidden; }

/* Settings scroll with the document; fixed guessed offsets overlap when controls wrap. */
.mobile-library .reader-tools, .mobile-library .language-settings,
.mobile-library .reader-personal { position:relative; top:auto; }
.mobile-library .reader-head { background:#fcfaf5; }

.mobile-library #mobileReaderSettings { flex-shrink:0; min-height:44px; padding:8px; font:14px system-ui; color:var(--red); border:1px solid var(--line); border-radius:8px; }
.mobile-library .reader-head > div { flex:1; }
.mobile-library #mobileSettingsPanel { position:fixed; inset:var(--mobile-settings-top,80px) 0 0; z-index:20; overflow:auto; overscroll-behavior:contain; background:#fcfaf5; padding:12px 0 max(24px,env(safe-area-inset-bottom)); }
.mobile-library #mobileSettingsPanel[hidden] { display:none; }
.mobile-library #mobileSettingsPanel > h3 { margin:10px 14px; }
.mobile-library #mobileSettingsDone { width:calc(100% - 28px); margin:14px; background:var(--red); color:white; }
