:root {
    --np-neutral-1: 250 250 250;
    --np-neutral-2: 244 244 245;
    --np-neutral-3: 228 228 231;
    --np-neutral-4: 212 212 216;
    --np-neutral-5: 161 161 170;
    --np-neutral-6: 113 113 122;
    --np-neutral-7: 82 82 91;
    --np-neutral-8: 63 63 70;
    --np-neutral-9: 46 46 51;
    --np-neutral-10: 39 39 42;
    --np-neutral-11: 32 32 34;
    --np-neutral-12: 24 24 27;
    --np-neutral-13: 9 9 11;

    --np-red-1: 254 242 242;
    --np-red-2: 254 226 226;
    --np-red-3: 254 202 202;
    --np-red-4: 252 165 165;
    --np-red-5: 248 113 113;
    --np-red-6: 239 68 68;
    --np-red-7: 220 38 38;
    --np-red-8: 185 28 28;
    --np-red-9: 153 27 27;
    --np-red-10: 127 29 29;
    --np-red-11: 69 10 10;

    --np-amber-1: 255 251 235;
    --np-amber-2: 254 243 199;
    --np-amber-3: 253 230 138;
    --np-amber-4: 252 211 77;
    --np-amber-5: 251 191 36;
    --np-amber-6: 245 158 11;
    --np-amber-7: 217 119 6;
    --np-amber-8: 180 83 9;
    --np-amber-9: 146 64 14;
    --np-amber-10: 120 53 15;
    --np-amber-11: 69 26 3;

    --np-green-1: 240 253 244;
    --np-green-2: 220 252 231;
    --np-green-3: 187 247 208;
    --np-green-4: 134 239 172;
    --np-green-5: 74 222 128;
    --np-green-6: 34 197 94;
    --np-green-7: 22 163 74;
    --np-green-8: 21 128 61;
    --np-green-9: 22 101 52;
    --np-green-10: 20 83 45;
    --np-green-11: 5 46 22;

    --np-yellow-1: 254 249 195;
    --np-yellow-2: 254 240 138;
    --np-yellow-3: 250 204 21;
    --np-yellow-4: 161 98 7;
    --np-yellow-5: 133 77 14;
    --np-yellow-6: 113 63 18;

    --np-accent-1: 238 242 255;
    --np-accent-2: 224 231 255;
    --np-accent-3: 199 210 254;
    --np-accent-4: 165 180 252;
    --np-accent-5: 129 140 248;
    --np-accent-6: 99 102 241;
    --np-accent-7: 79 70 229;
    --np-accent-8: 67 56 202;
    --np-accent-9: 55 48 163;
    --np-accent-10: 49 46 129;
    --np-accent-11: 30 27 75;

    --np-rose-1: 253 164 175;
    --np-rose-2: 244 63 94;
    --np-rose-3: 225 29 72;
    --np-rose-4: 190 18 60;

    --np-blue-1: 219 234 254;
    --np-blue-2: 96 165 250;
    --np-blue-3: 37 99 235;
    --np-blue-4: 30 58 138;

    --np-orange-1: 255 237 213;
    --np-orange-2: 251 146 60;
    --np-orange-3: 234 88 12;
    --np-orange-4: 124 45 18;

    --np-purple-1: 243 232 255;
    --np-purple-2: 192 132 252;
    --np-purple-3: 147 51 234;
    --np-purple-4: 88 28 135;

    --np-sky-1: 224 242 254;
    --np-sky-2: 56 189 248;
    --np-sky-3: 2 132 199;
    --np-sky-4: 12 74 110;

    --np-neutral-0: 255 255 255;

    --np-btn-secondary-bg-hover: rgb(var(--np-neutral-10));
    --np-btn-secondary-border: rgb(var(--np-neutral-12) / 0.1);

    --np-btn-primary-bg-active: rgb(var(--np-neutral-2));

    --np-btn-danger-bg-hover: rgb(var(--np-red-1));
    --np-btn-danger-bg-active: rgb(var(--np-red-2));
    --np-btn-danger-border-hover: rgb(var(--np-red-4));

    --np-btn-warning-bg-hover: rgb(var(--np-amber-1));
    --np-btn-warning-bg-active: rgb(var(--np-amber-2));
    --np-btn-warning-border: rgb(var(--np-amber-3));
    --np-btn-warning-border-hover: rgb(var(--np-amber-4));

    --np-btn-ghost-bg: transparent;
    --np-btn-ghost-bg-active: rgb(var(--np-neutral-3));

    --np-btn-focus-ring-danger: rgb(var(--np-red-6));

    --np-btn-option-active-bg: rgb(var(--np-accent-1));
    --np-btn-option-active-border: rgb(var(--np-accent-5));

    --np-btn-success-bg-hover: rgb(var(--np-green-1));
    --np-btn-success-bg-active: rgb(var(--np-green-2));
    --np-btn-success-text-hover: rgb(var(--np-green-8));
    --np-btn-success-border: rgb(var(--np-green-3));
    --np-btn-success-border-hover: rgb(var(--np-green-4));

    --np-input-bg: rgb(var(--np-neutral-2));
    --np-input-bg-inset: rgb(var(--np-neutral-3));
    --np-input-border: rgb(var(--np-neutral-3));

    --np-success-soft: rgb(var(--np-green-2));
    --np-chip-danger-text: rgb(var(--np-red-8));
    --np-chip-warning-bg: rgb(var(--np-amber-2));
    --np-chip-warning-text: rgb(var(--np-amber-8));

    --np-text-muted: rgb(var(--np-neutral-8));

    --np-count-bubble-bg: rgb(var(--np-accent-6));

    --np-switch-thumb: rgb(var(--np-neutral-0));

    --np-toggle-thumb: rgb(var(--np-neutral-0));
    --np-toggle-text: rgb(var(--np-neutral-5));

    --np-progress-bar: rgb(var(--np-accent-6));

    --np-ink: rgb(var(--np-neutral-12));
    --np-text-body: rgb(var(--np-neutral-8));
    --np-text-faint: rgb(var(--np-neutral-5));
    --np-text-hover: rgb(var(--np-neutral-8));
    --np-text-accent: rgb(var(--np-accent-6));

    --np-border: rgb(var(--np-neutral-3));
    --np-card-divider: rgb(var(--np-neutral-3));

    --np-surface-muted: rgb(var(--np-neutral-2));
    --np-stat-bg: var(--np-surface-muted);

    --np-card-bg: rgb(var(--np-neutral-2));

    --np-popover-bg: rgb(var(--np-neutral-0));

    --np-menu-danger: rgb(var(--np-red-6));
    --np-menu-danger-hover: rgb(var(--np-red-7));

    --np-chip-success-dot: rgb(var(--np-green-6));
    --np-chip-warning-dot: rgb(var(--np-amber-6));

    --np-base: rgb(var(--np-neutral-0));
    --np-overlay-border: rgb(var(--np-neutral-3) / 0.8);

    --np-drawer-border: rgb(var(--np-neutral-3) / 0.6);

    --np-sheet-bg: rgb(var(--np-neutral-0) / 0.95);
    --np-sheet-border: rgb(var(--np-neutral-3) / 0.6);

    --np-panel-bg: rgb(var(--np-neutral-0));
    --np-panel-border: rgb(var(--np-neutral-3) / 0.4);
    --np-picker-sidebar-bg: rgb(var(--np-neutral-1));

    --np-frame-bg: rgb(var(--np-neutral-0));
    --np-frame-border: rgb(var(--np-neutral-3) / 0.5);

    --np-faint: rgb(var(--np-neutral-4));
    --np-text-secondary: rgb(var(--np-neutral-7));
    --np-text-emphasis: rgb(var(--np-neutral-10));
    --np-text-list: rgb(var(--np-neutral-7));
    --np-text-selected: rgb(var(--np-neutral-12));

    --np-icon-empty: rgb(var(--np-neutral-5));

    --np-accent-strong: rgb(var(--np-accent-7));
    --np-accent-strong-hover: rgb(var(--np-accent-8));
    --np-accent-soft-bg: rgb(var(--np-accent-1));

    --np-accent-soft: rgb(var(--np-accent-2));

    --np-surface: rgb(var(--np-neutral-2));

    --np-warn-box-bg: rgb(var(--np-amber-1));
    --np-warn-box-border: rgb(var(--np-amber-3));

    --np-input-focus-ring: rgb(var(--np-accent-4));

    --np-warn-note-border: rgb(var(--np-amber-4) / 0.5);
    --np-warn-note-bg: rgb(var(--np-amber-1));
    --np-warn-note-text: rgb(var(--np-amber-9));

    --np-drag-overlay-bg: rgb(var(--np-neutral-0) / 0.95);
    --np-drag-border: rgb(var(--np-accent-5));

    --np-upload-box-bg: var(--np-input-bg);

    --np-svg-invert: invert(1);

    --np-user-avatar-bg: rgb(var(--np-neutral-4));

    --np-dropzone-border: rgb(var(--np-neutral-4));

    --np-error-item-bg: rgb(var(--np-red-1));

    --np-cal-bg: rgb(var(--np-neutral-0));
    --np-cal-border: rgb(var(--np-neutral-3) / 0.4);
    --np-cal-tip-bg: rgb(var(--np-neutral-0));
    --np-cal-post-bg: rgb(var(--np-neutral-1));
    --np-cal-post-hover: rgb(var(--np-neutral-3));
    --np-cal-today-bg: rgb(var(--np-accent-4));
    --np-cal-today-bg-hover: rgb(var(--np-accent-5));
    --np-cal-today-text: rgb(var(--np-accent-8));

    --np-bar-fill: rgb(var(--np-neutral-2));
    --np-bar-hover: rgb(var(--np-neutral-2) / 0.5);

    --np-active-box-bg: rgb(var(--np-neutral-0));

    --np-dp-focus-ring: rgb(var(--np-neutral-5) / 0.2);

    --np-editor-title: rgb(var(--np-neutral-12));
    --np-editor-row-hover: rgb(var(--np-neutral-2));

    --np-list-bg: rgb(var(--np-neutral-2));
    --np-list-border: rgb(var(--np-neutral-3) / 0.6);
    --np-list-divider: rgb(var(--np-neutral-3) / 0.4);
    --np-inset-bg: rgb(var(--np-neutral-3) / 0.4);
    --np-inset-solid: rgb(var(--np-neutral-3) / 1);
    --np-hero-fade: linear-gradient(to top, rgb(var(--np-neutral-0) / 0.6) 0%, rgb(var(--np-neutral-0) / 0.25) 50%, transparent 100%);

    --np-row-hover: rgb(var(--np-neutral-1));

    --np-success-soft-bg: rgb(var(--np-green-1));
    --np-success-icon: rgb(var(--np-green-7));
    --np-success-border: rgb(var(--np-green-3));
    --np-success-strong: rgb(var(--np-green-9));

    --np-tone-danger-bg: rgb(var(--np-red-2));
    --np-tone-danger-text: rgb(var(--np-red-7));
    --np-tone-warning-bg: rgb(var(--np-amber-2));
    --np-tone-warning-text: rgb(var(--np-amber-7));

    --np-tile-bg: rgb(var(--np-neutral-1));

    --np-code-bg: rgb(var(--np-neutral-1));

    --np-head-border: rgb(var(--np-neutral-3) / 0.4);

    --np-avatar-initial-bg: rgb(var(--np-neutral-8));

    --np-tax-bg: rgb(var(--np-accent-1));
    --np-tax-text: rgb(var(--np-accent-8));
    --np-tax-bg-hover: rgb(var(--np-accent-2));

    --np-logo-border: rgb(var(--np-neutral-0));

    --np-mod-ok-bg: rgb(var(--np-green-2));
    --np-mod-ok-text: rgb(var(--np-green-8));
    --np-mod-ok-border: rgb(var(--np-green-3));
    --np-mod-pending-bg: rgb(var(--np-yellow-1));
    --np-mod-pending-text: rgb(var(--np-yellow-4));
    --np-mod-pending-border: rgb(var(--np-yellow-2));
    --np-danger-soft: rgb(var(--np-red-2));
    --np-mod-spam-text: rgb(var(--np-red-8));
    --np-mod-spam-border: rgb(var(--np-red-3));
    --np-mod-trash-text: rgb(var(--np-neutral-8));

    --np-danger-banner-bg: rgb(var(--np-red-1));
    --np-danger-banner-border: rgb(var(--np-red-3) / 0.5);
    --np-danger-banner-title: rgb(var(--np-red-10));
    --np-danger-banner-text: rgb(var(--np-red-9));

    --np-settings-bg: rgb(var(--np-neutral-1));

    --np-link-btn-bg-hover: rgb(var(--np-neutral-1));

    --np-card-soft-bg: rgb(var(--np-neutral-2));
    --np-card-soft-border: rgb(var(--np-neutral-3) / 0.6);
    --np-card-soft-hover: rgb(var(--np-neutral-1));

    --np-divider-soft: rgb(var(--np-neutral-3) / 0.4);

    --np-danger-soft-bg: rgb(var(--np-red-1));

    --np-surface-inset: rgb(var(--np-neutral-1));

    --np-bg: rgb(var(--np-neutral-2));

    --np-search-active: rgb(var(--np-accent-2));

    --np-border-strong: rgb(var(--np-neutral-3));

    --np-notif-dot-bg: rgb(var(--np-rose-3));

    --np-badge-blue-bg: rgb(var(--np-blue-1));
    --np-badge-blue-text: rgb(var(--np-blue-3));
    --np-badge-orange-bg: rgb(var(--np-orange-1));
    --np-badge-orange-text: rgb(var(--np-orange-3));
    --np-badge-purple-bg: rgb(var(--np-purple-1));
    --np-badge-purple-text: rgb(var(--np-purple-3));
    --np-badge-sky-bg: rgb(var(--np-sky-1));
    --np-badge-sky-text: rgb(var(--np-sky-3));

    --np-menu-bg: rgb(var(--np-neutral-0));
    --np-menu-hover: rgb(var(--np-neutral-2));
    --np-menu-active: rgb(var(--np-neutral-2));
    --np-menu-name: rgb(var(--np-neutral-5));
    --np-ink-strong: rgb(var(--np-neutral-12));
    --np-menu-name-active: rgb(var(--np-neutral-13));
    --np-menu-badge-bg: rgb(var(--np-accent-5) / 0.1);
    --np-menu-badge-text: rgb(var(--np-accent-8));
    --np-menu-badge-border: rgb(var(--np-accent-7));
    --np-menu-badge-min-bg: rgb(var(--np-accent-6));

    --np-submenu-text-hover: rgb(var(--np-neutral-13));

    --np-site-bg: rgb(var(--np-neutral-2));

    --np-mark-bg: rgb(var(--np-accent-3));
    --np-mark-text: rgb(var(--np-accent-10));

    --np-menu-result-hover: rgb(var(--np-neutral-1));

    --np-avatar-bg: rgb(var(--np-neutral-8));
    --np-avatar-bg-hover: rgb(var(--np-neutral-7));
    --np-avatar-ring: rgb(var(--np-accent-4));

    --np-shadow-xs: 0 1px 2px 0 rgb(var(--np-neutral-13) / 0.05);
    --np-shadow-sm: 0 1px 3px 0 rgb(var(--np-neutral-13) / 0.1), 0 1px 2px -1px rgb(var(--np-neutral-13) / 0.1);
    --np-shadow-md: 0 4px 6px -1px rgb(var(--np-neutral-13) / 0.1), 0 2px 4px -2px rgb(var(--np-neutral-13) / 0.1);
    --np-shadow-lg: 0 10px 15px -3px rgb(var(--np-neutral-13) / 0.1), 0 4px 6px -4px rgb(var(--np-neutral-13) / 0.1);
    --np-shadow-xl: 0 20px 25px -5px rgb(var(--np-neutral-13) / 0.1), 0 8px 10px -6px rgb(var(--np-neutral-13) / 0.1);
    --np-shadow-2xl: 0 25px 50px -12px rgb(var(--np-neutral-13) / 0.25);

    --np-transition-duration: 200ms;
    --np-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);

    --np-mono-font-family: SFMono-Regular, "Menlo", "Monaco", "Consolas", "Liberation Mono", "Courier New", monospace;
    --np-mono-font-feature-settings: normal;
    --np-mono-font-variation-settings: normal;

    --np-font-sans: system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";

    --np-body-height: calc(100vh - var(--nextpress-toolbar-height) - 30px);

    --dp-common-transition: all .1s ease-in;
    --dp-menu-padding: 8px;
    --dp-font-family: -apple-system, blinkmacsystemfont, "Segoe UI", roboto, oxygen, ubuntu, cantarell, "Open Sans", "Helvetica Neue", sans-serif;
    --dp-border-radius: 16px;
    --dp-cell-border-radius: 100px;
    --dp-button-height: 35px;
    --dp-month-year-row-height: 35px;
    --dp-month-year-row-button-size: 25px;
    --dp-button-icon-height: 20px;
    --dp-cell-size: 35px;
    --dp-cell-padding: 5px;
    --dp-common-padding: 8px;
    --dp-menu-min-width: 260px;
    --dp-row-margin: 5px 0;
    --dp-overlay-col-padding: 8px;
    --dp-font-size: 1rem;
}

