/* ============================================================
   base.css — Reset, document defaults, global texture.
   ============================================================ */
*{box-sizing:border-box;margin:0;padding:0;}
html{-webkit-text-size-adjust:100%;overflow-x:hidden;}
body{
  background:var(--paper);color:var(--ink);
  font-family:var(--display);font-size:clamp(17px,4.5vw,19px);line-height:1.62;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
body.locked{overflow:hidden;}             /* used while an overlay is open */
/* height:auto keeps images at their natural aspect ratio when CSS constrains
   their width — without it, imgs carrying width/height attributes can stretch
   to the height attribute on mobile (the RSVP paper, seal, flowers, etc.). */
img{max-width:100%;height:auto;display:block;}
button{font:inherit;color:inherit;touch-action:manipulation;}

/* subtle film grain over the whole page */
body::after{
  content:"";position:fixed;inset:0;z-index:9998;pointer-events:none;opacity:.04;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

@media(min-width:760px){ body{font-size:20px;} }

@media(max-width:759px), (pointer:coarse){
  /* Fixed noise and repeated backdrop blur are expensive on mobile GPUs. */
  body::after{display:none;}
  .nav,.gate-header,.tap,.holder-cta,.det-top,.det-back{
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
  }
}