/* Reset and utilities shared by every page. Page-specific rules live in site.css and game.css. */
*{box-sizing:border-box}
html,body{margin:0}
[hidden]{display:none!important}
img{max-width:100%}
a{color:inherit}

body{
  background:var(--void);
  color:var(--ink);
  font-family:var(--f-body);
  -webkit-font-smoothing:antialiased;
}

/* Visually hidden, still read by screen readers */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.label{font-family:var(--f-mark);letter-spacing:.28em;text-transform:uppercase;color:var(--muted)}

/* Shared gold coin glyph */
.mini-coin{width:12px;height:12px;border-radius:50%;background:var(--gold);display:inline-block}

/* Status toast (role="status") */
.toast{position:fixed;left:50%;transform:translate(-50%,20px);opacity:0;background:var(--ink);color:var(--void);font-family:var(--f-mono);font-size:13px;padding:10px 16px;border-radius:2px;transition:opacity .2s var(--ease-out-expo),transform .25s var(--ease-out-expo);pointer-events:none}
.toast.on{opacity:1;transform:translate(-50%,0)}

/* Reduced motion: nothing moves, but gentle fades and colour changes stay as feedback.
   Keyframe animations jump straight to their end state (so things that animate in
   still end up visible); transitions survive only for opacity and colours. */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;animation-iteration-count:1!important;scroll-behavior:auto!important;
    transition-property:opacity,color,background-color,border-color,box-shadow!important}
}