:root{--bg: #000e14;--text: #dbf1fe;--muted: #8fb6c7;--line: #1e3b48;--image-bg-for-dark-base: color-mix(in srgb, var(--bg) 36%, var(--accent-1) 64%);--image-bg-for-dark-dot: color-mix(in srgb, var(--bg) 48%, var(--accent-3) 52%);--image-bg-for-light-base: color-mix(in srgb, var(--bg) 84%, var(--accent-1) 16%);--image-bg-for-light-dot: color-mix(in srgb, var(--bg) 90%, var(--accent-3) 10%);--accent-1: #00aad4;--accent-2: #00d455;--accent-3: #48a2a1;--accent-4: #78183f;--accent-5: #e33c63;--radius: .75rem;--page-width: min(100%, 1500px);--content-width: min(100%, 980px);--shadow: 0 8px 24px rgba(0, 0, 0, .35);--site-bar-height: 2rem}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--text);font-family:Hiragino Kaku Gothic ProN,Hiragino Sans,Yu Gothic UI,Yu Gothic,Meiryo,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}a{color:inherit}.page{width:var(--page-width);margin:0 auto;padding:calc(2rem + var(--site-bar-height)) 1.2rem 4rem}.page-header{display:grid;gap:.6rem;margin-bottom:1.6rem}.site-header{gap:.8rem}.site-bar{--site-bar-bg: color-mix(in srgb, var(--bg) 88%, #04131a 12%);--site-bar-line: rgba(219, 241, 254, .12);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.8rem 1.2rem;isolation:isolate;position:fixed;top:max(0px,env(safe-area-inset-top));left:50%;transform:translate(-50%);width:min(calc(100% - 2.4rem),calc(var(--page-width) - 2.4rem));z-index:20;padding:.75rem .45rem}.site-bar:before{content:"";position:absolute;top:0;bottom:0;left:50%;width:100vw;transform:translate(-50%);z-index:-1;pointer-events:none;border-bottom:1px solid var(--site-bar-line);background:var(--site-bar-bg);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.site-brand{display:inline-flex;align-items:center;gap:.55rem;text-decoration:none}.site-brand-icon{width:1.75rem;height:1.75rem;display:block;border-radius:.45rem;filter:drop-shadow(0 0 1px rgba(219,241,254,.45)) drop-shadow(0 0 8px rgba(219,241,254,.78))}.site-brand-title{margin:0;font-family:Anta,Hiragino Kaku Gothic ProN,Yu Gothic,Meiryo,sans-serif;font-size:clamp(1.8rem,11.6vw,1.7rem);font-weight:400;letter-spacing:.02em}.page-title{margin:0;font-size:clamp(1.35rem,2.3vw,1.9rem);font-weight:620;letter-spacing:.01em}.page-lead{margin:0;color:var(--muted);font-size:.96rem;line-height:1.55}.page-nav{display:flex;flex-wrap:wrap;gap:.9rem}.page-nav a{text-decoration:none;color:var(--muted);font-size:.92rem}.page-nav a:hover,.page-nav a:focus-visible{color:var(--accent-1)}.latest-work-section{--latest-hero-size: min(440px, calc(100vw - 3rem) );--latest-side-offset: min(38vw, 360px);display:grid;gap:.6rem;margin:-.5rem 0 1.4rem}.latest-work-header{display:flex;align-items:baseline;justify-content:space-between;gap:.6rem}.latest-work-header h2{margin:0;font-size:clamp(1.05rem,2.4vw,1.35rem);font-weight:600;letter-spacing:.01em}.latest-work-header time{color:var(--muted);font-size:.86rem}.latest-work-header span{color:var(--muted);font-size:.86rem}.latest-work-carousel{position:relative}.latest-work-tap{position:absolute;top:0;bottom:0;width:18%;border:0;padding:0;background:transparent;z-index:2;cursor:pointer}.latest-work-tap-prev{left:0}.latest-work-tap-next{right:0}.latest-work-track{list-style:none;margin:0;padding:0;position:relative;min-height:var(--latest-hero-size);overflow:hidden}.latest-work-slide{position:absolute;top:0;left:50%;opacity:0;transform:translate(-50%) scale(.88);transform-origin:center center;pointer-events:none;transition:opacity .34s ease,transform .42s cubic-bezier(.2,.8,.2,1);will-change:opacity,transform}.latest-work-slide.is-active{opacity:1;transform:translate(-50%) scale(1);pointer-events:auto;z-index:3}.latest-work-slide.is-prev{opacity:.5;transform:translate(calc(-50% - var(--latest-side-offset))) scale(.82);z-index:2}.latest-work-slide.is-next{opacity:.5;transform:translate(calc(-50% + var(--latest-side-offset))) scale(.82);z-index:2}.latest-work-hero{min-height:var(--latest-hero-size);display:grid;align-items:center;justify-items:center;margin:0}.latest-work-image-link{display:block;text-decoration:none}.latest-work-image{display:block;width:var(--latest-hero-size);height:var(--latest-hero-size);max-width:440px;max-height:440px;object-fit:contain;margin:0 auto;border-radius:var(--radius);border:1px solid var(--line);box-shadow:0 0 0 1px #dbf1fe3d,0 0 22px #dbf1fe2e}.latest-work-meta{display:flex;justify-content:space-between;align-items:baseline;gap:.6rem}.latest-work-title-link{text-decoration:none;font-size:clamp(1rem,2.2vw,1.2rem)}.latest-work-title-link:hover,.latest-work-title-link:focus-visible{color:var(--accent-1)}.latest-work-meta time{color:var(--muted);font-size:.86rem}.work-grid,.group-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem}.group-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}.work-card,.group-card{display:block;text-decoration:none}.thumb{--thumb-frame-shadow-rest: 0 0 0 1px rgba(219, 241, 254, .2), 0 0 8px rgba(219, 241, 254, .5);position:relative;width:100%;aspect-ratio:1 / 1;overflow:hidden;border-radius:var(--radius);border:1px solid var(--line);background:#081821;box-shadow:var(--thumb-frame-shadow-rest);transition:border-radius .46s cubic-bezier(.2,.82,.2,1),border-color .46s cubic-bezier(.2,.82,.2,1),box-shadow .46s cubic-bezier(.2,.82,.2,1)}.home-work-grid .thumb{content-visibility:auto;contain-intrinsic-size:240px 240px}.thumb:before,.thumb:after{content:"";position:absolute;opacity:0;pointer-events:none;transition:opacity .18s ease}.thumb:before{inset:0;z-index:1;background:linear-gradient(110deg,#dbf1fe0d 8%,#dbf1fe24 18%,#dbf1fe0d 33%),#081821;background-size:220% 100%}.thumb:after{width:clamp(2.2rem,24%,3rem);aspect-ratio:1 / 1;left:50%;top:50%;transform:translate(-50%,-50%);z-index:2;background:url(/favicon.svg) center / contain no-repeat;filter:grayscale(1) saturate(0) contrast(1.35) brightness(1.45)}.thumb.is-loading:before,.thumb.is-loading:after{opacity:1}.thumb.is-loading:before{animation:work-hero-skeleton 1.15s linear infinite}.thumb.is-loading{border-color:var(--line);box-shadow:var(--thumb-frame-shadow-rest)}.thumb.is-loaded{animation:thumb-frame-settle .52s cubic-bezier(.18,.9,.2,1) both}.thumb img{--image-pattern-base: var(--image-bg-for-dark-base);--image-pattern-dot: var(--image-bg-for-dark-dot);display:block;width:100%;height:100%;background-color:var(--image-pattern-base);background-image:radial-gradient(circle at center,var(--image-pattern-dot) 34%,transparent 37%);background-size:12px 12px;object-fit:cover;transform-origin:center center;transition:opacity .18s ease,transform .22s ease}.thumb img.is-loading{opacity:0}.thumb img[data-image-tone=light]{--image-pattern-base: var(--image-bg-for-light-base);--image-pattern-dot: var(--image-bg-for-light-dot)}@keyframes thumb-frame-settle{0%{border-color:var(--line);box-shadow:var(--thumb-frame-shadow-rest)}60%{border-radius:calc(var(--radius) * .8);border-color:color-mix(in srgb,var(--line) 72%,var(--accent-1) 28%);box-shadow:0 0 0 1px #dbf1fe4d,0 0 10px #dbf1fe8a}to{border-radius:var(--radius);border-color:var(--line);box-shadow:var(--thumb-frame-shadow-rest)}}.work-card{position:relative}.work-card-meta{position:absolute;left:.6rem;right:.6rem;bottom:.6rem;padding:.55rem .65rem;border-radius:.55rem;background:#000e14db;border:1px solid rgba(219,241,254,.22);box-shadow:var(--shadow);opacity:0;transform:translateY(6px);transition:opacity .17s ease,transform .17s ease;pointer-events:none}.work-card-title{font-size:.9rem;line-height:1.35}.work-card-date{display:block;margin-top:.15rem;font-size:.78rem;color:var(--muted)}.work-card-caption{display:none}.group-card .group-name{margin-top:.5rem;font-size:.9rem}.group-card .group-count{margin-top:.1rem;font-size:.78rem;color:var(--muted)}.group-summary{margin-top:.2rem;font-size:.78rem;color:var(--muted);line-height:1.45}.work-page{width:var(--content-width)}.work-article{display:grid;gap:1rem}.work-hero{min-height:calc(50svh - 6rem);display:grid;justify-items:center;align-items:end;position:relative;margin:0}.work-hero img{--image-pattern-base: var(--image-bg-for-dark-base);--image-pattern-dot: var(--image-bg-for-dark-dot);display:block;width:auto;max-width:100%;max-height:75svh;height:auto;background-color:var(--image-pattern-base);background-image:radial-gradient(circle at center,var(--image-pattern-dot) 34%,transparent 37%);background-size:16px 16px;object-fit:contain;margin:0 auto;border-radius:var(--radius);border:1px solid var(--line);box-shadow:0 0 0 1px #dbf1fe3d,0 0 22px #dbf1fe2e;transition:border-radius .54s cubic-bezier(.2,.82,.2,1),border-color .54s cubic-bezier(.2,.82,.2,1),box-shadow .54s cubic-bezier(.2,.82,.2,1)}.work-hero img[data-image-tone=light]{--image-pattern-base: var(--image-bg-for-light-base);--image-pattern-dot: var(--image-bg-for-light-dot)}.work-hero:before{content:"";position:absolute;inset:0;border-radius:var(--radius);border:0;background:linear-gradient(110deg,#dbf1fe0f 8%,#dbf1fe33 18%,#dbf1fe0f 33%),#081821;background-size:220% 100%;opacity:0;pointer-events:none;transition:opacity .18s ease}.work-hero.is-loading:before{opacity:1;animation:work-hero-skeleton 1.15s linear infinite}.work-hero:after{content:"";position:absolute;width:clamp(10rem,10vw,5rem);aspect-ratio:1 / 1;left:50%;top:50%;transform:translate(-50%,-50%);background:url(/favicon.svg) center / contain no-repeat;filter:grayscale(1) saturate(0) contrast(1.35) brightness(1.5);opacity:0;pointer-events:none;transition:opacity .18s ease}.work-hero.is-loading:after{opacity:.5}@keyframes work-hero-skeleton{0%{background-position:100% 0}to{background-position:-120% 0}}.work-hero-image{opacity:1;filter:blur(0);transform:scale(1);transition:opacity .28s ease,filter .54s ease,transform .54s ease}.work-hero-image.is-loading{opacity:0;filter:blur(10px);transform:scale(1.015);border-color:transparent;box-shadow:none}.work-hero-image.is-loaded{animation:work-hero-frame-settle .62s cubic-bezier(.16,.96,.25,1) both}@keyframes work-hero-frame-settle{0%{border-color:transparent;box-shadow:none}58%{border-radius:calc(var(--radius) * .72);border-color:color-mix(in srgb,var(--line) 72%,var(--accent-1) 28%);box-shadow:0 0 0 1px #dbf1fe52,0 0 20px #dbf1fe3d}to{border-radius:var(--radius);border-color:var(--line);box-shadow:0 0 0 1px #dbf1fe3d,0 0 22px #dbf1fe2e}}.work-meta{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.35rem 1rem;align-items:start}.work-heading{display:flex;flex-wrap:wrap;align-items:baseline;gap:.45rem .8rem}.work-title{margin:0;font-size:clamp(1.2rem,2vw,1.65rem);font-weight:620}.work-date{font-size:.82rem;color:var(--muted)}.work-links{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:.55rem}.work-links a{font-size:.82rem;color:var(--muted);text-decoration:none}.work-links a:hover,.work-links a:focus-visible{color:var(--accent-2)}.work-share{justify-self:end;align-items:end;display:grid;justify-items:end;gap:.35rem}.work-share-button{width:fit-content;padding:.45rem .7rem;border-radius:999px;border:1px solid var(--accent-5);background:#000e141f;color:var(--accent-5);font-size:.78rem;line-height:1.3;cursor:pointer;transition:border-color .16s ease,background-color .16s ease,color .16s ease}.work-share-button:hover,.work-share-button:focus-visible{border-color:var(--accent-5);background:#e33c6338;color:#ffd7e3}.work-share-button:disabled{opacity:.6;cursor:wait}.work-share-status{min-height:1em;margin:0;font-size:.78rem;color:var(--muted)}.work-share-status[data-state=success]{color:var(--accent-2)}.work-share-status[data-state=error]{color:var(--accent-5)}@media(max-width:720px){.work-meta{grid-template-columns:1fr}.work-share{justify-self:start;justify-items:start}}.work-content{font-size:.95rem;line-height:1.75}.work-content>:first-child{margin-top:0}@media(hover:hover){.work-card:hover .thumb img,.work-card:focus-visible .thumb img,.group-card:hover .thumb img,.group-card:focus-visible .thumb img{transform:scale(1.08)}.work-card:hover .work-card-meta,.work-card:focus-visible .work-card-meta{opacity:1;transform:translateY(0)}.group-card:hover .thumb,.group-card:focus-visible .thumb{box-shadow:var(--shadow)}}@media(max-width:720px){:root{--site-bar-height: 9.4rem}.site-bar{align-items:flex-start;flex-direction:column}.latest-work-section{display:none}}@media(hover:none){.work-card-meta{display:none}.work-card-caption{display:block;margin-top:.45rem}}@media(prefers-reduced-motion:reduce){.thumb.is-loading:before,.work-hero.is-loading:before{animation:none}.thumb,.work-hero-image{opacity:1;filter:none;transform:none;transition:none}.thumb.is-loaded,.work-hero-image.is-loaded{animation:none}}
