/* Shared catalog listing UI for /downloads/ and /marketplace/. */
.catalog-page{
  --catalog-bg:#0d1428;
  --catalog-surface:#121b33;
  --catalog-surface-2:#17213d;
  --catalog-border:rgba(148,163,184,.18);
  --catalog-text:#eef2ff;
  --catalog-muted:#9aa7c2;
  --catalog-accent:#7c6df2;
  --catalog-accent-2:#4f8cff;
  --catalog-success:#22c55e;
  --catalog-warning:#f59e0b;
  --catalog-danger:#fb7185;
  --catalog-shadow:0 16px 45px rgba(2,6,23,.18);
  background:var(--catalog-bg);
  color:var(--catalog-text);
  min-height:calc(100vh - 64px);
}
html[data-theme="light"] .catalog-page{
  --catalog-bg:#f7f5ff;
  --catalog-surface:#fff;
  --catalog-surface-2:#faf8ff;
  --catalog-border:rgba(109,40,217,.13);
  --catalog-text:#211a36;
  --catalog-muted:#746b87;
  --catalog-accent:#6d28d9;
  --catalog-accent-2:#5f7df2;
  --catalog-shadow:0 14px 35px rgba(70,65,170,.075);
}
.catalog-page{
  padding-top:82px;
}
.catalog-page *{box-sizing:border-box}
.catalog-page a{text-decoration:none}
.catalog-page .container{width:min(1240px,calc(100% - 32px));margin-inline:auto}

.catalog-hero{
  position:relative;
  overflow:hidden;
  padding:38px 0 34px;
  border-bottom:1px solid var(--catalog-border);
  background:
    radial-gradient(circle at 12% 10%,rgba(124,109,242,.18),transparent 31%),
    radial-gradient(circle at 88% 0%,rgba(79,140,255,.12),transparent 28%),
    var(--catalog-bg);
}
.catalog-hero::after{
  content:"";
  position:absolute;
  inset:auto 0 0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(124,109,242,.55),transparent);
}
.catalog-hero-inner{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,520px);
  gap:28px;
  align-items:end;
}
.catalog-kicker{
  display:inline-flex;
  align-items:center;
  gap:7px;
  margin-bottom:10px;
  padding:5px 10px;
  border:1px solid var(--catalog-border);
  border-radius:999px;
  color:var(--catalog-accent);
  background:rgba(124,109,242,.08);
  font-size:.74rem;
  font-weight:800;
}
.catalog-hero h1{
  margin:0;
  color:var(--catalog-text);
  font-size:clamp(1.55rem,3vw,2.35rem);
  line-height:1.35;
  font-weight:950;
  letter-spacing:-.02em;
}
.catalog-hero p{
  max-width:650px;
  margin:8px 0 0;
  color:var(--catalog-muted);
  font-size:.9rem;
  line-height:1.9;
}
.catalog-search{
  display:flex;
  align-items:center;
  gap:7px;
  padding:6px;
  border:1px solid var(--catalog-border);
  border-radius:14px;
  background:var(--catalog-surface);
  box-shadow:var(--catalog-shadow);
}
.catalog-search:focus-within{
  border-color:rgba(124,109,242,.65);
  box-shadow:0 0 0 3px rgba(124,109,242,.1),var(--catalog-shadow);
}
.catalog-search-field{
  position:relative;
  flex:1;
  min-width:0;
}
.catalog-search-field i{
  position:absolute;
  inset-inline-start:13px;
  top:50%;
  transform:translateY(-50%);
  color:var(--catalog-muted);
  font-size:.82rem;
}
.catalog-search input{
  width:100%;
  height:40px;
  padding:7px 38px 7px 10px;
  border:0;
  outline:0;
  background:transparent;
  color:var(--catalog-text);
  font:inherit;
  font-size:.82rem;
}
.catalog-search input::placeholder{color:var(--catalog-muted)}
.catalog-search button{
  height:38px;
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:0 15px;
  border:0;
  border-radius:10px;
  background:linear-gradient(135deg,var(--catalog-accent),var(--catalog-accent-2));
  color:#fff;
  font:inherit;
  font-size:.76rem;
  font-weight:850;
  cursor:pointer;
}

