:root { color-scheme: light dark; --bg:#f4f4f1; --surface:#fff; --text:#20221f; --muted:#666963; --line:#d9dad4; --accent:#445a4f; --hover:#e8ece6; --hover-line:#aebdaf; }
:root[data-theme="dark"] { --bg:#171917; --surface:#20231f; --text:#e9ebe5; --muted:#a4a89f; --line:#3a3e38; --accent:#acc3b1; --hover:#2b332c; --hover-line:#708473; }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--text); font:16px/1.55 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; transition:background .2s,color .2s; }
.page-shell, footer { width:min(100% - 40px, 960px); margin:auto; }
.site-header { display:flex; justify-content:space-between; align-items:center; padding:28px 0 64px; }
.wordmark { color:inherit; font-weight:800; font-size:1.1rem; text-decoration:none; letter-spacing:-.08em; }.wordmark span { color:var(--accent); }
button { font:inherit; }.theme-toggle { border:1px solid var(--line); background:transparent; color:var(--text); padding:6px 10px; cursor:pointer; border-radius:3px; font-size:.84rem; }.theme-toggle span:first-child{font-size:1rem;margin-right:5px}
.hero { border-bottom:1px solid var(--line); padding:0 0 78px; }.eyebrow, h2, .pipeline { color:var(--muted); text-transform:uppercase; letter-spacing:.09em; font-size:.72rem; font-weight:700; }.hero h1 { font-size:clamp(2.6rem,7vw,5rem); letter-spacing:-.065em; line-height:.95; margin:10px 0 22px; }.focus { margin:0; color:var(--muted); }.focus span { color:var(--accent); padding:0 6px; }
.section { padding:52px 0; border-bottom:1px solid var(--line); }.section h2 { margin:0 0 20px; }.about p { font-size:1.28rem; max-width:650px; margin:0; letter-spacing:-.02em; }.section-heading { display:flex; justify-content:space-between; gap:20px; align-items:baseline; }.section-heading span { color:var(--muted); font-size:.85rem; }
.projects { display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--line); }.project { min-height:260px; padding:20px; border-right:1px solid var(--line); display:flex; flex-direction:column; justify-content:space-between; cursor:default; transition:background-color .18s,box-shadow .18s; }.project:hover { background:var(--hover); box-shadow:inset 0 0 0 1px var(--hover-line); }.project:last-child { border:0; }.project h3 { margin:0 0 10px; font-size:1.1rem; letter-spacing:-.02em; }.project p { margin:0; font-size:.91rem; color:var(--muted); }.project .pipeline { line-height:1.7; margin-top:24px; }.pipeline b{color:var(--accent);font-weight:500}
.technologies ul { list-style:none; padding:0; margin:0; display:flex; flex-wrap:wrap; }.technologies li { padding:10px 16px; border:1px solid var(--line); margin:0 -1px -1px 0; font-size:.9rem; cursor:default; transition:background-color .18s,border-color .18s; }.technologies li:hover { position:relative; background:var(--hover); border-color:var(--hover-line); }.link-list { display:grid; max-width:480px; }.muted-link { display:flex; justify-content:space-between; padding:12px 0; border-bottom:1px solid var(--line); color:var(--muted); }.muted-link span { font-size:.8rem; }.game-link { display:inline-block; color:var(--text); text-decoration:none; margin-top:35px; font-weight:600; }.game-link span { color:var(--accent); font-size:1.3em; padding-left:5px; } footer { padding:28px 0 40px; color:var(--muted); font-size:.8rem; } footer span { margin:0 4px; }
button:focus-visible,a:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
@media (max-width:700px) { .site-header{padding-bottom:48px}.projects{grid-template-columns:1fr}.project{min-height:0;border-right:0;border-bottom:1px solid var(--line)}.project:last-child{border-bottom:0}.section-heading{display:block}.section-heading span{display:block;margin:-10px 0 18px}.hero{padding-bottom:60px} }
@media (prefers-reduced-motion:reduce) { .project,.technologies li { transition:none; } }