:root{--accent:#fdd852;--on-accent:#1b1c19;--bg:#fafaf6;--surface:#f1f1ea;--text:#1b1c19;--muted:#5d5f58;--line:#dcddd3;--line-strong:#1b1c19;--focus:#1b1c19;--ink:#1b1c19;--on-ink:#fafaf6;--accent-soft:color-mix(in oklab, var(--accent) 38%, transparent);--accent-faint:color-mix(in oklab, var(--accent) 16%, var(--bg));--font-sans:system-ui, -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "BIZ UDPGothic", "Yu Gothic UI", "Yu Gothic", Meiryo, "Noto Sans JP", sans-serif;--font-mono:ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;--radius:6px;--gutter:clamp(20px, 4vw, 40px);--page-max:1200px;--header-h:60px;color-scheme:light dark}@media (prefers-color-scheme:dark){:root{--bg:#141513;--surface:#1e201c;--text:#edeee8;--muted:#a5a79e;--line:#353831;--line-strong:#edeee8;--focus:var(--accent);--ink:#edeee8;--on-ink:#141513;--accent-soft:color-mix(in oklab, var(--accent) 22%, transparent);--accent-faint:color-mix(in oklab, var(--accent) 8%, var(--bg))}}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--header-h) + 16px)}@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}body{background:var(--bg);min-height:100vh;color:var(--text);font-family:var(--font-sans);flex-direction:column;margin:0;font-size:1rem;line-height:1.8;display:flex;overflow-x:clip}main{flex:1}img{max-width:100%;height:auto}a{color:inherit}:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:3px}::selection{background:var(--accent);color:var(--on-accent)}h1,h2,h3,p,ul,ol,figure{margin:0}ul[role=list],ol[role=list]{padding:0;list-style:none}.mono{font-family:var(--font-mono)}.wrap{width:min(100% - var(--gutter) * 2, var(--page-max));margin-inline:auto}.sr-only{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.skip-link{z-index:100;background:var(--ink);color:var(--on-ink);border-radius:var(--radius);padding:8px 14px;position:absolute;top:-100px;left:12px}.skip-link:focus{top:12px}.pending{color:var(--muted);border:1.5px dashed;border-radius:999px;align-items:center;gap:.5em;padding:.1em .75em;font-size:.85rem;font-weight:600;line-height:1.8;display:inline-flex}.pending:before{content:"";background:var(--accent);width:.55em;height:.55em;box-shadow:0 0 0 1.5px var(--text);border-radius:50%}@media (prefers-reduced-motion:no-preference){.pending:before{animation:1.6s steps(2,jump-none) infinite blink}}@keyframes blink{50%{opacity:.25}}.site-header{z-index:50;height:var(--header-h);background:color-mix(in oklab, var(--bg) 82%, transparent);-webkit-backdrop-filter:saturate(1.4)blur(12px);border-bottom:1px solid var(--line);position:sticky;top:0}.site-header .wrap{align-items:center;gap:16px;height:100%;display:flex}.brand{letter-spacing:-.01em;align-items:center;gap:10px;font-size:1.05rem;font-weight:800;text-decoration:none;display:inline-flex}.brand img{border:1.5px solid var(--line-strong);background:var(--accent);border-radius:8px;width:34px;height:34px}.brand .dot{color:var(--muted);font-weight:500}.site-nav{margin-left:auto}.site-nav ul{gap:4px;margin:0;padding:0;list-style:none;display:flex}.site-nav a{border-radius:999px;padding:6px 12px;font-size:.92rem;font-weight:600;text-decoration:none;transition:background-color .15s;display:block}.site-nav a:hover{background:var(--accent-soft)}.site-nav a[aria-current=page]{background:var(--accent);color:var(--on-accent)}@media (width<=520px){.brand .brand-text{display:none}.site-nav a{padding:6px 10px;font-size:.88rem}}.hero{background-color:var(--accent);color:var(--on-accent);border-bottom:2px solid var(--on-accent);isolation:isolate;position:relative;overflow:hidden}.hero:before{content:"";z-index:-1;background:linear-gradient(color-mix(in oklab, var(--on-accent) 9%, transparent) 1px, transparent 1px) 0 0 / 32px 32px, linear-gradient(90deg, color-mix(in oklab, var(--on-accent) 9%, transparent) 1px, transparent 1px) 0 0 / 32px 32px;position:absolute;inset:0;mask-image:linear-gradient(#000 30%,#0000 100%)}.hero .wrap{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:center;gap:clamp(28px,5vw,64px);padding-block:clamp(40px,7vw,96px) clamp(48px,7vw,96px);display:grid}.hero-kicker{font-family:var(--font-mono);border:1.5px solid var(--on-accent);background:oklab(100% 0 5.96046e-8/.35);border-radius:999px;align-items:center;gap:.6em;padding:.2em .8em;font-size:.85rem;font-weight:600;display:inline-flex}.hero-kicker .prompt{opacity:.55}.hero-title{letter-spacing:-.055em;word-break:keep-all;margin-block:.25em .3em;font-size:clamp(3.6rem,11.5vw,9.5rem);font-weight:900;line-height:.86}.hero-title .line{display:block}.hero-title .outline{color:#0000;-webkit-text-stroke:clamp(1.5px, .25vw, 3px) var(--on-accent)}.hero-title .cursor{background:var(--on-accent);vertical-align:baseline;width:.08em;height:.72em;margin-left:.06em;animation:1.06s step-end infinite caret;display:inline-block}@keyframes caret{50%{opacity:0}}@media (prefers-reduced-motion:reduce){.hero-title .cursor{animation:none}}.hero-sub{max-width:30em;font-size:clamp(1rem,1.6vw,1.15rem);font-weight:600}.hero-sub+.hero-profile{margin-top:14px}.hero-profile{gap:.6em;max-width:32em;display:grid}.hero .pending{color:var(--on-accent);border-color:color-mix(in oklab, var(--on-accent) 60%, transparent)}.hero-actions{flex-wrap:wrap;gap:12px;margin-top:28px;display:flex}.btn{border:2px solid var(--on-accent);border-radius:999px;align-items:center;gap:.6em;padding:.7em 1.3em;font-weight:700;line-height:1.2;text-decoration:none;transition:transform .15s,box-shadow .15s,background-color .15s;display:inline-flex}.btn .arrow{font-family:var(--font-mono);transition:transform .15s}.btn:hover .arrow{transform:translate(3px)}.btn-ink{color:#fafaf6;background:#1b1c19;box-shadow:4px 4px oklab(22.42% -.00311394 .00499935/.3)}.btn-ink:hover{transform:translate(-2px,-2px);box-shadow:6px 6px oklab(22.42% -.00311394 .00499935/.3)}.btn-line{color:var(--on-accent);background:oklab(100% 0 5.96046e-8/.3)}.btn-line:hover{background:#fff}.hero .btn:focus-visible{outline-color:#1b1c19}.canvas{border:2px solid var(--on-accent);box-shadow:10px 10px 0 var(--on-accent);background:#fdfbf0;border-radius:14px;margin:0;padding:28px 22px 20px;position:relative;transform:rotate(1.2deg)}.canvas-bar{border-bottom:2px solid var(--on-accent);background:var(--accent);height:22px;font-family:var(--font-mono);color:var(--on-accent);border-radius:12px 12px 0 0;align-items:center;gap:6px;padding-inline:10px;font-size:.68rem;font-weight:700;display:flex;position:absolute;top:0;left:0;right:0}.canvas-bar i{border:1.5px solid var(--on-accent);background:#fdfbf0;border-radius:50%;width:8px;height:8px}.canvas-bar span{letter-spacing:.04em;margin-left:auto}.canvas-art{aspect-ratio:4/3;border:1.5px dashed color-mix(in oklab, var(--on-accent) 45%, transparent);background:var(--accent);border-radius:6px;margin-top:8px;position:relative;overflow:hidden}.canvas-art img{object-fit:cover;width:100%;height:100%;display:block}.canvas-art .ruler{background:repeating-linear-gradient(90deg, color-mix(in oklab, var(--on-accent) 55%, transparent) 0 1px, transparent 1px 12px);pointer-events:none;height:10px;position:absolute;top:0;left:0;right:0;mask-image:linear-gradient(#000 60%,#0000)}.canvas-art .ruler.v{background:repeating-linear-gradient(180deg, color-mix(in oklab, var(--on-accent) 55%, transparent) 0 1px, transparent 1px 12px);width:10px;height:auto;inset:0 auto 0 0;mask-image:linear-gradient(90deg,#000 60%,#0000)}.sticker{z-index:2;color:#fafaf6;background:#1b1c19;border-radius:10px;max-width:15em;padding:10px 16px 11px;line-height:1.5;position:absolute;bottom:86px;right:-14px;transform:rotate(-5deg);box-shadow:4px 4px oklab(22.42% -.00311394 .00499935/.25)}.sticker strong{letter-spacing:.02em;font-size:1rem;display:block}.sticker strong:before{content:"✎ ";color:var(--accent)}.sticker small{opacity:.8;margin-top:2px;font-size:.78rem;display:block}.canvas-caption{color:#4a4b45;flex-wrap:wrap;align-items:center;gap:8px 14px;margin-top:14px;font-size:.85rem;display:flex}.peek summary{cursor:pointer;font-family:var(--font-mono);color:#1b1c19;border:1.5px solid #1b1c19;border-radius:999px;padding:.25em .8em;font-size:.8rem;font-weight:700;list-style:none}.peek summary::-webkit-details-marker{display:none}.peek summary:before{content:"▶ ";font-size:.75em}.peek[open] summary:before{content:"■ "}.peek summary:hover{background:var(--accent)}.peek-body{border:1.5px solid #1b1c19;border-radius:8px;margin-top:12px;overflow:hidden}.peek-body img{width:100%;display:block}@media (width<=860px){.hero .wrap{grid-template-columns:1fr}.canvas{margin-right:10px;transform:none}.sticker{bottom:76px;right:-6px}}.statusbar{border-bottom:1px solid var(--line);font-family:var(--font-mono);color:var(--muted);background:var(--surface);font-size:.8rem}.statusbar ul{flex-wrap:wrap;gap:6px 28px;margin-block:0;padding:10px 0;list-style:none;display:flex}.statusbar b{color:var(--text);font-weight:700}.statusbar .led{background:var(--accent);width:8px;height:8px;box-shadow:0 0 0 1.5px var(--text);vertical-align:1px;border-radius:50%;margin-right:6px;display:inline-block}.section{padding-block:clamp(56px,8vw,104px)}.section+.section{border-top:1px solid var(--line)}.section-head{flex-wrap:wrap;align-items:baseline;gap:6px 18px;margin-bottom:clamp(24px,4vw,44px);display:flex}.section-title{letter-spacing:-.01em;font-size:clamp(1.9rem,4.5vw,3rem);font-weight:900;line-height:1.2;position:relative}.section-title:after{content:"";background:var(--accent);border-radius:2px;width:2.4em;height:.22em;margin-top:.12em;display:block}.section-path{font-family:var(--font-mono);color:var(--muted);font-size:.9rem}.section-more{border-bottom:2px solid var(--accent);margin-left:auto;font-size:.95rem;font-weight:700;text-decoration:none}.section-more:hover{background:var(--accent-soft)}.works{border-top:2px solid var(--line-strong);gap:0;display:grid}.work{border-bottom:1px solid var(--line);background-image:linear-gradient(var(--accent-soft), var(--accent-soft));background-repeat:no-repeat;background-size:0% 100%;grid-template-columns:3.2rem minmax(0,1fr) auto;align-items:baseline;gap:4px 20px;padding:22px 4px;transition:background-size .35s cubic-bezier(.2,.7,.2,1);display:grid;position:relative}.work:hover,.work:focus-within{background-size:100% 100%}.work-no{font-family:var(--font-mono);color:var(--muted);font-size:.85rem}.work-name{letter-spacing:-.02em;font-size:clamp(1.6rem,3.6vw,2.4rem);font-weight:900;line-height:1.15}.work-kind{font-family:var(--font-mono);border:1.5px solid var(--line-strong);white-space:nowrap;border-radius:999px;padding:.15em .7em;font-size:.8rem}.work-body{grid-column:2/-1;gap:10px;margin-top:6px;display:grid}.work-body p{max-width:38em}.work-links{flex-wrap:wrap;gap:8px 16px;display:flex}.work-links a{border-bottom:2px solid var(--accent);font-weight:700;text-decoration:none}.work-links a:after{content:" ↗";font-family:var(--font-mono)}.work.featured{padding-block:34px}.work.featured .work-name{letter-spacing:-.045em;font-size:clamp(2.6rem,8vw,5.5rem)}.work.featured .work-no:after{content:" ★";color:var(--text)}@media (width<=600px){.work{grid-template-columns:minmax(0,1fr) auto}.work-no,.work-body{grid-column:1/-1}}.post-list{border-top:2px solid var(--line-strong);margin:0;padding:0;list-style:none}.post-item{border-bottom:1px solid var(--line)}.post-link{background-image:linear-gradient(var(--accent-soft), var(--accent-soft));background-repeat:no-repeat;background-size:0% 100%;grid-template-columns:7.5rem minmax(0,1fr) auto;align-items:baseline;gap:4px 24px;padding:22px 4px;text-decoration:none;transition:background-size .35s cubic-bezier(.2,.7,.2,1);display:grid}.post-link:hover{background-size:100% 100%}.post-link:focus-visible{outline-offset:-3px}.post-date{font-family:var(--font-mono);color:var(--muted);font-size:.85rem}.post-title{font-size:clamp(1.1rem,2.2vw,1.35rem);font-weight:800;line-height:1.55}.post-desc{color:var(--muted);grid-column:2;font-size:.95rem;line-height:1.75}.post-arrow{font-family:var(--font-mono);font-weight:700;transition:transform .15s}.post-link:hover .post-arrow{transform:translate(4px)}.post-tags{font-family:var(--font-mono);color:var(--muted);flex-wrap:wrap;grid-column:2;gap:6px 12px;font-size:.8rem;display:flex}.post-tags span:before{content:"#";color:var(--text);opacity:.5}.draft-badge{font-family:var(--font-mono);background:var(--ink);color:var(--on-ink);vertical-align:3px;border-radius:3px;margin-right:.4em;padding:0 .5em;font-size:.72rem;font-weight:700}@media (width<=640px){.post-link{grid-template-columns:minmax(0,1fr) auto}.post-date,.post-desc,.post-tags{grid-column:1/-1}}.empty{border:1.5px dashed var(--line);border-radius:12px;grid-template-columns:auto 1fr;align-items:center;gap:20px;padding:24px;display:grid}.empty img{border-radius:8px;width:120px}@media (width<=480px){.empty{grid-template-columns:1fr}}.links{flex-wrap:wrap;gap:12px;margin:0;padding:0;list-style:none;display:flex}.links a{border:2px solid var(--line-strong);border-radius:999px;align-items:center;gap:.5em;padding:.6em 1.2em;font-weight:700;text-decoration:none;transition:background-color .15s,transform .15s;display:inline-flex}.links a:after{content:"↗";font-family:var(--font-mono)}.links .icon{flex:none;width:1.1em;height:1.1em}.links a:hover{background:var(--accent);color:var(--on-accent);transform:translateY(-2px)}.page-head{padding-block:clamp(40px,7vw,80px) clamp(24px,4vw,40px)}.page-title{letter-spacing:-.045em;font-size:clamp(2.6rem,9vw,6rem);font-weight:900;line-height:.95}.page-title .hash{color:#0000;-webkit-text-stroke:2px var(--text);margin-right:.04em}.page-meta{font-family:var(--font-mono);color:var(--muted);margin-top:16px;font-size:.9rem}.tag-cloud{flex-wrap:wrap;gap:8px;margin:20px 0 0;padding:0;list-style:none;display:flex}.tag-cloud a,.tag{border:1.5px solid var(--line-strong);font-family:var(--font-mono);border-radius:999px;padding:.1em .75em;font-size:.8rem;font-weight:600;text-decoration:none;transition:background-color .15s;display:inline-block}.tag-cloud a:before,.tag:before{content:"#";opacity:.5}.tag-cloud a:hover,.tag:hover{background:var(--accent);color:var(--on-accent)}.tag-cloud a[aria-current=page]{background:var(--ink);color:var(--on-ink)}.tag-cloud .count{opacity:.6;margin-left:.3em}.post{--col:38em;--toc:220px;padding-block:clamp(32px,5vw,64px) 40px}.post-grid{grid-template-columns:minmax(0,1fr);justify-content:center;display:grid}.post-main{width:100%;min-width:0;max-width:calc(var(--col) * 1.125);margin-inline:auto}.post-main .prose{margin-inline:auto}@media (width>=1120px){.post-grid.has-toc{grid-template-columns:minmax(0, calc(var(--col) * 1.125)) var(--toc);gap:64px}.post-grid.has-toc .post-main{margin-inline:0}.toc-mobile{display:none}}@media (width<=1119.98px){.toc-side{display:none}}.crumb{font-family:var(--font-mono);color:var(--muted);gap:.4em;font-size:.85rem;text-decoration:none;display:inline-flex}.crumb:hover{color:var(--text)}.post-header{margin-bottom:32px}.post-header .tags{flex-wrap:wrap;gap:8px;margin-top:18px;display:flex}.post-h1{letter-spacing:.005em;text-wrap:pretty;margin-top:14px;font-size:clamp(1.75rem,4.4vw,2.5rem);font-weight:900;line-height:1.4}.post-dates{font-family:var(--font-mono);color:var(--muted);flex-wrap:wrap;gap:4px 18px;margin-top:16px;font-size:.85rem;display:flex}.post-dates b{color:var(--text);font-weight:700;font-family:var(--font-sans);margin-right:.4em;font-size:.8rem}.post-lead{border-left:5px solid var(--accent);background:var(--accent-faint);border-radius:0 var(--radius) var(--radius) 0;margin-top:24px;padding:18px 20px;font-size:1.02rem;line-height:1.9}.post-cover{margin-top:28px}.post-cover img{border:1.5px solid var(--line-strong);border-radius:10px;width:100%;display:block}.toc-title{font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-size:.78rem;font-weight:700}.toc ol{margin:0;padding:0;list-style:none}.toc li{margin:0}.toc a{border-left:2px solid var(--line);color:var(--muted);padding:5px 10px;font-size:.86rem;line-height:1.6;text-decoration:none;transition:color .15s,border-color .15s,background-color .15s;display:block}.toc a:hover{color:var(--text);border-left-color:var(--accent);background:var(--accent-faint)}.toc .lv3 a{padding-left:24px;font-size:.82rem}.toc .lv4 a{padding-left:38px;font-size:.8rem}.toc-side .toc-sticky{top:calc(var(--header-h) + 28px);max-height:calc(100vh - var(--header-h) - 56px);padding-top:4px;position:sticky;overflow-y:auto}.toc-side .toc-title{align-items:center;gap:8px;margin-bottom:10px;display:flex}.toc-side .toc-title:before{content:"";background:var(--accent);border:1.5px solid var(--line-strong);border-radius:2px;width:10px;height:10px}.toc-mobile{border:1.5px solid var(--line-strong);background:var(--bg);border-radius:10px;margin-bottom:36px}.toc-mobile summary{cursor:pointer;align-items:center;gap:10px;padding:12px 16px;font-weight:700;list-style:none;display:flex}.toc-mobile summary::-webkit-details-marker{display:none}.toc-mobile summary:after{content:"+";font-family:var(--font-mono);margin-left:auto;font-size:1.2rem;line-height:1}.toc-mobile[open] summary:after{content:"−"}.toc-mobile summary .toc-title{color:var(--text);font-size:.85rem}.toc-mobile .toc{padding:0 16px 14px}.post-also{border:1.5px dashed var(--line);border-radius:10px;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-top:56px;padding:18px 20px;display:flex}.post-also p{font-size:.92rem;font-weight:600}.post-also ul{flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none;display:flex}.post-also a{border:1.5px solid var(--line-strong);border-radius:999px;padding:.15em .9em;font-size:.9rem;font-weight:700;text-decoration:none;display:inline-block}.post-also a:after{content:" ↗";font-family:var(--font-mono)}.post-also a:hover{background:var(--accent);color:var(--on-accent)}.post-share-tags{flex-wrap:wrap;gap:8px;margin-top:40px;display:flex}.pager{border-top:2px solid var(--line-strong);border-bottom:1px solid var(--line);grid-template-columns:1fr 1fr;gap:0;margin-top:48px;display:grid}.pager a,.pager .none{background-image:linear-gradient(var(--accent-soft), var(--accent-soft));background-repeat:no-repeat;background-size:0% 100%;gap:4px;padding:18px 16px;text-decoration:none;transition:background-size .35s cubic-bezier(.2,.7,.2,1);display:grid}.pager a:hover{background-size:100% 100%}.pager .next{text-align:right;border-left:1px solid var(--line);background-position:100%}.pager .label{font-family:var(--font-mono);color:var(--muted);font-size:.78rem}.pager .title{font-weight:700;line-height:1.6}@media (width<=600px){.pager{grid-template-columns:1fr}.pager .next{border-left:0;border-top:1px solid var(--line)}}.notfound{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:40px;padding-block:clamp(48px,8vw,96px);display:grid}.notfound .code{letter-spacing:-.06em;font-size:clamp(5rem,18vw,11rem);font-weight:900;line-height:.85}.notfound .code span{color:#0000;-webkit-text-stroke:3px var(--text)}.notfound img{border:2px solid var(--line-strong);border-radius:14px}@media (width<=760px){.notfound{grid-template-columns:1fr}}.site-footer{color:#fafaf6;border-top:1px solid var(--line);background:#1b1c19;margin-top:40px;overflow:hidden}.site-footer .wrap{gap:24px;padding-block:40px 28px;display:grid}.footer-big{letter-spacing:-.06em;color:#0000;-webkit-text-stroke:1.5px oklab(98.3998% -.00149664 .00505412/.4);white-space:nowrap;user-select:none;font-size:clamp(3rem,14vw,11rem);font-weight:900;line-height:.8}.footer-big span{color:var(--accent);-webkit-text-stroke:0}.footer-row{flex-wrap:wrap;align-items:center;gap:10px 24px;font-size:.88rem;display:flex}.footer-row nav ul{flex-wrap:wrap;gap:6px 20px;margin:0;padding:0;list-style:none;display:flex}.footer-row a{border-bottom:1.5px solid color-mix(in oklab, var(--accent) 70%, transparent);text-decoration:none}.footer-row a:hover{color:var(--accent)}.footer-row small{font-family:var(--font-mono);opacity:.7;margin-left:auto}.site-footer :focus-visible{outline-color:var(--accent)}.splash{display:none}html.show-splash .splash{z-index:1000;background:#fdd852;place-items:center;animation:.45s 1.5s forwards splash-out;display:grid;position:fixed;inset:0}html.show-splash .splash img{width:min(560px,86vw);height:auto;animation:.5s cubic-bezier(.2,1.4,.4,1) both splash-pop}@keyframes splash-out{to{opacity:0;visibility:hidden}}@keyframes splash-pop{0%{opacity:0;transform:scale(.92)}}@media (prefers-reduced-motion:reduce){html.show-splash .splash{display:none}*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
