@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500&family=Space+Mono:wght@400;700&display=swap";:root{--font-display:"Space Mono", monospace;--font-body:"DM Sans", sans-serif;--ui-bg:#0a0a0a;--ui-text:#e8e4de;--ui-muted:#6b6860;--ui-accent:#c8b89a;--ui-border:#2a2520;--ui-overlay:#0a0a0aeb}html,body{background:var(--ui-bg);width:100%;height:100%;overflow:hidden}canvas{touch-action:none;display:block}.loading-screen{z-index:100;background:var(--bg);cursor:pointer;transition:opacity .55s var(--ease,cubic-bezier(.16, 1, .3, 1));justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.loading-screen.exiting{opacity:0;pointer-events:none}.loading-content{text-align:center;flex-direction:column;align-items:center;gap:1.4rem;padding:2rem;display:flex}.loading-eyebrow{font-family:var(--font-mono);letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin:0;font-size:.72rem;font-weight:500}.progress-container{background:var(--line-2,#34323b);border-radius:2px;width:180px;height:2px;overflow:hidden}.progress-bar{background:var(--accent);width:0%;height:100%;transition:width .3s}.progress-text{font-family:var(--font-mono);letter-spacing:.08em;color:var(--muted);margin:0;font-size:.72rem}.loading-screen.ready .progress-container,.loading-screen.ready .progress-text{display:none}.enter-btn{letter-spacing:-.025em;color:var(--text);cursor:pointer;opacity:0;transition:opacity .5s var(--ease,ease), transform .5s var(--ease,ease), color .25s ease;pointer-events:none;background:0 0;border:0;padding:.2rem 0;font-family:Bricolage Grotesque,ui-sans-serif,sans-serif;font-size:clamp(1.5rem,4.5vw,2.6rem);font-weight:700;transform:translateY(10px)}.loading-screen.ready .enter-btn{opacity:1;pointer-events:auto;transform:none}.enter-btn:after{content:"";background:var(--accent);width:0;height:2px;transition:width .35s var(--ease,ease);margin:.5rem auto 0;display:block}.enter-btn:hover,.enter-btn:focus-visible{color:var(--accent-soft,#ff8a4d);outline:none}.enter-btn:hover:after,.enter-btn:focus-visible:after{width:100%}.enter-hint{font-family:var(--font-mono);letter-spacing:.06em;color:var(--muted);opacity:0;margin:0;font-size:.72rem;transition:opacity .5s .1s}.loading-screen.ready .enter-hint{opacity:.75}.info-panel{z-index:50;background:var(--ui-overlay);border-left:2px solid var(--ui-accent);opacity:0;pointer-events:none;max-width:320px;padding:1rem;transition:opacity .4s,transform .4s;position:fixed;bottom:2rem;left:2rem;transform:translateY(8px)}.info-panel.visible{opacity:1;transform:translateY(0)}.info-title{font-family:var(--font-display);letter-spacing:.08em;text-transform:uppercase;color:var(--ui-text);margin-bottom:.25rem;font-size:1.1rem;font-weight:700}.info-meta{font-family:var(--font-body);letter-spacing:.04em;color:var(--ui-muted);margin-bottom:.5rem;font-size:.75rem;font-weight:400}.info-desc{font-family:var(--font-body);color:var(--ui-text);font-size:.8rem;font-weight:400;line-height:1.5}.info-link{font-family:var(--font-display);letter-spacing:.1em;text-transform:uppercase;color:var(--ui-accent);cursor:pointer;pointer-events:auto;opacity:.7;background:0 0;border:none;align-items:center;gap:.35rem;margin-top:.5rem;padding:0;font-size:.7rem;font-weight:400;transition:opacity .2s;display:inline-flex}.info-link:hover{opacity:1}.esc-menu{z-index:90;background:var(--ui-overlay);opacity:0;pointer-events:none;flex-direction:column;justify-content:center;align-items:center;gap:1rem;transition:opacity .3s;display:flex;position:fixed;inset:0}.esc-menu.visible{opacity:1;pointer-events:auto;cursor:pointer}.esc-menu-text{font-family:var(--font-display);letter-spacing:.1em;color:var(--ui-text);font-size:.875rem;font-weight:400}.esc-name{font-family:var(--font-display);letter-spacing:.15em;text-transform:uppercase;color:var(--ui-text);font-size:1.4rem;font-weight:700}.esc-subtitle{font-family:var(--font-body);letter-spacing:.1em;text-transform:uppercase;color:var(--ui-muted);margin-top:-.25rem;font-size:.75rem;font-weight:400}.esc-links{gap:1.5rem;margin:.5rem 0 2.5rem;display:flex}.esc-link{font-family:var(--font-display);letter-spacing:.1em;text-transform:uppercase;color:var(--ui-accent);cursor:pointer;font-size:.7rem;font-weight:400;text-decoration:none;transition:color .2s}.esc-link:hover{color:var(--ui-text)}.esc-exit{border:1px solid var(--ui-accent);border-radius:4px;margin:1.25rem 0 .25rem;padding:.55rem 1.4rem;display:inline-block}.esc-exit:hover{background:var(--ui-accent);color:var(--ui-bg)}.esc-mute{font-family:var(--font-display);letter-spacing:.1em;text-transform:uppercase;color:var(--ui-accent);border:1px solid var(--ui-border);cursor:pointer;background:0 0;margin-bottom:1rem;padding:.4rem 1rem;font-size:.7rem;font-weight:400;transition:border-color .2s,color .2s}.esc-mute:hover{border-color:var(--ui-accent);color:var(--ui-text)}.controls-hint{color:var(--ui-muted);align-items:flex-end;gap:1.75rem;display:flex}.control-item{flex-direction:column;align-items:center;gap:.35rem;display:flex}.control-item svg{fill:none;stroke:var(--ui-muted);stroke-width:1.5px;stroke-linecap:round;stroke-linejoin:round}.control-item span{font-family:var(--font-display);letter-spacing:.1em;text-transform:uppercase;color:var(--ui-muted);font-size:.55rem}.click-icon{vertical-align:middle;position:relative;top:-1px}.interact-prompt{z-index:50;font-family:var(--font-display);letter-spacing:.1em;text-transform:uppercase;color:var(--ui-text);opacity:0;pointer-events:none;background:0 0;border:none;align-items:center;gap:.3rem;padding:0;font-size:.7rem;font-weight:400;transition:opacity .25s;display:inline-flex;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)translateY(28px)}.interact-prompt svg{position:relative;top:1px}.interact-prompt.visible{opacity:.85}.detail-panel{z-index:80;background:var(--ui-bg);border-left:1px solid var(--ui-border);pointer-events:none;flex-direction:column;width:40%;min-width:320px;max-width:560px;transition:transform .4s cubic-bezier(.4,0,.2,1);display:flex;position:fixed;top:0;bottom:0;right:0;transform:translate(100%)}.detail-panel.visible{pointer-events:auto;transform:translate(0)}.detail-close{z-index:1;border:1px solid var(--ui-border);width:2rem;height:2rem;color:var(--ui-muted);font-family:var(--font-body);cursor:pointer;background:0 0;justify-content:center;align-items:center;font-size:1rem;transition:border-color .2s,color .2s;display:flex;position:absolute;top:1rem;right:1rem}.detail-close:hover,.detail-close:focus-visible{border-color:var(--ui-accent);color:var(--ui-text);outline:none}.detail-scroll{scrollbar-width:thin;scrollbar-color:var(--ui-border) transparent;flex:1;padding:3.5rem 2rem 2rem;overflow-y:auto}.detail-scroll::-webkit-scrollbar{width:4px}.detail-scroll::-webkit-scrollbar-track{background:0 0}.detail-scroll::-webkit-scrollbar-thumb{background:var(--ui-border)}.detail-hero{object-fit:contain;border:1px solid var(--ui-border);background:#111;width:100%;max-height:320px;margin-bottom:1.5rem}.detail-title{font-family:var(--font-display);letter-spacing:.08em;text-transform:uppercase;color:var(--ui-text);margin-bottom:.25rem;font-size:1.3rem;font-weight:700}.detail-meta{font-family:var(--font-body);letter-spacing:.04em;color:var(--ui-muted);margin-bottom:1rem;font-size:.75rem;font-weight:400}.detail-description{font-family:var(--font-body);color:var(--ui-text);margin-bottom:1.5rem;font-size:.85rem;font-weight:400;line-height:1.7}.detail-tech{margin-bottom:1.5rem}.detail-tech h3{font-family:var(--font-display);letter-spacing:.1em;text-transform:uppercase;color:var(--ui-muted);margin-bottom:.5rem;font-size:.7rem;font-weight:400}.detail-tech ul{flex-wrap:wrap;gap:.5rem;list-style:none;display:flex}.detail-tech-item{font-family:var(--font-display);letter-spacing:.06em;color:var(--ui-accent);border:1px solid var(--ui-border);padding:.25rem .6rem;font-size:.7rem;font-weight:400}.detail-links{flex-direction:column;gap:.5rem;display:flex}.detail-link{font-family:var(--font-display);letter-spacing:.1em;text-transform:uppercase;text-align:center;color:var(--ui-accent);border:1px solid var(--ui-border);padding:.6rem 1rem;font-size:.75rem;font-weight:400;text-decoration:none;transition:border-color .2s,background .2s;display:block}.detail-link:hover,.detail-link:focus-visible{border-color:var(--ui-accent);background:#c8b89a0f;outline:none}.detail-casestudy-link{width:100%;color:var(--ui-bg);background:var(--ui-accent);border-color:var(--ui-accent);cursor:pointer;margin-top:.5rem}.detail-casestudy-link:hover,.detail-casestudy-link:focus-visible{color:var(--ui-accent);background:0 0}.casestudy-overlay{z-index:85;background:var(--ui-bg);opacity:0;pointer-events:none;transition:opacity .4s;position:fixed;inset:0}.casestudy-overlay.visible{opacity:1;pointer-events:auto}.casestudy-scroll{scrollbar-width:thin;scrollbar-color:var(--ui-border) transparent;height:100%;padding:3rem 2rem;overflow-y:auto}.casestudy-scroll::-webkit-scrollbar{width:4px}.casestudy-scroll::-webkit-scrollbar-track{background:0 0}.casestudy-scroll::-webkit-scrollbar-thumb{background:var(--ui-border)}.casestudy-close{font-family:var(--font-display);letter-spacing:.1em;text-transform:uppercase;color:var(--ui-accent);border:1px solid var(--ui-border);cursor:pointer;background:0 0;margin-bottom:2rem;padding:.5rem 1rem;font-size:.75rem;font-weight:400;transition:border-color .2s;display:block}.casestudy-close:hover,.casestudy-close:focus-visible{border-color:var(--ui-accent);outline:none}.casestudy-content{max-width:720px;margin:0 auto}.casestudy-content h1{font-family:var(--font-display);letter-spacing:.08em;text-transform:uppercase;color:var(--ui-text);margin-bottom:1.5rem;font-size:1.6rem;font-weight:700}.casestudy-content h2{font-family:var(--font-display);letter-spacing:.08em;text-transform:uppercase;color:var(--ui-text);margin-top:2rem;margin-bottom:.75rem;font-size:1.1rem;font-weight:700}.casestudy-content h3{font-family:var(--font-display);letter-spacing:.06em;color:var(--ui-accent);margin-top:1.5rem;margin-bottom:.5rem;font-size:.85rem;font-weight:400}.casestudy-content p{font-family:var(--font-body);color:var(--ui-text);margin-bottom:1rem;font-size:.85rem;font-weight:400;line-height:1.8}.casestudy-content strong{color:var(--ui-accent);font-weight:500}.casestudy-content em{font-style:italic}.casestudy-content a{color:var(--ui-accent);text-decoration:underline;text-decoration-color:var(--ui-border);text-underline-offset:2px;transition:text-decoration-color .2s}.casestudy-content a:hover{text-decoration-color:var(--ui-accent)}.casestudy-content hr{border:none;border-top:1px solid var(--ui-border);margin:2rem 0}.casestudy-content ul{margin-bottom:1rem;padding-left:1rem;list-style:none}.casestudy-content li{font-family:var(--font-body);color:var(--ui-text);padding-left:1rem;font-size:.85rem;line-height:1.8;position:relative}.casestudy-content li:before{content:"—";color:var(--ui-muted);position:absolute;left:0}.casestudy-content code{font-family:var(--font-display);color:var(--ui-accent);background:#c8b89a14;padding:.15rem .4rem;font-size:.8rem}.casestudy-content pre{border:1px solid var(--ui-border);background:#c8b89a0a;margin-bottom:1.5rem;padding:1rem;overflow-x:auto}.casestudy-content pre code{background:0 0;padding:0;font-size:.75rem;line-height:1.6}.casestudy-content table{border-collapse:collapse;width:100%;font-family:var(--font-body);margin-bottom:1.5rem;font-size:.8rem}.casestudy-content th{font-family:var(--font-display);letter-spacing:.08em;text-transform:uppercase;color:var(--ui-muted);text-align:left;border-bottom:1px solid var(--ui-border);padding:.5rem .75rem;font-size:.7rem;font-weight:400}.casestudy-content td{color:var(--ui-text);border-bottom:1px solid #2a252080;padding:.5rem .75rem;line-height:1.5}.resume-prompt{z-index:55;font-family:var(--font-display);letter-spacing:.1em;color:var(--ui-text);opacity:0;pointer-events:none;font-size:.875rem;font-weight:400;transition:opacity .4s;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.resume-prompt.visible{opacity:1}.reticle{background:var(--ui-muted);opacity:0;pointer-events:none;z-index:55;border-radius:50%;width:4px;height:4px;margin:-2px 0 0 -2px;transition:opacity .2s;position:fixed;top:50%;left:50%}.reticle.visible{opacity:.4}.desktop-tutorial-hints{z-index:65;opacity:0;pointer-events:none;align-items:flex-end;gap:2.5rem;transition:opacity .6s;display:flex;position:fixed;bottom:2rem;left:50%;transform:translate(-50%)}.desktop-tutorial-hints .control-item svg{stroke:var(--ui-accent)}.desktop-tutorial-hints .control-item svg text{fill:var(--ui-accent)}.desktop-tutorial-hints .control-item span{color:var(--ui-text);font-size:.65rem}.mobile-zone-overlay{z-index:65;opacity:0;pointer-events:auto;transition:opacity .6s;display:flex;position:fixed;inset:0}.zone-left{background:#c8b89a0a;flex-direction:column;flex:0 0 35%;justify-content:center;align-items:center;gap:.75rem;display:flex}.zone-right{border-left:1px dashed var(--ui-border);background:#0a0a0ae0;flex-direction:column;flex:0 0 65%;justify-content:center;align-items:center;gap:.5rem;display:flex;position:relative}.zone-icon{opacity:.6}.zone-swipe-icon{animation:2s ease-in-out infinite zone-swipe}.zone-label{font-family:var(--font-display);letter-spacing:.12em;text-transform:uppercase;color:var(--ui-accent);margin-top:.25rem;font-size:.7rem;font-weight:700}.zone-menu-callout{font-family:var(--font-display);letter-spacing:.1em;color:var(--ui-muted);font-size:.6rem;font-weight:400;position:absolute;top:1rem;right:1rem}.zone-dismiss{text-align:center;font-family:var(--font-display);letter-spacing:.15em;text-transform:uppercase;color:var(--ui-text);font-size:.65rem;font-weight:400;animation:2s ease-in-out infinite zone-pulse;position:absolute;bottom:2.5rem;left:0;right:0}@keyframes zone-pulse{0%,to{opacity:.5}50%{opacity:1}}@keyframes zone-swipe{0%,to{transform:translate(-3px)}50%{transform:translate(3px)}}.is-mobile .loading-title,.is-mobile .esc-name{text-align:center}.is-mobile .click-icon{display:none}.is-mobile .reticle{width:6px;height:6px;margin:-3px 0 0 -3px}.is-mobile .resume-prompt{display:none}.mobile-joystick-ring{border:1.5px solid var(--ui-accent);opacity:0;pointer-events:none;z-index:55;background:#c8b89a0f;border-radius:50%;width:120px;height:120px;margin-top:-60px;margin-left:-60px;transition:opacity .1s;position:fixed}.mobile-joystick-ring.visible{opacity:.5}.mobile-joystick-dot{background:var(--ui-accent);opacity:.6;pointer-events:none;border-radius:50%;width:40px;height:40px;margin-top:-20px;margin-left:-20px;position:absolute;top:50%;left:50%}.mobile-menu-btn{z-index:70;background:var(--ui-overlay);border:1px solid var(--ui-border);cursor:pointer;opacity:0;pointer-events:none;border-radius:4px;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:44px;height:44px;transition:opacity .2s;display:flex;position:fixed;top:1rem;right:1rem}.mobile-menu-btn.visible{opacity:1;pointer-events:auto}.mobile-menu-btn span{background:var(--ui-accent);width:20px;height:1.5px;display:block}@media (width<=768px){.detail-panel{width:100%;min-width:unset;max-width:unset}}#exit-3d{z-index:110;color:#fff;font-size:.85rem;font-family:var(--font-display);background:#0009;border-radius:8px;padding:.5rem .9rem;text-decoration:none;position:fixed;top:1rem;left:1rem}.is-mobile #exit-3d{display:none}
