/* Use the existing theme tokens; these rules also work in automatic dark mode. */
.public-site :is(a, button, input, select, summary):focus-visible { outline: 3px solid var(--accent, #a71d14); outline-offset: 4px; }
.public-site .home-heading--compact { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 18px 0 12px; }
.home-heading--compact h1 { margin: 0; font-size: clamp(1.4rem, 3vw, 2rem); }
.news-preferences { background: var(--paper); border: 1px solid var(--line); border-radius: 14px; margin-bottom: 20px; }
.news-preferences > summary { padding: 14px 16px; cursor: pointer; font-weight: 700; }
.news-preferences > summary span { font-weight: 400; color: var(--muted); margin-left: 8px; }
.news-preferences form { padding: 0 16px 16px; }
.news-preferences .preference-tabs { display: flex; gap: 8px; border-bottom: 1px solid var(--line); padding-bottom: 10px; }
.preference-tabs button { min-height: 44px; padding: 9px 16px; border-radius: 10px; background: var(--paper); color: var(--ink); border: 1px solid var(--line); }
.preference-tabs button[aria-selected="true"] { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.news-preferences [data-preference-panel] { max-height: 48vh; overflow-y: auto; padding: 12px 2px; }
.news-preferences fieldset { border: 0; margin: 0 0 16px; padding: 0; min-width: 0; }
.news-preferences legend { font-weight: 700; padding: 0 0 8px; }
.preference-choices { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 4px 12px; }
.preference-choices label { display: flex; align-items: center; gap: 10px; min-height: 44px; font-size: .93rem; cursor: pointer; }
.preference-choices input { flex: 0 0 auto; width: 18px; height: 18px; accent-color: var(--accent); }
.preference-actions { display: flex; flex-wrap: wrap; gap: 10px; border-top: 1px solid var(--line); padding-top: 14px; }
.preference-actions button { min-height: 44px; }
.preference-actions button[name="reset"] { background: var(--paper); color: var(--ink); border: 1px solid var(--line); }
.home-index { border: 1px solid var(--line); border-radius: 14px; padding: 14px 16px; margin: 24px 0; background: var(--paper); }
.home-index summary { cursor: pointer; font-weight: 700; min-height: 24px; }
.home-index summary span { font-weight: 400; color: var(--muted); margin-left: 8px; }
.home-index nav { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 16px; margin-top: 16px; }
.home-index h3 { font-size: .92rem; margin: 0 0 8px; color: var(--muted); }
.home-index nav a { display: block; padding: 10px 0; }
.home-category { margin: 28px 0; scroll-margin-top: calc(var(--site-header-height, 0px) + 16px); }
.public-site .home-category-grid, .home-skeleton-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.home-category-grid .card { display: grid; grid-template-columns: 112px minmax(0, 1fr); min-height: 180px; margin: 0; padding: 0; overflow: hidden; }
.home-category-grid .card > a { height: 100%; min-height: 144px; margin: 0; }
.home-category-grid .card > a img { width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; }
.home-category-grid .card-body { padding: 12px; display: flex; flex-direction: column; min-width: 0; }
.home-category-grid .card:not(:has(> a)) { grid-template-columns: minmax(0, 1fr); }
.home-category-grid .card h2 { font-size: 1rem; line-height: 1.5; margin: 6px 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.home-category-grid .card p { display: none; }
.home-category-grid .eyebrow { font-size: .72rem; gap: 5px; overflow-wrap: anywhere; }
.home-category-grid .card-meta { margin-top: auto; font-size: .75rem; flex-wrap: wrap; gap: 5px; }
.home-skeleton { display: grid; grid-template-columns: 112px 1fr; gap: 12px; min-height: 180px; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: var(--paper); }
.home-skeleton span:first-child { background: var(--line); }
.home-skeleton span:last-child { margin: 24px 14px 24px 0; background: repeating-linear-gradient(transparent 0 12px, var(--line) 12px 24px, transparent 24px 36px); opacity: .65; }
.home-section-controls, .home-deferred-latest { margin-top: 12px; }
.home-section-controls { min-height: 54px; }
.home-section-controls button, .home-deferred-latest button { padding: 10px 16px; min-height: 44px; border: 1px solid var(--line); color: var(--ink); background: var(--paper); border-radius: 10px; }
[data-section-status] { font-size: .88rem; color: var(--muted); margin: 8px 0; }
.home-full-view { padding: 16px; text-align: center; }
.public-site .category-menu__links { display: block; max-height: 65vh; overflow-y: auto; }
.category-menu__search { display: block; padding: 10px; position: sticky; top: 0; background: var(--paper); z-index: 1; }
.category-menu__search input { width: 100%; min-height: 44px; border: 1px solid var(--line); border-radius: 8px; padding: 8px; color: var(--ink); background: var(--paper); }
.category-menu__group { padding: 8px; }
.category-menu__group h3 { margin: 8px; font-size: .82rem; color: var(--muted); }
.category-menu__group > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.category-menu__group a { overflow-wrap: anywhere; min-height: 44px; }
.reading-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: 12px; padding: 12px; margin: 18px 0; background: var(--paper); }
.reading-controls span { font-size: .88rem; color: var(--muted); }
.reading-controls button { min-width: 44px; min-height: 44px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 8px; color: var(--ink); background: var(--paper); }
.reading-controls button[aria-pressed="true"] { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.article-content, .editorial-body { font-size: var(--reading-size, 1.1rem) !important; line-height: var(--reading-line, 1.9) !important; }
.article-content p, .editorial-body p { font-size: inherit !important; line-height: inherit !important; }
.reading-controls { max-width: 850px; margin-left: auto; margin-right: auto; }
.notification-settings { max-width: 720px; border: 1px solid var(--line); border-radius: 18px; padding: clamp(18px, 4vw, 32px); margin: 28px auto; background: var(--paper); }
.notification-settings > h1 { font-size: clamp(1.5rem, 4vw, 2rem); }
.notification-settings select, .notification-settings input { display: block; min-height: 48px; width: min(100%, 320px); margin: 8px 0 18px; }
.notification-settings [data-notification-status] { padding: 14px; border-radius: 10px; background: var(--surface); color: var(--ink); }
.notification-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.notification-actions button { min-height: 44px; }
.notification-actions [data-notification-stop] { border: 1px solid var(--line); color: var(--ink); background: var(--paper); }
.news-preferences [hidden], .preference-tabs[hidden], .notification-settings [hidden], [data-section-load][hidden], .category-menu [hidden], .reading-controls[hidden] { display: none !important; }
@media (max-width: 800px) {
  .public-site .category-menu__links { max-height: 48dvh; }
  .home-category { scroll-margin-top: 16px; }
  .home-heading--compact { margin-top: 12px; }
  .public-site .hero-copy { padding: 20px; }
  .public-site .hero-copy > p { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .public-site .hero h2 { font-size: 1.45rem; line-height: 1.45; }
  .public-site .home-category-grid, .home-skeleton-grid { grid-template-columns: minmax(0, 1fr); }
  .home-category-grid .card, .home-skeleton { grid-template-columns: 104px minmax(0, 1fr); min-height: 180px; }
  .preference-choices { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .news-preferences > summary span { display: block; margin: 4px 0 0; }
  .site-prompts { max-width: min(340px, calc(100vw - 24px)); }
}
