/* Apple-style refinements: instant press feedback, critically damped motion,
   spatially anchored surfaces, size-aware tracking, and accessibility fallbacks.
   Loaded last so it refines the existing cascade without rewriting it. */
:root{
  /* Critically damped "spring" approximation: fast start, no overshoot. */
  --ease-settle:cubic-bezier(.22,1,.36,1);
  --ease-exit:cubic-bezier(.64,0,.78,0);
  --press-scale:.97;
}

/* 1 · Response — feedback on pointer-down, not on release. */
html{-webkit-tap-highlight-color:transparent}
a,button,[role="tab"],summary{touch-action:manipulation}
.button,.nav-cta,.copy-button,#replay,.use-tabs [role="tab"],.traffic-controls button,
.role-card,.contribute-action,.dialog-close,.menu-toggle,.motion-control,.builder-link,.nav-links a{
  transition-property:transform,background,background-color,border-color,box-shadow,color,opacity;
  transition-duration:.32s;transition-timing-function:var(--ease-settle);
}
.button:active,.nav-cta:active,.copy-button:active,#replay:active,.traffic-controls button:active,
.contribute-action:active,.dialog-close:active,.menu-toggle:active,.motion-control:active,.builder-link:active{
  transform:scale(var(--press-scale));transition-duration:.08s;
}
.use-tabs [role="tab"]:active,.nav-links a:active{transform:scale(.985);transition-duration:.08s}
.role-card:active,.feature-card:active{transform:scale(.99);transition-duration:.08s}
.beta-dock .button:active{transform:scale(var(--press-scale))}

/* 15 · Typography — tracking scales with size instead of fixed px per breakpoint. */
.hero h1{letter-spacing:-.042em;font-optical-sizing:auto;text-wrap:balance}
h2{letter-spacing:-.035em;text-wrap:balance}
h3{letter-spacing:-.012em}
.hero-description,.section-aside,.feature-card p{text-wrap:pretty}

/* 4 · Non-momentum surfaces settle without overshoot. */
.notice{transition:opacity .28s var(--ease-settle),transform .42s var(--ease-settle)}
#toast{transition:opacity .24s var(--ease-settle),transform .4s var(--ease-settle)}

/* 7 · Spatial consistency — dock leaves the way it arrives (down), and materializes. */
.beta-dock{transition:opacity .3s var(--ease-settle),transform .45s var(--ease-settle),filter .3s var(--ease-settle),visibility 0s}
.beta-dock.is-hidden{transform:translate(-50%,calc(100% + 24px)) scale(.98);filter:blur(4px);
  transition:opacity .22s var(--ease-exit),transform .3s var(--ease-exit),filter .22s var(--ease-exit),visibility 0s .3s}

/* 7 · Dialog grows from (and returns to) the button that opened it. */
.sponsor-dialog[open]{animation:none;transform-origin:var(--origin-x,50%) var(--origin-y,50%)}
.sponsor-dialog.is-entering{animation:sheet-in .42s var(--ease-settle) both}
.sponsor-dialog.is-leaving{animation:sheet-out .24s var(--ease-exit) both}
.sponsor-dialog::backdrop{transition:opacity .3s var(--ease-settle)}
.sponsor-dialog.is-leaving::backdrop{opacity:0}
@keyframes sheet-in{from{opacity:0;transform:scale(.92);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
@keyframes sheet-out{from{opacity:1;transform:none;filter:none}to{opacity:0;transform:scale(.94);filter:blur(4px)}}

/* Reveal: shorter and settled rather than drifting. */
.reveal-in{animation-duration:.6s;animation-timing-function:var(--ease-settle)}

/* 14 · Reduced motion: keep feedback, drop movement. */
@media (prefers-reduced-motion:reduce){
  .button:active,.nav-cta:active,.copy-button:active,#replay:active,.traffic-controls button:active,
  .contribute-action:active,.dialog-close:active,.menu-toggle:active,.motion-control:active,.builder-link:active,
  .use-tabs [role="tab"]:active,.nav-links a:active,.role-card:active,.feature-card:active,.beta-dock .button:active{transform:none;opacity:.8}
  .beta-dock.is-hidden{transform:translateX(-50%);filter:none}
  .sponsor-dialog.is-entering{animation:fade-in .2s ease both}
  .sponsor-dialog.is-leaving{animation:fade-out .15s ease both}
}
@keyframes fade-in{from{opacity:0}to{opacity:1}}
@keyframes fade-out{from{opacity:1}to{opacity:0}}

/* 14 · Reduced transparency: frost becomes solid. */
@media (prefers-reduced-transparency:reduce){
  .header,.beta-dock,.notice,.sponsor-dialog,.sponsor-dialog::backdrop{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  .header{background:#111213!important}
  .beta-dock{background:#1b1d19!important}
  .notice{background:#151517!important}
  .sponsor-dialog::backdrop{background:#000d}
}

/* 14 · Increased contrast: defined edges, brighter secondary text. */
@media (prefers-contrast:more){
  .header,.beta-dock,.feature-card,.role-card,.contribute-card,.terminal-card,.sponsor-dialog{border-color:#ffffff66!important}
  .hero-description,.section-aside,.feature-card p,.hero-note,.nav-links a{color:#d6d9dc!important}
}
