@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{color-scheme:light;--paper:#eeeae0;--ink:#141410;--muted:#5b584e;--line:#bcb7a9;--orange:#ffc400;--hero:#141410;--hero-text:#f4f0e6;--sage:#8b8779;--project-bg:#ddd8c9;--fold-1:#999487;--fold-2:#34332e;--fold-3:#ffc400;scroll-behavior:smooth}
:root[data-theme=dark]{color-scheme:dark;--paper:#11110f;--ink:#f4f0e6;--muted:#aaa697;--line:#3c3b34;--orange:#ffc400;--project-bg:#22221e;--fold-1:#6f6a59;--fold-2:#32312b;--fold-3:#d5a500}
*{box-sizing:border-box}html{scroll-padding-top:calc(var(--header-height, 78px) + 12px)}body{margin:0;background:var(--paper);color:var(--ink);font:500 16px/1.55 Manrope,Arial,sans-serif;-webkit-font-smoothing:antialiased}button,select{font:inherit}button,a,select{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}a:hover{text-decoration-color:currentColor}button{cursor:pointer}::selection{background:var(--orange);color:#fff}.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:absolute;z-index:100;top:-60px;left:16px;padding:12px 18px;background:var(--orange);color:#fff}.skip-link:focus{top:12px}:focus-visible{outline:3px solid var(--orange);outline-offset:4px}
.site-header{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:clamp(18px,3vw,48px);min-height:78px;padding:12px clamp(22px,4vw,70px);background:var(--paper);border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:11px;min-width:220px;line-height:1.2}.brand-disc{display:grid;place-items:center;flex:none;width:42px;height:42px;border:1px solid var(--ink);border-radius:50%;background:#f7f4eb;overflow:hidden}.brand-disc img{display:block;width:30px;height:30px;object-fit:contain}.brand strong{display:block;font-size:13px;font-weight:800;letter-spacing:-.02em}.brand small{display:block;margin-top:2px;font-size:11px;font-weight:600;color:var(--muted)}#site-nav{display:flex;align-items:center;gap:clamp(17px,2vw,32px);margin:auto;font:500 12px/1.2 'DM Mono',monospace;text-transform:uppercase;letter-spacing:.035em}#site-nav a{position:relative;white-space:nowrap}#site-nav a::after{content:'';position:absolute;left:0;right:100%;bottom:-7px;height:2px;background:var(--orange);transition:right .25s ease}#site-nav a:hover::after,#site-nav a:focus-visible::after{right:0}.header-controls{display:flex;align-items:center;gap:10px;margin-left:auto}.theme-toggle,.lang-control,.header-resume{height:34px;border:1px solid var(--line);background:transparent;color:var(--ink)}.theme-toggle{display:flex;align-items:center;gap:7px;padding:0 9px;font:500 11px/1 'DM Mono',monospace;white-space:nowrap}.theme-symbol{font-size:18px}.lang-control{position:relative;display:flex;align-items:center;padding:0 5px}.lang-select{max-width:88px;border:0;background:transparent;color:var(--ink);font:500 11px 'DM Mono',monospace;cursor:pointer}.lang-select option{background:var(--paper);color:var(--ink)}.header-resume{display:flex;align-items:center;padding:0 12px;font:700 11px/1 'DM Mono',monospace;text-transform:uppercase;white-space:nowrap;border-color:var(--ink)}.header-resume:hover{background:var(--ink);color:var(--paper)}.menu-toggle{display:none}
.hero{position:relative;isolation:isolate;overflow:hidden;background:var(--hero);color:var(--hero-text)}.hero::before{content:'';position:absolute;left:50%;top:0;bottom:0;width:1px;background:rgba(240,228,196,.07);pointer-events:none}.hero::after{content:'';position:absolute;inset:0;background-image:radial-gradient(rgba(235,237,223,.24) .7px,transparent .7px);background-size:22px 22px;opacity:.13;pointer-events:none}.hero-inner{position:relative;z-index:1;display:grid;grid-template-columns:minmax(330px,.9fr) minmax(450px,1.1fr);align-items:center;max-width:1500px;min-height:575px;margin:auto;padding:50px clamp(32px,6.2vw,108px) 28px}.hero-copy{position:relative;z-index:3;max-width:560px}.location{display:flex;align-items:center;gap:11px;margin:0 0 26px;color:#c9c0a9;font:500 11px/1 'DM Mono',monospace;text-transform:uppercase;letter-spacing:.13em}.location::before{content:'';display:block;width:24px;height:1px;background:var(--orange)}.hero h1{margin:0;font-size:clamp(34px,3.8vw,58px);font-weight:600;line-height:1.07;letter-spacing:-.055em}.hero-role{margin:10px 0 0;font-size:clamp(20px,2.2vw,33px);font-weight:500;line-height:1.2;letter-spacing:-.035em;color:#e7e0d0}.hero-stack{max-width:460px;margin:35px 0 0;padding-top:17px;border-top:1px solid #62596d;color:#c9c0a9;font:500 12px/1.6 'DM Mono',monospace}.hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:22px;margin-top:30px}.primary-link{display:inline-flex;align-items:center;justify-content:space-between;gap:28px;min-width:145px;padding:14px 16px;background:var(--orange);color:#11110f;font:700 12px/1 'DM Mono',monospace;text-transform:uppercase;transition:transform .25s ease,background .25s ease}.primary-link:hover{transform:translateY(-3px);background:#ffda50}.text-link{font:500 12px/1 'DM Mono',monospace;text-decoration:underline;text-underline-offset:5px}.quick-contact{display:flex;gap:18px;flex-wrap:wrap;margin-top:46px;color:#ada899;font:500 11px/1.5 'DM Mono',monospace}.quick-contact a:hover{color:#fff}.artifact{position:relative;display:grid;place-items:center;min-width:0;width:100%;height:min(46vw,575px);max-height:575px;margin:0;perspective:1000px}.artifact::before{content:'';position:absolute;inset:11% 11%;border:1px solid rgba(240,228,196,.12);border-radius:50%;transform:scaleX(1.1)}.artifact::after{content:'';position:absolute;width:72%;height:1px;background:rgba(240,228,196,.13);transform:rotate(-23deg)}.artifact-space{position:relative;width:min(100%,560px);aspect-ratio:1;transform:translateY(calc(var(--scroll-progress,0) * 38px)) rotateY(calc(var(--scroll-progress,0) * -12deg)) rotateZ(calc(var(--scroll-progress,0) * 6deg));transform-style:preserve-3d;transition:transform .3s ease-out;filter:drop-shadow(14px 31px 27px rgba(0,0,0,.23))}.artifact-fold{width:100%;height:100%;overflow:visible;transform:rotate(-13deg)}.artifact-fold path{stroke:#2c2b25;stroke-width:3}.fold-left{fill:var(--fold-1)}.fold-right{fill:var(--fold-2)}.fold-face{fill:var(--fold-3)}.fold-seam{fill:none;stroke:#4b483c!important;stroke-width:3!important;opacity:.55}.artifact-mark{position:absolute;z-index:2;left:50%;top:50%;width:31%;height:31%;object-fit:contain;transform:translate(-50%,-48%) rotate(-13deg);opacity:.83;filter:brightness(0) invert(1)}.hero[data-project=friendplace]{--fold-1:#8b8574;--fold-2:#35332d;--fold-3:#e1d7bd}.hero[data-project=dndplace]{--fold-1:#736d57;--fold-2:#4f4c40;--fold-3:#b99519}.hero .artifact-fold path{transition:fill .8s cubic-bezier(.2,.7,.2,1)}.project-rail{position:relative;z-index:3;display:grid;grid-template-columns:160px 1fr;gap:45px;align-items:end;max-width:1500px;margin:auto;padding:22px clamp(32px,6.2vw,108px) 23px;border-top:1px solid rgba(240,228,196,.24)}.rail-heading{display:flex;flex-direction:column;gap:9px}.rail-heading h2{margin:0;color:#c9c0a9;font:500 11px/1 'DM Mono',monospace;text-transform:uppercase;letter-spacing:.15em}.rail-arrows{display:flex;gap:6px}.rail-arrows button{display:grid;place-items:center;width:28px;height:28px;padding:0;border:1px solid #6c675b;background:transparent;color:#f4f0e6;font:16px/1 'DM Mono',monospace;transition:background .2s}.rail-arrows button:hover{background:var(--orange);border-color:var(--orange);color:#141410}.project-tabs{display:flex;gap:clamp(16px,3.2vw,50px);min-width:0}.project-tab{position:relative;flex:1;min-width:0;padding:5px 0 12px;border:0;border-bottom:1px solid #62596d;background:none;color:#a49f90;text-align:left;font:500 clamp(14px,1.3vw,19px)/1.15 Manrope,sans-serif;letter-spacing:-.035em;transition:color .25s}.project-tab::after{content:'';position:absolute;left:0;right:100%;bottom:-1px;height:3px;background:var(--orange);transition:right .4s cubic-bezier(.2,.7,.2,1)}.project-tab.is-active{color:#f4f0e6}.project-tab.is-active::after{right:0}.project-tab:hover{color:#fff}
.projects-section{background:var(--project-bg);overflow:hidden}.project-shell{display:grid;grid-template-columns:1fr .85fr;align-items:center;gap:5vw;min-height:360px;max-width:1500px;margin:auto;padding:48px clamp(32px,6.2vw,108px)}.project-content{align-self:center}.project-copy{max-width:650px}.project-copy:not(.is-active){display:none}.project-copy h2{margin:0 0 17px;font-size:clamp(33px,4vw,56px);font-weight:600;line-height:1;letter-spacing:-.06em}.project-copy p{max-width:575px;margin:0;font-size:clamp(16px,1.55vw,22px);line-height:1.45;font-weight:500;letter-spacing:-.015em}.source-link{display:inline-block;margin-top:26px;padding-bottom:4px;border-bottom:1px solid currentColor;font:500 12px/1 'DM Mono',monospace;text-transform:uppercase}.source-link:hover{color:var(--orange)}.project-visual{position:relative;display:grid;place-items:center;min-height:270px}.visual-shadow{position:absolute;width:65%;height:25%;bottom:19px;border-radius:50%;background:#141410;opacity:.15;filter:blur(22px)}.visual-fold{position:relative;display:flex;flex-direction:column;justify-content:center;width:min(83%,330px);min-height:245px;padding:32px 44px;color:#f4f0e6;background:var(--fold-3);clip-path:polygon(12% 7%,88% 0,100% 27%,93% 91%,68% 100%,4% 89%,0 29%);transform:rotate(-9deg);box-shadow:0 12px 0 #141410;transition:background .5s,transform .7s cubic-bezier(.18,.8,.2,1)}.visual-fold::before{content:'';position:absolute;left:25%;top:-15%;width:50%;height:80%;border:2px solid rgba(20,20,16,.28);border-radius:50%;transform:rotate(-33deg)}.visual-title{position:relative;z-index:1;font:700 clamp(35px,4vw,60px)/.92 Manrope,sans-serif;letter-spacing:-.09em}.visual-rule{position:relative;z-index:1;width:70%;height:4px;margin-top:19px;background:#141410}.projects-section[data-project=friendplace]{--fold-3:#b79106}.projects-section[data-project=dndplace]{--fold-3:#a4841a}.projects-section[data-project=friendplace] .visual-fold{transform:rotate(7deg)}.projects-section[data-project=dndplace] .visual-fold{transform:rotate(-4deg)}
.content-section{display:grid;grid-template-columns:minmax(180px,.27fr) 1fr;gap:clamp(36px,8vw,155px);max-width:1500px;margin:auto;padding:70px clamp(32px,6.2vw,108px);border-bottom:1px solid var(--line)}.content-section>h2,.contact-inner>h2{margin:0;font:500 12px/1.4 'DM Mono',monospace;text-transform:uppercase;letter-spacing:.13em}.content-section>h2::before,.contact-inner>h2::before{content:'↗';display:block;margin-bottom:13px;color:var(--orange);font:24px/1 Manrope,sans-serif}.experience-list{border-top:1px solid var(--ink)}.experience-item{display:grid;grid-template-columns:minmax(170px,.42fr) 1fr;gap:35px;align-items:start;padding:25px 0;border-bottom:1px solid var(--line)}.experience-item h3,.education-items h3{margin:0;font-size:clamp(18px,1.6vw,23px);font-weight:600;line-height:1.25;letter-spacing:-.03em}.experience-item time,.education-items time{display:block;margin-top:9px;color:var(--muted);font:500 11px/1.4 'DM Mono',monospace;text-transform:uppercase}.experience-item p,.education-items p{margin:0;color:var(--muted);font-size:15px;line-height:1.55}.practice-small h3{font-size:17px}.skill-lines{border-top:1px solid var(--ink)}.skill-lines p{margin:0;padding:18px 0;border-bottom:1px solid var(--line);font-size:clamp(17px,1.5vw,21px);line-height:1.45;letter-spacing:-.02em}.education-items{display:grid;grid-template-columns:1fr 1fr;gap:32px}.education-items article{padding-top:22px;border-top:1px solid var(--ink)}.education-items h3{margin:14px 0 8px}.education-items time{margin:0}.contact-section{background:var(--orange);color:#141410}.contact-inner{display:grid;grid-template-columns:minmax(180px,.27fr) 1fr auto;gap:clamp(30px,8vw,155px);max-width:1500px;margin:auto;padding:65px clamp(32px,6.2vw,108px)}.contact-inner>h2::before{color:#fff}.contact-links{display:grid;gap:11px}.contact-links a{width:max-content;max-width:100%;font-size:clamp(18px,2vw,28px);font-weight:600;letter-spacing:-.04em;line-height:1.2;overflow-wrap:anywhere}.contact-links a:hover{text-decoration:underline;text-underline-offset:5px}.contact-resume{align-self:end;white-space:nowrap;padding-bottom:4px;border-bottom:1px solid #141410;font:600 12px/1 'DM Mono',monospace;text-transform:uppercase}footer{display:flex;justify-content:space-between;gap:20px;padding:24px clamp(32px,6.2vw,108px);font:500 11px/1 'DM Mono',monospace;text-transform:uppercase}footer a:hover{text-decoration:underline;text-underline-offset:4px}
@media(max-width:1100px){.site-header{gap:18px}.brand{min-width:185px}#site-nav{gap:13px}.header-controls{gap:5px}.hero-inner{grid-template-columns:1fr .9fr;min-height:500px}.artifact{height:44vw}.contact-inner{grid-template-columns:180px 1fr;gap:36px}.contact-resume{grid-column:2}}
@media(max-width:1000px){.site-header{flex-wrap:wrap;min-height:68px}.brand{min-width:0;margin-right:auto}.menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:4px;order:3;width:36px;height:34px;padding:7px;border:1px solid var(--line);background:transparent;color:var(--ink)}.menu-toggle span{display:block;width:100%;height:1px;background:currentColor}.header-controls{order:2;margin-left:0}#site-nav{display:none;order:4;flex-basis:100%;margin:0;padding:14px 0 8px;border-top:1px solid var(--line)}.site-header.menu-open #site-nav{display:flex;flex-wrap:wrap;gap:18px 25px}.hero-inner{grid-template-columns:1fr 1fr;gap:0;min-height:480px;padding:46px 32px}.hero h1{font-size:clamp(32px,4.8vw,44px)}.artifact{height:43vw}.artifact-mark{width:34%;height:34%}.project-rail{padding-inline:32px;gap:24px;grid-template-columns:100px 1fr}.project-shell,.content-section,.contact-inner{padding-inline:32px}.content-section{grid-template-columns:145px 1fr;gap:32px}.experience-item{grid-template-columns:1fr;gap:10px}.contact-inner{grid-template-columns:145px 1fr}.contact-resume{grid-column:2}}
@media(max-width:620px){html{scroll-padding-top:calc(var(--header-height, 68px) + 12px)}.site-header{padding:10px 18px}.brand-disc{width:36px;height:36px}.brand-disc img{width:26px;height:26px}.brand strong{font-size:11px}.brand small{font-size:10px}.header-controls{gap:4px}.theme-toggle{width:32px;justify-content:center;padding:0}.theme-state{display:none}.lang-control{padding:0 2px}.lang-select{max-width:72px}.header-resume{display:none}.hero-inner{display:flex;flex-direction:column;align-items:stretch;min-height:0;padding:45px 25px 10px}.hero-copy{max-width:none}.hero h1{font-size:clamp(33px,9vw,44px)}.hero-role{font-size:clamp(20px,5vw,27px)}.hero-stack{margin-top:25px}.hero-actions{margin-top:25px}.quick-contact{margin-top:27px;gap:8px 18px}.artifact{align-self:center;width:min(92vw,410px);height:min(90vw,400px);margin-top:-4px}.artifact-space{width:100%}.project-rail{display:block;padding:15px 25px 22px}.rail-heading{flex-direction:row;justify-content:space-between;align-items:center}.rail-arrows button{width:31px;height:31px}.project-tabs{gap:19px;overflow-x:auto;margin-top:16px;padding-bottom:2px;scrollbar-width:none}.project-tabs::-webkit-scrollbar{display:none}.project-tab{flex:none;min-width:max-content;font-size:16px;padding-bottom:9px}.project-shell{grid-template-columns:1fr;gap:16px;min-height:0;padding:42px 25px 30px}.project-copy h2{font-size:39px}.project-copy p{font-size:17px}.project-visual{min-height:230px}.visual-fold{width:240px;min-height:195px;padding:30px}.visual-title{font-size:44px}.content-section{display:block;padding:47px 25px}.content-section>h2{margin-bottom:27px}.experience-item{padding:18px 0}.experience-item p,.education-items p{font-size:15px}.skill-lines p{font-size:17px}.education-items{grid-template-columns:1fr;gap:27px}.contact-inner{display:block;padding:47px 25px}.contact-inner>h2{margin-bottom:28px}.contact-links{gap:15px}.contact-links a{font-size:22px}.contact-resume{display:inline-block;margin-top:32px}footer{padding:24px 25px;flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}.artifact-space{transform:none!important}}
/* Reading scale for desktop and wide displays. */
@media(min-width:821px){.brand strong{font-size:15px}.brand small{font-size:12px}#site-nav{font-size:14px}.theme-toggle,.lang-select,.header-resume{font-size:12px}.location,.rail-heading h2,.quick-contact,.experience-item time,.education-items time,footer{font-size:13px}.hero-stack,.text-link,.source-link,.content-section>h2,.contact-inner>h2,.contact-resume{font-size:14px}.primary-link{font-size:13px}}
.visual-fold{clip-path:none;border-radius:34% 18% 29% 9% / 14% 36% 18% 33%}
.projects-section[data-project=friendplace] .visual-fold{border-radius:13% 35% 12% 30% / 28% 12% 38% 16%}
.projects-section[data-project=dndplace] .visual-fold{border-radius:40% 9% 27% 17% / 23% 41% 14% 29%}
@media(max-width:360px){.site-header{padding:10px 12px;gap:5px}.brand{gap:7px}.brand-disc{width:32px;height:32px}.brand-disc img{width:24px;height:24px}.brand strong{font-size:10px}.brand small{display:none}.header-controls{gap:3px}.lang-select{max-width:68px}.menu-toggle{width:33px}}
/* A continuous route gives the scroll motion a visible, page-wide anchor. */
.motion-route{position:fixed;z-index:18;right:8px;top:15vh;width:46px;height:70vh;pointer-events:none;opacity:.92}.motion-route svg{display:block;width:46px;height:100%;overflow:visible}.motion-route path{fill:none;stroke:var(--orange);stroke-width:1.4;vector-effect:non-scaling-stroke;opacity:.65}.route-head{position:absolute;left:0;top:0;width:9px;height:9px;border:2px solid var(--orange);border-radius:50%;background:var(--paper);transform:translate3d(19px,0,0);box-shadow:0 0 0 4px var(--paper)}#site-nav a[aria-current=location]::after{right:0}#site-nav a[aria-current=location]{color:var(--orange)}
.content-section{position:relative}.content-section::after{content:'';position:absolute;top:-1px;left:clamp(32px,6.2vw,108px);right:clamp(32px,6.2vw,108px);height:2px;background:var(--orange);transform:scaleX(0);transform-origin:left center;transition:transform .6s cubic-bezier(.16,1,.3,1);pointer-events:none}.content-section.is-visible::after{transform:scaleX(1)}.contact-section{position:relative;overflow:hidden}.contact-section::after{content:'';position:absolute;right:-80px;top:-190px;width:480px;height:480px;border:1px solid rgba(20,20,16,.22);border-radius:42% 58% 56% 44% / 45% 39% 61% 55%;transform:rotate(-18deg);pointer-events:none}.contact-section.is-visible::after{animation:contact-orbit 8s ease-in-out infinite alternate}@keyframes contact-orbit{to{transform:translate3d(-35px,35px,0) rotate(13deg)}}
.skill-map{border-top:1px solid var(--ink)}.skill-row{position:relative;display:grid;grid-template-columns:42px minmax(175px,.35fr) 1fr;gap:clamp(18px,2.7vw,46px);align-items:start;padding:19px 0;border-bottom:1px solid var(--line)}.skill-index{padding-top:4px;color:var(--orange);font:500 12px/1 'DM Mono',monospace}.skill-row h3{margin:0;font-size:clamp(16px,1.45vw,21px);font-weight:600;line-height:1.3;letter-spacing:-.03em}.skill-row p{margin:0;color:var(--muted);font-size:clamp(14px,1.12vw,16px);line-height:1.55}.skill-row::before{content:'';position:absolute;left:0;bottom:-1px;width:100%;height:1px;background:var(--orange);transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.16,1,.3,1)}
@media(hover:hover) and (pointer:fine){.skill-row:hover::before{transform:scaleX(1)}}
@media(max-width:820px){.motion-route{right:0;top:var(--header-height, 68px);width:100vw;height:3px;opacity:1}.motion-route svg{display:none}.motion-route::before{content:'';display:block;width:100%;height:2px;background:var(--line)}.route-head{width:8px;height:8px;box-shadow:none}.content-section::after{left:32px;right:32px}.skill-row{grid-template-columns:28px minmax(125px,.4fr) 1fr;gap:16px}}
@media(max-width:620px){.content-section::after{left:25px;right:25px}.skill-row{grid-template-columns:28px 1fr;gap:4px 12px;padding:17px 0}.skill-row h3{font-size:18px}.skill-row p{grid-column:2;font-size:15px}.skill-index{padding-top:5px}.contact-section::after{width:320px;height:320px;right:-140px;top:-130px}}
@media(prefers-reduced-motion:reduce){.motion-route{display:none}.content-section::after{transition:none;transform:scaleX(1)}.contact-section.is-visible::after{animation:none}}

:root{--accent-text:#806000}:root[data-theme=dark]{--accent-text:#ffc400}#site-nav a[aria-current=location],.skill-index,.source-link:hover{color:var(--accent-text)}.contact-inner>h2::before{color:#141410}
@media(hover:none){.primary-link:hover{transform:none}}
.artifact-mark{filter:none;opacity:.9}.visual-fold{color:#141410}.projects-section[data-project=friendplace] .visual-fold{color:#f4f0e6}.projects-section[data-project=friendplace] .visual-rule{background:#f4f0e6}
/* The project map is the page's second spatial scene. */
.projects-section{position:relative}.project-shell{grid-template-columns:minmax(580px,1.25fr) minmax(300px,.75fr);gap:clamp(32px,5vw,85px);min-height:580px;padding-block:66px}.project-content{order:2;position:relative;z-index:2}.project-visual{order:1;min-height:500px}.graph-viewport{overflow:visible}.graph-canvas{position:relative;width:100%;max-width:700px;aspect-ratio:7/5;isolation:isolate}.graph-canvas::before{content:'';position:absolute;inset:9% 10%;border:1px solid var(--line);border-radius:49% 44% 47% 56% / 45% 54% 47% 53%;transform:rotate(-18deg);opacity:.65}.graph-orbit{position:absolute;inset:20% 19%;border:1px dashed var(--line);border-radius:51% 49% 42% 58% / 57% 38% 62% 43%;transform:rotate(17deg);opacity:.6;pointer-events:none}.graph-edges{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.graph-edge{fill:none;stroke:var(--line);stroke-width:1.2;opacity:.35;transition:opacity .3s,stroke .3s,stroke-width .3s}.graph-edge.is-lit{stroke:var(--accent-text);stroke-width:2.4;opacity:.88;stroke-dasharray:8 11;animation:graph-trace 2.6s linear infinite}@keyframes graph-trace{to{stroke-dashoffset:-38}}
.graph-node{position:absolute;z-index:2;left:var(--x);top:var(--y);transform:translate(-50%,-50%);white-space:nowrap;border:1px solid var(--ink);color:var(--ink);background:var(--project-bg);font:700 12px/1.15 'DM Mono',monospace;letter-spacing:-.025em;transition:background .28s,color .28s,border-color .28s,box-shadow .28s}.graph-node:hover,.graph-node:focus-visible{z-index:5;box-shadow:0 0 0 4px var(--paper)}.graph-project{min-width:126px;min-height:84px;padding:18px;border-width:2px;background:var(--paper);font:700 clamp(16px,1.45vw,21px)/1.12 Manrope,sans-serif;letter-spacing:-.04em;white-space:normal}.graph-project[data-project=homeplace]{border-radius:43% 13% 31% 15% / 28% 37% 18% 43%;transform:translate(-50%,-50%) rotate(-8deg)}.graph-project[data-project=friendplace]{border-radius:16% 42% 14% 32% / 31% 18% 46% 22%;transform:translate(-50%,-50%) rotate(7deg)}.graph-project[data-project=dndplace]{border-radius:37% 20% 42% 14% / 25% 46% 18% 36%;transform:translate(-50%,-50%) rotate(-5deg)}.graph-project.is-active{background:var(--orange);border-color:var(--ink);box-shadow:8px 10px 0 rgba(20,20,16,.12)}.graph-tech{min-height:35px;padding:9px 11px;border-color:var(--line);border-radius:50px;background:var(--paper);font-size:11px}.graph-tech.is-related{border-color:var(--accent-text)}.graph-tech.is-focused{background:var(--ink);color:var(--paper);border-color:var(--ink)}.graph-inspector{margin-top:24px;padding-top:18px;border-top:1px solid var(--ink)}.graph-inspector[hidden]{display:none}.graph-inspector strong{display:block;margin-bottom:7px;font:700 14px/1.2 'DM Mono',monospace;text-transform:uppercase}.graph-inspector p{font-size:14px;line-height:1.5}.project-copy h2{font-size:clamp(38px,3.6vw,54px)}.project-copy p{font-size:clamp(17px,1.4vw,21px)}
.scene-wipe{position:fixed;z-index:60;inset:0;background:var(--orange);clip-path:circle(0 at 50% 50%);pointer-events:none;contain:layout paint}
@media(max-width:1150px){.project-shell{grid-template-columns:minmax(450px,1.1fr) minmax(270px,.9fr);gap:24px}.graph-canvas{min-width:480px}}
@media(max-width:820px){.project-shell{display:flex;flex-direction:column;gap:0;padding-top:30px}.project-visual{order:1;align-self:stretch}.project-content{order:2}.graph-viewport{width:100%;max-width:none;min-height:0;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:var(--accent-text) transparent}.graph-canvas{width:620px;min-width:620px;height:443px;max-width:none;aspect-ratio:auto}.graph-project{font-size:17px;min-width:120px}.graph-tech{font-size:10px}}
@media(max-width:620px){.project-shell{padding:24px 0 42px}.graph-viewport{padding:0 12px}.graph-canvas{width:620px;min-width:620px;height:443px}.project-content{padding:30px 25px 0}.project-copy h2{font-size:40px}.project-copy p{font-size:17px}.graph-inspector{margin-top:20px}.graph-inspector p{font-size:14px}}
@media(prefers-reduced-motion:reduce){.graph-edge.is-lit{animation:none}.scene-wipe{display:none}}
.graph-project.is-active{color:#141410}.graph-tech{font-size:12px;min-height:38px}.graph-project{font-size:19px}
@media(max-width:820px){.graph-tech{font-size:11px}.graph-project{font-size:17px}}

.hero[data-project=friendplace]{--fold-1:#777366;--fold-2:#36352f;--fold-3:#d2a800}.hero[data-project=dndplace]{--fold-1:#8c887a;--fold-2:#444238;--fold-3:#b38a05}.projects-section[data-project=friendplace] .visual-fold,.projects-section[data-project=friendplace] .visual-rule{color:#141410;background:#b79106}
.projects-section[data-project=friendplace] .visual-rule{background:#141410}
.graph-edge.is-lit{stroke-width:3.2;stroke-dasharray:10 9}.graph-tech{font-size:13px}
@media(max-width:1000px){.project-shell{display:flex;flex-direction:column;gap:0;padding-top:30px}.project-visual{order:1;align-self:stretch;min-height:0}.project-content{order:2}.graph-viewport{width:100%;max-width:none;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:var(--orange) transparent}.graph-canvas{width:620px;min-width:620px;height:443px;max-width:none;aspect-ratio:auto}}
@media(max-width:820px){.graph-tech{font-size:11px}}
.motion-route .route-pin{position:absolute;z-index:2;left:0;top:0;display:block;width:16px;height:16px;border:1px solid var(--orange);border-radius:50%;background:var(--paper);pointer-events:auto;transform:translate3d(15px,0,0);transition:background .2s,box-shadow .2s}.motion-route .route-pin[aria-current=location]{background:var(--orange);box-shadow:0 0 0 5px var(--paper)}.route-pin span{position:absolute;right:27px;top:50%;padding:6px 9px;border:1px solid var(--line);background:var(--paper);color:var(--ink);font:600 12px/1 'DM Mono',monospace;text-transform:uppercase;white-space:nowrap;opacity:0;visibility:hidden;transform:translate3d(8px,-50%,0);transition:opacity .18s,transform .18s,visibility .18s}.route-pin:hover span,.route-pin:focus-visible span{opacity:1;visibility:visible;transform:translate3d(0,-50%,0)}.route-pin:focus-visible{outline:2px solid var(--ink);outline-offset:3px}.graph-reset{display:inline-block;margin-top:22px;padding:7px 0;border:0;border-bottom:1px solid var(--ink);background:transparent;color:var(--ink);font:600 13px/1.1 'DM Mono',monospace;text-transform:uppercase}.graph-reset[hidden]{display:none}.graph-reset:hover{color:var(--accent-text);border-color:var(--accent-text)}
@media(hover:hover) and (pointer:fine){.graph-node{cursor:grab}.graph-node.is-dragging{z-index:20;cursor:grabbing;transition:none;box-shadow:0 16px 30px rgba(0,0,0,.23)}}
@media(max-width:820px){.motion-route .route-pin{display:none}}

/* Employer names stay prominent; motion follows the reader's focus. */
.experience-org{display:block;margin-top:7px;color:var(--ink);font:700 14px/1.3 'DM Mono',monospace;letter-spacing:.01em}
.experience-item{position:relative}
.experience-item::after{content:'';position:absolute;left:0;bottom:-1px;width:100%;height:2px;background:var(--orange);transform:scaleX(0);transform-origin:left center;transition:transform .55s cubic-bezier(.16,1,.3,1);pointer-events:none}
.experience-item:hover::after{transform:scaleX(1)}
@media(prefers-reduced-motion:reduce){.experience-item::after{transition:none}}
/* The hero mark sits inside a living network, rather than layered decorative blobs. */
.artifact{perspective:1050px}
.artifact::before,.artifact::after{display:none}
.topology-field{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.topology-route{fill:none;stroke:rgba(246,232,187,.28);stroke-width:1.4;vector-effect:non-scaling-stroke}
.topology-signal{fill:none;stroke:#ffc400;stroke-width:3.5;stroke-linecap:round;stroke-dasharray:3 95;vector-effect:non-scaling-stroke;animation:signal-flow 7s linear infinite}
.signal-two{animation-duration:9s;animation-direction:reverse;opacity:.8}
.signal-three{animation-duration:11s;opacity:.58}
.topology-anchor{fill:#ffc400;stroke:#141410;stroke-width:4}
@keyframes signal-flow{to{stroke-dashoffset:-392}}
.artifact-space{width:min(100%,560px);filter:none;will-change:transform}
.artifact-membrane{display:block;width:100%;height:100%;overflow:visible;filter:drop-shadow(18px 27px 25px rgba(0,0,0,.24))}
.membrane-shadow{fill:#555247;opacity:.8;transform:translate(18px,22px)}
.membrane-face{fill:#ffc400;stroke:#141410;stroke-width:5;stroke-linejoin:round}
.artifact-core{position:absolute;z-index:2;left:50%;top:50%;display:grid;place-items:center;width:43%;aspect-ratio:1;background:#141410;border:3px solid #ffc400;border-radius:27% 17% 30% 19% / 17% 30% 20% 29%;transform:translate(-50%,-50%) translateZ(70px) rotate(-8deg);box-shadow:15px 19px 0 rgba(20,20,16,.46),inset 0 0 0 9px rgba(255,196,0,.08);transform-style:preserve-3d}
.artifact-core::before{content:'';position:absolute;inset:11px;border:1px solid rgba(255,196,0,.28);border-radius:inherit;pointer-events:none}
.artifact-core .artifact-mark{position:relative;left:auto;top:auto;width:70%;height:70%;opacity:1;filter:brightness(0) invert(1);transform:rotate(8deg);object-fit:contain}
@media(max-width:620px){.artifact{width:min(100vw,430px);height:min(100vw,430px)}.artifact-space{width:100%}.artifact-core{width:45%}}
@media(prefers-reduced-motion:reduce){.topology-signal{animation:none;stroke-dasharray:none;stroke-width:1.5;opacity:.35}.artifact-space{will-change:auto}}
/* Navigation follows a route from the pressed control to the next section. */
.scene-wipe{display:block;opacity:0;clip-path:none;background:rgba(17,17,15,.96);background-image:radial-gradient(rgba(255,196,0,.15) .65px,transparent .65px);background-size:24px 24px;visibility:hidden;pointer-events:none}
.scene-wipe.is-active{visibility:visible}
.transition-circuit{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.transition-path{fill:none;stroke:#ffc400;stroke-width:2;stroke-linecap:square;stroke-linejoin:miter;vector-effect:non-scaling-stroke}
.transition-origin{fill:#ffc400;stroke:#141410;stroke-width:3}
.transition-arrival{fill:#141410;stroke:#ffc400;stroke-width:2.5}
.transition-target{position:absolute;max-width:calc(100vw - 70px);color:#f4f0e6;font:700 clamp(25px,4.5vw,62px)/1.05 Manrope,sans-serif;letter-spacing:-.06em;white-space:nowrap;text-transform:uppercase;transform-origin:left top}
@media(max-width:620px){.transition-target{font-size:clamp(23px,7vw,32px)}}
@media(prefers-reduced-motion:reduce){.scene-wipe{display:none}}
.graph-project[data-project=reelroost]{border-radius:20% 39% 17% 34% / 34% 17% 40% 19%;transform:translate(-50%,-50%) rotate(5deg)}
