/* DubiLook — generated from tokens.json */
:root, [data-theme="dark"] {
  --bg-000: #0e0f11; /* App ground behind everything; Telegram header colour is set to this. */
  --bg-100: #16181b; /* Cards, header block, tab bar surface. */
  --bg-200: #1e2125; /* Raised: bottom sheets, toasts, pressed card, input fill. */
  --bg-300: #272a2f; /* Avatar disc, secondary button fill, selected row. */
  --line-100: #30343a; /* Hairline dividers and card outlines on bg-000 / bg-100 (decorative, not a control edge). */
  --line-200: #6a7079; /* Control edges that must be seen: inputs, checkboxes, secondary/off-label borders. 3:1+ on bg-000, bg-100, bg-200. */
  --ink: #f5f4f0; /* Primary text and icons on every bg token (13:1+). */
  --ink-muted: #a9aeb5; /* Secondary text: meta lines, captions, helper text on every bg token (6.4:1+). */
  --ink-faint: #878d95; /* Tertiary text and the text of OFF labels on bg-000 / bg-100 / bg-200 (4.8:1+). */
  --gold: #c9a227; /* THE accent: primary button fill, active tab circle, level label, focus ring, price highlight. Text in gold reads on every bg token (5.9:1+). */
  --gold-hover: #d6b23f; /* Primary button hover / pressed-in highlight. */
  --gold-press: #b08d1d; /* Primary button pressed. */
  --on-gold: #16130a; /* Text and icons on a gold fill (7.6:1). */
  --gold-soft: rgba(201,162,39,0.14); /* Tinted fill behind gold text: level label, selected option row. */
  --gold-line: rgba(201,162,39,0.45); /* Gold hairline: featured card edge, section rules in numbered steps. */
  --label-teal: #3cc4b4; /* Retired 12 Oct (all earned labels gold). PHONE ON FILE text + outline (earned). */
  --label-gold: var(--gold); /* Retired 12 Oct (all earned labels gold). BRN ON FILE text + outline (earned). */
  --label-blue: #73a7ff; /* Retired 12 Oct (all earned labels gold). AGENCY EMAIL text + outline (earned). */
  --label-violet: #b694f5; /* Retired 12 Oct (all earned labels gold). ARCHIVE MATCH text + outline (earned). */
  --label-green: #74cf86; /* Retired 12 Oct (all earned labels gold). PEER VOUCHED text + outline (earned). */
  --label-amber: #f09a45; /* Retired 12 Oct (all earned labels gold). EARLY MEMBER text + outline (earned). Orange-amber so it never reads as BRN gold. */
  --state-success: #5dcb8e; /* LIVE page state, success toast, Confirmed by you mark. Always with a word or icon. */
  --state-warning: #e9b44c; /* UNDER REVIEW page state, warning helper text. Always with a word or icon. */
  --state-danger: #ff7a6e; /* Destructive button text/edge, field error text, error toast. Always with a word or icon. */
  --state-info: #73a7ff; /* SOLD page state, info toast. */
  --state-neutral: var(--ink-faint); /* EXPIRED and HIDDEN page states. */
  --danger-soft: rgba(255,122,110,0.12); /* Destructive button fill, error field fill. */
  --scrim: rgba(5,6,7,0.64); /* Backdrop behind bottom sheets. */
  --focus: var(--gold); /* 2px focus ring, offset 2px, on every surface. */
  --shadow-1: 0 1px 2px rgba(0,0,0,0.40); /* Cards at rest (with the line-100 outline). */
  --shadow-2: 0 8px 24px rgba(0,0,0,0.45); /* Toasts, raised menus. */
  --shadow-3: 0 -12px 40px rgba(0,0,0,0.55); /* Bottom sheets. */
  --shadow-gold: 0 6px 18px rgba(201,162,39,0.35); /* The active-tab gold circle only. */
}
:root {
  --space-1: 4px; /* Icon-to-text gap inside labels. */
  --space-2: 8px; /* Gap between label chips; inline icon gaps. */
  --space-3: 12px; /* Gap between stacked lines inside a card. */
  --space-4: 16px; /* Page side gutter; card padding. */
  --space-5: 20px; /* Sheet padding. */
  --space-6: 24px; /* Gap between sections. */
  --space-8: 32px; /* Gap above a screen title; empty-state block padding. */
  --space-12: 48px; /* Top padding of an empty state. */
  --radius-xs: 4px; /* Label chips (precision outline boxes). */
  --radius-sm: 8px; /* Inputs, checkboxes, small buttons, photo thumbs. */
  --radius-md: 12px; /* Buttons, toasts. */
  --radius-lg: 16px; /* Cards, header block. */
  --radius-xl: 24px; /* Bottom sheet top corners. */
  --radius-full: 999px; /* Avatar, tab circle, state dots. */
  --dur-fast: 150ms; /* Press feedback, colour/opacity changes. */
  --dur-base: 220ms; /* Disclosure (Show full post), toast in. */
  --dur-slow: 320ms; /* Tab bar circle + notch travel. */
  --dur-sheet: 350ms; /* Bottom sheet slide-up. */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1); /* Default for things entering. */
  --ease-spring: cubic-bezier(0.34, 1.45, 0.64, 1); /* Spring-like overshoot: tab circle, sheet, toast. Small overshoot, never bouncy. */
  --ease-in: cubic-bezier(0.55, 0, 1, 0.45); /* Things leaving (sheet close, toast out). */
  --z-base: 0; /* Page content. */
  --z-sticky: 10; /* Sticky header / filter row. */
  --z-tabbar: 20; /* Bottom tab bar. */
  --z-scrim: 30; /* Sheet backdrop. */
  --z-sheet: 40; /* Bottom sheets. */
  --z-toast: 50; /* Toasts (above sheets). */
  --tap-min: 44px; /* Minimum tap target on every control. */
  --tabbar-h: 64px; /* Tab bar height above the safe-area inset. */
  --tab-circle: 48px; /* Diameter of the active-tab gold circle. */
  --label-h-sm: 24px; /* Small label box height (cards, public view). */
  --label-h-md: 32px; /* Default label box height (dashboard, sheets). */
  --avatar: 48px; /* Header avatar. */
  --page-w: 390px; /* Design width; check 360 and 430. */
  --font-sans: "Manrope", "Manrope Cyrillic", "Vazirmatn", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-fa: "Vazirmatn", "Manrope", "Manrope Cyrillic", system-ui, sans-serif;
  --text-page-title: 800 28px/34px var(--font-sans); /* Screen titles: My Library, Promotion. */
  --text-price: 800 24px/30px var(--font-sans); /* The price on a listing card and page. Tabular figures. */
  --text-step-number: 800 32px/32px var(--font-sans); /* 01 · 02 · 03 numerals in numbered steps, set in gold. */
  --text-title: 700 20px/26px var(--font-sans); /* Card titles (area), sheet titles, member name in header. */
  --text-heading: 700 17px/24px var(--font-sans); /* Section headings inside a screen. */
  --text-body: 500 16px/24px var(--font-sans); /* Default reading text, buttons. */
  --text-body-sm: 500 14px/20px var(--font-sans); /* Meta lines, list rows, helper text. */
  --text-caption: 600 12px/16px var(--font-sans); /* Timestamps, footer disclaimer, table heads. */
  --text-overline: 700 12px/16px var(--font-sans); /* Deal · property type line above a card title. Uppercase, +0.08em. */
  --text-label: 800 12px/14px var(--font-sans); /* Label chips (level, member labels, page state). Uppercase, +0.06em; auto-fits down to 9px. */
  --text-public-id: 600 13px/16px var(--font-sans); /* Public member ID (DL-9GXN). Tabular, +0.04em. */
  --text-fa-title: 700 20px/32px var(--font-fa); /* FA/AR card titles and sheet titles (dir=auto). */
  --text-fa-body: 400 16px/28px var(--font-fa); /* FA/AR reading text; taller line for Arabic script. */
  --text-fa-caption: 500 13px/22px var(--font-fa); /* FA/AR meta lines. */
}
.page-title {
  font-family: var(--font-sans);
  font-size: 28px;
  line-height: 34px;
  font-weight: 800;
  letter-spacing: -0.01em;
}
.price {
  font-family: var(--font-sans);
  font-size: 24px;
  line-height: 30px;
  font-weight: 800;
  letter-spacing: -0.01em;
}
.step-number {
  font-family: var(--font-sans);
  font-size: 32px;
  line-height: 32px;
  font-weight: 800;
  letter-spacing: 0;
}
.title {
  font-family: var(--font-sans);
  font-size: 20px;
  line-height: 26px;
  font-weight: 700;
  letter-spacing: 0;
}
.heading {
  font-family: var(--font-sans);
  font-size: 17px;
  line-height: 24px;
  font-weight: 700;
  letter-spacing: 0;
}
.body {
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 24px;
  font-weight: 500;
  letter-spacing: 0;
}
.body-sm {
  font-family: var(--font-sans);
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
  letter-spacing: 0;
}
.caption {
  font-family: var(--font-sans);
  font-size: 12px;
  line-height: 16px;
  font-weight: 600;
  letter-spacing: 0;
}
.overline {
  font-family: var(--font-sans);
  font-size: 12px;
  line-height: 16px;
  font-weight: 700;
  letter-spacing: 0.08em;
}
.label {
  font-family: var(--font-sans);
  font-size: 12px;
  line-height: 14px;
  font-weight: 800;
  letter-spacing: 0.06em;
}
.public-id {
  font-family: var(--font-sans);
  font-size: 13px;
  line-height: 16px;
  font-weight: 600;
  letter-spacing: 0.04em;
}
.fa-title {
  font-family: var(--font-fa);
  font-size: 20px;
  line-height: 32px;
  font-weight: 700;
  letter-spacing: 0;
}
.fa-body {
  font-family: var(--font-fa);
  font-size: 16px;
  line-height: 28px;
  font-weight: 400;
  letter-spacing: 0;
}
.fa-caption {
  font-family: var(--font-fa);
  font-size: 13px;
  line-height: 22px;
  font-weight: 500;
  letter-spacing: 0;
}
@font-face {
  font-family: "Manrope";
  src: url("fonts/Manrope-Latin-Variable.woff2") format("woff2");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Manrope Cyrillic";
  src: url("fonts/Manrope-Cyrillic-Variable.woff2") format("woff2");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Vazirmatn";
  src: url("fonts/Vazirmatn-Arabic-Variable.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}