:root{--mono:"Space Mono", "Courier New", monospace;--bar-h:40px;--dim:#ffffff73}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{color:#fff;width:100%;height:100%;font-family:var(--mono);cursor:none;background:#000 radial-gradient(circle,#ffffff12 1px,#0000 1px) 0 0/24px 24px;overflow:hidden}#cursor{pointer-events:none;z-index:9999;will-change:transform;mix-blend-mode:difference;border:1px solid #fff;width:32px;height:32px;position:fixed;top:0;left:0;transform:translate(-50%,-50%)}#app{z-index:10;flex-direction:column;display:flex;position:fixed;inset:0}#topbar{z-index:900;height:var(--bar-h);letter-spacing:.15em;text-transform:uppercase;border-bottom:1px solid #ffffff1a;flex-shrink:0;justify-content:space-between;align-items:center;padding:0 20px;font-size:10px;display:flex;position:relative}.tb-left{align-items:center;gap:6px;display:flex}.sep{color:var(--dim)}#btn-works{cursor:pointer;color:var(--dim);transition:color .15s}#btn-works:hover{color:#fff}#breadcrumb-project{cursor:pointer;border:1px solid #ffffffbf;padding:2px 7px}#tb-title{color:var(--dim)}.tb-right{align-items:center;gap:16px;display:flex}#btn-about,#btn-close{color:var(--dim);cursor:pointer;transition:color .15s}#btn-about:hover,#btn-close:hover{color:#fff}#viewer,#menu,#about{top:var(--bar-h);left:0;right:0;bottom:var(--bar-h);position:absolute}#menu{overflow:hidden}#viewer{scroll-behavior:smooth;background:0 0;flex-direction:column;display:none;overflow:hidden auto}#viewer::-webkit-scrollbar{width:0}#viewer-media{min-height:calc(100vh - var(--bar-h) * 2 - 36px);flex-shrink:0;justify-content:center;align-items:center;display:flex;position:relative}#viewer-video{object-fit:contain;max-width:80%;max-height:100%;display:block}#player-bar{z-index:900;letter-spacing:.12em;text-transform:uppercase;height:36px;color:var(--dim);border-top:1px solid #ffffff1a;flex-shrink:0;justify-content:space-between;align-items:center;padding:0 20px;font-size:9px;display:flex;position:relative}#player-controls{align-items:center;gap:10px;display:flex}#player-controls button{color:#ffffffb3;cursor:pointer;font-size:9px;font-family:var(--mono);letter-spacing:.05em;background:0 0;border:none;padding:0}#player-controls button:hover{color:#fff}#progress-track{cursor:pointer;background:#fff3;width:100px;height:2px;position:relative}#progress-fill{background:#fff;width:0%;height:100%}.project-slide{background:#000;position:relative}.project-slide:first-child .ps-hero{justify-content:center;align-items:center;min-height:70vh;display:flex}.ps-hero{justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.ps-hero img{width:100%;height:auto;display:block}.ps-hero--video{background:#111;min-height:60vh}.ps-info{background:#000;padding:50px 40px 40px}.ps-info-grid{grid-template-columns:1fr 1.4fr .8fr;gap:40px;max-width:1100px;margin:0 auto;display:grid}.ps-title{font-family:var(--mono);letter-spacing:.04em;text-transform:uppercase;margin-bottom:6px;font-size:26px;font-weight:700;line-height:1.15}.ps-sub{letter-spacing:.12em;text-transform:uppercase;color:var(--dim);font-size:10px}.ps-desc{color:#ffffff8c;font-size:13px;line-height:1.75}.ps-meta{flex-direction:column;gap:10px;display:flex}.ps-meta>div{flex-direction:column;gap:2px;display:flex}.ps-meta span:not(.info-label){color:#fffc;font-size:12px}.ps-gallery{background:#0a0a0a}.ps-divider{background:#ffffff0f;height:1px;margin:80px 40px}#menu{opacity:0;pointer-events:none;z-index:50;background:#000000eb}#project-list{z-index:10;flex-direction:column;justify-content:center;gap:1px;width:190px;padding:20px;display:flex;position:absolute;top:0;bottom:0;left:0}.proj-item{letter-spacing:.13em;text-transform:uppercase;color:var(--dim);cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;border:1px solid #0000;width:fit-content;padding:3px 6px;font-size:10px;transition:color .1s,border-color .1s;display:block}.proj-item.hovered{color:#fff;border-color:#fffc}#thumb-field{position:absolute;inset:0}.thumb{cursor:pointer;opacity:0;will-change:transform, opacity, left, top;transform-origin:50%;position:absolute;overflow:hidden;transform:translate(-50%,-50%)}.flip-clone{border-radius:0;overflow:hidden}.thumb img,.thumb video{object-fit:cover;pointer-events:none;width:100%;height:100%;display:block}#bottombar{z-index:900;height:var(--bar-h);letter-spacing:.14em;text-transform:uppercase;color:var(--dim);border-top:1px solid #ffffff1a;justify-content:space-between;align-items:center;padding:0 20px;font-size:9px;display:flex;position:fixed;bottom:0;left:0;right:0}#viewer-info{z-index:5;background:#000;flex-shrink:0;padding:60px 40px 80px;position:relative}#info-grid{grid-template-columns:1fr 1.4fr .8fr;gap:40px;max-width:1100px;margin:0 auto;display:grid}#info-title{font-family:var(--mono);letter-spacing:.04em;text-transform:uppercase;margin-bottom:8px;font-size:28px;font-weight:700;line-height:1.15}#info-sub{letter-spacing:.12em;text-transform:uppercase;font-size:11px}.info-dim{color:var(--dim)}.info-body{color:#ffffffb8;letter-spacing:.01em;font-size:13px;line-height:1.75}.info-meta{flex-direction:column;gap:12px;display:flex}.info-meta>div{flex-direction:column;gap:2px;display:flex}.info-label{letter-spacing:.16em;text-transform:uppercase;color:var(--dim);font-size:9px}.info-meta span:not(.info-label){letter-spacing:.04em;color:#ffffffd9;font-size:12px}#viewer-gallery{z-index:5;background:#0a0a0a;flex-shrink:0;position:relative}.g-canvas{flex-wrap:wrap;align-items:flex-start;max-width:92%;margin:0 auto;padding:20px 0;display:flex}.g-block{box-sizing:border-box;flex:none;padding:3px}.g-block-inner{background:#111;width:100%;position:relative;overflow:hidden}.g-block-inner img{object-fit:cover;width:100%;height:100%;display:block;position:absolute;inset:0}.g-block .g-caption{letter-spacing:.14em;text-transform:uppercase;color:var(--dim);padding:8px 3px 4px;font-size:9px}.g-block-text{max-width:600px;padding:50px 20px}.g-text-heading{font-family:var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#ffffff73;margin-bottom:14px;font-size:13px;font-weight:700}.g-text-body{color:#ffffff80;letter-spacing:.01em;font-size:14px;line-height:1.85}#viewer-long{z-index:5;background:#000;flex-shrink:0;padding:40px 40px 80px;position:relative}#long-grid{flex-direction:column;gap:24px;max-width:700px;margin:0 auto;display:flex}#about{z-index:5;background:#000;display:none;overflow:hidden auto}#about::-webkit-scrollbar{width:0}.about-inner{max-width:700px;margin:0 auto;padding:60px 40px 100px}.about-portrait{filter:grayscale(30%);width:100%;max-width:500px;height:auto;margin-bottom:30px;display:block}.about-header{margin-bottom:60px}.about-header h1{font-family:var(--mono);letter-spacing:.03em;margin-bottom:10px;font-size:32px;font-weight:700}.about-tagline{letter-spacing:.06em;color:#ffffffa6;margin-bottom:6px;font-size:13px}.about-meta{letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-bottom:10px;font-size:10px}.about-tags{letter-spacing:.1em;text-transform:uppercase;color:#ffffff59;font-size:10px;line-height:1.8}.about-section{margin-bottom:50px}.about-section h2{font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--dim);border-bottom:1px solid #ffffff14;margin-bottom:18px;padding-bottom:8px;font-size:11px;font-weight:700}.about-body{color:#ffffff8c;letter-spacing:.01em;font-size:14px;line-height:1.85}.about-list{padding:0;list-style:none}.about-list li{color:#ffffff80;border-bottom:1px solid #ffffff0a;padding:6px 0;font-size:13px;line-height:1.7}.about-list li em{color:#ffffffb3;font-style:italic}.about-list li strong{color:#ffffffbf;font-weight:400}.about-list--compact li{padding:4px 0}.about-projects{flex-direction:column;gap:24px;display:flex}.about-project h3{font-family:var(--mono);letter-spacing:.04em;color:#fffc;margin-bottom:5px;font-size:13px;font-weight:700}.about-project p{color:#ffffff73;font-size:13px;line-height:1.7}.about-contact-grid{flex-direction:column;gap:12px;display:flex}.about-contact-grid>div{flex-direction:column;gap:2px;display:flex}.about-contact-grid a{color:#fffc;letter-spacing:.03em;font-size:13px;text-decoration:none;transition:color .15s}.about-contact-grid a:hover{color:#fff}.about-contact-grid span:not(.info-label){color:#fffc;font-size:13px}#gl-canvas{pointer-events:none;z-index:500;position:fixed;inset:0;width:100vw!important;height:100vh!important}