button, .button, summary, header nav a { min-height:44px; display:inline-flex; align-items:center; }
input, select, textarea { font-size:16px; max-width:100%; }
audio { min-height:44px; }
[hidden] { display:none !important; }
.app-footer { text-align:center; padding:16px 16px 28px; }
.app-footer a { display:inline-flex; align-items:center; min-height:44px; }
@media (display-mode:standalone) { header { padding-top:env(safe-area-inset-top); } }

@media (max-width:700px) {
  body { padding-bottom:78px; }
  header { position:sticky; top:0; z-index:20; padding:10px 14px; gap:10px; box-shadow:0 2px 14px rgba(36,48,43,.06); }
  header .brand { flex:1; font-size:18px; white-space:nowrap; }
  header .brand span { width:30px; height:30px; }
  header > form .link { min-height:40px; }
  header nav { position:fixed; left:0; right:0; bottom:0; z-index:30; order:initial; width:auto; display:flex; gap:0; overflow-x:auto; padding:6px max(8px,env(safe-area-inset-right)) calc(6px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left)); background:#fcfbf8; border-top:1px solid var(--line); box-shadow:0 -4px 18px rgba(36,48,43,.08); }
  header nav a { flex:1 0 auto; justify-content:center; padding:8px 12px; font-size:13px; }
  main { padding:22px 14px 40px; }
  h1 { font-size:clamp(36px,12vw,52px); overflow-wrap:anywhere; }
  .hero { padding:22px 0 32px; }
  .hero .button, .page-head .button { width:100%; justify-content:center; }
  .page-head { gap:14px; }
  .year-nav { margin-left:-14px; margin-right:-14px; padding-left:14px; padding-right:14px; }
  .moment-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .moment-card img, .moment-placeholder { height:135px; }
  .moment-card > div { padding:11px; }
  .moment-card h3 { font-size:17px; line-height:1.15; }
  .moment-card p { font-size:13px; }
  .status-pill { font-size:10px; padding:3px 6px; }
  .video-badge { left:8px; top:8px; }
  .memory-media-primary { margin-bottom:30px; }
  .memory-media-primary .media-grid { gap:8px; }
  .contribution-tools { display:block; }
  .contribution-tool { margin-bottom:10px; }
  .audio-card button, .audio-card .button { width:100%; justify-content:center; margin:4px 0 8px; }
  .form button { width:100%; justify-content:center; }
  .detail { gap:16px; }
  .detail aside h1 { font-size:32px; }
  .discovery-grid { grid-template-columns:1fr; }
}

@media (max-width:380px) {
  .moment-grid { grid-template-columns:1fr; }
  .moment-card img, .moment-placeholder { height:190px; }
}