:root{--bg:#f5f6f6;--paper:#fff;--ink:#202523;--muted:#59615e;--line:#d5dbd7;--accent:#ba382a;--green:#176958;--zoom:1;font-size:16px;color-scheme:light}
*{box-sizing:border-box;letter-spacing:0}[hidden]{display:none!important}html{scroll-behavior:smooth;scroll-padding-top:110px}html.is-restoring-position{scroll-behavior:auto!important}body{margin:0;background:var(--bg);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;line-height:1.8}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button:disabled{opacity:.35;cursor:default}a:focus-visible,button:focus-visible{outline:3px solid var(--green);outline-offset:5px}::selection{background:#bce8d4;color:#172d26}h1,h2,h3,p{overflow-wrap:anywhere}h1,h2,h3{line-height:1.25}h1{font-size:72px;margin:0;font-weight:750}h2{font-size:36px;margin:0}h3{font-size:21px;margin:0 0 12px}p{margin:0 0 16px}main{width:min(1160px,calc(100% - 64px));margin:auto}
.site-header{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px max(32px,calc((100vw - 1160px)/2));background:#f5f6f6ed;border-bottom:1px solid var(--line);backdrop-filter:blur(16px)}.brand{display:flex;gap:12px;align-items:center;font-weight:750;white-space:nowrap}.brand-mark{display:grid;place-items:center;width:34px;height:34px;background:var(--ink);color:white;border-radius:4px}.nav{display:flex;gap:26px;font-size:14px}.nav a{position:relative;padding:6px 0;color:var(--muted)}.nav a::after{content:"";position:absolute;bottom:0;left:0;width:100%;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .25s}.nav a:hover::after,.nav a[aria-current]::after{transform:scaleX(1)}.nav a[aria-current]{color:var(--ink)}
.music-toggle{position:relative;display:grid;place-items:center;width:34px;height:34px;margin-left:-4px;padding:0;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--muted);transition:color .2s,border-color .2s,background .2s}.music-toggle>svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.music-toggle:hover,.music-toggle.is-playing{color:var(--green);border-color:var(--green)}.music-toggle.is-playing{background:#e8f1ed}.music-bars{position:absolute;display:flex;align-items:flex-end;gap:1px;right:1px;bottom:2px;height:9px;padding:2px;background:var(--bg);border-radius:5px}.music-bars i{display:block;width:2px;height:3px;background:currentColor;border-radius:2px;transform-origin:bottom}.music-toggle.is-playing .music-bars i{animation:music-bar .8s ease-in-out infinite alternate}.music-toggle.is-playing .music-bars i:nth-child(2){animation-delay:-.35s}.music-toggle.is-playing .music-bars i:nth-child(3){animation-delay:-.6s}@keyframes music-bar{50%{transform:scaleY(2.7)}100%{transform:scaleY(1.4)}}
.hero{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:60px;align-items:center;min-height:min(740px,78svh);padding:70px 0}.eyebrow{color:var(--accent);font:600 12px/1.6 ui-monospace,SFMono-Regular,monospace;margin:0 0 20px;text-transform:uppercase}.hero-subtitle{display:block;font-family:"Songti SC","Noto Serif CJK SC",serif;font-size:34px;font-weight:500;margin-top:22px}.hero-copy{color:var(--muted);font-size:17px;max-width:640px;margin:30px 0}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;font-size:13px}.button{padding:11px 16px;border:1px solid var(--line);border-radius:4px}.primary{background:var(--ink);color:white}.secondary{color:var(--muted)}.profile-panel{border-left:1px solid var(--line);padding-left:30px}.profile-panel canvas{display:block;width:100%;aspect-ratio:640/340;margin-bottom:26px}.profile-panel dl{margin:0;display:grid;gap:14px}.profile-panel dl>div{display:grid;grid-template-columns:40px 1fr;gap:10px}.profile-panel dt{font-size:12px;color:var(--accent);padding-top:3px}.profile-panel dd{font-size:14px;margin:0}
.section{padding:76px 0;border-top:1px solid var(--line)}.intro,.split,.future,.life{display:grid;grid-template-columns:1fr 1.65fr;gap:65px}.intro>p,.future>p,.life-copy{color:var(--muted);font-size:18px}.time{font-family:ui-monospace,monospace;color:var(--green)}.timeline-item p,.project-card p,.story p{color:var(--muted);margin:0}.filters{display:flex;gap:24px;flex-wrap:wrap;margin:28px 0 24px;border-bottom:1px solid var(--line)}.filters button{border:0;border-bottom:2px solid transparent;padding:10px 0;background:none;font-size:14px}.filters button[aria-pressed=true]{color:var(--accent);border-color:var(--accent)}.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.project-card{position:relative;display:flex;flex-direction:column;min-height:300px;background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:26px;transition:transform .3s,box-shadow .3s,border-color .3s;transform:perspective(800px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) scale(var(--scale,1))}.project-card:hover{--scale:1.025;border-color:var(--green);box-shadow:0 14px 30px #182e2310;z-index:2}.project-card:active{--scale:.98}.project-card h3{margin-top:24px}.card-top{display:flex;justify-content:space-between;color:var(--accent);font:12px ui-monospace,monospace}.project-card p{font-size:14px}.card-bottom{margin-top:auto;padding-top:24px;font-size:12px;color:var(--green);display:flex;justify-content:space-between;align-items:center}.card-arrow{font-size:22px;transition:transform .25s}.project-card:hover .card-arrow{transform:translate(3px,-3px)}.story-list{display:grid;gap:32px}.story{padding-bottom:30px;border-bottom:1px solid var(--line)}.story>a{display:inline-block;color:var(--green);border-bottom:1px solid;margin-top:16px;font-size:14px}.hobbies{list-style:none;display:flex;flex-wrap:wrap;gap:0;margin:30px 0 0;padding:0}.hobbies li{padding:8px 18px 8px 0;margin-right:18px;border-top:1px solid var(--line);color:var(--green);transition:color .2s,transform .2s}.hobbies li:hover{color:var(--accent);transform:translateY(-4px)}
.technology-entry{display:grid;grid-template-columns:130px minmax(0,1fr) auto;align-items:center;gap:24px;margin:32px 0 6px;padding:24px 26px;border:1px solid var(--ink);border-radius:6px;background:var(--ink);color:white;transition:transform .25s,box-shadow .25s}.technology-entry:hover{transform:translateY(-3px);box-shadow:0 14px 30px #182e2320}.technology-entry-index{color:#9fd0c4;font:12px ui-monospace,monospace}.technology-entry strong{display:block;font-size:24px}.technology-entry small{display:block;margin-top:4px;color:#cbd3d0;font-size:14px}.technology-entry-arrow{font-size:28px;color:#9fd0c4}.technology-overview-head{padding-bottom:28px}.technology-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;padding:12px 0 76px}.technology-card{display:flex;flex-direction:column;min-height:310px;padding:24px;border:1px solid var(--line);border-radius:6px;background:var(--paper);transition:transform .25s,border-color .25s,box-shadow .25s}.technology-card:hover{transform:translateY(-4px);border-color:var(--green);box-shadow:0 14px 30px #182e2310}.technology-card-top{display:flex;justify-content:space-between;color:var(--accent);font:12px ui-monospace,monospace}.technology-card h2{margin:28px 0 14px;font-size:23px}.technology-card p{color:var(--muted);font-size:14px}.technology-card-tags{display:flex;flex-wrap:wrap;gap:6px 12px;margin-top:auto;padding-top:20px;color:var(--green);font:11px ui-monospace,monospace}.technology-card-arrow{margin-top:16px;color:var(--green);font-size:13px}.technology-body p+p{margin-top:14px}.technology-body .detail-next a{color:var(--green);text-decoration:none}.technology-body .detail-next a:last-child{margin-left:auto;text-align:right}
.technology-detail-shell{display:grid;grid-template-columns:190px minmax(0,820px);gap:54px;align-items:start;padding-bottom:30px}.technology-rail{position:sticky;top:110px;padding:18px 0;border-top:2px solid var(--ink);font-size:12px}.technology-rail-label,.technology-section-code{color:var(--accent)!important;font:600 11px/1.5 ui-monospace,SFMono-Regular,monospace;letter-spacing:.04em}.technology-rail nav{display:grid;margin-top:14px}.technology-rail a{padding:7px 0;color:var(--muted);border-bottom:1px solid var(--line)}.technology-rail a:hover{color:var(--green)}.technology-main-column{min-width:0}.technology-main-column .project-gallery,.technology-main-column .detail-body{max-width:none}.technology-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0 0 34px;border:1px solid var(--ink);background:var(--ink);gap:1px}.technology-facts>div{min-height:94px;padding:16px;background:var(--bg)}.technology-facts dt{color:var(--accent);font:10px ui-monospace,SFMono-Regular,monospace;text-transform:uppercase}.technology-facts dd{margin:10px 0 0;color:var(--ink);font:600 13px/1.45 ui-monospace,SFMono-Regular,monospace;overflow-wrap:anywhere}.technology-body>section{padding:38px 0}.technology-body h2{font-size:1.45em}.technology-flow{display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:1px;margin:24px 0 0;padding:1px;list-style:none;background:var(--ink)}.technology-flow li{position:relative;min-height:112px;padding:15px;background:var(--paper)}.technology-flow li:not(:last-child)::after{content:"→";position:absolute;right:-8px;top:42%;z-index:1;color:var(--accent);font-weight:700}.technology-flow-index{display:block;margin-bottom:18px;color:var(--accent);font:10px ui-monospace,monospace}.technology-flow code{color:var(--ink);font:600 12px/1.45 ui-monospace,SFMono-Regular,monospace;white-space:normal}.technology-table-wrap{overflow-x:auto;margin-top:22px}.technology-table{width:100%;border-collapse:collapse;font-size:13px}.technology-table th,.technology-table td{padding:13px 14px;border:1px solid var(--line);text-align:left;vertical-align:top}.technology-table th{background:var(--ink);color:white;font:600 11px ui-monospace,monospace}.technology-table td:first-child,.technology-table td:nth-child(2){font-family:ui-monospace,SFMono-Regular,monospace;color:var(--green)}.technology-table td:first-child{font-weight:700}.technology-constraints{border-top:2px solid var(--accent)!important}.technology-constraints ul{display:grid;gap:10px;margin:20px 0 0;padding:0;list-style:none}.technology-constraints li{position:relative;padding:12px 14px 12px 38px;border:1px solid var(--line);background:var(--paper)}.technology-constraints li::before{content:"!";position:absolute;left:14px;color:var(--accent);font:700 13px ui-monospace,monospace}
.contact{padding:44px 0 66px;border-top:2px solid var(--ink);display:flex;justify-content:space-between;align-items:center;gap:30px}.contact-actions{display:flex;flex-direction:column;gap:10px;font-size:16px}.contact-actions a{color:var(--green)}.footer{display:flex;justify-content:space-between;gap:20px;padding:24px 32px;border-top:1px solid var(--line);font:12px ui-monospace,monospace;color:var(--muted)}.progress{position:fixed;inset:0 auto auto 0;height:3px;width:100%;background:var(--accent);transform:scaleX(0);transform-origin:left;z-index:30}.click-ring{position:fixed;width:24px;height:24px;margin:-12px;pointer-events:none;border:1px solid var(--accent);border-radius:50%;z-index:50;animation:ring .55s ease-out forwards}@keyframes ring{to{transform:scale(3);opacity:0}}.reveal{opacity:0;transform:translateY(22px);transition:opacity .65s,transform .65s}.reveal.visible{opacity:1;transform:none}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.reading-tools{display:flex;align-items:center;gap:8px}.icon-button{display:grid;place-items:center;width:38px;height:38px;padding:0;background:transparent;border:1px solid var(--line);border-radius:4px}.icon-button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.reading-tools output{min-width:48px;font:12px ui-monospace,monospace;text-align:center}.detail-top{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:32px 0;border-bottom:1px solid var(--line)}.back-link{font-size:14px;color:var(--green)}.detail-head{padding:64px 0 40px;max-width:850px}.detail-head h1{font-size:52px}.detail-lead{font-size:20px;color:var(--muted);margin-top:24px}.tech-list{display:flex;flex-wrap:wrap;gap:8px 24px;margin-top:26px;color:var(--green);font-family:ui-monospace,monospace;font-size:14px}.detail-body{max-width:780px;padding-bottom:70px;font-size:calc(17px * var(--zoom))}.detail-body section{padding:28px 0;border-top:1px solid var(--line)}.detail-body h2{font-size:1.3em;margin-bottom:18px}.detail-body p,.detail-body li{color:var(--muted)}.detail-body ul{padding-left:22px}.detail-body a{color:var(--green);text-decoration:underline;text-underline-offset:4px}.detail-next{display:flex;justify-content:space-between;gap:24px;padding:30px 0;border-top:1px solid var(--line)}
@media(max-width:900px){h1{font-size:56px}.hero{gap:28px}.hero-subtitle{font-size:27px}.project-grid,.technology-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.intro,.split,.future,.life{gap:32px;grid-template-columns:1fr 1.6fr}.nav{gap:16px}.profile-panel{padding-left:20px}}
@media(max-width:900px){.technology-detail-shell{grid-template-columns:150px minmax(0,1fr);gap:30px}.technology-facts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){html{scroll-padding-top:130px}main{width:calc(100% - 40px)}.site-header{padding:12px 20px;flex-wrap:wrap;gap:8px}.nav{width:100%;justify-content:space-between;align-items:center;gap:8px}.music-toggle{width:30px;height:30px;margin-left:0}.hero{grid-template-columns:1fr;min-height:0;padding:44px 0;gap:24px}h1{font-size:44px}.hero-subtitle{font-size:26px}.hero-copy{font-size:16px;margin:24px 0}.profile-panel{border-left:0;border-top:1px solid var(--line);padding:20px 0 0}.profile-panel canvas{height:90px;aspect-ratio:auto;margin-bottom:16px}.profile-panel dl{gap:10px}.section{padding:48px 0}.intro,.split,.future,.life{grid-template-columns:1fr;gap:28px}h2{font-size:30px}.project-grid,.technology-grid{grid-template-columns:1fr}.project-card{min-height:260px}.technology-entry{grid-template-columns:1fr auto;gap:10px 16px;padding:20px}.technology-entry-index{grid-column:1/-1}.technology-entry strong{font-size:21px}.technology-entry small{font-size:13px}.technology-card{min-height:270px}.contact,.footer{align-items:flex-start;flex-direction:column}.detail-head h1{font-size:36px}.detail-head{padding-top:40px}.detail-lead{font-size:18px}.detail-top{gap:12px}.detail-next{flex-wrap:wrap}.filters{gap:20px}.intro>p,.future>p,.life-copy{font-size:17px}}
@media(max-width:640px){.technology-detail-shell{display:block}.technology-rail{position:static;margin-bottom:26px}.technology-rail nav{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}.technology-facts{grid-template-columns:1fr 1fr}.technology-facts>div{min-height:84px;padding:13px}.technology-flow{grid-template-columns:1fr}.technology-flow li{min-height:0}.technology-flow li:not(:last-child)::after{content:"↓";right:14px;top:auto;bottom:-12px}.technology-table{min-width:650px}.technology-body>section{padding:30px 0}}
.project-cover{aspect-ratio:16/10;margin:-26px -26px 22px;overflow:hidden;border-bottom:1px solid var(--line);border-radius:5px 5px 0 0;background:#eef3f0}.project-cover img{width:100%;height:100%;object-fit:contain;display:block;transition:transform .4s}.project-card:hover .project-cover img{transform:scale(1.035)}.project-gallery{max-width:1000px;margin-bottom:40px}.project-figure{margin:0}.image-trigger{display:block;width:100%;padding:0;border:1px solid var(--line);border-radius:6px;overflow:hidden;background:var(--paper);cursor:zoom-in}.image-trigger img{display:block;width:100%;height:auto;max-height:620px;object-fit:contain}.project-figure figcaption{margin-top:12px;font-size:13px;color:var(--muted)}.project-link-section{margin-top:26px;border-top:2px solid var(--ink)!important}.project-link-section a{display:inline-block;font-weight:700}.image-viewer{width:min(1200px,94vw);height:90svh;max-width:none;max-height:none;border:1px solid var(--line);border-radius:6px;padding:0;background:var(--bg);color:var(--ink)}.image-viewer[open]{display:grid;grid-template-rows:auto minmax(0,1fr)}.image-viewer::backdrop{background:#101916c9;backdrop-filter:blur(5px)}.viewer-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 20px;border-bottom:1px solid var(--line)}.viewer-title{margin:0;font-size:15px;font-weight:600}.viewer-bar .icon-button{font-size:24px}.viewer-stage{overflow:auto;min-height:0;padding:16px}.viewer-stage img{display:block;max-width:none;height:auto;margin:0 auto}.image-trigger:hover{border-color:var(--green)}
.project-technology-section{display:grid;grid-template-columns:minmax(220px,.72fr) minmax(0,1.28fr);gap:44px;margin-top:42px;padding:38px!important;border:0!important;background:var(--ink);color:white}.project-technology-heading h2{margin:7px 0 14px;color:white}.project-technology-heading>p:last-child{margin:0;color:#bdc9c5;font-size:14px}.project-technology-links{display:grid;gap:10px}.project-technology-link{display:flex;align-items:center;justify-content:space-between;gap:22px;padding:18px 20px;border:1px solid #ffffff2e;color:white;transition:background .2s,border-color .2s,transform .2s}.project-technology-link:hover{background:#ffffff0c;border-color:#9fd0c4;transform:translateX(4px)}.project-technology-link>span{display:grid;gap:5px}.project-technology-link small{color:#9fd0c4;font:10px ui-monospace,SFMono-Regular,monospace;text-transform:uppercase}.project-technology-link strong{font-size:18px}.project-technology-link span span{color:#bdc9c5;font-size:12px;line-height:1.55}.project-technology-link b{color:#9fd0c4;font-size:22px}
@media(max-width:640px){.profile-panel canvas{height:auto;aspect-ratio:640/340}.viewer-bar{flex-direction:column;align-items:flex-start;gap:10px;padding:12px}.viewer-title{font-size:14px}.image-viewer{width:96vw;height:92svh}.project-gallery{margin-bottom:28px}.project-technology-section{grid-template-columns:1fr;gap:24px;padding:26px 20px!important}.project-technology-link{padding:16px}.project-technology-link span span{display:none}}
.timeline{position:relative;list-style:none;padding:0;margin:42px 0 0;--axis-x:175px;--node-size:20px;--rail-width:6px;--rail-top:47px;--rail-height:calc(100% - 94px);--timeline-progress:0}
.timeline::before,.timeline::after{content:"";position:absolute;box-sizing:border-box;left:calc(var(--axis-x) - var(--rail-width)/2);top:var(--rail-top);width:var(--rail-width);height:var(--rail-height);border-radius:6px;pointer-events:none}
.timeline::before{background:#e1e7e4}
.timeline::after{background:linear-gradient(180deg,#177b70 0%,#52988c 35%,#b2b28a 68%,#ce674e 100%);clip-path:inset(0 0 calc((1 - var(--timeline-progress))*100%) 0);will-change:clip-path}
.timeline-item{position:relative;display:grid;grid-template-columns:140px minmax(0,1fr);gap:66px;padding:32px 0;border:0;min-height:160px}
.timeline-item::before{content:"";position:absolute;box-sizing:border-box;left:calc(var(--axis-x) - var(--node-size)/2);top:calc(47px - var(--node-size)/2);width:var(--node-size);height:var(--node-size);border:4px solid #d1ded8;background:var(--bg);border-radius:50%;box-shadow:0 0 0 5px var(--bg);z-index:1;transition:background .25s,border-color .25s,box-shadow .25s}
.timeline-item.is-passed::before{background:#f5f6f6;border-color:#177b70}
.timeline-item:nth-child(3).is-passed::before{border-color:#52988c}
.timeline-item:nth-child(4).is-passed::before{border-color:#b2b28a}
.timeline-item:nth-child(5).is-passed::before{border-color:#ce674e}
.timeline-item[aria-current=step]::before{background:var(--bg);border-color:#ce674e;box-shadow:0 0 0 5px var(--bg),0 0 0 8px #ce674e25}
.timeline-item .time{font-size:13px;line-height:2;padding-top:3px;color:var(--muted)}
.timeline-item[aria-current=step] .time{color:var(--accent)}
.timeline-item>div{border-bottom:1px solid var(--line);padding-bottom:28px}
.timeline-item:last-child>div{border-bottom:0}
.timeline-link{display:inline-block;margin-top:14px;color:var(--green);font-size:14px;border-bottom:1px solid transparent}
.timeline-link:hover{border-color:var(--green)}
.timeline-item h3{max-width:780px}.experience-role{margin:14px 0 0;color:var(--green);font-size:18px;font-weight:650}.experience-body p+p{margin-top:14px}.related-section{margin-top:26px;border-top:2px solid var(--ink)!important}.related-links{display:flex;flex-wrap:wrap;gap:10px 24px}.related-links a{font-weight:650}.experience-body .detail-next a{color:var(--green);text-decoration:none}.experience-body .detail-next a:last-child{margin-left:auto;text-align:right}
.experience-body{max-width:980px}.experience-block{padding:48px 0!important}.experience-block-code{margin:0 0 8px!important;color:var(--accent)!important;font:600 11px/1.5 ui-monospace,SFMono-Regular,monospace;letter-spacing:.06em}.experience-block>h2{max-width:720px;font-size:1.55em}.experience-intro{max-width:760px;margin:0 0 24px!important;font-size:1.05em}.experience-storyline{position:relative;display:grid;gap:0;margin:30px 0 0;padding:0;list-style:none}.experience-storyline::before{content:"";position:absolute;left:126px;top:8px;bottom:8px;width:1px;background:var(--line)}.experience-storyline li{display:grid;grid-template-columns:105px minmax(0,1fr);gap:44px;padding:0 0 34px}.experience-storyline li:last-child{padding-bottom:0}.experience-storyline time{color:var(--accent);font:600 11px/1.5 ui-monospace,monospace}.experience-storyline li>div{position:relative}.experience-storyline li>div::before{content:"";position:absolute;left:-28px;top:5px;width:9px;height:9px;border:3px solid var(--green);border-radius:50%;background:var(--bg)}.experience-storyline h3{margin:0 0 9px;font-size:18px}.experience-storyline p{margin:0}.experience-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin:28px 0 0;padding:1px;list-style:none;background:var(--ink)}.experience-steps li{min-height:245px;padding:20px;background:var(--paper)}.experience-step-number{display:block;margin-bottom:44px;color:var(--accent);font:11px ui-monospace,monospace}.experience-steps h3{font-size:17px}.experience-steps p{margin:0;font-size:14px}.experience-case-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:28px}.experience-case-card{padding:24px;border:1px solid var(--line);background:var(--paper)}.experience-case-card small{color:var(--accent);font:600 10px ui-monospace,monospace}.experience-case-card h3{margin:20px 0 10px;font-size:18px}.experience-case-card p{margin:0;font-size:14px}.experience-system-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin:26px 0 0;padding:1px;list-style:none;background:var(--ink)}.experience-system-flow li{position:relative;display:grid;align-content:start;min-height:150px;padding:18px;background:var(--paper)}.experience-system-flow li:not(:last-child)::after{content:"→";position:absolute;right:-8px;top:46%;z-index:1;color:var(--accent);font-weight:700}.experience-system-flow span{color:var(--accent);font:10px ui-monospace,monospace}.experience-system-flow strong{margin:24px 0 6px;font-size:15px}.experience-system-flow small{color:var(--muted);font-size:12px;line-height:1.55}.experience-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin:28px 0 0;padding:1px;background:var(--ink)}.experience-metrics>div{min-height:118px;padding:18px;background:var(--bg)}.experience-metrics dt{color:var(--accent);font:10px ui-monospace,monospace}.experience-metrics dd{margin:22px 0 0;color:var(--ink);font:700 19px/1.35 ui-monospace,SFMono-Regular,monospace}.experience-note{max-width:760px;margin:18px 0 0!important;font-size:13px}.experience-scene{display:grid;grid-template-columns:minmax(220px,.72fr) minmax(0,1.28fr);gap:20px 50px}.experience-scene .experience-block-code,.experience-scene h2,.experience-scene-lead{grid-column:1}.experience-scene>p:not(.experience-block-code):not(.experience-scene-lead){grid-column:2}.experience-scene-lead{margin:12px 0 0!important;color:var(--green)!important;font:600 19px/1.55 "Songti SC",serif}.experience-reflection{margin:28px 0;padding:34px!important;border:0!important;background:#e8efeb}.experience-reflection h2{font-family:"Songti SC",serif}.experience-reflection p{max-width:760px;margin:0;font-size:18px}.experience-quote{position:relative;margin:34px 0 52px;padding:38px 46px!important;border:0!important;border-left:5px solid var(--accent)!important;background:var(--ink);color:white}.experience-quote p{margin:0!important;color:white!important;font:500 24px/1.65 "Songti SC",serif}.experience-workflow{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;margin:28px 0 0;padding:1px;list-style:none;background:var(--ink)}.experience-workflow li{position:relative;display:grid;min-height:155px;padding:17px;background:var(--paper)}.experience-workflow li:not(:last-child)::after{content:"→";position:absolute;right:-8px;top:45%;z-index:1;color:var(--accent);font-weight:700}.experience-workflow span{color:var(--accent);font:10px ui-monospace,monospace}.experience-workflow strong{margin-top:20px}.experience-workflow small{margin-top:5px;color:var(--muted);font-size:12px;line-height:1.5}.experience-formula{padding:44px!important;border-top:2px solid var(--ink)!important;background:var(--paper)}.experience-formula-equation{display:grid;grid-template-columns:1fr auto 1fr;gap:24px;align-items:center;margin-top:28px}.experience-formula-equation p{margin:0!important;padding:22px;border:1px solid var(--ink);color:var(--ink)!important;font:600 15px/1.6 ui-monospace,monospace}.experience-formula-equation b{color:var(--accent);font-size:28px}.experience-formula-result{max-width:780px;margin:24px 0 0!important}.experience-body .related-section{padding-top:36px!important}
.brand-cluster{display:flex;align-items:center;gap:16px;min-width:0}.brand-quote{padding-left:16px;border-left:1px solid var(--line);color:#7a4b42;font:italic 600 11px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase;white-space:nowrap}.hero-subtitle{color:#2d3431}
.profile-panel canvas{aspect-ratio:640/340}
@media(max-width:900px){.brand-quote{font-size:9px;white-space:normal;max-width:138px}}
@media(max-width:640px){.brand-cluster{gap:8px}.brand-quote{max-width:none;padding-left:8px;font-size:8px;line-height:1;white-space:nowrap}.timeline{margin-top:24px;--axis-x:7px}.timeline-item{grid-template-columns:minmax(0,1fr);gap:8px;padding:32px 0 12px 36px;min-height:0}.timeline-item h3{font-size:20px}.timeline-item>div{padding-bottom:24px}.experience-role{font-size:16px}.related-links{display:grid;gap:10px}.experience-body .detail-next a{max-width:46%}}
@media(max-width:800px){.experience-steps{grid-template-columns:repeat(2,minmax(0,1fr))}.experience-system-flow,.experience-workflow{grid-template-columns:1fr}.experience-system-flow li,.experience-workflow li{min-height:0}.experience-system-flow li:not(:last-child)::after,.experience-workflow li:not(:last-child)::after{content:"↓";right:16px;top:auto;bottom:-12px}.experience-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.experience-scene{display:block}.experience-scene-lead{margin:16px 0 22px!important}}
@media(max-width:640px){.experience-block{padding:34px 0!important}.experience-block>h2{font-size:1.35em}.experience-storyline::before{left:7px}.experience-storyline li{grid-template-columns:1fr;gap:8px;padding:0 0 30px 34px}.experience-storyline li>div::before{left:-33px}.experience-steps,.experience-case-grid{grid-template-columns:1fr}.experience-steps li{min-height:0}.experience-step-number{margin-bottom:24px}.experience-metrics dd{font-size:16px}.experience-quote{padding:28px 24px!important}.experience-quote p{font-size:20px}.experience-reflection{padding:26px 22px!important}.experience-formula{padding:28px 20px!important}.experience-formula-equation{grid-template-columns:1fr;gap:12px}.experience-formula-equation b{text-align:center}.experience-formula-equation p{padding:16px}}
@media(max-width:340px){.brand-cluster{gap:6px}.brand-quote{padding-left:6px;font-size:7px}}
.profile-panel canvas{border-radius:12px;box-shadow:0 16px 34px #0712101d;transition:transform .35s ease,box-shadow .35s ease,filter .35s ease;touch-action:none}.profile-panel canvas:hover{transform:translateY(-5px) scale(1.012);box-shadow:0 24px 50px #07121038,0 0 0 1px #62e7c633;filter:saturate(1.12)}.life-copy+.life-copy{margin-top:20px}.future-copy{color:var(--muted);font-size:18px}.future-copy p{margin:0}.future-copy p+p{margin-top:22px}.future-signoff{margin-top:34px!important;padding:22px 0 0;border-top:1px solid var(--ink);color:var(--ink)!important;font:600 21px/1.55 "Songti SC",serif}
.profile-panel canvas{cursor:zoom-in}.skill-tree-viewer{width:min(1400px,96vw);max-width:none;max-height:94svh;margin:auto;padding:0;border:1px solid #62e7c64a;border-radius:12px;background:#071210;color:#edf8f5;box-shadow:0 30px 90px #0009}.skill-tree-viewer[open]{display:grid;grid-template-rows:auto minmax(0,1fr)}.skill-tree-viewer::backdrop{background:#07100ed9;backdrop-filter:blur(10px)}.skill-tree-viewer-bar{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:14px 18px;border-bottom:1px solid #62e7c62e;background:#0b1715}.skill-tree-viewer-heading{display:grid;gap:2px}.skill-tree-viewer-heading strong{font-size:15px}.skill-tree-viewer-heading small{color:#a6bdb7;font:10px ui-monospace,monospace}.skill-tree-viewer .icon-button{border-color:#62e7c64a;color:#edf8f5}.skill-tree-viewer-stage{display:grid;place-items:center;min-height:0;padding:18px;overflow:auto}.skill-tree-large{display:block;width:min(1280px,100%);height:auto;aspect-ratio:640/340;border-radius:12px;touch-action:none;cursor:zoom-in}@media(max-width:640px){.skill-tree-viewer{width:96vw;max-height:92svh}.skill-tree-viewer-bar{padding:12px}.skill-tree-viewer-stage{padding:8px}.skill-tree-viewer-heading small{display:none}}
.skill-tree-viewer{overscroll-behavior:contain}.skill-tree-large{cursor:default}
.pointer-effects{position:fixed;inset:0;z-index:49;width:100vw;height:100vh;pointer-events:none}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}.project-card{transform:none!important}.click-ring{display:none}.timeline::after{clip-path:none}.music-bars i{transform:none!important}}