body.is-projects{--paper:#fbfaf7;--ink:#343638;--muted:#696970;--green:#484c58;--line:#dedbd6;--letter:#eeebe6;--rust:#a95c3d;--accent-blue:#65758e;--accent-orange:#b46a4b;--scene-wash:#eed9c64a}html[data-theme=dark] body.is-projects{--paper:#1d2027;--ink:#ece8e2;--muted:#b8b6ba;--green:#dfd8d0;--line:#414249;--letter:#2b2d35;--rust:#e6a37e;--accent-blue:#9caec8;--accent-orange:#e3a183;--scene-wash:#9c69451f}.is-projects .window-glow{background:radial-gradient(at 80% 34%,#b9c6e326,#0000 48%),radial-gradient(at 1% 75%,#eac8aa24,#0000 45%)}.is-projects .margin-leaves,.is-projects .margin-breeze,.is-projects .atmosphere-dots{display:none}.projects-intro{justify-content:space-between;align-items:center;gap:30px;min-height:230px;padding:46px 0 48px;display:flex}.projects-intro h1{letter-spacing:-.035em;text-wrap:balance;font-size:clamp(36px,4.5vw,54px);line-height:1.4}.projects-intro h1>span{display:inline-block}.project-title-mark{padding-bottom:.14em;position:relative}.project-title-mark svg{width:93%;height:.38em;stroke:var(--accent-orange);stroke-width:1.5px;stroke-linecap:round;position:absolute;bottom:-.1em;left:0;overflow:visible}.project-title-mark path{stroke-dasharray:1}.project-title-mark circle{fill:var(--accent-orange);stroke:none}.project-atmosphere{z-index:-1;pointer-events:none;position:fixed;inset:0;overflow:clip}.project-margin-paper{width:280px;max-width:none;height:auto;stroke:var(--accent-blue);stroke-width:1px;opacity:.24;position:absolute}.margin-paper-fill{fill:color-mix(in srgb, var(--accent-blue) 4%, transparent)}.margin-paper-arc{stroke:var(--accent-orange);stroke-width:1.3px}.project-margin-paper--left{transform:translateY(var(--paper-drift-far,0px));top:36%;left:max(-165px,50vw - 845px)}.project-margin-paper--right{transform:translateY(var(--paper-drift-near,0px));top:76%;right:max(-165px,50vw - 845px)}.projects-paper{flex-shrink:0;width:165px;height:115px;overflow:visible}.paper-orbit{stroke:var(--accent-blue);stroke-width:1px;stroke-dasharray:3 6;opacity:.5}.paper-sheet{stroke-width:1.2px;stroke-linejoin:round}.paper-sheet--back{fill:color-mix(in srgb, var(--accent-blue) 15%, var(--paper));stroke:var(--accent-blue);transform-origin:50%;transform:rotate(8deg)}.paper-sheet--front{fill:var(--paper);stroke:var(--accent-orange)}.paper-point{fill:var(--accent-orange)}.paper-spark{stroke:var(--accent-orange);stroke-width:1.3px}.project-feature{grid-template-columns:minmax(0,.82fr) minmax(0,1.4fr);align-items:center;gap:clamp(38px,6vw,90px);padding:22px 0 70px;scroll-margin-top:22px;display:grid}.project-feature+.project-feature{border-top:1px solid var(--line);padding-top:58px}.project-description{min-width:0}.project-index{color:var(--muted);align-items:center;gap:12px;margin-bottom:22px;font-size:12px;display:flex}.project-index>span:first-child{color:var(--rust);font:italic 18px/1.5 Baiyiyu Lora,Georgia,serif}.project-index-line{background:var(--line);width:24px;height:1px}.project-description h2{letter-spacing:-.04em;text-wrap:balance;font-size:clamp(28px,3vw,37px);line-height:1.4}.project-summary{color:var(--muted);max-width:350px;margin-top:19px;font-size:16px;line-height:1.85}.project-tags{color:var(--muted);flex-wrap:wrap;gap:9px 0;margin-top:23px;padding:0;font-size:12px;list-style:none;display:flex}.project-tags li+li:before{content:"·";color:var(--accent-orange);margin-inline:9px}.project-github{min-height:46px;color:var(--ink);align-items:center;gap:10px;margin-top:26px;font-size:15px;text-decoration:none;display:inline-flex;position:relative}.project-github:after{content:"";background:var(--accent-orange);transform-origin:0;height:1px;position:absolute;bottom:4px;left:0;right:0;transform:scaleX(.36)}.project-github svg{stroke:currentColor;stroke-width:1.4px;stroke-linecap:round;stroke-linejoin:round;width:20px;height:20px}.github-arrow{color:var(--rust);margin-left:14px}.project-github:is(:hover,:focus-visible):after{transform:scaleX(1)}.project-footnote{max-width:300px;color:var(--muted);margin-top:19px;font-size:11px;line-height:1.8}.project-visual{min-width:0;position:relative}.project-feature--workflow{grid-template-columns:minmax(0,1.4fr) minmax(0,.82fr)}.project-feature--workflow .project-description{grid-area:1/2}.project-feature--workflow .project-visual{grid-area:1/1}.account-convergence{height:auto;margin:0 -5px -1px;position:relative}.account-convergence svg{width:100%;height:auto;overflow:visible}.convergence-path{stroke:var(--accent-blue);stroke-width:1.2px}.convergence-path--red,.convergence-path--x{stroke:var(--accent-orange)}.convergence-path circle{fill:var(--paper)}.convergence-path path{stroke-dasharray:1}.convergence-join{stroke:var(--accent-blue);stroke-width:1.2px}.convergence-center{stroke:var(--accent-orange);fill:var(--paper);stroke-width:1.5px}.account-convergence ul{grid-template-columns:repeat(4,1fr);padding:0;list-style:none;display:grid;position:absolute;inset:0 0 auto}.account-convergence li{background:var(--paper);width:max-content;max-width:100%;color:var(--muted);outline-offset:3px;border-radius:25px;justify-self:center;align-items:center;gap:6px;padding:5px 8px;font-size:11px;line-height:1.6;display:inline-flex}.platform-dot{background:var(--accent-blue);border-radius:50%;width:5px;height:5px}[data-platform=red] .platform-dot,[data-platform=x] .platform-dot{background:var(--accent-orange)}.account-convergence li:is(:hover,:focus-visible){color:var(--ink);box-shadow:0 0 0 1px var(--line)}.account-convergence:has(li:is(:hover,:focus-visible)) .convergence-path{opacity:.22}.account-convergence:has([data-platform=red]:is(:hover,:focus-visible)) .convergence-path--red,.account-convergence:has([data-platform=douyin]:is(:hover,:focus-visible)) .convergence-path--douyin,.account-convergence:has([data-platform=bilibili]:is(:hover,:focus-visible)) .convergence-path--bilibili,.account-convergence:has([data-platform=x]:is(:hover,:focus-visible)) .convergence-path--x{opacity:1;stroke-width:2.3px}.gallery-main{aspect-ratio:1.25;border:1px solid var(--line);background:var(--paper);border-radius:8px;display:block;position:relative;overflow:hidden;transform:perspective(1400px)rotateY(-4deg)rotate(1deg);box-shadow:15px 18px 50px -25px #84644b38,-15px -10px 50px -25px #5a749e25}.gallery-main>img{width:100%;height:auto}.gallery-main:after{content:"";background:linear-gradient(transparent, var(--paper));pointer-events:none;position:absolute;inset:83% 0 0}.image-open{z-index:1;background:var(--paper);min-height:40px;color:var(--ink);border:1px solid var(--line);border-radius:4px;align-items:center;gap:7px;padding:8px 11px;font-size:11px;display:inline-flex;position:absolute;bottom:14px;right:14px}.image-open svg{stroke:currentColor;stroke-width:1.4px;width:15px;height:15px}.gallery-bottom{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:0 14px;margin-top:12px;display:flex}.gallery-selectors{gap:15px;display:flex}.gallery-selector{min-height:44px;color:var(--muted);align-items:center;gap:7px;font-size:11px;text-decoration:none;display:inline-flex}.selector-dot{border:1px solid;border-radius:50%;width:4px;height:4px}.gallery-selector.is-selected{color:var(--ink)}.gallery-selector.is-selected .selector-dot{background:var(--accent-orange);border-color:var(--accent-orange)}.gallery-caption{color:var(--muted);font-size:11px}.case-deck-scene{padding-top:20px;position:relative}.case-thread{width:100%;height:100%;stroke:var(--accent-orange);stroke-width:1.2px;pointer-events:none;position:absolute;inset:0}.case-thread circle{fill:var(--paper)}.case-orbit{stroke:var(--accent-blue);stroke-dasharray:3 7;opacity:.6}.case-deck-cards{gap:18px;padding:0;list-style:none;display:grid;position:relative}.case-deck-cards a{border:1px solid var(--line);background:var(--paper);border-radius:7px;text-decoration:none;display:block;position:relative;overflow:hidden;box-shadow:0 20px 45px -27px #493c4d88}.case-deck-cards img{aspect-ratio:1.76;object-fit:cover;object-position:top;width:100%;height:auto}.case-window{color:var(--muted);justify-content:space-between;align-items:center;gap:8px;padding:8px 12px;font-size:10px;display:flex}.case-window>span:first-child{letter-spacing:3px;color:var(--accent-orange)}.case-enlarge{background:var(--paper);min-height:34px;color:var(--ink);border-radius:4px;padding:7px 10px;font-size:11px;position:absolute;bottom:10px;right:10px}[data-deck-ready] .case-deck-scene{aspect-ratio:1.5;padding:0}[data-deck-ready] .case-deck-cards{display:block;position:absolute;inset:18% 8% 9% 2%}[data-deck-ready] [data-case-card]{transform-origin:50% 80%;width:89%;position:absolute;top:0;left:0}[data-deck-ready] [data-position="0"]{z-index:3;transform:translateY(13px)rotate(-2deg)}[data-deck-ready] [data-position="1"]{z-index:2;transform:translate(7%,-17px)rotate(3deg)}[data-deck-ready] [data-position="2"]{z-index:1;transform:translate(14%,-39px)rotate(7deg)}[data-deck-ready] [data-case-card]:not([data-position="0"]) .case-enlarge{visibility:hidden}.case-deck-footer{justify-content:space-between;align-items:center;gap:12px;margin-top:6px;display:flex}.case-deck-footer>span{color:var(--muted);font-size:11px}.case-choices{flex-wrap:wrap;gap:4px 14px;display:flex}.case-choices button{min-height:44px;color:var(--muted);background:0 0;border:0;border-bottom:1px solid #0000;align-items:center;gap:6px;padding:6px 0;font-size:12px;display:flex}.case-choices button>span{color:var(--rust);font:italic 11px Baiyiyu Lora,Georgia,serif}.case-choices button[aria-pressed=true]{color:var(--ink);border-color:var(--accent-orange)}.projects-closing{border-top:1px solid var(--line);padding:36px 0}.projects-closing a{color:var(--ink);font:24px/1.6 var(--serif);align-items:center;gap:28px;text-decoration:none;display:inline-flex}.projects-closing a>span{color:var(--rust)}.projects-closing a:hover{text-decoration:underline}.projects-all{color:var(--all-link-color,var(--green));align-items:center;gap:12px;margin-top:25px;font-size:13px;display:inline-flex;position:relative}.projects-all:after{content:"";height:1px;transform:scaleX(var(--all-line-scale,0));transform-origin:0;background:currentColor;position:absolute;bottom:5px;left:0;right:24px}.projects-all:focus-visible{--all-line-scale:1;--all-link-color:var(--rust);--all-arrow-offset:3px}.projects-all:active{--all-line-scale:1;--all-link-color:var(--rust);--all-arrow-offset:1px;opacity:.75}@media (hover:hover) and (pointer:fine){.projects-all:hover{--all-line-scale:1;--all-link-color:var(--rust);--all-arrow-offset:3px}}.project-previews{padding:0;list-style:none}.project-previews li+li{border-top:1px solid var(--line);margin-top:24px;padding-top:24px}.project-preview{--preview-rotation:-2deg;grid-template-columns:125px minmax(0,1fr) 20px;align-items:center;gap:24px;text-decoration:none;display:grid}.preview-art{aspect-ratio:1.1;background:var(--paper);border:1px solid var(--preview-edge,var(--line));transform:rotate(var(--preview-rotation));box-shadow:var(--preview-shadow,0 0 0 transparent);border-radius:5px;overflow:hidden}.project-previews li:nth-child(2) .project-preview{--preview-rotation:2deg}.preview-art img{object-fit:cover;object-position:top;width:100%;height:100%}.project-category{color:var(--muted);gap:8px;margin-bottom:6px;font-size:11px;display:flex}.project-category>span{color:var(--rust)}.preview-copy h3{color:var(--ink);letter-spacing:-.025em;font-size:22px;line-height:1.5}.preview-title{background:linear-gradient(var(--rust), var(--rust)) no-repeat left bottom / var(--preview-underline,0%) 1px;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-bottom:.12em}.preview-copy p{color:var(--muted);margin-top:8px;font-size:14px;line-height:1.8}.preview-arrow{color:var(--preview-accent,var(--ink));font-size:21px}.project-preview:focus-visible{--preview-edge:var(--rust);--preview-shadow:0 14px 25px -17px color-mix(in srgb, var(--ink) 42%, transparent);--preview-underline:100%;--preview-accent:var(--rust);--preview-lift:-4px;--preview-turn:0deg;--preview-scale:1.025;--preview-arrow-x:3px;--preview-arrow-y:-3px;outline-offset:8px}@media (hover:hover) and (pointer:fine){.project-preview:hover{--preview-edge:var(--rust);--preview-shadow:0 14px 25px -17px color-mix(in srgb, var(--ink) 42%, transparent);--preview-underline:100%;--preview-accent:var(--rust);--preview-lift:-4px;--preview-turn:0deg;--preview-scale:1.025;--preview-arrow-x:3px;--preview-arrow-y:-3px}}.project-preview:active{--preview-edge:var(--rust);--preview-underline:100%;--preview-accent:var(--rust);--preview-lift:-1px;--preview-scale:.99}.image-viewer-open{overflow:hidden}.project-lightbox{border:1px solid var(--line);background:var(--paper);width:min(1120px,100vw - 64px);max-width:none;max-height:calc(100dvh - 56px);color:var(--ink);border-radius:10px;margin:auto;padding:0;position:fixed;inset:0;box-shadow:0 24px 90px #051b2940}.project-lightbox[open]{flex-direction:column;display:flex}.project-lightbox::backdrop{backdrop-filter:blur(5px);background:#102226bb}.lightbox-header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:16px;padding:17px 24px;display:flex}.lightbox-header h2{font-size:20px;line-height:1.4}.lightbox-header p{color:var(--muted);margin-top:4px;font-size:12px}.lightbox-close{border:1px solid var(--line);background:var(--letter);border-radius:50%;flex-shrink:0;place-items:center;width:44px;height:44px;padding:10px;display:grid}.lightbox-close svg{stroke:currentColor;stroke-width:1.4px;width:20px;height:20px}.lightbox-scroll{overscroll-behavior:contain;min-height:0;padding:20px;overflow:auto}.lightbox-scroll img{width:100%;height:auto;margin-inline:auto}.lightbox-error{padding:32px;font-size:15px}.lightbox-original{border-top:1px solid var(--line);min-height:44px;color:var(--green);text-align:right;flex-shrink:0;padding:9px 24px;font-size:13px}@media (prefers-reduced-motion:no-preference){.projects-all{transition:color .22s,opacity .16s}.projects-all:after{transition:transform .32s var(--ease)}.projects-all>span{transform:translate(var(--all-arrow-offset,0px), calc(-1 * var(--all-arrow-offset,0px)));transition:transform .32s var(--ease)}.project-preview .preview-art{transform:translateY(var(--preview-lift,0px)) rotate(var(--preview-turn,var(--preview-rotation))) scale(var(--preview-scale,1));transition:transform .38s var(--ease), box-shadow .38s ease, border-color .22s ease}.preview-title{transition:background-size .32s var(--ease)}.preview-arrow{transform:translate(var(--preview-arrow-x,0px), var(--preview-arrow-y,0px));transition:transform .32s var(--ease), color .22s ease}.ink-enter .project-title-mark path{animation:title-ink 1s .2s var(--ease) both}.ink-enter .project-title-mark circle{animation:.35s 1s both ink-dot}@keyframes title-ink{0%{stroke-dashoffset:1px}to{stroke-dashoffset:0}}@keyframes ink-dot{0%{opacity:0}to{opacity:1}}.project-github:after,.github-arrow{transition:transform .3s var(--ease)}.project-github:is(:hover,:focus-visible) .github-arrow{transform:translate(3px,-3px)}.convergence-path{transition:opacity .22s,stroke-width .22s}.ink-enter .convergence-path path{animation:1.4s cubic-bezier(.22,.61,.36,1) both gather-lines}.ink-enter .convergence-path:nth-child(2) path{animation-delay:.13s}.ink-enter .convergence-path:nth-child(3) path{animation-delay:.26s}.ink-enter .convergence-path:nth-child(4) path{animation-delay:.39s}@keyframes gather-lines{0%{stroke-dashoffset:1px;opacity:.25}to{stroke-dashoffset:0;opacity:1}}.projects-paper.ink-enter .paper-sheet--front{animation:1s cubic-bezier(.16,1,.3,1) both unfold-paper}@keyframes unfold-paper{0%{opacity:.1;transform:translate(12px,-8px)rotate(12deg)}to{opacity:1;transform:none}}.paper-sheet{transition:transform .65s var(--ease)}.projects-paper:hover .paper-sheet--back{transform:rotate(17deg)translate(6px,-3px)}.gallery-main{transition:transform .65s var(--ease), box-shadow .65s ease}.gallery-main:is(:hover,:focus-visible){transform:perspective(1400px)rotateY(0)rotate(0);box-shadow:0 20px 55px -27px #84644b55}[data-deck-ready] [data-case-card]{transition:transform .65s cubic-bezier(.22,.8,.25,1)}[data-deck-ready] [data-position="0"]:has(a:is(:hover,:focus-visible)){transform:translateY(6px)rotate(0)}.project-lightbox[open]{animation:.18s ease-out project-dialog-in}@keyframes project-dialog-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}}@media (width<=1050px){.project-feature{gap:38px}.project-description h2{font-size:30px}.case-choices{gap:10px}.case-deck-footer{flex-wrap:wrap}.project-preview{grid-template-columns:100px minmax(0,1fr) 18px;gap:18px}}@media (width<=760px){.project-margin-paper--left{display:none}.project-margin-paper--right{opacity:.2;width:145px;top:65%;right:-116px}.projects-intro{gap:14px;min-height:160px;padding:25px 0 35px}.projects-intro h1{max-width:270px;font-size:33px}.projects-paper{width:85px;height:75px}.project-feature,.project-feature--workflow{grid-template-columns:minmax(0,1fr);gap:24px;padding:10px 0 44px}.project-feature+.project-feature{padding-top:35px}.project-feature--workflow .project-description,.project-feature--workflow .project-visual{grid-area:auto}.project-index{margin-bottom:13px}.project-description h2{font-size:29px}.project-summary{max-width:none;margin-top:12px;font-size:15px}.project-tags{margin-top:14px}.project-github{margin-top:12px}.project-footnote{max-width:none;margin-top:9px}.gallery-main{aspect-ratio:1.25}.account-convergence{margin-inline:0}.account-convergence li{gap:4px;padding:3px;font-size:10px}.case-deck-scene{margin-top:10px}.case-deck-footer{margin-top:30px}.case-choices{gap:14px}.projects-closing{padding-block:28px}.projects-closing a{font-size:22px}.project-preview{grid-template-columns:84px minmax(0,1fr) 16px;gap:16px}.preview-copy h3{font-size:20px}.preview-copy p{font-size:13px}.project-lightbox{border-radius:7px;width:calc(100vw - 24px);max-height:calc(100dvh - 32px)}.lightbox-header{gap:10px;padding:12px 14px}.lightbox-header h2{font-size:18px}.lightbox-scroll{padding:8px}.lightbox-original{padding-inline:14px}}@media (width<=380px){.projects-intro h1{font-size:29px}.projects-paper{width:65px}.case-deck-footer{flex-direction:column;align-items:flex-start;gap:0}.gallery-caption{width:100%}.project-preview{grid-template-columns:64px minmax(0,1fr) 14px;gap:12px}.preview-copy h3{font-size:18px}}html[lang=en] .project-description h2{line-height:1.25}@media (forced-colors:active){.project-atmosphere{display:none}.project-lightbox::backdrop{background:canvas}.gallery-main:after{display:none}.case-choices button[aria-pressed=true]{border-color:highlight}}