@import "https://fonts.googleapis.com/css2?family=Courgette&family=IBM+Plex+Mono:wght@400;700&display=swap";:root{--page-bg:#161318;--text:#221d27;--muted:#5c5363;--accent:#871eb8;--paper:#f7f2e7;--tab:#ece6d9;--tab-active:#f4c84d;--line:#221d2729;color:var(--text);background:var(--page-bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:IBM Plex Mono,SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace}*{box-sizing:border-box}html{background:var(--page-bg)}body{background:var(--page-bg);min-width:320px;min-height:100svh;margin:0;overflow-x:hidden}img{max-width:100%;display:block}button{font:inherit}#app{min-height:100svh}.home-page{background:radial-gradient(circle at 50% 28%, #871eb833, transparent 30%), var(--page-bg);min-height:100svh;padding:32px 16px;position:relative;overflow:hidden}.hero{place-items:center;min-height:calc(100svh - 64px);display:grid}.hero-composition{aspect-ratio:1453/993;width:min(100%,1453px);margin:0 auto;position:relative}.notebook-frame,.hero-background,.hero-object,.hero-copy{position:absolute}.notebook-frame{z-index:1;width:100%;height:100%;inset:0}.hero-background{z-index:2;width:93%;top:32%;left:50%;transform:translate(-50%,-50%)}.hero-copy{z-index:4;text-align:center;width:34%;padding:16px;top:20%;left:50%;transform:translate(-50%)}.hero-name,.hero-tagline{color:var(--muted);margin:0;line-height:1.4}.hero-name{color:var(--text);margin-bottom:12px;font-family:Courgette,cursive;font-size:80px;font-weight:400;line-height:1}.hero-copy h1{color:var(--text);letter-spacing:0;margin:0;font-family:IBM Plex Mono,SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;font-size:16px;font-weight:400;line-height:1.25}.hero-divider{background:var(--line);width:128px;height:1px;margin:28px auto 0;display:block}.hero-tagline{color:var(--text);margin-top:28px;font-family:IBM Plex Mono,SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;font-size:32px;font-weight:400;line-height:1.2}.hero-object.hero-polaroid{z-index:3;aspect-ratio:331/387;width:20%;top:15%;left:50%;transform:translate(-50%)rotate(0)}.hero-polaroid-photo{z-index:3;transform-origin:0 0;border-radius:2px;width:83.4%;height:72.8%;position:absolute;top:4.8%;left:10.7%;overflow:hidden;transform:rotate(2.522deg)}.hero-polaroid-developing-image{object-fit:cover;opacity:0;filter:contrast(.65)saturate(.55)brightness(1.18);width:100%;height:100%;animation:7s ease-in-out infinite polaroid-develop}.hero-polaroid-frame{z-index:2;width:100%;height:auto;position:relative}.hero-object{z-index:5;pointer-events:none;-webkit-user-select:none;user-select:none;height:auto;transition:transform .52s cubic-bezier(.2,.8,.2,1),opacity .32s}@keyframes polaroid-develop{0%{opacity:0;filter:contrast(.65)saturate(.55)brightness(1.18)}71%{opacity:.7;filter:contrast(.9)saturate(.82)brightness(1.05)}84%{opacity:.7;filter:contrast(.9)saturate(.82)brightness(1.05)}to{opacity:0;filter:contrast(.65)saturate(.55)brightness(1.18)}}.hero-group-left{z-index:8;width:31.6%;top:2.4%;left:3%}.hero-group-right{z-index:8;width:30%;top:11%;right:8%}.hero-pencil{z-index:7;width:30%;transition:transform .62s cubic-bezier(.18,1.24,.32,1),opacity .32s;top:42%;left:50%;transform:translate(-50%)rotate(-1deg)}.home-page.is-project-open .hero-group-left{transform:translate(-120%)rotate(-8deg)}.home-page.is-project-open .hero-group-right{transform:translate(120%)rotate(6deg)}.home-page.is-project-open .hero-pencil{transform:translate(-50%,-155%)rotate(-24deg)}.home-page.is-project-open{max-height:100svh}.tabbed-paper{width:min(100%,1320px);margin:-320px auto 0;padding:0 16px 64px;position:relative}.tab-row{z-index:2;scrollbar-width:none;gap:16px;padding:0;display:flex;position:relative;overflow-x:auto}.tab-row::-webkit-scrollbar{display:none}.tab-button{min-width:184px;min-height:64px;color:var(--text);text-align:center;white-space:nowrap;cursor:pointer;background:var(--tab);border:1px solid var(--line);border-bottom:0;border-radius:18px 18px 0 0;flex:none;padding:16px 24px;font-weight:700}.tab-button.is-active{z-index:3;background:var(--tab-active);min-height:66px;position:relative;transform:translateY(-2px)}.content-paper{z-index:1;background:var(--paper);border:1px solid var(--line);border-radius:0 24px 24px;min-height:420px;margin-top:-1px;padding:32px;position:relative;overflow:hidden;box-shadow:0 24px 48px #00000038}.content-paper p{color:var(--text);margin:0;font-size:1.25rem;font-weight:700;line-height:1.4}.project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:64px 48px;display:grid}.project-card{flex-direction:column;min-width:0;display:flex;position:relative}.project-card-button{z-index:2;cursor:pointer;background:0 0;border:0;padding:0;position:absolute;inset:0}.project-card-button:focus-visible{outline:3px solid var(--accent);outline-offset:6px}.project-card-visual{width:100%;height:auto;margin-bottom:16px}.project-card h2{color:var(--text);margin:0 0 16px;font-size:32px;line-height:1.1}.project-year,.project-description{color:var(--text);margin:0;font-size:16px;line-height:1.4}.project-year{margin-bottom:16px;font-weight:700}.project-description{font-weight:400}.project-detail-panel{z-index:20;pointer-events:none;background:var(--paper);border:1px solid var(--line);opacity:0;border-radius:0 24px 24px;width:min(100% - 32px,1320px);height:calc(100svh - 64px);padding:32px;transition:transform .42s cubic-bezier(.2,.8,.2,1),opacity .24s;position:absolute;top:32px;left:50%;overflow-y:auto;transform:translate(-50%,100%);box-shadow:0 24px 56px #00000047}.home-page.is-project-open .project-detail-panel{pointer-events:auto;opacity:1;transform:translate(-50%)}.project-detail-close{z-index:1;min-height:40px;color:var(--text);cursor:pointer;background:var(--tab);border:1px solid var(--line);border-radius:999px;padding:8px 16px;font-weight:700;position:absolute;top:16px;left:16px}.project-detail-content{gap:16px;max-width:880px;padding-top:56px;display:grid}.project-detail-year,.project-detail-intro{color:var(--text);margin:0;font-size:16px;line-height:1.5}.project-detail-year{font-weight:700}.project-detail-content h2{color:var(--text);margin:0;font-size:40px;line-height:1.05}.project-detail-media{border:1px solid var(--line);background:#221d270f;border-radius:16px;min-height:220px;margin-top:16px}@media (width<=760px){.home-page{padding:48px 16px 0}.hero{align-items:start;min-height:calc(100svh - 96px)}.hero-composition{width:100%;min-width:0;transform:none}.hero-copy{width:38%;padding:0;top:18%;left:50%;transform:translate(-50%)}.hero-name{margin-bottom:8px;font-size:28px}.hero-copy h1{font-size:8px;font-weight:400;line-height:1.2}.hero-divider{width:48px;margin-top:12px}.hero-tagline{margin-top:12px;font-size:13px;font-weight:400;line-height:1.2}.hero-group-left{width:21.6%;top:4%;left:2%}.hero-group-right{width:26%;top:12%;right:5%}.hero-object.hero-polaroid{width:16%;top:23%;left:50%}.hero-pencil{width:28%;top:41%;left:50%}.tabbed-paper{margin-top:calc(344px - 100svh);padding:0 0 48px}.tab-row{gap:16px;padding:0}.tab-button{border-radius:16px 16px 0 0;min-width:152px;min-height:56px;padding:16px}.tab-button.is-active{min-height:58px}.content-paper{border-radius:0 18px 18px;min-height:320px;padding:24px 16px}.project-grid{grid-template-columns:1fr;gap:48px}.project-detail-panel{border-radius:0 18px 18px;width:calc(100% - 32px);height:calc(100svh - 32px);padding:16px;top:16px}.project-detail-content h2{font-size:32px}.project-detail-media{min-height:180px}}@media (prefers-reduced-motion:reduce){.hero-object,.hero-pencil,.project-detail-panel{transition:transform .16s,opacity .16s}.home-page.is-project-open .hero-group-left,.home-page.is-project-open .hero-group-right,.home-page.is-project-open .hero-pencil{opacity:.3;transform:none}.hero-polaroid-developing-image{opacity:.7;filter:contrast(.9)saturate(.82)brightness(1.05);animation:none}}@media (width<=420px){.hero-composition{width:100%;min-width:0}}