.catalog-content{padding:24px 0 60px}
.catalog-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) 286px;
  grid-template-areas:"products filters";
  gap:20px;
  align-items:start;
  direction:ltr;
}
.catalog-filters{
  grid-area:filters;
  position:sticky;
  top:84px;
  z-index:10;
}
.catalog-products{grid-area:products;min-width:0}
[dir="rtl"] .catalog-filters,
[dir="rtl"] .catalog-products{direction:rtl}
[dir="ltr"] .catalog-filters,
[dir="ltr"] .catalog-products{direction:ltr}
.catalog-filter-card{
  overflow:visible;
  border:1px solid var(--catalog-border);
  border-radius:16px;
  background:var(--catalog-surface);
  box-shadow:0 8px 24px rgba(2,6,23,.06);
}
.catalog-filter-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:13px 14px;
  border-bottom:1px solid var(--catalog-border);
}
.catalog-filter-head strong{
  display:flex;
  align-items:center;
  gap:7px;
  color:var(--catalog-text);
  font-size:.84rem;
}
.catalog-filter-count{
  min-width:22px;
  height:22px;
  display:inline-grid;
  place-items:center;
  padding:0 6px;
  border-radius:999px;
  background:rgba(124,109,242,.12);
  color:var(--catalog-accent);
  font-size:.65rem;
  font-weight:900;
}
.catalog-filter-close{
  display:none;
  width:32px;
  height:32px;
  place-items:center;
  border:1px solid var(--catalog-border);
  border-radius:9px;
  background:var(--catalog-surface-2);
  color:var(--catalog-text);
  cursor:pointer;
}
.catalog-filter-form{padding:0 14px 14px}
.catalog-filter-section{
  border-bottom:1px solid var(--catalog-border);
}
.catalog-filter-section:last-of-type{border-bottom:0}
.catalog-filter-section summary{
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:13px 0;
  color:var(--catalog-text);
  font-size:.75rem;
  font-weight:850;
  cursor:pointer;
}
.catalog-filter-section summary::-webkit-details-marker{display:none}
.catalog-filter-section summary::after{
  content:"\f107";
  font-family:"Font Awesome 5 Free","Font Awesome 6 Free";
  font-weight:900;
  color:var(--catalog-muted);
  transition:transform .18s ease;
}
.catalog-filter-section[open] summary::after{transform:rotate(180deg)}
.catalog-filter-body{padding:0 0 13px}
.catalog-select{
  width:100%;
  height:38px;
  padding:6px 10px;
  border:1px solid var(--catalog-border);
  border-radius:10px;
  outline:0;
  background:var(--catalog-surface-2);
  color:var(--catalog-text);
  font:inherit;
  font-size:.72rem;
}
.catalog-select:focus{border-color:var(--catalog-accent)}
.catalog-radio-list{display:grid;gap:6px}
.catalog-radio{
  min-height:34px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:6px 8px;
  border:1px solid transparent;
  border-radius:9px;
  color:var(--catalog-muted);
  font-size:.71rem;
  cursor:pointer;
}
.catalog-radio:hover{background:var(--catalog-surface-2);color:var(--catalog-text)}
.catalog-radio input{accent-color:var(--catalog-accent)}
.catalog-radio span{display:flex;align-items:center;gap:7px}
.catalog-radio:has(input:checked){
  color:var(--catalog-text);
  border-color:rgba(124,109,242,.28);
  background:rgba(124,109,242,.07);
}


.catalog-category-mega{position:relative}
.catalog-category-trigger{
  width:100%;
  min-height:40px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:7px 10px;
  border:1px solid var(--catalog-border);
  border-radius:10px;
  background:var(--catalog-surface-2);
  color:var(--catalog-text);
  font:inherit;
  font-size:.71rem;
  font-weight:800;
  cursor:pointer;
}
.catalog-category-trigger:hover,
.catalog-category-mega.is-open .catalog-category-trigger{
  border-color:rgba(124,109,242,.55);
  box-shadow:0 0 0 3px rgba(124,109,242,.07);
}
.catalog-category-trigger span{
  display:flex;
  align-items:center;
  gap:7px;
  min-width:0;
}
.catalog-category-trigger strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.catalog-category-trigger>i{color:var(--catalog-muted);transition:transform .18s ease}
.catalog-category-mega.is-open .catalog-category-trigger>i{transform:rotate(180deg)}
.catalog-category-panel{
  position:absolute;
  z-index:80;
  top:calc(100% + 7px);
  right:0;
  width:min(340px,calc(100vw - 40px));
  min-height:0;
  max-height:460px;
  display:none;
  grid-template-columns:1fr;
  grid-template-areas:"roots" "children";
  overflow:hidden;
  border:1px solid var(--catalog-border);
  border-radius:14px;
  background:var(--catalog-surface);
  box-shadow:0 22px 70px rgba(2,6,23,.28);
  direction:ltr;
}
.catalog-category-mega.is-open .catalog-category-panel{display:grid}
.catalog-category-roots{
  grid-area:roots;
  overflow:auto;
  padding:8px;
  border-left:0;
  background:var(--catalog-surface-2);
  direction:rtl;
}
.catalog-category-root{
  width:100%;
  min-height:38px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:7px;
  padding:7px 9px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:var(--catalog-muted);
  font:inherit;
  font-size:.68rem;
  font-weight:800;
  text-align:right;
  cursor:pointer;
}
.catalog-category-root:hover,
.catalog-category-root.is-active{
  background:rgba(124,109,242,.1);
  color:var(--catalog-accent);
}
.catalog-category-root i{font-size:.58rem}
.catalog-category-children{
  grid-area:children;
  display:none;
  overflow:auto;
  padding:12px;
  border-top:1px solid var(--catalog-border);
  direction:rtl;
}
.catalog-category-children.has-branch{display:block}
.catalog-category-empty{
  min-height:240px;
  display:grid;
  place-items:center;
  color:var(--catalog-muted);
  font-size:.7rem;
  text-align:center;
}
.catalog-category-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:11px;
  padding-bottom:9px;
  border-bottom:1px solid var(--catalog-border);
}
.catalog-category-heading strong{color:var(--catalog-text);font-size:.75rem}
.catalog-category-heading button{
  border:0;
  background:transparent;
  color:var(--catalog-accent);
  font:inherit;
  font-size:.64rem;
  font-weight:850;
  cursor:pointer;
}
.catalog-category-groups{
  display:grid;
  grid-template-columns:1fr;
  gap:7px;
}
.catalog-category-group{min-width:0}
.catalog-category-group-title{
  width:100%;
  display:flex;
  align-items:center;
  gap:6px;
  margin-bottom:5px;
  padding:3px 0;
  border:0;
  background:transparent;
  color:var(--catalog-text);
  font:inherit;
  font-size:.69rem;
  font-weight:900;
  text-align:right;
  cursor:pointer;
}
.catalog-category-group-title::before{
  content:"";
  width:3px;
  height:13px;
  border-radius:999px;
  background:var(--catalog-accent);
}
.catalog-category-link{
  width:100%;
  display:block;
  padding:4px 9px 4px 2px;
  border:0;
  background:transparent;
  color:var(--catalog-muted);
  font:inherit;
  font-size:.63rem;
  line-height:1.65;
  text-align:right;
  cursor:pointer;
}
.catalog-category-link:hover{color:var(--catalog-accent)}
.catalog-category-link[data-depth="2"]{padding-right:18px;font-size:.6rem}
.catalog-category-link[data-depth="3"]{padding-right:27px;font-size:.58rem}
.catalog-category-data{display:none!important}

