/* Shared paper depth, lift and surface color tokens. */

:root {
  --vk-paper-lift-button-bg: var(--vk-paper-depth-raised-max-bg, color-mix(in srgb, var(--vk-paper-panel-bg) 97%, #fff 3%));
  --vk-paper-lift-button-bg-hover: var(--vk-paper-depth-raised-mid-bg, var(--vk-paper-lift-button-bg));
  --vk-paper-lift-button-bg-pressed: var(--vk-paper-depth-level-bg, var(--vk-paper-panel-bg));
  --vk-paper-lift-button-disabled-opacity: 0.5;
  --vk-paper-lift-button-text: var(--vk-text-primary);
  --vk-paper-lift-button-disabled-text: var(--vk-text-disabled, var(--vk-text-secondary));
  --vk-paper-lift-button-disabled-bg: var(--vk-paper-depth-base-bg, var(--vk-paper-panel-bg));
  --vk-paper-selected-button-bg: var(--vk-selected-paper-bg, var(--vk-paper-lift-button-bg));
  --vk-paper-selected-button-bg-hover: var(--vk-paper-selected-button-bg);
  --vk-paper-selected-button-bg-pressed: var(--vk-paper-lift-button-bg-pressed);
  --vk-paper-selected-button-text: var(--vk-paper-lift-button-text);
  --vk-paper-selected-button-border: transparent;
  --vk-paper-catalog-card-bg: var(--vk-paper-depth-level-bg);
  --vk-paper-catalog-card-bg-hover: var(--vk-paper-depth-raised-mid-bg);
  --vk-paper-catalog-card-selected-bg: var(--vk-paper-selected-card-bg);
  --vk-paper-catalog-card-selected-bg-hover: var(--vk-paper-catalog-card-selected-bg);
  --vk-paper-catalog-card-selected-bg-pressed: var(--vk-app-surface-center);
  --vk-paper-catalog-create-bg: var(--vk-app-surface-center);
  --vk-paper-catalog-create-bg-hover: var(--vk-paper-depth-raised-mid-bg);
  --vk-paper-catalog-create-bg-pressed: var(--vk-paper-depth-raised-max-bg);
  --vk-paper-lift-normal-y: 3px;
  --vk-paper-lift-hover-y: 1.5px;
  --vk-paper-lift-pressed-y: 0px;
  --vk-shadow-paper-raised-y: 6px;
  --vk-shadow-paper-raised-blur: 10px;
  --vk-shadow-paper-raised-alpha: 0.24;
  --vk-shadow-paper-hover-y: 4px;
  --vk-shadow-paper-hover-blur: 7px;
  --vk-shadow-paper-hover-alpha: 0.18;
  --vk-shadow-paper-spread: 0px;
  --vk-shadow-paper-raised: 0 var(--vk-shadow-paper-raised-y) var(--vk-shadow-paper-raised-blur)
    var(--vk-shadow-paper-spread) rgba(0, 0, 0, var(--vk-shadow-paper-raised-alpha));
  --vk-shadow-paper-hover: 0 var(--vk-shadow-paper-hover-y) var(--vk-shadow-paper-hover-blur)
    var(--vk-shadow-paper-spread) rgba(0, 0, 0, var(--vk-shadow-paper-hover-alpha));
  --vk-shadow-paper-pressed: none;
  --vk-paper-lift-normal-shadow-y: var(--vk-shadow-paper-raised-y);
  --vk-paper-lift-normal-shadow-blur: var(--vk-shadow-paper-raised-blur);
  --vk-paper-lift-normal-shadow-alpha: var(--vk-shadow-paper-raised-alpha);
  --vk-paper-lift-hover-shadow-y: var(--vk-shadow-paper-hover-y);
  --vk-paper-lift-hover-shadow-blur: var(--vk-shadow-paper-hover-blur);
  --vk-paper-lift-hover-shadow-alpha: var(--vk-shadow-paper-hover-alpha);
  --vk-paper-lift-shadow-spread: var(--vk-shadow-paper-spread);
  --vk-paper-lift-active-shadow-y: var(--vk-paper-lift-normal-shadow-y);
  --vk-paper-lift-active-shadow-blur: var(--vk-paper-lift-normal-shadow-blur);
  --vk-paper-lift-active-shadow-alpha: var(--vk-paper-lift-normal-shadow-alpha);
  --vk-shadow-paper-active: 0 var(--vk-paper-lift-active-shadow-y) var(--vk-paper-lift-active-shadow-blur)
    var(--vk-paper-lift-shadow-spread) rgba(0, 0, 0, var(--vk-paper-lift-active-shadow-alpha));
  --vk-paper-compact-lift-normal-y: 2px;
  --vk-paper-compact-lift-hover-y: 1px;
  --vk-shadow-paper-compact-raised-y: 3px;
  --vk-shadow-paper-compact-raised-blur: 5px;
  --vk-shadow-paper-compact-raised-alpha: 0.2;
  --vk-shadow-paper-compact-hover-y: 2px;
  --vk-shadow-paper-compact-hover-blur: 4px;
  --vk-shadow-paper-compact-hover-alpha: 0.16;
  --vk-shadow-paper-compact-spread: -2px;
  --vk-shadow-paper-compact-raised: 0 var(--vk-shadow-paper-compact-raised-y)
    var(--vk-shadow-paper-compact-raised-blur) var(--vk-shadow-paper-compact-spread)
    rgba(0, 0, 0, var(--vk-shadow-paper-compact-raised-alpha));
  --vk-shadow-paper-compact-hover: 0 var(--vk-shadow-paper-compact-hover-y)
    var(--vk-shadow-paper-compact-hover-blur) var(--vk-shadow-paper-compact-spread)
    rgba(0, 0, 0, var(--vk-shadow-paper-compact-hover-alpha));
  --vk-paper-compact-lift-normal-shadow-y: var(--vk-shadow-paper-compact-raised-y);
  --vk-paper-compact-lift-normal-shadow-blur: var(--vk-shadow-paper-compact-raised-blur);
  --vk-paper-compact-lift-normal-shadow-alpha: var(--vk-shadow-paper-compact-raised-alpha);
  --vk-paper-compact-lift-hover-shadow-y: var(--vk-shadow-paper-compact-hover-y);
  --vk-paper-compact-lift-hover-shadow-blur: var(--vk-shadow-paper-compact-hover-blur);
  --vk-paper-compact-lift-hover-shadow-alpha: var(--vk-shadow-paper-compact-hover-alpha);
  --vk-paper-compact-lift-shadow-spread: var(--vk-shadow-paper-compact-spread);
  --vk-analysis-inset-surface-bg: var(--vk-paper-inset-bg, color-mix(in srgb, var(--vk-paper-panel-bg) 84%, #000 16%));
  --vk-analysis-inset-surface-border: color-mix(in srgb, var(--vk-paper-panel-bg) 76%, #000 24%);
  --vk-analysis-inset-surface-shadow-top: color-mix(in srgb, #000 24%, transparent);
  --vk-analysis-inset-surface-shadow-bottom: color-mix(in srgb, #fff 5%, transparent);
  --vk-shadow-form-inset:
    inset 0 1.5px 3px var(--vk-analysis-inset-surface-shadow-top),
    inset 0 -1px 0 var(--vk-analysis-inset-surface-shadow-bottom);
  --vk-shadow-form-focus:
    inset 0 1.5px 3px color-mix(in srgb, #000 28%, transparent),
    0 0 0 1px color-mix(in srgb, var(--vk-paper-accent-fill) 18%, transparent);
  --vk-shadow-form-inline-action: inset 0 1px 0 var(--vk-highlight-inset);
  --vk-shadow-autofill-inset: 0 0 0 1000px var(--vk-analysis-inset-surface-bg) inset;
  --vk-shadow-hold-progress:
    inset 0 2px 5px color-mix(in srgb, #000 34%, transparent),
    inset 0 -1px 0 var(--vk-analysis-inset-surface-shadow-bottom);
  --vk-shadow-toggle-knob: 0 1px 2px color-mix(in srgb, #000 28%, transparent);
  --vk-shadow-toggle-active:
    inset 0 1px 2px color-mix(in srgb, #000 20%, transparent),
    0 1px 2px color-mix(in srgb, var(--vk-paper-main-bg) 30%, transparent);
  --vk-settings-color-swatch-shadow: 0 1px 4px color-mix(in srgb, #000 24%, transparent);
  --vk-settings-slider-range-shadow: 0 1px 3px color-mix(in srgb, #000 18%, transparent);
  --vk-settings-slider-thumb-shadow:
    0 1px 3px color-mix(in srgb, #000 26%, transparent),
    inset 0 1px 0 var(--vk-highlight-inset);
  --vk-shadow-inset-border: inset 0 0 0 1px var(--vk-paper-depth-inset-bg);
  --vk-shadow-white-marker-ring: inset 0 0 0 1px var(--vk-analysis-marker-white-border);
}