/* Mobile/iPhone polish (safe-area, readability, tap targets) */
:root{
  --safe-top: env(safe-area-inset-top);
  --safe-right: env(safe-area-inset-right);
  --safe-bottom: env(safe-area-inset-bottom);
  --safe-left: env(safe-area-inset-left);
}
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%; }
body{
  padding-left: max(0px, var(--safe-left));
  padding-right: max(0px, var(--safe-right));
  padding-top: max(0px, var(--safe-top));
  padding-bottom: max(0px, var(--safe-bottom));
  color: var(--text, #eaf0ff);
  background: var(--bg, #0b0f14);
}
img, video, svg{ max-width:100%; height:auto; }
a, button{ -webkit-tap-highlight-color: rgba(255,255,255,0.12); }
a{ color: var(--link, #8fc4ff); }
.nav a, header a, .site-nav a{ padding: 10px 10px; }
@media (max-width: 430px){
  body{ font-size:16px; line-height:1.6; }
  h1{ font-size: clamp(26px, 7vw, 34px); }
  h2{ font-size: clamp(20px, 5.5vw, 26px); }
  .card, .panel, .section-card{ border-radius: 16px; }
  .container, main{ padding-left: 16px; padding-right: 16px; }
}


/* iPhone header/nav safe-area handling */
@media (max-width: 430px){
  header, .site-header, .topbar{
  padding-top: max(10px, var(--safe-top));
  }
}