.catalog-free-row{
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:13px;
  padding:7px 8px;
  border:1px solid var(--catalog-border);
  border-radius:10px;
  background:var(--catalog-surface-2);
}
.catalog-free-label{
  display:flex;
  align-items:center;
  gap:7px;
  color:var(--catalog-text);
  font-size:.72rem;
  font-weight:800;
}
.catalog-free-label i{color:var(--catalog-success)}
.catalog-switch{
  position:relative;
  width:38px;
  height:22px;
  flex:0 0 auto;
  cursor:pointer;
}
.catalog-switch input{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}
.catalog-switch-track{
  position:absolute;
  inset:0;
  border:1px solid var(--catalog-border);
  border-radius:999px;
  background:#9ca3af;
  transition:background .18s ease,border-color .18s ease;
}
.catalog-switch-track::after{
  content:"";
  position:absolute;
  top:2px;
  left:2px;
  width:16px;
  height:16px;
  border-radius:50%;
  background:#fff;
  box-shadow:0 1px 4px rgba(2,6,23,.28);
  transition:transform .18s ease;
}
.catalog-switch input:checked + .catalog-switch-track{
  border-color:var(--catalog-accent);
  background:var(--catalog-accent);
}
.catalog-switch input:checked + .catalog-switch-track::after{transform:translateX(16px)}
.catalog-price-range{
  display:grid;
  gap:12px;
  transition:opacity .18s ease;
}
.catalog-price-range.is-disabled{opacity:.38}
.catalog-price-values{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
}
.catalog-price-field{
  display:grid;
  gap:4px;
  min-width:0;
}
.catalog-price-field>span{
  color:var(--catalog-muted);
  font-size:.6rem;
  font-weight:750;
}
.catalog-price-box{
  min-width:0;
  height:38px;
  display:flex;
  align-items:center;
  gap:4px;
  padding:0 8px;
  border:1px solid var(--catalog-border);
  border-radius:9px;
  background:var(--catalog-surface-2);
}
.catalog-price-box:focus-within{border-color:var(--catalog-accent)}
.catalog-price-box input{
  min-width:0;
  width:100%;
  border:0;
  outline:0;
  background:transparent;
  color:var(--catalog-text);
  font:inherit;
  font-size:.68rem;
  font-weight:800;
  direction:ltr;
  text-align:center;
}
.catalog-price-box input::-webkit-outer-spin-button,
.catalog-price-box input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.catalog-price-box input[type=number]{-moz-appearance:textfield}
.catalog-price-box small{
  flex:0 0 auto;
  color:var(--catalog-muted);
  font-size:.52rem;
}
.catalog-price-slider{
  position:relative;
  height:34px;
  margin:2px 4px 0;
  direction:ltr;
  touch-action:none;
  user-select:none;
}
.catalog-price-slider .catalog-range-rail,
.catalog-price-slider .catalog-range-fill{
  position:absolute;
  top:15px;
  left:0;
  height:4px;
  border-radius:999px;
}
.catalog-price-slider .catalog-range-rail{
  left:10px;
  right:10px;
  background:var(--catalog-border);
}
.catalog-price-slider .catalog-range-fill{
  width:100%;
  background:linear-gradient(90deg,var(--catalog-accent),var(--catalog-accent-2));
  box-shadow:0 0 0 1px rgba(124,109,242,.08);
}
.catalog-price-handle{
  position:absolute;
  z-index:4;
  top:7px;
  width:20px;
  height:20px;
  transform:translateX(-50%);

  padding:0;
  border:3px solid var(--catalog-accent);
  border-radius:50%;
  background:var(--catalog-surface);
  box-shadow:0 2px 8px rgba(2,6,23,.22);
  cursor:grab;
  touch-action:none;
  transition:box-shadow .15s ease,scale .15s ease,opacity .15s ease;
}
.catalog-price-handle[data-price-max-handle]{
  z-index:5;
  border-color:var(--catalog-accent-2);
}
.catalog-price-handle:hover,
.catalog-price-handle:focus-visible{
  outline:none;
  scale:1.08;
  box-shadow:0 0 0 4px rgba(124,109,242,.10),0 2px 8px rgba(2,6,23,.22);
}
.catalog-price-handle[data-price-max-handle]:hover,
.catalog-price-handle[data-price-max-handle]:focus-visible{
  box-shadow:0 0 0 4px rgba(79,140,255,.10),0 2px 8px rgba(2,6,23,.22);
}
.catalog-price-handle.is-dragging{cursor:grabbing;scale:1.08}
.catalog-price-range.is-disabled .catalog-price-handle{
  pointer-events:none;
  opacity:.45;
}
.catalog-price-scale{
  display:flex;
  justify-content:space-between;
  direction:ltr;
  color:var(--catalog-muted);
  font-size:.54rem;
}
.catalog-filter-actions{
  display:grid;
  grid-template-columns:1fr auto;
  gap:7px;
  padding-top:14px;
}
.catalog-apply,
.catalog-reset{
  min-height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  border-radius:10px;
  font:inherit;
  font-size:.72rem;
  font-weight:850;
}
.catalog-apply{
  border:0;
  background:linear-gradient(135deg,var(--catalog-accent),var(--catalog-accent-2));
  color:#fff;
  cursor:pointer;
}
.catalog-reset{
  padding-inline:12px;
  border:1px solid var(--catalog-border);
  background:var(--catalog-surface-2);
  color:var(--catalog-muted);
}

