/* Measured from the ArtCraft homepage at 1316 CSS pixels. */
html.dark{--faint:rgba(242,241,238,.42);--ink-strong:#fff}
header nav a,.nav-end a,.section-bar,.card-bar,.project-footer,.role-index,.role-detail>.mono,.status,.hero-links,.hero-coordinate,.hero-floor,.motion-toggle,.entry-meta,.empty-categories,.journal-heading>.mono,.back-link,.reading-end{font-family:var(--mono);font-size:11px;font-weight:500;line-height:1.5;letter-spacing:.15em}
header nav a{color:var(--muted)}
.hero h1{font-size:clamp(38px,7.25vw,95.4px);font-weight:750;font-stretch:125%;line-height:1;letter-spacing:0;color:var(--ink-strong)}
.hero h1 .letter{text-shadow:0 0 .6vw color-mix(in srgb,var(--paper) 92%,transparent),0 .25vw 2.4vw color-mix(in srgb,var(--paper) 78%,transparent),0 .4vw 5vw color-mix(in srgb,var(--paper) 55%,transparent)}
.hero-content::before{inset:-88px -128px;background:radial-gradient(closest-side,color-mix(in srgb,var(--paper) 78%,transparent),transparent)}
.hero h2{font-size:36px;font-weight:620;font-stretch:118%;line-height:1.05;letter-spacing:-.03em;color:var(--ink-strong)}
.hero h2 em{font-size:inherit;font-weight:400;color:var(--muted)}
.hero-content>p,.section-intro p,.journal-heading>p:not(.mono){font-size:18px;font-weight:400;line-height:1.625;letter-spacing:normal;color:var(--muted)}
.hero-content>p{max-width:448px;margin:16px auto 28px}
.hero-links{color:var(--faint);flex-wrap:wrap;row-gap:8px}.hero-links a:hover{color:var(--ink)}
.hero .button{font-size:11px;font-weight:700;letter-spacing:.12em;min-height:48px;padding:0 24px}
.section-intro h2,.about-copy h2,.contact h2{font-size:60px;font-weight:620;font-stretch:118%;line-height:1.02;letter-spacing:-.035em}
.project-title h3,.entry-summary h3{font-size:24px;font-weight:620;font-stretch:118%;line-height:32px;letter-spacing:-.02em}
.project-body p,.entry-summary p,.role-detail p,.about-copy p,.journal-empty p{font-size:16px;font-weight:400;line-height:26px;color:var(--muted)}
.rail-letter{font-stretch:118%}
.credits.experience-marquee{display:flex;flex-wrap:nowrap;justify-content:flex-start;gap:0;padding:0;min-height:0;overflow:hidden;border-block:1px solid var(--line);background:var(--paper);color:var(--muted)}
.experience-marquee .experience-track{display:flex;align-items:center;justify-content:space-around;flex:0 0 auto;min-width:100%;margin:0;font:500 11px/16.5px var(--mono);letter-spacing:.15em;animation:experience-left 36s linear infinite}
.experience-track>span{padding:12px 24px;white-space:nowrap}
@keyframes experience-left{to{transform:translateX(-100%)}}
.experience-marquee:hover .experience-track,.experience-marquee:focus-visible .experience-track,.motion-paused .experience-track{animation-play-state:paused}
.reduced-motion .experience-track{animation:none}.reduced-motion .experience-track[aria-hidden]{display:none}.reduced-motion .credits.experience-marquee{overflow-x:auto}
@media(max-width:767px){.section-intro h2,.about-copy h2,.contact h2{font-size:48px}.hero h1{font-size:9.1vw}.hero .button{padding-inline:16px}header nav{overflow-x:auto}header nav a{flex-shrink:0}.hero-links{column-gap:16px}.hero-coordinate,.hero-floor,.motion-toggle{font-size:9px}}
@media(max-width:639px){.hero h2{font-size:30px}.section-intro h2,.about-copy h2,.contact h2{font-size:36px}}
@media(prefers-reduced-motion:reduce){.experience-track{animation:none!important}.experience-track[aria-hidden]{display:none}.credits.experience-marquee{overflow-x:auto}}
.credits.experience-marquee>.experience-track,.credits.experience-marquee>.experience-track:first-child{font:500 11px/16.5px var(--mono);letter-spacing:.15em;margin:0}
.experience-track>span{font:inherit;letter-spacing:inherit}

/* Reference content rails: full-width hero, centered bordered sections. */
body:not(.journal-page) #main{margin-right:0}
#main>section:not(.hero){max-width:1280px;margin-inline:auto;border-inline:1px solid rgba(16,16,20,.16)}
.dark #main>section:not(.hero){border-inline-color:rgba(242,241,238,.16)}
.journal-page main{border-inline-color:rgba(16,16,20,.16)}
.experience-track>.experience-company{display:flex;align-items:center;justify-content:center;padding-block:12px}
.experience-company img{display:block;width:auto;height:24px;max-width:118px;object-fit:contain;filter:brightness(0)}
.dark .experience-company img{filter:brightness(0) invert(1)}

.contact-linkedin{display:inline-block;margin-top:20px;font-size:11px;letter-spacing:.1em;color:#ccc}.contact-linkedin:hover{color:#fff;text-decoration:underline;text-underline-offset:4px}

/* Personal portrait and optional project stories. */
.about-portrait{margin:0 0 32px;max-width:420px}.about-portrait img{display:block;width:100%;height:auto;border:1px solid var(--subtle)}
.project-story{border-top:1px solid var(--subtle);margin-top:24px;padding-top:18px}.project-story summary{cursor:pointer;font-size:14px;font-weight:600;padding:6px 0}.project-story h4{font:600 15px/1.5 Inter,sans-serif;margin:22px 0 6px}.project-story p{white-space:normal;margin-top:0}.project-story summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px}