/* ── tokens ─────────────────────────────────────────── */
:root{
  --paper:#ffffff; --ink:#0a0a0a;
  --spray-orange:#ff4d16; --spray-teal:#62d8c5; --tag-pink:#ff4fa3;
  --smog-grey:#ebebeb; --titlebar:#fff3b9;
}
*{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px}
body{background:var(--paper);color:var(--ink);font-family:"IBM Plex Mono",monospace;font-weight:300;min-height:100vh}
::selection{background:var(--spray-orange);color:#fff}
img{-webkit-user-drag:none;user-select:none}

/* ── fixed nav ──────────────────────────────────────── */
.nav{position:fixed;top:0;left:0;width:100%;z-index:900;display:flex;justify-content:space-between;align-items:center;padding:10px 14px;mix-blend-mode:normal}
.nav a{color:var(--ink);text-decoration:none;font-size:clamp(18px,2.6vw,28px);letter-spacing:-1px}
.nav .links a{margin-left:26px}
.nav a:hover{font-family:"Kings",cursive;color:var(--tag-pink);letter-spacing:0;font-size:clamp(20px,2.9vw,31px)}

/* ── footer marquee + copyright ─────────────────────── */
.marquee{position:fixed;bottom:18px;left:0;width:100%;overflow:hidden;background:transparent;white-space:nowrap;padding:3px 0;z-index:800}
.marquee span{display:inline-block;font-family:"Anton",sans-serif;font-size:24px;text-transform:uppercase;color:#fff;animation:scroll-left 60s linear infinite}
@keyframes scroll-left{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.copyright{position:fixed;bottom:2px;left:0;width:100%;text-align:center;font-size:10px;letter-spacing:1px;color:#999;z-index:800}

/* ── contact pills ──────────────────────────────────── */
.pillcol{position:fixed;bottom:64px;right:10px;display:flex;flex-direction:column;gap:8px;align-items:flex-end;z-index:850}
.pill{background:var(--spray-teal);color:var(--ink);border:none;border-radius:50px;padding:16px 18px;font-family:"IBM Plex Mono",monospace;font-size:14px;font-weight:500;text-transform:uppercase;cursor:pointer;text-decoration:none;transition:all .2s ease}
.pill:hover{background:var(--ink);color:var(--spray-teal);transform:scale(1.08)}

/* ── retro browser window ───────────────────────────── */
.window{position:absolute;background:#fff;border:1px solid var(--ink);border-radius:1px;box-shadow:0 8px 20px rgba(0,0,0,.18);overflow:hidden;color:var(--ink);text-decoration:none}
.window .titlebar{background:var(--titlebar);font-size:11px;font-weight:700;padding:5px 8px;border-bottom:1px solid #aaa}
.window img{width:100%;display:block}