.catalog-toolbar{
  min-height:54px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:12px;
  padding:8px 10px;
  border:1px solid var(--catalog-border);
  border-radius:13px;
  background:var(--catalog-surface);
}
.catalog-toolbar-main{display:flex;align-items:center;gap:8px;min-width:0}
.catalog-result-count{
  color:var(--catalog-muted);
  font-size:.71rem;
  white-space:nowrap;
}
.catalog-result-count strong{color:var(--catalog-text);font-size:.76rem}
.catalog-filter-trigger{
  display:none;
  min-height:36px;
  align-items:center;
  gap:6px;
  padding:0 10px;
  border:1px solid var(--catalog-border);
  border-radius:9px;
  background:var(--catalog-surface-2);
  color:var(--catalog-text);
  font:inherit;
  font-size:.7rem;
  font-weight:800;
  cursor:pointer;
}
.catalog-sort-form{display:flex;align-items:center;gap:7px}
.catalog-sort-form label{color:var(--catalog-muted);font-size:.7rem;white-space:nowrap}
.catalog-sort{
  height:36px;
  min-width:170px;
  padding:5px 9px;
  border:1px solid var(--catalog-border);
  border-radius:9px;
  outline:0;
  background:var(--catalog-surface-2);
  color:var(--catalog-text);
  font:inherit;
  font-size:.7rem;
}
.catalog-sort:focus{border-color:var(--catalog-accent)}

.catalog-active-filters{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
  margin:0 0 12px;
}
.catalog-chip{
  display:inline-flex;
  align-items:center;
  gap:5px;
  min-height:27px;
  padding:3px 8px;
  border:1px solid var(--catalog-border);
  border-radius:999px;
  background:var(--catalog-surface);
  color:var(--catalog-muted);
  font-size:.65rem;
}
.catalog-chip i{color:var(--catalog-accent);font-size:.6rem}
.catalog-clear{
  color:var(--catalog-danger);
  border-color:rgba(251,113,133,.2);
  background:rgba(251,113,133,.05);
}

