:root{--background-color:#171a21;--overlay-color:#0000004e;--primary-color:#ffd166;--primary-hover-color:#ffe08f;--foreground-color:#fff;--card-color:#1f232c;--accent-color:#ffffff0a;--text-color:#f3efe8;--faint-text-color:#a9b0bd;--link-color:var(--primary-color);--button-color:#4f4f4f;--button-hover-color:#393939;--input-bg-color:#2a2a2a;--input-bg-hover-color:#333;--border-color:#3a4050;--success-color:#0e8b3c;--destructive-color:#ab2222;--info-color:#3b82f6;--header-height:80px;--paper-color:#fbf8f1;--paper-text-color:#1c1c1c;--mint-color:#7ee0c3;--rose-color:#ff9aa2;--font-body:"Bricolage Grotesque", system-ui, sans-serif;--font-hand:"Caveat", cursive;--page-max-width:1120px;--page-padding:clamp(20px, 5vw, 56px)}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;min-height:100%}body{background-color:var(--background-color);color:var(--text-color);font-size:16px;font-family:var(--font-body);line-height:1.55}a{color:var(--link-color);text-decoration:none}ul{list-style:none}img{max-width:100%}:focus-visible{outline:3px solid var(--primary-color);outline-offset:3px}.hand{font-family:var(--font-hand);font-weight:600}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}#root{background-color:var(--background-color);flex-direction:column;align-items:stretch;gap:1rem;width:100%;min-height:100vh;display:flex;overflow-x:clip}.page{width:100%;max-width:var(--page-max-width);padding:0 var(--page-padding);margin:0 auto}.section{padding-bottom:clamp(64px,10vw,104px)}.section-title{color:var(--primary-color);margin-bottom:28px;font-size:44px;line-height:1.1}.page-header{width:100%;max-width:var(--page-max-width);padding:1rem var(--page-padding);flex-flow:wrap;justify-content:space-between;align-items:center;gap:.75rem 2rem;margin:0 auto;display:flex}.page-header .logo{height:2.5rem;display:block}.page-header .header-content{justify-content:left;align-items:center;gap:1rem;display:flex}.page-header .header-name{font-weight:800}.page-header .header-nav{flex-direction:row;gap:1.75rem;display:flex}.page-header .header-nav a{color:var(--faint-text-color)}.page-header .header-nav a:hover{color:var(--text-color);text-decoration:underline}.page-footer{width:100%;max-width:var(--page-max-width);padding:2rem var(--page-padding) 4rem;border-top:2px dashed var(--border-color);flex-direction:column;margin:auto auto 0;display:flex}.page-footer .section-title{margin-top:2rem}.page-footer a{text-decoration:none}.page-footer a:hover{text-decoration:underline}.page-footer .footer-mail{letter-spacing:-.02em;overflow-wrap:anywhere;font-size:clamp(24px,4vw,40px);font-weight:800}.page-footer .footer-links{gap:1.5rem;margin:1.25rem 0 3rem;display:flex}.page-footer .footer-copy{color:var(--faint-text-color);font-size:.875rem}.hero{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:48px;padding:clamp(40px,8vw,88px) 0 clamp(64px,10vw,112px);display:flex}.hero .hero-text{flex:420px}.hero .hero-hello{color:var(--primary-color);font-size:36px}.hero .hero-title{letter-spacing:-.04em;margin:4px 0 20px;font-size:clamp(60px,12vw,120px);font-weight:800;line-height:.92}.hero .hero-role{color:var(--faint-text-color);font-size:clamp(20px,2.5vw,26px)}.hero .polaroid{background-color:var(--paper-color);color:var(--paper-text-color);margin-right:12px;padding:14px 14px 18px;transform:rotate(4deg);box-shadow:0 22px 44px #00000080}.hero .polaroid img{object-fit:cover;width:260px;height:260px;display:block}.hero .polaroid figcaption{text-align:center;margin-top:8px;font-size:30px}.expertise .expertise-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;display:grid}.expertise .expertise-item{border:2px dashed var(--border-color);border-radius:16px;padding:28px}.expertise .expertise-item h3{letter-spacing:-.01em;margin-bottom:10px;font-size:24px}.expertise .expertise-item p{max-width:46ch;color:var(--faint-text-color)}.projects .projects-list{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;display:grid}.projects .project{height:100%;min-height:260px;color:var(--paper-text-color);border-radius:6px;flex-direction:column;padding:28px;display:flex}.projects .project-sun{background-color:var(--primary-color)}.projects .project-mint{background-color:var(--mint-color)}.projects .project-rose{background-color:var(--rose-color)}.projects .project-year{font-weight:600}.projects .project-title{letter-spacing:-.03em;margin:auto 0 8px;font-size:clamp(36px,5vw,48px);font-weight:800;line-height:1}.projects .project-summary{max-width:32ch}.projects .project:hover .project-title{text-decoration:underline;text-decoration-thickness:3px}.postcards .section-title-large{margin-bottom:40px;font-size:clamp(44px,7vw,64px)}.postcards .postcards-list{flex-wrap:wrap;align-items:flex-start;gap:56px 40px;display:flex}.postcards .postcard{width:min(100%, var(--w));transform:rotate(var(--tilt));transition:transform .25s}.postcards .postcard:hover{transform:rotate(0)scale(1.03)}.postcards .postcard-photo{background-color:var(--paper-color);color:var(--paper-text-color);padding:10px 10px 0;box-shadow:0 18px 36px #00000080}.postcards .postcard-photo img{width:100%;aspect-ratio:var(--ratio);object-fit:cover;display:block}.postcards .postcard-photo figcaption{padding:6px 0 8px;font-size:30px;line-height:1.2}.postcards .postcard-text{max-width:38ch;color:var(--faint-text-color);margin-top:14px;font-size:15px}@media (prefers-reduced-motion:reduce){.postcards .postcard{transition:none}}.skills .skills-list{flex-wrap:wrap;gap:12px;display:flex}.skills .skills-list li{background-color:var(--paper-color);color:var(--paper-text-color);border-radius:999px;padding:8px 18px;font-weight:600}.project-page .project-back{color:var(--faint-text-color);margin:8px 0 24px;display:inline-block}.project-page .project-back:hover{color:var(--text-color);text-decoration:underline}.project-page .project-hero{color:var(--paper-text-color);border-radius:6px;padding:clamp(28px,5vw,56px)}.project-page .project-hero-sun{background-color:var(--primary-color)}.project-page .project-hero-mint{background-color:var(--mint-color)}.project-page .project-hero-rose{background-color:var(--rose-color)}.project-page .project-hero-year{font-weight:600}.project-page .project-hero-title{letter-spacing:-.04em;overflow-wrap:anywhere;margin:8px 0 12px;font-size:clamp(48px,9vw,96px);font-weight:800;line-height:.95}.project-page .project-hero-subtitle{font-size:clamp(18px,2.5vw,24px)}.project-page .project-tech{flex-wrap:wrap;gap:10px;margin-top:24px;display:flex}.project-page .project-tech li{background-color:var(--paper-color);border-radius:999px;padding:6px 16px;font-weight:600}.project-page .project-intro{max-width:60ch;margin:clamp(32px,5vw,56px) 0 32px;font-size:clamp(18px,2vw,22px)}.project-page .project-meta{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;padding-bottom:clamp(48px,8vw,80px);display:grid}.project-page .project-meta-item{border:2px dashed var(--border-color);border-radius:16px;padding:28px}.project-page .project-meta-item h2{letter-spacing:-.01em;margin-bottom:10px;font-size:24px}.project-page .project-meta-item li{color:var(--faint-text-color)}.project-page .project-text{max-width:62ch;margin-bottom:20px}.project-page .project-list{gap:10px;max-width:62ch;display:grid}.project-page .project-list li{color:var(--faint-text-color);padding-left:1.5em;position:relative}.project-page .project-list li:before{content:"–";color:var(--primary-color);font-weight:800;position:absolute;left:0}.project-page .project-highlight{flex-wrap:wrap;align-items:baseline;gap:4px 20px;margin-bottom:24px;display:flex}.project-page .project-highlight-value{color:var(--primary-color);font-size:clamp(72px,12vw,120px);line-height:1}.project-page .project-highlight-label{font-size:clamp(18px,2.5vw,24px)}.project-page .project-embed{background-color:var(--paper-color);margin-top:32px;padding:10px;box-shadow:0 18px 36px #00000080}.project-page .project-embed iframe{aspect-ratio:16/10;border:0;width:100%;min-height:360px;display:block}.modal-overlay{background-color:var(--overlay-color);z-index:1000;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:fixed;top:0;left:0}.modal-content{width:fit-content;height:fit-content}