/* REFRM v130 — design tokens + shared components.
   One source of truth for colour, radius, spacing, type and motion. Loaded by the landing page, auth pages,
   dashboard/account/admin and the editor. Legacy variable names are mapped in theme-v130.css. */
:root{
  color-scheme:dark;
  --rf-font:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;

  /* surfaces */
  --rf-bg:#050506;
  --rf-bg-2:#0b0b0d;
  --rf-surface:#111113;
  --rf-surface-2:#17171a;
  --rf-surface-3:#1f1f23;
  --rf-line:rgba(255,255,255,.09);
  --rf-line-strong:rgba(255,255,255,.17);

  /* text */
  --rf-text:#f5f5f7;
  --rf-muted:#9a9aa3;
  --rf-faint:#686871;
  --rf-on-primary:#0a0a0b;

  /* brand: silver mark + ONE soft violet glow (never used on text or buttons) */
  --rf-accent:#8b7cff;
  --rf-accent-2:#5aa7ff;
  --rf-glow:radial-gradient(60% 80% at 50% 0%,rgba(139,124,255,.26),transparent 70%);
  --rf-card-glow:radial-gradient(120% 100% at 50% 0%,rgba(139,124,255,.20),rgba(90,167,255,.06) 55%,transparent 80%);
  --rf-warm-glow:linear-gradient(160deg,rgba(139,124,255,.22),rgba(90,167,255,.08) 45%,rgba(255,255,255,.02));

  /* status */
  --rf-ok:#34d399;
  --rf-warn:#f5c26b;
  --rf-danger:#ff7b86;

  /* shape */
  --rf-r-sm:12px;
  --rf-r-md:16px;
  --rf-r-card:22px;
  --rf-r-panel:30px;
  --rf-r-pill:999px;

  /* space + layout */
  --rf-max:1200px;
  --rf-gutter:clamp(18px,4vw,40px);
  --rf-section:clamp(72px,11vw,150px);

  /* type scale */
  --rf-fs-h1:clamp(40px,6.4vw,72px);
  --rf-fs-h2:clamp(30px,4.2vw,48px);
  --rf-fs-h3:20px;
  --rf-fs-body:16px;
  --rf-fs-ui:13px;

  /* depth + motion */
  --rf-shadow-1:0 1px 2px rgba(0,0,0,.4);
  --rf-shadow-2:0 18px 50px rgba(0,0,0,.45);
  --rf-ease:cubic-bezier(.2,.7,.2,1);
  --rf-dur:.22s;
}
[data-theme="light"]{
  color-scheme:light;
  --rf-bg:#f4f5f8;
  --rf-bg-2:#eceef3;
  --rf-surface:#ffffff;
  --rf-surface-2:#f7f8fb;
  --rf-surface-3:#eef0f5;
  --rf-line:rgba(20,22,29,.10);
  --rf-line-strong:rgba(20,22,29,.18);
  --rf-text:#14161d;
  --rf-muted:#5d6272;
  --rf-faint:#8a8f9e;
  --rf-on-primary:#ffffff;
  --rf-shadow-2:0 18px 50px rgba(20,22,29,.14);
}

/* ---------- shared components (prefix .rf-) ---------- */
.rf-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--rf-muted)}
.rf-eyebrow svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

.rf-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 22px;border-radius:var(--rf-r-pill);border:1px solid var(--rf-line-strong);
  background:transparent;color:var(--rf-text);font:600 14px/1 var(--rf-font);cursor:pointer;text-decoration:none;white-space:nowrap;
  transition:transform var(--rf-dur) var(--rf-ease),background var(--rf-dur),border-color var(--rf-dur),opacity var(--rf-dur)}
.rf-btn:hover{border-color:var(--rf-text);transform:translateY(-1px)}
.rf-btn:focus-visible{outline:2px solid var(--rf-accent);outline-offset:3px}
.rf-btn--primary{background:var(--rf-text);color:var(--rf-on-primary);border-color:var(--rf-text)}
.rf-btn--primary:hover{opacity:.9;border-color:var(--rf-text)}
.rf-btn--ghost{background:var(--rf-surface-2)}
.rf-btn--sm{min-height:36px;padding:0 16px;font-size:13px}
.rf-btn--lg{min-height:52px;padding:0 28px;font-size:15px}
.rf-btn[disabled]{opacity:.5;cursor:not-allowed;transform:none}

.rf-pill-input{display:flex;align-items:center;gap:10px;width:100%;max-width:560px;padding:6px 6px 6px 18px;border-radius:var(--rf-r-pill);
  background:var(--rf-surface-2);border:1px solid var(--rf-line);box-shadow:var(--rf-shadow-1);transition:border-color var(--rf-dur),box-shadow var(--rf-dur)}
.rf-pill-input:focus-within{border-color:var(--rf-line-strong);box-shadow:0 0 0 4px rgba(139,124,255,.16)}
.rf-pill-input svg{flex:none;width:18px;height:18px;stroke:var(--rf-muted);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.rf-pill-input input{flex:1;min-width:0;border:0;outline:0;background:transparent;color:var(--rf-text);font:500 15px var(--rf-font);height:44px}
.rf-pill-input input::placeholder{color:var(--rf-faint)}

.rf-card{background:var(--rf-surface);border:1px solid var(--rf-line);border-radius:var(--rf-r-card);padding:28px}
.rf-card--glow{background:var(--rf-card-glow),var(--rf-surface)}
.rf-panel{border:1px solid var(--rf-line);border-radius:var(--rf-r-panel);background:var(--rf-warm-glow),var(--rf-surface);padding:clamp(24px,4vw,48px)}

.rf-badge{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:var(--rf-r-pill);font-size:11px;font-weight:600;letter-spacing:.02em;
  background:var(--rf-surface-3);color:var(--rf-muted);border:1px solid var(--rf-line)}
.rf-badge--ok{color:var(--rf-ok);border-color:rgba(52,211,153,.35);background:rgba(52,211,153,.08)}
.rf-badge--warn{color:var(--rf-warn);border-color:rgba(245,194,107,.35);background:rgba(245,194,107,.08)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
}