.catalog-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:13px;
}
.catalog-card{
  position:relative;
  min-width:0;
  overflow:hidden;
  border:1px solid var(--catalog-border);
  border-radius:16px;
  background:var(--catalog-surface);
  box-shadow:0 6px 18px rgba(2,6,23,.04);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.catalog-card:hover{
  transform:translateY(-2px);
  border-color:rgba(124,109,242,.5);
  box-shadow:var(--catalog-shadow);
}
.catalog-card-media{
  position:relative;
  display:block;
  aspect-ratio:16/10;
  overflow:hidden;
  background:linear-gradient(135deg,var(--catalog-surface-2),rgba(124,109,242,.12));
}
.catalog-card-media img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:0;
  transition:opacity .45s ease,transform .28s ease;
}
.catalog-card-media img.active,
.catalog-card-media img:first-child{opacity:1}
.catalog-card:hover .catalog-card-media img.active{transform:scale(1.018)}
.catalog-no-image{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  color:var(--catalog-muted);
  font-size:1.75rem;
  font-weight:950;
  letter-spacing:.08em;
}
.catalog-card-badge{
  position:absolute;
  z-index:3;
  top:10px;
  inset-inline-start:10px;
  display:inline-flex;
  align-items:center;
  gap:5px;
  min-height:25px;
  padding:3px 8px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:999px;
  background:rgba(12,18,34,.72);
  color:#fff;
  backdrop-filter:blur(8px);
  font-size:.62rem;
  font-weight:850;
}
.catalog-card-badge.badge-new{background:rgba(101,88,223,.88)}
.catalog-card-badge.badge-popular,
.catalog-card-badge.badge-hot{background:rgba(239,68,68,.86)}
.catalog-card-badge.badge-featured{background:rgba(245,158,11,.88)}
.catalog-card-badge.badge-discount{background:rgba(34,197,94,.88)}
.catalog-card-price{
  position:absolute;
  z-index:3;
  top:10px;
  inset-inline-end:10px;
  min-height:25px;
  display:inline-flex;
  align-items:center;
  padding:3px 8px;
  border-radius:999px;
  background:rgba(12,18,34,.72);
  color:#fff;
  backdrop-filter:blur(8px);
  font-size:.61rem;
  font-weight:850;
}
.catalog-fav{
  position:absolute;
  z-index:5;
  top:10px;
  inset-inline-end:10px;
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid rgba(255,255,255,.3);
  border-radius:50%;
  background:rgba(12,18,34,.62);
  color:#fff;
  backdrop-filter:blur(8px);
  cursor:pointer;
  transition:transform .15s ease,background .15s ease,color .15s ease;
}
.catalog-fav:hover{transform:scale(1.05)}
.catalog-fav.active{background:#fff;color:#ef476f}
.catalog-card-body{padding:13px}
.catalog-card-category{
  display:flex;
  align-items:center;
  gap:5px;
  min-height:18px;
  margin-bottom:4px;
  color:var(--catalog-accent);
  font-size:.62rem;
  font-weight:800;
}
.catalog-card-title{
  display:block;
  margin:0;
  color:var(--catalog-text);
  font-size:.86rem;
  font-weight:900;
  line-height:1.6;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.catalog-card-desc{
  min-height:39px;
  margin:4px 0 8px;
  color:var(--catalog-muted);
  font-size:.67rem;
  line-height:1.75;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.catalog-card-meta{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
  min-height:25px;
  margin-bottom:9px;
}
.catalog-mini-chip{
  display:inline-flex;
  align-items:center;
  gap:4px;
  min-height:22px;
  padding:2px 6px;
  border:1px solid var(--catalog-border);
  border-radius:7px;
  background:var(--catalog-surface-2);
  color:var(--catalog-muted);
  font-size:.58rem;
}
.catalog-rating{
  display:flex;
  align-items:center;
  gap:4px;
  color:var(--catalog-muted);
  font-size:.62rem;
}
.catalog-rating i{color:#fbbf24;font-size:.62rem}
.catalog-rating .off{color:var(--catalog-border)}
.catalog-card-foot{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:8px;
  padding-top:9px;
  border-top:1px solid var(--catalog-border);
}
.catalog-price{
  display:grid;
  gap:1px;
  color:var(--catalog-muted);
  font-size:.59rem;
}
.catalog-price strong{color:var(--catalog-text);font-size:.76rem}
.catalog-card-actions{display:flex;align-items:center;gap:5px}
.catalog-card-action{
  min-height:31px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:4px 8px;
  border:1px solid var(--catalog-border);
  border-radius:8px;
  background:var(--catalog-surface-2);
  color:var(--catalog-text);
  font-size:.62rem;
  font-weight:800;
}
.catalog-card-action.primary{
  border-color:rgba(124,109,242,.26);
  background:rgba(124,109,242,.09);
  color:var(--catalog-accent);
}

.catalog-infinite-sentinel{
  grid-column:1/-1;
  min-height:72px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  margin-top:14px;
  color:var(--catalog-muted);
  font-size:.68rem;
}
.catalog-infinite-spinner{
  width:18px;
  height:18px;
  border:2px solid var(--catalog-border);
  border-top-color:var(--catalog-accent);
  border-radius:50%;
  animation:catalogSpin .75s linear infinite;
}
.catalog-infinite-sentinel.is-error{color:var(--catalog-danger)}
@keyframes catalogSpin{to{transform:rotate(360deg)}}

.catalog-empty{
  grid-column:1/-1;
  min-height:300px;
  display:grid;
  place-items:center;
  padding:30px;
  border:1px dashed var(--catalog-border);
  border-radius:16px;
  background:var(--catalog-surface);
  text-align:center;
}
.catalog-empty i{display:block;margin-bottom:10px;color:var(--catalog-accent);font-size:2rem}
.catalog-empty h3{margin:0;color:var(--catalog-text);font-size:.95rem}
.catalog-empty p{margin:6px 0 14px;color:var(--catalog-muted);font-size:.72rem}
.catalog-empty a{
  display:inline-flex;
  min-height:34px;
  align-items:center;
  padding:4px 10px;
  border-radius:9px;
  background:rgba(124,109,242,.1);
  color:var(--catalog-accent);
  font-size:.7rem;
  font-weight:800;
}
.catalog-filter-overlay{display:none}

@media(max-width:1080px){
  .catalog-layout{grid-template-columns:minmax(0,1fr) 250px}
  .catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px){
  .catalog-page{padding-top:70px}
  .catalog-hero{padding:30px 0 26px}
  .catalog-category-panel{
    position:static;
    width:100%;
    min-height:0;
    max-height:390px;
    margin-top:7px;
    grid-template-columns:1fr;
    grid-template-areas:"roots" "children";
    box-shadow:none;
  }
  .catalog-category-roots{
    display:flex;
    gap:5px;
    overflow:auto;
    border-left:0;
    border-bottom:1px solid var(--catalog-border);
    direction:rtl;
  }
  .catalog-category-root{
    width:auto;
    min-width:max-content;
    min-height:34px;
  }
  .catalog-category-children{max-height:260px}

  .catalog-hero-inner{grid-template-columns:1fr;gap:17px}
  .catalog-layout{display:block}
  .catalog-filters{
    position:fixed;
    z-index:1002;
    inset:auto 0 0;
    max-height:88vh;
    padding:10px 12px 12px;
    transform:translateY(105%);
    transition:transform .24s ease;
    overflow:auto;
    overscroll-behavior:contain;
  }
  .catalog-filters.is-open{transform:translateY(0)}
  .catalog-filter-card{border-radius:18px 18px 12px 12px;box-shadow:0 -20px 60px rgba(2,6,23,.3)}
  .catalog-filter-close{display:grid}
  .catalog-filter-overlay{
    display:block;
    position:fixed;
    z-index:1001;
    inset:0;
    background:rgba(2,6,23,.58);
    opacity:0;
    visibility:hidden;
    transition:opacity .2s ease,visibility .2s ease;
    backdrop-filter:blur(2px);
  }
  .catalog-filter-overlay.is-open{opacity:1;visibility:visible}
  body.catalog-filter-open{overflow:hidden}
  .catalog-filter-trigger{display:inline-flex}
}
@media(max-width:620px){
  .catalog-category-groups{grid-template-columns:1fr}

  .catalog-page .container{width:min(100% - 20px,1240px)}
  .catalog-hero h1{font-size:1.4rem}
  .catalog-hero p{font-size:.78rem}
  .catalog-search{border-radius:12px}
  .catalog-search button{width:40px;padding:0;justify-content:center}
  .catalog-search button span{display:none}
  .catalog-toolbar{align-items:stretch;flex-direction:column}
  .catalog-toolbar-main{justify-content:space-between}
  .catalog-sort-form{width:100%}
  .catalog-sort{flex:1;min-width:0}
  .catalog-grid{grid-template-columns:1fr}
  .catalog-card-media{aspect-ratio:16/9}
  .catalog-content{padding-top:14px}
}

/* 2026-09-25: compact catalog mega menu, mirroring the navbar interaction. */
/* Search focus: one precise ring that follows the rounded search container. */
.catalog-search{
  overflow:hidden;
  border-radius:13px;
}
.catalog-search:focus-within{
  outline:none;
  border-color:rgba(101,88,223,.72);
  box-shadow:var(--catalog-shadow),inset 0 0 0 1px rgba(101,88,223,.38);
}
.catalog-search input:focus,
.catalog-search input:focus-visible{
  outline:none!important;
  box-shadow:none!important;
}
.catalog-search button:focus-visible{
  outline:2px solid rgba(255,255,255,.82);
  outline-offset:-3px;
}

/* Same cascading-panel model as the main NAV mega menu, only denser. */
.catalog-category-panel{
  position:absolute!important;
  z-index:90;
  top:calc(100% + 6px)!important;
  inset-inline-end:0!important;
  inset-inline-start:auto!important;
  width:max-content!important;
  min-width:156px;
  max-width:min(540px,calc(100vw - 40px))!important;
  max-height:330px!important;
  display:none!important;
  grid-template-columns:none!important;
  grid-template-areas:none!important;
  align-items:stretch;
  gap:0;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  padding:0!important;
  border:1px solid var(--catalog-border)!important;
  border-radius:12px!important;
  background:var(--catalog-surface)!important;
  box-shadow:0 18px 46px rgba(2,6,23,.18)!important;
  direction:inherit!important;
  overscroll-behavior:contain;
  scrollbar-width:thin;
}
.catalog-category-mega.is-open .catalog-category-panel{
  display:flex!important;
}
.catalog-filter-mega-panel{
  width:168px;
  min-width:168px;
  max-height:328px;
  display:none;
  flex-direction:column;
  padding:9px 8px;
  overflow-y:auto;
  background:var(--catalog-surface);
  border-inline-start:1px solid var(--catalog-border);
  scrollbar-width:thin;
}
.catalog-filter-mega-panel:first-child{
  border-inline-start:0;
}
.catalog-filter-mega-root{
  width:156px;
  min-width:156px;
  background:var(--catalog-surface-2);
}
.catalog-filter-mega-panel.is-active{
  display:flex;
}
.catalog-filter-mega-heading{
  min-height:27px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:6px;
  margin-bottom:5px;
  padding:0 4px 6px;
  border-bottom:1px solid var(--catalog-border);
}
.catalog-filter-mega-heading strong{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--catalog-text);
  font-size:.62rem;
  font-weight:900;
}
.catalog-filter-mega-choose{
  flex:0 0 auto;
  padding:2px 0;
  border:0;
  background:transparent;
  color:var(--catalog-accent);
  font:inherit;
  font-size:.52rem;
  font-weight:850;
  cursor:pointer;
}
.catalog-filter-mega-choose:hover{
  text-decoration:underline;
}
.catalog-filter-mega-list{
  display:grid;
  gap:2px;
}
.catalog-filter-mega-item{
  min-width:0;
}
.catalog-filter-mega-link{
  width:100%;
  min-height:31px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:6px;
  padding:5px 7px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:var(--catalog-muted);
  font:inherit;
  font-size:.62rem;
  font-weight:720;
  text-align:start;
  cursor:pointer;
  transition:background .16s ease,color .16s ease;
}
.catalog-filter-mega-link>span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.catalog-filter-mega-arrow{
  flex:0 0 auto;
  font-size:.48rem;
  opacity:.42;
  transition:opacity .16s ease;
}
.catalog-filter-mega-item.has-children .catalog-filter-mega-link{
  color:var(--catalog-text);
  font-weight:790;
}
.catalog-filter-mega-link:hover,
.catalog-filter-mega-item.is-hovered>.catalog-filter-mega-link{
  color:var(--catalog-text);
  background:color-mix(in srgb,var(--catalog-accent) 8%,transparent);
}
.catalog-filter-mega-item.is-hovered .catalog-filter-mega-arrow{
  opacity:.8;
}
.catalog-filter-mega-item.is-active-path>.catalog-filter-mega-link{
  color:var(--catalog-accent);
  background:color-mix(in srgb,var(--catalog-accent) 10%,transparent);
}
.catalog-filter-mega-view-all{
  width:100%;
  min-height:30px;
  margin-top:auto;
  padding:7px 6px 2px;
  display:flex;
  align-items:center;
  gap:6px;
  border:0;
  border-top:1px solid var(--catalog-border);
  background:transparent;
  color:var(--catalog-accent);
  font:inherit;
  font-size:.56rem;
  font-weight:850;
  text-align:start;
  cursor:pointer;
}
.catalog-filter-mega-view-all i{
  font-size:.58rem;
}

/* Retire the old filter-specific root/children renderer; JS now builds NAV-like flat panels. */
.catalog-category-roots,
.catalog-category-children{
  display:none!important;
}

/* Keyboard focus without adding the oversized browser ring seen before. */
.catalog-category-trigger:focus-visible,
.catalog-filter-mega-link:focus-visible,
.catalog-filter-mega-choose:focus-visible,
.catalog-filter-mega-view-all:focus-visible{
  outline:none;
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--catalog-accent) 58%,transparent);
}

/* Touch/mobile: same cascading panels, inside the filter drawer and horizontally scrollable. */
@media(max-width:900px){
  .catalog-category-panel{
    position:static!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    max-height:300px!important;
    margin-top:6px;
    box-shadow:none!important;
  }
  .catalog-filter-mega-panel{
    width:154px;
    min-width:154px;
    max-height:298px;
    padding:8px 7px;
  }
  .catalog-filter-mega-root{
    width:146px;
    min-width:146px;
  }
  .catalog-filter-mega-link{
    min-height:30px;
    font-size:.6rem;
  }
}
@media(max-width:520px){
  .catalog-search{
    padding:5px;
    border-radius:12px;
  }
  .catalog-search button{
    border-radius:9px;
  }
  .catalog-filter-mega-panel{
    width:148px;
    min-width:148px;
  }
  .catalog-filter-mega-root{
    width:140px;
    min-width:140px;
  }
}


/* 2026-09-25: light catalog violet-blue balance. */
html[data-theme="light"] .catalog-hero{
  background:
    radial-gradient(circle at 12% 10%,rgba(124,58,237,.14),transparent 31%),
    radial-gradient(circle at 88% 0%,rgba(79,140,255,.10),transparent 28%),
    var(--catalog-bg);
}
html[data-theme="light"] .catalog-kicker{
  background:linear-gradient(135deg,rgba(124,58,237,.075),rgba(79,140,255,.055));
}
html[data-theme="light"] .catalog-search:focus-within{
  border-color:rgba(99,88,223,.58);
  box-shadow:0 0 0 3px rgba(95,125,242,.10),var(--catalog-shadow);
}


/* 2026-09-26 catalog v17: stable category flyouts */
@media (min-width:901px) {
  .catalog-category-panel {
    width:156px !important;
    min-width:156px !important;
    max-width:none !important;
    max-height:none !important;
    display:none !important;
    overflow:visible !important;
    direction:inherit !important;
  }

  .catalog-category-mega.is-open .catalog-category-panel {
    display:block !important;
  }

  .catalog-filter-mega-panel {
    position:absolute;
    z-index:4;
    top:0;
    width:168px;
    min-width:168px;
    max-height:328px;
    display:none;
    overflow-y:auto;
    overflow-x:hidden;
    border:1px solid var(--catalog-border);
    border-radius:12px;
    background:var(--catalog-surface);
    box-shadow:0 18px 46px rgba(2,6,23,.18);
  }

  .catalog-filter-mega-panel.is-active {
    display:flex;
  }

  .catalog-filter-mega-root {
    position:relative;
    z-index:3;
    inset:auto !important;
    width:156px;
    min-width:156px;
    border:0;
    border-radius:11px;
    box-shadow:none;
  }

  .catalog-filter-mega-item {
    position:relative;
  }
}


/* 2026-09-26 catalog v18: compact two-pane category selector */
.catalog-category-panel {
  width:min(430px,calc(100vw - 32px)) !important;
  min-width:0 !important;
  max-width:min(430px,calc(100vw - 32px)) !important;
  max-height:352px !important;
  overflow:hidden !important;
  padding:0 !important;
  direction:inherit !important;
}

.catalog-category-mega.is-open .catalog-category-panel {
  display:flex !important;
  align-items:stretch;
}

.catalog-filter-mega-panel {
  position:relative !important;
  inset:auto !important;
  max-height:350px;
  padding:9px 8px;
  overflow-y:auto;
  overflow-x:hidden;
  border:0;
  border-radius:0;
  box-shadow:none;
  scrollbar-width:thin;
}

.catalog-filter-mega-root {
  width:164px !important;
  min-width:164px !important;
  flex:0 0 164px;
  background:var(--catalog-surface-2);
  border-inline-end:1px solid var(--catalog-border);
}

.catalog-filter-mega-context {
  width:auto !important;
  min-width:0 !important;
  flex:1 1 0;
  display:none;
  background:var(--catalog-surface);
}

.catalog-filter-mega-context.is-active {
  display:block;
}

.catalog-filter-root-item.is-hovered>.catalog-filter-mega-link {
  color:var(--catalog-text);
  background:color-mix(in srgb,var(--catalog-accent) 9%,transparent);
}

.catalog-filter-context-tree {
  display:grid;
  gap:2px;
}

.catalog-filter-tree-node {
  min-width:0;
}

.catalog-filter-tree-link {
  padding-inline-start:calc(7px + (var(--tree-depth, 0) * 11px));
}

.catalog-filter-tree-link.is-current {
  color:var(--catalog-accent);
  background:color-mix(in srgb,var(--catalog-accent) 10%,transparent);
}

.catalog-filter-tree-branch {
  display:none;
  gap:2px;
  margin:1px 0 4px;
  padding-inline-start:5px;
  border-inline-start:1px solid color-mix(in srgb,var(--catalog-border) 72%,transparent);
}

.catalog-filter-tree-node.is-expanded>.catalog-filter-tree-branch {
  display:grid;
}

.catalog-filter-tree-node.is-expanded>.catalog-filter-tree-link .catalog-filter-mega-arrow {
  transform:rotate(180deg);
  opacity:.82;
}

.catalog-filter-mega-arrow {
  transition:transform .16s ease,opacity .16s ease;
}

@media (min-width:901px) {
  .catalog-category-panel {
    display:none !important;
  }

  .catalog-category-mega.is-open .catalog-category-panel {
    display:flex !important;
  }

  .catalog-filter-mega-panel,
  .catalog-filter-mega-root {
    position:relative !important;
    inset:auto !important;
  }
}

@media (max-width:900px) {
  .catalog-category-panel {
    position:static !important;
    width:100% !important;
    max-width:100% !important;
    max-height:310px !important;
    margin-top:6px;
    box-shadow:none !important;
  }

  .catalog-filter-mega-root {
    width:42% !important;
    min-width:128px !important;
    flex:0 0 42%;
  }

  .catalog-filter-mega-context {
    flex:1 1 58%;
  }

  .catalog-filter-mega-panel {
    max-height:308px;
    padding:8px 7px;
  }
}

@media (max-width:520px) {
  .catalog-filter-mega-root {
    width:45% !important;
    min-width:118px !important;
    flex-basis:45%;
  }

  .catalog-filter-mega-link {
    min-height:30px;
    font-size:.59rem;
  }

  .catalog-filter-mega-choose {
    font-size:.5rem;
  }
}


/* 2026-09-26 catalog v19: plain LTR search field */
.catalog-search-field--plain input {
  padding-inline:10px !important;
}
