@import "https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;700&display=swap";
:root{--bg-color:#101010;--text-color:#fff;--brand-color:#338bff;--text-muted:#666;--border-color:#222;--font-main:"Space Grotesk","Noto Sans SC",sans-serif;--border-radius:6px;--border-width:2px;--grid-margin:2rem;--grid-gutter:2rem;--grid-cols:4;--container-max-width:1600px;--compact-lh:1.5;--tight-spacing:-.03em;--base-spacing:-.01em;--spacing-vertical:3rem;--spacing-text:1.5rem;--subpage-pb:4rem;--text-sm:.85rem;--text-base:1.1rem;--text-lg:1.75rem;--text-xl:3rem}@media (max-width:1024px){:root{--grid-cols:2}}@media (max-width:768px){:root{--grid-cols:1;--grid-margin:1rem;--grid-gutter:2rem}}*{box-sizing:border-box;margin:0;padding:0}p{margin-bottom:1em}body{background-color:var(--bg-color);color:var(--text-color);font-family:var(--font-main);line-height:var(--compact-lh);letter-spacing:var(--base-spacing);-webkit-user-select:none;user-select:none;width:100%;min-height:100vh;overflow-x:hidden}.layout-grid{grid-template-columns:repeat(var(--grid-cols),1fr);column-gap:var(--grid-gutter);row-gap:var(--spacing-vertical);padding-left:var(--grid-margin);padding-right:var(--grid-margin);width:100%;margin:0;display:grid}.col-span-1{grid-column:span 1}.col-span-2{grid-column:span 2}.col-span-3{grid-column:span 3}.col-span-4{grid-column:span 4}.start-col-3{grid-column-start:3}@media (max-width:768px){.col-span-1,.col-span-2,.col-span-3,.col-span-4{grid-column:1/-1}}#ui-layer{z-index:9999;pointer-events:none;width:100%;height:100%;position:fixed;top:0;left:0}.ui-element{pointer-events:auto;position:absolute}.main-header{pointer-events:none;z-index:1000;background:0 0;width:100%}.header--absolute{padding-top:var(--spacing-vertical);position:absolute;top:0;left:0}.header--relative{padding-top:var(--spacing-vertical);margin-bottom:var(--spacing-vertical);position:relative}.main-logo-link{pointer-events:auto;width:fit-content;display:block}.main-logo{width:400px;height:auto;display:block}@media (max-width:768px){.main-logo{width:280px}}.main-logo:hover{opacity:1}.bottom-left{bottom:var(--grid-margin);left:var(--grid-margin)}.bottom-right{bottom:var(--grid-margin);right:var(--grid-margin)}@media (max-width:768px){.bottom-left{bottom:1rem;left:1rem}.bottom-right{bottom:1rem;right:1rem}}.subpage-container{padding-bottom:var(--subpage-pb);box-sizing:border-box;width:100%;margin:0 auto}@media (max-width:768px){.subpage-container{padding-left:var(--grid-margin);padding-right:var(--grid-margin);width:100%!important;margin-left:0!important;margin-right:0!important}}.jump-link{font-size:var(--text-base);letter-spacing:.05em;text-transform:uppercase;color:#fff;opacity:.7;text-underline-offset:4px;font-weight:500;text-decoration:underline;text-decoration-thickness:1px;transition:all .3s}.jump-link:hover,.jump-link:active{opacity:1;color:var(--brand-color);text-shadow:0 0 10px #338bff80}.copyright{font-size:var(--text-sm);color:#444}#scene-container{z-index:1;width:0;height:0;position:fixed;top:50%;left:65%}@media (max-width:768px){#scene-container{left:50%}}.card-container{cursor:pointer;width:240px;height:240px;margin-top:-120px;margin-left:-120px;transition:filter .3s;position:absolute;top:0;left:0}.card-content{border-radius:var(--border-radius);border:var(--border-width)solid var(--border-color);background-color:#111;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative;overflow:hidden;box-shadow:0 0 20px #000c}.card-container:hover .card-content{border-color:var(--brand-color);box-shadow:0 0 40px #338bff66}.card-img{object-fit:cover;opacity:1;width:100%;height:100%;transition:opacity .3s}.card-container:hover .card-img{opacity:.3}.card-title{text-align:left;width:calc(100% - 2rem);font-size:var(--text-lg);letter-spacing:var(--tight-spacing);color:#fff;opacity:0;text-shadow:0 4px 8px #000;pointer-events:none;z-index:10;font-weight:700;transition:opacity .3s;position:absolute;bottom:1.5rem;left:1.5rem}.card-container:hover .card-title{opacity:1}.glow-box{border:var(--border-width)solid var(--border-color);border-radius:var(--border-radius);cursor:pointer;color:var(--text-color);font-size:var(--text-base);background:0 0;padding:1rem 2rem;font-weight:500;text-decoration:none;transition:all .3s;display:inline-block}.glow-box:hover{border-color:var(--brand-color);color:var(--brand-color);box-shadow:0 0 30px #338bff66}@media (max-width:768px){.glow-box{font-size:var(--text-sm);padding:.8rem 1.5rem}}#focus-overlay{-webkit-backdrop-filter:blur(12px);z-index:9990;opacity:0;pointer-events:none;background:#0006;width:100%;height:100%;transition:opacity .4s;position:fixed;top:0;left:0}#focus-overlay.active{opacity:1;pointer-events:auto}#focus-card-placeholder{z-index:9991;pointer-events:none;grid-column:1/span 2;justify-content:center;align-items:center;width:100%;height:60vh;display:flex}#focus-info-container{grid-template-columns:repeat(var(--grid-cols),1fr);gap:var(--grid-gutter);width:100%;height:100%;padding:0 var(--grid-margin);opacity:0;pointer-events:none;z-index:9992;align-items:center;transition:all .5s cubic-bezier(.2,.8,.2,1);display:grid;position:fixed;top:0;right:0}.focus-info-inner{opacity:0;grid-column:3/span 2;transition:all .5s cubic-bezier(.2,.8,.2,1);transform:translate(20px)}#focus-info-container.active{opacity:1;pointer-events:auto}#focus-info-container.active .focus-info-inner{opacity:1;transform:translate(0)}.focus-content{color:var(--text-color)}.focus-title{font-size:var(--text-xl);color:var(--brand-color);letter-spacing:var(--tight-spacing);margin-bottom:.5rem;font-weight:700;line-height:1.05}.focus-meta{gap:1.5rem;margin-bottom:1.5rem;display:flex}.focus-meta-label{font-size:var(--text-sm);color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.2rem}.focus-meta-value{font-size:var(--text-base);font-weight:500}.focus-description{font-size:var(--text-base);color:#ddd;max-height:40vh;margin-bottom:2rem;padding-right:1rem;line-height:1.6;overflow-y:auto}#focus-close{cursor:pointer;text-align:left;background:0 0;border:none;padding-bottom:1rem;font-family:inherit;position:static}@media (max-width:768px){#focus-info-container{flex-direction:column;justify-content:center;align-items:center;gap:2rem;padding:4rem 1.5rem 2rem;display:flex}#focus-card-placeholder{flex-shrink:0;width:85vw;height:40vh}.focus-info-inner{width:90%;max-height:35vh;overflow-y:auto}.focus-title{font-size:var(--text-lg)}.focus-description{max-height:20vh}#focus-close{z-index:9999;width:40px;height:40px;padding:0;top:2rem;right:2rem;font-size:0!important;position:fixed!important}#focus-close:after{content:"×";color:var(--text-muted);text-align:center;font-size:2.5rem;line-height:40px;display:block}}#kinetic-box{background:0 0;width:100%;height:1600px;margin-bottom:2rem;position:relative;overflow:hidden}#kinetic-box canvas{display:block;width:100%!important;height:100%!important}.kinetic-cell{color:var(--brand-color);background:#000;border:1px solid #ffffff0d;justify-content:center;align-items:center;display:flex;overflow:hidden}.kinetic-cell:hover{background:var(--brand-color);color:#000;z-index:10;cursor:crosshair}@media (max-width:768px){#kinetic-box{height:500px}.kinetic-cell{font-size:2rem}}.project-detail-layout{grid-template-columns:repeat(var(--grid-cols),1fr);column-gap:var(--grid-gutter);row-gap:var(--spacing-vertical);padding-left:var(--grid-margin);padding-right:var(--grid-margin);width:100%;margin:0;display:grid}.project-meta{flex-direction:column;grid-column:1/span 1;gap:2rem;display:flex}.meta-label{font-size:var(--text-sm);color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em;margin-bottom:.2rem}.meta-value{color:var(--text-color);font-size:1.1rem;font-weight:500}.project-content-wrapper{flex-direction:column;grid-column:2/span 3;display:flex}.project-title{margin-bottom:.5rem;font-weight:700;line-height:1.1;font-size:var(--text-xl)!important;color:var(--brand-color)!important}.project-subtitle{font-size:var(--text-lg);color:var(--text-muted);margin-bottom:var(--spacing-text);font-weight:700;line-height:1.4}.project-description{font-size:var(--text-base);margin-bottom:2rem}.gallery{flex-direction:column;grid-column:1/-1;gap:1rem;margin-top:4rem;display:flex}@media (max-width:768px){.project-detail-layout{flex-direction:column;gap:2rem;display:flex}.project-meta{border-radius:var(--border-radius);background:#ffffff08;order:-1;grid-template-columns:repeat(3,1fr);gap:1rem;padding:1rem;display:grid}.project-content-wrapper{order:0}.project-title{font-size:2rem!important}.gallery{order:1;margin-top:2rem}}