@import url("cursor.css?v=gesture-chapters-2");
@font-face{font-family:'Fragment Mono';src:url('assets/fragment-mono-regular.woff2') format('woff2');font-weight:400;font-display:swap;unicode-range:U+0000-024F,U+2000-206F,U+2190-21FF,U+2212}
@font-face{font-family:MiSans;src:url('assets/misans-web-062ca1cc3324.woff2') format('woff2');font-weight:400;font-display:swap}
:root{
 /* Semantic color and geometry roles. Project color belongs to the image. */
 --paper:#fff;--ink:#171717;--secondary:#595959;--quiet:#737373;
 --line:rgba(0,0,0,.18);--guide:rgba(0,0,0,.055);--space-guide:rgba(0,0,0,.10);--surface:#f4f4f4;--placeholder:#c7c7c7;--dot-ink:#767676;
 --tick-length:32px;--stroke:1px;--point:8px;--node:4px;--node-emphasis:6px;
 --font:'Fragment Mono','MiSans',monospace;
 --display:clamp(44px,3.89vw,56px);--title:20px;--body:14px;--ui:14px;--chrome-type:13px;--meta:11px;--contact-title:28px;--contact-label-width:184px;--contact-detail-width:280px;
 --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-6:24px;--space-8:32px;--space-12:48px;--space-16:64px;--space-20:80px;
 --viewport-width:100vw;--gutter:clamp(64px,5.556vw,80px);--grid-gap:24px;
 --grid-unit:calc((var(--viewport-width) - 2 * var(--gutter) + var(--grid-gap)) / 12);
 --content-start:calc(var(--gutter) + 2 * var(--grid-unit));--header:80px;
 --heading-top:clamp(112px,12vh,144px);--timeline-top:28vh;--section-bottom:8vh;--navigation-inset:var(--space-4);--axis-label-gap:48px;--home-wordmark-top:44%;--home-cue-top:72%;--cue-length:88px;
 --ease:cubic-bezier(.16,1,.3,1);--motion-fast:180ms;--motion-base:280ms;--motion-space:800ms;
 --motion-reveal:680ms;--motion-stagger:60ms;--reveal-distance:16px;--reveal-exit-distance:12px;--chapter-hold:40svh;--project-lift:6px;--project-defocus:1.4px;--project-dim:.64;--cue-cycle:3600ms;
}
*{box-sizing:border-box}html{background:var(--paper);scrollbar-width:thin;scrollbar-color:var(--line) var(--paper);scroll-behavior:auto}
body{margin:0;color:var(--ink);background:var(--paper);font:400 var(--body)/1.7 var(--font);-webkit-font-smoothing:antialiased}
body,button,a{-webkit-tap-highlight-color:transparent}::selection{background:var(--ink);color:var(--paper)}
a{color:inherit;text-decoration:none;text-underline-offset:4px}button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
h1,h2,h3,p{margin:0;font-weight:400}a,button{touch-action:manipulation}img{display:block;max-width:100%}
a:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:1px solid var(--ink);outline-offset:6px}
button:active{opacity:.65}.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}
/* Header follows the page grid; the centered chapter rail sits one spacing unit outside it. */
.header{height:var(--header);position:fixed;inset:0 0 auto;z-index:30;display:flex;align-items:center;justify-content:space-between;padding:0 var(--gutter);background:var(--paper)}
.identity{position:relative;font-size:var(--chrome-type);line-height:24px;padding:var(--space-3) 0;letter-spacing:-.02em}
.home-hint{position:absolute;left:0;top:38px;white-space:nowrap;font-size:var(--meta);color:var(--secondary);opacity:0;transition:opacity var(--motion-fast)}.identity:hover .home-hint{opacity:1}
.language{display:flex;align-items:center;gap:var(--space-2)}
.language button{position:relative;min-width:40px;min-height:44px;font-size:var(--chrome-type);color:var(--quiet);transition:color var(--motion-fast)}
.language button:after{content:'';position:absolute;bottom:5px;left:calc(50% - 2px);width:var(--node);height:var(--node);border-radius:50%;background:var(--ink);opacity:0;transition:opacity var(--motion-fast)}
.language button:hover,.language button[aria-pressed=true]{color:var(--ink)}.language button[aria-pressed=true]:after{opacity:1}
.skip-link{position:fixed;left:var(--gutter);top:var(--header);background:var(--ink);color:var(--paper);padding:var(--space-3) var(--space-4);z-index:60;transform:translateY(-240px)}.skip-link:focus{transform:none}
.navigation{position:fixed;left:calc(var(--gutter) - var(--navigation-inset));top:50%;translate:0 -50%;z-index:25;display:flex;flex-direction:column;gap:var(--space-1)}
.navigation a{display:flex;align-items:center;gap:var(--space-3);min-height:44px;font-size:var(--chrome-type);line-height:20px;color:var(--quiet);transition:color var(--motion-fast)}
.navigation a:hover,.navigation a[aria-current]{color:var(--ink)}
.nav-point{width:var(--space-2);height:var(--space-2);position:relative}.nav-point:after{content:'';position:absolute;width:var(--node);height:var(--node);inset:2px;background:var(--ink);border-radius:50%;opacity:0;transition:opacity var(--motion-fast)}
.navigation a[aria-current] .nav-point:after{opacity:1}.navigation a:hover .nav-point:after{opacity:.5}
/* Each section occupies real document space. The document is the only scroller. */
.journey,.stage{position:relative}.panel{position:relative;height:100svh;min-height:720px;overflow:clip;background:var(--paper)}
.chapter-shell{position:relative}
.has-chapters .chapter-shell{height:calc(100svh + var(--chapter-hold))}
.has-chapters .chapter-shell:last-child{height:100svh}
.has-chapters .panel{position:sticky;top:0}
.section-heading{transform:translate3d(0,var(--heading-y,0px),0)}
.timeline,.work-plane,.space{transform:translate3d(0,var(--content-y,0px),0)}
.space-geometry{opacity:var(--content-opacity,1)}
.project-meta{transform:translate3d(0,var(--metadata-y,0px),0)}
.section-heading{position:absolute;left:var(--content-start);top:var(--heading-top);font-size:var(--display);line-height:1.1;letter-spacing:-.035em;z-index:2;pointer-events:none}
/* One typographic object, one origin, one understated way in. */
.home-panel{height:100svh;min-height:0}.dot-wordmark{position:absolute;left:50%;top:var(--home-wordmark-top);width:calc(10 * var(--grid-unit) - var(--grid-gap));transform:translate(-50%,-50%);pointer-events:none}
.dot-wordmark svg{display:block;width:100%;height:auto;overflow:visible}.dot-wordmark circle{fill:var(--dot-ink);r:.85px}
.explore{position:absolute;top:var(--home-cue-top);left:50%;transform:translateX(-50%);min-width:144px;display:flex;flex-direction:column;align-items:center;gap:var(--space-4);font-size:var(--chrome-type);line-height:20px;white-space:nowrap;color:var(--secondary);transition:color var(--motion-fast)}
.explore:hover{color:var(--ink)}
.explore-text{display:inline-block}
.home-idle .explore-text{animation:cue-ink var(--cue-cycle) ease-in-out infinite}
@keyframes cue-ink{0%,100%{opacity:1}50%{opacity:.78}}.explore-stem{display:block;width:var(--point);height:calc(var(--cue-length) + var(--point));pointer-events:none}
.about-panel{--display:clamp(40px,3.4vw,48px);--title:18px;--body:13px;--ui:13px;--meta:11px}
/* Dates sit nearest the axis; the text occupies the outer columns. */
.timeline{position:absolute;left:var(--gutter);right:var(--gutter);top:var(--timeline-top);bottom:var(--section-bottom)}
.column-label{position:absolute;top:calc(-1 * var(--space-12));color:var(--quiet);font-size:var(--ui);line-height:20px}.education-label{right:calc(50% + var(--axis-label-gap));text-align:right}.career-label{left:calc(50% + var(--axis-label-gap))}
.timeline-entry{position:absolute}.timeline-entry time{position:absolute;top:6px;white-space:nowrap;color:var(--quiet);font-size:var(--meta);line-height:16px;font-variant-numeric:tabular-nums}
.timeline-entry:before{content:'';position:absolute;top:12px;width:var(--node);height:var(--node);border-radius:50%;background:var(--secondary)}
.education{left:calc(2 * var(--grid-unit));width:calc(4 * var(--grid-unit) - var(--grid-gap)/2 - var(--tick-length) - 168px)}
.career{left:calc(8 * var(--grid-unit));right:0}
.education time{left:calc(4 * var(--grid-unit) - var(--grid-gap)/2 - var(--tick-length) - 16px);transform:translateX(-100%)}
.career time{left:calc(-2 * var(--grid-unit) - var(--grid-gap)/2 + var(--tick-length) + 16px)}
.education:before{left:calc(4 * var(--grid-unit) - var(--grid-gap)/2 - var(--node)/2)}.career:before{left:calc(-2 * var(--grid-unit) - var(--grid-gap)/2 - var(--node)/2)}
.timeline-tick{position:absolute;top:14px;height:var(--stroke);background:var(--line);width:var(--tick-length)}.education .timeline-tick{left:calc(4 * var(--grid-unit) - var(--grid-gap)/2 - var(--tick-length))}.career .timeline-tick{left:calc(-2 * var(--grid-unit) - var(--grid-gap)/2)}
.entry-content h3{font-size:var(--title);line-height:1.4;margin-bottom:var(--space-1);text-wrap:balance}.entry-role{font-size:var(--body);line-height:1.5;color:var(--secondary);margin-bottom:var(--space-3)}.entry-description{font-size:var(--body);line-height:1.7;color:var(--secondary);max-width:56ch;text-wrap:pretty}
/* Reverse chronological, optically spaced so closely dated roles remain readable. */
.red{top:6%}.insta{top:34%}.bnu{top:49%}.bairong{top:62%}.cuc{top:76%}
/* Reference composition: broad Miko, lower middle Insta360, compact TalkAI. */
.work-plane{position:absolute;left:calc(var(--content-start) - .5 * var(--grid-unit));right:var(--gutter);top:11vh;bottom:6vh;isolation:isolate}
.plane-grid{position:absolute;inset:0;z-index:-1;background-image:linear-gradient(to right,var(--guide) 1px,transparent 1px),linear-gradient(to bottom,var(--guide) 1px,transparent 1px);background-size:calc(2 * var(--grid-unit)) 25%;background-position:calc(.5 * var(--grid-unit)) var(--space-8);transform-origin:50% 50%}
.work-plane.has-pointer .plane-grid{mask-image:linear-gradient(to right,#000 calc(var(--cx) - 3px),transparent calc(var(--cx) - 3px),transparent calc(var(--cx) + 3px),#000 calc(var(--cx) + 3px)),linear-gradient(to bottom,#000 calc(var(--cy) - 3px),transparent calc(var(--cy) - 3px),transparent calc(var(--cy) + 3px),#000 calc(var(--cy) + 3px));mask-composite:intersect}
.project{position:absolute;min-width:0}.project a{display:flex;flex-direction:column;gap:var(--space-3);transition:transform var(--motion-base) var(--ease),opacity var(--motion-base),filter var(--motion-base)}
.project.is-focused a{transform:translateY(calc(-1 * var(--project-lift)))}
.work-plane.has-focus .project:not(.is-focused) a{opacity:var(--project-dim);filter:blur(var(--project-defocus))}
.project-meta{display:flex;align-items:baseline;padding-bottom:var(--space-1)}.project-date{font-size:var(--meta);line-height:16px;color:var(--quiet);font-variant-numeric:tabular-nums}
.project-cover{position:relative;width:100%;background:var(--placeholder)}
.project-cover:after{content:'';position:absolute;inset:-6px;opacity:0;transition:opacity var(--motion-fast);background:linear-gradient(var(--ink),var(--ink)) left top/12px 1px no-repeat,linear-gradient(var(--ink),var(--ink)) left top/1px 12px no-repeat,linear-gradient(var(--ink),var(--ink)) right top/12px 1px no-repeat,linear-gradient(var(--ink),var(--ink)) right top/1px 12px no-repeat,linear-gradient(var(--ink),var(--ink)) left bottom/12px 1px no-repeat,linear-gradient(var(--ink),var(--ink)) left bottom/1px 12px no-repeat,linear-gradient(var(--ink),var(--ink)) right bottom/12px 1px no-repeat,linear-gradient(var(--ink),var(--ink)) right bottom/1px 12px no-repeat}
.project-title{display:flex;justify-content:space-between;align-items:center;gap:var(--space-2)}.project-title h3{font-size:var(--title);line-height:1.4;letter-spacing:-.02em}.project-title>span{color:var(--secondary);transition:transform var(--motion-base) var(--ease)}.project-description{font-size:var(--body);line-height:1.7;color:var(--secondary)}
.miko{left:5%;top:16%;width:32%}.miko .project-cover{height:28vh}
.insta360{left:43%;top:44%;width:28%}.insta360 .project-cover{height:26vh}
.talkai{left:77%;top:20%;width:23%}.talkai .project-cover{height:29vh}
.project a:hover .project-title>span{transform:translate(3px,-3px)}.project a:hover .project-cover:after,.project a:focus-visible .project-cover:after{opacity:1}
.crosshair{position:absolute;inset:0;z-index:8;pointer-events:none;opacity:0;--cx:50%;--cy:50%}.crosshair.is-visible{opacity:1}
.cross-v{position:absolute;top:0;bottom:0;left:var(--cx);width:var(--stroke);background:var(--line)}.cross-h{position:absolute;left:0;right:0;top:var(--cy);height:var(--stroke);background:var(--line)}
.cross-point{display:none;position:absolute;left:var(--cx);top:var(--cy);width:var(--node);height:var(--node);background:var(--ink);border-radius:50%;transform:translate(-50%,-50%)}.coordinate-label{position:absolute;font-size:var(--meta);line-height:16px;color:var(--secondary);background:var(--paper);padding:var(--space-1) var(--space-2);white-space:nowrap}
.continuity{position:absolute;inset:0;pointer-events:none;z-index:4}.shared-axis{position:absolute;left:0;top:0;width:1px;height:1px;transform-origin:0 0;background:var(--line)}.axis-vertical{width:var(--stroke)}.axis-horizontal{height:var(--stroke)}
.origin:after{content:"";position:absolute;left:calc(50% - .5px);top:50%;width:var(--stroke);height:var(--cue-length);background:linear-gradient(to bottom,var(--line),transparent);opacity:var(--tail-opacity,1);pointer-events:none}
.origin{position:absolute;left:0;top:0;width:var(--point);height:var(--point);border-radius:50%;background:var(--ink);transform:translate(-50%,-50%)}
/* Contacts remain projected spatial nodes, never a separate list of controls. */
.space{position:absolute;inset:0;touch-action:auto;outline-offset:-10px!important}.space-geometry{position:absolute;inset:0;pointer-events:none}
.space-line{position:absolute;left:0;top:0;height:var(--stroke);background:var(--line);transform-origin:0 0;pointer-events:none;transition:background var(--motion-fast)}.space-line.is-guide{height:0;background:none;border-top:1px dashed var(--space-guide)}
.space-endpoint{position:absolute;width:var(--node-emphasis);height:var(--node-emphasis);border-radius:50%;background:var(--secondary);pointer-events:none;transition:background var(--motion-fast)}
.space[data-highlight=x] [data-axis-line=x-positive],.space[data-highlight=y] [data-axis-line=y-positive],.space[data-highlight=z] [data-axis-line=z-positive],.space[data-selected=x] [data-axis-line=x-positive],.space[data-selected=y] [data-axis-line=y-positive],.space[data-selected=z] [data-axis-line=z-positive]{background:var(--secondary)}
.space[data-highlight=x] [data-endpoint=x],.space[data-highlight=y] [data-endpoint=y],.space[data-highlight=z] [data-endpoint=z]{background:var(--ink)}
.space-origin{position:absolute;pointer-events:none}.space-origin i{display:block;width:var(--point);height:var(--point);border-radius:50%;background:var(--ink);transform:translate(-50%,-50%)}.space-origin>span{position:absolute;left:var(--space-4);top:var(--space-3);font-size:var(--meta);line-height:16px;color:var(--quiet);white-space:nowrap}.space[data-open=true] .space-origin>span{opacity:0}
.contact-label{position:absolute;left:0;top:0;width:var(--contact-label-width);padding:0;cursor:default;z-index:2}
.contact-label.is-expanded{width:var(--contact-detail-width)}
.contact-label:focus-within{opacity:1!important}
.contact-trigger{position:relative;width:100%;min-height:64px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;text-align:left;padding:0 var(--space-8) 0 0;gap:var(--space-2)}
.contact-name{font-size:var(--contact-title);line-height:1.3;letter-spacing:-.025em}.contact-caption{font-size:var(--meta);line-height:18px;color:var(--quiet)}.contact-caption[hidden]{display:none}.contact-indicator{position:absolute;right:var(--space-1);top:var(--space-3);color:var(--quiet);transition:transform var(--motion-base) var(--ease),opacity var(--motion-fast)}.contact-label:hover .contact-indicator{transform:translate(2px,-2px)}.contact-label.is-expanded .contact-indicator{opacity:0}.contact-label.is-expanded .contact-trigger{min-height:44px}
.contact-details{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:var(--space-3);padding:var(--space-2) 0;transition:opacity var(--motion-base) var(--ease),transform var(--motion-base) var(--ease)}.space[data-arriving=true] .contact-details{opacity:0;transform:translateY(4px)}.contact-details[hidden]{display:none}.contact-details>p,.contact-details>a{display:block;min-width:0;font-size:var(--body);line-height:24px;color:var(--secondary);overflow-wrap:anywhere}
.contact-details>button{display:flex;align-items:center;justify-content:flex-end;gap:6px;min-height:44px;margin-top:-10px;font-size:var(--meta);line-height:18px;color:var(--quiet);white-space:nowrap;transition:color var(--motion-fast)}.contact-details>button:hover{color:var(--ink)}.contact-details>a:hover{text-decoration:underline}.icon-copy{display:inline-block;width:14px;height:14px;flex:none;background:currentColor;mask:url('assets/copy.svg') center/contain no-repeat;-webkit-mask:url('assets/copy.svg') center/contain no-repeat}

.icon-arrow-up-right,.icon-arrow-down{display:inline-block;flex-shrink:0;width:16px;height:16px;background:currentColor;mask:var(--arrow) center/contain no-repeat;-webkit-mask:var(--arrow) center/contain no-repeat}.icon-arrow-up-right{--arrow:url('assets/arrow-up-right.svg')}.icon-arrow-down{--arrow:url('assets/arrow-down.svg')}
.toast{position:fixed;left:50%;bottom:var(--space-8);transform:translate(-50%,8px);z-index:70;background:var(--ink);color:var(--paper);padding:var(--space-3) var(--space-4);font-size:var(--ui);opacity:0;pointer-events:none;transition:opacity var(--motion-fast),transform var(--motion-fast)}.toast.visible{opacity:1;transform:translate(-50%,0)}
.loading{position:fixed;inset:0;background:var(--paper);z-index:100;display:grid;place-items:center;pointer-events:none}.loading[hidden]{display:none}.loading-percent{font-family:"Fragment Mono",monospace;font-size:20px;font-weight:400;line-height:1;font-variant-numeric:tabular-nums;color:var(--ink)}.loading.is-done{opacity:0;transition:opacity var(--motion-base)}.noscript-note{padding:var(--space-6)}
.is-ready .navigation{opacity:0;pointer-events:none;transform:translateX(-8px)}.is-ready .navigation.is-visible{pointer-events:auto}
@media(min-width:961px) and (max-height:850px){:root{--display:44px;--body:13px;--timeline-top:28vh;--section-bottom:6vh}.about-panel{--display:40px;--body:12px}.timeline{row-gap:var(--space-4)}.entry-role{margin-bottom:var(--space-2)}.entry-description{line-height:1.6}.column-label{top:-32px}.project a{gap:var(--space-2)}}
/* Compact desktops keep readable columns; dates remain on the inner edge. */
@media(min-width:961px) and (max-width:1380px) and (max-height:850px){
 .about-panel{--timeline-top:26vh;--section-bottom:32px;--tick-length:24px}
 .timeline{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:8px var(--grid-gap);grid-template-rows:repeat(3,1fr)}
 .timeline-entry{position:relative;left:auto;right:auto;top:auto;align-self:start;width:auto}
 .education{grid-column:3/span 4}.career{grid-column:8/-1}
 .red{grid-row:1}.insta{grid-row:2}.bairong{grid-row:3}.bnu{grid-row:2;transform:translateY(32px)}.cuc{grid-row:3;transform:translateY(16px)}
 .timeline-entry time{position:relative;top:auto;left:auto;transform:none;display:block;margin-bottom:8px}.education time{text-align:right;padding-right:32px}.career time{left:-24px}
 .timeline-entry:before{top:6px}.timeline-tick{top:8px}.career:before{left:calc(-1 * var(--grid-unit) - var(--grid-gap)/2 - var(--node)/2)}.career .timeline-tick{left:calc(-1 * var(--grid-unit) - var(--grid-gap)/2)}
 .entry-content h3{font-size:18px}.entry-role{margin-bottom:var(--space-1)}
}
@media(max-width:960px){
 :root{--gutter:clamp(24px,5vw,48px);--grid-gap:24px;--header:72px;--display:40px;--title:20px;--body:14px;--ui:14px;--meta:11px;--contact-title:24px;--contact-label-width:min(148px,calc((100vw - 2 * var(--gutter) - var(--space-4)) / 2));--contact-detail-width:min(280px,calc(100vw - 2 * var(--gutter)));--content-start:var(--gutter);--heading-top:104px;--timeline-top:200px;--section-bottom:var(--space-20)}
 .home-hint{display:none}.navigation{left:var(--gutter);right:var(--gutter);top:auto;translate:none;bottom:var(--space-4);flex-direction:row;justify-content:space-between;gap:var(--space-4);background:var(--paper);padding:var(--space-1) 0;border-top:1px solid var(--line)}.navigation a{min-width:0;gap:var(--space-2)}
 .panel{min-height:100svh;height:auto}.continuity{overflow:clip}
 .home-panel{height:100svh!important}.dot-wordmark{width:calc(100% - 2 * var(--gutter));top:var(--home-wordmark-top)}.explore{top:var(--home-cue-top)}
 .about-panel{--display:36px;--body:13px;padding:var(--timeline-top) var(--gutter) 128px}.timeline{position:relative;inset:auto;display:flex;flex-direction:column;gap:0;border-left:1px solid var(--line)}
 .column-label{position:relative;top:auto;left:auto!important;right:auto;text-align:left;font-size:var(--ui);line-height:20px;margin:0 0 var(--space-8) var(--space-8)}.career-label{margin-top:var(--space-8)}.education-label{order:0}.bnu{order:1}.cuc{order:2}.career-label{order:3}.red{order:4}.insta{order:5}.bairong{order:6}
 .timeline-entry{position:relative;left:auto;right:auto;top:auto;align-self:auto;width:auto;transform:none;margin-left:var(--space-8);margin-bottom:var(--space-8)}.timeline-entry:last-child{margin-bottom:0}.timeline-entry .entry-content{max-width:55ch}.timeline-entry time{position:relative;left:auto;top:auto;transform:none;display:block;margin-bottom:8px}.timeline-entry:before{left:-34.5px;top:6px}.timeline-tick{left:calc(-1 * var(--space-8))!important;right:auto!important;width:var(--space-4);top:8px}.entry-description{line-height:1.75}
 .work-panel{height:auto!important;min-height:100svh!important;padding:var(--timeline-top) var(--gutter) 128px}.work-plane{position:relative;inset:auto;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));column-gap:var(--grid-gap);row-gap:var(--space-12);min-height:0;overflow:visible}.plane-grid{background-size:calc((100% + var(--grid-gap))/6) 100%}
 .project{position:relative;left:auto;top:auto;width:100%}.project-cover{height:auto!important}.miko .project-cover{aspect-ratio:5/3}.insta360 .project-cover{aspect-ratio:5/3}.talkai .project-cover{aspect-ratio:6/5}.miko{grid-column:1/span 4;grid-row:1}.talkai{grid-column:4/span 3;grid-row:2;margin-top:0}.insta360{grid-column:1/span 3;grid-row:2;margin-top:var(--space-20)}.project-description{font-size:var(--body)}.crosshair{display:none}
 .contact-panel{height:max(820px,100svh)!important}.space{inset:184px 0 128px}.contact-trigger{min-height:64px;padding-right:var(--space-6)}.contact-details{gap:var(--space-2)}.toast{bottom:88px;max-width:calc(100vw - 32px);white-space:nowrap}.space:focus-visible{outline-offset:-18px!important}
}
@media(max-width:540px){
 :root{--grid-gap:16px;--display:36px;--contact-title:22px;--title:20px}
 .about-panel{--display:34px}.dot-wordmark circle{r:1.05px}.work-plane{grid-template-columns:repeat(4,minmax(0,1fr));row-gap:var(--space-12)}.plane-grid{background-size:calc((100% + var(--grid-gap))/4) 100%}.miko{grid-column:1/-1;grid-row:1}.insta360{grid-column:1/span 3;grid-row:2;margin-top:0}.talkai{grid-column:2/span 3;grid-row:3;margin-top:0}.miko .project-cover{aspect-ratio:5/3}.insta360 .project-cover{aspect-ratio:5/3}.talkai .project-cover{aspect-ratio:6/5}.project-meta{padding-bottom:0}.project a{gap:var(--space-2)}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition-duration:.01ms!important}}

/* Individually translated content preserves the grid and each component's own
   transforms. Visible by default, even if the module cannot load. No per-letter
   splits, masks, layout animation, or permanent compositor-layer promotion. */
[data-reveal]{opacity:var(--reveal-opacity,1);translate:0 var(--reveal-y,0px)}
.project-cover[data-reveal]{opacity:calc(var(--reveal-opacity,1) * var(--media-focus,1))}
[data-reveal]:focus,[data-reveal-group]:focus-within [data-reveal]{opacity:1!important;translate:none!important}
@media(prefers-reduced-motion:reduce){[data-reveal]{opacity:1!important;translate:none!important}}

/* One temporary geometry bridge crosses section clipping during the unfolding. */
.space-bridge{position:absolute;inset:0;pointer-events:none}.space-bridge[hidden]{display:none}.bridge-origin{position:absolute;left:0;top:0;width:var(--point);height:var(--point);border-radius:50%;background:var(--ink)}