:root { --paper:#f2f1ed; --surface:#e7e6e1; --ink:#181916; --muted:#6b6c66; --line:rgba(24,25,22,.16); --signal:#c72f24; --radius:3px; --page-x:clamp(76px,18vw,288px); --section-y:clamp(90px,8vw,120px); font-family:'Satoshi',Arial,sans-serif; color:var(--ink); background:var(--paper); color-scheme:light; }
:root[data-theme="dark"] { --paper:#11120f; --surface:#1a1b18; --ink:#efeee8; --muted:#92948d; --line:rgba(239,238,232,.15); --signal:#e14b3e; color-scheme:dark; }
* { box-sizing:border-box; }
html { overflow-y:scroll; scrollbar-gutter:stable; scroll-behavior:smooth; background:var(--paper); scrollbar-color:var(--muted) var(--paper); scrollbar-width:thin; }
html.is-project-open { overflow:hidden; scrollbar-gutter:auto; }
html.is-loading,body.is-loading { overscroll-behavior:none; }
html.is-loading { scrollbar-color:transparent transparent; }
html.is-loading::-webkit-scrollbar-thumb,html.is-loading::-webkit-scrollbar-track { background:transparent; }
body { margin:0; overflow-x:hidden; background:var(--paper); color:var(--ink); transition:background .45s cubic-bezier(.16,1,.3,1),color .45s cubic-bezier(.16,1,.3,1); }
*::-webkit-scrollbar { width:10px; height:10px; }
*::-webkit-scrollbar-track { background:var(--paper); }
*::-webkit-scrollbar-thumb { border:3px solid var(--paper); border-radius:10px; background:var(--muted); }
a { color:inherit; text-decoration:none; }
img { display:block; width:100%; height:100%; object-fit:cover; }
button { color:inherit; font:inherit; }
:focus-visible { outline:2px solid var(--signal); outline-offset:4px; }
.loader { position:fixed; z-index:100; inset:0; display:grid; grid-template-columns:minmax(0,1fr) 3ch; grid-template-rows:1fr auto; column-gap:16px; padding:32px max(22px,calc((100vw - 850px) / 2)); background:var(--paper); color:var(--ink); }
.loader-name { align-self:center; grid-column:1/-1; grid-row:1; display:flex; flex-direction:column; align-items:flex-start; gap:clamp(10px,1.5vw,22px); font-size:clamp(52px,11vw,160px); line-height:.82; letter-spacing:-.075em; font-weight:500; }.loader-name span:last-child { align-self:flex-end; }
.loader-line { align-self:end; grid-column:1; grid-row:2; height:1px; margin-right:30px; background:var(--line); overflow:hidden; }.loader-line i { display:block; width:100%; height:100%; background:var(--ink); transform:scaleX(0); transform-origin:left; }
.loader-count { align-self:end; grid-column:2; grid-row:2; min-width:3ch; text-align:right; font:11px 'Geist Mono',monospace; font-variant-numeric:tabular-nums; }
.site-header { position:absolute; z-index:10; top:0; left:50%; width:min(100%,850px); min-height:82px; display:grid; grid-template-columns:auto 1fr auto; align-items:center; padding:24px 0; transform:translateX(-50%); font-size:12px; }
.mark { grid-column:1; grid-row:1; justify-self:start; font:600 13px 'Geist Mono',monospace; letter-spacing:-.06em; transition:color .25s, transform .25s; }.mark:hover { color:var(--signal); transform:translateY(-1px); }.site-header p { margin:0 0 0 clamp(50px,12vw,220px); color:var(--muted); line-height:1.25; }.site-header nav { grid-column:3; grid-row:1; justify-self:end; display:flex; align-items:flex-start; gap:24px; }.site-header nav a { border-bottom:1px solid transparent; }.site-header nav a:hover { border-color:currentColor; }.theme-toggle { display:flex; gap:7px; align-items:center; padding:0; border:0; background:transparent; color:inherit; font:500 10px 'Geist Mono',monospace; text-transform:uppercase; cursor:pointer; }.theme-toggle i { position:relative; display:block; width:16px; height:16px; border:1px solid currentColor; border-radius:50%; overflow:hidden; }.theme-toggle i:after { content:""; position:absolute; inset:2px; border-radius:50%; background:currentColor; transform:translateX(-8px); transition:transform .4s cubic-bezier(.16,1,.3,1); }.theme-toggle:hover i:after { transform:translateX(-5px); }:root[data-theme="dark"] .theme-toggle i:after { transform:translateX(8px); }:root[data-theme="dark"] .theme-toggle:hover i:after { transform:translateX(5px); }
.section-rail { position:fixed; z-index:15; top:50%; right:21px; display:flex; flex-direction:column; gap:8px; transform:translateY(-50%); }
.section-rail a { position:relative; display:flex; justify-content:flex-end; align-items:center; min-width:30px; min-height:17px; }.section-rail i { display:block; width:16px; height:2px; background:var(--ink); opacity:.24; transition:width .25s,opacity .25s; }.section-rail span { position:absolute; right:37px; width:max-content; padding:5px 7px; border:1px solid var(--line); border-radius:var(--radius); background:var(--paper); font:500 10px 'Geist Mono',monospace; opacity:0; transform:translateX(5px); pointer-events:none; transition:.2s; }.section-rail a:hover i,.section-rail a.active i { width:30px; opacity:1; }.section-rail a:hover span,.section-rail a:focus-visible span { opacity:1; transform:none; }
.hero { width:min(100%,850px); min-height:auto; margin-inline:auto; padding:98px 0 64px; }
.hero-art { height:clamp(230px,34vh,400px); margin:0; overflow:hidden; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); }.hero-art img { object-position:60% center; image-rendering:pixelated; transition:filter .6s cubic-bezier(.16,1,.3,1); filter:saturate(.72) brightness(1.08); }
.identity-panel { display:block; padding:48px 8px 0; }.identity-copy>span,.identity-meta { font:500 10px 'Geist Mono',monospace; text-transform:uppercase; color:var(--muted); }.identity-copy h1 { margin:10px 0 0; font-size:clamp(48px,7vw,96px); line-height:.88; letter-spacing:-.075em; font-weight:500; }.identity-meta { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-top:14px; }.identity-availability { display:inline-flex; align-items:center; gap:8px; }.identity-availability i { display:block; width:7px; height:7px; border-radius:50%; background:#63c174; box-shadow:0 0 0 3px rgba(99,193,116,.14); animation:identity-blink 2.4s ease-in-out infinite; }
@keyframes identity-blink { 0%,100% { opacity:1; transform:scale(1); } 50% { opacity:.42; transform:scale(.8); } }
.about { max-width:1400px; margin:auto; display:grid; grid-template-columns:minmax(160px,.45fr) 1.55fr; gap:50px; align-items:start; padding:var(--section-y) var(--page-x); border-top:1px solid var(--line); }.about h2 { margin:7px 0 0; font:400 22px/1 'Newsreader',Georgia,serif; letter-spacing:-.02em; color:var(--ink); }.about>p { max-width:720px; margin:0; font-size:clamp(21px,2.5vw,36px); line-height:1.18; letter-spacing:-.035em; }
.experience { max-width:1400px; margin:auto; padding:var(--section-y) var(--page-x); }.experience-grid { display:grid; grid-template-columns:1fr 1fr; border-top:1px solid var(--line); border-left:1px solid var(--line); }.experience-grid article,.experience-grid .resume-link { min-height:290px; display:flex; flex-direction:column; justify-content:space-between; padding:28px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }.experience-grid article>div { display:flex; justify-content:space-between; gap:20px; }.experience-grid article span,.experience-grid time,.resume-link>span { color:var(--muted); font:500 10px 'Geist Mono',monospace; text-transform:uppercase; }.experience-grid h3 { margin:auto 0 12px; font-size:clamp(30px,4vw,55px); letter-spacing:-.05em; font-weight:500; }.experience-grid article p { max-width:420px; margin:0; color:var(--muted); line-height:1.5; }.experience-grid .resume-link { grid-column:auto; min-height:290px; }
.crop-1 img { width:400%; max-width:none; transform:translateX(0); }.crop-2 img { width:400%; max-width:none; transform:translateX(-25%); }.crop-3 img { width:400%; max-width:none; transform:translateX(-50%); }.crop-4 img { width:400%; max-width:none; transform:translateX(-75%); }
.work { max-width:1400px; margin:auto; padding:var(--section-y) var(--page-x); }.section-heading { display:flex; flex-direction:column; gap:16px; margin-bottom:46px; }.section-heading h2 { margin:0; color:var(--ink); font:400 22px/1 'Newsreader',Georgia,serif; letter-spacing:-.025em; }.section-heading p { max-width:520px; margin:0; color:var(--muted); line-height:1.5; }
.project-list { border-top:1px solid var(--line); }.project { position:relative; display:grid; grid-template-columns:1.5fr 1fr auto auto; align-items:center; min-height:130px; border-bottom:1px solid var(--line); transition:color .25s, background .3s, padding .3s; }.project:hover,.project:focus-visible { padding-inline:10px; background:var(--surface); }.project-title { display:flex; flex-direction:column; align-items:flex-start; gap:8px; min-width:0; }.project-name { font-size:clamp(34px,5vw,70px); letter-spacing:-.055em; }.project-role,.project-year { font:10px 'Geist Mono',monospace; text-transform:uppercase; letter-spacing:.05em; }.project-role { color:var(--muted); }.project-detail { color:var(--ink); font:500 11px 'Geist Mono',monospace; letter-spacing:0; }.project-open { margin-left:20px; color:var(--muted); font:400 18px/1 'Geist Mono',monospace; opacity:.55; transform:translate(-4px,4px); transition:color .25s, opacity .25s, transform .3s; }.project:hover .project-open,.project:focus-visible .project-open { color:var(--signal); opacity:1; transform:none; }.project-preview { position:absolute; z-index:2; right:10%; display:block; width:clamp(300px,30vw,420px); height:auto; aspect-ratio:auto; overflow:visible; padding:0; border:0; border-radius:0; background:transparent; opacity:0; transform:scale(.86) rotate(-2deg); pointer-events:none; transition:.4s cubic-bezier(.16,1,.3,1); }.project-preview img { position:relative; z-index:1; display:block; width:100%; max-width:100%; height:auto; object-fit:contain; transform:none; }.project:hover .project-preview,.project:focus-visible .project-preview { opacity:1; transform:scale(1) rotate(1.5deg); }
.project-preview--vodcoach { width:clamp(260px,25vw,360px); }
.resume-link { background:var(--signal); color:#f8f5ee; }.resume-link>span { color:#f4c5bf; }.resume-link strong { align-self:flex-end; font-size:clamp(28px,4vw,55px); font-weight:500; letter-spacing:-.045em; transition:transform .25s; }.resume-link:hover strong { transform:translate(6px,-3px); }
.contact { width:min(100%,850px); min-height:72vh; display:flex; flex-direction:column; justify-content:space-between; margin-inline:auto; padding:var(--section-y) 0 35px; }.contact p { color:var(--muted); }.contact-link { display:inline-block; width:max-content; max-width:100%; margin-top:20px; font-size:clamp(42px,6vw,96px); line-height:.92; letter-spacing:-.065em; border-bottom:3px solid currentColor; }.footer-meta { display:grid; grid-template-columns:repeat(3,1fr); font:10px 'Geist Mono',monospace; text-transform:uppercase; }.footer-meta span:last-child { text-align:right; }.footer-meta a { display:inline-block; transition:color .25s, transform .25s; }.footer-meta a:hover,.footer-meta a:focus-visible { color:var(--signal); transform:translateY(-2px); }
@media (max-width:767px) { .loader{padding:22px}.loader-name{display:flex}.loader-name span{display:block}.site-header{position:relative;left:0;width:100%;height:auto;padding:22px 18px;transform:none;grid-template-columns:1fr auto}.site-header p{display:none}.site-header nav{gap:14px}.site-header nav>a{display:none}.theme-toggle span{display:none}.section-rail{display:none}.section-rail span{display:none}.hero{width:100%;min-height:auto;padding:14px 14px 60px}.hero-art{height:32vh;min-height:220px}.identity-panel{grid-template-columns:1fr;padding:24px 8px 0}.identity-copy h1{font-size:52px}.identity-meta{display:flex;gap:16px;align-items:center}.about{grid-template-columns:1fr;gap:24px;padding:82px 24px}.about>p{font-size:23px;line-height:1.2}.experience{padding:90px 24px}.experience-grid{grid-template-columns:1fr}.experience-grid article,.experience-grid .resume-link{min-height:230px}.work{padding:90px 24px}.section-heading{margin-bottom:36px}.section-heading h2{font-size:20px}.project{grid-template-columns:1fr auto auto;min-height:105px}.project-role,.project-preview{display:none}.project-open{margin-left:12px}.offscreen{min-height:50vh;padding:90px 24px}.offscreen-line{display:grid;gap:14px;white-space:normal}.offscreen-line i{display:none}.contact{width:100%;min-height:72vh;padding:90px 24px 25px}.contact-link{font-size:clamp(28px,9vw,52px)}.footer-meta{grid-template-columns:1fr 1fr;gap:16px}.footer-meta span:nth-child(even){text-align:right}.footer-meta span:last-child{grid-column:1/-1;text-align:left} }
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto}.loader{display:none}.project-preview,.resume-link strong,.section-rail i,.section-rail span,.footer-meta a{transition:none!important} }
::view-transition-old(root),::view-transition-new(root) { animation:none; mix-blend-mode:normal; }
:root[data-theme="dark"]::view-transition-old(root) { z-index:1; }:root[data-theme="dark"]::view-transition-new(root) { z-index:2; }
body * { font-family:'Satoshi',Arial,sans-serif !important; }
.identity-copy h1,.about>p,.contact-link,.about h2,.section-heading h2 { font-family:'Newsreader',Georgia,serif !important; font-weight:400; }

.ledger-intro { display:grid; grid-template-columns:minmax(190px,.48fr) minmax(0,1.52fr); gap:50px; padding-bottom:26px; }
.ledger-intro > span { color:var(--muted); font:500 10px 'Geist Mono',monospace; letter-spacing:.05em; text-transform:uppercase; }
.ledger-intro p { max-width:310px; margin:0; color:var(--muted); line-height:1.5; }
.ledger-list { border-top:0; }
.ledger-row { display:grid; grid-template-columns:minmax(115px,.48fr) minmax(220px,1fr); gap:25px; align-items:start; padding:24px 0; border-bottom:1px solid var(--line); }
.ledger-row--head { padding:12px 0; color:var(--muted); font:500 10px 'Geist Mono',monospace; letter-spacing:.035em; text-transform:uppercase; }
.ledger-row time,.ledger-row > div > span { color:var(--muted); font:500 10px 'Geist Mono',monospace; letter-spacing:.035em; text-transform:uppercase; }
.ledger-row h3 { margin:0 0 7px; font-size:clamp(18px,2.2vw,28px); font-weight:500; letter-spacing:-.04em; }
.ledger-resume-wrap { display:flex; align-items:center; flex-wrap:wrap; gap:18px; margin-top:27px; }
.ledger-resume { display:inline-flex; align-items:center; gap:14px; padding-bottom:5px; border-bottom:1px solid currentColor; font-size:14px; transition:color .25s, gap .25s; }
.ledger-resume span { color:var(--signal); }
.ledger-resume-updated { color:var(--muted); font:500 9px 'Geist Mono',monospace; letter-spacing:.035em; text-transform:uppercase; }
.ledger-resume:hover { color:var(--signal); gap:20px; }
@media (max-width:767px) {
  .ledger-intro { grid-template-columns:1fr; gap:14px; }
  .ledger-row--head { display:none; }
  .ledger-row { grid-template-columns:1fr; gap:10px; padding:22px 0 24px; }
}

/* Project detail view */
body.is-project-open { overflow:hidden; }
.project { cursor:pointer; transition:color .25s, background .35s, padding .35s; }
.project:focus-visible { outline-offset:-4px; }
.project-page { position:fixed; z-index:30; inset:0; overflow-y:auto; padding:26px var(--page-x) 80px; background:var(--paper); color:var(--ink); opacity:0; visibility:hidden; transform:translateY(24px); transition:opacity .42s cubic-bezier(.16,1,.3,1), transform .52s cubic-bezier(.16,1,.3,1), visibility 0s linear .52s; }
.project-page { scrollbar-color:var(--muted) var(--paper); scrollbar-width:thin; }
.project-page::-webkit-scrollbar { width:10px; height:10px; }
.project-page::-webkit-scrollbar-track { background:var(--paper); }
.project-page::-webkit-scrollbar-thumb { border:3px solid var(--paper); border-radius:10px; background:var(--muted); }
.project-page.is-visible { opacity:1; visibility:visible; transform:none; transition-delay:0s; }
.project-page:focus { outline:none; }
.project-page.is-swapping .project-page-copy > *, .project-page.is-swapping .project-media-window, .project-page.is-swapping .project-page-lower > * { opacity:0!important; transform:translateY(10px)!important; transition:opacity .18s ease, transform .18s ease; transition-delay:0s!important; }
.project-page.is-swapping-in .project-page-copy > *, .project-page.is-swapping-in .project-media-window, .project-page.is-swapping-in .project-page-lower > * { opacity:0!important; transform:translateY(10px)!important; transition:none!important; }
.project-page-header { display:flex; justify-content:space-between; align-items:center; max-width: 850px; margin:0 auto; color:var(--muted); font:500 10px 'Geist Mono',monospace; letter-spacing:.05em; text-transform:uppercase; }.project-page-nav { display:flex; align-items:center; gap:26px; }.project-next { transition:color .25s, transform .25s; }.project-next:hover { color:var(--signal); transform:translateX(4px); }
.project-back { transition:color .25s, transform .25s; }
.project-back:hover { color:var(--signal); transform:translateX(-4px); }
.project-page-intro { max-width: 850px; margin:clamp(75px,13vh,150px) auto 0; display:grid; grid-template-columns:minmax(260px,.75fr) minmax(340px,1.25fr); gap:clamp(50px,8vw,130px); align-items:center; }
.project-page--no-media .project-page-intro { grid-template-columns:minmax(0,1fr); max-width:850px; }
.project-page--has-media .project-page-intro { grid-template-columns:minmax(0,1fr); gap:clamp(26px,3.5vw,42px); align-items:start; }
.project-page--has-media .project-page-copy { max-width:850px; }
.project-page-copy > *, .project-media-window, .project-page-lower > * { opacity:0; transform:translateY(18px); transition:opacity .56s cubic-bezier(.16,1,.3,1), transform .56s cubic-bezier(.16,1,.3,1); transition-delay:0s; }
.project-page.is-visible .project-page-copy > *, .project-page.is-visible .project-media-window, .project-page.is-visible .project-page-lower > * { opacity:1; transform:none; transition-delay:.14s; }
.project-page.is-visible .project-page-copy > *:nth-child(2) { transition-delay:.18s; }
.project-page.is-visible .project-page-copy > *:nth-child(3) { transition-delay:.24s; }
.project-page.is-visible .project-page-copy > *:nth-child(4) { transition-delay:.3s; }
.project-page.is-visible .project-media-window { transition-delay:.24s; }
.project-page-kicker,.project-page-label { margin:0 0 18px; color:var(--muted); font:500 10px 'Geist Mono',monospace; letter-spacing:.05em; text-transform:uppercase; }
.project-page-copy h1 { margin:0; font:400 clamp(72px,11vw,160px)/.82 'Newsreader',Georgia,serif; letter-spacing:-.085em; }
.project-page-summary { max-width:440px; margin:28px 0 0; color:var(--muted); font-size:clamp(16px,1.6vw,21px); line-height:1.45; }
.project-page-meta { display:grid; grid-template-columns:auto; gap:25px; margin:56px 0 0; }
.project-page-meta div { display:flex; flex-direction:column; gap:7px; }
.project-page-meta dt { color:var(--muted); font:500 9px 'Geist Mono',monospace; letter-spacing:.05em; text-transform:uppercase; }
.project-page-meta dd { margin:0; font-size:13px; }
.project-media-window { min-height:clamp(320px,45vw,560px); padding:12px; border:1px solid var(--line); background:var(--surface); box-shadow:0 18px 40px rgba(94,74,48,.08); }
.project-media-window--video { min-height:0; }
.project-video { display:block; width:100%; height:auto; aspect-ratio:1624/1080; border:1px solid var(--line); background:var(--paper); }
.mockup-toolbar { display:flex; align-items:center; gap:5px; height:26px; color:var(--muted); font:500 9px 'Geist Mono',monospace; letter-spacing:.05em; text-transform:uppercase; }
.mockup-toolbar i { width:7px; height:7px; border:1px solid var(--line); border-radius:50%; }
.mockup-toolbar span { margin-left:auto; }
.mockup-placeholder { position:relative; display:flex; flex-direction:column; justify-content:center; align-items:center; min-height:clamp(290px,40vw,510px); overflow:hidden; border:1px solid var(--line); background:var(--paper); text-align:center; }
.mockup-placeholder:before,.mockup-placeholder:after { content:""; position:absolute; width:72%; height:1px; background:var(--line); opacity:.7; }
.mockup-placeholder:before { top:34%; box-shadow:0 48px 0 var(--line), 0 96px 0 var(--line); }
.mockup-placeholder:after { width:22%; height:22%; top:29%; left:14%; border:1px solid var(--line); background:var(--surface); box-shadow:calc(100% + 180px) 0 0 -1px var(--surface); }
.mockup-placeholder span,.mockup-placeholder small { position:relative; z-index:1; }
.mockup-placeholder span { font:400 clamp(24px,3vw,42px)/1 'Newsreader',Georgia,serif; letter-spacing:-.045em; }
.mockup-placeholder small { margin-top:13px; color:var(--muted); font:500 9px 'Geist Mono',monospace; letter-spacing:.05em; text-transform:uppercase; }
.video-placeholder { position:relative; display:flex; flex-direction:column; justify-content:center; align-items:center; aspect-ratio:16/9; overflow:hidden; border:1px solid var(--line); background:var(--paper); text-align:center; }
.video-placeholder:before { content:""; position:absolute; width:52%; height:1px; top:30%; background:var(--line); box-shadow:0 56px 0 var(--line); }
.video-placeholder-play { position:relative; z-index:1; display:grid; place-items:center; width:42px; height:42px; padding-left:3px; border:1px solid var(--line); border-radius:50%; color:var(--signal); font-size:11px; }
.video-placeholder > span:not(.video-placeholder-play) { position:relative; z-index:1; margin-top:18px; font:400 clamp(24px,3vw,42px)/1 'Newsreader',Georgia,serif; letter-spacing:-.045em; }
.video-placeholder small { position:relative; z-index:1; margin-top:10px; color:var(--muted); font:500 9px 'Geist Mono',monospace; letter-spacing:.05em; text-transform:uppercase; }
.project-page-lower { max-width: 850px; display:flex; flex-direction:column; margin:clamp(80px,13vh,150px) auto 0; padding-top:26px; border-top:1px solid var(--line); }
.project-page.is-visible .project-page-lower > *:first-child { transition-delay:.34s; }
.project-page.is-visible .project-page-lower > *:last-child { transition-delay:.4s; }
.project-page-description { padding-bottom:clamp(55px,8vw,100px); }
.project-page-description > p:last-child { max-width:760px; margin:0; font:400 clamp(21px,2.5vw,36px)/1.16 'Newsreader',Georgia,serif; letter-spacing:-.03em; text-wrap:pretty; }
.project-page-meta-row { display:grid; grid-template-columns:1fr 1fr; gap:0; padding-top:26px; border-top:1px solid var(--line); }
.project-page-year { display:flex; flex-direction:column; align-items:flex-start; gap:18px; }
.project-page-year span,.project-page-links .project-page-label { margin:0; color:var(--muted); font:500 9px 'Geist Mono',monospace; letter-spacing:.05em; text-transform:uppercase; }
.project-page-year strong { font-size:13px; font-weight:400; }
.project-page-links { display:flex; flex-direction:column; align-items:flex-start; gap:18px; }
.project-page-link-list { display:flex; flex-wrap:wrap; gap:20px 28px; }
.project-page-links a { padding-bottom:4px; border-bottom:1px solid currentColor; font-size:14px; transition:color .25s, transform .25s; }
.project-page-links a:hover { color:var(--signal); transform:translateX(5px); }
@media (max-width:767px) {
  .project-page { padding:20px 24px 60px; }
  .project-page-nav { gap:14px; }
  .project-page-intro { grid-template-columns:1fr; gap:52px; margin-top:80px; }
  .project-page-copy h1 { font-size:76px; }
  .project-page-summary { margin-top:22px; }
  .project-page-meta { gap:18px; margin-top:40px; }
  .project-page-meta dd { max-width:105px; line-height:1.35; }
  .project-media-window { min-height:320px; }
  .project-media-window--video { min-height:0; }
  .mockup-placeholder { min-height:290px; }
  .mockup-placeholder:after { box-shadow:calc(100% + 80px) 0 0 -1px var(--surface); }
  .project-page-lower { margin-top:80px; }
  .project-page-meta-row { grid-template-columns:1fr 1fr; gap:0; }
  .project-page-links { gap:14px; }
}
@media (prefers-reduced-motion:reduce) {
  .project-page,.project-page-copy > *, .project-media-window, .project-page-lower > * { transition:none!important; }
}

/* Inline soundtrack utility */
.music-player { display:flex; align-items:center; gap:24px; width:100%; margin:12px 0 0; color:var(--ink); }
.music-player-main { display:flex; flex:1 1 auto; align-items:center; gap:8px; min-width:0; }
.music-player-play { padding:0; border:0; background:transparent; color:var(--muted); cursor:pointer; font:500 13px/1 'Geist Mono',monospace; transition:color .25s, transform .25s; }
.music-player-play:hover { color:var(--ink); transform:translateY(-1px); }
.music-player-title { flex:0 1 clamp(110px,12vw,170px); min-width:0; overflow:hidden; font-size:12px; letter-spacing:-.015em; text-overflow:ellipsis; white-space:nowrap; }
.music-player-time { flex:0 0 auto; color:var(--muted); font:500 8px 'Geist Mono',monospace; letter-spacing:.05em; white-space:nowrap; }
.music-player-progress { flex:1 1 clamp(80px,14vw,170px); min-width:70px; appearance:none; width:auto; height:7px; margin:0; border:0; border-radius:99px; background:linear-gradient(to right,var(--muted) 0 var(--progress,0%),var(--line) var(--progress,0%) 100%); cursor:pointer; }
.music-player-progress:disabled { cursor:default; opacity:.55; }
.music-player-progress::-webkit-slider-runnable-track { height:2px; border-radius:99px; background:transparent; }
.music-player-progress::-webkit-slider-thumb { appearance:none; width:7px; height:7px; margin-top:-2.5px; border:1px solid var(--ink); border-radius:50%; background:var(--paper); }
.music-player-progress::-moz-range-track { height:2px; border-radius:99px; background:transparent; }
.music-player-progress::-moz-range-progress { height:2px; border-radius:99px; background:var(--muted); }
.music-player-progress::-moz-range-thumb { width:7px; height:7px; border:1px solid var(--ink); border-radius:50%; background:var(--paper); }
.music-player-volume { display:flex; flex:0 0 auto; align-items:center; gap:7px; color:var(--muted); font:500 8px 'Geist Mono',monospace; letter-spacing:.05em; text-transform:uppercase; }
.music-player-volume input { appearance:none; width:52px; height:10px; margin:0; background:transparent; cursor:pointer; }
.music-player-volume input::-webkit-slider-runnable-track { height:2px; border-radius:99px; background:linear-gradient(to right,var(--muted) 0 var(--volume,25%),var(--line) var(--volume,25%) 100%); }
.music-player-volume input::-webkit-slider-thumb { appearance:none; width:6px; height:6px; margin-top:-2px; border:1px solid var(--muted); border-radius:50%; background:var(--paper); }
.music-player-volume input::-moz-range-track { height:2px; border-radius:99px; background:var(--line); }
.music-player-volume input::-moz-range-thumb { width:6px; height:6px; border:1px solid var(--muted); border-radius:50%; background:var(--paper); }
.music-player-note { flex:0 1 220px; min-width:0; margin-left:auto; color:var(--muted); font-size:10px; line-height:1.2; text-align:right; }
@media (max-width:767px) {
  .site-header { grid-template-columns:1fr auto; row-gap:14px; }
  .site-header nav { grid-column:2; grid-row:1; }
  .music-player { flex-wrap:wrap; gap:10px 14px; margin-top:10px; }
  .music-player-main { flex:1 1 100%; gap:8px; }
  .music-player-progress { flex-basis:clamp(48px,18vw,120px); }
  .music-player-title { min-width:0; }
  .music-player-note { margin-left:auto; }
  .identity-panel { padding-top:36px; }
}
@media (prefers-reduced-motion:reduce) {
  .music-player-play { transition:none!important; }
}

@media (max-width:767px) {
  .about,.experience,.work { padding-block:var(--section-y); }
  .contact { padding-top:var(--section-y); }
  .about h2 { font-size:20px; }
}