html[data-opening-lock] body{background:#171a1e}#portfolio-page[data-opening-prepared]{width:var(--opening-width);height:var(--opening-height);z-index:100;transform-origin:0 0;will-change:transform;pointer-events:none;position:fixed;inset:0 auto auto 0;overflow:clip}.cinematic-opening{z-index:101;color:#eef1f3;perspective:1200px;position:fixed;inset:0;overflow:hidden}.opening-backdrop{pointer-events:none;background:#171a1e;position:absolute;inset:0}.cinematic-opening[data-state=idle]{animation:10s step-end forwards opening-idle-fallback}.cinematic-opening[data-state=idle] .opening-art{visibility:visible}.cinematic-opening[data-state=idle] .opening-workspace,.cinematic-opening[data-state=idle] .opening-preview-anchor,.cinematic-opening[data-state=idle] .opening-backend,.cinematic-opening[data-state=idle] .opening-build{visibility:hidden}@keyframes opening-idle-fallback{to{visibility:hidden;pointer-events:none}}.opening-art{visibility:hidden;pointer-events:none;position:absolute;inset:0}.opening-grid{background-image:linear-gradient(#6b9fc014 1px,#0000 1px),linear-gradient(90deg,#6b9fc014 1px,#0000 1px);background-size:64px 64px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(#000,#0000 75%);mask-image:radial-gradient(#000,#0000 75%)}.opening-caption,.opening-footer{font:10px var(--font-mono);letter-spacing:.09em;color:#a6bbc9;justify-content:space-between;display:flex;position:absolute;left:5vw;right:5vw}.opening-caption{top:5vh}.opening-footer{bottom:5vh}.opening-boot{font:clamp(20px, 3vw, 40px) var(--font-mono);position:absolute;top:40%;left:20%}.opening-boot small{color:#a6bbc9;margin-top:25px;font-size:12px;display:block}.opening-boot i{vertical-align:-.1em;background:#6b9fc0;width:.55em;height:1em;display:inline-block}.opening-workspace{background:#20262c;border:1px solid #51616e;border-radius:12px;position:absolute;inset:18% 52% 26% 5%;overflow:hidden;box-shadow:0 24px 70px #0004}.opening-editor{flex-direction:column;height:100%;min-height:0;display:flex}.opening-tab{font:11px var(--font-mono);color:#c5dcea;border-bottom:1px solid #51616e;justify-content:space-between;gap:12px;padding:16px;display:flex}.opening-tab span{color:#92a3af;font-size:9px}.opening-code-scroll{scrollbar-width:thin;scrollbar-color:#51616e transparent;min-height:0;font:clamp(10px, .85vw, 13px)/1.7 var(--font-mono);flex:1;margin:0;padding:15px 8px;position:relative;overflow:auto}.opening-code{color:#c5dcea;opacity:.35;white-space:normal;border-radius:3px;grid-template-columns:30px minmax(0,1fr) 14px;gap:6px;padding:4px 6px;display:grid}.opening-code small{text-align:right;color:#768895;font:inherit;-webkit-user-select:none;user-select:none}.opening-code code{white-space:pre-wrap;overflow-wrap:anywhere;font:inherit}.opening-code[data-code-state=typing]{opacity:1;color:#eef1f3;background:#304452}.opening-code[data-code-state=complete]{opacity:1}.opening-caret{display:none}.opening-code[data-code-state=typing] .opening-caret{vertical-align:-.12em;background:#a2c3d9;width:.5em;height:1em;animation:.65s step-end infinite opening-caret;display:inline-block}@keyframes opening-caret{50%{opacity:0}}.opening-line-check{opacity:0;color:#a2c3d9}.opening-code[data-code-state=complete] .opening-line-check{opacity:1}.opening-editor-status{color:#a2c3d9;font:10px var(--font-mono);border-top:1px solid #51616e;justify-content:space-between;gap:10px;padding:12px 16px;display:flex}.opening-code-progress{white-space:nowrap}.opening-preview-anchor{position:absolute;inset:18% 5% 22% 51%}.opening-backend{font:10px var(--font-mono);position:absolute;top:28%;left:5%;right:52%}.opening-request,.opening-query{color:#a6bbc9;justify-content:space-between;gap:10px;display:flex}.opening-query{margin-top:12px}.opening-query>span{color:#c5dcea}.opening-services{justify-content:space-between;margin:15px 0;display:flex;position:relative}.opening-services:before{content:"";background:#6b9fc0;height:1px;position:absolute;top:50%;left:0;right:0}.opening-services>div{z-index:1;background:#20262c;border:1px solid #6b9fc0;border-radius:5px;padding:12px}.opening-packet{z-index:2;background:#eef1f3;border-radius:50%;width:6px;height:6px;position:absolute;top:calc(50% - 3px);box-shadow:0 0 12px #a3d1ee}.opening-build{font:11px var(--font-mono);color:#a6bbc9;justify-content:center;gap:25px;display:flex;position:absolute;top:32%;left:5%;right:52%}.opening-build strong{font:600 clamp(20px, 3vw, 40px) var(--font-display);color:#eef1f3;white-space:nowrap;position:absolute;top:38px}.opening-build strong span{text-align:center;font:11px var(--font-body);color:#a6bbc9;margin-top:6px;display:block}.opening-controls{align-items:center;gap:15px;display:flex;position:absolute;bottom:9vh;right:4vw}.opening-controls button{color:#eef1f3;font:10px var(--font-mono);text-transform:uppercase;background:#20262c;border:1px solid #51616e;padding:13px 17px}.opening-controls button:focus-visible{outline-offset:4px;outline:2px solid #eef1f3}@media (max-width:900px){.opening-workspace{inset:18% 51% 26% 3%}.opening-tab{padding:12px;font-size:10px}.opening-tab span{font-size:8px}.opening-code{grid-template-columns:20px minmax(0,1fr) 12px;gap:4px;padding:3px}.opening-code-scroll{padding:10px 5px;font-size:10px}.opening-editor-status{padding:10px;font-size:8px}.opening-preview-anchor{inset:18% 3% 22% 52%}.opening-backend,.opening-build{left:3%;right:51%}}@media (max-width:600px){.opening-caption,.opening-footer{font-size:8px}.opening-caption span:last-child,.opening-footer span:last-child{display:none}.opening-boot{font-size:24px;top:36%;left:8%}.opening-workspace{inset:11% 5% 61%}.opening-tab{padding:10px 12px}.opening-code-scroll{padding:8px 5px;font-size:9px;line-height:1.6}.opening-preview-anchor{inset:42% 5% 20%}.opening-backend{font-size:8px;top:20%;left:6%;right:6%}.opening-request>span{display:none}.opening-services>div{padding:9px 5px;font-size:7px}.opening-query{flex-direction:column;gap:5px;font-size:7px}.opening-build{gap:12px;font-size:8px;top:21%;left:8%;right:8%}.opening-controls{gap:8px;bottom:9%;right:6%}.opening-controls button{padding:12px;font-size:9px}.opening-build strong{font-size:25px}}@media (prefers-reduced-motion:reduce){.cinematic-opening{display:none}}