@import url("../tokens.css");
/* flow-page component rules; colours + sources live in ../tokens.css (central). */
/* component mapping: relationships by geometry and labels, colour never alone (motion-plan.md:78) */
body { background: var(--bg); color: var(--text); font-family: var(--mono); }
a { color: var(--amber); }
h1, .tag, .tick, .rep, .br, .card > .ch { letter-spacing: .04em; }
.crumbs, .tag, .rep, .br { text-transform: uppercase; letter-spacing: var(--label-track); }
.u.mm { background: transparent; color: var(--text); border: 2px solid var(--amber); }
.u.mm .dim { color: var(--muted); }
.u.bar { border: 3px double var(--amber); }
.free { border-color: var(--amber); }
button:focus-visible, a:focus-visible, [data-id]:focus-visible { outline: 3px solid var(--focus); outline-offset: 4px; }  /* site/index.html:13 */
button { min-height: 44px; }                                                                                     /* site/index.html:20 */
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; } } /* site/index.html:31 */