.skip-link { position:fixed; z-index:200; top:8px; inset-inline-start:8px; transform:translateY(-150%); padding:12px 20px; border-radius:12px; background:var(--surface); color:var(--ink); box-shadow:var(--shadow-md); }
.skip-link:focus { transform:none; }
.noscript-note { padding:30px; text-align:center; }
.header-actions { display:flex; align-items:center; gap:10px; }
.header-actions .icon-button svg { fill:var(--ink); }
.header-actions .icon-button svg.stroke-icon { fill:none; stroke:var(--ink); }
.install-button { font-size:13px; }
.web-footer { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:12px 20px; margin:22px 0 0; padding-top:20px; border-top:1px solid var(--line); font-size:12px; color:var(--ink-soft); }
.web-footer a, .web-footer button { color:var(--ink-soft); background:none; border:0; padding:6px; font:inherit; cursor:pointer; }
.web-footer a:hover, .web-footer button:hover { color:var(--ink); }
.web-dialog { width:min(480px, calc(100% - 32px)); max-height:calc(100dvh - 40px); padding:25px; border:1px solid var(--line); border-radius:26px; color:var(--ink); background:var(--surface); box-shadow:var(--shadow-lg); line-height:1.7; overflow:auto; }
.web-dialog::backdrop { background:rgba(10,29,34,.6); backdrop-filter:blur(5px); }
.web-dialog h2 { font-size:23px; margin:0; }
.web-dialog ol { padding-inline-start:22px; }
.web-dialog li + li { margin-top:8px; }
.dialog-note { font-size:13px; color:var(--ink-soft); }
#share-url { display:block; width:100%; margin:14px 0; padding:13px; border:1px solid var(--line); border-radius:12px; background:var(--paper); color:var(--ink); font-size:14px; }
.update-notice { position:fixed; z-index:90; bottom:calc(24px + env(safe-area-inset-bottom)); inset-inline:16px; width:fit-content; max-width:calc(100% - 32px); margin-inline:auto; display:flex; align-items:center; flex-wrap:wrap; gap:12px; padding:16px; background:var(--surface); border:1px solid var(--line); border-radius:18px; box-shadow:var(--shadow-lg); }
@media (max-width:520px) { .install-button { display:none; } .header-actions { gap:7px; } }
@media (min-width:900px) {
  .app-header { padding-inline:max(32px, calc((100vw - 1160px) / 2)); padding-block:20px; }
  .brand-block h1 { font-size:24px; }
  .brand-subtitle { font-size:12px; }
  .screen.home-screen { width:100%; max-width:1160px; padding:42px 32px 34px; }
  .home-screen.is-active { display:grid; grid-template-columns:minmax(0, .95fr) minmax(0, 1.15fr); column-gap:42px; align-items:start; }
  .hero-card { grid-column:1; grid-row:1 / span 3; min-height:360px; padding:32px 26px; }
  .daily-progress { margin-top:38px; }
  .quick-actions { grid-column:1; grid-row:4; margin-top:24px; }
  .streak-row { grid-column:1; grid-row:5; justify-content:center; margin-block:18px 0; }
  .home-load-error { grid-column:1; grid-row:6; }
  .section-heading { grid-column:2; grid-row:1; margin:0 0 20px; }
  .section-heading h2 { font-size:27px; }
  .study-list { grid-column:2; grid-row:2 / span 5; display:grid; grid-template-columns:1fr; gap:16px; }
  .study-card { min-height:135px; grid-template-columns:64px minmax(0, 1fr) 38px; align-content:center; }
  .study-card-topline { display:flex; align-items:center; justify-content:space-between; gap:8px; }
  .duration { display:inline-block; margin:0; }
  .card-chevron { display:grid; }
  .daily-thought { grid-column:1 / -1; margin-top:32px; justify-content:center; }
  .source-credit, .web-footer { grid-column:1 / -1; }
  .screen.study-screen { width:100%; max-width:880px; padding:0 32px 44px; }
  .study-toolbar { padding-inline:4px; }
  .reader-content { padding:36px 44px; }
  .settings-sheet { bottom:auto; top:50%; transform:translateY(-50%); border-radius:28px; max-height:calc(100dvh - 80px); animation:none; }
  .sheet-handle { display:none; }
}
@media (display-mode:standalone) { .install-button, #install-help { display:none; } }
@media print {
  body, .app-shell { background:white; color:black; }
  .app-header, .study-toolbar, .reader-tools, .focus-reader, .study-actions, .resume-reading, .web-footer, dialog, .settings-sheet, .toast, .update-notice, .skip-link { display:none !important; }
  .screen.study-screen { padding:0; max-width:none; }
  .reader-content { border:0; box-shadow:none; padding:0; max-width:none; font-size:16pt; }
  .text-group h3 { break-after:avoid; }
  .verse-block { break-inside:avoid; }
}