:root {
  --coin-color: #C08040;
  --space-8: 8px;
  --space-12: 12px;
  --space-16: 16px;
  --space-20: 20px;
  --radius-panel: 8px;
  --radius-compact: 6px;
  --panel-stack-gap: 2px;
  --panel-padding: 10px;
  --control-height: 42px;
  --control-radius: 8px;
  --page-text: #F0F0F0;
  --page-bg:
    radial-gradient(circle at top left, rgba(64, 128, 192, 0.16), transparent 26%),
    linear-gradient(180deg, #181818 0%, #202428 100%);
  --page-kicker: #C08040;
  --surface: rgba(32, 36, 40, 0.94);
  --surface-border: rgba(64, 128, 192, 0.22);
  --surface-shadow: 0 22px 54px rgba(0, 0, 0, 0.34);
  --surface-muted: rgba(48, 56, 64, 0.72);
  --surface-raised: rgba(48, 56, 64, 0.92);
  --shadow-subtle: 0 8px 18px rgba(0, 0, 0, 0.24);
  --shadow-panel: var(--surface-shadow);
  --text-muted: #C0C0C0;
  --text: var(--page-text);
  --muted: var(--text-muted);
  --border: var(--surface-border);
  --accent: #C08040;
  --accent-text: #181818;
  --accent-soft: rgba(192, 128, 64, 0.24);
  --page-text-muted: var(--text-muted);
  --sidebar-bg: #181818;
  --sidebar-surface: #202020;
  --sidebar-text: #F0F0F0;
  --sidebar-active-bg: #C08040;
  --sidebar-active-text: #181818;
  --sidebar-muted: rgba(240, 240, 240, 0.58);
  --control-bg: #181818;
  --control-border: rgba(64, 128, 192, 0.28);
  --control-focus: rgba(192, 128, 64, 0.32);
  --button-min-height: 42px;
  --button-padding-y: 10px;
  --button-padding-x: 16px;
  --button-radius: 14px;
  --button-font-size: 0.92rem;
  --button-font-weight: 800;
  --button-bg: var(--control-bg);
  --button-text: var(--page-text);
  --button-border: var(--control-border);
  --button-primary-bg: #C08040;
  --button-primary-text: #181818;
  --button-secondary-bg: #4080C0;
  --button-secondary-text: #FFFFFF;
  --button-ghost-bg: rgba(48, 56, 64, 0.9);
  --button-ghost-text: var(--page-text);
  --button-hover-bg: #202428;
  --button-hover-border: var(--button-primary-bg);
  --button-hover-shadow: 0 8px 18px rgba(0, 0, 0, 0.24);
  --button-focus-ring: var(--button-primary-bg);
  --button-focus-offset: 3px;
  --button-danger-bg: #FFF1F2;
  --button-danger-text: #DC2626;
  --button-danger-border: #FCA5A5;
  --color-success: #6BBF7A;
  --color-success-text: #E7F8EA;
  --color-success-soft: rgba(107, 191, 122, 0.16);
  --color-success-border: rgba(107, 191, 122, 0.42);
  --color-warning: #D09050;
  --color-warning-text: #FFE7CC;
  --color-warning-soft: rgba(208, 144, 80, 0.18);
  --color-warning-border: rgba(208, 144, 80, 0.42);
  --color-danger: #E06A6A;
  --color-danger-text: #FEE2E2;
  --color-danger-soft: rgba(224, 106, 106, 0.16);
  --color-danger-border: rgba(224, 106, 106, 0.42);
  --color-info: #4080C0;
  --color-info-text: #EAF4FF;
  --color-info-soft: rgba(64, 128, 192, 0.18);
  --color-info-border: rgba(64, 128, 192, 0.42);
  --color-neutral: #A0A0A0;
  --color-neutral-text: var(--text-muted);
  --color-neutral-soft: rgba(160, 160, 160, 0.14);
  --color-neutral-border: rgba(160, 160, 160, 0.28);
  --package-stat-bg: rgba(32, 36, 40, 0.9);
  --package-stat-border: rgba(64, 128, 192, 0.2);
  --font-mono: "IBM Plex Mono", "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
  --font-heading: "Poppins", sans-serif;
  --font-body: "Poppins", sans-serif;

  --text-display: var(--page-text);
  --text-h2: var(--page-text);
  --text-h3: var(--page-text);
  --text-body: var(--page-text);
  --text-small: var(--text-muted);
  --text-caption: var(--text-muted);
  --font-size-display: 2rem;
  --font-size-h2: 1.5rem;
  --font-size-h3: 1.2rem;
  --font-size-body: 1rem;
  --font-size-small: 0.82rem;
  --font-size-caption: 0.75rem;
}

:root[data-theme="soft-light"] {
  --coin-color: #D97706;
  --page-text: #243044;
  --page-bg: linear-gradient(180deg, #F8FBF8 0%, #EAF4EF 100%);
  --page-kicker: #5F8E72;
  --surface: rgba(255, 255, 255, 0.88);
  --surface-border: rgba(73, 94, 84, 0.14);
  --surface-shadow: 0 14px 34px rgba(76, 93, 86, 0.1);
  --surface-muted: rgba(228, 240, 232, 0.78);
  --surface-raised: #F8FBF8;
  --shadow-subtle: 0 8px 18px rgba(76, 93, 86, 0.12);
  --shadow-panel: var(--surface-shadow);
  --text-muted: #66756F;
  --text: var(--page-text);
  --muted: var(--text-muted);
  --border: var(--surface-border);
  --accent: #4F7B61;
  --accent-text: #FFFFFF;
  --accent-soft: #E4F0E8;
  --page-text-muted: var(--text-muted);
  --sidebar-bg: #F4F8F3;
  --sidebar-surface: #FFFFFF;
  --sidebar-text: #2B3A33;
  --sidebar-active-bg: #DDEDE3;
  --sidebar-active-text: #23352C;
  --sidebar-muted: rgba(43, 58, 51, 0.72);
  --control-bg: #FFFFFF;
  --control-border: rgba(73, 94, 84, 0.18);
  --control-focus: rgba(95, 142, 114, 0.32);
  --button-bg: var(--control-bg);
  --button-text: var(--page-text);
  --button-border: var(--control-border);
  --button-primary-bg: #4F7B61;
  --button-primary-text: #FFFFFF;
  --button-secondary-bg: #2563EB;
  --button-secondary-text: #FFFFFF;
  --button-ghost-bg: #E4F0E8;
  --button-ghost-text: var(--page-text);
  --button-hover-bg: #EEF6F1;
  --button-hover-border: var(--button-primary-bg);
  --button-hover-shadow: 0 8px 18px rgba(76, 93, 86, 0.12);
  --button-focus-ring: var(--button-primary-bg);
  --color-success: #178A5A;
  --color-success-text: #14532D;
  --color-success-soft: #DCFCE7;
  --color-success-border: rgba(22, 163, 74, 0.36);
  --color-warning: #D97706;
  --color-warning-text: #92400E;
  --color-warning-soft: #FEF3C7;
  --color-warning-border: rgba(217, 119, 6, 0.34);
  --color-danger: #DC2626;
  --color-danger-text: #991B1B;
  --color-danger-soft: #FEF2F2;
  --color-danger-border: rgba(220, 38, 38, 0.34);
  --color-info: #2563EB;
  --color-info-text: #1D4ED8;
  --color-info-soft: #DBEAFE;
  --color-info-border: rgba(37, 99, 235, 0.24);
  --color-neutral: #64748B;
  --color-neutral-text: #475569;
  --color-neutral-soft: #F1F5F9;
  --color-neutral-border: #CBD5E1;
  --package-stat-bg: rgba(248, 251, 248, 0.92);
  --package-stat-border: rgba(73, 94, 84, 0.14);
}

:root[data-theme="terminal"] {
  --coin-color: #43F0A4;
  --page-text: #D7FFEB;
  --page-bg:
    radial-gradient(circle at top left, rgba(67, 240, 164, 0.1), transparent 22%),
    linear-gradient(180deg, #010403 0%, #030806 100%);
  --page-kicker: #43F0A4;
  --surface: rgba(4, 14, 10, 0.92);
  --surface-border: rgba(67, 240, 164, 0.28);
  --surface-shadow: 0 28px 72px rgba(0, 0, 0, 0.52);
  --surface-muted: rgba(11, 29, 21, 0.82);
  --surface-raised: #07130E;
  --shadow-subtle: 0 8px 18px rgba(0, 0, 0, 0.32);
  --shadow-panel: var(--surface-shadow);
  --text-muted: #72CFA8;
  --text: var(--page-text);
  --muted: var(--text-muted);
  --border: var(--surface-border);
  --accent: #43F0A4;
  --accent-text: #02110A;
  --accent-soft: #0B1D15;
  --page-text-muted: var(--text-muted);
  --sidebar-bg: #030806;
  --sidebar-surface: #07130E;
  --sidebar-text: #D7FFEB;
  --sidebar-active-bg: #43F0A4;
  --sidebar-active-text: #02110A;
  --sidebar-muted: rgba(114, 207, 168, 0.62);
  --control-bg: #07130E;
  --control-border: rgba(67, 240, 164, 0.3);
  --control-focus: rgba(67, 240, 164, 0.34);
  --button-bg: var(--control-bg);
  --button-text: var(--page-text);
  --button-border: var(--control-border);
  --button-primary-bg: #43F0A4;
  --button-primary-text: #02110A;
  --button-secondary-bg: #27C884;
  --button-secondary-text: #02110A;
  --button-ghost-bg: #0B1D15;
  --button-ghost-text: var(--page-text);
  --button-hover-bg: #0F2A1E;
  --button-hover-border: var(--button-primary-bg);
  --button-hover-shadow: 0 8px 18px rgba(0, 0, 0, 0.32);
  --button-focus-ring: var(--button-primary-bg);
  --color-success: #43F0A4;
  --color-success-text: #D7FFEB;
  --color-success-soft: rgba(67, 240, 164, 0.18);
  --color-success-border: rgba(67, 240, 164, 0.44);
  --color-warning: #FACC15;
  --color-warning-text: #FEF9C3;
  --color-warning-soft: rgba(250, 204, 21, 0.16);
  --color-warning-border: rgba(250, 204, 21, 0.42);
  --color-danger: #F87171;
  --color-danger-text: #FEE2E2;
  --color-danger-soft: rgba(248, 113, 113, 0.16);
  --color-danger-border: rgba(248, 113, 113, 0.44);
  --color-info: #38BDF8;
  --color-info-text: #E0F2FE;
  --color-info-soft: rgba(56, 189, 248, 0.16);
  --color-info-border: rgba(56, 189, 248, 0.42);
  --color-neutral: #72CFA8;
  --color-neutral-text: #72CFA8;
  --color-neutral-soft: rgba(114, 207, 168, 0.12);
  --color-neutral-border: rgba(114, 207, 168, 0.28);
  --package-stat-bg: rgba(3, 8, 6, 0.82);
  --package-stat-border: rgba(67, 240, 164, 0.24);
}
