:root{--ink:#172027;--ink-soft:#55626b;--paper:#f2f1ec;--paper-deep:#e4e4dc;--moss:#516458;--line:#c8cbc5;--white:#fff;--header-height:76px;--container:min(1440px, calc(100vw - 64px));--site-background-image:url(/images/day.jpg);color:var(--ink);background:#53616b var(--site-background-image) center / cover fixed no-repeat;scroll-behavior:smooth;font-family:Segoe UI,Microsoft YaHei,system-ui,sans-serif}*{box-sizing:border-box}[hidden]{display:none!important}html,body{min-width:320px;margin:0}html{scroll-snap-type:y proximity}body{background:0 0;min-height:100vh}a{color:inherit;text-decoration:none}button,a{-webkit-tap-highlight-color:transparent}svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px}.site-header{z-index:20;height:var(--header-height);color:var(--white);background:linear-gradient(#0f171d85,#0000);justify-content:space-between;align-items:center;padding:0 max(32px,50vw - 720px);display:flex;position:fixed;inset:0 0 auto}.site-header.compact{background:#172027f2}.site-mark{letter-spacing:.16em;align-items:center;gap:10px;font-size:.72rem;font-weight:700;display:inline-flex}.mark-dot{background:#c8d9cf;border-radius:50%;width:7px;height:7px;box-shadow:0 3px 12px #00000040}.site-header nav{justify-content:flex-end;gap:clamp(24px,4vw,56px);display:flex}.site-header nav a{text-shadow:0 1px 8px #0006;padding:10px 0;font-size:.9rem;font-weight:600;position:relative}.site-header nav a:after{content:"";transform-origin:100%;background:currentColor;height:1px;transition:transform .25s;position:absolute;inset:auto 0 4px;transform:scaleX(0)}.site-header nav a:hover:after,.site-header nav a:focus-visible:after{transform-origin:0;transform:scaleX(1)}.hero{color:#fff;isolation:isolate;place-items:center;min-height:100svh;display:grid;position:relative;overflow:hidden}.hero:after{content:"";z-index:-1;background:linear-gradient(to bottom, transparent, #f2f1ec24 24%, #f2f1ec99 68%, var(--paper));pointer-events:none;height:clamp(80px,12vh,130px);position:absolute;inset:auto 0 -1px}.hero-shade{z-index:-2;background:linear-gradient(#0d161d33,#0d161d14 45%,#0d161d57);position:absolute;inset:0}.hero-content{padding:calc(var(--header-height) + 20px) 24px 48px;text-align:center;flex-direction:column;align-items:center;display:flex}.hero-avatar{object-fit:cover;border-radius:50%;width:80px;height:80px;margin-bottom:clamp(46px,7vh,72px);box-shadow:0 8px 28px #00000047}.hero h1{letter-spacing:-.035em;text-shadow:0 6px #121d2557,0 14px 34px #00000047;text-wrap:balance;margin:0;font-size:40px;font-weight:760}.hero-rule{background:#f4d000;width:clamp(132px,19vw,188px);height:6px;margin:clamp(30px,5vh,44px) 0 32px;box-shadow:0 4px 12px #0000001f}.hero-subtitle{text-shadow:0 3px 14px #0000007a;align-items:center;gap:20px;margin:0;font-size:18px;font-weight:450;display:flex}.hero-subtitle span{font-family:Cascadia Code,Consolas,monospace;font-weight:700}.scroll-cue{z-index:2;width:44px;height:44px;color:var(--white);place-items:center;display:grid;position:absolute;bottom:24px;left:50%;transform:translate(-50%)}.scroll-cue svg{filter:drop-shadow(0 3px 5px #0000006b);width:26px;animation:2s cubic-bezier(.16,1,.3,1) infinite drift}@keyframes drift{0%,to{transform:translateY(0)}50%{transform:translateY(6px)}}.hero,.content-section{scroll-snap-align:start;height:100svh;min-height:100svh;max-height:100svh}.content-shell{background:var(--paper);width:100%;margin:0;position:relative}.content-section{width:var(--container);padding:calc(var(--header-height) + 34px) clamp(24px, 6vw, 96px) 34px;border-bottom:1px solid var(--line);margin:0 auto;overflow:hidden}.section-kicker{color:var(--moss);letter-spacing:.14em;margin:0 0 24px;font:700 .72rem/1 Cascadia Code,Consolas,monospace}.section-heading h2{letter-spacing:-.035em;text-wrap:balance;max-width:800px;margin:0;font-size:clamp(2.2rem,4.4vw,4.7rem);font-weight:520;line-height:1.08}.about{grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr);align-items:center;gap:clamp(42px,7vw,110px);display:grid}.about .section-heading{min-width:0}.about-landscape-frame{aspect-ratio:4/3;background:0 0;width:min(100%,680px);padding:clamp(12px,1.8vw,24px)}.about-landscape-frame img{object-fit:cover;border-radius:14px;width:100%;height:100%;display:block}.about-copy{max-width:560px;color:var(--ink-soft);font-size:1.06rem;line-height:1.9}.about-copy p:first-child{color:var(--ink)}.tag-list{flex-wrap:wrap;gap:10px;margin:32px 0 0;padding:0;list-style:none;display:flex}.tag-list li,.project-filters button{border:1px solid var(--line);color:var(--ink);font:inherit;user-select:none;background:#ffffff57;border-radius:999px;padding:8px 13px;font-size:.78rem;transition:color .22s,background-color .22s,border-color .22s,transform .22s cubic-bezier(.16,1,.3,1)}.tag-list li:hover,.project-filters button:hover,.project-filters button.is-active{color:var(--white);background:var(--moss);border-color:var(--moss);transform:translateY(-2px)}.project-filters button{cursor:pointer}.inline-heading{justify-content:space-between;align-items:end;gap:40px;margin-bottom:56px;display:flex}.inline-heading>p{max-width:340px;color:var(--ink-soft);margin:0;line-height:1.7}.work-heading,.log-heading{margin-bottom:clamp(22px,4vh,40px)}.work-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:22px 14px;display:grid}.work-card{background:var(--white);border-radius:16px;grid-template-rows:3fr 1fr;min-width:0;height:min(58vh,520px);transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s;display:grid;overflow:hidden;box-shadow:0 16px 38px #1720271a}.work-visual{background:#c7cfca;min-height:0;overflow:hidden}.work-visual img{object-fit:cover;width:100%;height:100%;transition:transform .5s cubic-bezier(.16,1,.3,1);display:block}.work-card:hover{transform:translateY(-6px);box-shadow:0 22px 42px #17202729}.work-card:hover .work-visual img{transform:scale(1.025)}.work-meta{grid-template-columns:28px 1fr;align-items:center;gap:12px;min-height:0;padding:13px 16px;display:grid}.work-meta>span{color:var(--moss);align-self:start;font:600 .7rem/1.4 Cascadia Code,Consolas,monospace}.work-meta h3,.work-meta h2{margin:0 0 5px;font-size:.92rem}.work-meta p{color:var(--ink-soft);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0;font-size:.7rem;line-height:1.4;display:-webkit-box;overflow:hidden}.works-more{position:absolute;bottom:34px;right:clamp(24px,6vw,96px)}.works{position:relative}.note-list{border-top:1px solid var(--ink)}.note-row{border-bottom:1px solid var(--line);grid-template-columns:140px minmax(180px,.8fr) minmax(260px,1.2fr) 28px;align-items:center;gap:28px;padding:28px 4px;display:grid}.note-row>*{margin:0}.note-date{color:var(--moss);font:500 .72rem/1.4 Cascadia Code,Consolas,monospace}.note-row h3{font-size:1.06rem}.note-row>p:last-of-type{color:var(--ink-soft);font-size:.88rem;line-height:1.65}.note-row a{place-items:center;width:28px;height:28px;transition:transform .25s;display:grid}.note-row a:hover{transform:translate(5px)}.note-row svg,.more-link svg{width:20px}.note-empty,.archive-empty{color:var(--ink-soft);margin:0;padding:28px 4px;line-height:1.7}.more-link{background:var(--ink);color:#fff;align-items:center;gap:14px;width:fit-content;margin:40px 0 0 auto;padding:13px 18px;font-size:.85rem;transition:transform .25s,background .25s;display:flex}.more-link:hover{background:var(--moss);transform:translateY(-2px)}.site-footer{color:#fff;letter-spacing:.12em;text-align:center;text-shadow:0 1px 8px #00000080;background:0 0;place-items:center;width:100%;height:200px;font-size:.72rem;display:grid}.archive-page{min-height:100vh;padding:calc(var(--header-height) + 70px) max(32px, calc((100vw - 1240px) / 2)) 100px;background:var(--paper)}.archive-intro{border-bottom:1px solid var(--ink);grid-template-columns:180px 1fr;gap:0 50px;padding-bottom:76px;display:grid}.archive-intro>a{width:fit-content;color:var(--moss);grid-row:1/5;font-size:.82rem}.archive-intro .section-kicker{margin-bottom:18px}.archive-intro h1{letter-spacing:-.04em;max-width:800px;margin:0;font-size:clamp(2.8rem,6vw,5.8rem);font-weight:520;line-height:1.04}.archive-intro>p:last-child{max-width:640px;color:var(--ink-soft);margin:30px 0 0;line-height:1.8}.works-archive .archive-intro{grid-template-columns:1fr;gap:0;padding-bottom:38px}.works-archive .archive-intro>.archive-home-link{grid-row:auto;align-self:start;height:20px;margin-bottom:36px;line-height:20px}.works-archive .archive-intro .section-kicker{margin-bottom:16px}.works-archive .archive-intro h1{letter-spacing:-.025em;max-width:680px;font-size:30px;line-height:1.25}.logs-archive .archive-intro{grid-template-columns:1fr;gap:0;padding-bottom:38px}.logs-archive .archive-intro>.archive-home-link{grid-row:auto;align-self:start;height:20px;margin-bottom:36px;line-height:20px}.logs-archive .archive-intro .section-kicker{margin-bottom:16px}.logs-archive .archive-intro h1{letter-spacing:-.025em;max-width:680px;font-size:30px;line-height:1.25}.project-filters{flex-wrap:wrap;gap:10px;margin-top:28px;display:flex}.archive-list article,.archive-entry{border-bottom:1px solid var(--line);grid-template-columns:70px 1fr 32px;gap:32px;padding:38px 0;display:grid}.archive-index{color:var(--moss);font:500 .75rem/1 Cascadia Code,Consolas,monospace}.archive-list h2{letter-spacing:-.02em;margin:6px 0 12px;font-size:clamp(1.4rem,2.5vw,2.2rem);font-weight:550}.archive-list article>div>p:not(.note-date),.archive-entry>div>p:not(.note-date){max-width:660px;color:var(--ink-soft);line-height:1.7}.compact-tags{margin-top:20px}.archive-arrow{font-size:1.3rem}.archive-entry{transition:padding .25s,background .25s}.archive-entry:hover{background:var(--paper-deep);padding-inline:18px}.logs-archive .archive-entry{grid-template-columns:52px 1fr 28px;gap:24px;padding:24px 0}.logs-archive .archive-list h2{margin:4px 0 8px;font-size:clamp(1.15rem,2vw,1.55rem)}.logs-archive .archive-entry>div>p:not(.note-date){margin:0;font-size:.86rem;line-height:1.6}.logs-archive .compact-tags{margin-top:14px}.logs-archive .compact-tags li{padding:6px 11px;font-size:.72rem}.logs-archive .archive-arrow{font-size:1.1rem}.portfolio-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;padding-top:50px;display:grid}.portfolio-grid .work-card{height:520px}.detail-page,.article-page{min-height:100vh;padding:calc(var(--header-height) + 48px) max(32px, calc((100vw - 1240px) / 2)) 90px;background:var(--paper)}.detail-back{color:var(--moss);margin-bottom:38px;font-size:.82rem;display:inline-block}.project-hero{border-bottom:1px solid var(--line);grid-template-columns:.78fr 1.22fr;align-items:center;gap:clamp(42px,7vw,100px);padding-bottom:70px;display:grid}.project-hero h1{letter-spacing:-.04em;margin:0 0 28px;font-size:clamp(3rem,6vw,6rem);font-weight:560;line-height:.98}.project-hero>div>p:last-child{max-width:520px;color:var(--ink-soft);line-height:1.85}.project-hero img{border-radius:18px;width:100%}.project-body{grid-template-columns:260px minmax(0,720px);gap:clamp(50px,9vw,140px);padding:70px 0;display:grid}.project-body aside{align-content:start;gap:8px;display:grid}.project-body aside span{color:var(--moss);margin-top:16px;font:600 .7rem/1.4 Cascadia Code,Consolas,monospace}.project-body aside strong{font-size:.88rem}.project-body h2{margin:0 0 18px;font-size:1.8rem}.project-body h2:not(:first-child){margin-top:44px}.project-body p{color:var(--ink-soft);line-height:1.9}.article-page article{max-width:1040px;margin:0 auto}.article-page article>header{border-bottom:1px solid var(--line);padding-bottom:42px}.article-page h1{letter-spacing:-.04em;margin:0 0 24px;font-size:clamp(2.8rem,6vw,5.6rem);font-weight:560;line-height:1.05}.article-meta{color:var(--moss);font-size:.78rem}.draft-label{border:1px solid var(--moss);color:var(--moss);vertical-align:middle;border-radius:999px;margin-left:10px;padding:4px 8px;font:600 .68rem/1 Cascadia Code,Consolas,monospace;display:inline-block}.article-body{grid-template-columns:minmax(0,8fr) minmax(0,2fr);align-items:start;gap:clamp(24px,3vw,40px);display:grid}.article-content{padding:44px 0;font-size:1.08rem;line-height:2}.article-content p{margin:0 0 1.6em}.article-content>:first-child{margin-top:0}.article-content>:last-child{margin-bottom:0}.article-content h2,.article-content h3{letter-spacing:-.02em;line-height:1.35}.article-content h2{margin:2.2em 0 .8em;font-size:1.7rem}.article-content h3{margin:1.8em 0 .7em;font-size:1.3rem}.article-content ul,.article-content ol{padding-left:1.35em}.article-content li+li{margin-top:.45em}.article-content a{color:var(--moss);text-underline-offset:.2em;text-decoration:underline 1px}.article-content img{margin:2em auto;border-radius:14px;max-width:100%;height:auto;margin-inline:auto;display:block}.article-content pre{max-width:100%;color:var(--paper);background:var(--ink);padding:18px 20px;line-height:1.65;overflow-x:auto}.article-content code{font-family:Cascadia Code,Consolas,monospace;font-size:.88em}.article-content :not(pre)>code{background:var(--paper-deep);padding:.16em .38em}.article-content blockquote{border-left:1px solid var(--moss);color:var(--ink-soft);margin:2em 0;padding-left:20px}.article-content table{border-collapse:collapse;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);width:100%;margin:2.2em 0;font-size:.92rem;line-height:1.65}.article-content caption{color:var(--ink-soft);text-align:left;margin-bottom:12px;font-size:.78rem}.article-content th,.article-content td{border-bottom:1px solid var(--line);text-align:left;vertical-align:top;padding:13px 16px}.article-content th{color:var(--ink);background:var(--paper-deep);letter-spacing:.025em;font-size:.82rem;font-weight:700}.article-content tbody tr:nth-child(2n){background:#ffffff57}.article-content tbody tr:last-child td{border-bottom:0}.article-content tbody tr{transition:background-color .18s}.article-content tbody tr:hover{background:#51645817}.article-tags{border-left:1px solid var(--line);margin-top:44px;padding-left:clamp(14px,1.5vw,20px)}.article-tags>p{color:var(--moss);letter-spacing:.14em;text-transform:uppercase;margin:0;font:700 .72rem/1 Cascadia Code,Consolas,monospace}.article-tags .tag-list{margin-top:18px}:focus-visible{outline-offset:5px;outline:2px solid #d6e4dc}@media (width<=1050px){.work-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.note-row{grid-template-columns:110px 1fr 28px}.note-row>p:last-of-type{display:none}}@media (width<=720px){:root{--header-height:64px;--container:calc(100vw - 24px)}.site-header{background:linear-gradient(#0f171dad,#0000);padding:0 16px}.site-mark{display:none}.site-header nav{justify-content:flex-end;gap:24px;width:100%;overflow-x:auto}.site-header nav a{white-space:nowrap;font-size:.82rem}.content-shell{margin:0 0 12px}.hero-content{padding-inline:18px}.hero-avatar{margin-bottom:42px}.hero-rule{height:4px;margin:28px 0 26px}.hero-subtitle{gap:12px}.content-section{padding:calc(var(--header-height) + 18px) 22px 22px;overflow-y:auto}.about{grid-template-columns:1fr;gap:42px}.about-landscape-frame{aspect-ratio:16/8;width:min(100%,520px)}.inline-heading{flex-direction:column;align-items:start;margin-bottom:38px}.work-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 10px}.work-card{height:min(53vh,440px)}.works-more{bottom:22px;right:22px}.note-row{grid-template-columns:1fr 28px;gap:8px 20px}.note-date,.note-row h3{grid-column:1}.note-row a{grid-area:1/2/3}.archive-page{padding:calc(var(--header-height) + 40px) 20px 70px}.archive-intro{grid-template-columns:1fr;gap:22px}.archive-intro>a{grid-row:auto}.archive-list article,.archive-entry{grid-template-columns:36px 1fr 20px;gap:12px}.logs-archive .archive-entry{grid-template-columns:28px 1fr 20px;gap:10px;padding:20px 0}.portfolio-grid{grid-template-columns:1fr}.portfolio-grid .work-card{height:480px}.project-hero,.project-body{grid-template-columns:1fr}.article-page{padding:calc(var(--header-height) + 40px) 20px 70px}.article-page h1{font-size:clamp(2.35rem,11vw,3.4rem)}.article-body{grid-template-columns:1fr;gap:0}.article-content table{white-space:nowrap;scrollbar-color:var(--line) transparent;max-width:100%;display:block;overflow-x:auto}.article-tags{border-left:0;border-bottom:1px solid var(--line);order:-1;margin-top:28px;padding:0 0 24px}.article-tags .tag-list{margin-top:14px}}@media (prefers-reduced-motion:reduce){:root{scroll-behavior:auto}*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}