/* Rebrand theme package. Disabling this sheet restores the original styles.css theme. */
:root {
  --store-button-radius: 8px;
  --store-background: var(--surface);
  --action-ink: #fff;
  --brand-blue: #1846ff;
  --brand-blue-dark: #1034d1;
  --brand-navy: #11172b;
  --paper: #f7f9fc;
  --surface-2: #eef2f8;
  --ink: var(--brand-navy);
  --ink-2: #4c5871;
  --ink-3: #68758d;
  --line: #e1e6f0;
  --line-strong: #c5cddd;
  --cobalt: var(--brand-blue);
  --cobalt-hover: var(--brand-blue-dark);
  --cobalt-soft: #edf1ff;
  --radius-art: 12px;
  --radius-card: 14px;
  --radius-ctl: 8px;
  --topbar-h: 72px;
  --shadow-sm: 0 2px 5px rgba(17, 39, 82, .05);
  --shadow-lg: 0 24px 64px rgba(17, 39, 82, .18);
}
[data-theme="dark"] {
  --action-ink: #11172b;
  --paper: #101625;
  --surface: #171f31;
  --surface-2: #222d44;
  --ink: #f0f4ff;
  --ink-2: #bcc8df;
  --ink-3: #98a9c7;
  --line: #2e3b55;
  --line-strong: #4b5e7c;
  --cobalt: #94abff;
  --cobalt-hover: #b2c1ff;
  --cobalt-soft: #233257;
  --on-accent: #11172b;
}
.btn { border-radius: var(--radius-ctl); }
[data-theme="dark"] .btn--primary { color: var(--on-accent, #11172b); }
.topbar { background: color-mix(in srgb, var(--surface) 96%, transparent); }
.views { align-self: stretch; align-items: stretch; gap: 18px; padding: 0; border-radius: 0; background: transparent; }
.views__link { position: relative; display: flex; align-items: center; padding: 0 2px; border-radius: 0; font-size: 14px; }
.views__link[aria-current="page"] { color: var(--cobalt); background: transparent; box-shadow: none; }
.views__link[aria-current="page"]::after { content: ''; position: absolute; bottom: 0; inset-inline: 0; height: 3px; background: var(--cobalt); }
.search__trigger { border-radius: var(--radius-ctl); background: var(--paper); border-color: var(--line); }
.select__input { border-radius: var(--radius-ctl); }
.segment { border-radius: 10px; }
.segment__btn { border-radius: 7px; }
.pill { border-radius: 6px; }
.page-title, .item__title { letter-spacing: -.035em; }
.page-head { padding-block: 30px 24px; }
.grid .card, .scroller .card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-card); gap: 0; height: 100%; }
.grid .card__art, .scroller .card__art { border-radius: 13px 13px 0 0; }
.grid .card__body, .scroller .card__body { padding: 14px; flex: 1; }
.grid .card__foot, .scroller .card__foot { margin-top: auto; padding-top: 8px; }
.grid .card:hover, .scroller .card:hover { border-color: color-mix(in srgb, var(--cobalt) 35%, var(--line)); }
.item__art { border-radius: var(--radius-card); }
.footer { background: var(--surface); }
.footer__inner > p { color: var(--ink-2); font-weight: 600; }

.item--offering .buybox { border-top: 3px solid var(--cobalt); }

/* Rebrand palette with the original prototype's rounded geometry. */
:root[data-lab-skin="rebrand-rounded"] {
  --store-button-radius: 999px;
  --radius-art: 14px;
  --radius-card: 18px;
  --radius-ctl: 10px;
}
:root[data-lab-skin="rebrand-rounded"] :is(.btn, .search__trigger, .select__input, .segment, .segment__btn, .pill) { border-radius: 999px; }
:root[data-lab-skin="rebrand-rounded"] .views { align-self: center; align-items: center; gap: 2px; padding: 3px; border-radius: 999px; background: var(--surface-2); }
:root[data-lab-skin="rebrand-rounded"] .views__link { padding: 7px 15px; border-radius: 999px; }
:root[data-lab-skin="rebrand-rounded"] .views__link[aria-current="page"] { color: var(--ink); background: var(--surface); box-shadow: var(--shadow-sm); }
:root[data-lab-skin="rebrand-rounded"] .views__link[aria-current="page"]::after { content: none; }
:root[data-lab-skin="rebrand-rounded"] :is(.grid, .scroller) .card__art { border-radius: calc(var(--radius-card) - 1px) calc(var(--radius-card) - 1px) 0 0; }