.directory,.gif-directory{width:var(--cw-page);margin:0 auto;padding:clamp(20px,4vw,52px) 0 72px}.directory-header{margin-bottom:clamp(26px,4vw,48px)}.directory-header h1{margin:0;color:var(--cw-text);font-size:clamp(4.4rem,17vw,14rem);font-weight:400;line-height:.9}.filter-bar{display:flex;flex-wrap:wrap;align-items:center;gap:6px clamp(18px,2.6vw,36px);margin-top:clamp(16px,2.2vw,28px);border-block:var(--cw-line) solid var(--cw-border);padding:8px 0}.filter-bar .tab-group{margin-left:auto}.search-control,.flair-control,.page-size-control{display:flex;align-items:center;gap:8px}.search-control span,.flair-control span,.page-size-control span{color:var(--cw-text-muted);font-size:.66rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;white-space:nowrap}.filter-bar input,.filter-bar select{min-height:36px;border:0;border-radius:0;background:transparent;color:var(--cw-text);font-size:.95rem}.filter-bar input{width:clamp(150px,18vw,240px);border-bottom:var(--cw-line) solid var(--cw-border);padding:0 2px;transition:border-color .16s ease}.filter-bar input::placeholder{color:var(--cw-text-muted);font-family:var(--cw-font-display);font-style:var(--cw-em-style)}.filter-bar input:focus{border-bottom-color:var(--cw-accent);outline:0}.flair-control select{max-width:180px}.filter-bar select{cursor:pointer}.filter-bar select option{background:var(--cw-surface);color:var(--cw-text)}.model-grid,.gif-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,1.6vw,22px)}.gif-grid{grid-auto-flow:row dense}.empty-results{grid-column:1 / -1;margin:28px 0;padding:56px 20px;color:var(--cw-text-muted);font-family:var(--cw-font-display);font-size:1.6rem;font-style:var(--cw-em-style);text-align:center}.model-card,.gif-card{position:relative;display:grid;grid-template-columns:minmax(0,1fr);align-content:start;min-width:0;content-visibility:auto}.model-card{contain-intrinsic-size:300px 400px}.gif-card{contain-intrinsic-size:300px 450px}.model-card>.card-link{position:absolute;inset:0;z-index:3}.model-card>.card-link:focus-visible{outline:3px solid var(--cw-focus);outline-offset:3px}.model-card .model-media,.gif-card .model-media{grid-area:1 / 1;transition:opacity .26s ease}@media(hover:hover){.model-card .model-media,.gif-card .model-media{opacity:.72}.model-card:hover .model-media,.gif-card:hover .model-media,.model-card:focus-within .model-media,.gif-card:focus-within .model-media{opacity:1}}.model-card .card-copy h2,.gif-card .gif-copy h2{font-size:clamp(1.4rem,1.95vw,1.75rem)}.model-card:hover h2{color:var(--cw-highlight-strong)}.gif-card .gif-copy dl dd{font-size:.86rem}.gif-copy [data-stat]{pointer-events:auto}.gif-copy dd [data-stat=flair]{display:block;font-size:1rem}.gif-title{margin:.5rem .2rem 0;color:var(--cw-text-muted);font-size:.84rem;line-height:1.3;overflow-wrap:anywhere;text-align:center}.gif-title a{color:inherit;text-decoration-color:var(--cw-border);text-decoration-thickness:1px;text-underline-offset:.2em}.gif-title a:hover{color:var(--cw-accent);text-decoration-color:currentColor}.gif-card[data-media-orientation=horizontal]{grid-column:1 / -1;grid-template-columns:minmax(0,1.5fr) minmax(220px,1fr);gap:0 clamp(20px,3vw,44px);contain-intrinsic-size:1000px 430px}.gif-card[data-media-orientation=horizontal] .model-media{aspect-ratio:16 / 9}.gif-card[data-media-orientation=horizontal] .gif-title{grid-area:1 / 2;align-self:center;margin:0;font-family:var(--cw-font-display);font-size:clamp(1.05rem,1.5vw,1.25rem);text-align:left}.pagination{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:clamp(40px,5vw,64px)}.page-numbers{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:2px}.page-numbers button,.page-numbers a,.page-arrow{display:grid;place-items:center;width:40px;height:40px;border:0;border-radius:var(--cw-radius-round);background:transparent;color:var(--cw-text);font-family:var(--cw-font-display);font-size:1.1rem;font-weight:var(--cw-display-weight);font-variant-numeric:lining-nums;cursor:pointer;transition:background-color .16s ease,color .16s ease}.page-arrow{border:var(--cw-line) solid var(--cw-border);font-family:var(--cw-font-body)}.page-numbers button.active,.page-numbers a.active{background:var(--cw-brand);color:var(--cw-on-brand)}@media(hover:hover){.page-numbers button:hover:not(.active),.page-numbers a:hover:not(.active),.page-arrow:hover:not([aria-disabled=true]){background:var(--cw-highlight-strong);color:var(--cw-on-highlight)}}.page-arrow:disabled,.page-arrow[aria-disabled=true]{cursor:not-allowed;opacity:.32}.page-numbers span{width:24px;color:var(--cw-text-muted);text-align:center}.page-range{margin:12px 0 0;color:var(--cw-text-muted);font-family:var(--cw-font-display);font-size:.95rem;font-style:var(--cw-em-style);font-variant-numeric:lining-nums;text-align:center}@media(prefers-reduced-motion:no-preference){@supports (animation-timeline: view()){.model-card,.gif-card{animation:plate-rise linear both;animation-range:entry 0% entry 26%;animation-timeline:view()}}}@media(max-width:1100px){.model-grid,.gif-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:900px){.model-grid,.gif-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.filter-bar .tab-group{margin-left:0}.gif-card[data-media-orientation=horizontal]{grid-template-columns:minmax(0,1fr);contain-intrinsic-size:700px 480px}.gif-card[data-media-orientation=horizontal] .gif-title{grid-area:auto;margin:.5rem .2rem 0;text-align:center}}@media(max-width:600px){.model-grid,.gif-grid{grid-template-columns:1fr}.filter-bar input{width:100%}.search-control,.filter-bar>.model-search{flex:1 1 100%}.search-control input{flex:1;width:auto}.flair-control select{max-width:150px}}@media(max-width:760px),(pointer:coarse){.filter-bar input,.filter-bar select{min-width:44px;min-height:44px;font-size:1rem}.search-control span,.flair-control span,.page-size-control span{font-size:.75rem}.page-numbers button,.page-numbers a,.page-arrow{flex:none;width:44px;height:44px}}.directory-intro{max-width:60ch;margin:clamp(10px,1.4vw,16px) 0 0;color:var(--cw-text-muted);font-size:1.15rem}
