.hero{position:relative;isolation:isolate}.hero>*{position:relative;z-index:1}.hero>.ascii-hero{position:absolute;inset:0;width:100%;height:100%;max-width:none;margin:0;z-index:0;pointer-events:none}.ascii-philosophy{position:relative;isolation:isolate;height:300px;margin-top:28px;margin-bottom:25px;display:flex;align-items:center;justify-content:center}.ascii-philosophy canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}.ascii-quote{font:400 clamp(18px,1.65vw,23px)/1.75 'Dan Pixel Square','Fusion zh',monospace;text-align:center;max-width:850px;padding:15px;margin:0}.project-ribbon{position:relative;overflow:hidden;margin:20px 0 0;background:#f0ece2;padding-bottom:28px}.ribbon-track{display:flex;width:max-content;animation:index-flow 32s linear infinite}.ribbon-group{display:flex;flex-shrink:0}.ribbon-group a{display:flex;align-items:center;padding:20px 32px;font:13px/1.4 'Geist Mono','Sarasa UI SC',monospace;letter-spacing:.04em;white-space:nowrap}.ribbon-lemon{background:#e32620;color:#fff}.ribbon-unseen{background:#181818;color:#fff}.ribbon-studio{background:#edd251;color:#181818}.project-ribbon:hover .ribbon-track,.project-ribbon:focus-within .ribbon-track,.project-ribbon[data-paused=true] .ribbon-track{animation-play-state:paused}.ribbon-pause{position:absolute;bottom:2px;right:12px;background:none;border:0;font:10px/20px 'Geist Mono','Sarasa UI SC',monospace;color:#5c584f;cursor:pointer}.open-engineering{display:block;border:0;border-bottom:1px solid #9d9992;padding:5px 0;margin-top:20px;background:none;font:12px/1.5 'Geist Mono','Sarasa UI SC',monospace;cursor:pointer;text-align:left}.study-motion-controls{position:fixed;bottom:12px;left:12px;z-index:120;background:#fffffff0;border:1px solid #d9d7d0;padding:7px 10px;display:flex;gap:12px;font:10px/1.5 'Geist Mono','Sarasa UI SC',monospace}.study-motion-controls button{font:inherit;background:none;border:0;border-bottom:1px solid #888;cursor:pointer;color:#171717}.engineering-reader{width:min(1220px,96vw);max-height:90svh;padding:0;border:1px solid #181818;background:#f5f3ed;color:#171717;box-shadow:0 25px 100px #0003}.engineering-reader::backdrop{background:#17171777}.reader-titlebar{display:flex;justify-content:space-between;align-items:center;padding:13px 18px;background:#181818;color:#f5f3ed;gap:15px;font:12px/1.5 'Geist Mono','Sarasa UI SC',monospace}.reader-titlebar button{color:inherit;background:none;border:0;cursor:pointer;font:inherit}.reader-tabs{display:flex;gap:6px;padding:14px 18px 0;flex-wrap:wrap}.reader-tabs button{background:none;border:1px solid #d4d0c7;padding:7px 12px;font:12px 'Geist Mono','Sarasa UI SC',monospace;cursor:pointer}.reader-tabs button[aria-selected=true]{background:#181818;color:#fff;border-color:#181818}.reader-content{padding:22px 18px}.reader-caption{font:12px/1.6 'Geist Mono','Sarasa UI SC',monospace;margin:0 0 22px;color:#68645b}.reader-diagram{overflow:auto}.reader-diagram svg{width:100%;height:auto;display:block;min-width:800px}.reader-content pre{margin:0;padding:20px;background:#181818;color:#ece9df;overflow:auto;max-height:52svh;tab-size:2;font:12px/1.7 'Geist Mono','Sarasa UI SC',monospace;white-space:pre-wrap;overflow-wrap:anywhere}.reader-source{font:10px/1.6 'Geist Mono','Sarasa UI SC',monospace;margin-top:16px;color:#777}.reader-source a{text-decoration:underline}:focus-visible{outline:2px solid #843f35;outline-offset:4px}@keyframes index-flow{to{transform:translateX(-50%)}}@media(max-width:767px){.ascii-philosophy{height:300px;margin-top:12px}.ascii-quote{font-size:16px;line-height:1.9;padding:12px}.ribbon-group a{font-size:11px;padding:16px 20px}.study-motion-controls{font-size:9px;bottom:8px;gap:8px}.reader-titlebar{font-size:10px}.reader-content{padding:20px 12px}.reader-tabs button{font-size:11px}.reader-diagram svg{min-width:820px}.engineering-reader{max-height:92svh}.study-badge{bottom:43px}}@media(prefers-reduced-motion:reduce){.ribbon-track{animation:none}.ribbon-group[aria-hidden=true]{display:none}}

.ascii-philosophy,#works,#unseen-entry,#studio,#about,#contact{scroll-margin-top:160px}.reader-diagram svg text[x="0"]{font-size:12px}
/* Exact-reference comparison v2: motion is the spacing, not extra margins. */
@font-face{font-family:'Doto Study';src:url('/studies/home-ascii-study/Doto.ttf') format('truetype');font-weight:100 900;font-display:swap}
.pillars{padding-bottom:0!important}.ascii-philosophy{margin-top:0!important;margin-bottom:0!important;height:270px;width:min(var(--max),100% - 2 * var(--gutter))}.ascii-quote{position:relative;font-size:clamp(15px,1.55vw,21px);line-height:1.9;max-width:100%;padding:10px 16px;color:#181818}.project-ribbon{padding-bottom:0;margin-top:0;background:none}.ribbon-group a{font-family:'Doto Study','Fusion zh','Geist Mono',monospace;font-weight:750;font-size:17px;letter-spacing:.035em;padding:17px 28px}.ribbon-group .tone-0{background:#b11b17;color:#fff}.ribbon-group .tone-1{background:#181818;color:#fff}.ribbon-group .tone-2{background:#dedbd3;color:#181818}.ribbon-group .tone-3{background:#dfbd38;color:#181818}.ribbon-pause{position:static;line-height:1.5}.study-motion-controls{max-width:calc(100vw - 24px);flex-wrap:wrap}.project-preview{width:min(620px,92vw);padding:35px;background:#f4f0e6;color:#181818;border:1px solid #181818;font-family:'Geist Mono','Sarasa UI SC',monospace}.project-preview::backdrop{background:#18181866}.project-preview [data-close]{float:right;border:0;background:none;font-size:25px;cursor:pointer}.project-preview small{font-size:11px;color:#843f35}.project-preview h2{font:400 28px/1.4 'Dan Pixel Square','Fusion zh',monospace;margin:20px 0}.project-preview p{font-size:14px;line-height:1.9}.project-preview a{display:block;margin-top:30px;font-size:12px;text-decoration:underline}.hero>.ascii-hero{opacity:1}
@media(max-width:767px){.ascii-philosophy{height:270px}.ascii-quote{font-size:15px;line-height:1.9}.ribbon-group a{font-size:15px;padding:15px 22px}.study-motion-controls{bottom:8px}.study-badge{bottom:75px}}

/* v3: selected white ground and lighter movement. */
:root{--bg:#fff!important;--paper:#fff!important}html,body,.hero,.pillars,.works,.studio,.about,.contact,.navbar{background-color:#fff!important}.ascii-philosophy{background:#fff!important}.project-preview,.engineering-reader{background:#fff!important}.ascii-hero{image-rendering:auto}.ascii-quote{color:#181818}

/* v4 / Full-bleed underlay and white foreground surfaces. */
.ascii-depth{position:relative;isolation:isolate;background:#fff;overflow:clip}.ascii-depth>.ascii-underlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;mask-image:linear-gradient(to bottom,#0003,#0006 45%,#000 72%)}.ascii-depth>.hero,.ascii-depth>.pillars,.ascii-depth>.ascii-philosophy{position:relative;z-index:1;background:transparent!important}.ascii-depth>.hero{isolation:auto}.ascii-depth>.hero>.ascii-hero{z-index:0}.ascii-depth>.hero>.hero__lede,.ascii-depth>.hero>.hero__meta,.ascii-depth>.hero>.hero__name-row{z-index:1;background:#fff}.ascii-depth .pillars__grid{position:relative;z-index:1}.ascii-depth .pillar{background:#fff;border-color:#dedbd8;box-shadow:0 4px 14px #22222205}.ascii-depth .ascii-philosophy{width:100%!important;max-width:none!important;margin:0!important;height:270px}.ascii-depth .ascii-quote{width:min(1050px,calc(100% - 40px));margin-inline:auto}.ascii-depth .hero__name-row{box-shadow:0 18px 26px #ffffff66}.ascii-depth .pillars{border:0!important}@media(max-width:767px){.ascii-depth .ascii-philosophy{height:270px}.ascii-depth>.ascii-underlay{mask-image:linear-gradient(to bottom,#0002,#0005 40%,#000 70%)}}

/* v5: persistent typing caret, continuous surface without white rectangular patches. */
.hero__lede .typing-done .typing-caret{animation:none!important;opacity:1!important}.ascii-depth>.hero>.hero__lede,.ascii-depth>.hero>.hero__meta,.ascii-depth>.hero>.hero__name-row{background:transparent!important;box-shadow:none}.navbar #lang{font-family:'Geist Mono','Sarasa UI SC',monospace}.navbar #lang .decode-label{min-width:0!important}
/* v5 / Lightweight engineering-panel cards; no fake window actions or loading delays. */
.ascii-depth .pillar{border-radius:0;padding:0 24px 24px;gap:18px;overflow:hidden;box-shadow:0 4px 12px #20202006}.ascii-depth .pillar__icon--tile{display:flex;align-items:center;box-sizing:border-box;flex:none;width:calc(100% + 48px);height:42px;margin:0 -24px;padding:0 24px;border-bottom:1px solid #e2dfdb;background:#faf9f7;color:#843f35}.ascii-depth .pillar__title{margin-top:0}@media(max-width:767px){.ascii-depth .pillar{padding:0 20px 22px}.ascii-depth .pillar__icon--tile{width:calc(100% + 40px);margin-inline:-20px;padding-inline:20px}}

/* v6 / Ongoing caret blink and simple capability cards. Base palette only on index. */
@keyframes intro-caret-loop{0%,49%{visibility:visible}50%,100%{visibility:hidden}}
.hero__lede .typing-done .typing-caret{animation:intro-caret-loop 1.1s steps(1,end) infinite!important;opacity:1!important}
.ascii-depth .pillar{border-radius:8px;padding:24px;gap:20px;overflow:visible;box-shadow:0 4px 14px #22222205}.ascii-depth .pillar__icon--tile{display:block;flex:0 0 auto;width:32px;height:32px;margin:0;padding:0;border:0;background:transparent;line-height:16px;color:#843f35}
.ribbon-group .tone-0{background:#fc401f;color:#0a0b0d}.ribbon-group .tone-1{background:#0000ff;color:#fff}.ribbon-group .tone-2{background:#0a0b0d;color:#fff}.ribbon-group .tone-3{background:#ffd12f;color:#0a0b0d}
@media(prefers-reduced-motion:reduce){.hero__lede .typing-done .typing-caret{animation:none!important;visibility:visible!important}}
/* v7 / Reserve motion for the signature; keep navigation and projects legible. */
.ascii-depth>.ascii-underlay{mask-image:linear-gradient(to bottom,transparent 0%,transparent 48%,#0003 64%,#0008 100%)}
.project-ribbon{background:#fff;padding:20px 0 14px;margin:0}.ribbon-track{animation-duration:52s}.ribbon-group{gap:12px;padding-right:12px;align-items:center}.ribbon-group a{border-radius:4px;padding:9px 18px;min-height:40px;font-size:14px;line-height:22px;letter-spacing:.02em}.project-ribbon[data-visible=false] .ribbon-track{animation-play-state:paused}
#works>.section-head{gap:20px;flex-wrap:wrap}#works>.section-head>span{margin-left:auto}.works-browse{display:flex;gap:14px;align-items:center;font:11px 'Geist Mono',monospace}.works-browse button{width:40px;height:40px;border:1px solid #dedbd8;border-radius:50%;background:#fff;font:18px monospace;cursor:pointer}.works-browse button:disabled{opacity:.25;cursor:default}.works-track{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 48px)/3);gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;padding-bottom:24px;align-items:start}.works-track::-webkit-scrollbar{display:none}.works-track>.study-work{display:flex;flex-direction:column;gap:0;padding:0 0 20px;border:0;min-width:0;width:100%;scroll-snap-align:start;opacity:1!important;transform:none!important}.works-track .work-media{order:-1;width:100%;aspect-ratio:1.35;align-self:stretch;margin:0 0 24px;flex:none;position:relative;border-radius:5px;background:#f4f4f2;overflow:hidden}.works-track .unseen-work .work-media{padding:12px}.works-track .work-copy{width:100%;min-width:0}.works-track .work-copy>span{font-size:11px;letter-spacing:.02em}.works-track .work-copy h3{font-size:clamp(24px,2.6vw,38px);line-height:1.15;margin:18px 0 15px;letter-spacing:-.025em}.works-track .work-copy>p{font-size:14px;line-height:1.75;margin:0 0 20px;max-width:36em}.works-track .work-copy dl{font-size:12px;line-height:1.6;margin:20px 0}.works-track .work-copy dt{font-size:10px;margin-top:9px}.works-track .work-copy dd{margin:3px 0}.works-track .work-copy>a{font-size:12px}.works-track .work-copy>small{display:block;color:#777;font:10px/1.6 'Geist Mono','Sarasa UI SC',monospace;margin:20px 0}.works-track .open-engineering{font-size:11px}.works-track .cover-label,.works-track .cover-foot{position:absolute;left:18px;right:18px;font:9px/1.6 'Geist Mono',monospace;color:#777}.works-track .cover-label{top:14px}.works-track .cover-foot{bottom:14px}.works-track .cover-type{background:#eeeae3;color:#171717;display:flex;align-items:center;padding:25px}.works-track .cover-type strong{font:700 clamp(32px,4vw,60px)/.83 sans-serif;letter-spacing:-.06em;position:relative}.cover-dot{display:inline-block;width:.65em;height:.65em;background:#fc401f;border-radius:50%;margin-left:.12em}.works-track .cover-map{background:#f4f4f2;padding:48px 16px}.works-track .cover-map img{object-fit:contain;width:100%;height:100%}.works-track .cover-more{background:#0a0b0d;color:#eef0f3;display:flex;align-items:center;padding:24px}.works-track .cover-more strong{font:400 clamp(26px,3vw,44px)/1 'Dan Pixel Square',monospace}.works-track .cover-more .cover-label,.works-track .cover-more .cover-foot{color:#b1b7c3}
@media(max-width:1000px) and (min-width:768px){.works-track{grid-auto-columns:calc((100% - 24px)/2)}}@media(max-width:767px){.works-track{grid-auto-columns:88%;gap:18px}.works-track .work-copy h3,html[lang=zh-CN] .works-track .work-copy h3{font-size:28px}.works-track .work-media{aspect-ratio:1.35}.works-browse{gap:9px}#works>.section-head>span{margin-left:0;font-size:9px}.ribbon-group a{font-size:12px;padding:8px 14px}.project-ribbon{padding-block:15px}}
.works-track .cover-label,.works-track .cover-foot{font-size:10px;color:#686868}.works-track .work-copy>span,.works-track .work-copy>small,.works-track .work-copy dt{color:#686868}#works>.section-head>span{color:#686868;font-size:11px}