.np-dark {
    --np-btn-secondary-bg-hover: rgb(var(--np-neutral-0));
    --np-btn-secondary-border: rgb(var(--np-neutral-12) / 0.1);
    --np-btn-primary-bg-active: rgb(var(--np-neutral-7));
    --np-btn-danger-bg-hover: rgb(var(--np-red-11) / 0.5);
    --np-btn-danger-bg-active: rgb(var(--np-red-11));
    --np-btn-danger-border-hover: rgb(var(--np-red-9));
    --np-btn-warning-bg-hover: rgb(var(--np-amber-11) / 0.5);
    --np-btn-warning-bg-active: rgb(var(--np-amber-11));
    --np-btn-warning-border: rgb(var(--np-amber-10) / 0.5);
    --np-btn-warning-border-hover: rgb(var(--np-amber-9));
    --np-btn-ghost-bg: transparent;
    --np-btn-ghost-bg-active: rgb(var(--np-neutral-9));
    --np-btn-focus-ring-danger: rgb(var(--np-red-5));
    --np-btn-option-active-bg: rgb(var(--np-accent-11) / 0.5);
    --np-btn-option-active-border: rgb(var(--np-accent-7));
    --np-btn-success-bg-hover: rgb(var(--np-green-11) / 0.5);
    --np-btn-success-bg-active: rgb(var(--np-green-11));
    --np-btn-success-text-hover: rgb(var(--np-green-4));
    --np-btn-success-border: rgb(var(--np-green-9) / 0.5);
    --np-btn-success-border-hover: rgb(var(--np-green-9));

    --np-input-bg: rgb(var(--np-neutral-11));
    --np-input-bg-inset: rgb(var(--np-neutral-11));
    --np-input-border: rgb(var(--np-neutral-8) / 0.4);

    --np-success-soft: rgb(var(--np-green-11) / 0.5);
    --np-chip-danger-text: rgb(var(--np-red-4));
    --np-chip-warning-bg: rgb(var(--np-amber-10) / 0.3);
    --np-chip-warning-text: rgb(var(--np-amber-4));

    --np-text-muted: rgb(var(--np-neutral-5));

    --np-toggle-thumb: rgb(var(--np-neutral-8));
    --np-toggle-text: rgb(var(--np-neutral-5));

    --np-progress-bar: rgb(var(--np-accent-6) / 0.6);

    --np-ink: rgb(var(--np-neutral-2));
    --np-text-body: rgb(var(--np-neutral-4));
    --np-text-faint: rgb(var(--np-neutral-6));
    --np-text-hover: rgb(var(--np-neutral-3));
    --np-text-accent: rgb(var(--np-accent-5));

    --np-border: rgb(var(--np-neutral-8));

    --np-surface-muted: rgb(var(--np-neutral-10));
    --np-stat-bg: rgb(var(--np-neutral-10) / 0.4);

    --np-card-bg: rgb(var(--np-neutral-10) / 0.3);

    --np-popover-bg: rgb(var(--np-neutral-11) / 1);

    --np-menu-danger-hover: rgb(var(--np-red-5));

    --np-chip-success-dot: rgb(var(--np-green-5));
    --np-chip-warning-dot: rgb(var(--np-amber-5));

    --np-base: rgb(var(--np-neutral-12));
    --np-overlay-border: rgb(var(--np-neutral-8) / 0.4);

    --np-drawer-border: rgb(var(--np-neutral-10));

    --np-sheet-bg: rgb(var(--np-neutral-12) / 0.95);
    --np-sheet-border: rgb(var(--np-neutral-8) / 0.5);

    --np-panel-bg: rgb(var(--np-neutral-10) / 0.3);
    --np-panel-border: rgb(var(--np-neutral-8) / 0.3);
    --np-picker-sidebar-bg: rgb(var(--np-neutral-10) / 0.55);

    --np-frame-bg: rgb(var(--np-neutral-10) / 0.3);
    --np-frame-border: rgb(var(--np-neutral-8) / 0.3);

    --np-faint: rgb(var(--np-neutral-7));
    --np-text-secondary: rgb(var(--np-neutral-5));
    --np-text-emphasis: rgb(var(--np-neutral-3));
    --np-text-list: rgb(var(--np-neutral-5));
    --np-text-selected: rgb(var(--np-neutral-0));

    --np-icon-empty: rgb(var(--np-neutral-7));

    --np-accent-strong: rgb(var(--np-accent-5));
    --np-accent-strong-hover: rgb(var(--np-accent-4));
    --np-accent-soft-bg: rgb(var(--np-accent-11) / 0.4);

    --np-accent-soft: rgb(var(--np-accent-10) / 0.5);

    --np-surface: rgb(var(--np-neutral-10));

    --np-warn-box-bg: rgb(var(--np-amber-10) / 0.2);
    --np-warn-box-border: rgb(var(--np-amber-9));

    --np-input-focus-ring: rgb(var(--np-accent-8));

    --np-warn-note-border: rgb(var(--np-amber-8) / 0.4);
    --np-warn-note-bg: rgb(var(--np-amber-11) / 0.3);
    --np-warn-note-text: rgb(var(--np-amber-4));

    --np-drag-overlay-bg: rgb(var(--np-neutral-13) / 0.8);
    --np-drag-border: rgb(var(--np-accent-6));

    --np-upload-box-bg: var(--np-input-bg);

    --np-svg-invert: none;

    --np-user-avatar-bg: rgb(var(--np-neutral-10));

    --np-dropzone-border: rgb(var(--np-neutral-8));

    --np-error-item-bg: rgb(var(--np-red-10) / 0.2);

    --np-cal-bg: rgb(var(--np-neutral-13) / 0.4);
    --np-cal-border: rgb(var(--np-neutral-8) / 0.2);
    --np-cal-tip-bg: rgb(var(--np-neutral-13));
    --np-cal-post-bg: rgb(var(--np-neutral-8) / 0.3);
    --np-cal-post-hover: rgb(var(--np-neutral-8) / 0.5);
    --np-cal-today-bg: rgb(var(--np-accent-10) / 0.6);
    --np-cal-today-bg-hover: rgb(var(--np-accent-10) / 0.4);
    --np-cal-today-text: rgb(var(--np-accent-4));

    --np-bar-fill: rgb(var(--np-neutral-8) / 0.2);
    --np-bar-hover: rgb(var(--np-neutral-8) / 0.2);

    --np-active-box-bg: rgb(var(--np-neutral-10) / 0.4);

    --np-dp-focus-ring: rgb(var(--np-neutral-6) / 0.2);

    --np-editor-title: rgb(var(--np-neutral-3));
    --np-editor-row-hover: rgb(var(--np-neutral-10) / 0.5);

    --np-list-bg: rgb(var(--np-neutral-10) / 0.5);
    --np-list-border: rgb(var(--np-neutral-8) / 0.4);
    --np-list-divider: rgb(var(--np-neutral-10) / 0.3);
    --np-inset-bg: rgb(var(--np-neutral-10) / 0.5);
    --np-inset-solid: rgb(var(--np-neutral-10) / 1);
    --np-hero-fade: linear-gradient(to top, rgb(var(--np-neutral-13) / 0.5) 0%, rgb(var(--np-neutral-13) / 0.2) 50%, transparent 100%);
    --np-card-divider: rgb(var(--np-neutral-11));

    --np-row-hover: rgb(var(--np-neutral-10) / 0.5);

    --np-success-soft-bg: rgb(var(--np-green-11) / 0.4);
    --np-success-icon: rgb(var(--np-green-5));
    --np-success-border: rgb(var(--np-green-10) / 0.5);
    --np-success-strong: rgb(var(--np-green-4));

    --np-tone-danger-bg: rgb(var(--np-red-11) / 0.5);
    --np-tone-danger-text: rgb(var(--np-red-5));
    --np-tone-warning-bg: rgb(var(--np-amber-11) / 0.5);
    --np-tone-warning-text: rgb(var(--np-amber-5));

    --np-tile-bg: rgb(var(--np-neutral-10) / 0.3);

    --np-code-bg: rgb(var(--np-neutral-12));

    --np-head-border: rgb(var(--np-neutral-10) / 0.6);

    --np-avatar-initial-bg: rgb(var(--np-accent-8));

    --np-tax-bg: rgb(var(--np-accent-11));
    --np-tax-text: rgb(var(--np-accent-4));
    --np-tax-bg-hover: rgb(var(--np-accent-10));

    --np-logo-border: rgb(var(--np-neutral-7));

    --np-mod-ok-bg: rgb(var(--np-green-10) / 0.3);
    --np-mod-ok-text: rgb(var(--np-green-5));
    --np-mod-ok-border: rgb(var(--np-green-9));
    --np-mod-pending-bg: rgb(var(--np-yellow-6) / 0.3);
    --np-mod-pending-text: rgb(var(--np-yellow-3));
    --np-mod-pending-border: rgb(var(--np-yellow-5));
    --np-danger-soft: rgb(var(--np-red-10) / 0.3);
    --np-mod-spam-text: rgb(var(--np-red-5));
    --np-mod-spam-border: rgb(var(--np-red-9));
    --np-mod-trash-text: rgb(var(--np-neutral-5));

    --np-danger-banner-bg: rgb(var(--np-red-11) / 0.35);
    --np-danger-banner-border: rgb(var(--np-red-8) / 0.5);
    --np-danger-banner-title: rgb(var(--np-red-2));
    --np-danger-banner-text: rgb(var(--np-red-3));

    --np-settings-bg: rgb(var(--np-neutral-10) / 0.5);

    --np-link-btn-bg-hover: rgb(var(--np-neutral-8));

    --np-card-soft-bg: rgb(var(--np-neutral-10) / 0.4);
    --np-card-soft-border: rgb(var(--np-neutral-8) / 0.3);
    --np-card-soft-hover: rgb(var(--np-neutral-10) / 0.6);

    --np-divider-soft: rgb(var(--np-neutral-8) / 0.3);

    --np-danger-soft-bg: rgb(var(--np-red-11) / 0.4);

    --np-surface-inset: rgb(var(--np-neutral-10));

    --np-bg: rgb(var(--np-neutral-13));

    --np-search-active: rgb(var(--np-neutral-8) / 0.5);

    --np-border-strong: rgb(var(--np-neutral-10));

    --np-notif-dot-bg: rgb(var(--np-rose-4));

    --np-badge-blue-bg: rgb(var(--np-blue-4) / 0.5);
    --np-badge-blue-text: rgb(var(--np-blue-2));
    --np-badge-orange-bg: rgb(var(--np-orange-4) / 0.5);
    --np-badge-orange-text: rgb(var(--np-orange-2));
    --np-badge-purple-bg: rgb(var(--np-purple-4) / 0.5);
    --np-badge-purple-text: rgb(var(--np-purple-2));
    --np-badge-sky-bg: rgb(var(--np-sky-4) / 0.5);
    --np-badge-sky-text: rgb(var(--np-sky-2));

    --np-menu-bg: rgb(var(--np-neutral-12));
    --np-menu-hover: rgb(var(--np-neutral-10) / 0.6);
    --np-menu-active: rgb(var(--np-neutral-10) / 0.4);
    --np-menu-name: rgb(var(--np-neutral-6));
    --np-ink-strong: rgb(var(--np-neutral-1));
    --np-menu-name-active: rgb(var(--np-neutral-0));
    --np-menu-badge-bg: rgb(var(--np-accent-7) / 0.3);
    --np-menu-badge-text: rgb(var(--np-neutral-0));
    --np-menu-badge-min-bg: rgb(var(--np-accent-7) / 0.3);

    --np-submenu-text-hover: rgb(var(--np-neutral-2));

    --np-site-bg: rgb(var(--np-neutral-12));

    --np-mark-bg: rgb(var(--np-accent-9) / 0.5);
    --np-mark-text: rgb(var(--np-accent-2));

    --np-menu-result-hover: rgb(var(--np-neutral-8) / 0.5);

    --np-avatar-bg: rgb(var(--np-neutral-7));
    --np-avatar-bg-hover: rgb(var(--np-neutral-6));
    --np-avatar-ring: rgb(var(--np-accent-7));

}

