:root{--bg: #000;--ink: #fff;--ink-dim: #9a9a9a;--mono: "IBM Plex Mono", ui-monospace, monospace;--sans: "Archivo", system-ui, sans-serif;--hud-pad: 26px}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;overflow:hidden;background:var(--bg);color:var(--ink);font-family:var(--mono);-webkit-font-smoothing:antialiased}#app,#app canvas{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%}#app canvas{cursor:grab;touch-action:none}#app canvas.is-dragging{cursor:grabbing}body[data-route=screen] #app canvas{cursor:default}body[data-route=screen] #app canvas.is-screen-hover{cursor:pointer}.hud{position:fixed;left:0;right:0;z-index:50;display:flex;align-items:flex-start;pointer-events:none}.filter-wrap,.view-toggle{transition:opacity .35s}body:not([data-route=home]) .filter-wrap{opacity:0;pointer-events:none}body[data-route=about] .view-toggle,body[data-route=contact] .view-toggle,body[data-route=work] .view-toggle{opacity:0;pointer-events:none}.intro-block,.sound{transition:opacity .4s}body[data-route=screen] .intro-block,body[data-route=screen] .sound{opacity:0;pointer-events:none}.hud>*{pointer-events:auto}.hud-top{top:0;padding:var(--hud-pad) var(--hud-pad) 0}.hud-bottom{bottom:0;padding:0 var(--hud-pad) var(--hud-pad);align-items:flex-end}.logo{display:block;line-height:0;transition:transform .4s cubic-bezier(.22,1,.36,1)}.logo:hover{transform:rotate(-12deg) scale(1.06)}.sound{margin-left:clamp(40px,16vw,320px);margin-top:6px;display:flex;align-items:center;gap:10px;background:none;border:0;color:var(--ink);font:600 11px/1 var(--mono);letter-spacing:.12em;cursor:pointer}.sound-dots{display:grid;grid-template-columns:repeat(6,3px);gap:2px}.sound-dots i{width:3px;height:3px;background:#555;transition:background .3s}.sound[aria-pressed=true] .sound-dots i{background:#fff}.intro-block{margin-left:clamp(24px,6vw,120px);display:flex;gap:clamp(24px,4vw,80px);margin-top:4px}.intro-copy{font:600 11px/1.65 var(--mono);letter-spacing:.1em}.clocks{display:flex;flex-direction:column;gap:6px;margin-top:1px}.clock-row{display:flex;align-items:center;gap:9px;font:600 11px/1.4 var(--mono);letter-spacing:.1em;color:var(--ink-dim)}.clock-row.is-primary{color:var(--ink)}.dot{width:7px;height:7px;border-radius:50%;background:#fff}.dot-moon{background:transparent;box-shadow:inset -2px -1px 0 1px #777}.clock-time{margin-left:10px}.talk-btn{margin-left:auto;background:#fff;color:#000;text-decoration:none;font:700 15px/1 var(--sans);padding:18px 30px;border-radius:999px;transition:transform .35s cubic-bezier(.22,1,.36,1),background .3s}.talk-btn:hover{transform:scale(1.05);background:#e6e6e6}.view-toggle{display:flex;gap:6px}.vt-btn{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;border:0;cursor:pointer;background:#282828d9;color:#8b8b8b;transition:background .3s,color .3s}.vt-btn.is-active,.vt-btn:hover{background:#404040f2;color:#fff}.nav-pill{position:absolute;left:50%;bottom:var(--hud-pad);transform:translate(-50%);display:flex;background:#e1e1e1eb;border-radius:999px;padding:5px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.nav-item{font:700 15px/1 var(--sans);color:#3c3c3c;text-decoration:none;padding:14px 28px;border-radius:999px;transition:color .25s}.nav-item:hover{color:#000}.nav-item.is-active{background:#fff;color:#000;box-shadow:0 1px 6px #0000002e}.filter-wrap{margin-left:auto;position:relative;display:flex;flex-direction:column;align-items:flex-end}.filter-btn{border:0;cursor:pointer;background:#e1e1e129;color:#fff;font:700 15px/1 var(--sans);padding:17px 30px;border-radius:999px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background .3s}.filter-btn:hover,.filter-btn[aria-expanded=true]{background:#e1e1e14d}.filter-panel{position:absolute;bottom:calc(100% + 12px);right:0;min-width:210px;background:#0e0e0eeb;border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:10px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);display:flex;flex-direction:column;gap:2px;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .3s,transform .3s,visibility .3s}.filter-panel.is-open{opacity:1;visibility:visible;transform:translateY(0)}.filter-opt{border:0;background:none;cursor:pointer;color:var(--ink-dim);font:600 12px/1 var(--mono);letter-spacing:.12em;text-align:left;padding:11px 14px;border-radius:10px;display:flex;justify-content:space-between;gap:18px;transition:background .2s,color .2s}.filter-opt:hover{background:#ffffff12;color:#fff}.filter-opt.is-active{color:#fff;background:#ffffff1f}.filter-count{color:#666}.page{position:fixed;top:0;right:0;bottom:0;left:0;z-index:35;background:#060606;visibility:hidden;clip-path:inset(100% 0 0 0);overflow-y:auto;overscroll-behavior:contain}.page-inner{max-width:1140px;margin:0 auto;padding:120px clamp(20px,4vw,48px) 140px}.page-label{font:600 12px/1 var(--mono);letter-spacing:.3em;color:var(--ink-dim);margin-bottom:30px;display:flex;align-items:center;gap:16px}.page-label:after{content:"";flex:0 0 64px;height:1px;background:#ffffff4d}.page-title{font:900 clamp(40px,7.5vw,100px)/.95 var(--sans);text-transform:uppercase;letter-spacing:-.02em;margin-bottom:56px;max-width:14ch}.page-copy{font:400 15px/1.8 var(--mono);color:#c9c9c9;max-width:600px}.page-copy p+p{margin-top:18px}.about-grid{display:grid;grid-template-columns:minmax(0,600px) auto;gap:48px;align-items:start;margin-bottom:80px}.about-facts{list-style:none;display:flex;flex-direction:column}.about-facts li{display:flex;align-items:baseline;gap:18px;padding:18px 0;border-top:1px solid rgba(255,255,255,.14)}.about-facts li:last-child{border-bottom:1px solid rgba(255,255,255,.14)}.about-facts strong{font:900 30px/1 var(--sans);min-width:110px}.about-facts span{font:600 11px/1.5 var(--mono);letter-spacing:.14em;color:var(--ink-dim)}.caps{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:32px;border-top:1px solid rgba(255,255,255,.16);padding-top:36px}.cap-col h2{font:600 12px/1 var(--mono);letter-spacing:.22em;color:var(--ink-dim);margin-bottom:22px}.cap-col ul{list-style:none}.cap-col li{font:700 17px/1 var(--sans);letter-spacing:.02em;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.08)}.contact-inner{display:flex;flex-direction:column;min-height:100%;justify-content:center}.contact-title{margin-bottom:44px}.contact-title a{font:900 clamp(38px,7.5vw,108px)/.98 var(--sans);letter-spacing:-.02em;color:#fff;text-decoration:none;display:inline-block;transition:opacity .3s}.contact-title a:hover{opacity:.65}.contact-copy{margin-bottom:54px}.contact-links{list-style:none;display:flex;gap:38px;flex-wrap:wrap}.contact-links a{font:600 13px/1 var(--mono);letter-spacing:.14em;color:#fff;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.6);padding-bottom:7px;transition:opacity .25s}.contact-links a:hover{opacity:.6}.list-inner{max-width:1240px;padding-top:110px}.list-head{display:grid;grid-template-columns:80px 1fr 80px;font:600 11px/1 var(--mono);letter-spacing:.22em;color:var(--ink-dim);padding-bottom:18px}.list-head span:last-child{text-align:right}.list-rows{list-style:none}.list-row{width:100%;display:grid;grid-template-columns:80px minmax(0,1fr) auto 110px 80px;align-items:center;gap:18px;background:none;border:0;border-top:1px solid rgba(255,255,255,.14);padding:22px 0;cursor:pointer;text-align:left;color:#fff;transition:background .25s}.list-rows li:last-child .list-row{border-bottom:1px solid rgba(255,255,255,.14)}.list-row:hover{background:#ffffff0b}.lr-index{font:500 12px/1 var(--mono);color:var(--ink-dim);letter-spacing:.1em}.lr-title{font:900 clamp(20px,2.6vw,34px)/1 var(--sans);text-transform:uppercase;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:transform .35s cubic-bezier(.22,1,.36,1)}.list-row:hover .lr-title{transform:translate(14px)}.lr-client{font:600 11px/1 var(--mono);letter-spacing:.16em;color:var(--ink-dim)}.lr-cat{font:500 11px/1 var(--mono);letter-spacing:.12em;color:#d8d8d8;border:1px solid rgba(255,255,255,.4);border-radius:999px;padding:8px 14px;justify-self:start}.lr-year{font:500 13px/1 var(--mono);color:var(--ink-dim);text-align:right}.list-thumb{position:fixed;top:0;left:0;width:360px;height:220px;object-fit:cover;border:1px solid rgba(255,255,255,.18);pointer-events:none;opacity:0;z-index:36;will-change:transform}#detail{position:fixed;top:0;right:0;bottom:0;left:0;z-index:45;background:#060606;visibility:hidden;clip-path:inset(100% 0 0 0);overflow-y:auto;overscroll-behavior:contain}.detail-inner{max-width:1140px;margin:0 auto;padding:34px clamp(20px,4vw,48px) 90px}.detail-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:clamp(40px,8vh,90px)}.d-client{font:600 12px/1 var(--mono);letter-spacing:.18em;color:var(--ink-dim)}.d-close{border:0;background:none;color:#fff;font:600 13px/1 var(--mono);letter-spacing:.1em;cursor:pointer;padding:10px 0 10px 20px;transition:opacity .25s}.d-close:hover{opacity:.6}.d-title{font:900 clamp(44px,8.5vw,116px)/.95 var(--sans);text-transform:uppercase;letter-spacing:-.02em;margin-bottom:34px}.d-meta{display:flex;align-items:center;gap:22px;flex-wrap:wrap;padding:22px 0;border-top:1px solid rgba(255,255,255,.16);border-bottom:1px solid rgba(255,255,255,.16);margin-bottom:44px}.d-year,.d-cat{font:600 12px/1 var(--mono);letter-spacing:.14em;color:var(--ink-dim)}.d-cat{margin-left:auto}.d-tags{display:flex;gap:8px;flex-wrap:wrap}.d-tags span{font:500 11px/1 var(--mono);letter-spacing:.1em;border:1px solid rgba(255,255,255,.4);border-radius:999px;padding:8px 14px}.d-figure{margin-bottom:48px;border:1px solid rgba(255,255,255,.1)}.d-img{display:block;width:100%;aspect-ratio:16 / 9;object-fit:cover}.d-body{display:grid;grid-template-columns:minmax(0,640px) auto;gap:40px;align-items:start}.d-desc{font:400 15px/1.8 var(--mono);color:#c9c9c9}.d-link{font:600 13px/1 var(--mono);letter-spacing:.12em;color:#fff;text-decoration:none;border-bottom:1px solid #fff;padding-bottom:6px;justify-self:end;transition:opacity .25s}.d-link:hover{opacity:.6}.d-link.is-hidden{display:none}.d-next{width:100%;margin-top:90px;padding:34px 0;border:0;border-top:1px solid rgba(255,255,255,.16);border-bottom:1px solid rgba(255,255,255,.16);background:none;color:#fff;cursor:pointer;display:flex;align-items:center;gap:28px;text-align:left}.d-next-label{font:600 11px/1 var(--mono);letter-spacing:.24em;color:var(--ink-dim);flex:0 0 auto}.d-next-title{font:900 clamp(24px,4vw,52px)/1 var(--sans);text-transform:uppercase;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:transform .35s cubic-bezier(.22,1,.36,1)}.d-next-arrow{margin-left:auto;font:400 34px/1 var(--mono);transition:transform .35s cubic-bezier(.22,1,.36,1)}.d-next:hover .d-next-title{transform:translate(12px)}.d-next:hover .d-next-arrow{transform:translate(10px)}#loader{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;background:#000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px}.loader-mark svg{animation:spin 7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loader-line{font:600 11px/1 var(--mono);letter-spacing:.32em;color:var(--ink-dim)}.loader-pct{font:700 15px/1 var(--mono);letter-spacing:.1em}@media (max-width: 900px){.intro-block{display:none}.sound{margin-left:30px}}@media (max-width: 900px){.about-grid{grid-template-columns:1fr}.caps{grid-template-columns:1fr;gap:40px}.list-row{grid-template-columns:50px minmax(0,1fr) 70px}.lr-client,.lr-cat,.list-thumb{display:none}}@media (max-width: 600px){.talk-btn{padding:14px 22px;font-size:13px}.nav-item{padding:12px 18px;font-size:13px}.d-body{grid-template-columns:1fr}.d-link{justify-self:start}}@media (prefers-reduced-motion: reduce){.loader-mark svg{animation:none}}