[data-p4d] .hero-buttons{flex-wrap:wrap}.p4d-toggle{padding:9px 12px;border:1px solid #6ce8ef55;border-radius:999px;background:#121720;color:#c8eff3;font:11px/1.4 var(--mono, monospace);cursor:pointer}.p4d-toggle[hidden]{display:none}.p4d-toggle:hover{border-color:#6ce8ef}.p4d-toggle:focus-visible{outline:2px solid #d2ff5a;outline-offset:4px}.hero-scene.p4d-scene{--p4d-x: 50%;--p4d-y: 50%;--p4d-rx: 0deg;--p4d-ry: 0deg}.hero-scene.p4d-scene:before{content:"";position:absolute;inset:0;border-radius:24px;background:radial-gradient(circle at var(--p4d-x) var(--p4d-y),#6ce8ef17,transparent 58%);pointer-events:none}.hero-scene.p4d-scene .cube-wrap{z-index:1;transform:rotateX(var(--p4d-rx)) rotateY(var(--p4d-ry));transition:transform .18s ease-out}.hero-scene.p4d-scene .cube{animation:p4d-core 12s ease-in-out infinite}.hero-scene.p4d-scene .scene-grid{animation:p4d-grid 12s linear infinite}.hero-scene.p4d-scene .orbit{z-index:1}.hero-scene.p4d-scene .orbit:after{animation:p4d-beacon 4s ease-in-out infinite}.hero-scene.p4d-scene .orbit-b:after{animation-delay:-2s}.p4d-particles{position:absolute;inset:0;overflow:hidden;border-radius:24px;pointer-events:none}.p4d-particles>span{position:absolute;left:var(--x);top:var(--y);width:3px;height:3px;border-radius:50%;background:#6ce8ef;box-shadow:0 0 10px #6ce8ef99;animation:p4d-drift 9s ease-in-out infinite;animation-delay:var(--delay)}.p4d-particles>span:nth-child(3n){background:#d2ff5a;box-shadow:0 0 10px #d2ff5a88}.carousel.p4d-carousel{position:relative}.p4d-carousel .showcase-card{transition:border-color .2s ease,box-shadow .2s ease}.p4d-carousel .showcase-card.p4d-active,.p4d-carousel .showcase-card:focus-within{border-color:var(--accent, #d2ff5a);box-shadow:inset 0 0 0 1px #ffffff08}.p4d-carousel .card-visual{--p4d-x: 50%;--p4d-y: 50%;--p4d-rx: 0deg;--p4d-ry: 0deg}.p4d-carousel .card-visual:after{content:"";position:absolute;inset:0;z-index:5;pointer-events:none;background:radial-gradient(circle at var(--p4d-x) var(--p4d-y),#ffffff16,transparent 55%)}[data-p4d=running] .p4d-carousel .showcase-card .cover-device{transform:translateY(var(--p4d-lift, 0px)) rotateX(calc(12deg + var(--p4d-rx))) rotateY(calc(-17deg + var(--p4d-lean, 0deg) + var(--p4d-ry))) rotate(-5deg);transition:transform .22s ease-out}@keyframes p4d-core{0%,to{transform:rotateX(-22deg) rotateY(-32deg) rotate(8deg)}50%{transform:rotateX(-14deg) rotateY(-12deg) rotate(3deg)}}@keyframes p4d-grid{0%{background-position:0 0}to{background-position:0 38px}}@keyframes p4d-beacon{0%,to{opacity:.55;scale:.85}50%{opacity:1;scale:1.15}}@keyframes p4d-drift{0%,to{transform:translate3d(0,12px,0);opacity:.25}50%{transform:translate3d(12px,-18px,0);opacity:.85}}[data-p4d=paused] .p4d-scene *,[data-p4d=paused] .p4d-scene *:before,[data-p4d=paused] .p4d-scene *:after,.p4d-scene.p4d-offscreen *,.p4d-scene.p4d-offscreen *:before,.p4d-scene.p4d-offscreen *:after{animation-play-state:paused!important}[data-p4d=paused] .p4d-scene .cube-wrap{transform:none!important}[data-p4d=paused] .p4d-carousel .cover-device,[data-p4d=paused] .p4d-carousel .showcase-card:hover .cover-device{transform:rotateX(12deg) rotateY(-17deg) rotate(-5deg);transition:none}@media(max-width:767px),(prefers-reduced-motion:reduce){.hero-scene.p4d-scene .cube,.hero-scene.p4d-scene .cube-wrap,.hero-scene.p4d-scene .scene-grid,.hero-scene.p4d-scene .orbit:after,.p4d-particles>span{animation:none!important}.p4d-particles{display:none}.hero-scene.p4d-scene .cube{transform:rotateX(-22deg) rotateY(-32deg) rotate(8deg)}.hero-scene.p4d-scene .cube-wrap{transform:none!important;transition:none}.p4d-carousel .showcase-card{transition:none}}.card-visual.card-visual--screenshot{display:block;position:relative;background:#14151b}.card-visual--screenshot:after{display:none}.project-cover-image{display:block;width:100%;height:100%;object-fit:cover;object-position:top center}.project-cover-badge{position:absolute;right:12px;bottom:12px;padding:7px 10px;border:1px solid #ffffff30;border-radius:5px;background:#0b0c10e8;color:#f1f0f6;font:10px/1.4 var(--mono, monospace)}.detail-grid>aside,.project-gallery{min-width:0}.project-gallery-main{margin:0}.project-gallery-open{display:block;position:relative;overflow:hidden;border:1px solid #393242;border-radius:10px;background:#14151b}.project-gallery-open>img{display:block;width:100%;aspect-ratio:16 / 10;object-fit:contain}.project-gallery-expand{position:absolute;right:12px;bottom:12px;padding:7px 11px;border-radius:5px;background:#0b0c10e8;color:#f1f0f6;font-size:12px}.project-gallery-caption{margin:12px 0;color:#c2b8cd;font-size:13px}.project-gallery-thumbnails{display:flex;gap:10px;overflow-x:auto;padding:4px 2px 12px}.project-gallery-thumbnail{flex:0 0 112px;overflow:hidden;border:2px solid #332c3e;border-radius:7px;background:#15121c;color:#c7bdcf;text-decoration:none}.project-gallery-thumbnail[aria-current=true]{border-color:#d2ff5a}.project-gallery-thumbnail img{display:block;width:100%;height:66px;object-fit:cover;object-position:top center}.project-gallery-thumbnail span{display:block;padding:7px;font-size:11px;line-height:1.5}.project-gallery-open:focus-visible,.project-gallery-thumbnail:focus-visible,.screenshot-button:focus-visible{outline:2px solid #d2ff5a;outline-offset:3px}.project-lightbox{width:min(1280px,calc(100vw - 24px));max-width:none;max-height:94vh;max-height:94dvh;margin:auto;padding:16px;overflow:auto;border:1px solid #50405f;border-radius:12px;background:#101116;color:#f1f0f6}.project-lightbox::backdrop{background:#050309ed}.project-lightbox-toolbar,.project-lightbox-navigation{display:flex;align-items:center;justify-content:space-between;gap:12px}.project-lightbox-toolbar{margin-bottom:12px}.project-lightbox-toolbar>span{color:#b6adbf;font:12px var(--mono, monospace)}.project-lightbox figure{margin:0}.project-lightbox figure>img{display:block;width:100%;max-height:calc(90vh - 170px);max-height:calc(90dvh - 170px);object-fit:contain;background:#17181e}.project-lightbox figcaption{padding:12px 0;color:#d5ccdf;font-size:13px;line-height:1.6}.project-lightbox-navigation{justify-content:center}.screenshot-button{display:inline-grid;place-items:center;min-width:44px;min-height:44px;border:1px solid #50405f;border-radius:6px;background:#201a29;color:#f1f0f6;font-size:23px;cursor:pointer}.screenshot-button:disabled{opacity:.35;cursor:default}
