:root { --bg: #111111; --bg-elev: #1a1a1a; --text: #e8eaed; --muted: #9aa0a8; --line: #272727; --accent: #4c8dff; --radius: 12px; }
*, *::before, *::after { box-sizing: border-box; }
html { color-scheme: dark; }
body { margin: 0; min-height: 100vh; font-size: 17px; line-height: 1.5; font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; background: var(--bg); color: var(--text); -webkit-font-smoothing: antialiased; }
img { max-width: 100%; display: block; }
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
h1 { margin: 0; font-weight: 700; letter-spacing: -0.02em; }
.back { position: fixed; top: 1rem; left: 1.1rem; z-index: 2; color: var(--muted); font-size: 0.85rem; font-weight: 600; padding: 0.35rem 0.7rem; border-radius: 999px; background: rgba(26, 26, 26, 0.7); backdrop-filter: blur(6px); }
.back::before { content: "\2190  "; }
.back:hover { text-decoration: none; color: var(--text); }
.profile { max-width: 920px; min-height: 100vh; margin: 0 auto; padding: 4.5rem 1.5rem 2.5rem; display: grid; grid-template-columns: 1fr; gap: 2.5rem; align-content: safe center; }
.ident { display: flex; flex-direction: column; align-items: center; text-align: center; }
.profile h1 { font-size: 1.7rem; margin: 1rem 0 0; }
.devavatar { width: 120px; height: 120px; object-fit: cover; border-radius: 50%; border: 2px solid var(--line); box-shadow: 0 8px 28px rgba(0, 0, 0, 0.55); }
.bio { color: var(--muted); margin: 0.55rem 0 0; max-width: 44ch; font-size: 0.95rem; }
.links { width: 100%; display: flex; flex-direction: column; gap: 0.5rem; }
@media (min-width: 720px) { .profile { grid-template-columns: 300px 1fr; align-items: center; gap: 3.5rem; } }
.button { --brand: var(--accent); position: relative; display: flex; align-items: center; gap: 0.85rem; width: 100%; min-height: 54px; padding: 0 1.15rem; border-radius: var(--radius); font-size: 0.98rem; font-weight: 600; color: var(--text); background: var(--bg-elev); border: 1px solid var(--line); overflow: hidden; transition: transform 0.14s ease, border-color 0.14s ease; }
.button::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--brand); }
.button::after { content: ""; position: absolute; inset: 0; background: var(--brand); opacity: 0; transition: opacity 0.14s ease; }
.button:hover { transform: translateX(4px); text-decoration: none; border-color: var(--brand); }
.button:hover::after { opacity: 0.12; }
.button .icon { width: 24px; height: 24px; object-fit: contain; flex: none; margin-left: 0.4rem; }
.button span { position: relative; z-index: 1; }
.foot { position: fixed; bottom: 0.75rem; left: 50%; transform: translateX(-50%); z-index: 2; }
.foot a { color: var(--muted); font-size: 0.8rem; }
.landing { max-width: 1100px; margin: 0 auto; padding: 3rem 1.5rem 2.5rem; display: flex; flex-direction: column; align-items: center; }
.masthead { text-align: center; display: flex; flex-direction: column; align-items: center; }
.logo { width: 72px; height: 72px; object-fit: contain; image-rendering: pixelated; }
.masthead h1 { font-size: 2rem; margin: 0.75rem 0 0; }
.lede { color: var(--muted); margin: 0.6rem 0 0; max-width: 50ch; text-align: center; font-size: 0.95rem; }
.devgrid { list-style: none; margin: 2.25rem 0 0; padding: 0; width: 100%; display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 0.5rem; }
.devlink { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; padding: 1rem 0.5rem; border-radius: var(--radius); color: var(--text); border: 1px solid transparent; transition: border-color 0.12s ease, background 0.12s ease, transform 0.12s ease; }
.devlink:hover { text-decoration: none; background: var(--bg-elev); border-color: var(--line); transform: translateY(-2px); }
.devthumb { width: 56px; height: 56px; object-fit: cover; border-radius: 50%; border: 2px solid var(--line); }
.devlink span { font-size: 0.82rem; font-weight: 600; text-align: center; line-height: 1.25; }
.button-default { --brand: #0085ff; }
.button-patreon { --brand: #ff424d; }
.button-discord { --brand: #5865f2; }
.button-twit { --brand: #000000; }
.button-itchio { --brand: #fa5c5c; }
.button-f95zone { --brand: #b23b3b; }
.button-subscribestar { --brand: #ff4081; }
.button-web { --brand: #cfd3da; }
.button-instagram { --brand: #e1306c; }
.button-steam { --brand: #66c0f4; }
.button-reddit { --brand: #ff4500; }
.button-deviantart { --brand: #05cc47; }
.button-coffee { --brand: #ffdd00; }
.button-yt { --brand: #ff0000; }
.button-slushe { --brand: #c2058d; }
.button-mastodon { --brand: #6364ff; }
.button-artstation { --brand: #13aff0; }
.button-twitch { --brand: #9146ff; }
.button-onlyfans { --brand: #00aeef; }
.button-loverslab { --brand: #5a9bd4; }
.button-ko-fi { --brand: #13c3ff; }
.button-gitlab { --brand: #8c6fff; }
.button-github { --brand: #cfd3da; }
.button-Spicygaming { --brand: #c084fc; }
.button-Lewdpixels { --brand: #c44ec3; }