:root{--ink:#111;--paper:#f2f0e9;--gutter:clamp(22px,3.2vw,60px)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px;background:var(--ink)}body{margin:0;background:var(--ink);color:var(--paper);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}a:focus-visible,button:focus-visible{outline:2px solid currentColor;outline-offset:7px}::selection{background:var(--paper);color:var(--ink)}.micro{font-size:10px;font-weight:700;line-height:1.4}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:-100px;left:20px;z-index:100;padding:14px;background:var(--paper);color:var(--ink)}.skip-link:focus{top:95px}
.site-header{position:fixed;z-index:40;inset:0 0 auto;height:88px;padding:0 var(--gutter);display:flex;justify-content:flex-end;align-items:center;background:linear-gradient(180deg,rgba(8,8,8,.65),transparent)}.site-header a{min-height:44px;display:flex;align-items:center;font-size:10px;font-weight:700}.site-header a:hover{text-decoration:underline;text-underline-offset:5px}.moving-logo{position:fixed;z-index:50;left:0;top:0;display:block;width:min(65vw,64svh,650px);transform:translate(calc(50vw - 50%),calc(50svh - 55.6%));transform-origin:0 0;will-change:transform}.moving-logo img{display:block;width:100%;height:auto;filter:invert(1)}
.hero{height:280svh;position:relative}.hero-scene{height:100svh;min-height:620px;position:sticky;top:0;overflow:hidden;background:#15181c}.hero-video,.hero-shade{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.hero-shade{background:linear-gradient(180deg,rgba(0,0,0,.25),transparent 45%,rgba(0,0,0,.45))}.hero-foot{position:absolute;bottom:0;left:var(--gutter);right:var(--gutter);display:flex;justify-content:space-between;align-items:center;gap:20px;padding:19px 0}.hero-foot a,.hero-foot button{min-height:44px;display:flex;align-items:center}.hero-foot button{background:none;border:0;padding:0;font-weight:700;font-size:10px;white-space:nowrap}.hero-foot a:hover,.hero-foot button:hover{text-decoration:underline;text-underline-offset:5px}
.quote{min-height:100svh;padding:150px var(--gutter) 0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;position:relative}.quote h2{font-size:clamp(42px,7.8vw,126px);font-weight:500;line-height:1.02;letter-spacing:-.065em;margin:0 0 55px}.quote em{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-.07em}.socials-cta{display:flex;align-items:center;justify-content:space-between;gap:75px;min-height:52px;padding:12px 0;border-bottom:1px solid #f2f0e970;font-size:11px;font-weight:700}.socials-cta span{font-size:24px}.socials-cta:hover{border-color:var(--paper)}.quote footer{width:100%;font-size:9px;letter-spacing:.04em;margin-top:auto;padding:55px 0 25px;color:#a7a7a1}
.socials-page{min-height:100svh;background:radial-gradient(ellipse at 50% 10%,#292925 0,#111 65%)}.back-link{position:absolute;top:25px;left:var(--gutter);font-size:10px;font-weight:700;min-height:44px;display:flex;align-items:center}.back-link:hover{text-decoration:underline}.linktree{width:min(100% - 44px,470px);margin:0 auto;padding:80px 0 55px;text-align:center}.profile-logo{display:block;filter:invert(1);width:145px;height:145px;margin:0 auto 20px}.linktree h1{font-size:24px;letter-spacing:-.05em;margin:0 0 8px}.profile-caption{font-size:9px;letter-spacing:.12em;color:#aaa;margin:0 0 42px}.social-links{display:flex;flex-direction:column;gap:13px;text-align:left}.social-card{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 24px;border:1px solid #ffffff40;background:#ffffff04;font-size:16px;font-weight:700;border-radius:3px}.social-card small{display:block;font-size:10px;font-weight:400;color:#aaa}.social-card a{display:flex}.social-card span small{margin-top:6px}.social-card>a{width:100%}.social-card[href]:hover{background:var(--paper);color:var(--ink);border-color:var(--paper)}.social-card[href]:hover small{color:#555}.unavailable{color:#b7b7b1;border-color:#ffffff20}
@media(hover:hover) and (pointer:fine){html,body,body *{cursor:url('pen-cursor.svg') 3 30,auto}a,a *,button,button *{cursor:url('pen-cursor.svg') 3 30,pointer}}
@media(max-width:720px){.site-header{height:76px}.hero-scene{min-height:600px}.site-header a,.hero-foot button,.hero-foot a{font-size:9px}.quote{padding-top:130px;min-height:90svh}.quote h2{font-size:clamp(37px,8.6vw,62px);margin-bottom:40px}.quote footer{padding-top:65px}.socials-cta{font-size:10px}.linktree{padding-top:85px}.profile-logo{width:120px;height:120px}.social-card{padding:19px 20px}.social-card small{font-size:9px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.moving-logo{will-change:auto}}
.quote{scroll-margin-top:-90px}
.quote{background:linear-gradient(180deg,rgba(10,8,17,.5),rgba(10,8,17,.56) 55%,rgba(10,8,17,.8)),url('media/worlds.webp') center 55%/cover no-repeat}
.quote h2{text-shadow:0 2px 24px rgba(0,0,0,.6)}
.quote .socials-cta{background:rgba(10,8,17,.24);padding:12px 16px;border-color:#f2f0e9b0}
.quote footer{color:var(--paper)}
@media(max-width:720px){.quote{background-position:center,55% center}}
.social-card{border-radius:22px;min-height:80px;padding:20px 24px}
.social-identity{display:flex;align-items:center;gap:19px;min-width:0}
.app-logo{display:block;width:34px;height:34px;flex-shrink:0}
.social-handle{font-size:12px;font-weight:500;letter-spacing:-.015em;overflow-wrap:anywhere}
@media(max-width:400px){.social-card{padding:18px;border-radius:20px;gap:12px}.social-identity{gap:13px}.app-logo{width:30px;height:30px}.social-handle{font-size:11px}.email-handle{font-size:10px}}
.outline-logo,.link-arrow{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round}
.outline-logo{stroke-width:1.8}
.link-arrow{display:block;width:18px;height:18px;flex:0 0 18px;stroke-width:1.7}
.back-link{gap:8px}
.back-link .link-arrow{width:14px;height:14px;flex-basis:14px}
.social-card .social-handle{font-size:14px;font-weight:600;letter-spacing:0}
@media(max-width:400px){.social-card .social-handle{font-size:13px}}
/* Center names within each whole card, with icons and arrows at the edges. */
.social-card{position:relative}
.social-card .social-handle{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);max-width:calc(100% - 140px);text-align:center}
.header-socials{gap:5px}
.header-socials .link-arrow{width:14px;height:14px;flex-basis:14px}
.socials-cta .link-arrow{width:22px;height:22px;flex-basis:22px}
/* Original film-noir city: sky, sweeping light, then an opaque skyline. */
.socials-page{position:relative;isolation:isolate;background:#111315}
.noir-city{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:#16191b}
.city-sky{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 80%,#596064 0%,#2c3236 43%,#111519 90%)}
.city-haze{position:absolute;inset:-15%;background:radial-gradient(ellipse at 30% 55%,#bfc4c625 0,transparent 45%),radial-gradient(ellipse at 80% 30%,#a1a8aa1c,transparent 50%);animation:noir-haze 36s ease-in-out infinite alternate;will-change:transform}
.city-searchlights{position:absolute;inset:0;width:100%;height:100%;opacity:.75;overflow:visible}
.searchlight{position:absolute;display:block;max-width:none;object-fit:fill;transform-box:border-box;backface-visibility:hidden;will-change:transform}
.searchlight-one{left:-9.1666667%;top:-20.2%;width:43.3333333%;height:116.4%;transform-origin:50% 97.2508591%;animation:sweep-one 16s ease-in-out infinite alternate}
.searchlight-two{left:59.5833333%;top:-25.2%;width:49.5833333%;height:118.4%;transform-origin:50.7002801% 97.2972973%;animation:sweep-two 21s ease-in-out -9s infinite alternate}
.searchlight-three{left:33.8888889%;top:-20.2%;width:36.3888889%;height:121.4%;transform-origin:50% 97.3640857%;opacity:.5;animation:sweep-three 27s ease-in-out -6s infinite alternate}
.city-skyline{position:absolute;bottom:-1px;left:50%;width:max(100%,1400px);max-width:none;height:auto;transform:translateX(-50%);opacity:.95}
.city-vignette{position:absolute;inset:0;background:linear-gradient(180deg,#08090b35,transparent 35%,#08090b55),radial-gradient(ellipse at center,#08090b35 15%,#08090b99 100%)}
.socials-page .linktree{position:relative;z-index:1}
.socials-page .social-card{background:rgba(14,16,19,.74);border-color:#ffffff45;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 6px 25px #0002}
.socials-page .social-card[href]:hover{background:var(--paper);color:var(--ink)}
.socials-page .profile-caption{color:#d4d5d3;text-shadow:0 1px 8px #000}
.socials-page .profile-logo{filter:invert(1) drop-shadow(0 2px 12px #0008)}
.socials-page .back-link{z-index:3;text-shadow:0 1px 10px #000}
.city-motion-toggle{position:absolute;z-index:3;right:var(--gutter);top:25px;display:flex;align-items:center;gap:7px;min-height:44px;padding:0;background:none;border:0;font-size:10px;font-weight:700;text-shadow:0 1px 10px #000}
.city-motion-symbol{font-family:Arial,sans-serif;font-size:13px}
.city-paused .searchlight,.city-paused .city-haze{animation-play-state:paused}
body:not(.city-ready) .searchlight,body:not(.city-ready) .city-haze{animation-play-state:paused}
@keyframes sweep-one{from{transform:translate3d(0,0,0) scaleX(var(--beam-aspect,1)) rotate(-31deg) scaleX(var(--beam-inverse,1))}to{transform:translate3d(0,0,0) scaleX(var(--beam-aspect,1)) rotate(35deg) scaleX(var(--beam-inverse,1))}}
@keyframes sweep-two{from{transform:translate3d(0,0,0) scaleX(var(--beam-aspect,1)) rotate(34deg) scaleX(var(--beam-inverse,1))}to{transform:translate3d(0,0,0) scaleX(var(--beam-aspect,1)) rotate(-35deg) scaleX(var(--beam-inverse,1))}}
@keyframes sweep-three{from{transform:translate3d(0,0,0) scaleX(var(--beam-aspect,1)) rotate(-22deg) scaleX(var(--beam-inverse,1))}to{transform:translate3d(0,0,0) scaleX(var(--beam-aspect,1)) rotate(23deg) scaleX(var(--beam-inverse,1))}}
@keyframes noir-haze{from{transform:translate(-3%,1%) scale(1)}to{transform:translate(4%,-3%) scale(1.08)}}
@media(max-width:720px){.city-skyline{width:1100px;transform:translateX(-42%)}.city-searchlights{opacity:.62}.city-motion-toggle{font-size:9px}}
.city-motion-symbol{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