.np-hover-reveal {
    opacity: 0;
    transition: opacity 0.2s ease;
}

.np-hover-group:hover .np-hover-reveal,
.np-hover-reveal-on {
    opacity: 1;
}

.dp__theme_dark {
    --dp-background-color: #2d2d2d;
    --dp-text-color: #ffffff;
    --dp-hover-color: #484848;
    --dp-hover-text-color: #ffffff;
    --dp-hover-icon-color: #959595;
    --dp-primary-color: rgb(var(--np-accent-7)/1);
    --dp-primary-text-color: #ffffff;
    --dp-secondary-color: #a9a9a9;
    --dp-border-color: #2d2d2d;
    --dp-menu-border-color: #2d2d2d;
    --dp-scroll-bar-background: #212121;
    --dp-scroll-bar-color: #484848;
    --dp-icon-color: #959595;
    --dp-range-between-dates-background-color: var(--dp-hover-color, #484848);
    --dp-range-between-dates-text-color: var(--dp-hover-text-color, #ffffff);
    --dp-range-between-border-color: var(--dp-hover-color, #ffffff);
}

.dp__theme_light {
    --dp-background-color: #ffffff;
    --dp-text-color: #212121;
    --dp-hover-color: #f3f3f3;
    --dp-hover-text-color: #212121;
    --dp-hover-icon-color: #959595;
    --dp-primary-color: rgb(var(--np-accent-7)/1);
    --dp-primary-text-color: #f8f5f5;
    --dp-secondary-color: #c0c4cc;
    --dp-border-color: #dddddd;
    --dp-menu-border-color: #dddddd;
    --dp-scroll-bar-background: #f3f3f3;
    --dp-scroll-bar-color: #959595;
    --dp-icon-color: #959595;
    --dp-range-between-dates-background-color: var(--dp-hover-color, #f3f3f3);
    --dp-range-between-dates-text-color: var(--dp-hover-text-color, #212121);
    --dp-range-between-border-color: var(--dp-hover-color, #f3f3f3);
}

html {
    --wp-admin--admin-bar--height: 54px;
}
