@font-face{font-family:"Martian Floricel";src:url("/assets/fonts/MartianMono-Variable.ttf") format("truetype-variations");font-weight:100 800;font-style:normal;font-display:swap}
:root{--bg:#000;--panel:#0b0c0a;--ink:#fff;--muted:#999;--signal:#ff3b30;--line:rgba(255,255,255,.17);--pad:clamp(1rem,3vw,3.5rem)}
*{box-sizing:border-box}
html{background:var(--bg);color-scheme:dark;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Martian Floricel","IBM Plex Mono",monospace;font-size:14px;line-height:1.55}
img{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--signal);outline-offset:4px}
.hub-header{position:sticky;z-index:20;top:0;display:flex;align-items:center;justify-content:space-between;min-height:76px;padding:0 var(--pad);border-bottom:1px solid var(--line);background:rgba(0,0,0,.94)}
.hub-brand img{width:150px;height:auto;filter:brightness(1.4) grayscale(1)}
.hub-header a{font-size:.67rem;font-weight:700;letter-spacing:.06em;text-decoration:none}
.hub-header a:hover{color:var(--signal)}
.hub-browser{padding:0 var(--pad) clamp(3rem,7vw,7rem)}
.hub-browser__bar{display:flex;align-items:center;justify-content:space-between;gap:2rem;min-height:118px;border-bottom:1px solid var(--line)}
.hub-browser__bar h1{margin:0;font-size:clamp(1.5rem,3vw,3.25rem);line-height:1;letter-spacing:-.04em}
.hub-filters{display:flex;gap:.4rem}
.hub-filters button,.hub-empty button{min-height:44px;padding:.65rem .85rem;border:1px solid var(--line);background:transparent;cursor:pointer;font-size:.63rem;font-weight:700}
.hub-filters button{display:inline-flex;align-items:center;gap:.7rem}.hub-filters button b{color:var(--muted);font:inherit;font-variant-numeric:tabular-nums}.hub-filters button[aria-pressed=true] b{color:#000}
.hub-filters button[aria-pressed=true],.hub-filters button:hover,.hub-empty button:hover{border-color:var(--signal);background:var(--signal);color:#000}
.hub-grid{display:block;border-top:1px solid var(--line)}
.hub-deck{--fan:1;position:relative;display:flex;justify-content:center;align-items:flex-start;min-height:clamp(34rem,52vw,47rem);padding:clamp(1.5rem,4vw,3rem) 1rem clamp(6rem,10vw,9rem);overflow:hidden;border-bottom:1px solid var(--line);background:radial-gradient(ellipse at 50% 72%,rgba(255,59,48,.09),transparent 55%)}
.hub-deck::before{content:attr(data-range);position:absolute;right:-.05em;bottom:-.18em;z-index:0;color:#070707;font-size:clamp(10rem,24vw,25rem);font-weight:800;line-height:.78;letter-spacing:-.08em;font-variant-numeric:tabular-nums;pointer-events:none;white-space:nowrap}
.hub-card{position:relative;flex:0 0 auto;width:clamp(13.5rem,20vw,20rem);margin-inline:clamp(-4.5rem,-4.7vw,-2.8rem);z-index:var(--deck-z,10);transform:translateX(calc(var(--deck-center,0px) * (1 - var(--fan)))) rotate(calc(var(--deck-rotation,0deg) * var(--fan))) translateY(calc(var(--deck-drop,0px) * var(--fan) + (1 - var(--fan)) * 3rem));transform-origin:50% 116%;will-change:transform;isolation:isolate}
.hub-deck--few{gap:clamp(1.5rem,4vw,4rem)}
.hub-deck--few .hub-card{width:clamp(16rem,25vw,24rem);margin-inline:0;transform:none}
.hub-card:focus-within{z-index:90}
.hub-card a{position:relative;display:block;width:100%;color:inherit;text-decoration:none}
.hub-card__media{position:relative;display:block;width:100%;aspect-ratio:9/14;overflow:hidden;border:1px solid var(--line);background:#050505;transition:border-color .22s ease-out}
.hub-card__media::after{content:"";position:absolute;z-index:3;inset:6%;pointer-events:none;border:1px solid rgba(255,255,255,.08);transition:border-color .18s ease-out}
.hub-card__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.72) contrast(1.08) brightness(.82);transition:filter .25s ease-out}
.hub-card__type{position:absolute;z-index:4;top:0;right:0;padding:.55rem .65rem;background:var(--signal);color:#000;font-size:.58rem;font-weight:800}
.hub-card:focus-within .hub-card__media::after{border-color:var(--signal)}
.hub-project-index{display:block;border-top:1px solid var(--line)}
.hub-index-row{display:grid;grid-template-columns:3.5rem minmax(0,1.35fr) minmax(10rem,.85fr) 8.5rem 4rem;gap:clamp(.8rem,2vw,2rem);align-items:center;min-height:5.8rem;padding:1rem clamp(.8rem,2vw,1.5rem);border-bottom:1px solid var(--line);text-decoration:none;transition:background-color .2s ease-out}
.hub-index-row__number,.hub-index-row time{font-variant-numeric:tabular-nums}
.hub-index-row__number,.hub-index-row__type{color:var(--signal);font-size:.66rem;font-weight:700}
.hub-index-row strong{font-size:clamp(.95rem,1.5vw,1.25rem);line-height:1.25;letter-spacing:-.025em}
.hub-index-row__client,.hub-index-row time{color:var(--muted);font-size:.68rem}
.hub-index-row__type{justify-self:start}
.hub-index-row time{justify-self:end}
.hub-index-row:hover,.hub-index-row:focus-visible{background:rgba(255,59,48,.055)}
.hub-empty{min-height:45vh;display:grid;place-content:center;justify-items:center;gap:1rem;text-align:center;border:1px solid var(--line);border-top:0}
.hub-empty strong{font-size:clamp(1.2rem,3vw,2rem)}
@view-transition{navigation:auto}
::view-transition-group(*){animation-duration:.46s;animation-timing-function:cubic-bezier(.16,1,.3,1)}
@keyframes cover-develop{from{clip-path:inset(0 0 100% 0);filter:brightness(.45)}to{clip-path:inset(0);filter:brightness(1)}}
.hub-card--intro .hub-card__media{animation:cover-develop .68s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(var(--entry-index,0) * 55ms)}
@media(max-width:760px){.hub-header{min-height:68px}.hub-brand img{width:118px}.hub-back{font-size:.58rem!important}.hub-browser__bar{align-items:flex-start;flex-direction:column;padding:1.5rem 0}.hub-filters{width:100%;overflow:auto}.hub-grid{margin-inline:calc(var(--pad) * -1)}.hub-deck,.hub-deck--few{justify-content:flex-start;min-height:0;gap:0;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--pad);overscroll-behavior-inline:contain;touch-action:pan-x;padding:.9rem calc(var(--pad) - .4rem) 3rem;scrollbar-width:none}.hub-deck::before{right:-.02em;bottom:.02em;font-size:9rem}.hub-deck::-webkit-scrollbar{display:none}.hub-card,.hub-deck--few .hub-card{width:min(76vw,18rem);margin-inline:.4rem;transform:none!important;scroll-snap-align:center}.hub-card__media{aspect-ratio:9/16}.hub-project-index{padding-inline:var(--pad)}.hub-index-row{grid-template-columns:2.25rem minmax(0,1fr) auto;gap:.75rem;min-height:4.8rem;padding:.85rem 0}.hub-index-row__client,.hub-index-row time{display:none}.hub-index-row strong{font-size:.85rem}.hub-index-row__type{font-size:.56rem;justify-self:end}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition-duration:.01ms!important}.hub-card{transform:rotate(var(--deck-rotation,0deg)) translateY(var(--deck-drop,0px))}::view-transition-group(*){animation-duration:.01ms}}
