main{width:100%;min-height:100vh;margin:0;padding:0;display:block}html{scroll-behavior:smooth;scrollbar-width:none}html::-webkit-scrollbar{display:none}body{background:var(--bg);min-width:320px;color:var(--fg);margin:0}.portfolio{width:100%;min-height:100vh;padding:56px 0 120px;position:relative}.portfolio-inner{width:min(100% - 48px,880px);margin:0 auto}.site-controls{z-index:20;align-items:center;gap:8px;display:flex;position:fixed;top:20px;right:20px}.control-btn{width:40px;height:40px;color:var(--fg-muted);cursor:pointer;background:var(--surface);border:0;border-radius:999px;justify-content:center;align-items:center;padding:0;transition-property:color,background-color,transform;transition-duration:.16s;transition-timing-function:cubic-bezier(.2,0,0,1);display:inline-flex;position:relative}.control-btn:hover{color:var(--fg);background:var(--surface-hover)}.control-btn:active{transform:scale(.96)}.control-btn:focus-visible{outline:2px solid var(--fg);outline-offset:3px}.volume-control{background:var(--surface);border-radius:999px;align-items:center;height:40px;padding-right:0;transition-property:background-color;transition-duration:.16s;transition-timing-function:cubic-bezier(.2,0,0,1);display:flex;overflow:hidden}.volume-control.is-open{background:var(--surface-hover)}.volume-toggle{background:0 0;flex:none}.volume-control.is-open .volume-toggle,.volume-control:hover .volume-toggle{color:var(--fg);background:0 0}.volume-slider-shell{opacity:0;pointer-events:none;align-items:center;width:0;transition-property:width,opacity,transform,padding;transition-duration:.28s;transition-timing-function:cubic-bezier(.2,0,0,1);display:grid;overflow:hidden;transform:translate(6px)}.volume-control.is-open .volume-slider-shell{opacity:1;pointer-events:auto;width:104px;padding-right:14px;transform:translate(0)}.volume-slider{appearance:none;cursor:pointer;background:0 0;width:100%;height:18px;margin:0}.volume-slider:focus-visible{outline:none}.volume-slider::-webkit-slider-runnable-track{background:color-mix(in srgb, var(--fg) 16%, transparent);border-radius:999px;height:3px}.volume-slider::-webkit-slider-thumb{appearance:none;background:var(--fg);border:0;border-radius:999px;width:12px;height:12px;margin-top:-4.5px;transition-property:transform;transition-duration:.14s;transition-timing-function:cubic-bezier(.2,0,0,1);box-shadow:0 1px 2px #0000001f}.volume-slider:active::-webkit-slider-thumb{transform:scale(1.08)}.volume-slider::-moz-range-track{background:color-mix(in srgb, var(--fg) 16%, transparent);border:0;border-radius:999px;height:3px}.volume-slider::-moz-range-progress{background:color-mix(in srgb, var(--fg) 55%, transparent);border:0;border-radius:999px;height:3px}.volume-slider::-moz-range-thumb{background:var(--fg);border:0;border-radius:999px;width:12px;height:12px;box-shadow:0 1px 2px #0000001f}.theme-toggle{position:relative}.theme-icon{opacity:0;filter:blur(4px);place-items:center;transition-property:opacity,transform,filter;transition-duration:.22s;transition-timing-function:cubic-bezier(.2,0,0,1);display:grid;position:absolute;inset:0;transform:scale(.25)}.theme-icon.active{opacity:1;filter:blur();transform:scale(1)}@media (prefers-reduced-motion:reduce){.theme-icon{transition:none}}.hero{text-align:center;flex-direction:column;align-items:center;gap:48px;padding:88px 0 96px;display:flex}.identity{flex-direction:column;align-items:center;gap:6px;display:flex}.name,.role,.eyebrow,.project-line h3,.project-status,.project-description,.lightbox-meta p{margin:0;font-size:14px;line-height:1.45}.name{letter-spacing:-.03em;font-size:clamp(1.75rem,3vw,2.15rem);font-weight:500;line-height:1.15}.role{color:var(--fg-muted);letter-spacing:-.01em;font-size:15px}.intro{flex-direction:column;align-items:center;display:flex}.eyebrow{color:var(--fg-muted);letter-spacing:.07em;text-transform:uppercase;margin-bottom:16px;font-size:13px;font-weight:400}h1{letter-spacing:-.02em;text-wrap:balance;max-width:28ch;color:var(--fg-muted);margin:0 auto;font-family:Geist,Arial,sans-serif;font-size:clamp(1.15rem,2.2vw,1.35rem);font-weight:400;line-height:1.45}.hero-line{display:block}.archive-section{padding-top:88px}.section-heading{text-align:center;flex-direction:column;align-items:center;gap:12px;max-width:40ch;margin:0 auto;display:flex}.section-heading .eyebrow{margin:0}h2{letter-spacing:-.03em;margin:0;font-family:Geist,Arial,sans-serif;font-size:clamp(1.75rem,3vw,2.15rem);font-weight:500;line-height:1.15}.section-description{max-width:42ch;color:var(--fg-muted);text-wrap:pretty;margin:2px 0 0;font-size:15px;line-height:1.6}.project-list{margin-top:20px}.project-row{color:inherit;border-radius:14px;margin:0 -14px;padding:20px 14px;text-decoration:none;transition-property:background-color;transition-duration:.16s;transition-timing-function:cubic-bezier(.2,0,0,1);display:block}@media (hover:hover) and (pointer:fine){.project-row:hover{background:var(--surface)}.project-row:hover .project-arrow{color:var(--fg);transform:translate(2px,-2px)}}.project-row:focus-visible{outline:2px solid var(--fg);outline-offset:2px}.project-line{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:6px 16px;display:flex}.project-line h3{letter-spacing:-.02em;align-items:center;gap:6px;min-width:0;font-size:15px;font-weight:500;line-height:1.3;display:flex}.project-arrow{color:var(--fg-subtle);flex-shrink:0;transition-property:color,transform;transition-duration:.16s;transition-timing-function:cubic-bezier(.2,0,0,1)}.project-status{white-space:nowrap;border-radius:999px;align-items:center;gap:6px;padding:3px 10px;font-size:12px;font-weight:500;line-height:1.4;display:inline-flex}.status-dot{background:currentColor;border-radius:999px;flex-shrink:0;width:6px;height:6px}.project-status[data-tone=active]{color:var(--status-active-fg);background:var(--status-active-bg)}.project-status[data-tone=wip]{color:var(--status-wip-fg);background:var(--status-wip-bg)}.project-status[data-tone=offline]{color:var(--status-offline-fg);background:var(--status-offline-bg)}.project-status[data-tone=wip] .status-dot{animation:2.4s cubic-bezier(.4,0,.6,1) infinite project-status-pulse}@keyframes project-status-pulse{0%,to{opacity:1}50%{opacity:.35}}@media (prefers-reduced-motion:reduce){.project-status[data-tone=wip] .status-dot{animation:none}}.project-description{max-width:60ch;color:var(--fg-subtle);text-wrap:pretty;margin-top:4px;font-size:14px;line-height:1.55}.designs-section{width:min(100% - 24px,1480px);margin:0 auto;padding-top:112px}.designs-section .section-heading{margin-bottom:40px}.moodboard{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;display:grid}.design-tile{aspect-ratio:3/4;cursor:pointer;background:var(--surface);content-visibility:auto;contain-intrinsic-size:auto 420px;border:0;border-radius:4px;width:100%;padding:0;transition-property:opacity,transform;transition-duration:.18s;transition-timing-function:cubic-bezier(.2,0,0,1);display:block;position:relative;overflow:hidden}.design-tile-skeleton{background:linear-gradient(110deg, transparent 30%, #ffffff47 48%, transparent 64%), var(--surface);background-size:200% 100%,100% 100%;animation:1.4s ease-in-out infinite design-skeleton-shine;position:absolute;inset:0}[data-theme=dark] .design-tile-skeleton{background:linear-gradient(110deg, transparent 30%, #ffffff0f 48%, transparent 64%), var(--surface);background-size:200% 100%,100% 100%}.design-tile.is-loaded .design-tile-skeleton{opacity:0;pointer-events:none;transition-property:opacity;transition-duration:.22s;transition-timing-function:cubic-bezier(.2,0,0,1);animation:none}.design-tile img{object-fit:cover;opacity:0;width:100%;height:100%;transition-property:opacity,transform;transition-duration:.28s,.52s;transition-timing-function:cubic-bezier(.2,0,0,1);display:block;position:absolute;inset:0}.design-tile.is-loaded img{opacity:1}@keyframes design-skeleton-shine{0%{background-position:120% 0,0 0}to{background-position:-80% 0,0 0}}@media (prefers-reduced-motion:reduce){.design-tile-skeleton,.lightbox-skeleton{animation:none}}@media (hover:hover) and (pointer:fine){.design-tile.is-loaded:hover img{transform:scale(1.04)}}.design-tile:active{transform:scale(.985)}.design-tile:focus-visible{outline:2px solid var(--fg);outline-offset:3px;z-index:2}.lightbox{z-index:10;background:var(--overlay);-webkit-backdrop-filter:blur(3px);place-items:center;padding:32px;display:grid;position:fixed;inset:0}.lightbox-content{flex-direction:column;gap:18px;max-width:min(100%,920px);max-height:100%;display:flex;position:relative}.lightbox-content img{outline:1px solid var(--border);outline-offset:-1px;transform-origin:50%;border-radius:10px;max-width:100%;max-height:calc(100vh - 200px);margin:auto;transition-property:transform;transition-duration:.16s;transition-timing-function:cubic-bezier(.2,0,0,1);display:block}.lightbox-image-stage{cursor:zoom-in;touch-action:none;border-radius:10px;max-width:100%;max-height:calc(100vh - 200px);display:grid;overflow:hidden}.lightbox-image-stage.zoomed{cursor:grab}.lightbox-image-stage.panning{cursor:grabbing}.lightbox-image-stage.panning img{transition-duration:0s}.lightbox-meta{color:#f5f5f5;flex-direction:column;gap:8px;width:0;min-width:100%;padding:0 2px;display:flex}.lightbox-meta-head{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:4px 16px;display:flex}#lightbox-title{letter-spacing:-.02em;color:#f5f5f5;font-size:16px;font-weight:500}.lightbox-date{color:#ffffff80;flex-shrink:0;font-size:13px}.lightbox-description{color:#ffffffc7;text-wrap:pretty;max-width:64ch;font-size:14px;line-height:1.6}.song-link{color:#ffffffc7;background:#ffffff1a;border:0;border-radius:999px;align-self:flex-start;align-items:center;gap:6px;margin-top:6px;padding:7px 12px 7px 11px;font-size:12px;font-weight:500;line-height:1.3;text-decoration:none;transition-property:color,background-color,transform;transition-duration:.16s;transition-timing-function:cubic-bezier(.2,0,0,1);display:inline-flex}@media (hover:hover) and (pointer:fine){.song-link:hover{color:#fff;background:#ffffff29}}.song-link:active{transform:scale(.96)}@media (width<=1100px){.moodboard{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (width<=850px){.portfolio{padding-top:40px;padding-bottom:88px}.portfolio-inner{width:min(100% - 32px,640px)}.site-controls{top:14px;right:14px}.hero{gap:36px;padding:64px 0 72px}.archive-section{padding-top:64px}.project-list{margin-top:16px}.project-row{margin:0 -10px;padding:16px 10px}.designs-section{width:min(100% - 16px,1480px);padding-top:80px}.designs-section .section-heading{margin-bottom:28px}.moodboard{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}.lightbox{padding:18px}.lightbox-content{gap:14px}.lightbox-content img{max-height:calc(100vh - 180px)}}