/* V4 brand proposal: stable identity roles, separate from editable action fills. */
:root {
  --v4-navy: #0b1220;
  --v4-teal: #35d6ce;
  --v4-teal-soft: #83e5df;
  --v4-teal-deep: #146a66;
  --v4-text: #f7faff;
  --v4-muted: #a7b8c9;
  --v4-surface: #141f2d;
  --v4-surface-raised: #213644;
  --v4-surface-deep: #111e2b;
  --v4-surface-input: #0b1622;
  --v4-line: #425669;
  --v4-control-line: #687f90;
  --v4-brand-surface: #1b3c40;
  --v4-brand-surface-deep: #153036;
  --v4-status-success: #99ece1;
  --v4-status-warning: #e6ca86;
  --v4-status-danger: #ffb4bf;
  --v4-gift: #b59aff;
  --v4-plus: #f2b66d;
  --v4-radius-card: 18px;
  --v4-radius-control: 12px;
  --v4-motion-enter: 220ms;
  --v4-motion-press: 160ms;
}
/* One vector file supplies geometry to React, admin, legacy checkout and review. */
.v4-symbol {
  display: inline-block;
  width: 32px;
  height: 32px;
  flex-shrink: 0;
  background-color: currentColor;
  -webkit-mask: url('/static/assets/brand/v4-monogram-proposal.svg') center / contain no-repeat;
  mask: url('/static/assets/brand/v4-monogram-proposal.svg') center / contain no-repeat;
}
.brand-mark .v4-symbol, .brand-icon .v4-symbol { display: block; }

/* Mini App theme aliases reuse the shared brand roles. Retained admin/store are unaffected. */
:root[data-v4-theme] {
  --font-fa: var(--font-vazirmatn);
  --font-en: var(--font-manrope);
  --v4-surface: #111e30;
  --v4-surface-raised: #18283d;
  --v4-surface-deep: #111e30;
  --v4-surface-input: #0b1220;
  --v4-brand-surface: #18283d;
  --v4-brand-surface-deep: #18283d;
  --v4-connect: #619bff;
  --v4-action: #35d6ce;
  --v4-on-action: #0b1220;
  --v4-hero-background: #0b1220;
  --v4-hero-text: #f7faff;
  --v4-card-line: color-mix(in srgb, var(--v4-control-line) 28%, transparent);
  --v4-shadow: 0 8px 32px #00000012;
  --v4-radius-card: 24px;
  --v4-hero-radius: 28px;
  --v4-focus: #35d6ce;
  color-scheme: dark;
}
:root[data-v4-theme=light] {
  --v4-navy: #f3f6fa;
  --v4-text: #0b1220;
  --v4-muted: #526174;
  --v4-surface: #ffffff;
  --v4-surface-raised: #e8eef5;
  --v4-surface-deep: #ffffff;
  --v4-surface-input: #ffffff;
  --v4-line: #b3c0ce;
  --v4-control-line: #75899d;
  --v4-brand-surface: #e8eef5;
  --v4-brand-surface-deep: #e8eef5;
  --v4-teal-soft: #146a66;
  --v4-action: #146a66;
  --v4-on-action: #ffffff;
  --v4-connect: #285db3;
  --v4-gift: #6943ab;
  --v4-plus: #825415;
  --v4-status-success: #146a66;
  --v4-status-warning: #735313;
  --v4-status-danger: #a72034;
  --v4-shadow: 0 8px 32px #14253c08;
  --v4-focus: #146a66;
  color-scheme: light;
}