/* Copied 1:1 from api.docs/src/css/ds/tokens.css on 2026-10-18. Do not edit here; re-copy from api.docs to fix drift. */
/* api.co.id design system — CSS variables, diturunkan 1:1 dari tokens.json (light = :root, dark = [data-theme="dark"]). */
:root, [data-theme="light"] {
  --primary-50: #F3F2FC;
  --primary-100: #E6E4F8;
  --primary-200: #CDC9F1;
  --primary-300: #ABA5E6;
  --primary-400: #8780D6;
  --primary-500: #5F58BF;
  --primary-600: #2E2A8E;
  --primary-700: #25227A;
  --primary-800: #1D1B62;
  --primary-900: #15144A;
  --neutral-0: #FFFFFF;
  --neutral-50: #F7F7FB;
  --neutral-100: #F0F0F6;
  --neutral-200: #E3E3EC;
  --neutral-300: #CDCDDA;
  --neutral-400: #9C9CB2;
  --neutral-500: #6B6B82;
  --neutral-600: #525268;
  --neutral-700: #3B3B50;
  --neutral-800: #24243A;
  --neutral-900: #16162A;
  --neutral-950: #0C0C1A;
  --bg: #FFFFFF;
  --bg-subtle: #F7F7FB;
  --bg-muted: #F0F0F6;
  --surface: #FFFFFF;
  --surface-raised: #FFFFFF;
  --surface-inverse: #16162A;
  --border: #E3E3EC;
  --border-strong: #CDCDDA;
  --border-control: #8E8EA6;
  --text: #16162A;
  --text-secondary: #525268;
  --text-muted: #6B6B82;
  --text-disabled: #9C9CB2;
  --text-inverse: #FFFFFF;
  --primary: #2E2A8E;
  --primary-hover: #25227A;
  --primary-active: #1D1B62;
  --primary-subtle: #F3F2FC;
  --primary-subtle-hover: #E6E4F8;
  --primary-border: #CDC9F1;
  --primary-text: #2E2A8E;
  --on-primary: #FFFFFF;
  --brand-panel: #1D1B62;
  --on-brand-panel: #FFFFFF;
  --on-brand-panel-muted: #C9C6F4;
  --focus-ring: #2E2A8E1F;
  --focus-border: #2E2A8E;
  --overlay: #0C0C1A8C;
  --success-bg: #ECF8F1;
  --success-border: #A6DCBF;
  --success-text: #0B6B4D;
  --success-solid: #13855F;
  --warning-bg: #FFF6E5;
  --warning-border: #F2CD86;
  --warning-text: #8A4A0B;
  --warning-solid: #D97706;
  --danger-bg: #FDEEEE;
  --danger-border: #F3B5B2;
  --danger-text: #B42318;
  --danger-solid: #C8322B;
  --danger-solid-hover: #A9271F;
  --on-danger: #FFFFFF;
  --info-bg: #EBF3FE;
  --info-border: #A9C8F5;
  --info-text: #1D57B5;
  --info-solid: #2F6FDB;
  --method-get-bg: #E8F1FE;
  --method-get-text: #1D57B5;
  --method-post-bg: #E6F6EE;
  --method-post-text: #0B6B4D;
  --method-put-bg: #FFF3DE;
  --method-put-text: #8A4A0B;
  --method-patch-bg: #F1ECFE;
  --method-patch-text: #5B32B4;
  --method-delete-bg: #FDEEEE;
  --method-delete-text: #B42318;
  --code-bg: #12122A;
  --code-header: #1A1A38;
  --code-border: #2A2A4A;
  --code-text: #E6E7F5;
  --code-comment: #9496BC;
  --code-keyword: #B9B3FF;
  --code-string: #9FE3B4;
  --code-number: #FFC27A;
  --code-property: #8FC3FF;
  --code-function: #F9B4DA;
  --chart-1: #2E2A8E;
  --chart-2: #2F9E8F;
  --chart-3: #E08A1E;
  --chart-grid: #ECECF3;
  --skeleton-base: #EEEEF4;
  --skeleton-shine: #F8F8FC;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-full: 999px;
  --shadow-1: 0 1px 2px rgba(22,22,42,0.06), 0 1px 1px rgba(22,22,42,0.04);
  --shadow-2: 0 4px 12px -2px rgba(22,22,42,0.08), 0 2px 4px rgba(22,22,42,0.04);
  --shadow-3: 0 16px 32px -12px rgba(30,28,98,0.18), 0 4px 8px rgba(22,22,42,0.04);
  --shadow-4: 0 32px 64px -24px rgba(30,28,98,0.28), 0 8px 16px rgba(22,22,42,0.06);
  --shadow-focus: 0 0 0 4px rgba(46,42,142,0.12);
  --motion-fast: 120ms;
  --motion-base: 200ms;
  --motion-slow: 320ms;
  --motion-shimmer: 1600ms;
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ease-enter: cubic-bezier(0, 0, 0.2, 1);
  --ease-exit: cubic-bezier(0.4, 0, 1, 1);
  --bp-mobile: 390px;
  --bp-tablet: 768px;
  --bp-desktop: 1440px;
  --container-max: 1200px;
  --container-narrow: 720px;
  --sidebar-width: 256px;
  --sidebar-collapsed: 72px;
  --header-height: 68px;
  --touch-target: 44px;
  --icon-sm: 16px;
  --icon-md: 20px;
  --icon-lg: 24px;
  --icon-stroke: 1.5;
  --z-sticky: 20;
  --z-dropdown: 30;
  --z-overlay: 40;
  --z-modal: 50;
  --z-toast: 60;
  --z-tour: 70;
  --font-sans: "Plus Jakarta Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}
[data-theme="dark"] {
  --bg: #0C0C1A;
  --bg-subtle: #111124;
  --bg-muted: #1A1A30;
  --surface: #14142A;
  --surface-raised: #1C1C36;
  --surface-inverse: #F0F0F6;
  --border: #2A2A46;
  --border-strong: #3C3C5C;
  --border-control: #6E6E8C;
  --text: #EDEDF5;
  --text-secondary: #B6B6CA;
  --text-muted: #8E8EA8;
  --text-disabled: #5E5E78;
  --text-inverse: #16162A;
  --primary: #8F89EC;
  --primary-hover: #A6A1F2;
  --primary-active: #BDB9F6;
  --primary-subtle: #211F48;
  --primary-subtle-hover: #2B2960;
  --primary-border: #3E3A86;
  --primary-text: #ABA6F5;
  --on-primary: #100F33;
  --brand-panel: #15144A;
  --on-brand-panel: #FFFFFF;
  --on-brand-panel-muted: #C9C6F4;
  --focus-ring: #8F89EC40;
  --focus-border: #8F89EC;
  --overlay: #000000A6;
  --success-bg: #0E2A1F;
  --success-border: #1E5A42;
  --success-text: #6FD9A8;
  --success-solid: #3DBF85;
  --warning-bg: #2C2008;
  --warning-border: #6B4A12;
  --warning-text: #F5C063;
  --warning-solid: #F5A524;
  --danger-bg: #361415;
  --danger-border: #7A2A2A;
  --danger-text: #FF8F86;
  --danger-solid: #F06A62;
  --danger-solid-hover: #F5857E;
  --on-danger: #1A0606;
  --info-bg: #0F213C;
  --info-border: #244679;
  --info-text: #8AB8FF;
  --info-solid: #5B9BFF;
  --method-get-bg: #13284A;
  --method-get-text: #8AB8FF;
  --method-post-bg: #0F2E22;
  --method-post-text: #6FD9A8;
  --method-put-bg: #33240A;
  --method-put-text: #F5C063;
  --method-patch-bg: #261B47;
  --method-patch-text: #C3A8FF;
  --method-delete-bg: #361415;
  --method-delete-text: #FF8F86;
  --code-bg: #0A0A16;
  --code-header: #12122A;
  --code-border: #24243E;
  --code-text: #E6E7F5;
  --code-comment: #9496BC;
  --code-keyword: #B9B3FF;
  --code-string: #9FE3B4;
  --code-number: #FFC27A;
  --code-property: #8FC3FF;
  --code-function: #F9B4DA;
  --chart-1: #8F89EC;
  --chart-2: #4FD1BE;
  --chart-3: #F5A524;
  --chart-grid: #24243E;
  --skeleton-base: #1C1C34;
  --skeleton-shine: #26264A;
  --shadow-1: 0 1px 2px rgba(0,0,0,0.5);
  --shadow-2: 0 4px 12px -2px rgba(0,0,0,0.55);
  --shadow-3: 0 16px 32px -12px rgba(0,0,0,0.65);
  --shadow-4: 0 32px 64px -24px rgba(0,0,0,0.75);
  --shadow-focus: 0 0 0 4px rgba(143,137,236,0.25);
  color-scheme: dark;
}