:root{
  --p-white:#ffffff;
  --p-black:#0f0f10;
  --p-gray-50:#fafafa;
  --p-gray-100:#f4f4f5;
  --p-gray-200:#e4e4e7;
  --p-gray-300:#d4d4d8;
  --p-gray-400:#a1a1aa;
  --p-gray-500:#71717a;
  --p-gray-600:#52525b;
  --p-gray-700:#3f3f46;
  --p-gray-800:#27272a;
  --p-gray-900:#18181b;

  --p-red-500:#b0122a;
  --p-red-600:#8f0f22;
  --p-red-700:#6f0c1a;

  --p-success-600:#1f7a3a;
  --p-warning-600:#b7791f;

  --color-paper:var(--p-white);
  --color-ink:var(--p-black);

  --color-paper-rgb:255,255,255;
  --color-ink-rgb:15,15,16;

  --color-overlay-rgb:var(--color-ink-rgb);
  --color-overlay-inverse-rgb:var(--color-paper-rgb);

  --color-bg:var(--color-paper);
  --color-surface:var(--p-gray-50);
  --color-surface-2:var(--p-gray-100);

  --color-text:var(--color-ink);
  --color-muted:var(--p-gray-600);

  --color-border:var(--p-gray-200);
  --color-border-2:var(--p-gray-300);

  --color-primary:var(--p-red-500);
  --color-primary-hover:var(--p-red-600);
  --color-primary-active:var(--p-red-700);
  --color-primary-contrast:var(--color-paper);

  --color-secondary:var(--color-ink);

  --color-link:var(--color-primary);
  --color-link-hover:var(--color-primary-hover);

  --color-primary-rgb:176,18,42;
  --color-link-rgb:var(--color-primary-rgb);

  --color-focus:var(--color-primary);
  --color-focus-ring:rgba(var(--color-primary-rgb),.28);

  --color-success:var(--p-success-600);
  --color-warning:var(--p-warning-600);
  --color-danger:var(--color-primary);

  --color-success-rgb:31,122,58;
  --color-warning-rgb:183,121,31;
  --color-danger-rgb:176,18,42;

  --color-danger-soft:#fee2e2;

  --text-outline-width:1px;
  --text-outline-color:var(--color-paper);
  --text-outline-shadow:1px 0 0 var(--text-outline-color),-1px 0 0 var(--text-outline-color),0 1px 0 var(--text-outline-color),0 -1px 0 var(--text-outline-color),1px 1px 0 var(--text-outline-color),-1px 1px 0 var(--text-outline-color),1px -1px 0 var(--text-outline-color),-1px -1px 0 var(--text-outline-color);

  --dag-font:var(--font-body,"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif);
  --dag-font-display:var(--font-head,var(--dag-font));
  --dag-font-mono:"Roboto Mono",ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
  --dag-lh:1.6;

  --dag-container:1160px;
  --dag-gutter:18px;
  --dag-gutter-lg:26px;
  --dag-section:64px;

  --dag-bg:var(--color-bg);
  --dag-surface:var(--color-surface);
  --dag-surface-2:var(--color-surface-2);
  --dag-text:var(--color-text);
  --dag-muted:var(--color-muted);
  --dag-border:var(--color-border);

  --dag-primary:var(--color-primary);
  --dag-primary-hover:var(--color-primary-hover);
  --dag-primary-contrast:var(--color-primary-contrast);

  --dag-accent:var(--color-secondary);
  --dag-accent-hover:var(--p-gray-900);
  --dag-accent-contrast:var(--color-paper);

  --dag-link:var(--color-link);
  --dag-link-hover:var(--color-link-hover);

  --dag-danger:var(--color-danger);
  --dag-warning:var(--color-warning);
  --dag-success:var(--color-success);

  --dag-radius-sm:12px;
  --dag-radius-md:16px;
  --dag-radius-lg:20px;
  --dag-radius:var(--dag-radius-md);

  --dag-shadow-xs:0 1px 1px rgba(var(--color-overlay-rgb),.10);
  --dag-shadow-sm:0 1px 2px rgba(var(--color-overlay-rgb),.12),0 10px 28px rgba(var(--color-overlay-rgb),.10);
  --dag-shadow-md:0 16px 48px rgba(var(--color-overlay-rgb),.16);

  --dag-gap-sm:12px;
  --dag-gap:16px;
  --dag-gap-lg:24px;
  --dag-gap-xl:32px;

  --dag-ring-color:var(--color-focus-ring);
  --dag-ring:0 0 0 4px var(--dag-ring-color);
  --dag-transition:160ms cubic-bezier(.2,.8,.2,1);

  --anim-fast:160ms;
  --anim-med:260ms;
  --anim-slow:420ms;
  --ease-out:cubic-bezier(.2,.8,.2,1);

  --dag-max-prose:72ch;

  --dag-shadow:var(--dag-shadow-sm);

  --bg:var(--dag-bg);
  --surface:var(--dag-surface);
  --surface-2:var(--dag-surface-2);
  --text:var(--dag-text);
  --muted:var(--dag-muted);
  --line:var(--dag-border);
  --border:var(--dag-border);

  --primary:var(--dag-primary);
  --primary-contrast:var(--dag-primary-contrast);
  --accent:var(--dag-accent);

  --brand:var(--dag-link);
  --brand-2:var(--dag-accent);
  --danger:var(--dag-danger);

  --radius:var(--dag-radius-md);
  --shadow:var(--dag-shadow-md);
  --shadow-soft:var(--dag-shadow-sm);

  --container:var(--dag-container);
  --gutter:var(--dag-gutter);

  --ring:var(--dag-ring-color);
}

html[data-theme="modern"]{
  color-scheme:light;
}

@media (max-width:900px){
  :root{
    --dag-section:44px;
    --dag-gutter-lg:18px;
  }
}

@media (max-width:600px){
  :root{
    --dag-section:34px;
    --dag-gutter:16px;
  }
}