:root {
  --ls-color-primary: #e94e8a;
  --ls-color-primary-deep: #c42f70;
  --ls-color-secondary: #7c4dff;
  --ls-color-secondary-deep: #5634d1;
  --ls-color-accent: #f5b84b;
  --ls-color-teal: #22b8b6;
  --ls-color-mint: #dff8eb;
  --ls-color-match: #dcfce7;
  --ls-color-mismatch: #ffe4ec;
  --ls-color-near: #fef3c7;
  --ls-color-unknown: #eef2f7;
  --ls-bg-app: #fbf8ff;
  --ls-bg-public: #fff9fb;
  --ls-bg-admin: #f7f4ff;
  --ls-bg-sidebar: rgba(255,255,255,.82);
  --ls-gradient-hero: linear-gradient(135deg, #fff7fb 0%, #efe7ff 45%, #dff9f6 100%);
  --ls-gradient-card: linear-gradient(135deg, rgba(255,255,255,.96), rgba(248,242,255,.92));
  --ls-gradient-button: linear-gradient(135deg, #7c4dff, #e94e8a);
  --ls-gradient-elite: linear-gradient(135deg, #fff3c4, #f5b84b, #d9862d);
  --ls-tier-free: #94a3b8;
  --ls-tier-pro: #38bdf8;
  --ls-tier-plus: #a855f7;
  --ls-tier-elite: #f59e0b;
  --ls-tier-elite-glow: 0 0 0 1px rgba(245,158,11,.35), 0 20px 60px rgba(245,158,11,.28);
  --ls-tier-pro-glow: 0 0 0 1px rgba(56,189,248,.35), 0 20px 60px rgba(56,189,248,.20);
  --ls-tier-plus-glow: 0 0 0 1px rgba(168,85,247,.35), 0 20px 60px rgba(168,85,247,.22);
  --ls-radius-card: 2rem;
  --ls-radius-panel: 2.5rem;
  --ls-radius-button: 999px;
  --ls-shadow-soft: 0 18px 60px rgba(31, 24, 60, .10);
  --ls-shadow-lifted: 0 28px 90px rgba(31, 24, 60, .16);
  --ls-font-heading: Inter, ui-sans-serif, system-ui;
  --ls-font-body: Inter, ui-sans-serif, system-ui;
  --ls-spacing-page: 1.5rem;
  --ls-spacing-section: 2rem;
  --ls-motion-duration: 180ms;
}

html {
  background: var(--ls-bg-app, #fbf8ff);
}

body {
  font-family: var(--ls-font-body, Inter, ui-sans-serif, system-ui);
  background:
    radial-gradient(circle at top left, rgba(233, 78, 138, .10), transparent 32rem),
    radial-gradient(circle at top right, rgba(124, 77, 255, .12), transparent 34rem),
    var(--ls-bg-app, #fbf8ff);
  color: #111827;
}

.ls-themed-shell {
  background: var(--ls-bg-app, #fbf8ff);
  color: #111827;
}

.ls-public-shell {
  background:
    radial-gradient(circle at 10% 5%, rgba(233,78,138,.12), transparent 26rem),
    radial-gradient(circle at 85% 8%, rgba(34,184,182,.13), transparent 30rem),
    var(--ls-bg-public, #fff9fb);
}

.ls-admin-cockpit {
  background:
    radial-gradient(circle at 15% 10%, rgba(233, 78, 138, .12), transparent 28rem),
    radial-gradient(circle at 80% 5%, rgba(34, 184, 182, .12), transparent 26rem),
    var(--ls-bg-admin, #f7f4ff);
}

.ls-premium-card {
  border-radius: var(--ls-radius-card, 2rem);
  background: var(--ls-gradient-card, linear-gradient(135deg, rgba(255,255,255,.96), rgba(248,242,255,.92)));
  box-shadow: var(--ls-shadow-soft, 0 18px 60px rgba(31, 24, 60, .10));
  border: 1px solid rgba(124, 77, 255, .12);
}

.ls-panel {
  border-radius: var(--ls-radius-panel, 2.5rem);
  background: rgba(255,255,255,.78);
  box-shadow: var(--ls-shadow-lifted, 0 28px 90px rgba(31, 24, 60, .16));
  border: 1px solid rgba(124, 77, 255, .14);
  backdrop-filter: blur(18px);
}

.ls-btn-primary {
  background: var(--ls-gradient-button, linear-gradient(135deg, #7c4dff, #e94e8a));
  color: #fff;
  border-radius: var(--ls-radius-button, 999px);
  box-shadow: 0 16px 40px rgba(124, 77, 255, .25);
  transition: transform var(--ls-motion-duration, 180ms) ease, box-shadow var(--ls-motion-duration, 180ms) ease;
}

.ls-btn-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 22px 56px rgba(124, 77, 255, .34);
}

.ls-tier-free { box-shadow: 0 0 0 1px rgba(148,163,184,.26); }
.ls-tier-pro { box-shadow: var(--ls-tier-pro-glow, 0 0 0 1px rgba(56,189,248,.35), 0 20px 60px rgba(56,189,248,.20)); }
.ls-tier-plus { box-shadow: var(--ls-tier-plus-glow, 0 0 0 1px rgba(168,85,247,.35), 0 20px 60px rgba(168,85,247,.22)); }
.ls-tier-elite { box-shadow: var(--ls-tier-elite-glow, 0 0 0 1px rgba(245,158,11,.35), 0 20px 60px rgba(245,158,11,.28)); }

.ls-match { background: var(--ls-color-match, #dcfce7); }
.ls-near { background: var(--ls-color-near, #fef3c7); }
.ls-mismatch { background: var(--ls-color-mismatch, #ffe4ec); }
.ls-unknown { background: var(--ls-color-unknown, #eef2f7); }