/* I define reusable color values here as custom properties (CSS variables). Anywhere else in this file I can write var(--bg) instead of retyping #050506 — and if I ever want to retheme the whole site, I only change the value once, here, instead of hunting through every rule that uses it */ :root { --bg: #050506; --text: #EDEAE3; --dim: #6B7280; --accent: #214b53; --panel: #0c0d10; --border: rgba(255, 255, 255, 0.08); --accent-2: #214b53; } /* I apply box-sizing:border-box to every single element on the page (the * selector matches everything). This is the box-model behavior where width/height include padding and border instead of adding on top of them — without this, a lot of my clamp()-based spacing later on would make elements grow past the size I actually set */ * { box-sizing: border-box; } /* I turn on smooth scrolling site-wide — when a link jumps to an anchor on the same page, the browser animates the scroll instead of snapping instantly */ html { scroll-behavior: smooth; } /* I zero out the default margin browsers put on and , and make sure body can grow to fill the full page height */ html, body { margin: 0; min-height: 100%; } /* my base styles for the whole page */ body { /* these pull straight from the variables above, instead of hardcoding the colors again */ background: var(--bg); color: var(--text); /* my font stack: the browser tries IBM Plex Sans first (loaded from Google Fonts in my ); system-ui falls back to whatever clean default font the visitor's OS provides if that fails to load; sans-serif is the final generic fallback every browser understands */ font-family: 'IBM Plex Sans', system-ui, sans-serif; /* a browser-specific hint (the -webkit- prefix means it's only recognized by Chrome/Safari/Edge) that smooths text edges a bit more, closer to how the design actually looks */ -webkit-font-smoothing: antialiased; /* I reserve empty space at the very bottom of the page so my fixed tech-stack ticker (which floats on top of everything, position:fixed) never covers the real content underneath it */ padding-bottom: 6.5rem; } /* browsers give