* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--body); -webkit-font-smoothing: antialiased; overflow-x: hidden; transition: background .5s ease, color .5s ease; }
body::before { content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 0; opacity: 1; background-image: radial-gradient(var(--grain) 1px, transparent 1px); background-size: 3px 3px; }
img, svg { display: block; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
a { color: inherit; }
::selection { background: var(--yellow); color: #14151a; }
::-webkit-scrollbar { width: 11px; height: 11px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--line-strong); border: 3px solid var(--paper); border-radius: 10px; }
h1, h2, h3, h4 { margin: 0; font-family: var(--display); font-weight: 900; letter-spacing: -.01em; }
p { line-height: 1.6; }
.eyebrow { display: flex; align-items: center; gap: 8px; color: var(--ink-soft); font: 12px var(--mono); letter-spacing: .14em; text-transform: uppercase; }
.regmark { position: relative; width: 22px; height: 22px; flex: none; }
.regmark span { position: absolute; inset: 0; border-radius: 50%; mix-blend-mode: multiply; }
html[data-theme="dark"] .regmark span { mix-blend-mode: screen; }
.regmark .c { background: var(--cyan); transform: translate(-1.5px, -1px); }
.regmark .m { background: var(--magenta); transform: translate(1.5px, 1px); }
.regmark .y { background: var(--yellow); transform: translate(0, 1.8px); }