.background-scene[data-astro-cid-dee5he2l]{z-index:-1;pointer-events:none;background-color:var(--page);position:fixed;inset:0;overflow:hidden}.scene[data-astro-cid-dee5he2l]{opacity:0;transition:opacity var(--motion-scene) var(--ease-scene);position:absolute;inset:0}html[data-theme=night] .scene[data-astro-cid-dee5he2l][data-scene=night],html[data-theme=pearl] .scene[data-astro-cid-dee5he2l][data-scene=pearl],html:not([data-theme]) .scene[data-astro-cid-dee5he2l][data-scene=night]{opacity:1}@media (prefers-color-scheme:light){html:not([data-theme]) .scene[data-astro-cid-dee5he2l][data-scene=night]{opacity:0}html:not([data-theme]) .scene[data-astro-cid-dee5he2l][data-scene=pearl]{opacity:1}}.scene-poster[data-astro-cid-dee5he2l],.scene-video[data-astro-cid-dee5he2l],.scene-poster[data-astro-cid-dee5he2l] img[data-astro-cid-dee5he2l]{width:100%;height:100%;position:absolute;inset:0}.scene-poster[data-astro-cid-dee5he2l] img[data-astro-cid-dee5he2l],.scene-video[data-astro-cid-dee5he2l]{object-fit:cover;object-position:center}.scene-video[data-astro-cid-dee5he2l]{opacity:0;transition:opacity var(--motion-scene) var(--ease-scene)}.scene-video[data-astro-cid-dee5he2l][data-video-state=playing]{opacity:1}.scene-scrim[data-astro-cid-dee5he2l]{background:linear-gradient(90deg, color-mix(in srgb, var(--page) 62%, transparent) 0%, color-mix(in srgb, var(--page) 30%, transparent) 42%, transparent 72%);position:absolute;inset:0}@media (width<=767px){.scene-scrim[data-astro-cid-dee5he2l]{background:linear-gradient(180deg, color-mix(in srgb, var(--page) 48%, transparent) 0%, transparent 38%, color-mix(in srgb, var(--page) 55%, transparent) 100%)}}html{scroll-padding-top:var(--anchor-offset)}.skip-link{z-index:var(--z-modal);border-radius:0 0 var(--radius-control) 0;background:var(--glass);backdrop-filter:blur(var(--glass-blur-nav)) saturate(var(--glass-saturate));border:1px solid var(--line);color:var(--ink);font-family:var(--font-sans);transition:transform var(--motion-control) var(--ease-out);padding:.6rem 1rem;font-size:.95rem;text-decoration:none;position:fixed;top:0;left:0;transform:translateY(-120%)}.skip-link:focus-visible{transform:translateY(0)}.site-header{z-index:var(--z-nav);color:var(--ink);position:fixed;top:0;left:0;right:0}.site-header__bar{z-index:calc(var(--z-overlay) + 1);height:var(--header-height);padding:0 var(--page-gutter);padding-top:env(safe-area-inset-top,0px);transition:height var(--motion-control) var(--ease-out), background-color var(--motion-control) var(--ease-out), border-color var(--motion-control) var(--ease-out), backdrop-filter var(--motion-control) var(--ease-out);border-bottom:1px solid #0000;align-items:center;gap:1rem;display:flex;position:relative}.site-header[data-scrolled=true] .site-header__bar,.site-header[data-menu-open=true] .site-header__bar{height:calc(var(--header-height-scrolled) + env(safe-area-inset-top,0px));background:var(--glass);border-bottom-color:var(--line);backdrop-filter:blur(var(--glass-blur-nav)) saturate(var(--glass-saturate))}.wordmark{font-family:var(--font-display);color:var(--ink);letter-spacing:.01em;white-space:nowrap;font-size:clamp(1.15rem,1.6vw,1.45rem);line-height:1.2;text-decoration:none}.wordmark:hover{color:var(--accent-strong)}.site-header__spacer{flex:auto}.site-nav--desktop{display:none}.site-nav__list{align-items:center;gap:.25rem;margin:0;padding:0;list-style:none;display:flex}.site-nav__link{border-radius:var(--radius-control);min-height:44px;color:var(--ink-muted);font-family:var(--font-sans);white-space:nowrap;transition:color var(--motion-control) var(--ease-out), background-color var(--motion-control) var(--ease-out);align-items:center;padding:.35rem .85rem;font-size:.95rem;text-decoration:none;display:inline-flex;position:relative}.site-nav__link:hover{color:var(--ink)}.site-nav__link[aria-current=true]{color:var(--ink);background:color-mix(in srgb, var(--accent) 16%, transparent)}.site-nav__dot{background:var(--accent-strong);opacity:0;width:5px;height:5px;transition:opacity .22s var(--ease-out), transform .22s var(--ease-out);border-radius:50%;margin-left:.5rem;transform:scale(.4)}.site-nav__link[aria-current=true] .site-nav__dot{opacity:1;transform:scale(1)}.site-header__actions{align-items:center;gap:.5rem;display:flex}.menu-toggle{border:1px solid var(--line);border-radius:var(--radius-control);background:var(--glass);width:44px;height:44px;backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));color:var(--ink);cursor:pointer;transition:background-color var(--motion-control) var(--ease-out), border-color var(--motion-control) var(--ease-out), transform var(--motion-fast) var(--ease-out);justify-content:center;align-items:center;padding:0;display:inline-flex}.menu-toggle:active{transform:scale(.96)}.menu-toggle__icon-close,.site-header[data-menu-open=true] .menu-toggle__icon-open{display:none}.site-header[data-menu-open=true] .menu-toggle__icon-close{display:block}.mobile-menu{z-index:var(--z-overlay);padding:calc(var(--header-height-scrolled) + env(safe-area-inset-top,0px) + .75rem) var(--page-gutter) calc(2rem + env(safe-area-inset-bottom,0px));background:color-mix(in srgb, var(--page) 82%, transparent);backdrop-filter:blur(var(--glass-blur-overlay)) saturate(var(--glass-saturate));opacity:0;visibility:hidden;pointer-events:none;transition:opacity var(--motion-control) var(--ease-out), visibility 0s linear var(--motion-control);position:fixed;inset:0;overflow-y:auto}.site-header[data-menu-open=true] .mobile-menu{opacity:1;visibility:visible;pointer-events:auto;transition:opacity var(--motion-control) var(--ease-out), visibility 0s}.mobile-menu__title{font-family:var(--font-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-muted);margin:0 0 1rem;font-size:.85rem}.mobile-menu__list{gap:.25rem;margin:0;padding:0;list-style:none;display:grid}.mobile-menu__link{border-radius:var(--radius-control);min-height:56px;color:var(--ink);font-family:var(--font-display);justify-content:space-between;align-items:center;gap:1rem;padding:.5rem .9rem;font-size:clamp(1.6rem,7vw,2.2rem);line-height:1.25;text-decoration:none;display:flex}.mobile-menu__link:active{background:color-mix(in srgb, var(--accent) 18%, transparent)}.mobile-menu__link[aria-current=true]{background:color-mix(in srgb, var(--accent) 16%, transparent)}.mobile-menu__link[aria-current=true]:after{content:"";background:var(--accent-strong);border-radius:50%;width:7px;height:7px}.mobile-menu__hint{border-top:1px solid var(--line);color:var(--ink-muted);font-family:var(--font-sans);margin:1.5rem 0 0;padding-top:1.25rem;font-size:.9rem;line-height:1.6}html[data-menu-open=true]{overscroll-behavior:none}@media (width>=900px){.site-nav--desktop{display:block}.menu-toggle,.mobile-menu{display:none}}html:not(.js) .menu-toggle{display:none}html:not(.js) .site-header{position:static}html:not(.js) .site-header__bar{height:auto;padding-top:calc(env(safe-area-inset-top,0px) + .75rem);flex-wrap:wrap;padding-bottom:.75rem}html:not(.js) .site-header__spacer{display:none}html:not(.js) .mobile-menu{visibility:visible;opacity:1;pointer-events:auto;padding:0 var(--page-gutter) 1rem;backdrop-filter:none;background:0 0;position:static;overflow:visible}html:not(.js) .mobile-menu__title{display:none}html:not(.js) .mobile-menu__list{flex-flow:wrap;gap:.25rem .75rem;display:flex}html:not(.js) .mobile-menu__link{min-height:44px;font-family:var(--font-sans);font-size:.95rem}@media (width<=599px){.site-header__bar{gap:8px}.site-header__spacer{display:none}.wordmark{white-space:normal;text-wrap:balance;align-items:center;min-height:44px;font-size:clamp(14px,4.1vw,18px);display:inline-flex}.site-header__actions{flex-shrink:0;gap:4px;margin-left:auto}}@media (prefers-reduced-motion:reduce){.mobile-menu,.site-header__bar,.skip-link,.site-nav__link,.site-nav__dot,.menu-toggle{transition:none}}.theme-controls[data-astro-cid-kj7ttrhe]{gap:.5rem;display:flex}.control-button[data-astro-cid-kj7ttrhe]{border:1px solid var(--line);border-radius:var(--radius-control);background:var(--glass);width:44px;height:44px;backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));color:var(--ink);cursor:pointer;transition:background-color var(--motion-control) var(--ease-out), border-color var(--motion-control) var(--ease-out), transform var(--motion-fast) var(--ease-out);justify-content:center;align-items:center;padding:0;display:inline-flex;position:relative}.control-button[data-astro-cid-kj7ttrhe]:hover{border-color:var(--glass-highlight)}.control-button--motion[data-astro-cid-kj7ttrhe]{gap:7px;width:auto;padding-inline:10px}.control-button__icon[data-astro-cid-kj7ttrhe]{flex:none;justify-content:center;align-items:center;width:18px;height:18px;display:inline-flex;position:relative}.control-button--motion[data-astro-cid-kj7ttrhe] .icon[data-astro-cid-kj7ttrhe]{width:18px;height:18px}.control-button__label[data-astro-cid-kj7ttrhe]{white-space:nowrap;font-size:12px;line-height:1}.control-button[data-astro-cid-kj7ttrhe]:active{transform:scale(.96)}.icon[data-astro-cid-kj7ttrhe]{width:22px;height:22px;transition:opacity var(--motion-control) var(--ease-out), transform var(--motion-control) var(--ease-out);position:absolute}.icon-moon[data-astro-cid-kj7ttrhe],.icon-play[data-astro-cid-kj7ttrhe]{opacity:0;transform:rotate(-30deg)scale(.9)}html[data-theme=night] .icon-sun[data-astro-cid-kj7ttrhe],html[data-theme=pearl] .icon-moon[data-astro-cid-kj7ttrhe]{opacity:0;transform:rotate(30deg)scale(.9)}html[data-theme=night] .icon-moon[data-astro-cid-kj7ttrhe],html[data-theme=pearl] .icon-sun[data-astro-cid-kj7ttrhe]{opacity:1;transform:rotate(0)scale(1)}.control-button[data-astro-cid-kj7ttrhe][aria-pressed=true] .icon-pause[data-astro-cid-kj7ttrhe],.control-button[data-astro-cid-kj7ttrhe][aria-pressed=false] .icon-play[data-astro-cid-kj7ttrhe]{opacity:0;transform:scale(.9)}.control-button[data-astro-cid-kj7ttrhe][aria-pressed=true] .icon-play[data-astro-cid-kj7ttrhe],.control-button[data-astro-cid-kj7ttrhe][aria-pressed=false] .icon-pause[data-astro-cid-kj7ttrhe]{opacity:1;transform:scale(1)}@media (prefers-reduced-motion:reduce){.icon[data-astro-cid-kj7ttrhe]{transition:none}}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.portfolio-section,.portfolio-overview{scroll-margin-top:var(--anchor-offset);max-width:var(--content-max);padding:var(--section-space) var(--page-gutter);margin:0 auto}.portfolio-overview{padding-top:clamp(104px,14vh,168px)}.portfolio-head{margin-bottom:32px}.portfolio-head__text{max-width:42rem}.portfolio-head__title{font-family:var(--font-display);margin:0 0 12px;font-size:clamp(34px,4.4vw,58px);font-weight:400;line-height:1.2}.portfolio-head__intro{color:var(--ink-muted);margin:0;font-size:15px;line-height:1.8}.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,2.4vw,32px);margin:0;padding:0;list-style:none;display:grid}.portfolio-card{aspect-ratio:4/3;border-radius:var(--radius-window);border:1px solid var(--line);background:var(--glass);min-width:0;backdrop-filter:blur(var(--glass-blur));transition:border-color var(--motion-control),box-shadow var(--motion-control);position:relative;box-shadow:0 12px 40px #0000000b}.portfolio-card:hover,.portfolio-card:focus-within{border-color:var(--accent);box-shadow:0 16px 44px #00000015}.card{flex-direction:column;height:100%;display:flex}.card__media{border-radius:calc(var(--radius-window) - 1px) calc(var(--radius-window) - 1px) 0 0;border-bottom:1px solid var(--line);flex:1;min-height:0;position:relative;overflow:hidden}.project-media{width:100%;height:100%;position:relative}.project-media__img{object-fit:cover;width:100%;height:100%;display:block}.card__ordinal,.card__state-badge{z-index:1;background:color-mix(in srgb,var(--page) 90%,transparent);border:1px solid var(--line);backdrop-filter:blur(12px);color:var(--ink);position:absolute;top:14px}.card__ordinal{font-family:var(--font-mono);border-radius:8px;padding:5px 9px;font-size:12px;left:14px}.card__state-badge{border-radius:var(--radius-pill);max-width:calc(100% - 70px);padding:5px 11px;font-size:11px;line-height:1.5;right:14px}.card__info{flex:none;min-width:0;padding:20px 24px 18px}.card__title{color:var(--ink);margin:0;font-size:clamp(17px,1.6vw,22px);font-weight:500;line-height:1.4}.card__link{color:inherit;-webkit-line-clamp:2;-webkit-box-orient:vertical;text-decoration:none;display:-webkit-box;overflow:hidden}.card__link:after{content:"";border-radius:var(--radius-window);position:absolute;inset:0}.card__link:focus-visible{outline:none}.card__link:focus-visible:after{outline:2px solid var(--accent-strong);outline-offset:5px}.card__summary{min-height:2.8em;color:var(--ink-muted);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:8px 0 0;font-size:13px;line-height:1.6;display:-webkit-box;overflow:hidden}.card__actions{justify-content:space-between;align-items:center;gap:12px;min-height:36px;margin-top:12px;display:flex}.card__demo,.project-detail__demo{z-index:2;border:1px solid var(--line);border-radius:var(--radius-control);background:var(--accent-strong);min-height:40px;color:var(--page);transition:filter var(--motion-control);justify-content:center;align-items:center;gap:16px;padding:0 15px;font-size:13px;font-weight:600;text-decoration:none;display:inline-flex;position:relative}.card__demo:hover,.project-detail__demo:hover{filter:brightness(1.12)}.card__demo:focus-visible,.project-detail__demo:focus-visible{outline:2px solid var(--accent-strong);outline-offset:4px}.card__read{color:var(--accent-strong);align-items:center;gap:12px;margin-left:auto;font-size:12px;display:inline-flex}.card__tools{flex-wrap:wrap;align-content:flex-start;gap:4px 16px;min-height:2.8em;margin:8px 0 0;padding:0;list-style:none;display:flex}.card__tool{color:var(--ink-muted);align-items:baseline;gap:7px;font-size:13px;line-height:1.6;display:flex}.card__tool-ordinal{font-family:var(--font-mono);font-size:10px}html.js .reveal:not(.is-visible){opacity:0;transform:translateY(18px)}.reveal{transition:opacity var(--motion-reveal) var(--ease-out),transform var(--motion-reveal) var(--ease-out)}.project-detail{z-index:var(--z-base);width:100%;max-width:calc(820px + 2 * var(--page-gutter));padding:clamp(108px,13vh,160px) var(--page-gutter) 80px;margin:0 auto;position:relative}.project-detail__header{margin-bottom:40px}.project-detail__topline{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin-bottom:28px;display:flex}.project-detail__back,.project-detail__footer a{color:var(--ink-muted);font-size:13px;text-decoration:none}.project-detail__back:hover,.project-detail__footer a:hover{color:var(--ink)}.project-detail__status{color:var(--accent-strong);border:1px solid var(--line);border-radius:var(--radius-pill);padding:5px 12px;font-size:12px}.project-detail__title{font-family:var(--font-display);overflow-wrap:anywhere;margin:0;font-size:clamp(30px,4.3vw,49px);font-weight:400;line-height:1.3}.project-detail__summary{color:var(--ink-muted);margin:16px 0 0;font-size:16px;line-height:1.8}.project-detail__action{border:1px solid var(--line);background:var(--glass);backdrop-filter:blur(var(--glass-blur));border-radius:18px;margin-top:24px;padding:20px 24px}.project-detail__demo-row{flex-wrap:wrap;align-items:center;gap:12px 20px;display:flex}.project-detail__demo{min-height:44px}.project-detail__demo-version{color:var(--ink-muted);font-size:12px}.project-detail__demo-description{color:var(--ink-muted);margin:12px 0 0;font-size:14px;line-height:1.8}.project-detail__privacy{color:var(--ink-muted);margin:16px 0 0;font-size:12px;line-height:1.8}.project-detail__privacy strong{font-weight:500}.project-detail__body{color:var(--ink);font-size:15px;line-height:1.9}.project-detail__body h2{border-top:1px solid var(--line);margin:38px 0 16px;padding-top:26px;font-size:21px;font-weight:500;line-height:1.5}.project-detail__body p{margin:0 0 16px}.project-detail__body ul,.project-detail__body ol:not(.project-flow ol){padding-left:1.4em}.project-detail__body ol:not(.project-flow ol){list-style:decimal}.project-detail__body li+li{margin-top:8px}.project-detail__body strong{font-weight:600}.project-detail__body a{color:var(--accent-strong);text-underline-offset:3px}.project-detail__architecture{margin:20px 0}.project-detail__architecture img{border:1px solid var(--line);background:#fff;border-radius:12px;width:100%;height:auto;display:block}.project-detail__architecture a{display:block}.project-detail__architecture figcaption{color:var(--ink-muted);margin-top:10px;font-size:12px;line-height:1.8}.project-detail__architecture figcaption a{margin-left:8px;display:inline}.project-detail__footer{border-top:1px solid var(--line);margin-top:48px;padding-top:24px}.project-flow{margin:20px 0}.project-flow ol{grid-template-columns:repeat(var(--flow-steps),minmax(0,1fr));gap:22px;margin:0;padding:0;list-style:none;display:grid}.project-flow li{border:1px solid var(--line);background:var(--glass);border-radius:12px;flex-direction:column;justify-content:center;gap:6px;min-width:0;padding:16px;font-size:14px;line-height:1.6;display:flex;position:relative}.project-detail__body .project-flow li+li{margin-top:0}.project-flow li:not(:last-child):after{content:"→";color:var(--accent-strong);font-size:16px;position:absolute;top:50%;right:-18px;transform:translateY(-50%)}.project-flow__number{color:var(--accent-strong);font-family:var(--font-mono);font-size:11px}.project-flow figcaption{color:var(--ink-muted);margin-top:10px;font-size:12px}@media (width<=899px){.portfolio-grid{grid-template-columns:minmax(0,1fr)}.card__title{font-size:22px}}@media (width<=640px){.portfolio-card{aspect-ratio:auto}.card__media{aspect-ratio:16/10;flex:none}.card__info{padding:18px 20px}.card__title{font-size:19px}.card__demo{min-height:44px}.card__state-badge{font-size:10px;top:12px;right:12px}.card__ordinal{top:12px;left:12px}.project-detail__topline{align-items:flex-start;margin-bottom:22px}.project-detail__summary{font-size:15px}.project-detail__action{padding:18px}.project-flow ol{grid-template-columns:1fr;gap:22px}.project-flow li{flex-direction:row;justify-content:flex-start;align-items:center;gap:14px;padding:14px 18px}.project-flow li:not(:last-child):after{content:"↓";inset:auto auto -24px 50%;transform:translate(-50%)}}@media (prefers-reduced-motion:reduce){.portfolio-card,.reveal,.card__demo,.project-detail__demo{transition:none}html.js .reveal:not(.is-visible){opacity:1;transform:none}}.portfolio-card:has(.card__link:focus-visible){outline:2px solid var(--accent-strong);outline-offset:5px}.card__flow{background:color-mix(in srgb,var(--accent) 13%,var(--page));grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 28px;height:100%;margin:0;padding:48px 28px 12px;list-style:none;display:grid}.card__flow li{border:1px solid var(--line);background:var(--glass);border-radius:12px;align-items:center;gap:12px;padding:6px 14px;display:flex;position:relative}.card__flow li:nth-child(odd):after{content:"→";color:var(--accent-strong);position:absolute;right:-22px}.card__flow li span{font-family:var(--font-mono);color:var(--accent-strong);font-size:11px}.card__flow li strong{color:var(--ink);font-size:clamp(12px,1.1vw,16px);font-weight:500}@media (width<=640px){.card__flow{gap:14px 22px;padding:52px 18px 24px}.card__flow li{gap:8px;padding:10px}.card__flow li:nth-child(odd):after{right:-18px}}
