:root{--bg:#08080b;--panel:#101014;--panel2:#15151a;--text:#fff;--muted:#9b98a2;--line:rgba(255,255,255,.13);--pink:#f80070;--max:1440px}*{box-sizing:border-box}html{background:var(--bg);color:var(--text);font-family:Inter,Arial,sans-serif;-webkit-font-smoothing:antialiased}body{margin:0;min-height:100vh;background:radial-gradient(circle at 16% 0%,rgba(248,0,112,.14),transparent 31%),linear-gradient(145deg,#09090d,#070709 72%)}a{color:inherit}.site-header{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:30px;padding:26px 36px;border-bottom:1px solid var(--line);background:rgba(8,8,11,.8);backdrop-filter:blur(24px)}.brand{display:inline-flex;width:clamp(140px,13vw,205px)}.brand img{display:block;width:100%}.site-nav{display:flex;gap:34px;font:600 13px Commissioner,Inter,sans-serif}.site-nav a{text-decoration:none;transition:.25s}.site-nav a:hover,.site-nav a.active{color:var(--pink)}.language{justify-self:end;color:var(--pink);font:600 12px Commissioner,Inter,sans-serif;letter-spacing:.13em}.catalog-main,.detail-main{width:calc(100% - 72px);margin:0 36px;padding:76px 0 100px}.eyebrow{color:var(--pink);font:600 11px Commissioner,Inter,sans-serif;letter-spacing:.16em;text-transform:uppercase}.catalog-hero{display:grid;grid-template-columns:1.4fr .7fr;gap:70px;align-items:end;padding-bottom:54px;border-bottom:1px solid var(--line)}h1{margin:10px 0 0;font-size:clamp(3rem,7vw,7.5rem);line-height:.88;letter-spacing:-.065em;font-weight:600}.catalog-intro{justify-self:end;max-width:420px;color:var(--muted);font-size:16px;line-height:1.55}.catalog-intro strong{display:block;margin-bottom:12px;color:#fff;font:600 13px Commissioner,Inter,sans-serif}.catalog-tools{display:grid;grid-template-columns:1fr auto;gap:18px;padding:30px 0}.search{position:relative}.search input{width:100%;padding:15px 18px 15px 44px;border:1px solid var(--line);border-radius:0;background:transparent;color:#fff;font:500 14px Inter,sans-serif;outline:none}.search:before{content:'⌕';position:absolute;left:16px;top:12px;color:var(--muted);font-size:22px}.search input:focus{border-color:var(--pink)}.filters{display:flex;gap:8px}.filter{border:1px solid var(--line);background:transparent;color:var(--muted);padding:0 16px;font:600 11px Commissioner,Inter,sans-serif;letter-spacing:.06em;text-transform:uppercase;cursor:pointer}.filter.active,.filter:hover{border-color:var(--pink);color:#fff;background:rgba(248,0,112,.09)}.catalog-count{margin-bottom:13px;color:var(--muted);font:500 11px Commissioner,Inter,sans-serif;letter-spacing:.08em;text-transform:uppercase}.asset-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}.asset-card{position:relative;min-height:292px;display:flex;flex-direction:column;justify-content:space-between;padding:26px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);text-decoration:none;overflow:hidden;transition:background .35s ease}.asset-card:before{content:'';position:absolute;inset:auto -20% -60% 20%;height:85%;background:radial-gradient(circle,rgba(248,0,112,.16),transparent 65%);opacity:0;transition:.35s}.asset-card:hover{background:#131318}.asset-card:hover:before{opacity:1}.asset-card-top,.asset-card-bottom{position:relative;z-index:1}.asset-code{display:flex;justify-content:space-between;color:var(--muted);font:600 10px Commissioner,Inter,sans-serif;letter-spacing:.1em;text-transform:uppercase}.asset-card h2{margin:20px 0 12px;font-size:clamp(1.6rem,2.6vw,2.8rem);line-height:.98;letter-spacing:-.045em;font-weight:600}.asset-card p{max-width:340px;color:var(--muted);font-size:13px;line-height:1.5}.asset-card-bottom{display:flex;justify-content:space-between;align-items:end;margin-top:40px}.asset-domain{font:500 11px Commissioner,Inter,sans-serif;color:#d5d3d9}.asset-arrow{font-size:27px;transform:rotate(0);transition:.3s}.asset-card:hover .asset-arrow{color:var(--pink);transform:translate(4px,-4px)}.empty{display:none;padding:80px 0;color:var(--muted)}.site-footer{display:grid;grid-template-columns:1fr 1fr auto;gap:30px;align-items:end;padding:38px 36px;border-top:1px solid var(--line);font:500 12px Commissioner,Inter,sans-serif}.site-footer span{display:block;margin-bottom:7px;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.12em}.site-footer a{text-decoration:none}.footer-arrow{font-size:35px;color:var(--pink)}.detail-main{padding-top:44px}.back{display:inline-flex;gap:10px;margin-bottom:70px;color:var(--muted);text-decoration:none;font:600 11px Commissioner,Inter,sans-serif;text-transform:uppercase;letter-spacing:.1em}.back:hover{color:var(--pink)}.detail-hero{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,.5fr);gap:80px;padding-bottom:65px;border-bottom:1px solid var(--line)}.detail-hero h1{max-width:1000px}.detail-meta{align-self:end;display:grid;border-top:1px solid var(--line)}.meta-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:14px 0;border-bottom:1px solid var(--line);font:500 12px Commissioner,Inter,sans-serif}.meta-row span:first-child{color:var(--muted);text-transform:uppercase;letter-spacing:.1em;font-size:10px}.detail-body{display:grid;grid-template-columns:.45fr 1fr;gap:80px;padding-top:58px}.detail-label{color:var(--muted);font:600 11px Commissioner,Inter,sans-serif;text-transform:uppercase;letter-spacing:.13em}.detail-copy{font-size:clamp(1.45rem,2.8vw,3.2rem);line-height:1.15;letter-spacing:-.035em}.visit{display:inline-flex;align-items:center;gap:18px;margin-top:42px;padding-bottom:8px;border-bottom:2px solid var(--pink);text-decoration:none;font:600 13px Commissioner,Inter,sans-serif}.visit:hover{color:var(--pink)}@media(max-width:960px){.site-header{grid-template-columns:1fr auto}.site-nav{display:none}.catalog-main,.detail-main{width:calc(100% - 40px);margin:0 20px;padding-top:46px}.catalog-hero,.detail-hero,.detail-body{grid-template-columns:1fr;gap:38px}.catalog-intro{justify-self:start}.asset-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.detail-meta{max-width:500px}.catalog-tools{grid-template-columns:1fr}.filters{overflow:auto;padding-bottom:4px}.filter{min-height:44px;white-space:nowrap}.site-footer{grid-template-columns:1fr auto}.site-footer>div:nth-child(2){display:none}}@media(max-width:620px){.site-header{padding:22px 20px}.brand{width:126px}.catalog-main,.detail-main{width:calc(100% - 28px);margin:0 14px}.catalog-hero{padding-bottom:36px}h1{font-size:clamp(3.1rem,17vw,5.5rem)}.asset-grid{grid-template-columns:1fr}.asset-card{min-height:250px}.site-footer{padding:28px 20px}.detail-body{padding-top:38px}.detail-copy{font-size:1.65rem}}

/* v4 catalog: the portfolio is a mosaic (2026-08-11) */
@view-transition{navigation:auto}
::view-transition{background:#08080b}
::view-transition-old(root){animation-duration:.28s;animation-timing-function:ease}
::view-transition-new(root){animation-duration:.28s;animation-timing-function:ease}
.cat-index .catalog-hero{grid-template-columns:1fr auto;align-items:end}
.stat-band{display:grid;grid-template-columns:repeat(4,auto);gap:0 48px;justify-self:end;text-align:right}
.stat{display:flex;flex-direction:column;align-items:flex-end}
.stat-num{font-size:clamp(2.4rem,4.6vw,4.4rem);font-weight:600;letter-spacing:-.05em;line-height:1;color:var(--pink);font-variant-numeric:tabular-nums}
.stat-label{margin-top:10px;color:var(--muted);font:600 10px Commissioner,Inter,sans-serif;letter-spacing:.16em;text-transform:uppercase}
.wall-wrap{padding:36px 0 10px}
.mosaic-wall{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:2px}
.wall-tile{position:relative;aspect-ratio:1;display:flex;align-items:center;justify-content:center;background:#0d0d12;overflow:hidden;text-decoration:none;transition:opacity .45s ease,filter .45s ease,background .45s ease}
.wall-tile::before{content:'';position:absolute;inset:0;background:radial-gradient(120% 120% at 30% 72%,rgba(248,0,112,var(--g,.1)),transparent 72%);opacity:.7;transition:opacity .45s ease}
.wall-tile img{position:relative;z-index:1;max-width:72%;max-height:46%;width:auto;height:auto;opacity:.94}
.wall-word{position:relative;z-index:1;color:#fff;font:600 10px Commissioner,Inter,sans-serif;letter-spacing:.05em;text-transform:uppercase;text-align:center;padding:0 8px}
.wall-name{position:absolute;z-index:2;left:8px;right:8px;bottom:7px;color:#fff;font:600 9px Commissioner,Inter,sans-serif;letter-spacing:.08em;text-transform:uppercase;opacity:0;transform:translateY(4px);transition:.3s ease;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center}
.wall-tile:hover{background:#15151c}
.wall-tile:hover::before{opacity:1}
.wall-tile:hover .wall-name{opacity:1;transform:none}
.wall-tile:focus-visible{outline:2px solid var(--pink);outline-offset:-2px}
.wall-tile--void{pointer-events:none}
.mosaic-wall.has-hl .wall-tile.is-dim{opacity:.16;filter:saturate(.35)}
.wall-hint{margin:16px 0 0;color:var(--muted);font:500 11px Commissioner,Inter,sans-serif;letter-spacing:.06em}
.cat-list{display:block;border-top:1px solid var(--line);margin-top:34px}
.cat-list--compact{margin-top:0}
.cat-row{display:grid;grid-template-columns:minmax(96px,150px) 1fr auto;align-items:center;gap:30px;padding:34px 0;border-bottom:1px solid var(--line);color:#fff;text-decoration:none;transition:background .4s ease,padding .4s ease}
.cat-row:hover{background:rgba(255,255,255,.02);padding-left:14px;padding-right:6px}
.cat-num{font-size:clamp(2.8rem,5vw,4.8rem);line-height:1;font-weight:600;letter-spacing:-.05em;color:var(--pink)}
.cat-name{font-size:clamp(1.5rem,2.8vw,2.6rem);font-weight:600;letter-spacing:-.045em;transition:color .3s ease}
.cat-row:hover .cat-name{color:var(--pink)}
.cat-arrow{display:inline-flex;color:var(--muted);transition:transform .4s cubic-bezier(.22,.61,.36,1),color .3s ease}
.cat-row:hover .cat-arrow{color:var(--pink);transform:translate(5px,-5px)}
.cat-row--compact{padding:20px 0;grid-template-columns:minmax(64px,90px) 1fr auto}
.cat-row--compact .cat-num{font-size:clamp(1.8rem,3vw,2.6rem)}
.cat-row--compact .cat-name{font-size:clamp(1.2rem,2vw,1.7rem)}
.cat-row--compact .cat-arrow svg{width:26px;height:26px}
.cat-count-hero{justify-self:end;align-self:end;text-align:right}
.cat-count-num{display:block;font-size:clamp(3rem,7vw,6.4rem);line-height:.9;font-weight:600;letter-spacing:-.05em;color:var(--pink);font-variant-numeric:tabular-nums}
.cat-count-label{display:block;margin-top:10px;color:var(--muted);font:600 11px Commissioner,Inter,sans-serif;letter-spacing:.16em;text-transform:uppercase}
.cat-count-sub{display:block;margin-top:12px;color:var(--muted);font:500 11px Commissioner,Inter,sans-serif;letter-spacing:.08em;text-transform:uppercase}
.cat-page .back,.cat-index .back{margin-bottom:54px}
.logo-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}
.logo-tile{position:relative;display:flex;flex-direction:column;min-height:196px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);text-decoration:none;overflow:hidden;transition:background .4s ease}
.logo-tile:before{content:'';position:absolute;inset:auto -20% -60% 20%;height:85%;background:radial-gradient(circle,rgba(248,0,112,.16),transparent 65%);opacity:0;transition:opacity .4s ease}
.logo-tile:hover{background:#131318}
.logo-tile:hover:before{opacity:1}
.logo-tile:focus-visible{outline:2px solid var(--pink);outline-offset:-2px}
.tile-logo{position:relative;z-index:1;flex:1;display:flex;align-items:center;justify-content:center;padding:32px 28px 14px}
.tile-logo img{max-height:58px;max-width:76%;width:auto;height:auto;transition:transform .5s cubic-bezier(.22,.61,.36,1)}
.logo-tile:hover .tile-logo img{transform:scale(1.05)}
.tile-word{font:600 clamp(1.25rem,1.8vw,1.8rem) Commissioner,Inter,sans-serif;letter-spacing:.01em;color:#fff;text-align:center;transition:transform .5s cubic-bezier(.22,.61,.36,1)}
.logo-tile:hover .tile-word{transform:scale(1.05)}
.tile-meta{position:relative;z-index:1;display:flex;justify-content:space-between;gap:12px;padding:0 18px 15px;color:var(--muted);font:500 10px Commissioner,Inter,sans-serif;letter-spacing:.08em;text-transform:uppercase}
.tile-meta span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sheet{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:24px}
.sheet-backdrop{position:absolute;inset:0;background:rgba(5,5,7,.72);backdrop-filter:blur(12px);opacity:0;transition:opacity .32s ease}
.sheet.is-open .sheet-backdrop{opacity:1}
.sheet-panel{position:relative;z-index:1;width:min(560px,100%);max-height:min(84vh,720px);overflow:auto;background:#101015;border:1px solid var(--line);padding:46px 44px 40px;box-shadow:0 40px 120px rgba(0,0,0,.6)}
.sheet-close{position:absolute;top:14px;right:14px;display:flex;width:44px;height:44px;align-items:center;justify-content:center;background:none;border:1px solid transparent;color:var(--muted);cursor:pointer;transition:color .25s,border-color .25s}
.sheet-close:hover{color:#fff;border-color:var(--line)}
.sheet-close:focus-visible{outline:2px solid var(--pink)}
.sheet-logo{min-height:60px;display:flex;align-items:center;margin-bottom:24px}
.sheet-logo img{max-height:54px;max-width:min(320px,80%)}
.sheet-word{font:600 1.5rem Commissioner,Inter,sans-serif;color:#fff}
.sheet-panel h2{margin:8px 0 22px;font-size:clamp(1.9rem,3vw,2.6rem);letter-spacing:-.045em;line-height:1;font-weight:600}
.sheet-meta{display:grid;border-top:1px solid var(--line);margin-bottom:22px}
.sheet-desc{margin:0 0 30px;color:#d5d3d9;font-size:15px;line-height:1.6}
.sheet-actions{display:flex;align-items:center;gap:28px;flex-wrap:wrap}
.sheet-page{color:var(--muted);text-decoration:none;font:600 12px Commissioner,Inter,sans-serif;letter-spacing:.06em;text-transform:uppercase;transition:color .25s}
.sheet-page:hover{color:var(--pink)}
.more-cats{padding:64px 0 0}
.siblings{padding:58px 0 0}
.more-label{color:var(--muted);font:600 11px Commissioner,Inter,sans-serif;letter-spacing:.13em;text-transform:uppercase;margin-bottom:16px}
.sib-strip{display:grid;grid-auto-flow:column;grid-auto-columns:150px;gap:2px;overflow-x:auto;padding-bottom:8px}
.sib{display:flex;align-items:center;justify-content:center;height:96px;background:#0d0d12;text-decoration:none;transition:background .3s ease}
.sib:hover{background:#15151c}
.sib img{max-height:32px;max-width:74%;width:auto;height:auto}
.sib-word{color:#fff;font:600 11px Commissioner,Inter,sans-serif;text-align:center;padding:0 10px}
.detail-brand{margin-bottom:28px}
.detail-brand img{max-height:72px;max-width:min(360px,72%)}
.detail-word{font:600 clamp(1.6rem,3vw,2.4rem) Commissioner,Inter,sans-serif;color:#fff}
.cat-list[hidden],.search-results[hidden],.logo-tile[hidden],.cat-row[hidden],.wall-wrap[hidden],.sheet[hidden],.catalog-count[hidden]{display:none!important}
@media(prefers-reduced-motion:no-preference){
.catalog-hero,.catalog-tools,.catalog-count{animation:rise .7s cubic-bezier(.22,.61,.36,1) both}
.cat-row{animation:rise .65s cubic-bezier(.22,.61,.36,1) both;animation-delay:min(calc(120ms + var(--i,0)*70ms),480ms)}
.logo-tile{animation:rise .6s cubic-bezier(.22,.61,.36,1) both;animation-delay:min(calc(80ms + var(--i,0)*30ms),480ms)}
.mosaic-wall .wall-tile{animation:tilein .55s cubic-bezier(.22,.61,.36,1) backwards;animation-delay:min(calc(60ms + var(--i,0)*16ms),1000ms)}
.wall-tile::before{animation:breathe 7s ease-in-out infinite;animation-delay:calc(var(--i,0)*-137ms)}
.wall-hint{animation:rise .7s cubic-bezier(.22,.61,.36,1) both;animation-delay:.9s}
.detail-hero,.detail-body,.siblings{animation:rise .7s cubic-bezier(.22,.61,.36,1) both}
.detail-body{animation-delay:120ms}
.siblings{animation-delay:200ms}
@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes tilein{from{opacity:0;transform:scale(.85)}to{opacity:1;transform:none}}
@keyframes breathe{0%,100%{opacity:.5}50%{opacity:.95}}
}
@media(max-width:960px){
.mosaic-wall .wall-tile--void:nth-of-type(n+11){display:none}
.cat-index .catalog-hero{grid-template-columns:1fr}
.stat-band{justify-self:start;text-align:left;grid-template-columns:repeat(2,auto);gap:26px 44px}
.stat{align-items:flex-start}
.mosaic-wall{grid-template-columns:repeat(auto-fill,minmax(76px,1fr))}
.cat-row{grid-template-columns:auto 1fr auto;gap:18px;padding:26px 0}
.logo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.logo-tile{min-height:164px}
.cat-count-hero{justify-self:start;text-align:left}
}
@media(max-width:620px){
.mosaic-wall .wall-tile--void:nth-of-type(n+6){display:none}
.mosaic-wall{grid-template-columns:repeat(auto-fill,minmax(62px,1fr))}
.wall-name{display:none}
.cat-arrow svg{width:28px;height:28px}
.logo-tile{min-height:140px}
.tile-logo{padding:22px 18px 10px}
.tile-logo img{max-height:44px;max-width:82%}
.sheet{padding:0;align-items:flex-end}
.sheet-panel{width:100%;max-height:88vh;padding:38px 22px 32px;border-left:0;border-right:0;border-bottom:0}
}
