/* Shared mobile quality baseline. Keep this after each page's own stylesheet. */
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 88px; }
:where(button, a, summary, input, select, textarea) { touch-action: manipulation; }
:where(input:not([type="radio"]):not([type="checkbox"]), select, textarea) { font-size: max(16px, 1em); }
:where(button, summary) { min-height: 44px; }
:where(button) { min-width: 44px; }
:where(h1,h2,h3,p,a,summary,label) { overflow-wrap: break-word; }
.site-header > .brand { min-height: 44px; flex-shrink: 0; }
.site-header > nav a { min-height: 44px; display: flex; align-items: center; }
.hfn-notes summary, .hfn-journey summary { min-height: 48px; padding-block: 8px; }
.hfn-notes header nav a, .hfn-reading header nav a, .hfn-journey .site-bar nav a {
  display: inline-flex; align-items: center; min-height: 44px; padding-block: 8px;
}
.hfn-reading .contents a { display: flex; align-items: center; min-height: 44px; }
.hfn-notes .card > a, .hfn-notes .links a { display: inline-flex; align-items: center; min-height: 44px; }
.hfn-journey aside a { min-height: 44px; padding-block: 8px; }
/* The tablet menu must not hide destinations in a horizontally scrolling bar. */
@media (max-width: 1100px) {
  .site-header { padding: max(10px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) 10px max(16px, env(safe-area-inset-left)); gap: 12px; }
  .site-header .nav-toggle { display: grid; min-width: 44px; min-height: 44px; }
  .site-header > nav {
    position: absolute; top: calc(100% + 8px); left: 16px; right: 16px;
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px; padding: 10px; max-width: none; min-height: 0;
    max-height: calc(100svh - 92px); overflow-y: auto; overflow-x: hidden;
    overscroll-behavior: contain; font-size: 14px; background: #122c46;
    opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-6px);
  }
  .site-header.is-nav-open > nav { opacity: 1; visibility: visible; pointer-events: auto; transform: none; }
  .site-header > nav a { justify-content: center; padding: 8px; border-radius: 6px; background: #1c425d; line-height: 1.3; text-align: center; }
  .site-header .brand { white-space: nowrap; }
  .hfn-home .hero-copy { max-width: 60ch; }
  .hfn-reading header { flex-wrap: wrap; }
  .hfn-reading header nav { flex-wrap: wrap; gap: 8px 20px; }
}
@media (max-width: 700px) {
  .hfn-notes header nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; gap: 8px; }
  .hfn-notes header nav a { justify-content: center; padding: 10px 12px; border-radius: 6px; background: #173b60; }
  .hfn-notes .hero { padding-top: 32px; }
  .hfn-notes .card, .hfn-notes details { padding: 22px; }
  .hfn-notes .grid { gap: 20px; }
  .hfn-home .hero-inner { display: flex; flex-direction: column; }
  .hfn-home .hero-visual { order: 5; height: 220px; margin-top: 24px; }
  .hfn-home .hero-status { grid-template-columns: 1fr; }
  .hfn-home .hero-status a { min-height: 64px; }
  .hfn-home .hero-links { gap: 12px; }
  .hfn-reading header { flex-direction: column; align-items: flex-start; gap: 8px; }
  .hfn-reading header nav { gap: 8px 24px; font-size: 16px; }
  .hfn-reading .essay { padding: 24px 20px; }
  .hfn-reading .essay h2 { font-size: clamp(1.75rem, 7vw, 2.3rem); }
  .hfn-journey .site-bar nav { flex-wrap: wrap; gap: 8px 20px; font-size: 14px; }
  .hfn-journey .game-slot iframe { height: min(620px, 75svh); max-height: none; }
  .discussion-sort { flex-wrap: wrap; }
  .discussion-sort button, .admin-auth-panel button { min-height: 44px; }
  .pilot-brief-output-head { flex-wrap: wrap; gap: 12px; }
}
@media (max-width: 380px) {
  .hfn-notes h1 { font-size: 2.25rem; }
  .hfn-notes :is(header,main,footer) { padding-inline: 18px; }
  .hfn-notes :is(.card,details) { padding: 18px; }
  .hfn-home .hero .human-title { font-size: 3.25rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .site-header > nav { transition: none; }
}
/* Narrow labels such as “Play” still need a complete touch target. */
.site-header > nav a,
.hfn-notes header nav a,
.hfn-reading header nav a,
.hfn-journey .site-bar nav a { min-width: 44px; }
.discussion-form-footer button { min-height: 44px; }
body :is(.discussion-form, .admin-auth-panel, .pilot-brief-form, .stack-form) :is(input:not([type="radio"]):not([type="checkbox"]),select,textarea) { font-size: 16px; }
.admin-shell :is(button,input:not([type="radio"]):not([type="checkbox"])),
.admin-auth-panel input { min-height: 44px; }
.admin-shell :is(input,select,textarea) { font-size: 16px; }
.hfn-home button, .hfn-tool button { min-height: 44px; min-width: 44px; }