/* A word in the masthead becomes Luke's original roaming CHAOS creature. */
#stuff-trigger { display:inline-block; min-height:44px; margin:0; padding:0; border:0; border-radius:0; background:none; color:inherit; font:inherit; letter-spacing:inherit; text-transform:inherit; vertical-align:baseline; }
#stuff-trigger:disabled { cursor:default; }
#stuff-trigger:not(:disabled):hover { text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:6px; }
#stuff-trigger:focus-visible { outline:2px solid var(--board-accent,var(--amber)); outline-offset:4px; }
#stuff-word { display:inline-block; min-width:3.4em; text-align:left; }
.stuff-possessive { display:inline-block; transform-origin:bottom left; }
.stuff-awake #stuff-word { opacity:0; }
.stuff-awake .stuff-possessive { transform:translateY(.2em) rotate(80deg) scale(.5); opacity:0; }
#stuff-canvas { position:fixed; inset:0; z-index:1; pointer-events:none; }
@media(prefers-reduced-motion:no-preference) {
  .stuff-possessive { transition:transform .2s,opacity .2s; }
}
html[data-board-style="letterboard"] h1 { font-size:20px; letter-spacing:-.025em; text-transform:none; color:var(--amber); }
html:is([data-board-style="swiss"],[data-board-style="bauhaus"]) {
  .masthead { flex-wrap:wrap; }
  .brand-wrap { min-width:0; }
  @media(max-width:480px) {
    h1 { font-size:32px; }
    .quick-links { flex-basis:100%; justify-content:flex-end; }
  }
}