:root {
  --bg: #0e0b14;
  --panel: #15111f;
  --card: #1a1626;
  --glass: rgba(255,255,255,0.04);
  --text: #fdf7ef;
  --muted: #b0a6b8;
  --accent: #ff5a36;
  --accent-2: #ffb36a;
  --shadow: 0 10px 40px rgba(0,0,0,0.35);
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: 'Manrope', 'Inter', system-ui, -apple-system, sans-serif;
  background: #0b0a15;
  color: var(--text);
  min-height: 100vh;
}
a { color: var(--accent-2); text-decoration: none; }
a:hover { color: #b8ecff; }
.container { width: min(1200px, 94vw); margin: 0 auto; }
.site-header {
  position: sticky;
  top: 0;
  backdrop-filter: blur(10px);
  background: rgba(10,9,18,0.9);
  border-bottom: 1px solid rgba(255,255,255,0.05);
  z-index: 10;
}
.nav {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 0;
  gap: 16px;
}
.nav-actions { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.inline-search { min-width: 280px; }
.nav-links { display: flex; gap: 10px; flex-wrap: wrap; font-weight: 700; }
.nav-links a { padding: 10px 14px; border-radius: 6px; color: #f8efe5; background: #1f1a2d; border: 1px solid rgba(255,255,255,0.06); }
.nav-links a:hover { background: #2a2338; color: var(--accent-2); }
.logo-mark {
  display: inline-flex;
  align-items: center;
}
.brand-logo {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
}
.brand-logo-header {
  width: clamp(110px, 10vw, 145px);
}
.brand-logo-footer {
  width: clamp(120px, 12vw, 145px);
}
.home-link,
.home-link:hover,
.home-link:visited,
.home-link:active {
  color: inherit;
}
.hero { padding: 0; }
.hero-grid { display: none; }
.eyebrow { text-transform: uppercase; letter-spacing: 1px; color: var(--muted); font-size: 12px; margin: 0 0 8px; }
h1 { font-size: clamp(28px, 4vw, 40px); margin: 0 0 12px; }
h2 { font-size: clamp(22px, 3vw, 30px); margin: 0; }
h3 { margin: 0 0 8px; }
.search-wrap { position: relative; display: flex; align-items: center; }
.search-wrap input {
  width: 100%;
  padding: 14px 46px 14px 16px;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.08);
  background: #0f0e1d;
  color: var(--text);
  font-size: 15px;
  outline: none;
  box-shadow: var(--shadow);
}
.search-wrap input:focus { border-color: var(--accent); }
.shortcut {
  position: absolute;
  right: 12px;
  padding: 6px 8px;
  border-radius: 6px;
  border: 1px solid rgba(255,255,255,0.08);
  color: var(--muted);
  font-size: 12px;
}
.hero-stats { display: flex; gap: 12px; flex-wrap: wrap; font-size: 13px; color: var(--muted); }
.hero-stats .pill { background: rgba(255,255,255,0.06); color: var(--text); }
.stats-bar { display: flex; align-items: center; justify-content: flex-end; gap: 12px; padding: 16px 0 10px; }
.cta-stack { display: flex; align-items: stretch; }
.cta-card {
  background: #17162e;
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 10px;
  padding: 18px;
  box-shadow: var(--shadow);
  height: 100%;
}
.section-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 0 0 14px; }
.section-head-stack {
  display: grid;
  gap: 14px;
  align-items: stretch;
}
.filters {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.filters-menu {
  width: 100%;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(24,19,34,0.94), rgba(13,10,22,0.96));
  box-shadow: var(--shadow);
  overflow: hidden;
}
.filters-toggle {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
  padding: 16px 18px;
  cursor: pointer;
  font-weight: 700;
}
.filters-toggle::-webkit-details-marker { display: none; }
.filters-toggle::after {
  content: "+";
  color: var(--accent-2);
  font-size: 18px;
  line-height: 1;
}
.filters-menu[open] .filters-toggle::after { content: "-"; }
.filters-toggle-summary {
  margin-left: auto;
  color: var(--muted);
  font-size: 13px;
  font-weight: 500;
}
.filters-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  gap: 18px;
  padding: 18px;
  border-top: 1px solid rgba(255,255,255,0.08);
}
.filter-group {
  width: 100%;
}
.filter-actions {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
}
.filter-field { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.filter-field span {
  color: var(--muted);
  font-size: 12px;
  letter-spacing: 0.8px;
  text-transform: uppercase;
}
.filter-field-menu { min-width: 180px; }
.filter-menu {
  position: relative;
  min-width: 180px;
}
.filter-summary {
  list-style: none;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 180px;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,0.1);
  background: #130f21;
  color: var(--text);
  cursor: pointer;
  font-size: 13px;
  box-shadow: var(--shadow);
}
.filter-summary::-webkit-details-marker { display: none; }
.filter-summary::after {
  content: "+";
  color: var(--accent-2);
  font-size: 16px;
  line-height: 1;
}
.filter-menu[open] .filter-summary::after { content: "-"; }
.filter-menu-options {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  z-index: 20;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 260px;
  max-width: min(360px, 80vw);
  padding: 12px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(16, 12, 24, 0.98);
  box-shadow: 0 16px 40px rgba(0,0,0,0.45);
}
.filter-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.filter-chip {
  border: 1px solid rgba(255,255,255,0.12);
  background: #171429;
  color: var(--text);
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 12px;
  cursor: pointer;
}
.filter-chip.is-active {
  border-color: var(--accent);
  background: rgba(255,90,54,0.2);
  color: #ffd9cc;
}
.filter-save {
  border: 1px solid rgba(255,255,255,0.12);
  background: #171429;
  color: var(--text);
  padding: 6px 12px;
}
.filter-save:hover {
  border-color: var(--accent);
}
.catalog-hero { padding: 28px 0 8px; }
.catalog-hero-row {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
}
.catalog-toolbar {
  display: block;
  padding: 0 0 18px;
}
.catalog-toolbar .filters-menu {
  width: 100%;
}
.catalog-toolbar .filters-panel {
  grid-template-columns: minmax(220px, 1.2fr) minmax(180px, 1fr) minmax(180px, 1fr);
  align-items: end;
}
.catalog-search {
  width: 100%;
  min-width: 0;
}
.catalog-card { gap: 10px; }
.catalog-card-top,
.catalog-card-foot,
.catalog-card-tags {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: space-between;
}
.catalog-card-tags {
  justify-content: flex-start;
  min-height: 24px;
}
.catalog-tag,
.countdown-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 11px;
  letter-spacing: 0.6px;
  text-transform: uppercase;
}
.catalog-tag {
  background: rgba(255,255,255,0.06);
  color: var(--muted);
  border: 1px solid rgba(255,255,255,0.08);
}
.countdown-chip {
  background: rgba(255,90,54,0.14);
  color: #ffd6cc;
  border: 1px solid rgba(255,90,54,0.3);
  font-variant-numeric: tabular-nums;
}
.card-img-wrap.compact {
  height: 110px;
  min-width: 158px;
  width: 158px;
}
.countdown-row {
  position: relative;
  grid-template-columns: 1fr;
  align-items: stretch;
  gap: 16px;
  padding: 16px;
  background:
    radial-gradient(circle at top right, rgba(255,179,106,0.12), transparent 36%),
    linear-gradient(145deg, rgba(70,24,19,0.92), rgba(22,13,25,0.96));
  border-color: rgba(255,120,84,0.26);
}
.card.countdown-row {
  display: grid;
  width: 100%;
}
.countdown-row-body {
  display: grid;
  grid-template-columns: minmax(220px, 0.85fr) minmax(320px, 1.5fr) minmax(220px, 0.8fr);
  align-items: center;
  gap: 18px;
}
.countdown-row:hover {
  border-color: #ff7d54;
}
.countdown-row-head,
.countdown-row-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.countdown-row-titleline {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  flex: 1 1 auto;
}
.countdown-row-titleline h3 {
  margin: 0;
  font-size: clamp(21px, 2vw, 26px);
  line-height: 1.1;
}
.countdown-row-meta {
  flex-wrap: wrap;
  justify-content: flex-end;
  margin-left: auto;
}
.countdown-row-price {
  color: #ffd166;
  font-weight: 700;
}
.countdown-deadline {
  color: #ffd4be;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.countdown-timer {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.countdown-segment {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 88px;
  border-radius: 14px;
  background: rgba(12, 8, 18, 0.6);
  border: 1px solid rgba(255,255,255,0.08);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05);
}
.countdown-segment strong {
  display: block;
  font-size: clamp(28px, 3.4vw, 42px);
  line-height: 1;
  color: #fff6ef;
  font-variant-numeric: tabular-nums;
}
.countdown-segment small {
  margin-top: 6px;
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #ffbca8;
}
.countdown-row-preview {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.countdown-cover {
  width: 100%;
}
.countdown-cover.card-img-wrap.compact {
  width: 100%;
  min-width: 0;
  height: 180px;
}
.countdown-cover-empty {
  min-height: 180px;
}
.countdown-row-clock {
  min-width: 0;
}
.countdown-item {
  display: grid;
  grid-template-columns: 48px 1fr;
  align-items: center;
  gap: 10px;
  min-width: 0;
  padding: 8px;
  border-radius: 10px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.06);
}
.countdown-item img,
.countdown-item-fallback {
  width: 48px;
  height: 48px;
  border-radius: 8px;
}
.countdown-item img {
  object-fit: cover;
  display: block;
  background: #120f1f;
}
.countdown-item-fallback {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,90,54,0.18);
  color: #ffe3da;
  font-weight: 700;
}
.countdown-item span:last-child {
  min-width: 0;
  color: #f6ece5;
  font-size: 13px;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.countdown-empty {
  display: flex;
  align-items: center;
  min-height: 100%;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px dashed rgba(255,255,255,0.12);
}
.game-card .pill { background: rgba(255,255,255,0.07); }
.game-card .excerpt { min-height: 64px; }
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 18px; }
.grid.catalog-grid-rows {
  grid-template-columns: 1fr;
}
.card {
  background: var(--card);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px;
  padding: 14px;
  box-shadow: var(--shadow);
  will-change: transform;
  transition: transform .15s ease, border .15s ease, box-shadow .25s ease;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.card:hover {
  transform: translateY(-2px);
  border-color: var(--accent);
  box-shadow:
    0 0 0 1px var(--accent),
    0 14px 30px rgba(0,0,0,0.32),
    0 6px 18px rgba(255,90,54,0.18);
  animation: breathe-shadow 1.6s ease-in-out infinite alternate;
  animation-fill-mode: both;
}
.card:hover h3 { color: var(--card-hover-title, var(--accent)); }
.card-img-wrap {
  position: relative;
  height: 150px;
  border-radius: 12px;
  overflow: hidden;
  background: #121021;
}
.img-placeholder {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(
      circle at var(--ph-x1, 18%) var(--ph-y1, 20%),
      hsl(var(--ph-h1, 14) 100% 60% / 0.22),
      transparent 42%
    ),
    radial-gradient(
      circle at var(--ph-x2, 80%) var(--ph-y2, 0%),
      hsl(var(--ph-h2, 35) 100% 70% / 0.22),
      transparent 44%
    ),
    radial-gradient(
      circle at var(--ph-x3, 40%) var(--ph-y3, 70%),
      hsl(var(--ph-h3, 198) 85% 55% / 0.2),
      transparent 46%
    ),
    linear-gradient(
      var(--ph-angle, 120deg),
      hsl(var(--ph-h1, 14) 100% 60% / 0.24),
      hsl(var(--ph-h2, 35) 100% 70% / 0.12),
      hsl(var(--ph-h3, 198) 85% 55% / 0.16)
    );
  background-position: var(--ph-shift-x, 0px) var(--ph-shift-y, 0px);
  opacity: 1;
  transition: opacity 0.4s ease;
  filter: saturate(var(--ph-sat, 1.2)) brightness(var(--ph-bright, 1)) contrast(var(--ph-contrast, 1));
  animation: glow-pulse var(--ph-glow, 1.5s) ease-in-out infinite;
}
.img-placeholder::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    repeating-linear-gradient(
      90deg,
      rgba(255,255,255,0.08) 0 1px,
      transparent 1px var(--ph-grid, 6px)
    ),
    repeating-linear-gradient(
      0deg,
      rgba(255,255,255,0.05) 0 1px,
      transparent 1px var(--ph-grid, 6px)
    );
  mix-blend-mode: screen;
  opacity: var(--ph-grid-opacity, 0.4);
  background-position: var(--ph-shift-x, 0px) var(--ph-shift-y, 0px);
}
.img-placeholder::after {
  content: "";
  position: absolute;
  inset: -40% -20%;
  background: linear-gradient(
    var(--ph-scan-angle, 100deg),
    transparent 20%,
    rgba(255,255,255,var(--ph-scan-alpha, 0.25)) 45%,
    transparent 60%
  );
  transform: translateX(-120%) skewX(-12deg);
  animation: scan-sweep var(--ph-scan, 1.2s) ease-in-out infinite;
  opacity: 0.8;
}
.card-img-wrap.img-loaded .img-placeholder,
.item-thumb.img-loaded .img-placeholder {
  opacity: 0;
}
.card-img-wrap.img-loaded {
  box-shadow: 0 0 0 1px rgba(255,90,54,0.25), 0 0 20px rgba(255,90,54,0.2);
}
.card-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  filter: blur(14px);
  transform: scale(1.02);
  transition: opacity 0.35s ease, filter 0.6s ease, transform 0.6s ease;
}
.card-img.is-loaded {
  opacity: 1;
  filter: blur(0);
  transform: scale(1);
  animation: image-pop 0.45s ease;
}
.skeleton {
  position: relative;
  overflow: hidden;
  background: rgba(255,255,255,0.08);
}
.skeleton::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.18), transparent);
  transform: translateX(-100%);
  animation: skeleton-sheen 1.4s ease-in-out infinite;
}
.skeleton-line {
  height: 12px;
  border-radius: 999px;
  margin: 10px 0;
}
.skeleton-line.short { width: 45%; }
.skeleton-line.medium { width: 70%; }
.skeleton-line.long { width: 90%; }
.skeleton-img {
  height: 150px;
  border-radius: 12px;
}
.skeleton-pill {
  display: inline-block;
  height: 22px;
  width: 90px;
  border-radius: 999px;
}
.skeleton-card {
  pointer-events: none;
}
.skeleton-hero {
  min-height: 260px;
  border-radius: 12px;
}
.skeleton-btn {
  height: 38px;
  width: 140px;
  border-radius: 8px;
  display: inline-block;
}
.skeleton-list {
  height: 14px;
  width: 60%;
  border-radius: 999px;
}
.badge { display: inline-block; background: var(--accent); color: #02121f; padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; }
.badge.ghost { background: rgba(255,255,255,0.12); color: var(--text); }
.badge.humble { background: #d11415; color: #0e0b14; }
.badge.fanatical { background: #f7941d; color: #0e0b14; }
.badge.itch { background: #fa5c5c; color: #0e0b14; }
.badge.indiegala { background: #b30086; color: #0e0b14; }
.badge.digiphile { background: #2fb3ff; color: #0e0b14; }
.pill-btn {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 10px 14px;
  border-radius: 8px;
  background: var(--accent);
  color: #041024;
  font-weight: 700;
  border: none;
  cursor: pointer;
  box-shadow: var(--shadow);
}
.pill-btn:hover { filter: brightness(1.06); }
.text-link { color: var(--accent); font-weight: 600; }
.muted { color: var(--muted); font-size: 14px; }
.tiers { margin-top: 12px; }
.tier { background: #0e1423; padding: 10px; border-radius: 10px; margin-bottom: 8px; border: 1px solid rgba(255,255,255,0.04); }
.list { list-style: none; padding: 0; margin: 0; }
.list li { padding: 6px 0; border-bottom: 1px solid #1c2027; }
button { background: var(--accent); color: #041024; border: none; padding: 10px 12px; border-radius: 10px; cursor: pointer; font-weight: 700; }
button:hover { filter: brightness(1.05); }
.filters .filter-save {
  border: 1px solid rgba(255,255,255,0.12);
  background: #171429;
  color: var(--text);
  padding: 6px 12px;
  border-radius: 999px;
}
.filters .filter-save:hover {
  border-color: var(--accent);
  filter: none;
}
.section-title { margin: 32px 0 12px; display: flex; align-items: center; gap: 10px; }
.expired .card { opacity: 0.65; filter: grayscale(0.7); }
.excerpt { color: var(--muted); font-size: 13px; margin-top: 6px; line-height: 1.5; }
.card-price {
  margin-top: auto;
  text-align: right;
  color: #ffd166;
  font-weight: 600;
  letter-spacing: 0.2px;
}
.divider-line { border-bottom: 1px solid rgba(255,255,255,0.08); margin: 6px 0; }
.clamp-two {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.2;
  min-height: 2.4em; /* reserve space for two lines */
}
.item-row { display: flex; justify-content: space-between; gap: 10px; padding: 8px 0; border-bottom: 1px solid #1c2027; }
.item-main { font-weight: 700; }
.item-meta { color: var(--muted); font-size: 12px; display: flex; gap: 8px; flex-wrap: wrap; }
.pill { background: rgba(255,255,255,0.08); color: var(--text); padding: 4px 8px; border-radius: 999px; font-size: 12px; }
.trailer { display: block; margin: 12px 0; color: var(--accent-2); }
.split { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 18px; margin-bottom: 48px; }
.panel {
  background: #16162d;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px;
  padding: 18px;
  box-shadow: var(--shadow);
}
.inline-form { display: flex; gap: 10px; margin-top: 10px; flex-wrap: wrap; }
.inline-form input {
  flex: 1;
  min-width: 180px;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.03);
  color: var(--text);
}
.bullet-list { list-style: none; padding: 0; margin: 12px 0; color: var(--muted); }
.bullet-list li { padding: 4px 0; position: relative; padding-left: 18px; }
.bullet-list li::before {
  content: "*";
  color: var(--accent);
  position: absolute;
  left: 4px;
}
.divider { opacity: 0.5; }
.site-footer { padding: 28px 0 32px; border-top: 1px solid rgba(255,255,255,0.06); background: #0c0a17; margin-top: 32px; }
.footer-grid {
  display: grid;
  grid-template-columns: minmax(240px, 1.35fr) repeat(3, minmax(140px, 1fr));
  gap: clamp(20px, 3vw, 40px);
  align-items: start;
}
.footer-column {
  display: grid;
  gap: 10px;
  text-align: left;
}
.footer-brand {
  padding-right: 12px;
}
.footer-brand .brand-logo {
  margin: 0 0 10px;
}
.footer-note { margin: 6px 0 0; }
.footer-version {
  margin: 12px 0 0;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-align: center;
}
.footer-links {
  display: grid;
  gap: 8px;
  font-size: 13px;
}
.footer-label {
  color: var(--muted);
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.footer-links a { color: var(--muted); }
.footer-links a:hover { color: var(--accent-2); }
.footer-disclosure {
  margin: 16px 0 0;
  max-width: 72ch;
  line-height: 1.5;
  text-align: left;
}

/* Privacy page */
.privacy-main {
  padding: 30px 0 48px;
}
.privacy-card {
  background: var(--panel);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 12px;
  padding: 22px;
  box-shadow: var(--shadow);
}
.privacy-card h1 {
  margin-bottom: 8px;
}
.privacy-card h2 {
  margin: 0 0 8px;
  font-size: clamp(20px, 2.4vw, 24px);
}
.privacy-card section + section {
  margin-top: 20px;
}
.privacy-list {
  margin: 0;
  padding-left: 18px;
  color: var(--muted);
  line-height: 1.6;
}
.privacy-actions {
  margin: 12px 0 10px;
}
.privacy-secondary-btn {
  background: transparent;
  color: var(--text);
  border: 1px solid rgba(255,255,255,0.25);
}
.privacy-secondary-btn:hover {
  border-color: var(--accent-2);
  color: var(--accent-2);
}

/* Lightweight consent notice */
.consent-notice {
  position: fixed;
  right: 16px;
  bottom: 16px;
  width: min(440px, calc(100vw - 24px));
  z-index: 10000;
  background: #130f1f;
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 12px;
  box-shadow: 0 12px 40px rgba(0,0,0,0.45);
}
.consent-notice__inner {
  display: grid;
  gap: 10px;
  padding: 12px 14px;
}
.consent-notice__text {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}
.consent-notice__actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
.consent-btn {
  border-radius: 8px;
  padding: 8px 12px;
  font-size: 13px;
}
.consent-btn--accept {
  background: var(--accent);
  color: #041024;
}
.consent-btn--reject {
  background: transparent;
  color: var(--text);
  border: 1px solid rgba(255,255,255,0.25);
}
.consent-btn--reject:hover {
  color: var(--accent-2);
  border-color: var(--accent-2);
}

/* Bundle detail */
.bundle-hero {
  margin-top: 32px;
  background: linear-gradient(135deg, rgba(255,255,255,0.03), rgba(255,255,255,0.01));
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 16px;
  padding: 18px;
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 18px;
  box-shadow: var(--shadow);
}
.hero-art {
  min-height: 260px;
  border-radius: 12px;
  background-size: cover;
  background-position: center;
  border: 1px solid rgba(255,255,255,0.08);
  transition: filter 0.6s ease, transform 0.6s ease, box-shadow 0.6s ease;
}
.hero-art.loading {
  filter: blur(10px) saturate(1.2);
  transform: scale(1.01);
  box-shadow: 0 0 0 1px rgba(255,90,54,0.3), 0 0 28px rgba(255,90,54,0.22);
}
.hero-copy h1 { margin-bottom: 12px; }
.bundle-meta { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.bundle-actions { display: flex; gap: 12px; align-items: center; }
.bundle-body { padding: 24px 0 48px; }
.bundle-about { margin-bottom: 24px; }
.about-body { display: grid; gap: 10px; color: var(--muted); font-size: 14px; line-height: 1.6; }
.about-body p { margin: 0; }
.tier-list { display: flex; flex-direction: column; gap: 12px; }
.tier-card {
  background: var(--card);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
  padding: 14px;
  box-shadow: var(--shadow);
}
.tier-head h3 { margin: 4px 0 0; }
.item-accordion-list { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
.item-accordion {
  border: 1px solid rgba(255,255,255,0.05);
  border-radius: 10px;
  background: rgba(255,255,255,0.02);
  overflow: hidden;
}
.item-accordion-head {
  width: 100%;
  text-align: left;
  background: transparent;
  border: none;
  color: var(--text);
  padding: 12px;
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: start;
  gap: 12px;
}
.item-accordion-head h4 { margin: 0; font-size: 18px; }
.item-accordion .caret { font-size: 12px; color: var(--muted); }
.item-accordion-body {
  padding: 0 12px 12px 12px;
  display: none;
}
.item-accordion.open .item-accordion-body { display: block; }
.item-accordion.open .caret { transform: rotate(180deg); }
.item-meta { color: var(--muted); font-size: 13px; display: flex; flex-direction: column; gap: 10px; }
.info-badges { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 6px; }
.info-badge {
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 999px;
  padding: 4px 8px;
  font-size: 12px;
  color: var(--text);
}
.info-badges.align-right { justify-content: flex-end; }
.meta-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin: 6px 0; }
.meta-left { font-size: 13px; color: var(--muted); }
.mc-chip { display: inline-flex; align-items: center; gap: 4px; }
.mc-icon { width: 18px; height: 18px; object-fit: contain; vertical-align: middle; }
.media-strip { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.media-strip img { width: 120px; height: 70px; object-fit: cover; border-radius: 8px; border: 1px solid rgba(255,255,255,0.1); }
.media-strip .media-chip { padding: 6px 10px; border-radius: 8px; background: rgba(255,255,255,0.08); color: var(--text); font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.item-head-left { display: grid; grid-template-columns: 250px 1fr; gap: 12px; align-items: center; }
.item-head-left.no-thumb { grid-template-columns: 1fr; }
.item-thumb {
  position: relative;
  width: 250px;
  height: 120px;
  border-radius: 10px;
  overflow: hidden;
  background-color: #141025;
  border: 1px solid rgba(255,255,255,0.1);
}
.item-thumb-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  opacity: 0;
  filter: blur(12px);
  transform: scale(1.02);
  transition: opacity 0.35s ease, filter 0.6s ease, transform 0.6s ease;
}
.item-thumb-img.is-loaded {
  opacity: 1;
  filter: blur(0);
  transform: scale(1);
  animation: image-pop 0.45s ease;
}
.item-head-summary { margin: 6px 0 0; font-size: 13px; line-height: 1.4; }
.item-head-right { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; min-width: 140px; }
.price-stack { text-align: right; }
.price-now { font-weight: 800; color: var(--text); }
.price-was { text-decoration: line-through; color: #f18b8b; margin-left: 6px; }
.icon-row { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.icon-chip { background: rgba(255,255,255,0.08); border-radius: 10px; padding: 4px 8px; font-size: 12px; color: var(--text); }
.detail-list { list-style: none; padding: 0; margin: 10px 0 0; display: grid; gap: 6px; }
.detail-list li { font-size: 13px; color: var(--text); }
.info-badges.align-right { justify-content: flex-end; }
#gallery-overlay { position: fixed; inset: 0; display: none; align-items: center; justify-content: center; z-index: 1000; }
.gallery-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.7); backdrop-filter: blur(4px); }
.gallery-content { position: relative; display: flex; align-items: center; gap: 12px; }
.gallery-image { max-width: 80vw; max-height: 80vh; border-radius: 10px; box-shadow: 0 20px 60px rgba(0,0,0,0.6); }
.gallery-close { position: absolute; top: -38px; right: -10px; background: rgba(0,0,0,0.6); color: #fff; border: none; font-size: 24px; padding: 4px 10px; border-radius: 8px; cursor: pointer; }
.gallery-nav { background: rgba(0,0,0,0.6); color: #fff; border: none; font-size: 30px; padding: 8px 12px; border-radius: 10px; cursor: pointer; }
.home-link { text-decoration: none; color: inherit; display: inline-flex; }
.home-link:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; border-radius: 6px; }
.currency-toggle { display: flex; gap: 6px; align-items: center; }
.currency-toggle .pill { cursor: pointer; border: 1px solid rgba(255,255,255,0.12); background: #171429; color: var(--text); }
.currency-toggle .pill.active { background: var(--text); color: var(--bg, #0a0912); }
@media (max-width: 800px) {
  .nav { flex-wrap: wrap; }
  .nav-links { width: 100%; order: 3; justify-content: flex-start; }
  .hero-grid { grid-template-columns: 1fr; }
  .bundle-hero { grid-template-columns: 1fr; }
  .filters-toggle {
    flex-wrap: wrap;
    align-items: flex-start;
  }
  .filters-toggle-summary {
    width: 100%;
    margin-left: 0;
  }
  .filters-panel {
    grid-template-columns: 1fr;
  }
  .filter-actions {
    justify-content: flex-start;
  }
  .catalog-hero-row { align-items: flex-start; flex-direction: column; }
  .catalog-toolbar { align-items: stretch; gap: 12px; }
  .catalog-toolbar .filters-panel {
    grid-template-columns: 1fr;
  }
  .catalog-search { width: 100%; }
  .filters { width: 100%; justify-content: flex-start; }
  .filter-field-menu,
  .filter-menu,
  .filter-summary {
    width: 100%;
  }
  .filter-summary { min-width: 0; }
  .filter-menu-options {
    min-width: 100%;
    max-width: 100%;
  }
  .privacy-card {
    padding: 18px;
  }
  .footer-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .consent-notice {
    right: 12px;
    bottom: 12px;
  }
  .consent-notice__actions {
    justify-content: flex-start;
  }
  .item-accordion-head {
    grid-template-columns: 1fr auto;
    grid-template-areas:
      "main caret"
      "meta meta";
    gap: 10px;
  }
  .item-head-left {
    grid-area: main;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 0;
  }
  .item-head-right {
    grid-area: meta;
    align-items: flex-start;
    min-width: 0;
  }
  .item-accordion .caret {
    grid-area: caret;
    justify-self: end;
    align-self: start;
  }
  .item-thumb {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
  }
  .price-stack {
    text-align: left;
  }
  .icon-row {
    justify-content: flex-start;
  }
  .item-accordion-head h4 {
    line-height: 1.25;
    overflow-wrap: anywhere;
  }
  .item-head-summary {
    overflow-wrap: anywhere;
  }
  .meta-top {
    flex-direction: column;
    align-items: flex-start;
  }
  .info-badges.align-right {
    justify-content: flex-start;
  }
}

@keyframes breathe {
  from { transform: translateY(-2px) scale(1); }
  to { transform: translateY(-2px) scale(1.005); }
}

@keyframes breathe-shadow {
  from {
    box-shadow:
      0 0 0 1px var(--accent),
      0 14px 30px rgba(0,0,0,0.34),
      0 8px 24px rgba(255,90,54,0.22);
  }
  to {
    box-shadow:
      0 0 18px 2px var(--accent),
      0 22px 48px rgba(0,0,0,0.4),
      0 16px 36px rgba(255,90,54,0.34);
  }
}
@keyframes skeleton-sheen {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(100%); }
}
@keyframes scan-sweep {
  0% { transform: translateX(-120%) skewX(-12deg); }
  100% { transform: translateX(120%) skewX(-12deg); }
}
@keyframes image-pop {
  0% { transform: scale(1.06); filter: blur(6px) brightness(1.18); }
  100% { transform: scale(1); filter: blur(0) brightness(1); }
}
@keyframes glow-pulse {
  0% { filter: saturate(1.1) brightness(1); }
  100% { filter: saturate(1.4) brightness(1.1); }
}
@media (prefers-reduced-motion: reduce) {
  .skeleton::after { animation: none; }
  .img-placeholder::after { animation: none; }
  .card-img.is-loaded,
  .item-thumb-img.is-loaded { animation: none; }
  .img-placeholder { animation: none; }
}
@media (max-width: 900px) {
  .countdown-row { grid-template-columns: 1fr; }
  .countdown-row-head {
    flex-direction: column;
    align-items: flex-start;
  }
  .countdown-row-meta {
    margin-left: 0;
    justify-content: flex-start;
  }
  .countdown-row-body {
    grid-template-columns: 1fr;
  }
  .card-img-wrap.compact {
    width: 100%;
    min-width: 0;
    height: 180px;
  }
}
@media (max-width: 640px) {
  .footer-grid {
    grid-template-columns: 1fr;
  }
  .countdown-timer {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .countdown-row-preview {
    grid-template-columns: 1fr;
  }
}
.coming-soon {
  min-height: 100vh;
  background: #0f1115;
  color: #e5e7eb;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 20px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
}

.vibe-bg {
  background: radial-gradient(circle at 20% 20%, rgba(239, 151, 65, 0.08), transparent 35%),
              radial-gradient(circle at 80% 0%, rgba(104, 126, 255, 0.08), transparent 30%),
              #0f1115;
}

.cs-wrap {
  max-width: 720px;
  width: 100%;
  background: linear-gradient(145deg, rgba(16, 17, 23, 0.95), rgba(12, 14, 19, 0.96));
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 18px;
  padding: 32px 28px 38px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.55);
  text-align: left;
}

.cs-logo-block {
  text-align: center;
  margin-bottom: 18px;
}

.brand-logo-hero {
  width: min(100%, 145px);
  margin: 0 auto 6px;
}

.logo-sub {
  color: #cbd1d8;
  font-size: 13px;
  letter-spacing: 0.4px;
}

@media (max-width: 640px) {
  .brand-logo-header {
    width: 120px;
  }
}

.cs-header h1 {
  margin: 0 0 6px;
  font-size: 32px;
  color: #e5e7eb;
  font-weight: 700;
}

.cs-header .subhead {
  margin: 0 0 16px;
  font-size: 16px;
  color: #cbd1d8;
}

.cs-section {
  margin: 26px 0 0;
  padding: 16px 16px 16px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.025);
  border: 1px solid rgba(255, 255, 255, 0.06);
}

.cs-section h2 {
  margin: 0 0 10px;
  font-size: 18px;
  color: #9fb4ff;
  font-weight: 600;
}

.cs-intro p,
.cs-section p {
  margin: 0;
  line-height: 1.65;
  max-width: 58ch;
  color: #d7dbe3;
}

.cs-list {
  margin: 0;
  padding-left: 18px;
  color: #d7dbe3;
  line-height: 1.6;
}

.cs-soft {
  margin-top: 28px;
  text-align: center;
  color:  #ff5a36;
}

.cs-footer {
  margin-top: 28px;
  font-size: 12px;
  color: rgba(229, 231, 235, 0.55);
  text-align: center;
}

.cs-cta {
  margin-top: 22px;
}

.cta-card {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  padding: 14px 16px 16px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.cta-card h3 {
  margin: 0 0 4px;
  font-size: 18px;
  color: #ff5a36;
  font-weight: 700;
}

.cta-card .muted {
  margin: 0;
}

.cta-form {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.cta-form input {
  flex: 1 1 220px;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.04);
  color: #e9e9f2;
}

.cta-form input:focus {
  outline: 1px solid #ef9741;
  border-color: #ef9741;
}

.cta-form button {
  padding: 12px 16px;
  border-radius: 10px;
  border: none;
  color: #0a0912;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 6px 18px rgb(151 59 59 / 35%)
}

.cta-form button:hover {
  filter: brightness(1.05);
}

@media (max-width: 640px) {
  .cs-wrap {
    padding: 28px 20px 32px;
  }
  .cs-section {
    padding: 14px 12px 0;
  }
}