/* A quiet, aligned collection. This layer deliberately leaves orbit geometry alone. */
:root{--space-1:8px;--space-2:16px;--space-3:24px;--space-4:32px;--space-6:48px;--space-8:64px;--card-radius:22px}
.page-shell{max-width:1240px;padding-inline:40px}
.site-header{height:96px}
.hero{min-height:444px;padding-block:40px 48px;column-gap:32px}
.hero-description{margin-block:24px 32px;max-width:34em}
.works-section{padding-top:32px;scroll-margin-top:32px}
.section-heading{gap:24px}
.collection-toolbar{margin-block:32px;padding-bottom:24px;gap:24px}
.catalog{gap:32px;align-items:start}
.catalog[data-count="1"]{grid-template-columns:minmax(0,800px)}
.catalog[data-count="1"] .work-card{grid-template-columns:1fr 1fr;width:100%}
.catalog[data-count="1"] .card-art{min-height:288px}
.catalog[data-count="2"]{max-width:960px;gap:32px}
.catalog:not([data-count="1"])>.work-item:nth-child(3n + 1) .card-art{aspect-ratio:5/4}
.catalog:not([data-count="1"])>.work-item:nth-child(3n + 2) .card-art{aspect-ratio:16/10}
.catalog:not([data-count="1"])>.work-item:nth-child(3n) .card-art{aspect-ratio:1/1}
.work-card{border-radius:var(--card-radius);border-color:#8c9ea535;background:#0d141b;box-shadow:0 6px 20px #0002;transition:transform 230ms ease,border-color 230ms ease,box-shadow 230ms ease,filter 120ms ease}
.card-content{padding:24px;gap:0;background:#0d141b}
.card-title-row h3{min-height:0;font-size:20px;line-height:1.5}
.card-description{margin-block:12px 24px;line-height:1.85}
.card-tags{gap:8px}
.card-entry{margin-top:24px}
@media(hover:hover) and (pointer:fine){.work-card:hover{transform:translateY(-4px);border-color:#c1c9ca80;box-shadow:0 16px 32px #0005,0 2px 6px #0003}}
.work-card:focus-visible{border-color:#e6d6b0;box-shadow:0 12px 28px #0004}
/* Glass is confined to small controls; readable opaque defaults remain above. */
.search-wrap{background:#121c25;border-color:#71828b80;box-shadow:inset 0 1px 0 #e6f2f015}
.card-badge{background:#17212d;color:#eef0ed;border-color:#c3d1d838;border-radius:8px}
.preview-close{background:#17212b;box-shadow:inset 0 1px 0 #fff2}
@supports ((backdrop-filter:blur(12px)) or (-webkit-backdrop-filter:blur(12px))){
 .search-wrap{background:linear-gradient(125deg,#d4e6ee0d,#d4e6ee00 55%),#101820df;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
 .card-badge,.preview-close{background:linear-gradient(135deg,#f1f4e918,transparent 65%),#111c29dc;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
}
.collection-bottom{margin-block:40px 64px}
.site-footer{padding-block:32px 40px}
.state-panel{min-height:330px;padding:40px 24px;border:1px solid #8b9ea52b;border-radius:var(--card-radius);background:#0c141c}
.state-illustration{width:160px;height:96px;margin-bottom:16px;color:#c8bea5}
.state-panel p{font-size:18px;margin-block:0 8px;color:#ecece7}
.state-panel small{max-width:46ch;line-height:1.9;color:#b7c2cb}
.reset-button{margin-top:24px;padding-inline:20px;background:#d2c3a415;min-height:44px}
.reset-button:hover{background:#d2c3a425;border-color:#decda4}
.catalog[data-state="loading"]{grid-template-columns:minmax(0,800px);justify-content:center}
.catalog-skeleton{display:grid;grid-template-columns:1fr 1fr;min-height:288px;border:1px solid #8c9ea528;border-radius:var(--card-radius);overflow:hidden;background:#0d141b;pointer-events:none}
.skeleton-art{background:#17222d;min-height:240px}
.skeleton-content{padding:32px 24px;display:flex;flex-direction:column;gap:16px}
.skeleton-line{display:block;height:12px;border-radius:5px;background:#23303a;width:88%}
.skeleton-line.title{height:23px;width:66%;margin-bottom:8px}
.skeleton-line.short{width:56%}
.skeleton-line.tag-line{width:38%;height:22px;margin-top:12px}
.skeleton-line.action{width:30%;margin-top:auto}
.skeleton-art,.skeleton-line{animation:catalog-breathe 1.5s ease-in-out infinite alternate}
@keyframes catalog-breathe{from{opacity:.45}to{opacity:.8}}
@media(max-width:950px){.page-shell{padding-inline:32px}.hero{column-gap:24px;min-height:408px}.catalog{gap:24px}.collection-toolbar{gap:16px}.catalog[data-count="2"]{gap:24px}}
@media(max-width:680px){
 .page-shell{padding-inline:24px}.site-header{height:80px}.hero{min-height:0;padding-block:40px 8px;gap:8px}.hero-description{margin-block:24px}.works-section{padding-top:40px}.section-heading{gap:16px}
 .collection-toolbar{margin-block:24px;gap:16px;padding-bottom:24px}.filters{gap:4px}.filter{padding-inline:10px}.search-wrap{width:100%}
 .catalog,.catalog[data-count="1"],.catalog[data-count="2"]{grid-template-columns:minmax(0,1fr);gap:24px}
 .catalog[data-count="1"] .work-card{display:flex}.catalog[data-count="1"] .card-art{min-height:0;aspect-ratio:16/10}.card-content{padding:24px}.catalog-skeleton{grid-template-columns:1fr}.skeleton-art{min-height:0;aspect-ratio:16/10}.skeleton-content{min-height:240px}
 .collection-bottom{margin-block:32px 48px}.state-panel{padding:32px 24px}.site-footer{padding-block:24px 32px}
}
@media(max-width:360px){.page-shell{padding-inline:18px}.filter{padding-inline:8px;font-size:12px}}
@media(prefers-reduced-motion:reduce){.skeleton-art,.skeleton-line{animation:none;opacity:.65}.work-card:hover,.work-card:active{transform:none}}
@media(prefers-reduced-transparency:reduce){.search-wrap,.card-badge,.preview-close{backdrop-filter:none;-webkit-backdrop-filter:none;background:#17212b}}

/* Font-independent decorative arrows: text labels remain on their links. */
.direction-icon{position:relative;display:inline-block;flex:none;width:20px;height:20px;color:inherit;vertical-align:middle}
.direction-icon::before,.direction-icon::after{content:"";position:absolute;display:block;box-sizing:border-box}
.direction-up-right::before{width:12px;height:1.5px;background:currentColor;left:3px;top:10px;transform:rotate(-45deg)}
.direction-up-right::after{width:9px;height:9px;top:4px;right:4px;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor}
.direction-down::before{width:1.5px;height:13px;background:currentColor;left:9px;top:3px}
.direction-down::after{width:9px;height:9px;left:5px;bottom:4px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg)}
.explore-button .direction-icon{color:inherit}

/* Collection radios: every category has a surface, with a separate checked state.
   The legacy moving plate stays decorative; checked labels never wait for it. */
.filters{gap:8px;padding:4px 0;max-width:100%}
.filters .filter-plate{display:none}
.filters .filter{
 display:inline-flex;align-items:center;justify-content:center;position:relative;
 min-height:44px;min-width:44px;padding:11px 17px;border:1px solid #8b9da83d;
 border-radius:999px;background:linear-gradient(145deg,#b8c7d008,#b8c7d002),#101820;
 color:#c3cdd3;font-size:13px;font-weight:500;line-height:20px;letter-spacing:.2px;
 box-shadow:inset 0 1px 0 #e4edf005;
 transition:background-color 250ms ease,border-color 250ms ease,color 250ms ease,box-shadow 250ms ease,transform 120ms ease;
}
.filters .filter::after{
 content:"";position:absolute;left:50%;bottom:5px;width:12px;height:2px;
 border-radius:2px;background:currentColor;opacity:0;transform:translateX(-50%);
 transition:opacity 250ms ease;
}
.filters .filter.active,.filters .filter[aria-checked="true"]{
 background:linear-gradient(140deg,#e4d7b8,#ccbd9b);border-color:#e2d1aa;
 color:#172027;font-weight:600;box-shadow:inset 0 1px 0 #fff7e94d,0 2px 8px #0003;
}
.filters .filter.active::after,.filters .filter[aria-checked="true"]::after{opacity:.65}
.filters .filter span{
 display:inline-flex;align-items:center;justify-content:center;min-width:18px;min-height:18px;
 margin-left:6px;padding-inline:5px;border-radius:999px;background:#d1dce810;
 color:inherit;font-size:10px;line-height:18px;letter-spacing:0;opacity:.9;
}
.filters .filter.active span,.filters .filter[aria-checked="true"] span{background:#18212b14}
@media(hover:hover) and (pointer:fine){
 .filters .filter:not(.active):not([aria-checked="true"]):hover{
  background:#1b2832;border-color:#b9c3c98c;color:#edf0ec;
  box-shadow:inset 0 1px 0 #e4edf00d,0 3px 10px #0002;
 }
 .filters .filter.active:hover,.filters .filter[aria-checked="true"]:hover{
  background:linear-gradient(140deg,#eee1c2,#d6c7a5);border-color:#f0dfb8;color:#172027;
 }
}
.filters .filter:active{transform:translateY(1px)}
.filters .filter:focus-visible{
 outline:2px solid #f1dfb7;outline-offset:3px;
 box-shadow:0 0 0 1px #03060a,inset 0 1px 0 #fff2;
}
@media(max-width:680px){.filters{gap:7px}.filters .filter{padding-inline:14px}}
@media(max-width:480px){
 .filters{gap:6px;width:100%}.filters .filter{padding-inline:10px;font-size:12px;letter-spacing:0}
 .filters .filter span{margin-left:4px;min-width:16px;padding-inline:4px}
}
@media(prefers-reduced-motion:reduce){
 .filters .filter,.filters .filter::after{transition:none!important}
 .filters .filter:active{transform:none}
}
@media(forced-colors:active){
 .filters .filter{background:ButtonFace;color:ButtonText;border-color:ButtonText;box-shadow:none}
 .filters .filter.active,.filters .filter[aria-checked="true"]{background:Highlight;color:HighlightText;border-color:Highlight}
 .filters .filter:focus-visible{outline-color:Highlight;box-shadow:none}
}