.portfolio-page{color:#eef3fb;isolation:isolate;background:#06070a;position:relative}.portfolio-page .graph-field-wrap{z-index:0;pointer-events:none;position:absolute;inset:0}.portfolio-page .graph-field{opacity:.72;width:100%;height:100svh;display:block;position:sticky;top:0}.portfolio-page:before{content:"";z-index:0;pointer-events:none;background:linear-gradient(100deg,#06070ad9 0%,#06070a8c 34%,#0000 62%);position:absolute;inset:0}.portfolio-page>section{z-index:1;position:relative}.pf-open{padding-block:56px 44px}.pf-open .breadcrumbs{margin-bottom:18px}.pf-open .breadcrumbs ol{color:#8b9fbd;font-size:11px}.pf-open .breadcrumbs a{color:#a8c1ea}.pf-open .eyebrow{color:#94a9c9;margin:0 0 18px}.portfolio-page h1{letter-spacing:-.045em;text-wrap:balance;max-width:15ch;margin:0 0 26px;font-size:clamp(38px,9.6vw,54px);font-weight:600;line-height:1.04}.portfolio-page h1 em{font-family:var(--font-serif);letter-spacing:-.018em;background:linear-gradient(104deg,#fff 6%,#d4e3ff 36%,#93b4f6 70%,#7593dc 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;padding-bottom:.1em;font-style:italic;font-weight:400;line-height:1.14;display:block}.pf-lead{gap:14px;max-width:60ch;display:grid}.pf-lead p{color:#a7b8d3;margin:0;font-size:16px;line-height:1.75}.pf-stack{border-top:1px solid #8ca7d52e;gap:22px;margin-top:36px;padding-top:24px;display:grid}.stack-title{letter-spacing:.04em;margin:0 0 12px;font:500 11px/1 ui-monospace,SFMono-Regular,Consolas,monospace}.stack-out .stack-title{color:#8b7a6a}.stack-in .stack-title{color:#7fb9a0}.stack-col ul{flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none;display:flex}.stack-col li{color:#8093ae;border:1px solid #42536d;border-radius:999px;padding:7px 12px;font:500 12.5px ui-monospace,SFMono-Regular,Consolas,monospace}.stack-out li{opacity:.8;text-decoration:line-through #8a6f5299}.stack-in li{color:#b7e3d0;background:#0c1a1633;border-color:#4d7f68}.pf-project{border-top:1px solid #8ca7d51f;padding-block:52px;scroll-margin-top:96px}.pf-project>.wrap{gap:30px;display:grid}.pf-shot{min-width:0;position:relative}.pf-frame{background:#0b111c;border:1px solid #2f4a75;border-radius:12px;overflow:hidden;box-shadow:0 30px 70px #00000085}.pf-bar{color:#c1d1e9;background:#14203a;align-items:center;gap:5px;height:26px;padding:0 12px;display:flex}.pf-bar i{background:#8fa4c2;border-radius:50%;width:5px;height:5px}.pf-bar>span{letter-spacing:.03em;margin:auto;font:500 9px ui-monospace,SFMono-Regular,Consolas,monospace}.pf-frame img{width:100%;height:auto;display:block}.pf-phone{background:#0b111c;border:3px solid #22304a;border-radius:14px;width:21%;max-width:132px;position:absolute;bottom:-16px;right:-4px;overflow:hidden;box-shadow:0 18px 36px #00000094}.pf-phone img{width:100%;height:auto;display:block}.pf-console{background:#0a0f19;border:1px solid #2f4a75;border-radius:12px;overflow:hidden;box-shadow:0 30px 70px #00000085}.pf-console-body{gap:11px;padding:20px 18px;font:500 13px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;display:grid}.pf-console-body p{white-space:nowrap;text-overflow:ellipsis;margin:0;overflow:hidden}.c-var{color:#8fb6e8}.c-num{color:#e0b268}.c-key{color:#c49aff}.c-cm{color:#68798f}.pf-copy{min-width:0}.pf-copy .eyebrow{color:#9db3d4;margin:0 0 14px}.portfolio-page h2{letter-spacing:-.04em;max-width:18ch;margin:0 0 18px;font-size:clamp(30px,7.4vw,40px);font-weight:600;line-height:1.08}.pf-text{color:#adbed6;max-width:62ch;margin:0 0 14px;font-size:16px;line-height:1.78}.portfolio-page .pf-visit{color:#a8c1ea;margin-top:4px;font-size:14px}.pf-detail{border-top:1px solid #8ca7d52e;gap:26px;padding-top:24px;display:grid}.pf-note .note-title{letter-spacing:.14em;text-transform:uppercase;color:#9db3d4;align-items:baseline;gap:9px;margin:0 0 14px;font-size:11px;font-weight:650;display:flex}.note-spec .note-title{color:#93d6b6}.note-why .note-title{color:#a9b9d6}.pf-note .note-title .c-p{opacity:.75;font:500 13px/1 ui-monospace,SFMono-Regular,Consolas,monospace}.pf-note dl{gap:13px;margin:0;display:grid}.pf-note dt{color:#8fb6e8;margin-bottom:3px;font:500 12.5px ui-monospace,SFMono-Regular,Consolas,monospace}.pf-note dd{color:#a0b3cf;margin:0;font-size:14.5px;line-height:1.68}.pf-note p{color:#a0b3cf;margin:0 0 12px;font-size:15px;line-height:1.75}.pf-close{border-top:1px solid #8ca7d52e;padding-block:54px 76px}.pf-close-panel{background:linear-gradient(150deg,#0d1727c4,#080c15b8);border:1px solid #8ca7d533;border-radius:22px;gap:22px;padding:30px 24px;display:grid;box-shadow:0 30px 70px #00000059,inset 0 1px #ffffff0d}.pf-close-panel>div{justify-items:start;gap:14px;display:grid}.pf-close-panel .closing-prompt{color:#7f95b5;width:auto;margin:0;font:500 12px/1 ui-monospace,SFMono-Regular,Consolas,monospace}.pf-close-panel .closing-prompt .code-obj{color:#8fb6e8}.pf-close-panel .closing-prompt .code-fn{color:#c0aded}.pf-close-panel h2{max-width:14ch;margin:0}.pf-close-panel p{color:#a7b8d3;max-width:52ch;margin:0;font-size:16px;line-height:1.75}.portfolio-page .pf-close-panel .text-link{color:#a8c1ea;font-size:14px}@media (width>=768px){.pf-open{padding-block:76px 58px}.portfolio-page h1{max-width:14ch;font-size:clamp(54px,5.6vw,76px)}.pf-lead p{font-size:17px}.pf-stack{grid-template-columns:1fr 1fr;gap:44px;margin-top:48px}.pf-project{padding-block:80px}.pf-project>.wrap{grid-template-columns:1.12fr .88fr;align-items:start;gap:44px 54px}.pf-shot{grid-column:1/-1}.pf-phone{width:17%;bottom:-24px;right:2%}.portfolio-page h2{font-size:clamp(38px,3.8vw,50px)}.pf-detail{border-top:0;border-left:1px solid #8ca7d52e;grid-column:2;gap:32px;padding-top:0;padding-left:40px}.pf-copy{grid-column:1}.pf-close{padding-block:80px 106px}.pf-close-panel{border-radius:28px;grid-template-columns:1.1fr auto;align-items:end;gap:0 54px;padding:44px 46px}.pf-console-body{gap:13px;padding:26px 24px;font-size:14px}}@media (width>=1100px){.pf-project>.wrap{gap:50px 72px}.portfolio-page h1{font-size:clamp(68px,5.6vw,88px)}.pf-detail{padding-left:56px}}