/* Shared StockRatingFeed tokens, adapted from the supplied design reference. */
:root{
  /* ---- base / color / neutral (hue 270, chroma ≈0.005) ---- */
  --srf-neutral-0:#ffffff; --srf-neutral-50:#f7f7f8; --srf-neutral-100:#efeff1; --srf-neutral-200:#e2e2e6;
  --srf-neutral-300:#c9c9cf; --srf-neutral-400:#a3a3ab; --srf-neutral-500:#7a7a84; --srf-neutral-600:#5c5c66;
  --srf-neutral-700:#44444d; --srf-neutral-800:#2d2d34; --srf-neutral-900:#1c1c21; --srf-neutral-950:#111114;
  /* ---- base / color / accent (oklch hue 265) ---- */
  --srf-accent-50:#eef1fd; --srf-accent-100:#dde3fb; --srf-accent-200:#bcc8f6; --srf-accent-300:#8fa3ee;
  --srf-accent-400:#5f78e3; --srf-accent-500:#3d55d1; --srf-accent-600:#2f43b4; --srf-accent-700:#27378f;
  --srf-accent-800:#1f2b6b; --srf-accent-900:#172050;
  /* ---- base / color / signal ---- */
  --srf-green-100:#e3f3ea; --srf-green-300:#9bd3b2; --srf-green-600:#1f7a43; --srf-green-700:#17603a;
  --srf-amber-100:#fcefd6; --srf-amber-300:#f0c777; --srf-amber-600:#9a6508; --srf-amber-700:#7a4f06;
  --srf-red-100:#fbe6e6;   --srf-red-300:#efa6a6;   --srf-red-600:#b32f2f;   --srf-red-700:#8f2424;
  /* ---- base / typography ---- */
  --srf-font-sans:"Onest",system-ui,-apple-system,"Segoe UI",sans-serif;
  --srf-font-mono:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --srf-text-xs:12px; --srf-text-sm:13px; --srf-text-md:14px; --srf-text-lg:16px; --srf-text-xl:18px;
  --srf-text-2xl:22px; --srf-text-3xl:28px; --srf-text-4xl:36px; --srf-text-5xl:48px; --srf-text-6xl:64px;
  --srf-leading-tight:1.15; --srf-leading-snug:1.3; --srf-leading-normal:1.5; --srf-leading-relaxed:1.65;
  --srf-weight-regular:400; --srf-weight-medium:500; --srf-weight-semibold:600; --srf-weight-bold:700;
  --srf-tracking-tight:-0.015em; --srf-tracking-wide:0.04em;
  /* ---- base / space (4px grid) ---- */
  --srf-space-0:0; --srf-space-1:4px; --srf-space-2:8px; --srf-space-3:12px; --srf-space-4:16px; --srf-space-5:20px;
  --srf-space-6:24px; --srf-space-8:32px; --srf-space-10:40px; --srf-space-12:48px; --srf-space-16:64px;
  --srf-space-20:80px; --srf-space-24:96px;
  /* ---- base / shape ---- */
  --srf-radius-sm:2px; --srf-radius-md:4px; --srf-radius-lg:6px; --srf-radius-full:999px;
  --srf-border-1:1px; --srf-border-2:2px;
  --srf-shadow-sm:0 1px 2px rgba(17,17,20,.06);
  --srf-shadow-md:0 4px 12px rgba(17,17,20,.10);
  --srf-shadow-lg:0 16px 40px rgba(17,17,20,.18);
  /* ---- base / layers ---- */
  --srf-z-sticky:100; --srf-z-dropdown:200; --srf-z-drawer:300; --srf-z-modal:400; --srf-z-toast:500;
  /* ---- base / motion ---- */
  --srf-duration-fast:120ms; --srf-duration-base:200ms; --srf-duration-slow:320ms;
  --srf-ease-standard:cubic-bezier(.2,0,0,1); --srf-ease-exit:cubic-bezier(.4,0,1,1);
  /* ---- base / breakpoints (reference values; media queries must use literals) ---- */
  --srf-bp-sm:640px; --srf-bp-md:900px; --srf-bp-lg:1200px; --srf-bp-xl:1600px;
  /* ---- base / sizes ---- */
  --srf-size-control-sm:28px; --srf-size-control-md:36px; --srf-size-control-lg:44px;
  --srf-size-sidebar:232px; --srf-size-topbar:52px;
  --srf-size-content-max:1280px; --srf-size-form-max:760px; --srf-size-reading-max:72ch; --srf-size-public-max:1120px;

  /* ======== semantic ======== */
  --bg-page:var(--srf-neutral-50); --bg-surface:var(--srf-neutral-0); --bg-subtle:var(--srf-neutral-100);
  --bg-muted:var(--srf-neutral-200); --bg-inverse:var(--srf-neutral-950); --bg-overlay:rgba(17,17,20,.48);
  --fg-primary:var(--srf-neutral-950); --fg-secondary:var(--srf-neutral-600); --fg-muted:var(--srf-neutral-500);
  --fg-disabled:var(--srf-neutral-400); --fg-inverse:var(--srf-neutral-0); --fg-inverse-muted:var(--srf-neutral-400);
  --fg-link:var(--srf-accent-600); --fg-link-hover:var(--srf-accent-800);
  --border-default:var(--srf-neutral-200); --border-strong:var(--srf-neutral-300); --border-inverse:var(--srf-neutral-700);
  --accent-bg:var(--srf-accent-500); --accent-bg-hover:var(--srf-accent-600); --accent-bg-active:var(--srf-accent-700);
  --accent-fg:var(--srf-neutral-0); --accent-subtle-bg:var(--srf-accent-50); --accent-subtle-fg:var(--srf-accent-700);
  --accent-subtle-border:var(--srf-accent-200);
  --focus-ring:0 0 0 2px var(--bg-surface),0 0 0 4px var(--srf-accent-500);
  --focus-ring-inverse:0 0 0 2px var(--bg-inverse),0 0 0 4px var(--srf-accent-300);
  --status-success-bg:var(--srf-green-100); --status-success-fg:var(--srf-green-700); --status-success-border:var(--srf-green-300); --status-success-solid:var(--srf-green-600);
  --status-warning-bg:var(--srf-amber-100); --status-warning-fg:var(--srf-amber-700); --status-warning-border:var(--srf-amber-300); --status-warning-solid:var(--srf-amber-600);
  --status-danger-bg:var(--srf-red-100);   --status-danger-fg:var(--srf-red-700);   --status-danger-border:var(--srf-red-300);   --status-danger-solid:var(--srf-red-600);
  --status-info-bg:var(--srf-accent-50);   --status-info-fg:var(--srf-accent-700);  --status-info-border:var(--srf-accent-200); --status-info-solid:var(--srf-accent-500);
  --status-neutral-bg:var(--srf-neutral-100); --status-neutral-fg:var(--srf-neutral-600); --status-neutral-border:var(--srf-neutral-300); --status-neutral-solid:var(--srf-neutral-500);
  --table-header-bg:var(--srf-neutral-50); --table-row-hover:var(--srf-neutral-50); --table-row-selected:var(--srf-accent-50);
  --code-bg:var(--srf-neutral-950); --code-fg:#e6e6ea; --code-key:#a9bbf7; --code-string:#b9dcb3; --code-number:#f2c98a; --code-muted:#7a7a84;
}