/**
 * @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
 * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
 */
:root, :host {
  --ck-color-base-foreground: #f7f7f7;
  --ck-color-base-background: #fff;
  --ck-color-base-border: #c9d1dc;
  --ck-color-base-border-light: #e6ecf4;
  --ck-color-base-action: #4865d5;
  --ck-color-base-action-hover: #3454c5;
  --ck-color-base-action-muted: #e5e8f6;
  --ck-color-base-action-disabled: #a3b2ea;
  --ck-color-base-focus: #4865d5;
  --ck-color-base-text: #121c2b;
  --ck-color-base-text-light: #536379;
  --ck-color-base-active: #4865d5;
  --ck-color-base-active-focus: #3454c5;
  --ck-color-base-hover: #f3f4f7;
  --ck-color-base-hover-strong: #e9ebf1;
  --ck-color-base-selected: #eef3fd;
  --ck-color-base-selected-hover: #e3ebfc;
  --ck-color-base-error: #d11e1e;
  --ck-color-base-warning: #e79818;
  --ck-color-base-success: #107c53;
  --ck-color-base-highlight: #ff0;
  --ck-color-base-attention: #f0b429;
  --ck-color-base-focus-shadow: #4a67d638;
  --ck-color-base-focus-shadow-faded: #4a67d61a;
  --ck-color-base-error-shadow: #fae8e8;
  --ck-color-shadow-drop: #00000020;
  --ck-color-shadow-drop-active: #0003;
  --ck-color-shadow-inner: #0000001a;
  --ck-color-base-diff-insertion: 157 80% 34%;
  --ck-color-base-diff-deletion: 0 75% 52%;
  --ck-color-base-diff-format: 191 60% 75%;
  --ck-color-base-comment: 42.1 95.4% 57.3%;
  --ck-color-surface-canvas: var(--ck-color-base-background);
  --ck-color-surface-control: var(--ck-color-surface-canvas);
  --ck-color-surface-container: var(--ck-color-surface-canvas);
  --ck-color-surface-inverse: var(--ck-color-base-text);
  --ck-color-border-control: var(--ck-color-base-border);
  --ck-color-border-container: var(--ck-color-base-border);
  --ck-color-divider: var(--ck-color-base-border);
  --ck-color-feedback-error: var(--ck-color-base-error);
  --ck-color-feedback-success: var(--ck-color-base-success);
  --ck-color-feedback-warning: var(--ck-color-base-warning);
  --ck-color-feedback-highlight: var(--ck-color-base-highlight);
  --ck-color-diff-insertion-border: hsl(var(--ck-color-base-diff-insertion) / 50%);
  --ck-color-diff-insertion-border-active: hsl(var(--ck-color-base-diff-insertion) / 60%);
  --ck-color-diff-insertion-background: hsl(var(--ck-color-base-diff-insertion) / 20%);
  --ck-color-diff-insertion-background-active: hsl(var(--ck-color-base-diff-insertion) / 30%);
  --ck-color-diff-deletion-border: hsl(var(--ck-color-base-diff-deletion) / 40%);
  --ck-color-diff-deletion-border-active: hsl(var(--ck-color-base-diff-deletion) / 50%);
  --ck-color-diff-deletion-background: hsl(var(--ck-color-base-diff-deletion) / 20%);
  --ck-color-diff-deletion-background-active: hsl(var(--ck-color-base-diff-deletion) / 30%);
  --ck-color-diff-deletion-stroke: #c01b1b99;
  --ck-color-diff-format-border: hsl(var(--ck-color-base-diff-format) / 100%);
  --ck-color-diff-format-border-active: #5cc0d6;
  --ck-color-diff-insertion-box-border: #499167;
  --ck-color-diff-deletion-box-border: #ca3c25;
  --ck-color-diff-insertion-widget-background: #66e5770d;
  --ck-color-diff-insertion-widget-background-active: #25da3d12;
  --ck-color-diff-deletion-widget-background: #e566860d;
  --ck-color-diff-deletion-widget-background-active: #c4214a12;
  --ck-color-diff-format-widget-background: #0aa0c217;
  --ck-color-diff-format-widget-background-active: #0aa0c229;
  --ck-color-diff-insertion-widget-th-background: #66e5771f;
  --ck-color-diff-insertion-widget-th-background-active: #25da3d24;
  --ck-color-diff-deletion-widget-th-background: #e5668624;
  --ck-color-diff-deletion-widget-th-background-active: #c4214a29;
  --ck-color-comment-box-border: hsl(var(--ck-color-base-comment) / 100%);
  --ck-color-text-primary: var(--ck-color-base-text);
  --ck-color-text-secondary: var(--ck-color-base-text-light);
  --ck-color-text-disabled: var(--ck-color-text-secondary);
  --ck-color-text-inverse: var(--ck-color-base-background);
  --ck-color-text-error: var(--ck-color-feedback-error);
  --ck-color-text: var(--ck-color-text-primary);
  --ck-color-interactive-focus-border-coordinates: 218, 81.8%, 56.9%;
  --ck-color-interactive-focus-border: var(--ck-focus-border-color);
  --ck-color-interactive-focus-shadow: var(--ck-color-base-focus-shadow);
  --ck-color-interactive-focus-disabled-shadow: var(--ck-color-base-focus-shadow-faded);
  --ck-color-interactive-focus-error-shadow: var(--ck-color-base-error-shadow);
  --ck-color-interactive-hover-surface: var(--ck-color-base-hover);
  --ck-color-interactive-hover-surface-strong: var(--ck-color-base-hover-strong);
  --ck-color-interactive-active-surface: var(--ck-color-base-hover);
  --ck-color-interactive-selected-surface: var(--ck-color-base-selected);
  --ck-color-interactive-selected-surface-hover: var(--ck-color-base-selected-hover);
  --ck-color-interactive-selected-text: var(--ck-color-base-active);
  --ck-color-interactive-primary-surface: var(--ck-color-base-action);
  --ck-color-interactive-primary-surface-hover: var(--ck-color-base-action-hover);
  --ck-color-interactive-primary-surface-muted: var(--ck-color-base-action-muted);
  --ck-color-interactive-primary-surface-disabled: var(--ck-color-base-action-disabled);
  --ck-color-interactive-primary-text: var(--ck-color-text-inverse);
  --ck-color-focus-border-coordinates: var(--ck-color-interactive-focus-border-coordinates);
  --ck-color-focus-border: var(--ck-color-interactive-focus-border);
  --ck-color-focus-outer-shadow: var(--ck-color-interactive-focus-shadow);
  --ck-color-focus-disabled-shadow: var(--ck-color-interactive-focus-disabled-shadow);
  --ck-color-focus-error-shadow: var(--ck-color-interactive-focus-error-shadow);
  --ck-color-engine-placeholder-text: #707070;
  --ck-color-upload-bar-background: var(--ck-color-base-focus);
  --ck-color-link-default: #0000f0;
  --ck-color-link-selected-background: #1fb0ff1a;
  --ck-color-link-fake-selection: #1fb0ff4d;
  --ck-color-highlight-background: var(--ck-color-feedback-highlight);
  --ck-color-light-red: #fcc;
}

:root, :host {
  --ck-opacity-disabled: .5;
  --ck-focus-shadow-geometry: 0 0 0 3px;
  --ck-focus-shadow: var(--ck-focus-outer-shadow-geometry, var(--ck-focus-shadow-geometry)) var(--ck-color-focus-outer-shadow);
  --ck-focus-shadow-disabled: var(--ck-focus-outer-shadow-geometry, var(--ck-focus-shadow-geometry)) var(--ck-color-focus-disabled-shadow);
  --ck-focus-shadow-error: var(--ck-focus-outer-shadow-geometry, var(--ck-focus-shadow-geometry)) var(--ck-color-focus-error-shadow);
  --ck-focus-ring: 1px solid var(--ck-color-focus-border);
  --ck-focus-border-color: #4865d5;
  --ck-outline-fake-caret: solid 1px #ffffff80;
  --ck-font-size-base: 16px;
  --ck-line-height-base: 1.5;
  --ck-font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --ck-font-size-xs: calc(.625 * var(--ck-font-size-normal, var(--ck-font-size-base)));
  --ck-font-size-sm: calc(.75 * var(--ck-font-size-normal, var(--ck-font-size-base)));
  --ck-font-size-md: calc(.875 * var(--ck-font-size-normal, var(--ck-font-size-base)));
  --ck-font-size-lg: calc(1.125 * var(--ck-font-size-normal, var(--ck-font-size-base)));
  --ck-font-size-xl: calc(1.25 * var(--ck-font-size-normal, var(--ck-font-size-base)));
  --ck-font-size-2xl: calc(1.5 * var(--ck-font-size-normal, var(--ck-font-size-base)));
  --ck-font-weight-normal: 400;
  --ck-font-weight-medium: 500;
  --ck-font-weight-semibold: 600;
  --ck-font-weight-bold: 700;
  --ck-border-width-thin: 1px;
  --ck-border-width-thick: 2px;
  --ck-size-min-height: 2.3em;
}

.ck.ck-reset, .ck.ck-reset_all, .ck-reset_all :not(.ck-reset_all-excluded, .ck-reset_all-excluded *) {
  box-sizing: border-box;
  vertical-align: middle;
  word-wrap: break-word;
  background: none;
  border: 0;
  width: auto;
  height: auto;
  margin: 0;
  padding: 0;
  text-decoration: none;
  transition: none;
  position: static;
}

.ck.ck-reset_all, .ck-reset_all :not(.ck-reset_all-excluded, .ck-reset_all-excluded *) {
  border-collapse: collapse;
  font: normal normal normal var(--ck-font-size-normal, var(--ck-font-size-base))/var(--ck-line-height-base) var(--ck-font-face, var(--ck-font-family));
  color: var(--ck-color-text);
  text-align: left;
  white-space: nowrap;
  cursor: auto;
  float: none;
}

.ck-reset_all {
  & .ck-rtl :not(.ck-reset_all-excluded, .ck-reset_all-excluded *) {
    text-align: right;
  }

  & iframe:not(.ck-reset_all-excluded *) {
    vertical-align: inherit;
  }

  & textarea:not(.ck-reset_all-excluded *) {
    white-space: pre-wrap;
  }

  & textarea:not(.ck-reset_all-excluded *), & input[type="text"]:not(.ck-reset_all-excluded *), & input[type="password"]:not(.ck-reset_all-excluded *) {
    cursor: text;
  }

  & textarea[disabled]:not(.ck-reset_all-excluded *), & input[type="text"][disabled]:not(.ck-reset_all-excluded *), & input[type="password"][disabled]:not(.ck-reset_all-excluded *) {
    cursor: default;
  }

  & fieldset:not(.ck-reset_all-excluded *) {
    border: 2px groove #dfdee3;
    padding: 10px;
  }

  & button:not(.ck-reset_all-excluded *)::-moz-focus-inner {
    border: 0;
    padding: 0;
  }
}

.ck[dir="rtl"], .ck[dir="rtl"] .ck {
  text-align: right;
}

:root, :host {
  --ck-radius-base: var(--ck-radius-unit, 8px);
  --ck-radius-xs: calc(var(--ck-border-radius, var(--ck-radius-base)) / 8);
  --ck-radius-sm: calc(var(--ck-border-radius, var(--ck-radius-base)) / 4);
  --ck-radius-md: calc(var(--ck-border-radius, var(--ck-radius-base)) / 2);
  --ck-radius-lg: calc(var(--ck-border-radius, var(--ck-radius-base)) * 1.5);
  --ck-radius-xl: calc(var(--ck-border-radius, var(--ck-radius-base)) * 2);
  --ck-radius-full: 50%;
  --ck-radius-corners: 0;
}

.ck-rounded-corners {
  --ck-radius-corners: var(--ck-border-radius, var(--ck-radius-base));
}

:root, :host {
  --ck-inset-shadow-sm: 0 1px 4px #0000000d, 0 2px 10px #0000000d inset;
  --ck-shadow-md: 0 1px 2px 1px var(--ck-color-shadow-drop);
  --ck-shadow-lg: 0 1px 4px #0000000d, 0 2px 10px #0000000d;
  --ck-shadow-xl: 0 16px 32px -4px #0000001a, 0 4px 16px #0000001a;
  --ck-spacing-base: var(--ck-spacing-unit, 8px);
  --ck-spacing-2xs: calc(.125 * var(--ck-spacing-base));
  --ck-spacing-xs: calc(.25 * var(--ck-spacing-base));
  --ck-spacing-sm: calc(.5 * var(--ck-spacing-base));
  --ck-spacing-md: calc(.75 * var(--ck-spacing-base));
  --ck-spacing-lg: calc(1.5 * var(--ck-spacing-base));
  --ck-spacing-xl: calc(2 * var(--ck-spacing-base));
  --ck-spacing-ms: var(--ck-spacing-medium-small, var(--ck-spacing-md));
  --ck-width-xs: calc(var(--ck-font-size-normal, var(--ck-font-size-base)) * 15);
  --ck-width-sm: calc(var(--ck-font-size-normal, var(--ck-font-size-base)) * 20);
  --ck-width-md: calc(var(--ck-font-size-normal, var(--ck-font-size-base)) * 25);
  --ck-width-lg: calc(var(--ck-font-size-normal, var(--ck-font-size-base)) * 30);
  --ck-width-xl: calc(var(--ck-font-size-normal, var(--ck-font-size-base)) * 35);
  --ck-width-2xl: calc(var(--ck-font-size-normal, var(--ck-font-size-base)) * 40);
  --ck-font-weight-ui-default: var(--ck-font-weight-normal);
  --ck-font-weight-ui-strong: var(--ck-font-weight-semibold);
  --ck-font-weight-ui-heading: var(--ck-font-weight-semibold);
  --ck-font-weight-ui-label: var(--ck-font-weight-semibold);
  --ck-font-weight-ui-emphasis: var(--ck-font-weight-semibold);
  --ck-font-weight-ui-muted: var(--ck-font-weight-normal);
  --ck-font-weight-ui-inherit: inherit;
  --ck-font-size-control: var(--ck-font-size-md);
  --ck-toolbar-text-font-size: inherit;
  --ck-menubar-text-font-size: inherit;
  --ck-spacing-control-padding-block: var(--ck-spacing-small, var(--ck-spacing-sm));
  --ck-spacing-control-padding-inline: var(--ck-spacing-standard, var(--ck-spacing-base));
  --ck-spacing-control-padding-inline-compact: var(--ck-spacing-small, var(--ck-spacing-sm));
  --ck-spacing-control-padding-inline-start-compact: var(--ck-spacing-tiny, var(--ck-spacing-xs));
  --ck-spacing-control-padding-block-compact: var(--ck-spacing-tiny, var(--ck-spacing-xs));
  --ck-spacing-control-icon-gap: var(--ck-spacing-medium-small, var(--ck-spacing-md));
  --ck-spacing-padding-tight: var(--ck-spacing-tiny, var(--ck-spacing-xs));
  --ck-spacing-padding-compact: var(--ck-spacing-small, var(--ck-spacing-sm));
  --ck-spacing-padding-snug: var(--ck-spacing-medium-small, var(--ck-spacing-md));
  --ck-spacing-padding: var(--ck-spacing-base);
  --ck-spacing-padding-comfortable: var(--ck-spacing-large, var(--ck-spacing-lg));
  --ck-spacing-padding-spacious: var(--ck-spacing-extra-large, var(--ck-spacing-xl));
  --ck-spacing-gap-tight: var(--ck-spacing-tiny, var(--ck-spacing-xs));
  --ck-spacing-gap-compact: var(--ck-spacing-small, var(--ck-spacing-sm));
  --ck-spacing-gap-snug: var(--ck-spacing-medium-small, var(--ck-spacing-md));
  --ck-spacing-gap: var(--ck-spacing-base);
  --ck-spacing-gap-comfortable: var(--ck-spacing-large, var(--ck-spacing-lg));
  --ck-spacing-gap-spacious: var(--ck-spacing-extra-large, var(--ck-spacing-xl));
  --ck-border-width-control: var(--ck-border-width-thin);
  --ck-border-width-surface: var(--ck-border-width-thin);
  --ck-border-width-divider: var(--ck-border-width-thin);
  --ck-border-width-emphasis: var(--ck-border-width-thick);
  --ck-border-control: var(--ck-border-width-control) solid var(--ck-color-border-control);
  --ck-border-surface: var(--ck-border-width-surface) solid var(--ck-color-border-container);
  --ck-border-divider: 0;
  --ck-border-radius-control: var(--ck-radius-md);
  --ck-border-radius-control-small: var(--ck-radius-sm);
  --ck-border-radius-surface: var(--ck-border-radius, var(--ck-radius-base));
  --ck-border-radius-uniform: var(--ck-border-radius, var(--ck-radius-base));
  --ck-border-radius-surface-attached: var(--ck-border-radius-surface);
  --ck-border-radius-surface-attached-top: 0 0 var(--ck-border-radius-surface-attached) var(--ck-border-radius-surface-attached);
  --ck-border-radius-surface-attached-bottom: var(--ck-border-radius-surface-attached) var(--ck-border-radius-surface-attached) 0 0;
  --ck-border-radius-surface-cut-top-left: 0 var(--ck-border-radius-surface-attached) var(--ck-border-radius-surface-attached) var(--ck-border-radius-surface-attached);
  --ck-border-radius-surface-cut-top-right: var(--ck-border-radius-surface-attached) 0 var(--ck-border-radius-surface-attached) var(--ck-border-radius-surface-attached);
  --ck-border-radius-surface-cut-bottom-right: var(--ck-border-radius-surface-attached) var(--ck-border-radius-surface-attached) 0 var(--ck-border-radius-surface-attached);
  --ck-border-radius-surface-cut-bottom-left: var(--ck-border-radius-surface-attached) var(--ck-border-radius-surface-attached) var(--ck-border-radius-surface-attached) 0;
  --ck-shadow-surface-floating: var(--ck-shadow-xl);
  --ck-interactive-focus-ring: var(--ck-focus-ring);
  --ck-interactive-focus-border-color: var(--ck-focus-border-color);
  --ck-interactive-focus-shadow: var(--ck-focus-outer-shadow, var(--ck-focus-shadow));
  --ck-interactive-focus-disabled-shadow: var(--ck-focus-disabled-outer-shadow, var(--ck-focus-shadow-disabled));
  --ck-interactive-focus-error-shadow: var(--ck-focus-error-outer-shadow, var(--ck-focus-shadow-error));
  --ck-size-control-min-height: var(--ck-ui-component-min-height, calc(var(--ck-font-size-normal, var(--ck-font-size-base))*2));
  --ck-width-balloon-form: min(var(--ck-width-md), 90vw);
  --ck-width-dialog: min(var(--ck-width-md), 90vw);
  --ck-width-dialog-lg: min(var(--ck-width-xl), 90vw);
}

.ck-hidden {
  display: none !important;
}

:root, :host {
  --ck-z-base: 1;
  --ck-z-overlay: calc(var(--ck-z-base) + 999);
  --ck-z-modal: 9999;
  --ck-layer-base: var(--ck-z-default, var(--ck-z-base));
  --ck-layer-control-raised: calc(var(--ck-layer-base) + 1);
  --ck-layer-panel: var(--ck-z-panel, var(--ck-z-overlay));
  --ck-layer-panel-above: calc(var(--ck-layer-panel) + 1);
  --ck-layer-panel-below: calc(var(--ck-layer-panel) - 1);
  --ck-layer-dialog: var(--ck-z-dialog, var(--ck-z-modal));
  --ck-layer-tooltip: calc(var(--ck-layer-dialog) + 100);
  --ck-layer-balloon-arrow-back: calc(var(--ck-layer-base) - 3);
  --ck-layer-balloon-arrow-front: calc(var(--ck-layer-balloon-arrow-back) + 1);
  --ck-duration-fast: .1s;
  --ck-duration-base: .2s;
  --ck-duration-slow: .3s;
  --ck-duration-slower: .4s;
  --ck-animation-duration-fast: var(--ck-duration-fast);
  --ck-animation-duration-base: var(--ck-duration-base);
  --ck-animation-duration-slow: var(--ck-duration-slow);
  --ck-animation-duration-emphasis: 1.5s;
  --ck-animation-duration-reduced: 0s;
  --ck-transition-none: none;
  --ck-ease-standard: ease;
  --ck-ease-interactive: ease-in-out;
  --ck-ease-emphasized: cubic-bezier(0, 0, .24, .95);
  --ck-animation-ease-standard: var(--ck-ease-standard);
  --ck-animation-ease-interactive: var(--ck-ease-interactive);
  --ck-animation-ease-linear: linear;
  --ck-animation-fill-both: both;
  --ck-animation-repeat-infinite: infinite;
  --ck-animation-none: var(--ck-transition-none);
}

.ck-transitions-disabled, .ck-transitions-disabled * {
  transition: none !important;
}

:root, :host {
  --ck-transition-duration-control-fast: var(--ck-duration-fast);
  --ck-transition-duration-control: var(--ck-duration-base);
  --ck-transition-duration-control-emphasized: var(--ck-duration-slow);
  --ck-transition-duration-surface: var(--ck-duration-slower);
  --ck-transition-timing-function-control: var(--ck-ease-interactive);
  --ck-transition-timing-function-control-emphasized: var(--ck-ease-emphasized);
  --ck-transition-timing-function-surface: var(--ck-ease-standard);
  --ck-transition-control: box-shadow var(--ck-transition-duration-control) var(--ck-transition-timing-function-control),
		border var(--ck-transition-duration-control) var(--ck-transition-timing-function-control);
  --ck-transition-control-fast: box-shadow var(--ck-transition-duration-control-fast) var(--ck-transition-timing-function-control),
		border var(--ck-transition-duration-control-fast) var(--ck-transition-timing-function-control);
  --ck-animation-duration-feedback: var(--ck-animation-duration-slow);
  --ck-animation-duration-surface-entrance: var(--ck-animation-duration-slow);
  --ck-animation-duration-progress: var(--ck-animation-duration-emphasis);
  --ck-animation-duration-progress-reduced: var(--ck-animation-duration-reduced);
  --ck-animation-timing-function-feedback: var(--ck-animation-ease-standard);
  --ck-animation-timing-function-progress: var(--ck-animation-ease-linear);
  --ck-animation-fill-mode-feedback: var(--ck-animation-fill-both);
  --ck-powered-by-font-size: calc(.5 * var(--ck-font-size-normal, var(--ck-font-size-base)));
  --ck-powered-by-line-height: 1.35;
  --ck-powered-by-letter-spacing: -.2px;
  --ck-powered-by-padding-vertical: 2px;
  --ck-powered-by-padding-horizontal: 4px;
  --ck-powered-by-label-padding-inline-start: 2px;
  --ck-powered-by-label-margin-inline-end: 4px;
  --ck-powered-by-label-font-weight: var(--ck-font-weight-semibold);
  --ck-powered-by-text-color: #4f4f4f;
  --ck-powered-by-border-radius: var(--ck-border-radius, var(--ck-radius-base));
  --ck-powered-by-background: #fff;
  --ck-powered-by-border-color: var(--ck-color-focus-border);
  --ck-powered-by-svg-width: 53;
  --ck-powered-by-svg-height: 10;
  --ck-powered-by-icon-width: calc(var(--ck-font-size-normal, var(--ck-font-size-base)) * var(--ck-powered-by-svg-width) / 16);
  --ck-powered-by-icon-height: calc(var(--ck-font-size-normal, var(--ck-font-size-base)) * var(--ck-powered-by-svg-height) / 16);
}

.ck.ck-balloon-panel.ck-powered-by-balloon {
  border-radius: var(--ck-powered-by-border-radius);
  box-shadow: none;
  background: var(--ck-powered-by-background);
  min-height: unset;
  z-index: calc(var(--ck-z-panel, var(--ck-z-overlay)) - 1);

  & .ck.ck-powered-by {
    line-height: var(--ck-powered-by-line-height);

    & a {
      cursor: pointer;
      opacity: .66;
      filter: grayscale(80%);
      line-height: var(--ck-powered-by-line-height);
      padding: var(--ck-powered-by-padding-vertical) var(--ck-powered-by-padding-horizontal);
      align-items: center;
      display: flex;
    }

    & .ck-powered-by__label {
      font-size: var(--ck-powered-by-font-size);
      letter-spacing: var(--ck-powered-by-letter-spacing);
      padding-left: var(--ck-powered-by-label-padding-inline-start);
      text-transform: uppercase;
      font-weight: var(--ck-powered-by-label-font-weight);
      margin-right: var(--ck-powered-by-label-margin-inline-end);
      cursor: pointer;
      color: var(--ck-powered-by-text-color);
      line-height: normal;
    }

    & .ck-icon {
      cursor: pointer;
      width: var(--ck-powered-by-icon-width);
      height: var(--ck-powered-by-icon-height);
      display: block;
    }

    &:hover {
      & a {
        filter: grayscale(0%);
        opacity: 1;
      }
    }
  }

  &[class*="position_inside"] {
    border-color: #0000;
  }

  &[class*="position_border"] {
    border: var(--ck-focus-ring);
    border-color: var(--ck-powered-by-border-color);
  }
}

:root, :host {
  --ck-evaluation-badge-font-size: calc(var(--ck-font-size-normal, var(--ck-font-size-base)) * 7.5 / 13);
  --ck-evaluation-badge-line-height: calc(var(--ck-font-size-normal, var(--ck-font-size-base)) * 7.5 / 13);
  --ck-evaluation-badge-letter-spacing: calc(var(--ck-font-size-normal, var(--ck-font-size-base)) * -.2 / 13);
  --ck-evaluation-badge-padding-vertical: 2px;
  --ck-evaluation-badge-padding-horizontal: 4px;
  --ck-evaluation-badge-label-padding-inline: 2px;
  --ck-evaluation-badge-label-padding: 0 var(--ck-evaluation-badge-label-padding-inline);
  --ck-evaluation-badge-label-font-weight: var(--ck-font-weight-semibold);
  --ck-evaluation-badge-text-color: #4f4f4f;
  --ck-evaluation-badge-border-radius: var(--ck-border-radius, var(--ck-radius-base));
  --ck-evaluation-badge-background: #fff;
  --ck-evaluation-badge-border-color: var(--ck-color-focus-border);
}

.ck.ck-balloon-panel.ck-evaluation-badge-balloon {
  border-radius: var(--ck-evaluation-badge-border-radius);
  box-shadow: none;
  background: var(--ck-evaluation-badge-background);
  min-height: unset;
  z-index: calc(var(--ck-z-panel, var(--ck-z-overlay)) - 1);

  & .ck.ck-evaluation-badge {
    line-height: var(--ck-evaluation-badge-line-height);
    padding: var(--ck-evaluation-badge-padding-vertical) var(--ck-evaluation-badge-padding-horizontal);

    & .ck-evaluation-badge__label {
      padding: var(--ck-evaluation-badge-label-padding);
      font-size: var(--ck-evaluation-badge-font-size);
      letter-spacing: var(--ck-evaluation-badge-letter-spacing);
      font-weight: var(--ck-evaluation-badge-label-font-weight);
      text-transform: uppercase;
      color: var(--ck-evaluation-badge-text-color);
      line-height: normal;
      display: block;
    }
  }

  &[class*="position_inside"] {
    border-color: #0000;
  }

  &[class*="position_border"] {
    border: var(--ck-focus-ring);
    border-color: var(--ck-evaluation-badge-border-color);
  }
}

:root, :host {
  --ck-scrollbar-thumb-color: #8f94a3;
  --ck-scrollbar-track-color: #00000006;
}

.ck {
  scrollbar-color: var(--ck-scrollbar-thumb-color) var(--ck-scrollbar-track-color);
}

:root, :host {
  --ck-z-default: var(--ck-z-base);
  --ck-z-panel: var(--ck-z-overlay);
  --ck-z-dialog: var(--ck-z-modal);
  --ck-responsive-form-padding: var(--ck-spacing-padding-comfortable);
  --ck-responsive-form-divider-border: var(--ck-border-divider);
}

.ck.ck-responsive-form {
  padding: var(--ck-responsive-form-padding);

  &:focus {
    outline: none;
  }

  [dir="ltr"] & {
    & > :not(:first-child) {
      margin-left: var(--ck-spacing-padding);
    }
  }

  [dir="rtl"] & {
    & > :not(:last-child) {
      margin-left: var(--ck-spacing-padding);
    }
  }

  @media screen and (width <= 600px) {
    width: calc(.8 * var(--ck-input-width));
    padding: 0;

    & .ck-labeled-field-view {
      margin: var(--ck-spacing-gap-comfortable) var(--ck-spacing-gap-comfortable) 0;

      & .ck-input-text, & .ck-input-number {
        width: 100%;
        min-width: 0;
      }

      & .ck-labeled-field-view__error {
        white-space: normal;
      }
    }

    & > .ck-button:last-child, & > .ck-button:nth-last-child(2) {
      padding: var(--ck-spacing-control-padding-inline);
      margin-top: var(--ck-spacing-gap-comfortable);
      border-radius: 0;

      &:not(:focus) {
        border-top: var(--ck-responsive-form-divider-border);
      }

      [dir="ltr"] & {
        margin-left: 0;
      }

      [dir="rtl"] & {
        margin-left: 0;

        &:last-of-type {
          border-right: var(--ck-responsive-form-divider-border);
        }
      }
    }

    & .ck-button {
      &:after {
        content: "";
        width: 0;
        right: calc(-1 * var(--ck-border-width-divider));
        top: calc(-1 * var(--ck-border-width-divider));
        bottom: calc(-1 * var(--ck-border-width-divider));
        z-index: 1;
        position: absolute;
      }

      &:nth-last-child(2):after {
        border-right: var(--ck-responsive-form-divider-border);
      }

      &:focus:after {
        display: none;
      }
    }
  }
}

.ck-vertical-form > .ck-button:nth-last-child(2):after {
  border-right: var(--ck-responsive-form-divider-border);
}

.ck-vertical-form .ck-button {
  &:after {
    content: "";
    width: 0;
    right: calc(-1 * var(--ck-border-width-divider));
    top: calc(-1 * var(--ck-border-width-divider));
    bottom: calc(-1 * var(--ck-border-width-divider));
    z-index: 1;
    position: absolute;
  }

  &:focus:after {
    display: none;
  }
}

:root, :host {
  --ck-form-default-width: var(--ck-width-md);
  --ck-form-padding: 0;
  --ck-form-content-padding-bottom: var(--ck-spacing-padding-comfortable);
}

.ck.ck-form {
  padding: var(--ck-form-padding);

  & > :last-child {
    padding-bottom: var(--ck-form-content-padding-bottom);
  }

  &.ck-form_default-width {
    width: var(--ck-form-default-width);
  }

  &:focus {
    outline: none;
  }

  & .ck.ck-input-text, & .ck.ck-input-number {
    width: 0;
    min-width: 100%;
  }

  & .ck.ck-dropdown {
    min-width: 100%;

    & .ck-dropdown__button {
      &:not(:focus) {
        border: var(--ck-border-control);
      }

      & .ck-button__label {
        width: 100%;
      }
    }
  }

  &.ck-responsive-form {
    & .ck.ck-form__row {
      &.ck-form__row_with-submit {
        @media screen and (width <= 600px) {
          flex-direction: column;
          align-items: stretch;
          padding: 0;
        }

        & > .ck {
          @media screen and (width <= 600px) {
            margin: var(--ck-spacing-gap-comfortable) var(--ck-spacing-gap-comfortable) 0;
          }
        }

        & .ck-button_with-text {
          @media screen and (width <= 600px) {
            justify-content: center;
          }
        }
      }

      &.ck-form__row_large-bottom-padding {
        @media screen and (width <= 600px) {
          padding-bottom: var(--ck-spacing-padding-comfortable);
        }
      }
    }

    [dir="ltr"] & {
      & > :not(:first-child) {
        margin-left: 0;
      }
    }

    [dir="rtl"] & {
      & > :not(:last-child) {
        margin-left: 0;
      }
    }
  }
}

.ck.ck-aria-live-announcer {
  position: absolute;
  top: -10000px;
  left: -10000px;
}

.ck.ck-aria-live-region-list {
  list-style-type: none;
}

:root, :host {
  --ck-accessibility-help-dialog-max-height: 400px;
  --ck-accessibility-help-dialog-max-width: 600px;
  --ck-accessibility-help-dialog-item-divider-width: 1px;
}

.ck.ck-accessibility-help-dialog .ck-accessibility-help-dialog__content {
  margin: var(--ck-dialog-content-padding);
  padding: var(--ck-spacing-padding-comfortable);
  max-width: var(--ck-accessibility-help-dialog-max-width);
  max-height: var(--ck-accessibility-help-dialog-max-height);
  border: var(--ck-border-control);
  border-radius: var(--ck-input-border-radius);
  -webkit-user-select: text;
  user-select: text;
  overflow: auto;

  &:focus {
    border-color: var(--ck-focus-border-color);
    box-shadow: var(--ck-focus-outer-shadow, var(--ck-focus-shadow)), 0 0;
    outline: none;
  }

  & * {
    white-space: normal;
  }

  & .ck-label {
    display: none;
  }

  & h3 {
    font-weight: var(--ck-font-weight-ui-heading);
    font-size: 1.2em;
  }

  & h4 {
    font-weight: var(--ck-font-weight-ui-heading);
    font-size: 1em;
  }

  & p, & h3, & h4, & table {
    margin: 1em 0;
  }

  & > p:first-child {
    margin-top: 0;
  }

  & dl {
    --ck-divider-border-color: var(--ck-color-divider, #ccced1);
    border-top: var(--ck-accessibility-help-dialog-item-divider-width) solid var(--ck-accessibility-help-dialog-border-color, var(--ck-divider-border-color));
    border-bottom: none;
    grid-template-columns: 2fr 1fr;
    display: grid;

    & dt, & dd {
      border-bottom: var(--ck-accessibility-help-dialog-item-divider-width) solid var(--ck-accessibility-help-dialog-border-color, var(--ck-divider-border-color));
      padding: .4em 0;
    }

    & dt {
      grid-column-start: 1;
    }

    & dd {
      text-align: right;
      grid-column-start: 2;
    }
  }

  & kbd, & code {
    background: var(--ck-accessibility-help-dialog-code-background-color, #ededed);
    vertical-align: middle;
    text-align: center;
    border-radius: 2px;
    padding: .4em;
    font-size: .9em;
    line-height: 1;
    display: inline-block;
  }

  & code {
    font-family: monospace;
  }

  & kbd {
    min-width: 1.8em;
    box-shadow: 0px 1px 1px var(--ck-accessibility-help-dialog-kbd-shadow-color, #9c9c9c);
    margin: 0 1px;

    & + kbd {
      margin-left: 2px;
    }
  }
}

:root, :host {
  --ck-button-padding: var(--ck-spacing-control-padding-block);
  --ck-button-with-text-padding: var(--ck-spacing-padding-compact) var(--ck-spacing-padding-comfortable);
  --ck-button-font-size: var(--ck-font-size-md);
  --ck-button-border-radius: var(--ck-border-radius-control);
  --ck-button-border: var(--ck-border-width-control) solid transparent;
  --ck-button-default-background-color: transparent;
  --ck-button-default-hover-background-color: var(--ck-color-interactive-hover-surface);
  --ck-button-default-active-background-color: var(--ck-color-interactive-active-surface);
  --ck-button-default-disabled-background-color: transparent;
  --ck-button-on-background-color: var(--ck-color-interactive-selected-surface);
  --ck-button-on-hover-background-color: var(--ck-color-interactive-selected-surface-hover);
  --ck-button-on-active-background-color: var(--ck-color-interactive-selected-surface-hover);
  --ck-button-on-disabled-background-color: #f0f2f4;
  --ck-button-on-text-color: var(--ck-color-interactive-selected-text);
  --ck-button-action-background-color: var(--ck-color-interactive-primary-surface);
  --ck-button-action-hover-background-color: var(--ck-color-interactive-primary-surface-hover);
  --ck-button-action-active-background-color: var(--ck-color-interactive-primary-surface-hover);
  --ck-button-action-disabled-background-color: var(--ck-color-interactive-primary-surface-disabled);
  --ck-button-action-opacity-disabled: 1;
  --ck-button-action-text-color: var(--ck-color-interactive-primary-text);
  --ck-button-save-color: var(--ck-color-feedback-success);
  --ck-button-cancel-color: var(--ck-color-feedback-error);
  --ck-button-icon-gap: var(--ck-spacing-gap-compact);
  --ck-button-focus-border-color: var(--ck-interactive-focus-border-color);
  --ck-button-opacity-disabled: var(--ck-disabled-opacity, var(--ck-opacity-disabled));
  --ck-button-standard-min-width: 60px;
  --ck-button-small-font-size: var(--ck-font-size-small, var(--ck-font-size-sm));
  --ck-button-small-min-width: 40px;
  --ck-button-small-padding: var(--ck-spacing-padding-tight) var(--ck-spacing-padding);
  --ck-button-small-icon-padding: 3px;
  --ck-button-small-border-radius: var(--ck-border-radius-control);
}

.ck.ck-button, :where(a).ck.ck-button {
  --ck-button-background: var(--ck-color-button-default-background, var(--ck-button-default-background-color));
  --ck-button-hover-background: var(--ck-color-button-default-hover-background, var(--ck-button-default-hover-background-color));
  --ck-button-active-background: var(--ck-color-button-default-active-background, var(--ck-button-default-active-background-color));
  --ck-button-disabled-background: var(--ck-color-button-default-disabled-background, var(--ck-button-default-disabled-background-color));
  background: var(--ck-button-background);

  &:not(.ck-disabled) {
    &:hover {
      background: var(--ck-button-hover-background);
    }

    &:active {
      background: var(--ck-button-active-background);
    }
  }

  border-radius: var(--ck-button-border-radius);
  white-space: nowrap;
  cursor: default;
  vertical-align: middle;
  padding: var(--ck-button-padding);
  text-align: center;
  min-width: var(--ck-size-control-min-height);
  min-height: var(--ck-size-control-min-height);
  line-height: 1;
  font-size: var(--ck-button-font-size);
  border: var(--ck-button-border);
  transition: var(--ck-transition-control);
  -webkit-appearance: none;
  -webkit-user-select: none;
  user-select: none;
  align-items: center;
  display: inline-flex;
  position: relative;

  @media (prefers-reduced-motion: reduce) {
    transition: var(--ck-transition-none);
  }

  &:active, &:focus {
    border-color: var(--ck-button-focus-border-color);
    box-shadow: var(--ck-focus-outer-shadow, var(--ck-interactive-focus-shadow)), 0 0;
    outline: none;
  }

  & .ck-button__icon {
    & use, & use * {
      color: inherit;
    }
  }

  & .ck-button__label {
    font-size: inherit;
    font-weight: var(--ck-font-weight-ui-inherit);
    color: inherit;
    cursor: inherit;
    vertical-align: middle;

    [dir="ltr"] & {
      text-align: left;
    }

    [dir="rtl"] & {
      text-align: right;
    }

    display: none;
  }

  & .ck-button__keystroke {
    color: inherit;
    font-size: inherit;
    opacity: .5;

    [dir="ltr"] & {
      margin-left: var(--ck-spacing-gap-comfortable);
    }

    [dir="rtl"] & {
      margin-right: var(--ck-spacing-gap-comfortable);
    }
  }

  &.ck-disabled {
    background: var(--ck-button-disabled-background);

    &:active, &:focus {
      box-shadow: var(--ck-focus-disabled-outer-shadow, var(--ck-interactive-focus-disabled-shadow)), 0 0;
    }

    & .ck-button__icon, & .ck-button__label {
      opacity: var(--ck-button-opacity-disabled);
    }

    & .ck-button__keystroke {
      opacity: .3;
    }
  }

  &.ck-button_with-text {
    padding: var(--ck-button-with-text-padding);

    & .ck-button__icon {
      [dir="ltr"] & {
        margin-right: var(--ck-button-icon-gap);
      }

      [dir="rtl"] & {
        margin-left: var(--ck-button-icon-gap);
      }
    }

    & .ck-button__label {
      display: inline-block;
    }
  }

  &.ck-button_with-keystroke {
    & .ck-button__label {
      flex-grow: 1;
    }
  }

  &.ck-button_standard {
    min-width: var(--ck-button-standard-min-width);
  }

  &.ck-button_small {
    --ck-button-font-size: var(--ck-button-small-font-size);
    --ck-icon-size-ratio: calc(16 / 12);
    --ck-icon-size: calc(1em * var(--ck-icon-size-ratio));
    --ck-size-control-min-height: calc(var(--ck-button-font-size) * 2);
    --ck-button-border-radius: var(--ck-button-small-border-radius);
    padding: var(--ck-button-small-icon-padding);

    &.ck-button_with-text {
      min-width: var(--ck-button-small-min-width);
      padding: var(--ck-button-small-padding);
    }
  }

  &.ck-on {
    --ck-button-background: var(--ck-color-button-on-background, var(--ck-button-on-background-color));
    --ck-button-hover-background: var(--ck-color-button-on-hover-background, var(--ck-button-on-hover-background-color));
    --ck-button-active-background: var(--ck-color-button-on-active-background, var(--ck-button-on-active-background-color));
    --ck-button-disabled-background: var(--ck-color-button-on-disabled-background, var(--ck-button-on-disabled-background-color));
    color: var(--ck-color-button-on-color, var(--ck-button-on-text-color));
  }

  &.ck-button-save {
    color: var(--ck-color-button-save, var(--ck-button-save-color));
  }

  &.ck-button-cancel {
    color: var(--ck-color-button-cancel, var(--ck-button-cancel-color));
  }

  [dir="ltr"] & {
    justify-content: left;
  }

  [dir="rtl"] & {
    justify-content: right;
  }

  &:not(.ck-button_with-text), &.ck-button_standard, &.ck-button_small {
    justify-content: center;
  }

  &.ck-button-action {
    --ck-button-background: var(--ck-color-button-action-background, var(--ck-button-action-background-color));
    --ck-button-hover-background: var(--ck-color-button-action-hover-background, var(--ck-button-action-hover-background-color));
    --ck-button-active-background: var(--ck-color-button-action-active-background, var(--ck-button-action-active-background-color));
    --ck-button-disabled-background: var(--ck-color-button-action-disabled-background, var(--ck-button-action-disabled-background-color));
    --ck-button-opacity-disabled: var(--ck-button-action-opacity-disabled);
    color: var(--ck-color-button-action-text, var(--ck-button-action-text-color));
  }

  &.ck-button-bold {
    font-weight: var(--ck-font-weight-ui-emphasis);
  }

  &.ck-button_surface {
    --ck-button-surface-background: var(--ck-color-surface-canvas);
    --ck-button-surface-border-color: var(--ck-color-interactive-primary-surface);
    --ck-button-hover-background: var(--ck-button-surface-background);
    --ck-button-active-background: var(--ck-button-surface-background);

    &:not(.ck-disabled):focus {
      background: var(--ck-button-surface-background);
    }

    &.ck-on {
      --ck-button-background: var(--ck-button-surface-background);
      --ck-button-hover-background: var(--ck-button-surface-background);
      --ck-button-active-background: var(--ck-button-surface-background);

      &:not(:focus) {
        border: var(--ck-border-width-control) solid var(--ck-button-surface-border-color);
      }
    }
  }

  &.ck-button_outline {
    --ck-button-outline-color: var(--ck-color-interactive-primary-surface);
    --ck-button-outline-background: var(--ck-color-surface-canvas);
    --ck-button-outline-hover-background: var(--ck-color-interactive-hover-surface);
    --ck-button-outline-active-background: var(--ck-color-interactive-selected-surface);
    --ck-button-outline-active-hover-background: var(--ck-color-interactive-selected-surface-hover);
    color: var(--ck-button-outline-color);
    background: var(--ck-button-outline-background);

    &:not(:focus) {
      border: var(--ck-border-width-control) solid var(--ck-button-outline-color);
    }

    &:active, &.ck-on {
      &:not(.ck-disabled) {
        color: var(--ck-button-outline-color);
        background: var(--ck-button-outline-active-background);

        &:hover {
          background: var(--ck-button-outline-active-hover-background);
        }
      }
    }

    &:disabled, &.ck-disabled {
      opacity: var(--ck-button-opacity-disabled);
      background: var(--ck-button-outline-background);

      & > .ck-button__label, & > .ck-button__icon {
        opacity: 1;
      }
    }

    &:hover:not(.ck-disabled, :active, .ck-on) {
      background: var(--ck-button-outline-hover-background);
    }
  }
}

:root, :host {
  --ck-switch-button-toggle-width: 2.61538em;
  --ck-switch-button-toggle-inner-size: calc(1.07692em + 1px);
  --ck-switch-button-translation: calc(var(--ck-switch-button-toggle-width) -
		var(--ck-switch-button-toggle-inner-size) -
		2px);
  --ck-switch-button-inner-hover-shadow: 0 0 0 5px var(--ck-color-switch-button-inner-shadow, var(--ck-color-shadow-inner));
  --ck-switch-button-toggle-border-radius: var(--ck-border-radius-control);
  --ck-switch-button-toggle-inner-border-radius: calc(.9 * var(--ck-switch-button-toggle-border-radius));
  --ck-switch-button-off-background-color: var(--ck-color-text-secondary);
  --ck-switch-button-off-hover-background-color: var(--ck-color-base-text-light);
  --ck-switch-button-on-background-color: var(--ck-color-button-action-background, var(--ck-button-action-background-color));
  --ck-switch-button-on-hover-background-color: var(--ck-color-interactive-primary-surface-hover);
  --ck-switch-button-inner-background-color: var(--ck-color-surface-canvas);
}

.ck.ck-button.ck-switchbutton {
  &, &:hover, &:focus, &:active, &.ck-on:hover, &.ck-on:focus, &.ck-on:active {
    color: inherit;
    background: none;
  }

  & .ck-button__label {
    [dir="ltr"] & {
      margin-right: calc(2 * var(--ck-spacing-gap-comfortable));
    }

    [dir="rtl"] & {
      margin-left: calc(2 * var(--ck-spacing-gap-comfortable));
    }
  }

  & .ck-button__toggle {
    border-radius: var(--ck-switch-button-toggle-border-radius);
    transition: background var(--ck-duration-slower) var(--ck-transition-timing-function-surface),
			box-shadow var(--ck-transition-duration-control) var(--ck-transition-timing-function-control),
			outline var(--ck-transition-duration-control) var(--ck-transition-timing-function-control);
    border: var(--ck-border-width-control) solid transparent;
    width: var(--ck-switch-button-toggle-width, 2.61538em);
    background: var(--ck-color-switch-button-off-background, var(--ck-switch-button-off-background-color));

    [dir="ltr"] & {
      margin-left: auto;
    }

    [dir="rtl"] & {
      margin-right: auto;
    }

    & .ck-button__toggle__inner {
      border-radius: var(--ck-switch-button-toggle-inner-border-radius);
      width: var(--ck-switch-button-toggle-inner-size, calc(1.07692em + 1px));
      height: var(--ck-switch-button-toggle-inner-size, calc(1.07692em + 1px));
      background: var(--ck-color-switch-button-inner-background, var(--ck-switch-button-inner-background-color));
      transition: all var(--ck-transition-duration-control-emphasized) var(--ck-transition-timing-function-surface);

      @media (prefers-reduced-motion: reduce) {
        transition: var(--ck-transition-none);
      }

      display: block;
    }

    &:hover {
      background: var(--ck-color-switch-button-off-hover-background, var(--ck-switch-button-off-hover-background-color));

      & .ck-button__toggle__inner {
        box-shadow: var(--ck-switch-button-inner-hover-shadow, 0 0 0 5px #0000001a);
      }
    }

    display: block;
  }

  &.ck-disabled .ck-button__toggle {
    opacity: var(--ck-disabled-opacity, var(--ck-opacity-disabled));
  }

  &:focus {
    box-shadow: none;
    border-color: #0000;
    outline: none;

    & .ck-button__toggle {
      box-shadow: 0 0 0 1px var(--ck-color-surface-canvas), 0 0 0 5px var(--ck-color-interactive-focus-shadow);
      outline-offset: 1px;
      outline: var(--ck-interactive-focus-ring);
    }
  }

  &.ck-on {
    & .ck-button__toggle {
      background: var(--ck-color-switch-button-on-background, var(--ck-switch-button-on-background-color));

      &:hover {
        background: var(--ck-color-switch-button-on-hover-background, var(--ck-switch-button-on-hover-background-color));
      }

      & .ck-button__toggle__inner {
        [dir="ltr"] & {
          transform: translateX(var(--ck-switch-button-translation));
        }

        [dir="rtl"] & {
          transform: translateX(calc(-1 * var(--ck-switch-button-translation)));
        }
      }
    }
  }
}

:root, :host {
  --ck-list-item-button-padding: var(--ck-spacing-control-padding-block) calc(2 * var(--ck-spacing-control-padding-inline));
  --ck-list-item-button-border-radius: var(--ck-border-radius-control);
}

.ck.ck-button.ck-list-item-button {
  padding: var(--ck-list-item-button-padding);

  &, &.ck-on {
    background: var(--ck-color-list-background, var(--ck-list-background-color));
    color: var(--ck-color-text);
  }

  &:has(.ck-list-item-button__check-holder) {
    [dir="ltr"] & {
      padding-left: var(--ck-spacing-control-padding-inline-compact);
    }

    [dir="rtl"] & {
      padding-right: var(--ck-spacing-control-padding-inline-compact);
    }
  }

  &:hover:not(.ck-disabled), &.ck-button.ck-on:hover, &.ck-on:not(.ck-list-item-button_toggleable), &.ck-on:hover {
    background: var(--ck-color-list-button-hover-background, var(--ck-list-button-hover-background-color));

    &:not(.ck-disabled) {
      color: var(--ck-color-text);
    }
  }
}

.ck.ck-list-item-button {
  min-height: unset;
  border-radius: var(--ck-list-item-button-border-radius);
  width: 100%;

  [dir="ltr"] & {
    text-align: left;
  }

  [dir="rtl"] & {
    text-align: right;
  }

  &.ck-list-item-button_toggleable {
    [dir="ltr"] & {
      padding-left: var(--ck-spacing-control-padding-inline-compact);
    }

    [dir="rtl"] & {
      padding-right: var(--ck-spacing-control-padding-inline-compact);
    }
  }

  & .ck-list-item-button__check-holder {
    width: .9em;
    height: .9em;
    display: inline-flex;

    [dir="ltr"] & {
      margin-right: var(--ck-spacing-control-padding-inline-compact);
    }

    [dir="rtl"] & {
      margin-left: var(--ck-spacing-control-padding-inline-compact);
    }
  }

  & .ck-list-item-button__check-icon {
    height: 100%;
  }
}

:root, :host {
  --ck-collapsible-padding: var(--ck-spacing-padding);
  --ck-collapsible-children-padding: var(--ck-spacing-padding-comfortable) 0 0;
  --ck-collapsible-button-border-radius: var(--ck-border-radius-control);
  --ck-collapsible-button-font-weight: var(--ck-font-weight-ui-strong);
}

.ck.ck-collapsible {
  padding: var(--ck-collapsible-padding);

  & > .ck.ck-button {
    width: 100%;
    font-weight: var(--ck-collapsible-button-font-weight);
    border-radius: var(--ck-collapsible-button-border-radius);
    color: inherit;

    &:focus {
      background: none;
    }

    &:active, &:not(:focus), &:hover:not(:focus) {
      box-shadow: none;
      background: none;
      border-color: #0000;
    }

    & > .ck-icon {
      margin-right: var(--ck-spacing-control-icon-gap);
      width: var(--ck-collapsible-arrow-size, calc(.5 * var(--ck-icon-size)));
    }
  }

  & > .ck-collapsible__children {
    padding: var(--ck-collapsible-children-padding);
  }

  &.ck-collapsible_collapsed {
    & > .ck.ck-button .ck-icon {
      transform: rotate(-90deg);
    }

    & > .ck-collapsible__children {
      display: none;
    }
  }
}

:root, :host {
  --ck-color-grid-tile-size: 24px;
  --ck-color-grid-gap: var(--ck-spacing-gap-tight);
  --ck-color-grid-margin: 0;
  --ck-color-grid-padding: var(--ck-spacing-padding) 0;
  --ck-color-grid-tile-border-radius: var(--ck-radius-sm);
  --ck-color-grid-tile-hover-transform: none;
  --ck-color-grid-tile-hover-layer: auto;
}

.ck.ck-color-grid {
  grid-gap: var(--ck-color-grid-gap);
  margin: var(--ck-color-grid-margin);
  padding: var(--ck-color-grid-padding);
  width: min-content;
  display: grid;

  &:not(:has( ~ :not(.ck-hidden))) {
    padding-bottom: 0;
  }
}

.ck.ck-color-grid__tile {
  border-radius: var(--ck-color-grid-tile-border-radius);
  transition: box-shadow var(--ck-transition-duration-control) var(--ck-transition-timing-function-surface);

  @media (forced-colors: none) {
    width: var(--ck-color-grid-tile-size);
    height: var(--ck-color-grid-tile-size);
    min-width: var(--ck-color-grid-tile-size);
    min-height: var(--ck-color-grid-tile-size);
    border: 0;
    padding: 0;

    &.ck-on, &:focus:not(.ck-disabled), &:hover:not(.ck-disabled) {
      border: 0;
    }

    &.ck-color-selector__color-tile_bordered {
      box-shadow: inset 0 0 0 1px var(--ck-color-border-control);
    }

    &.ck-on {
      box-shadow: inset 0 0 0 1px var(--ck-color-surface-canvas), 0 0 0 2px var(--ck-color-text-primary);
    }

    &:hover:not(.ck-disabled), &:focus:not(.ck-disabled) {
      z-index: var(--ck-color-grid-tile-hover-layer);
      box-shadow: inset 0 0 0 1px var(--ck-color-surface-canvas), 0 0 0 2px var(--ck-color-interactive-focus-border);
      transform: var(--ck-color-grid-tile-hover-transform);
    }
  }

  @media (forced-colors: active) {
    width: unset;
    height: unset;
    min-width: unset;
    min-height: unset;
    padding: 0 var(--ck-spacing-padding);

    & .ck-button__label {
      display: inline-block;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    transition: var(--ck-transition-none);
  }

  &.ck-disabled {
    cursor: unset;
    transition: unset;
  }

  & .ck.ck-icon {
    color: var(--ck-color-color-grid-check-icon, #166fd4);
    display: none;
  }

  &.ck-on {
    & .ck.ck-icon {
      display: block;
    }
  }
}

.ck.ck-color-grid__label {
  padding: 0 var(--ck-spacing-control-padding-inline);
}

.color-picker-hex-input {
  width: max-content;

  & .ck.ck-input {
    min-width: unset;
  }
}

.ck.ck-color-picker__row {
  margin: var(--ck-spacing-gap-comfortable) 0 0;
  width: unset;
  flex-flow: row;
  justify-content: space-between;
  display: flex;

  & .ck.ck-labeled-field-view {
    padding-top: unset;
  }

  & .ck.ck-input-text {
    width: unset;
  }

  & .ck-color-picker__hash-view {
    padding-top: var(--ck-spacing-control-padding-block);
    padding-right: var(--ck-spacing-control-icon-gap);
  }
}

:root, :host {
  --ck-color-selector-padding: var(--ck-spacing-padding-compact);
  --ck-color-selector-grids-fragment-padding: var(--ck-spacing-padding-compact);
  --ck-color-selector-color-picker-padding: var(--ck-spacing-padding);
  --ck-color-selector-action-bar-padding: 0 var(--ck-spacing-padding) var(--ck-spacing-padding);
  --ck-color-selector-uniform-border-radius: var(--ck-border-radius-uniform);
  --ck-color-selector-color-picker-border-top: var(--ck-border-divider);
}

.ck.ck-color-selector {
  padding: var(--ck-color-selector-padding);

  & .ck-color-grids-fragment {
    padding: var(--ck-color-selector-grids-fragment-padding);

    & .ck-button.ck-color-selector__remove-color, & .ck-button.ck-color-selector__color-picker {
      align-items: center;
      width: 100%;
      display: flex;

      [dir="rtl"] & {
        justify-content: flex-start;
      }

      & .ck.ck-icon {
        [dir="ltr"] & {
          margin-right: var(--ck-spacing-control-padding-inline);
        }

        [dir="rtl"] & {
          margin-left: var(--ck-spacing-control-padding-inline);
        }
      }
    }

    & .ck-button.ck-color-selector__color-picker:not(:focus) {
      border-top: var(--ck-color-selector-color-picker-border-top);
    }

    & label.ck.ck-color-grid__label {
      font-weight: var(--ck-font-weight-ui-inherit);
    }
  }

  & .ck-color-picker-fragment {
    & .ck.ck-color-picker {
      padding: var(--ck-color-selector-color-picker-padding);

      & .hex-color-picker {
        min-width: 180px;
        height: 100px;

        &::part(saturation) {
          border-radius: var(--ck-border-radius-surface) var(--ck-border-radius-surface) 0 0;
        }

        &::part(hue) {
          border-radius: 0 0 var(--ck-border-radius-surface) var(--ck-border-radius-surface);
        }

        &::part(saturation-pointer), &::part(hue-pointer) {
          width: 15px;
          height: 15px;
        }
      }
    }

    & .ck.ck-color-selector_action-bar {
      padding: var(--ck-color-selector-action-bar-padding);
      flex-direction: row;
      justify-content: space-around;
      display: flex;

      & .ck-button-save, & .ck-button-cancel {
        flex: 1;
      }
    }
  }
}

:root, :host {
  --ck-dialog-max-height: 90vh;
  --ck-dialog-max-width: 100vw;
  --ck-dialog-border-radius: var(--ck-border-radius-surface);
  --ck-dialog-border: var(--ck-border-width-surface) solid var(--ck-color-border-container);
  --ck-dialog-shadow: var(--ck-shadow-surface-floating);
  --ck-dialog-background-color: var(--ck-color-surface-container);
  --ck-dialog-overlay-background-color: #00000080;
  --ck-dialog-header-padding: var(--ck-form-header-padding);
  --ck-dialog-content-padding: var(--ck-spacing-padding-comfortable);
  --ck-dialog-actions-padding: var(--ck-spacing-padding-compact) var(--ck-spacing-padding-comfortable) var(--ck-spacing-padding-comfortable) var(--ck-spacing-padding-comfortable);
  --ck-dialog-actions-gap: var(--ck-spacing-gap-comfortable);
}

.ck.ck-dialog-overlay {
  animation: ck-dialog-fade-in var(--ck-animation-duration-surface-entrance);
  background: var(--ck-dialog-overlay-background-color);
  z-index: var(--ck-z-dialog, var(--ck-z-modal));
  -webkit-user-select: none;
  user-select: none;
  overscroll-behavior: none;
  position: fixed;
  inset: 0;

  &.ck-dialog-overlay__transparent {
    pointer-events: none;
    animation: var(--ck-animation-none);
    background: none;
  }
}

.ck.ck-dialog {
  border-radius: var(--ck-dialog-border-radius);
  box-shadow: var(--ck-dialog-drop-shadow, var(--ck-dialog-shadow)), 0 0;
  background: var(--ck-color-dialog-background, var(--ck-dialog-background-color));
  max-height: var(--ck-dialog-max-height);
  max-width: var(--ck-dialog-max-width);
  border: var(--ck-dialog-border);
  overscroll-behavior: none;
  width: fit-content;
  position: absolute;

  & .ck.ck-form__header {
    border-bottom: var(--ck-color-dialog-form-header-border, var(--ck-border-divider));
    padding: var(--ck-dialog-header-padding);
    flex-shrink: 0;
  }

  &:not(.ck-dialog_modal) {
    & .ck.ck-form__header, & .ck.ck-form__header :not(.ck-button, .ck-button *) {
      cursor: grab;
    }
  }

  .ck.ck-dialog-overlay.ck-dialog-overlay__transparent & {
    pointer-events: all;
  }
}

@keyframes ck-dialog-fade-in {
  0% {
    background: none;
  }

  100% {
    background: var(--ck-dialog-overlay-background-color);
  }
}

.ck.ck-dialog {
  & .ck.ck-dialog__actions {
    padding: var(--ck-dialog-actions-padding);
    gap: var(--ck-dialog-actions-gap);
    justify-content: flex-end;
    display: flex;
  }
}

:root, :host {
  --ck-dropdown-arrow-size: calc(.5 * var(--ck-icon-size));
  --ck-dropdown-panel-padding: 0;
  --ck-dropdown-panel-uniform-border-radius: var(--ck-border-radius-uniform);
  --ck-dropdown-panel-uniform-button-border-radius: var(--ck-border-radius-control);
  --ck-dropdown-panel-border-radius: var(--ck-border-radius-surface-attached);
  --ck-dropdown-panel-background-color: var(--ck-color-surface-container);
  --ck-dropdown-panel-border-color: var(--ck-color-border-container);
  --ck-dropdown-list-background-color: transparent;
  --ck-dropdown-panel-border: var(--ck-border-width-surface) solid var(--ck-color-dropdown-panel-border, var(--ck-dropdown-panel-border-color));
}

.ck.ck-dropdown {
  font-size: inherit;
  display: inline-block;
  position: relative;

  & .ck-dropdown__arrow {
    width: var(--ck-dropdown-arrow-size);
    pointer-events: none;
    z-index: var(--ck-layer-base);
  }

  [dir="ltr"] & {
    & .ck-dropdown__arrow {
      right: var(--ck-spacing-control-padding-inline);
      margin-left: var(--ck-spacing-control-padding-inline);
    }
  }

  [dir="rtl"] & {
    & .ck-dropdown__arrow {
      left: var(--ck-spacing-control-padding-inline);
      margin-right: var(--ck-spacing-control-padding-inline-compact);
    }
  }

  &.ck-disabled .ck-dropdown__arrow {
    opacity: var(--ck-disabled-opacity, var(--ck-opacity-disabled));
  }

  & .ck-button.ck-dropdown__button {
    [dir="ltr"] & {
      &:not(.ck-button_with-text) {
        padding-left: var(--ck-spacing-control-padding-inline-compact);
      }
    }

    [dir="rtl"] & {
      &:not(.ck-button_with-text) {
        padding-right: var(--ck-spacing-control-padding-inline-compact);
      }
    }

    & .ck-button__label {
      text-overflow: ellipsis;
      width: 7em;
      overflow: hidden;
    }

    &.ck-disabled .ck-button__label {
      opacity: var(--ck-disabled-opacity, var(--ck-opacity-disabled));
    }

    &.ck-on {
      border-radius: var(--ck-dropdown-panel-uniform-button-border-radius, var(--ck-border-radius-surface-attached-bottom));
    }

    &.ck-dropdown__button_label-width_auto .ck-button__label {
      width: auto;
    }

    &.ck-off:active, &.ck-on:active {
      box-shadow: none;

      &:focus {
        box-shadow: var(--ck-focus-outer-shadow, var(--ck-interactive-focus-shadow)), 0 0;
      }
    }

    width: 100%;
  }

  & .ck-dropdown__panel {
    z-index: var(--ck-layer-panel);
    max-width: var(--ck-dropdown-max-width, 75vw);
    display: none;
    position: absolute;

    &.ck-dropdown__panel-visible {
      display: inline-block;
    }

    &.ck-dropdown__panel_fit-content {
      max-width: var(--ck-dropdown-max-width, none);
    }

    &.ck-dropdown__panel_ne, &.ck-dropdown__panel_nw, &.ck-dropdown__panel_n, &.ck-dropdown__panel_nmw, &.ck-dropdown__panel_nme {
      bottom: 100%;
    }

    &.ck-dropdown__panel_se, &.ck-dropdown__panel_sw, &.ck-dropdown__panel_smw, &.ck-dropdown__panel_sme, &.ck-dropdown__panel_s {
      top: 100%;
      bottom: auto;
    }

    &.ck-dropdown__panel_ne, &.ck-dropdown__panel_se {
      left: 0;
    }

    &.ck-dropdown__panel_nw, &.ck-dropdown__panel_sw {
      right: 0;
    }

    &.ck-dropdown__panel_s, &.ck-dropdown__panel_n {
      left: 50%;
      transform: translateX(-50%);
    }

    &.ck-dropdown__panel_nmw, &.ck-dropdown__panel_smw {
      left: 75%;
      transform: translateX(-75%);
    }

    &.ck-dropdown__panel_nme, &.ck-dropdown__panel_sme {
      left: 25%;
      transform: translateX(-25%);
    }
  }
}

.ck.ck-dropdown__panel {
  border-radius: var(--ck-dropdown-panel-border-radius);
  box-shadow: var(--ck-shadow-surface-floating), 0 0;
  padding: var(--ck-dropdown-panel-padding);
  background: var(--ck-color-dropdown-panel-background, var(--ck-dropdown-panel-background-color));
  border: var(--ck-dropdown-panel-border);
  min-width: 100%;
  bottom: 0;

  &.ck-dropdown__panel_se {
    border-radius: var(--ck-dropdown-panel-uniform-border-radius, var(--ck-border-radius-surface-cut-top-left));
  }

  &.ck-dropdown__panel_sw {
    border-radius: var(--ck-dropdown-panel-uniform-border-radius, var(--ck-border-radius-surface-cut-top-right));
  }

  &.ck-dropdown__panel_ne {
    border-radius: var(--ck-dropdown-panel-uniform-border-radius, var(--ck-border-radius-surface-cut-bottom-left));
  }

  &.ck-dropdown__panel_nw {
    border-radius: var(--ck-dropdown-panel-uniform-border-radius, var(--ck-border-radius-surface-cut-bottom-right));
  }

  & > .ck-list {
    background: var(--ck-dropdown-list-background-color);
  }

  &:focus {
    outline: none;
  }
}

.ck.ck-toolbar .ck-dropdown__panel {
  z-index: var(--ck-layer-panel-above);
}

.ck.ck-splitbutton {
  & .ck-splitbutton__action:focus {
    z-index: var(--ck-layer-control-raised);
  }

  &:hover > .ck-splitbutton__action, &.ck-splitbutton_open > .ck-splitbutton__action {
    [dir="ltr"] & {
      border-top-right-radius: unset;
      border-bottom-right-radius: unset;
    }

    [dir="rtl"] & {
      border-top-left-radius: unset;
      border-bottom-left-radius: unset;
    }
  }

  & > .ck-splitbutton__arrow {
    min-width: unset;

    [dir="ltr"] & {
      border-top-left-radius: unset;
      border-bottom-left-radius: unset;
    }

    [dir="rtl"] & {
      border-top-right-radius: unset;
      border-bottom-right-radius: unset;
    }

    & svg {
      width: var(--ck-dropdown-arrow-size);
    }
  }

  & > .ck-splitbutton__arrow:not(:focus) {
    border-top-width: 0;
    border-bottom-width: 0;
  }

  &.ck-splitbutton_open {
    border-radius: var(--ck-border-radius-control);

    & > .ck-splitbutton__action {
      border-end-start-radius: var(--ck-dropdown-panel-uniform-button-border-radius, 0);
    }

    & > .ck-splitbutton__arrow {
      border-end-end-radius: var(--ck-dropdown-panel-uniform-button-border-radius, 0);
    }
  }

  &.ck-splitbutton_open, &:hover {
    & > .ck-button:not(.ck-on):not(.ck-disabled):not(:hover) {
      background: var(--ck-color-split-button-hover-background, var(--ck-color-interactive-hover-surface));
    }

    & > .ck-splitbutton__arrow:not(.ck-disabled):after {
      content: "";
      background-color: var(--ck-color-split-button-hover-border, var(--ck-color-border-control));
      width: 1px;
      height: 100%;
      position: absolute;
    }

    & > .ck-splitbutton__arrow:focus:after {
      --ck-color-split-button-hover-border: var(--ck-color-interactive-focus-border);
      background-color: var(--ck-color-split-button-hover-border, var(--ck-color-interactive-focus-border));
    }

    [dir="ltr"] & {
      & > .ck-splitbutton__arrow:not(.ck-disabled):after {
        left: -1px;
      }
    }

    [dir="rtl"] & {
      & > .ck-splitbutton__arrow:not(.ck-disabled):after {
        right: -1px;
      }
    }
  }

  &.ck-splitbutton_flatten {
    &:hover, &.ck-splitbutton_open {
      & > .ck-splitbutton__action:not(.ck-disabled), & > .ck-splitbutton__arrow:not(.ck-disabled), & > .ck-splitbutton__arrow:not(.ck-disabled):not(:hover) {
        background-color: var(--ck-color-button-on-background, var(--ck-button-on-background-color));

        &:after {
          display: none;
        }
      }
    }

    &.ck-splitbutton_open:hover {
      & > .ck-splitbutton__action:not(.ck-disabled), & > .ck-splitbutton__arrow:not(.ck-disabled), & > .ck-splitbutton__arrow:not(.ck-disabled):not(:hover) {
        background-color: var(--ck-color-button-on-hover-background, var(--ck-button-on-hover-background-color));
      }
    }
  }

  font-size: inherit;
}

:root, :host {
  --ck-toolbar-dropdown-vertical-padding: var(--ck-spacing-padding-compact);
}

.ck.ck-toolbar-dropdown .ck-toolbar {
  border: 0;

  &.ck-toolbar_vertical {
    padding: var(--ck-toolbar-dropdown-vertical-padding);
  }
}

.ck.ck-toolbar-dropdown > .ck-dropdown__panel {
  width: max-content;
  max-width: var(--ck-toolbar-dropdown-max-width, 60vw);

  & .ck-button {
    &:focus {
      z-index: var(--ck-layer-control-raised);
    }
  }
}

:root, :host {
  --ck-list-dropdown-uniform-border-radius: var(--ck-border-radius-uniform);
  --ck-list-dropdown-button-border-radius: var(--ck-border-radius-control);
}

.ck.ck-dropdown > .ck-dropdown__panel > .ck-list {
  border-radius: var(--ck-list-dropdown-uniform-border-radius, 0 var(--ck-dropdown-panel-border-radius) var(--ck-dropdown-panel-border-radius) var(--ck-dropdown-panel-border-radius));

  & .ck-list__item {
    & > .ck-button {
      border-radius: var(--ck-list-dropdown-button-border-radius, 0);
    }

    &:first-child > .ck-button {
      border-radius: var(--ck-list-dropdown-button-border-radius, var(--ck-list-dropdown-uniform-border-radius, 0 var(--ck-dropdown-panel-border-radius) 0 0));
    }

    &:last-child > .ck-button {
      border-radius: var(--ck-list-dropdown-button-border-radius, var(--ck-list-dropdown-uniform-border-radius, 0 0 var(--ck-dropdown-panel-border-radius) var(--ck-dropdown-panel-border-radius)));
    }
  }
}

.ck.ck-dropdown-menu-list__nested-menu {
  display: block;
}

:root, :host {
  --ck-dropdown-menu-menu-item-min-width: 18em;
}

.ck.ck-dropdown-menu-list__nested-menu__item {
  min-width: var(--ck-dropdown-menu-menu-item-min-width);
}

:root, :host {
  --ck-dropdown-menu-list-item-spinner-size: 20px;
}

.ck-button.ck-dropdown-menu-list__nested-menu__item__button {
  border-radius: 0;

  & > .ck-spinner-container, & > .ck-spinner-container .ck-spinner {
    --ck-toolbar-spinner-size: var(--ck-dropdown-menu-list-item-spinner-size);
  }

  & > .ck-spinner-container {
    margin-left: calc(-1 * var(--ck-spacing-control-padding-inline-compact));
    margin-right: var(--ck-spacing-control-padding-inline-compact);
  }

  &:focus {
    box-shadow: none;
    border-color: #0000;

    &:not(.ck-on) {
      background: var(--ck-color-button-default-hover-background, var(--ck-button-default-hover-background-color));
    }
  }
}

:root, :host {
  --ck-dropdown-menu-button-border-radius: var(--ck-list-item-button-border-radius);
}

.ck.ck-button.ck-dropdown-menu-list__nested-menu__button {
  width: 100%;
  padding: var(--ck-spacing-control-padding-block) calc(2 * var(--ck-spacing-control-padding-inline));
  border-radius: var(--ck-dropdown-menu-button-border-radius);

  &:focus {
    box-shadow: none;
    border-color: #0000;

    &:not(.ck-on) {
      background: var(--ck-color-button-default-hover-background, var(--ck-button-default-hover-background-color));
    }
  }

  & > .ck-button__label {
    text-overflow: ellipsis;
    flex-grow: 1;
    overflow: hidden;
  }

  &.ck-disabled > .ck-button__label {
    opacity: var(--ck-disabled-opacity, var(--ck-opacity-disabled));
  }

  &.ck-icon-spacing:not(:has(.ck-button__icon)) > .ck-button__label {
    margin-left: calc(var(--ck-icon-size) - var(--ck-spacing-control-padding-inline-compact));
  }

  & > .ck-dropdown-menu-list__nested-menu__button__arrow {
    width: var(--ck-dropdown-arrow-size);
    pointer-events: none;
    z-index: var(--ck-z-default, var(--ck-z-base));

    [dir="ltr"] & {
      right: var(--ck-spacing-control-padding-inline);
      margin-left: var(--ck-spacing-control-padding-inline);
      margin-right: calc(-1 * var(--ck-spacing-control-padding-inline-compact));
      transform: rotate(-90deg);
    }

    [dir="rtl"] & {
      left: var(--ck-spacing-control-padding-inline);
      margin-right: var(--ck-spacing-control-padding-inline-compact);
      margin-left: calc(-1 * var(--ck-spacing-control-padding-inline-compact));
      transform: rotate(90deg);
    }
  }

  &.ck-disabled > .ck-dropdown-menu-list__nested-menu__button__arrow {
    opacity: var(--ck-disabled-opacity, var(--ck-opacity-disabled));
  }

  [dir="ltr"] & {
    &:not(.ck-button_with-text) {
      padding-left: var(--ck-spacing-control-padding-inline-compact);
    }
  }

  [dir="rtl"] & {
    &:not(.ck-button_with-text) {
      padding-right: var(--ck-spacing-control-padding-inline-compact);
    }
  }
}

:root, :host {
  --ck-dropdown-menu-panel-max-height: 314px;
  --ck-dropdown-menu-panel-uniform-border-radius: var(--ck-border-radius-uniform);
  --ck-dropdown-menu-panel-border-radius: var(--ck-border-radius-surface-attached);
}

.ck.ck-balloon-panel.ck-dropdown-menu__nested-menu__panel {
  border-radius: var(--ck-dropdown-menu-panel-border-radius);
  box-shadow: var(--ck-shadow-surface-floating), 0 0;
  background: var(--ck-color-dropdown-panel-background, var(--ck-dropdown-panel-background-color));
  border: var(--ck-dropdown-panel-border);
  height: fit-content;
  max-width: var(--ck-dropdown-menu-menu-panel-max-width, 75vw);
  max-height: var(--ck-dropdown-menu-panel-max-height);
  position: absolute;
  bottom: 0;
  overflow-y: auto;

  &:after, &:before {
    display: none;
  }

  &.ck-balloon-panel_es, &.ck-balloon-panel_se {
    border-radius: var(--ck-dropdown-menu-panel-uniform-border-radius, var(--ck-border-radius-surface-cut-top-left));
  }

  &.ck-balloon-panel_ws, &.ck-balloon-panel_sw {
    border-radius: var(--ck-dropdown-menu-panel-uniform-border-radius, var(--ck-border-radius-surface-cut-top-right));
  }

  &.ck-balloon-panel_en, &.ck-balloon-panel_ne {
    border-radius: var(--ck-dropdown-menu-panel-uniform-border-radius, var(--ck-border-radius-surface-cut-bottom-left));
  }

  &.ck-balloon-panel_wn, &.ck-balloon-panel_nw {
    border-radius: var(--ck-dropdown-menu-panel-uniform-border-radius, var(--ck-border-radius-surface-cut-bottom-right));
  }

  &:focus {
    outline: none;
  }

  z-index: var(--ck-layer-panel-above);
}

:root, :host {
  --ck-editor-editable-padding: 1em;
  --ck-editor-outer-radius: 0;
  --ck-editor-sticky-panel-outer-radius: 0;
  --ck-editor-frame-border-radius: 0;
  --ck-editor-sticky-panel-border-radius: 0;
  --ck-editor-frame-border: var(--ck-border-width-surface) solid var(--ck-editor-frame-border-color);
  --ck-editor-frame-border-color: var(--ck-color-border-container);
  --ck-editor-editable-focus-border-color: var(--ck-interactive-focus-border-color);
}

.ck-rounded-corners {
  --ck-editor-outer-radius: var(--ck-rounded-corners-radius, var(--ck-radius-corners));
  --ck-editor-frame-border-radius: var(--ck-editor-outer-radius);
  --ck-editor-sticky-panel-border-radius: var(--ck-editor-outer-radius);
}

.ck.ck-editor__top {
  & .ck-sticky-panel {
    & .ck-sticky-panel__content {
      border-top-left-radius: var(--ck-editor-sticky-panel-border-radius);
      border-top-right-radius: var(--ck-editor-sticky-panel-border-radius);
      border: var(--ck-editor-frame-border);
      border-bottom-width: 0;
      border-bottom-right-radius: 0;
      border-bottom-left-radius: 0;

      &.ck-sticky-panel__content_sticky {
        border-bottom-width: var(--ck-border-width-surface);
        border-top-left-radius: var(--ck-editor-sticky-panel-outer-radius);
        border-top-right-radius: var(--ck-editor-sticky-panel-outer-radius);
      }

      & .ck-menu-bar {
        border: 0;
        border-bottom: var(--ck-editor-frame-border);
      }

      & .ck-toolbar {
        border: 0;
      }

      & > * {
        border-radius: 0;
      }

      & > :first-child {
        border-top-left-radius: calc(var(--ck-editor-sticky-panel-border-radius) - var(--ck-border-width-surface));
        border-top-right-radius: calc(var(--ck-editor-sticky-panel-border-radius) - var(--ck-border-width-surface));
      }

      &.ck-sticky-panel__content_sticky > :first-child {
        border-top-left-radius: calc(var(--ck-editor-sticky-panel-outer-radius) - var(--ck-border-width-surface));
        border-top-right-radius: calc(var(--ck-editor-sticky-panel-outer-radius) - var(--ck-border-width-surface));
      }
    }
  }
}

.ck.ck-editor__editable_root:not(.ck-editor__nested-editable) {
  border-radius: var(--ck-editor-frame-border-radius);
}

.ck.ck-editor__editable:not(.ck-editor__nested-editable) {
  &.ck-focused {
    border-color: var(--ck-editor-editable-focus-border-color);
    box-shadow: var(--ck-inner-shadow, var(--ck-inset-shadow-sm)), 0 0;
    outline: none;
  }
}

.ck.ck-editor__editable_inline {
  padding: var(--ck-editor-editable-padding);
  border: var(--ck-border-width-control) solid transparent;
  overflow: auto;

  &[dir="ltr"] {
    text-align: left;
  }

  &[dir="rtl"] {
    text-align: right;
  }

  & > :first-child {
    margin-top: var(--ck-spacing-gap-comfortable);
  }

  & > :last-child {
    margin-bottom: var(--ck-spacing-gap-comfortable);
  }

  &.ck-blurred ::selection {
    background: var(--ck-color-editable-blur-selection, #d9d9d9);
  }

  &.ck-editor__editable_inline-root br {
    margin-top: 0;
    margin-bottom: 0;
  }
}

.ck.ck-balloon-panel.ck-toolbar-container[class*="arrow_n"] {
  &:after {
    border-bottom-color: var(--ck-color-panel-background, var(--ck-balloon-panel-background-color));
  }
}

.ck.ck-balloon-panel.ck-toolbar-container[class*="arrow_s"] {
  &:after {
    border-top-color: var(--ck-color-panel-background, var(--ck-balloon-panel-background-color));
  }
}

.ck.ck-toolbar-container {
  & > .ck {
    border-radius: 0;
  }

  & > .ck:first-child {
    border-top-left-radius: calc(var(--ck-balloon-panel-border-radius) - var(--ck-border-width-surface));
    border-top-right-radius: calc(var(--ck-balloon-panel-border-radius) - var(--ck-border-width-surface));
  }

  & > .ck:last-child {
    border-bottom-left-radius: calc(var(--ck-balloon-panel-border-radius) - var(--ck-border-width-surface));
    border-bottom-right-radius: calc(var(--ck-balloon-panel-border-radius) - var(--ck-border-width-surface));
  }
}

:root, :host {
  --ck-form-row-padding: var(--ck-spacing-padding-snug) var(--ck-spacing-padding-comfortable);
  --ck-form-row-edge-padding-top: var(--ck-spacing-padding-spacious);
  --ck-form-row-edge-padding-bottom: var(--ck-spacing-padding);
  --ck-form-row-edge-gap-top: var(--ck-spacing-gap-comfortable);
  --ck-form-row-edge-gap-bottom: var(--ck-spacing-gap-comfortable);
  --ck-form-row-label-font-size: var(--ck-font-size-md);
}

.ck.ck-form__row {
  padding: var(--ck-form-row-padding);
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  display: flex;

  & > .ck-label {
    font-size: var(--ck-form-row-label-font-size);
  }

  &.ck-form__row_large-top-padding {
    padding-top: var(--ck-form-row-edge-padding-top);
  }

  &.ck-form__row_large-bottom-padding {
    padding-bottom: var(--ck-form-row-edge-padding-bottom);

    &:last-child {
      padding-bottom: var(--ck-spacing-padding-comfortable);
    }
  }

  &.ck-form__row_large-top-margin {
    margin-top: var(--ck-form-row-edge-gap-top);
  }

  &.ck-form__row_large-bottom-margin {
    margin-bottom: var(--ck-form-row-edge-gap-bottom);
  }

  &.ck-form__row_with-submit {
    flex-wrap: nowrap;

    & > :not(:first-child) {
      margin-inline-start: var(--ck-spacing-padding);
    }
  }

  & > .ck.ck-form__row {
    padding: 0;
  }
}

:root, :host {
  --ck-form-header-height: calc(var(--ck-form-header-label-font-size) * var(--ck-line-height-base)
		+ var(--ck-spacing-padding-comfortable)
		+ var(--ck-spacing-padding-compact));
  --ck-form-header-padding-block: var(--ck-spacing-padding-compact);
  --ck-form-header-padding: var(--ck-spacing-padding-comfortable) var(--ck-spacing-padding-comfortable) var(--ck-spacing-padding-compact) var(--ck-spacing-padding-comfortable);
  --ck-form-header-with-back-button-padding-inline-start: var(--ck-spacing-padding-comfortable);
  --ck-form-header-label-font-size: var(--ck-font-size-normal, var(--ck-font-size-base));
}

.ck.ck-form__header {
  padding: var(--ck-form-header-padding);
  height: var(--ck-form-header-height);
  border-bottom: var(--ck-border-divider);
  flex-flow: row;
  flex-shrink: 0;
  justify-content: space-between;
  align-items: center;
  display: flex;

  & > .ck-icon {
    flex-shrink: 0;
    margin-inline-end: var(--ck-spacing-control-icon-gap);
  }

  & .ck-form__header__label {
    --ck-font-size-base: var(--ck-form-header-label-font-size);
    font-weight: var(--ck-font-weight-ui-heading);
  }

  &:has(.ck-button-back:not(.ck-hidden)) {
    padding-inline-start: var(--ck-form-header-with-back-button-padding-inline-start, var(--ck-spacing-padding));
  }

  & > .ck-button-back {
    margin-inline-end: var(--ck-spacing-gap-compact);
  }

  & > .ck.ck-button {
    --ck-size-control-min-height: calc(var(--ck-form-header-label-font-size) * var(--ck-line-height-base));
    flex-shrink: 0;
    padding: 1px;
  }

  & h2.ck-form__header__label {
    text-overflow: ellipsis;
    flex-grow: 1;
    overflow: hidden;
  }
}

:root, :host {
  --ck-icon-size-ratio: calc(20 / 14);
  --ck-icon-size: calc(1em * var(--ck-icon-size-ratio));
  --ck-icon-font-size: inherit;
}

.ck.ck-icon {
  width: var(--ck-icon-size);
  height: var(--ck-icon-size);
  font-size: var(--ck-icon-font-size);
  cursor: inherit;

  & * {
    cursor: inherit;
  }

  &.ck-icon_inherit-color {
    color: inherit;

    & * {
      color: inherit;

      &:not([fill]) {
        fill: currentColor;
      }
    }
  }

  vertical-align: middle;
}

:root, :host {
  --ck-input-width: 18em;
  --ck-input-padding: var(--ck-spacing-padding-compact) var(--ck-spacing-padding);
  --ck-input-font-size: var(--ck-font-size-control);
  --ck-input-border-radius: var(--ck-border-radius-control);
  --ck-input-background-color: var(--ck-color-surface-control);
  --ck-input-border-color: var(--ck-color-border-control);
  --ck-input-error-border-color: var(--ck-color-feedback-error);
  --ck-input-text-color: var(--ck-color-text-primary);
  --ck-input-disabled-background-color: #f2f2f2;
  --ck-input-disabled-border-color: var(--ck-color-border-control);
  --ck-input-disabled-text-color: var(--ck-color-text-disabled);
  --ck-input-border: var(--ck-border-width-control) solid var(--ck-color-input-border, var(--ck-input-border-color));
  --ck-input-focus-border-color: var(--ck-interactive-focus-border-color);
  --ck-input-text-width: var(--ck-input-width);
}

.ck.ck-input {
  border-radius: var(--ck-input-border-radius);
  background: var(--ck-color-input-background, var(--ck-input-background-color));
  border: var(--ck-input-border);
  padding: var(--ck-input-padding);
  min-width: var(--ck-input-width);
  color: var(--ck-color-input-text, var(--ck-input-text-color));
  font-size: var(--ck-input-font-size);
  min-height: var(--ck-size-control-min-height);
  transition: var(--ck-transition-control-fast);

  @media (prefers-reduced-motion: reduce) {
    transition: var(--ck-transition-none);
  }

  &:focus {
    border-color: var(--ck-input-focus-border-color);
    box-shadow: var(--ck-focus-outer-shadow, var(--ck-interactive-focus-shadow)), 0 0;
    outline: none;
  }

  &[readonly] {
    border: var(--ck-border-width-control) solid var(--ck-color-input-disabled-border, var(--ck-input-disabled-border-color));
    background: var(--ck-color-input-disabled-background, var(--ck-input-disabled-background-color));
    color: var(--ck-color-input-disabled-text, var(--ck-input-disabled-text-color));

    &:focus {
      box-shadow: var(--ck-focus-disabled-outer-shadow, var(--ck-interactive-focus-disabled-shadow)), 0 0;
    }
  }

  &.ck-error {
    border-color: var(--ck-color-input-error-border, var(--ck-input-error-border-color));
    animation: ck-input-shake var(--ck-animation-duration-feedback) var(--ck-animation-timing-function-feedback) var(--ck-animation-fill-mode-feedback);

    @media (prefers-reduced-motion: reduce) {
      animation: var(--ck-animation-none);
    }

    &:focus {
      box-shadow: var(--ck-focus-error-outer-shadow, var(--ck-interactive-focus-error-shadow)), 0 0;
    }
  }
}

@keyframes ck-input-shake {
  20% {
    transform: translateX(-2px);
  }

  40% {
    transform: translateX(2px);
  }

  60% {
    transform: translateX(-1px);
  }

  80% {
    transform: translateX(1px);
  }

  100% {
    transform: translateX(0);
  }
}

.ck-textarea {
  overflow-x: hidden;
}

.ck.ck-label {
  font-weight: var(--ck-font-weight-ui-label);
  display: block;
}

.ck.ck-voice-label {
  display: none;
}

:root, :host {
  --ck-labeled-field-label-background-color: var(--ck-color-surface-control);
  --ck-labeled-field-label-start-gap: var(--ck-spacing-padding);
  --ck-labeled-field-label-font-size: var(--ck-font-size-md);
}

.ck.ck-labeled-field-view {
  border-radius: var(--ck-rounded-corners-radius, var(--ck-radius-corners));

  & .ck.ck-label {
    display: block;
    position: absolute;
  }

  & > .ck.ck-labeled-field-view__input-wrapper {
    width: 100%;
    display: flex;

    & > .ck.ck-label {
      pointer-events: none;
      background: var(--ck-color-labeled-field-label-background, var(--ck-labeled-field-label-background-color));
      padding: 0 calc(.5 * var(--ck-font-size-tiny, var(--ck-font-size-xs)));
      line-height: initial;
      font-size: var(--ck-labeled-field-label-font-size);
      font-weight: var(--ck-font-weight-ui-muted);
      text-overflow: ellipsis;
      max-width: 100%;
      transition: transform var(--ck-transition-duration-control-fast) var(--ck-transition-timing-function-control-emphasized),
				padding var(--ck-transition-duration-control-fast) var(--ck-transition-timing-function-control-emphasized),
				background var(--ck-transition-duration-control-fast) var(--ck-transition-timing-function-control-emphasized);
      top: 0;
      overflow: hidden;

      [dir="ltr"] & {
        transform-origin: 0 0;
        transform: translate(var(--ck-labeled-field-label-start-gap), -6px) scale(.75);
        left: 0;
      }

      [dir="rtl"] & {
        transform-origin: 100% 0;
        transform: translate(calc(-1 * var(--ck-labeled-field-label-start-gap)), -6px) scale(.75);
        right: 0;
      }

      @media (prefers-reduced-motion: reduce) {
        transition: var(--ck-transition-none);
      }
    }

    position: relative;
  }

  &.ck-error {
    & > .ck.ck-labeled-field-view__input-wrapper > .ck.ck-label, & .ck-input:not([readonly]) + .ck.ck-label {
      color: var(--ck-color-feedback-error);
    }
  }

  & .ck-labeled-field-view__status {
    font-size: var(--ck-font-size-small, var(--ck-font-size-sm));
    margin-top: var(--ck-spacing-gap-compact);
    white-space: normal;

    &.ck-labeled-field-view__status_error {
      color: var(--ck-color-feedback-error);
    }
  }

  &.ck-disabled > .ck.ck-labeled-field-view__input-wrapper > .ck.ck-label, &.ck-labeled-field-view_empty:not(.ck-labeled-field-view_focused) > .ck.ck-labeled-field-view__input-wrapper > .ck.ck-label {
    color: var(--ck-color-input-disabled-text, var(--ck-input-disabled-text-color));
  }

  &.ck-disabled.ck-labeled-field-view_empty:not(.ck-labeled-field-view_placeholder) > .ck.ck-labeled-field-view__input-wrapper > .ck.ck-label, &.ck-labeled-field-view_empty:not(.ck-labeled-field-view_focused):not(.ck-labeled-field-view_placeholder):not(.ck-error) > .ck.ck-labeled-field-view__input-wrapper > .ck.ck-label {
    [dir="ltr"] & {
      transform: translate(var(--ck-labeled-field-label-default-position-x, var(--ck-labeled-field-label-start-gap)), var(--ck-labeled-field-label-default-position-y, calc((var(--ck-size-control-min-height) - 1lh) / 2))) scale(1);
    }

    [dir="rtl"] & {
      transform: translate(calc(-1 * var(--ck-labeled-field-label-default-position-x, var(--ck-labeled-field-label-start-gap))), var(--ck-labeled-field-label-default-position-y, calc((var(--ck-size-control-min-height) - 1lh) / 2))) scale(1);
    }

    max-width: var(--ck-labeled-field-empty-unfocused-max-width, calc(100% - 2 * var(--ck-labeled-field-label-start-gap)));
    background: none;
    padding: 0;
  }

  & > .ck.ck-labeled-field-view__input-wrapper > .ck-dropdown > .ck.ck-button {
    padding-inline: var(--ck-spacing-padding);
    background: none;
  }

  &.ck-labeled-field-view_empty > .ck.ck-labeled-field-view__input-wrapper > .ck-dropdown > .ck-button > .ck-button__label {
    opacity: 0;
  }

  &.ck-labeled-field-view_empty:not(.ck-labeled-field-view_focused):not(.ck-labeled-field-view_placeholder) > .ck.ck-labeled-field-view__input-wrapper > .ck-dropdown + .ck-label {
    max-width: var(--ck-labeled-field-empty-unfocused-max-width, calc(100% - 2 * var(--ck-labeled-field-label-start-gap) - var(--ck-dropdown-arrow-size) - var(--ck-spacing-control-padding-inline)));
  }

  &.ck-labeled-field-view_full-width {
    flex-grow: 1;
  }
}

.ck.ck-labeled-input .ck-labeled-input__status {
  font-size: var(--ck-font-size-small, var(--ck-font-size-sm));
  margin-top: var(--ck-spacing-gap-compact);
  white-space: normal;
}

.ck.ck-labeled-input .ck-labeled-input__status_error {
  color: var(--ck-color-feedback-error);
}

:root, :host {
  --ck-list-item-min-width: 10em;
  --ck-list-padding: var(--ck-spacing-padding-compact);
  --ck-list-item-outer-padding: var(--ck-spacing-padding-tight);
  --ck-list-separator-inline-margin: calc(-1 * var(--ck-spacing-padding-compact));
  --ck-list-border-radius: var(--ck-border-radius-surface);
  --ck-list-background-color: var(--ck-color-surface-control);
  --ck-list-button-hover-background-color: var(--ck-color-button-default-hover-background, var(--ck-button-default-hover-background-color));
  --ck-list-button-on-background-color: var(--ck-color-button-on-color, var(--ck-button-on-text-color));
  --ck-list-button-on-text-color: var(--ck-color-text-inverse);
  --ck-list-divider-color: var(--ck-color-divider);
  --ck-list-group-label-font-size: var(--ck-font-size-small, var(--ck-font-size-sm));
}

.ck.ck-list {
  border-radius: var(--ck-list-border-radius);
  background: var(--ck-color-list-background, var(--ck-list-background-color));
  padding: var(--ck-list-padding);
  -webkit-user-select: none;
  user-select: none;
  flex-direction: column;
  list-style-type: none;
  display: flex;

  &.ck-list_no-inline-padding {
    --ck-list-separator-inline-margin: 0;
    padding-inline: 0;
  }

  & .ck-list__item, & .ck-list__separator {
    display: block;
  }

  & .ck-list__item > :focus {
    z-index: var(--ck-layer-base);
    position: relative;
  }
}

.ck.ck-list__item {
  cursor: default;
  padding: var(--ck-list-item-outer-padding);
  min-width: var(--ck-list-item-min-width);

  & > .ck-button:not(.ck-list-item-button) {
    padding: var(--ck-spacing-control-padding-block) calc(2 * var(--ck-spacing-control-padding-inline));
    min-height: unset;
    border-radius: var(--ck-list-item-button-border-radius);
    width: 100%;

    [dir="ltr"] & {
      text-align: left;
    }

    [dir="rtl"] & {
      text-align: right;
    }

    & .ck-button__label {
      line-height: calc(var(--ck-line-height-base) * var(--ck-font-size-normal, var(--ck-font-size-base)));
    }

    &:active {
      box-shadow: none;
    }

    &.ck-on {
      background: var(--ck-color-list-button-on-background, var(--ck-list-button-on-background-color));
      color: var(--ck-color-list-button-on-text, var(--ck-list-button-on-text-color));

      &:active {
        box-shadow: none;
      }

      &:hover:not(.ck-disabled) {
        background: var(--ck-color-list-button-on-background-focus, var(--ck-color-list-button-on-background, var(--ck-list-button-on-background-color)));
      }

      &:focus:not(.ck-disabled) {
        border-color: var(--ck-color-surface-control);
      }
    }

    &:hover:not(.ck-disabled) {
      background: var(--ck-color-list-button-hover-background, var(--ck-list-button-hover-background-color));
    }
  }

  & > .ck-button.ck-switchbutton {
    &.ck-on {
      background: var(--ck-color-list-background, var(--ck-list-background-color));
      color: inherit;

      &:hover:not(.ck-disabled) {
        background: var(--ck-color-list-button-hover-background, var(--ck-list-button-hover-background-color));
        color: inherit;
      }
    }
  }
}

.ck-list .ck-list__group {
  padding-top: var(--ck-spacing-gap);

  &:first-child {
    padding-top: 0;
  }

  :not(.ck-hidden) ~ & {
    border-top: var(--ck-border-width-divider) solid var(--ck-list-divider-color);
  }

  & > .ck-label {
    font-size: var(--ck-list-group-label-font-size);
    font-weight: var(--ck-font-weight-ui-label);
    padding: var(--ck-spacing-gap) var(--ck-spacing-padding-comfortable) 0;
  }
}

.ck.ck-list__separator {
  height: 1px;
  width: calc(100% - 2 * var(--ck-list-separator-inline-margin));
  background: var(--ck-list-divider-color);
  margin: var(--ck-spacing-gap-compact) var(--ck-list-separator-inline-margin);
}

:root, :host {
  --ck-balloon-panel-border-radius: var(--ck-border-radius-surface);
  --ck-balloon-panel-border: var(--ck-balloon-border-width, var(--ck-border-width-surface)) solid var(--ck-color-panel-border, var(--ck-balloon-panel-border-color));
  --ck-balloon-panel-background-color: var(--ck-color-surface-container);
  --ck-balloon-panel-border-color: var(--ck-color-border-container);
  --ck-balloon-panel-arrow-display: none;
  --ck-balloon-arrow-half-width: 8px;
  --ck-balloon-arrow-height: 10px;
  --ck-balloon-arrow-offset: 2px;
}

.ck.ck-balloon-panel {
  border-radius: var(--ck-balloon-panel-border-radius);
  box-shadow: var(--ck-shadow-surface-floating), 0 0;
  background: var(--ck-color-panel-background, var(--ck-balloon-panel-background-color));
  border: var(--ck-balloon-panel-border);
  min-height: 15px;
  z-index: var(--ck-layer-panel);
  display: none;
  position: absolute;

  &.ck-balloon-panel_with-arrow {
    &:before, &:after {
      display: var(--ck-balloon-panel-arrow-display);
      content: "";
      border-style: solid;
      width: 0;
      height: 0;
      position: absolute;
    }

    &:before {
      z-index: var(--ck-balloon-panel-arrow-z-index, var(--ck-layer-balloon-arrow-back));
    }

    &:after {
      z-index: var(--ck-layer-balloon-arrow-front);
    }
  }

  &[class*="arrow_n"] {
    &:before, &:after {
      border-width: 0 var(--ck-balloon-arrow-half-width) var(--ck-balloon-arrow-height) var(--ck-balloon-arrow-half-width);
    }

    &:before {
      border-color: transparent transparent var(--ck-color-panel-border, var(--ck-balloon-panel-border-color)) transparent;
      margin-top: calc(-1 * var(--ck-balloon-border-width, var(--ck-border-width-surface)));
      z-index: var(--ck-layer-balloon-arrow-back);
    }

    &:after {
      border-color: transparent transparent var(--ck-color-panel-background, var(--ck-balloon-panel-background-color)) transparent;
      margin-top: calc(var(--ck-balloon-arrow-offset) - var(--ck-balloon-border-width, var(--ck-border-width-surface)));
      z-index: var(--ck-layer-balloon-arrow-front);
    }
  }

  &[class*="arrow_s"] {
    &:before, &:after {
      border-width: var(--ck-balloon-arrow-height) var(--ck-balloon-arrow-half-width) 0 var(--ck-balloon-arrow-half-width);
    }

    &:before {
      border-color: var(--ck-color-panel-border, var(--ck-balloon-panel-border-color)) transparent transparent;
      filter: drop-shadow(var(--ck-balloon-arrow-drop-shadow, 0 2px 2px var(--ck-color-shadow-drop)));
      margin-bottom: calc(-1 * var(--ck-balloon-border-width, var(--ck-border-width-surface)));
      z-index: var(--ck-layer-balloon-arrow-back);
    }

    &:after {
      border-color: var(--ck-color-panel-background, var(--ck-balloon-panel-background-color)) transparent transparent transparent;
      margin-bottom: calc(var(--ck-balloon-arrow-offset) - var(--ck-balloon-border-width, var(--ck-border-width-surface)));
      z-index: var(--ck-layer-balloon-arrow-front);
    }
  }

  &[class*="arrow_e"] {
    &:before, &:after {
      border-width: var(--ck-balloon-arrow-half-width) 0 var(--ck-balloon-arrow-half-width) var(--ck-balloon-arrow-height);
    }

    &:before {
      border-color: transparent transparent transparent var(--ck-color-panel-border, var(--ck-balloon-panel-border-color));
      margin-right: calc(-1 * var(--ck-balloon-border-width, var(--ck-border-width-surface)));
    }

    &:after {
      border-color: transparent transparent transparent var(--ck-color-panel-background, var(--ck-balloon-panel-background-color));
      margin-right: calc(var(--ck-balloon-arrow-offset) - var(--ck-balloon-border-width, var(--ck-border-width-surface)));
    }
  }

  &[class*="arrow_w"] {
    &:before, &:after {
      border-width: var(--ck-balloon-arrow-half-width) var(--ck-balloon-arrow-height) var(--ck-balloon-arrow-half-width) 0;
    }

    &:before {
      border-color: transparent var(--ck-color-panel-border, var(--ck-balloon-panel-border-color)) transparent transparent;
      margin-left: calc(-1 * var(--ck-balloon-border-width, var(--ck-border-width-surface)));
    }

    &:after {
      border-color: transparent var(--ck-color-panel-background, var(--ck-balloon-panel-background-color)) transparent transparent;
      margin-left: calc(var(--ck-balloon-arrow-offset) - var(--ck-balloon-border-width, var(--ck-border-width-surface)));
    }
  }

  &.ck-balloon-panel_arrow_n {
    &:before, &:after {
      margin-left: calc(-1 * var(--ck-balloon-arrow-half-width));
      left: 50%;
      top: calc(-1 * var(--ck-balloon-arrow-height));
    }
  }

  &.ck-balloon-panel_arrow_nw {
    &:before, &:after {
      left: calc(2 * var(--ck-balloon-arrow-half-width));
      top: calc(-1 * var(--ck-balloon-arrow-height));
    }
  }

  &.ck-balloon-panel_arrow_ne {
    &:before, &:after {
      right: calc(2 * var(--ck-balloon-arrow-half-width));
      top: calc(-1 * var(--ck-balloon-arrow-height));
    }
  }

  &.ck-balloon-panel_arrow_s {
    &:before, &:after {
      margin-left: calc(-1 * var(--ck-balloon-arrow-half-width));
      left: 50%;
      bottom: calc(-1 * var(--ck-balloon-arrow-height));
    }
  }

  &.ck-balloon-panel_arrow_sw {
    &:before, &:after {
      left: calc(2 * var(--ck-balloon-arrow-half-width));
      bottom: calc(-1 * var(--ck-balloon-arrow-height));
    }
  }

  &.ck-balloon-panel_arrow_se {
    &:before, &:after {
      right: calc(2 * var(--ck-balloon-arrow-half-width));
      bottom: calc(-1 * var(--ck-balloon-arrow-height));
    }
  }

  &.ck-balloon-panel_arrow_sme {
    &:before, &:after {
      margin-right: calc(2 * var(--ck-balloon-arrow-half-width));
      right: 25%;
      bottom: calc(-1 * var(--ck-balloon-arrow-height));
    }
  }

  &.ck-balloon-panel_arrow_smw {
    &:before, &:after {
      margin-left: calc(2 * var(--ck-balloon-arrow-half-width));
      left: 25%;
      bottom: calc(-1 * var(--ck-balloon-arrow-height));
    }
  }

  &.ck-balloon-panel_arrow_nme {
    &:before, &:after {
      margin-right: calc(2 * var(--ck-balloon-arrow-half-width));
      right: 25%;
      top: calc(-1 * var(--ck-balloon-arrow-height));
    }
  }

  &.ck-balloon-panel_arrow_nmw {
    &:before, &:after {
      margin-left: calc(2 * var(--ck-balloon-arrow-half-width));
      left: 25%;
      top: calc(-1 * var(--ck-balloon-arrow-height));
    }
  }

  &.ck-balloon-panel_arrow_e {
    &:before, &:after {
      right: calc(-1 * var(--ck-balloon-arrow-height));
      margin-top: calc(-1 * var(--ck-balloon-arrow-half-width));
      top: 50%;
    }
  }

  &.ck-balloon-panel_arrow_w {
    &:before, &:after {
      left: calc(-1 * var(--ck-balloon-arrow-height));
      margin-top: calc(-1 * var(--ck-balloon-arrow-half-width));
      top: 50%;
    }
  }

  &.ck-balloon-panel_visible {
    display: block;
  }
}

.ck .ck-balloon-rotator__navigation {
  background: var(--ck-color-toolbar-background, var(--ck-toolbar-background-color));
  border-bottom: var(--ck-border-divider);
  padding: 0 var(--ck-spacing-padding);
  border-radius: var(--ck-balloon-panel-border-radius) var(--ck-balloon-panel-border-radius) 0 0;
  align-items: center;
  display: flex;

  & > * {
    margin-right: var(--ck-spacing-gap-compact);
    margin-top: var(--ck-spacing-gap-compact);
    margin-bottom: var(--ck-spacing-gap-compact);
  }

  & .ck-balloon-rotator__counter {
    margin-right: var(--ck-spacing-control-padding-inline);
    margin-left: var(--ck-spacing-gap-compact);
  }

  justify-content: center;
}

.ck .ck-balloon-rotator__content {
  & .ck.ck-annotation-wrapper {
    box-shadow: none;
  }

  & > .ck {
    border: none;
  }
}

.ck .ck-balloon-rotator__content .ck-toolbar {
  justify-content: center;
}

.ck .ck-fake-panel div {
  box-shadow: var(--ck-shadow-surface-floating), 0 0;
  background: var(--ck-color-panel-background, var(--ck-balloon-panel-background-color));
  border: var(--ck-balloon-panel-border);
  border-radius: var(--ck-border-radius-surface);
  width: 100%;
  height: 100%;
  min-height: 15px;
  position: absolute;
}

.ck .ck-fake-panel div:first-child {
  margin-left: var(--ck-balloon-fake-panel-offset-horizontal, 6px);
  margin-top: var(--ck-balloon-fake-panel-offset-vertical, 6px);
  z-index: 2;
}

.ck .ck-fake-panel div:nth-child(2) {
  margin-left: calc(2 * var(--ck-balloon-fake-panel-offset-horizontal, 6px));
  margin-top: calc(2 * var(--ck-balloon-fake-panel-offset-vertical, 6px));
  z-index: 1;
}

.ck .ck-fake-panel div:nth-child(3) {
  margin-left: calc(3 * var(--ck-balloon-fake-panel-offset-horizontal, 6px));
  margin-top: calc(3 * var(--ck-balloon-fake-panel-offset-vertical, 6px));
}

.ck .ck-fake-panel {
  z-index: var(--ck-layer-panel-below);
  position: absolute;
}

.ck .ck-balloon-panel_arrow_s + .ck-fake-panel div, .ck .ck-balloon-panel_arrow_se + .ck-fake-panel div, .ck .ck-balloon-panel_arrow_sw + .ck-fake-panel div {
  &:first-child {
    margin-top: calc(-1 * var(--ck-balloon-fake-panel-offset-vertical, 6px));
  }

  &:nth-child(2) {
    margin-top: calc(-2 * var(--ck-balloon-fake-panel-offset-vertical, 6px));
  }

  &:nth-child(3) {
    margin-top: calc(-3 * var(--ck-balloon-fake-panel-offset-vertical, 6px));
  }
}

:root, :host {
  --ck-sticky-panel-uniform-border-radius: initial;
}

.ck.ck-sticky-panel {
  & .ck-sticky-panel__content_sticky {
    box-shadow: var(--ck-shadow-surface-floating), 0 0;
    border-width: 0 var(--ck-border-width-surface) var(--ck-border-width-surface);
    border-radius: var(--ck-sticky-panel-uniform-border-radius, var(--ck-border-radius-surface-attached-top));
    z-index: var(--ck-layer-panel);
    position: fixed;
    top: 0;
  }

  & .ck-sticky-panel__content_sticky_bottom-limit {
    position: absolute;
    top: auto;
  }
}

:root, :host {
  --ck-autocomplete-results-max-height: 200px;
  --ck-autocomplete-results-uniform-border-radius: var(--ck-border-radius-uniform);
  --ck-autocomplete-results-border-radius: var(--ck-border-radius-surface-attached);
  --ck-autocomplete-results-border: var(--ck-border-width-surface) solid var(--ck-color-dropdown-panel-border, var(--ck-dropdown-panel-border-color));
  --ck-autocomplete-results-background-color: var(--ck-color-surface-container);
}

.ck.ck-autocomplete {
  & > .ck-search__results {
    border-radius: var(--ck-autocomplete-results-border-radius);
    box-shadow: var(--ck-shadow-surface-floating), 0 0;
    max-height: var(--ck-autocomplete-results-max-height);
    background: var(--ck-autocomplete-results-background-color);
    border: var(--ck-autocomplete-results-border);
    min-width: auto;
    position: absolute;
    overflow-y: auto;

    &.ck-search__results_n {
      border-radius: var(--ck-autocomplete-results-uniform-border-radius, var(--ck-border-radius-surface-attached-bottom));
      margin-bottom: calc(-1 * var(--ck-border-width-surface));
      bottom: 100%;
    }

    &.ck-search__results_s {
      border-radius: var(--ck-autocomplete-results-uniform-border-radius, var(--ck-border-radius-surface-attached-top));
      margin-top: calc(-1 * var(--ck-border-width-surface));
      top: 100%;
      bottom: auto;
    }

    z-index: var(--ck-z-panel, var(--ck-z-overlay));
  }

  position: relative;
}

:root, :host {
  --ck-search-results-info-padding: var(--ck-spacing-gap) var(--ck-spacing-padding-comfortable);
  --ck-search-results-info-primary-font-size: var(--ck-font-size-md);
  --ck-search-results-info-secondary-font-size: var(--ck-font-size-small, var(--ck-font-size-sm));
}

.ck.ck-search {
  & > .ck-labeled-field-view {
    & .ck-input {
      width: 100%;
    }

    & > .ck-labeled-field-view__input-wrapper > .ck-icon {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);

      [dir="ltr"] & {
        left: var(--ck-spacing-control-icon-gap);
      }

      [dir="rtl"] & {
        right: var(--ck-spacing-control-icon-gap);
      }
    }

    & .ck-search__reset {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
    }

    &.ck-search__query_with-icon {
      --ck-labeled-field-label-default-position-x: var(--ck-search-field-view-horizontal-spacing, calc(var(--ck-icon-size) + var(--ck-spacing-medium, var(--ck-spacing-base))));

      & .ck-icon {
        font-size: var(--ck-input-font-size);
      }

      & > .ck-labeled-field-view__input-wrapper > .ck-icon {
        opacity: .5;
        pointer-events: none;
      }

      & .ck-input {
        width: 100%;

        [dir="ltr"] & {
          padding-left: var(--ck-search-field-view-horizontal-spacing, calc(var(--ck-icon-size) + var(--ck-spacing-medium, var(--ck-spacing-base))));
        }

        [dir="rtl"] & {
          &:not(.ck-input-text_empty) {
            padding-left: var(--ck-search-field-view-horizontal-spacing, calc(var(--ck-icon-size) + var(--ck-spacing-medium, var(--ck-spacing-base))));
          }
        }
      }
    }

    &.ck-search__query_with-reset {
      --ck-labeled-field-empty-unfocused-max-width: 100% - 2 * var(--ck-search-field-view-horizontal-spacing, calc(var(--ck-icon-size) + var(--ck-spacing-medium, var(--ck-spacing-base))));

      &.ck-labeled-field-view_empty {
        --ck-labeled-field-empty-unfocused-max-width: 100% - var(--ck-search-field-view-horizontal-spacing, calc(var(--ck-icon-size) + var(--ck-spacing-medium, var(--ck-spacing-base)))) - var(--ck-spacing-control-icon-gap);
      }

      & .ck-search__reset {
        opacity: .5;
        background: none;
        min-width: auto;
        min-height: auto;
        padding: 0;

        [dir="ltr"] & {
          right: var(--ck-spacing-control-icon-gap);
        }

        [dir="rtl"] & {
          left: var(--ck-spacing-control-icon-gap);
        }

        &:hover {
          opacity: 1;
        }
      }

      & .ck-input {
        width: 100%;

        [dir="ltr"] & {
          &:not(.ck-input-text_empty) {
            padding-right: var(--ck-search-field-view-horizontal-spacing, calc(var(--ck-icon-size) + var(--ck-spacing-medium, var(--ck-spacing-base))));
          }
        }

        [dir="rtl"] & {
          padding-right: var(--ck-search-field-view-horizontal-spacing, calc(var(--ck-icon-size) + var(--ck-spacing-medium, var(--ck-spacing-base))));
        }
      }
    }
  }

  & > .ck-search__results {
    min-width: 100%;

    & > .ck-search__info {
      width: 100%;
      padding: var(--ck-search-results-info-padding);

      & * {
        white-space: normal;
      }

      & > span:first-child {
        font-weight: var(--ck-font-weight-ui-heading);
        font-size: var(--ck-search-results-info-primary-font-size);
        display: block;
      }

      & > span:last-child {
        margin-top: var(--ck-spacing-gap);
        font-size: var(--ck-search-results-info-secondary-font-size);
      }

      &:not(.ck-hidden) ~ * {
        display: none;
      }
    }
  }
}

.ck.ck-highlighted-text mark {
  background: var(--ck-color-highlight-background);
  vertical-align: initial;
  font-weight: var(--ck-font-weight-ui-inherit);
  line-height: inherit;
  font-size: inherit;
}

:root, :host {
  --ck-tooltip-max-width: 200px;
  --ck-tooltip-padding: 0 var(--ck-spacing-padding-snug) var(--ck-spacing-padding-tight) var(--ck-spacing-padding-snug);
  --ck-tooltip-multiline-padding: 0 var(--ck-spacing-padding-compact);
  --ck-tooltip-border: 0px solid transparent;
  --ck-tooltip-border-radius: var(--ck-radius-md);
  --ck-tooltip-background-color: var(--ck-color-surface-inverse);
  --ck-tooltip-text-color: var(--ck-color-text-inverse);
  --ck-tooltip-text-font-size: var(--ck-font-size-tiny, var(--ck-font-size-xs));
  --ck-tooltip-arrow-half-width: 4px;
  --ck-tooltip-arrow-height: 4px;
  --ck-tooltip-arrow-offset: 1px;
}

.ck.ck-balloon-panel.ck-tooltip {
  --ck-balloon-panel-border: var(--ck-tooltip-border);
  --ck-balloon-panel-background-color: var(--ck-color-tooltip-background, var(--ck-tooltip-background-color));
  --ck-balloon-arrow-half-width: var(--ck-tooltip-arrow-half-width);
  --ck-balloon-arrow-height: var(--ck-tooltip-arrow-height);
  --ck-balloon-arrow-offset: var(--ck-tooltip-arrow-offset);
  padding: var(--ck-tooltip-padding);
  border-radius: var(--ck-tooltip-border-radius);
  z-index: var(--ck-layer-tooltip);
  box-shadow: none;
  -webkit-user-select: none;
  user-select: none;
  min-height: initial;
  line-height: 1;

  & .ck-tooltip__text {
    font-size: var(--ck-tooltip-text-font-size);
    color: var(--ck-color-tooltip-text, var(--ck-tooltip-text-color));
    line-height: 1.5;
  }

  &.ck-tooltip_multi-line .ck-tooltip__text {
    white-space: break-spaces;
    padding: var(--ck-tooltip-multiline-padding);
    max-width: var(--ck-tooltip-max-width);
    display: inline-block;
  }

  &:before {
    display: none;
  }
}

:root, :host {
  --ck-toolbar-spinner-size: 18px;
}

.ck.ck-spinner-container {
  width: var(--ck-toolbar-spinner-size);
  height: var(--ck-toolbar-spinner-size);
  animation: var(--ck-animation-duration-progress) var(--ck-animation-repeat-infinite) ck-spinner-rotate var(--ck-animation-timing-function-progress);
  display: block;

  @media (prefers-reduced-motion: reduce) {
    animation-duration: 3s;
  }

  position: relative;
}

.ck.ck-spinner {
  width: var(--ck-toolbar-spinner-size);
  height: var(--ck-toolbar-spinner-size);
  border-radius: var(--ck-radius-full);
  border: var(--ck-border-width-emphasis) solid var(--ck-color-text);
  z-index: 1;
  border-top-color: #0000;
  margin: 0 auto;
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  transform: translateY(-50%);
}

@keyframes ck-spinner-rotate {
  to {
    transform: rotate(360deg);
  }
}

:root, :host {
  --ck-toolbar-item-gap-inline: var(--ck-spacing-gap-compact);
  --ck-toolbar-padding: 0 var(--ck-spacing-padding-compact);
  --ck-toolbar-border-radius: var(--ck-border-radius-surface);
  --ck-toolbar-vertical-button-border-radius: var(--ck-border-radius-control);
  --ck-toolbar-background-color: var(--ck-color-surface-container);
  --ck-toolbar-border-color: var(--ck-color-border-container);
  --ck-toolbar-border: var(--ck-border-width-surface) solid var(--ck-color-toolbar-border, var(--ck-toolbar-border-color));
}

.ck.ck-toolbar {
  border-radius: var(--ck-toolbar-border-radius);
  background: var(--ck-color-toolbar-background, var(--ck-toolbar-background-color));
  padding: var(--ck-toolbar-padding);
  border: var(--ck-toolbar-border);
  -webkit-user-select: none;
  user-select: none;
  flex-flow: row;
  align-items: center;
  display: flex;

  & .ck-button__label {
    font-size: var(--ck-toolbar-text-font-size);
    line-height: calc(var(--ck-line-height-base) * var(--ck-button-font-size));
  }

  & .ck-button_small .ck-button__label {
    line-height: calc(var(--ck-line-height-base) * var(--ck-button-small-font-size));
  }

  & .ck.ck-toolbar__separator {
    height: var(--ck-icon-size);
    background: var(--ck-color-divider);
    width: 1px;
    min-width: 1px;
    margin-top: var(--ck-spacing-gap-compact);
    margin-bottom: var(--ck-spacing-gap-compact);
    display: inline-block;

    &:first-child, &:last-child {
      display: none;
    }
  }

  & .ck-toolbar__line-break {
    flex-basis: 100%;
    height: 0;
  }

  & > .ck-toolbar__items {
    & > :not(.ck-toolbar__line-break) {
      margin-right: var(--ck-toolbar-item-gap-inline);
    }

    &:empty + .ck.ck-toolbar__separator {
      display: none;
    }

    flex-flow: wrap;
    flex-grow: 1;
    align-items: center;
    display: flex;
  }

  & > .ck-toolbar__items > :not(.ck-toolbar__line-break), & > .ck.ck-toolbar__grouped-dropdown {
    margin-top: var(--ck-spacing-gap-compact);
    margin-bottom: var(--ck-spacing-gap-compact);
  }

  &.ck-toolbar_vertical {
    padding: 0;

    & > .ck-toolbar__items > .ck {
      border-radius: var(--ck-toolbar-vertical-button-border-radius);
      width: 100%;
      margin: 0;
    }
  }

  &.ck-toolbar_compact {
    border-radius: var(--ck-border-radius-control);
    padding: 0;

    & > .ck-toolbar__items > * {
      margin: 0;

      &:not(:first-child):not(:last-child) {
        border-radius: 0;
      }
    }
  }

  & > .ck.ck-toolbar__grouped-dropdown {
    & > .ck.ck-button.ck-dropdown__button {
      padding-inline: var(--ck-spacing-control-padding-inline-compact);
    }

    & > .ck-dropdown__button .ck-dropdown__arrow {
      display: none;
    }
  }

  & .ck-toolbar__nested-toolbar-dropdown {
    & > .ck-dropdown__panel {
      min-width: auto;
    }

    & > .ck-button > .ck-button__label {
      width: auto;
      max-width: 7em;
    }
  }

  &:focus {
    outline: none;
  }

  .ck-toolbar-container & {
    border: 0;
  }

  &.ck-toolbar_grouping > .ck-toolbar__items {
    flex-wrap: nowrap;
  }

  &.ck-toolbar_vertical > .ck-toolbar__items {
    flex-direction: column;
  }

  &.ck-toolbar_floating > .ck-toolbar__items {
    flex-wrap: nowrap;
  }

  & .ck.ck-list__item > .ck.ck-button .ck-button__label {
    line-height: calc(var(--ck-line-height-base) * var(--ck-button-font-size));
  }
}

[dir="rtl"] .ck.ck-toolbar, .ck.ck-toolbar[dir="rtl"] {
  & > .ck-toolbar__items > .ck {
    margin-right: 0;
  }

  &:not(.ck-toolbar_compact) > .ck-toolbar__items > .ck {
    margin-left: var(--ck-toolbar-item-gap-inline);
  }

  & > .ck-toolbar__items > .ck:last-child {
    margin-left: 0;
  }

  &.ck-toolbar_compact > .ck-toolbar__items > .ck {
    &:first-child {
      border-radius: 0 var(--ck-border-radius-control) var(--ck-border-radius-control) 0;
    }

    &:last-child {
      border-radius: var(--ck-border-radius-control) 0 0 var(--ck-border-radius-control);
    }

    &:first-child:last-child {
      border-radius: var(--ck-border-radius-control);
    }
  }

  & > .ck.ck-toolbar__separator, &.ck-toolbar_grouping > .ck-toolbar__items:not(:empty):not(:only-child) {
    margin-left: var(--ck-spacing-gap-compact);
  }
}

[dir="ltr"] .ck.ck-toolbar, .ck.ck-toolbar[dir="ltr"] {
  & > .ck-toolbar__items > .ck:last-child {
    margin-right: 0;
  }

  &.ck-toolbar_compact > .ck-toolbar__items > .ck {
    &:first-child {
      border-radius: var(--ck-border-radius-control) 0 0 var(--ck-border-radius-control);
    }

    &:last-child {
      border-radius: 0 var(--ck-border-radius-control) var(--ck-border-radius-control) 0;
    }

    &:first-child:last-child {
      border-radius: var(--ck-border-radius-control);
    }
  }

  & > .ck.ck-toolbar__separator {
    margin-right: var(--ck-toolbar-item-gap-inline);
  }

  &.ck-toolbar_grouping > .ck-toolbar__items:not(:empty):not(:only-child) {
    margin-right: var(--ck-spacing-gap-compact);
  }
}

.ck-toolbar-context {
  & .ck.ck-button .ck-button__label {
    font-size: var(--ck-toolbar-text-font-size);
  }

  & .ck.ck-list__item > .ck.ck-button .ck-button__label {
    line-height: calc(var(--ck-line-height-base) * var(--ck-button-font-size));
  }
}

:root, :host {
  --ck-block-toolbar-button-size: var(--ck-font-size-normal, var(--ck-font-size-base));
}

.ck.ck-block-toolbar-button {
  color: var(--ck-color-block-toolbar-button, var(--ck-color-text));
  font-size: var(--ck-block-toolbar-size, var(--ck-block-toolbar-button-size));
  z-index: var(--ck-z-default, var(--ck-z-base));
  position: absolute;
}

:root, :host {
  --ck-menu-bar-padding: var(--ck-spacing-padding-compact);
  --ck-menu-bar-gap: var(--ck-spacing-gap-compact);
}

.ck.ck-menu-bar {
  background: var(--ck-color-surface-canvas);
  padding: var(--ck-menu-bar-padding);
  justify-content: flex-start;
  gap: var(--ck-menu-bar-gap);
  border: var(--ck-toolbar-border);
  flex-wrap: wrap;
  width: 100%;
  display: flex;

  & .ck-button__label {
    font-size: var(--ck-menubar-text-font-size);
  }
}

:root, :host {
  --ck-menu-bar-button-border-radius: var(--ck-border-radius-control);
}

.ck.ck-menu-bar__menu {
  & > .ck-menu-bar__menu__button {
    width: 100%;

    & > .ck-button__label {
      text-overflow: ellipsis;
      flex-grow: 1;
      overflow: hidden;
    }

    &.ck-disabled > .ck-button__label {
      opacity: var(--ck-disabled-opacity, var(--ck-opacity-disabled));
    }

    [dir="ltr"] & {
      &:not(.ck-button_with-text) {
        padding-left: var(--ck-spacing-control-padding-inline-compact);
      }
    }

    [dir="rtl"] & {
      &:not(.ck-button_with-text) {
        padding-right: var(--ck-spacing-control-padding-inline-compact);
      }
    }
  }

  &.ck-menu-bar__menu_top-level > .ck-menu-bar__menu__button {
    padding: var(--ck-spacing-control-padding-block) var(--ck-spacing-control-icon-gap);
    min-height: unset;
    border-radius: var(--ck-menu-bar-panel-uniform-border-radius, var(--ck-border-radius-surface-attached-bottom));

    & .ck-button__label {
      width: unset;
      line-height: unset;
      overflow: visible;
    }

    & .ck-icon {
      display: none;
    }
  }

  & > .ck-menu-bar__menu__button > .ck-menu-bar__menu__button__arrow {
    pointer-events: none;
    z-index: var(--ck-z-default, var(--ck-z-base));
  }

  &:not(.ck-menu-bar__menu_top-level) .ck-menu-bar__menu__button {
    border-radius: var(--ck-menu-bar-button-border-radius);

    & > .ck-menu-bar__menu__button__arrow {
      width: var(--ck-dropdown-arrow-size);

      [dir="ltr"] & {
        margin-left: var(--ck-spacing-control-padding-inline);
        margin-right: calc(-1 * var(--ck-spacing-control-padding-inline-compact));
        transform: rotate(-90deg);
      }

      [dir="rtl"] & {
        left: var(--ck-spacing-control-padding-inline);
        margin-right: var(--ck-spacing-control-padding-inline-compact);
        margin-left: calc(-1 * var(--ck-spacing-control-padding-inline-compact));
        transform: rotate(90deg);
      }
    }

    &.ck-disabled > .ck-menu-bar__menu__button__arrow {
      opacity: var(--ck-disabled-opacity, var(--ck-opacity-disabled));
    }
  }
}

:root, :host {
  --ck-menu-bar-panel-uniform-border-radius: var(--ck-radius-md);
  --ck-menu-bar-panel-border-radius: var(--ck-radius-md);
  --ck-menu-bar-item-focus-border-color: var(--ck-interactive-focus-border-color);
}

.ck.ck-menu-bar__menu > .ck.ck-menu-bar__menu__panel {
  border-radius: var(--ck-menu-bar-panel-border-radius);
  box-shadow: var(--ck-shadow-surface-floating), 0 0;
  background: var(--ck-color-dropdown-panel-background, var(--ck-dropdown-panel-background-color));
  border: var(--ck-dropdown-panel-border);
  height: fit-content;
  z-index: var(--ck-z-panel, var(--ck-z-overlay));
  max-width: var(--ck-menu-bar-menu-max-width, 75vw);
  position: absolute;
  bottom: 0;

  &.ck-menu-bar__menu__panel_fit-content {
    max-width: var(--ck-menu-bar-menu-max-width, none);
  }

  &.ck-menu-bar__menu__panel_position_es, &.ck-menu-bar__menu__panel_position_se {
    border-radius: var(--ck-menu-bar-panel-uniform-border-radius, var(--ck-border-radius-surface-cut-top-left));
  }

  &.ck-menu-bar__menu__panel_position_ws, &.ck-menu-bar__menu__panel_position_sw {
    border-radius: var(--ck-menu-bar-panel-uniform-border-radius, var(--ck-border-radius-surface-cut-top-right));
  }

  &.ck-menu-bar__menu__panel_position_en, &.ck-menu-bar__menu__panel_position_ne {
    border-radius: var(--ck-menu-bar-panel-uniform-border-radius, var(--ck-border-radius-surface-cut-bottom-left));
  }

  &.ck-menu-bar__menu__panel_position_wn, &.ck-menu-bar__menu__panel_position_nw {
    border-radius: var(--ck-menu-bar-panel-uniform-border-radius, var(--ck-border-radius-surface-cut-bottom-right));
  }

  &:focus {
    outline: none;
  }

  &.ck-menu-bar__menu__panel_position_ne, &.ck-menu-bar__menu__panel_position_nw {
    bottom: 100%;
  }

  &.ck-menu-bar__menu__panel_position_se, &.ck-menu-bar__menu__panel_position_sw {
    top: 100%;
    bottom: auto;
  }

  &.ck-menu-bar__menu__panel_position_ne, &.ck-menu-bar__menu__panel_position_se {
    left: 0;
  }

  &.ck-menu-bar__menu__panel_position_nw, &.ck-menu-bar__menu__panel_position_sw {
    right: 0;
  }

  &.ck-menu-bar__menu__panel_position_es, &.ck-menu-bar__menu__panel_position_en {
    left: calc(100% - var(--ck-menu-bar-nested-menu-horizontal-offset, 5px));
  }

  &.ck-menu-bar__menu__panel_position_es {
    top: 0;
  }

  &.ck-menu-bar__menu__panel_position_en {
    bottom: 0;
  }

  &.ck-menu-bar__menu__panel_position_ws, &.ck-menu-bar__menu__panel_position_wn {
    right: calc(100% - var(--ck-menu-bar-nested-menu-horizontal-offset, 5px));
  }

  &.ck-menu-bar__menu__panel_position_ws {
    top: 0;
  }

  &.ck-menu-bar__menu__panel_position_wn {
    bottom: 0;
  }
}

.ck.ck-menu-bar {
  & .ck-list-item-button {
    &:focus, &:active {
      box-shadow: none;
      border-color: #0000;
    }
  }

  &.ck-menu-bar_focus-border-enabled .ck-list-item-button {
    &:focus, &:active {
      z-index: var(--ck-layer-control-raised);
      border-color: var(--ck-menu-bar-item-focus-border-color);
      box-shadow: var(--ck-focus-outer-shadow, var(--ck-interactive-focus-shadow)), 0 0;
      outline: none;
      position: relative;
    }
  }
}

.ck.ck-menu-bar__menu {
  font-size: inherit;
  display: block;

  &.ck-menu-bar__menu_top-level {
    max-width: 100%;
  }

  position: relative;
}

:root, :host {
  --ck-menu-bar-menu-item-min-width: 18em;
}

.ck.ck-menu-bar__menu .ck.ck-menu-bar__menu__item {
  min-width: var(--ck-menu-bar-menu-item-min-width);
}

:root, :host {
  --ck-menu-bar-list-item-button-border-radius: var(--ck-border-radius-control);
}

.ck.ck-menu-bar__menu {
  & .ck-button.ck-menu-bar__menu__item__button {
    border-radius: var(--ck-menu-bar-list-item-button-border-radius);

    & > .ck-spinner-container, & > .ck-spinner-container .ck-spinner {
      --ck-toolbar-spinner-size: 20px;
    }

    & > .ck-spinner-container {
      font-size: .833335em;

      [dir="ltr"] & {
        margin-right: var(--ck-spacing-control-icon-gap);
      }

      [dir="rtl"] & {
        margin-left: var(--ck-spacing-control-icon-gap);
      }
    }
  }
}

:root, :host {
  --ck-tab-button-size: 36px;
  --ck-tab-button-margin-bar: var(--ck-spacing-gap);
  --ck-tab-button-margin-gap: var(--ck-spacing-gap-compact);
  --ck-tab-button-margin-block: var(--ck-tab-button-margin-gap);
  --ck-tab-button-margin-inline: var(--ck-tab-button-margin-bar);
  --ck-tab-button-icon-size: 20px;
  --ck-tab-button-border-radius: var(--ck-border-radius, var(--ck-radius-base));
  --ck-tab-button-border-width: var(--ck-border-width-control);
  --ck-tab-button-with-text-padding-inline: var(--ck-spacing-padding-compact);
  --ck-tab-button-background: transparent;
  --ck-tab-button-active-background: var(--ck-color-interactive-primary-surface-muted);
  --ck-tab-button-icon-color: var(--ck-color-base-text-light);
  --ck-tab-button-active-icon-color: var(--ck-color-base-action);
  --ck-tab-button-focus-background: var(--ck-color-base-background);
  --ck-tab-button-focus-hover-background: var(--ck-color-interactive-hover-surface-strong);
  --ck-tab-button-indicator-width: 3px;
  --ck-tab-button-indicator-radius: var(--ck-border-radius-control-small);
  --ck-tab-button-indicator-hover-height: 16px;
  --ck-tab-button-indicator-active-height: 28px;
  --ck-tab-button-indicator-hover-color: #c5cef2;
  --ck-tab-button-indicator-active-color: var(--ck-tab-button-active-icon-color);
  --ck-tab-button-size-small: 28px;
  --ck-tab-button-margin-bar-small: 5px;
  --ck-tab-button-margin-gap-small: var(--ck-spacing-gap-tight);
  --ck-tab-button-indicator-width-small: 2px;
  --ck-tab-button-indicator-hover-height-small: 14px;
  --ck-tab-button-indicator-active-height-small: 24px;
}

.ck.ck-button.ck-tab-button {
  --ck-tab-button-indicator-length: 0;
  --ck-tab-button-indicator-color: transparent;
  box-sizing: border-box;
  width: var(--ck-tab-button-size);
  height: var(--ck-tab-button-size);
  min-width: 0;
  min-height: 0;
  margin: var(--ck-tab-button-margin-block) var(--ck-tab-button-margin-inline);
  border: var(--ck-tab-button-border-width) solid transparent;
  border-radius: var(--ck-tab-button-border-radius);
  cursor: pointer;
  background: var(--ck-tab-button-background);
  justify-content: center;
  padding: 0;
  transition: background-color .2s, border-color .2s;
  position: relative;

  @media (prefers-reduced-motion: reduce) {
    transition: var(--ck-transition-none);
  }

  & .ck.ck-icon {
    --ck-icon-size: var(--ck-tab-button-icon-size);
    color: var(--ck-tab-button-icon-color);
  }

  &:before {
    content: "";
    background: var(--ck-tab-button-indicator-color);
    pointer-events: none;
    transition: width .2s, height .2s, background-color .2s;
    position: absolute;

    @media (prefers-reduced-motion: reduce) {
      transition: var(--ck-transition-none);
    }
  }

  &:not(.ck-disabled):focus {
    border-color: var(--ck-tab-button-active-icon-color);
  }

  &:not(.ck-disabled):hover {
    background: var(--ck-tab-button-active-background);
  }

  &:not(.ck-disabled):focus {
    background: var(--ck-tab-button-focus-background);
  }

  &:not(.ck-disabled):hover:focus {
    background: var(--ck-tab-button-focus-hover-background);
  }

  &:not(.ck-disabled):not(.ck-on):hover {
    --ck-tab-button-indicator-length: var(--ck-tab-button-indicator-hover-height);
    --ck-tab-button-indicator-color: var(--ck-tab-button-indicator-hover-color);
  }

  &.ck-on {
    background: var(--ck-tab-button-active-background);
    color: var(--ck-tab-button-active-icon-color);
    --ck-tab-button-indicator-length: var(--ck-tab-button-indicator-active-height);
    --ck-tab-button-indicator-color: var(--ck-tab-button-indicator-active-color);

    & .ck.ck-icon {
      color: var(--ck-tab-button-active-icon-color);
    }
  }

  &.ck-tab-button_small {
    --ck-tab-button-size: var(--ck-tab-button-size-small);
    --ck-tab-button-margin-bar: var(--ck-tab-button-margin-bar-small);
    --ck-tab-button-margin-gap: var(--ck-tab-button-margin-gap-small);
    --ck-tab-button-indicator-width: var(--ck-tab-button-indicator-width-small);
    --ck-tab-button-indicator-hover-height: var(--ck-tab-button-indicator-hover-height-small);
    --ck-tab-button-indicator-active-height: var(--ck-tab-button-indicator-active-height-small);
  }

  &.ck-tab-button_top {
    --ck-tab-button-margin-block: var(--ck-tab-button-margin-bar);
    --ck-tab-button-margin-inline: var(--ck-tab-button-margin-gap);
  }

  &.ck-button_with-text {
    width: auto;
    min-width: var(--ck-tab-button-size);
    padding-inline: var(--ck-tab-button-with-text-padding-inline);
  }

  &.ck-tab-button_left:before, &.ck-tab-button_right:before {
    width: var(--ck-tab-button-indicator-width);
    height: var(--ck-tab-button-indicator-length);
    inset-block-start: 50%;
    transform: translateY(-50%);
  }

  &.ck-tab-button_left:before {
    border-start-start-radius: var(--ck-tab-button-indicator-radius);
    border-end-start-radius: var(--ck-tab-button-indicator-radius);
    inset-inline-end: calc(-1 * (var(--ck-tab-button-margin-inline) + var(--ck-tab-button-border-width)));
  }

  &.ck-tab-button_right:before {
    border-start-end-radius: var(--ck-tab-button-indicator-radius);
    border-end-end-radius: var(--ck-tab-button-indicator-radius);
    inset-inline-start: calc(-1 * (var(--ck-tab-button-margin-inline) + var(--ck-tab-button-border-width)));
  }

  &.ck-tab-button_top:before {
    width: var(--ck-tab-button-indicator-length);
    height: var(--ck-tab-button-indicator-width);
    border-start-start-radius: var(--ck-tab-button-indicator-radius);
    border-start-end-radius: var(--ck-tab-button-indicator-radius);
    margin-inline: auto;
    inset-block-end: calc(-1 * (var(--ck-tab-button-margin-block) + var(--ck-tab-button-border-width)));
    inset-inline: 0;
  }
}

.ck-tab-panel {
  flex-direction: column;
  height: 100%;
  display: flex;

  & > * {
    flex-grow: 1;
  }

  &.ck-tab-panel_disabled {
    pointer-events: none;
    opacity: var(--ck-disabled-opacity, var(--ck-opacity-disabled));
  }
}

.ck.ck-editor__editable .ck-code_selected {
  background-color: #c7c7c780;
}

.ck-content code {
  background-color: #c7c7c74d;
  border-radius: 2px;
  padding: .15em;
}

.ck-content blockquote {
  border-left: 5px solid #dbe4f0;
  margin-left: 0;
  margin-right: 0;
  padding-left: 1.5em;
  padding-right: 1.5em;
  font-style: italic;
  overflow: hidden;
}

.ck-content[dir="rtl"] blockquote {
  border-left: 0;
  border-right: 5px solid #dbe4f0;
}

:root, :host {
  --ck-bookmark-icon-hover-fill-color: var(--ck-color-widget-hover-border);
  --ck-bookmark-icon-selected-fill-color: var(--ck-color-focus-border, var(--ck-color-interactive-focus-border));
  --ck-bookmark-icon-animation-duration: var(--ck-widget-handler-animation-duration);
  --ck-bookmark-icon-animation-curve: var(--ck-widget-handler-animation-curve);
}

.ck .ck-bookmark {
  &.ck-widget {
    outline: none;
    display: inline-block;

    & .ck-bookmark__icon .ck-icon__fill {
      transition: fill var(--ck-bookmark-icon-animation-duration) var(--ck-bookmark-icon-animation-curve);
    }

    &:hover {
      & .ck-bookmark__icon .ck-icon__fill {
        fill: var(--ck-bookmark-icon-hover-fill-color);
      }
    }

    &.ck-widget_selected {
      & .ck-bookmark__icon .ck-icon__fill {
        fill: var(--ck-bookmark-icon-selected-fill-color);
      }
    }

    &.ck-widget_selected, &.ck-widget_selected:hover {
      outline: none;
    }

    & .ck-bookmark__icon {
      display: block;
      position: relative;
      top: -.1em;

      & .ck-icon {
        vertical-align: middle;
        width: auto;
        height: 1.2em;
      }
    }
  }
}

.ck .ck-fake-bookmark-selection {
  background: var(--ck-color-link-fake-selection);
}

.ck .ck-fake-bookmark-selection_collapsed {
  border-right: 1px solid var(--ck-color-base-text);
  outline: var(--ck-outline-fake-caret);
  height: 100%;
  margin-right: -1px;
}

.ck.ck-bookmark-balloon {
  & .ck.ck-toolbar {
    & > .ck-toolbar__items {
      flex-wrap: nowrap;
    }
  }
}

.ck.ck-bookmark-toolbar__preview {
  padding: 0 var(--ck-spacing-medium, var(--ck-spacing-base));
  max-width: var(--ck-input-width);
  text-overflow: ellipsis;
  text-align: center;
  -webkit-user-select: none;
  user-select: none;
  cursor: default;
  min-width: 3em;
  font-weight: normal;
  overflow: hidden;
}

:root, :host {
  --ck-bookmark-form-width: var(--ck-width-balloon-form);
}

.ck.ck-bookmark-form {
  width: var(--ck-bookmark-form-width);
}

:root, :host {
  --ck-image-processing-highlight-color: #f9fafa;
  --ck-image-processing-background-color: #e3e5e8;
}

.ck.ck-editor__editable {
  & .image {
    &.image-processing {
      position: relative;

      &:before {
        content: "";
        z-index: 1;
        background: linear-gradient(90deg,
					var(--ck-image-processing-background-color),
					var(--ck-image-processing-highlight-color),
					var(--ck-image-processing-background-color));
        background-size: 200% 100%;
        width: 100%;
        height: 100%;
        animation: 2s linear infinite ck-image-processing-animation;
        position: absolute;
        top: 0;
        left: 0;
      }

      & img {
        height: 100%;
      }
    }
  }
}

@keyframes ck-image-processing-animation {
  0% {
    background-position: 200% 0;
  }

  100% {
    background-position: -200% 0;
  }
}

:root, :host {
  --ck-clipboard-drop-target-dot-width: 12px;
  --ck-clipboard-drop-target-dot-height: 8px;
  --ck-clipboard-drop-target-color: var(--ck-color-focus-border);
}

.ck.ck-editor__editable {
  & .ck.ck-clipboard-drop-target-position {
    & span {
      bottom: calc(-.5 * var(--ck-clipboard-drop-target-dot-height));
      top: calc(-.5 * var(--ck-clipboard-drop-target-dot-height));
      border: 1px solid var(--ck-clipboard-drop-target-color);
      background: var(--ck-clipboard-drop-target-color);
      margin-left: -1px;
      position: absolute;

      &:after {
        content: "";
        width: 0;
        height: 0;
        left: 50%;
        top: calc(-.5 * var(--ck-clipboard-drop-target-dot-height));
        border-color: var(--ck-clipboard-drop-target-color) transparent transparent transparent;
        border-width: calc(var(--ck-clipboard-drop-target-dot-height)) calc(.5 * var(--ck-clipboard-drop-target-dot-width)) 0 calc(.5 * var(--ck-clipboard-drop-target-dot-width));
        border-style: solid;
        display: block;
        position: absolute;
        transform: translateX(-50%);
      }

      width: 0;
    }

    pointer-events: none;
    display: inline;
    position: relative;
  }

  & .ck-widget.ck-clipboard-drop-target-range {
    outline: var(--ck-widget-outline-thickness) solid var(--ck-clipboard-drop-target-color) !important;
  }

  & .ck-widget:-webkit-drag {
    zoom: .6;
    outline: none !important;

    & > .ck-widget__selection-handle, & > .ck-widget__type-around {
      display: none;
    }
  }
}

.ck.ck-clipboard-drop-target-line {
  border: 1px solid var(--ck-clipboard-drop-target-color);
  background: var(--ck-clipboard-drop-target-color);
  height: 0;
  z-index: var(--ck-z-default, var(--ck-z-base));
  margin-top: -1px;
  position: absolute;

  &:before {
    content: "";
    top: calc(-.5 * var(--ck-clipboard-drop-target-dot-width));
    border-style: solid;
    width: 0;
    height: 0;
    position: absolute;
  }

  pointer-events: none;
}

[dir="ltr"] .ck.ck-clipboard-drop-target-line:before {
  border-width: calc(.5 * var(--ck-clipboard-drop-target-dot-width)) 0 calc(.5 * var(--ck-clipboard-drop-target-dot-width)) var(--ck-clipboard-drop-target-dot-height);
  border-color: transparent transparent transparent var(--ck-clipboard-drop-target-color);
  left: -1px;
}

[dir="rtl"] .ck.ck-clipboard-drop-target-line:before {
  border-width: calc(.5 * var(--ck-clipboard-drop-target-dot-width)) var(--ck-clipboard-drop-target-dot-height) calc(.5 * var(--ck-clipboard-drop-target-dot-width)) 0;
  border-color: transparent var(--ck-clipboard-drop-target-color) transparent transparent;
  right: -1px;
}

:root, :host {
  --ck-color-code-block-label-background: var(--ck-color-base-text-light);
}

.ck.ck-editor__editable pre[data-language]:after {
  content: attr(data-language);
  background: var(--ck-color-code-block-label-background);
  border-radius: var(--ck-widget-label-border-radius);
  font-size: 10px;
  font-family: var(--ck-font-face, var(--ck-font-family));
  padding: var(--ck-spacing-tiny, var(--ck-spacing-xs)) var(--ck-spacing-medium, var(--ck-spacing-base));
  color: #fff;
  white-space: nowrap;
  line-height: 16px;
  position: absolute;
  top: -1px;
  right: 10px;
}

.ck.ck-code-block-dropdown .ck-dropdown__panel {
  max-height: 250px;
  overflow: hidden auto;
}

.ck.ck-editor__editable pre {
  position: relative;
}

.ck-content pre {
  color: #353535;
  text-align: left;
  tab-size: 4;
  white-space: pre-wrap;
  direction: ltr;
  background: #f5f5f5;
  border: 1px solid #dce5f0;
  border-radius: 2px;
  min-width: 200px;
  margin: .9em 0;
  padding: 1em;
  font-style: normal;

  & code {
    background: unset;
    border-radius: 0;
    padding: 0;
  }
}

:root, :host {
  --ck-content-font-family: Helvetica, Arial, Tahoma, Verdana, Sans-Serif;
  --ck-content-font-size: medium;
  --ck-content-font-color: #000;
  --ck-content-line-height: 1.5;
  --ck-content-word-break: normal;
  --ck-content-overflow-wrap: break-word;
}

.ck-content {
  font-family: var(--ck-content-font-family);
  font-size: var(--ck-content-font-size);
  color: var(--ck-content-font-color);
  line-height: var(--ck-content-line-height);
  word-break: var(--ck-content-word-break);
  overflow-wrap: var(--ck-content-overflow-wrap);
}

.ck.ck-editor__main > .ck-editor__editable {
  background: var(--ck-color-base-background);

  &:not(.ck-focused) {
    border-color: var(--ck-color-base-border);
  }
}

.ck.ck-editor__main > .ck-editor__editable_root:not(.ck-editor__nested-editable) {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.ck.ck-editor {
  position: relative;

  & .ck-editor__top .ck-sticky-panel .ck-toolbar {
    z-index: var(--ck-z-panel, var(--ck-z-overlay));
  }
}

.ck.ck-toolbar-container .ck-menu-bar {
  border: none;
  border-bottom: 1px solid var(--ck-color-toolbar-border, var(--ck-toolbar-border-color));
}

.ck.ck-emoji {
  width: 320px;
}

.ck .ck.ck-emoji__search {
  padding: var(--ck-spacing-large, var(--ck-spacing-lg));
  padding-bottom: var(--ck-spacing-medium, var(--ck-spacing-base));
  justify-content: space-between;
  align-items: center;
  display: flex;

  & > .ck.ck-search {
    flex: 1;
  }
}

.ck .ck-fake-emoji-selection {
  background: var(--ck-color-link-fake-selection);
}

.ck .ck-fake-emoji-selection_collapsed {
  border-right: 1px solid var(--ck-color-base-text);
  outline: var(--ck-outline-fake-caret);
  height: 100%;
  margin-right: -1px;
}

div.ck.ck-balloon-panel.ck-emoji-picker-balloon {
  z-index: calc(var(--ck-z-dialog, var(--ck-z-modal)) + 1);
}

:root, :host {
  --ck-emoji-categories-list-margin: 0 var(--ck-spacing-padding-comfortable);
}

.ck.ck-emoji__categories-list {
  margin: var(--ck-emoji-categories-list-margin);
  justify-content: space-between;
  display: flex;

  & > .ck.ck-button.ck-tab-button {
    width: var(--ck-tab-button-size);
    font-size: var(--ck-tab-button-icon-size);
    padding-inline: 0;
  }
}

:root, :host {
  --ck-emoji-grid-tile-size: 27px;
  --ck-emoji-grid-margin: var(--ck-spacing-padding) var(--ck-spacing-padding-comfortable);
  --ck-emoji-grid-gap: var(--ck-spacing-gap-compact) var(--ck-spacing-gap-compact);
}

.ck.ck-emoji {
  & .ck.ck-emoji__tiles {
    border-top: 1px solid var(--ck-color-base-border);
    max-width: 100%;
    max-height: min(265px, 40vh);
    overflow: hidden auto;

    & .ck-emoji__grid {
      grid-template-columns: repeat(auto-fill, minmax(var(--ck-emoji-grid-tile-size), 1fr));
      margin: var(--ck-emoji-grid-margin);
      grid-gap: var(--ck-emoji-grid-gap);
      display: grid;
    }

    & .ck-emoji__tile {
      width: var(--ck-emoji-grid-tile-size);
      height: var(--ck-emoji-grid-tile-size);
      min-width: var(--ck-emoji-grid-tile-size);
      min-height: var(--ck-emoji-grid-tile-size);
      border: 0;
      padding: 0;
      font-size: 1.5em;
      transition: box-shadow .2s;

      @media (prefers-reduced-motion: reduce) {
        transition: none;
      }

      &:focus:not(.ck-disabled), &:hover:not(.ck-disabled) {
        box-shadow: inset 0 0 0 1px var(--ck-color-base-background), 0 0 0 2px var(--ck-color-focus-border, var(--ck-color-interactive-focus-border));
        border: 0;
      }

      & .ck-button__label {
        line-height: var(--ck-emoji-grid-tile-size);
        text-align: center;
        width: 100%;
      }
    }
  }
}

.ck.ck-form.ck-emoji-picker-form {
  padding-bottom: 0;

  & .ck.ck-dropdown .ck-dropdown__button:not(:focus) {
    border-color: #0000;
  }
}

.ck.ck-emoji__skin-tone {
  margin-left: var(--ck-spacing-standard, var(--ck-spacing-base));

  & > .ck.ck-dropdown {
    & .ck.ck-list__item {
      min-width: 1em;
    }

    & .ck-button.ck-dropdown__button {
      & .ck-button__label {
        width: initial;
      }
    }
  }
}

.ck.ck-placeholder, .ck .ck-placeholder {
  position: relative;

  @media (forced-colors: active) {
    forced-color-adjust: preserve-parent-color;
  }

  &:before {
    content: attr(data-placeholder);
    cursor: text;
    pointer-events: none;
    padding-left: inherit;
    padding-right: inherit;
    box-sizing: border-box;
    white-space: nowrap;
    text-overflow: ellipsis;
    position: absolute;
    left: 0;
    right: 0;
    overflow: hidden;

    @media (forced-colors: none) {
      color: var(--ck-color-engine-placeholder-text);
    }

    @media (forced-colors: active) {
      margin-left: 1px;
      font-style: italic;
    }
  }
}

.ck.ck-read-only .ck-placeholder {
  &:before {
    display: none;
  }
}

.ck.ck-reset_all .ck-placeholder {
  position: relative;
}

.ck.ck-editor__editable span[data-ck-unsafe-element] {
  display: none;
}

:root, :host {
  --ck-color-find-result-selected: #ff9633;
}

.ck-find-result {
  background: var(--ck-color-highlight-background);
  color: var(--ck-color-text);
}

.ck-find-result_selected {
  background: var(--ck-color-find-result-selected);
}

:root, :host {
  --ck-find-and-replace-form-width: var(--ck-width-dialog);
  --ck-find-and-replace-form-replace-field-padding-top: var(--ck-spacing-padding-comfortable);
  --ck-find-and-replace-form-inputs-padding: var(--ck-spacing-padding-spacious) var(--ck-spacing-padding-comfortable) var(--ck-spacing-padding-compact) var(--ck-spacing-padding-comfortable);
  --ck-find-and-replace-form-actions-padding: 0 var(--ck-spacing-padding-comfortable) var(--ck-spacing-padding-comfortable) var(--ck-spacing-padding-comfortable);
}

.ck.ck-find-and-replace-form {
  width: var(--ck-find-and-replace-form-width);
  max-width: 100%;

  &:focus {
    outline: none;
  }

  & .ck-find-and-replace-form__inputs, & .ck-find-and-replace-form__actions {
    padding: var(--ck-dialog-actions-padding);
    flex-flow: wrap;
    flex: auto;
    align-content: stretch;
    align-items: center;
    margin: 0;
    display: flex;

    & > .ck-button {
      flex: none;
    }

    [dir="ltr"] & {
      & > * + * {
        margin-left: var(--ck-spacing-standard, var(--ck-spacing-base));
      }
    }

    [dir="rtl"] & {
      & > * + * {
        margin-right: var(--ck-spacing-standard, var(--ck-spacing-base));
      }
    }

    & .ck-labeled-field-view {
      flex: auto;

      & .ck-input {
        width: 100%;
        min-width: 50px;
      }
    }
  }

  & .ck-find-and-replace-form__inputs {
    padding: var(--ck-find-and-replace-form-inputs-padding);
    align-items: flex-start;

    & > .ck-button-prev > .ck-icon {
      transform: rotate(90deg);
    }

    & > .ck-button-next > .ck-icon {
      transform: rotate(-90deg);
    }

    & .ck-results-counter {
      color: var(--ck-color-base-border);
      position: absolute;
      top: 50%;
      transform: translateY(-50%);

      [dir="ltr"] & {
        right: var(--ck-spacing-standard, var(--ck-spacing-base));
      }

      [dir="rtl"] & {
        left: var(--ck-spacing-standard, var(--ck-spacing-base));
      }
    }

    & > .ck-labeled-field-replace {
      padding-top: var(--ck-find-and-replace-form-replace-field-padding-top);
      flex: 0 0 100%;

      [dir="ltr"] & {
        margin-left: 0;
      }

      [dir="rtl"] & {
        margin-right: 0;
      }
    }
  }

  & .ck-find-and-replace-form__actions {
    padding: var(--ck-find-and-replace-form-actions-padding);
    flex-wrap: wrap;
    justify-content: flex-end;
  }

  & .ck-switchbutton {
    flex-flow: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    display: flex;
  }
}

@media screen and (width <= 600px) {
  .ck.ck-find-and-replace-form {
    width: 300px;
    max-width: 100%;

    & .ck-find-and-replace-form__inputs > .ck-labeled-field-view:not(.ck-labeled-field-replace) {
      flex: 1 1 0;
      min-width: 0;
    }

    & .ck-find-and-replace-form__actions > .ck-button {
      flex: 1 1 0;
      justify-content: center;
      min-width: 0;
    }

    & .ck-find-and-replace-form__actions > .ck-button-find {
      margin-top: var(--ck-spacing-standard, var(--ck-spacing-base));
      flex: 0 0 100%;

      [dir="ltr"] & {
        margin-left: 0;
      }

      [dir="rtl"] & {
        margin-right: 0;
      }
    }

    &.ck-find-and-replace-form__input {
      flex-wrap: wrap;

      & .ck-labeled-field-view {
        width: 100%;
        margin-bottom: var(--ck-spacing-standard, var(--ck-spacing-base));
        flex: 1 0 auto;
      }

      & > .ck-button {
        text-align: center;

        &:first-of-type {
          flex: auto;

          [dir="ltr"] & {
            margin-left: 0;
          }

          [dir="rtl"] & {
            margin-right: 0;
          }

          & .ck-button__label {
            text-align: center;
            width: 100%;
          }
        }
      }
    }

    &.ck-find-and-replace-form__actions > :not(.ck-labeled-field-view) {
      flex-wrap: wrap;
      flex: auto;

      & > .ck-button {
        text-align: center;

        &:first-of-type {
          flex: auto;

          [dir="ltr"] & {
            margin-left: 0;
          }

          [dir="rtl"] & {
            margin-right: 0;
          }
        }

        & .ck-button__label {
          text-align: center;
          width: 100%;
        }
      }
    }
  }
}

:root, :host {
  --ck-content-font-size-tiny: .7em;
  --ck-content-font-size-small: .85em;
  --ck-content-font-size-big: 1.4em;
  --ck-content-font-size-huge: 1.8em;
}

.ck-content {
  & .text-tiny {
    font-size: var(--ck-content-font-size-tiny);
  }

  & .text-small {
    font-size: var(--ck-content-font-size-small);
  }

  & .text-big {
    font-size: var(--ck-content-font-size-big);
  }

  & .text-huge {
    font-size: var(--ck-content-font-size-huge);
  }
}

:root, :host {
  --ck-fullscreen-editor-top-margin: 28px;
  --ck-fullscreen-editor-bottom-margin: 28px;
  --ck-fullscreen-editable-shadow: none;
  --ck-fullscreen-left-sidebar-avatar-size: 32px;
  --ck-fullscreen-left-sidebar-toggle-button-hover-background: var(--ck-color-interactive-primary-surface-muted);
  --ck-fullscreen-editable-border-radius: var(--ck-radius-md);
}

html.ck-fullscreen, body.ck-fullscreen, :host(.ck-fullscreen) {
  --ck-z-fullscreen: 10000;
  --ck-z-default: calc(var(--ck-z-fullscreen) + 1);
  --ck-z-base: calc(var(--ck-z-fullscreen) + 1);
  --ck-z-panel: calc(var(--ck-z-default) + 999);
  --ck-z-overlay: calc(var(--ck-z-base) + 999);
  --ck-z-dialog: 100000;
  --ck-z-modal: 100000;

  & .ck-pagination-view-line {
    z-index: calc(var(--ck-z-fullscreen) + 1);
  }

  & .page-break__label {
    z-index: calc(var(--ck-z-fullscreen) + 2);
  }

  & .ck .ck-thread__header {
    & .ck-context {
      &.overlay {
        z-index: calc(var(--ck-z-fullscreen) + 2);
      }
    }
  }

  & .ck-source-editing-area textarea {
    border-radius: var(--ck-source-editing-area-border-radius);
  }
}

.ck.ck-fullscreen__main-wrapper {
  width: 100%;
  height: 100%;
  z-index: var(--ck-z-fullscreen);
  background: var(--ck-color-base-foreground);
  flex-direction: column;
  display: flex;
  position: fixed;
  top: 0;
  left: 0;

  & .ck.ck-revision-history-ui__changes-navigation {
    margin-top: 0;
    margin-bottom: 0;
  }
}

.ck.ck-fullscreen__main-wrapper.ck-fullscreen__main-wrapper_custom-container {
  position: absolute;

  & .ck-fullscreen__top-wrapper {
    border-top: 1px solid var(--ck-color-base-border);
    border-left: 1px solid var(--ck-color-base-border);
    border-right: 1px solid var(--ck-color-base-border);
    border-radius: var(--ck-border-radius, var(--ck-radius-base)) 0;
  }
}

.ck-fullscreen__menu-bar .ck.ck-menu-bar {
  border: none;
}

.ck.ck-fullscreen__toolbar > .ck-toolbar {
  border-left: 0;
  border-right: 0;
  border-radius: 0;
}

.ck-fullscreen__main-wrapper .ck-fullscreen__editable-wrapper {
  justify-content: flex-start;
  max-height: 100%;
  display: flex;
  overflow: auto;
}

.ck-fullscreen__main-wrapper .ck-fullscreen__editable {
  margin-top: var(--ck-fullscreen-editor-top-margin);
  height: 100%;
  margin-left: auto;

  &:after {
    content: "";
    height: var(--ck-fullscreen-editor-bottom-margin);
    display: block;
  }
}

.ck-fullscreen__main-wrapper .ck-fullscreen__editable .ck.ck-editor__editable:not(.ck-editor__nested-editable) {
  box-sizing: border-box;
  border: 1px var(--ck-color-base-border) solid;
  background: var(--ck-color-base-background);
  width: 795.701px;
  max-width: 795.701px;
  height: fit-content;
  min-height: 297mm;
  box-shadow: var(--ck-fullscreen-editable-shadow);
  border-radius: var(--ck-fullscreen-editable-border-radius);
  margin: 0;
  padding: 20mm 12mm;
}

.ck-fullscreen__main-wrapper .ck-fullscreen__editable .ck-source-editing-area {
  width: 795.701px;
}

.ck-fullscreen__sidebar {
  width: 270px;
  margin-top: var(--ck-fullscreen-editor-top-margin);
  margin-left: 10px;
}

.ck-fullscreen__left-sidebar {
  --ck-user-avatar-size: var(--ck-fullscreen-left-sidebar-avatar-size);
  --ck-user-name-font-size: 1em;
  box-sizing: border-box;
  background-color: #0000;
  flex-direction: column;
  align-self: flex-start;
  height: 100%;
  margin-top: 0;
  margin-right: 10px;
  display: flex;
  position: sticky;
  top: 0;

  & .ck-button.ck-fullscreen__left-sidebar-toggle-button {
    --ck-icon-size: 20px;
    --ck-size-control-min-height: 0px;
    --ck-button-hover-background: var(--ck-fullscreen-left-sidebar-toggle-button-hover-background);
    margin-top: var(--ck-fullscreen-editor-top-margin);
    margin-bottom: var(--ck-spacing-large, var(--ck-spacing-lg));
    border-radius: 100%;
    flex-shrink: 0;
    align-self: flex-start;
  }

  & > .ck-fullscreen__left-sidebar-sticky {
    min-width: 270px;

    &:first-child {
      padding-top: var(--ck-fullscreen-editor-top-margin);
    }
  }

  &.ck-fullscreen__left-sidebar--collapsed {
    width: 65px;

    & > :not(.ck-fullscreen__left-sidebar-toggle-button) {
      display: none;
    }
  }
}

.ck-fullscreen__left-sidebar .ck.ck-presence-list--collapsed {
  --ck-user-avatar-size: 32px;
}

.ck-fullscreen__left-sidebar .ck-user, .ck-fullscreen__left-sidebar .ck-presence-list__users-counter__text {
  font-size: .85em;
}

.ck-fullscreen__left-sidebar-item {
  padding: var(--ck-spacing-medium, var(--ck-spacing-base));
  margin-bottom: var(--ck-spacing-medium, var(--ck-spacing-base));

  &:first-child {
    padding-top: 0;
  }

  &:last-child {
    margin-bottom: 0;
  }
}

.ck-fullscreen__left-sidebar-header {
  --ck-fullscreen-presence-list-header-font-size: .875em;
  font-size: var(--ck-fullscreen-presence-list-header-font-size);
  color: var(--ck-document-outline-item-default-color);
  white-space: nowrap;
  text-overflow: ellipsis;
  font-weight: bold;
  overflow: hidden;
}

.ck-fullscreen__left-sidebar--sticky {
  position: sticky;
  top: 0;

  & > :first-child {
    padding-top: 0;
  }
}

.ck-fullscreen__presence-list {
  margin-top: var(--ck-spacing-medium, var(--ck-spacing-base));
}

.ck-fullscreen__left-sidebar-item--no-margin {
  margin: 0;
}

.ck-fullscreen__left-sidebar .ck.ck-document-outline {
  padding-top: 0;
  padding-left: 0;
  padding-right: 0;
}

.ck-fullscreen__document-outline-wrapper {
  padding-top: 0;
  overflow-y: auto;
}

.ck-fullscreen__sidebar.ck-fullscreen__right-sidebar {
  margin-top: var(--ck-fullscreen-editor-top-margin);
  margin-right: auto;

  &:not(.ck-fullscreen__right-sidebar--collapsed) > :first-child {
    min-width: 270px;
  }

  &.ck-fullscreen__right-sidebar--collapsed {
    width: 65px;

    & > :first-child {
      min-width: 65px;
    }
  }
}

.ck.ck-fullscreen__right-edge {
  margin-top: 0;
  margin-left: 10px;
  position: sticky;
  top: 0;

  & > :first-child {
    border-top: none;
    border-bottom: none;
    border-right: none;
    width: 495px;
    height: 100%;
  }
}

.ck.ck-heading_heading1 .ck-button__label {
  font-size: 20px;
}

.ck.ck-heading_heading2 .ck-button__label {
  font-size: 17px;
}

.ck.ck-heading_heading3 .ck-button__label {
  font-size: 14px;
}

.ck[class*="ck-heading_heading"] {
  font-weight: bold;
}

.ck.ck-dropdown.ck-heading-dropdown {
  & .ck-dropdown__button .ck-button__label {
    width: 8em;
  }

  & .ck-dropdown__panel .ck-list__item {
    min-width: 18em;
  }
}

:root, :host {
  --ck-content-highlight-marker-yellow: #fdfd77;
  --ck-content-highlight-marker-green: #62f962;
  --ck-content-highlight-marker-pink: #fc7899;
  --ck-content-highlight-marker-blue: #72ccfd;
  --ck-content-highlight-pen-red: #e71313;
  --ck-content-highlight-pen-green: #128a00;
}

.ck-content .marker-yellow {
  background-color: var(--ck-content-highlight-marker-yellow);
}

.ck-content .marker-green {
  background-color: var(--ck-content-highlight-marker-green);
}

.ck-content .marker-pink {
  background-color: var(--ck-content-highlight-marker-pink);
}

.ck-content .marker-blue {
  background-color: var(--ck-content-highlight-marker-blue);
}

.ck-content .pen-red {
  color: var(--ck-content-highlight-pen-red);
  background-color: #0000;
}

.ck-content .pen-green {
  color: var(--ck-content-highlight-pen-green);
  background-color: #0000;
}

.ck-editor__editable .ck-horizontal-line {
  display: flow-root;
}

.ck-content hr {
  vertical-align: middle;
  background: #dce5f0;
  border: 0;
  width: 100%;
  height: 4px;
  margin: 15px 0;
  display: inline-block;
}

:root, :host {
  --ck-html-embed-content-width: calc(100% - 1.5 * var(--ck-icon-size));
  --ck-html-embed-source-height: 10em;
  --ck-html-embed-unfocused-outline-width: 1px;
  --ck-html-embed-content-min-height: calc(var(--ck-icon-size) + var(--ck-spacing-standard, var(--ck-spacing-base)));
  --ck-html-embed-background: var(--ck-color-base-foreground);
  --ck-html-embed-button-hover-background: var(--ck-color-interactive-primary-surface-muted);
  --ck-html-embed-source-disabled-background: var(--ck-color-base-foreground);
  --ck-html-embed-source-disabled-color: var(--ck-color-text-disabled);
}

.ck-widget.raw-html-embed {
  font-size: var(--ck-font-size-normal, var(--ck-font-size-base));
  background-color: var(--ck-html-embed-background);
  min-width: 15em;
  margin: .9em auto;
  display: flow-root;
  position: relative;

  &:not(.ck-widget_selected):not(:hover) {
    outline: var(--ck-html-embed-unfocused-outline-width) dashed var(--ck-color-widget-blurred-border);
  }

  &[dir="ltr"] {
    text-align: left;
  }

  &[dir="rtl"] {
    text-align: right;
  }

  &:before {
    content: attr(data-html-embed-label);
    top: calc(-1 * var(--ck-html-embed-unfocused-outline-width));
    left: var(--ck-spacing-standard, var(--ck-spacing-base));
    background: var(--ck-color-base-text-light);
    transition: background var(--ck-widget-handler-animation-duration) var(--ck-widget-handler-animation-curve);
    padding: calc(var(--ck-spacing-tiny, var(--ck-spacing-xs)) + var(--ck-html-embed-unfocused-outline-width)) var(--ck-spacing-small, var(--ck-spacing-sm)) var(--ck-spacing-tiny, var(--ck-spacing-xs));
    border-radius: var(--ck-widget-label-border-radius);
    color: var(--ck-color-base-background);
    font-size: var(--ck-font-size-tiny, var(--ck-font-size-xs));
    font-family: var(--ck-font-face, var(--ck-font-family));
    z-index: 1;
    position: absolute;
  }

  &[dir="rtl"]:before {
    left: auto;
    right: var(--ck-spacing-standard, var(--ck-spacing-base));
  }

  &[dir="ltr"] .ck-widget__type-around .ck-widget__type-around__button.ck-widget__type-around__button_before {
    margin-left: 50px;
  }

  .ck.ck-editor__editable.ck-blurred &.ck-widget_selected:before {
    padding: var(--ck-spacing-tiny, var(--ck-spacing-xs)) var(--ck-spacing-small, var(--ck-spacing-sm));
    top: 0;
  }

  .ck.ck-editor__editable:not(.ck-blurred) &.ck-widget_selected:before {
    padding: var(--ck-spacing-tiny, var(--ck-spacing-xs)) var(--ck-spacing-small, var(--ck-spacing-sm));
    background: var(--ck-color-focus-border, var(--ck-color-interactive-focus-border));
    top: 0;
  }

  .ck.ck-editor__editable &:not(.ck-widget_selected):hover:before {
    padding: var(--ck-spacing-tiny, var(--ck-spacing-xs)) var(--ck-spacing-small, var(--ck-spacing-sm));
    top: 0;
  }

  & .raw-html-embed__content-wrapper {
    padding: var(--ck-spacing-standard, var(--ck-spacing-base));
  }

  & .raw-html-embed__buttons-wrapper {
    top: var(--ck-spacing-standard, var(--ck-spacing-base));
    right: var(--ck-spacing-standard, var(--ck-spacing-base));
    display: flex;
    position: absolute;

    & .ck-button {
      --ck-button-hover-background: var(--ck-html-embed-button-hover-background);
    }

    & .ck-button.raw-html-embed__save-button {
      color: var(--ck-color-button-save, var(--ck-button-save-color));
    }

    & .ck-button.raw-html-embed__cancel-button {
      color: var(--ck-color-button-cancel, var(--ck-button-cancel-color));
    }

    & .ck-button:not(:first-child) {
      margin-top: var(--ck-spacing-small, var(--ck-spacing-sm));
    }

    flex-direction: column;
  }

  &[dir="rtl"] .raw-html-embed__buttons-wrapper {
    left: var(--ck-spacing-standard, var(--ck-spacing-base));
    right: auto;
  }

  & .raw-html-embed__source {
    box-sizing: border-box;
    height: var(--ck-html-embed-source-height);
    width: var(--ck-html-embed-content-width);
    resize: none;
    min-width: 0;
    padding: var(--ck-spacing-standard, var(--ck-spacing-base));
    tab-size: 4;
    white-space: pre-wrap;
    font-family: monospace;
    font-size: var(--ck-font-size-normal, var(--ck-font-size-base));
    text-align: left;
    direction: ltr;

    &[disabled] {
      background: var(--ck-html-embed-source-disabled-background);
      color: var(--ck-html-embed-source-disabled-color);
      -webkit-text-fill-color: var(--ck-html-embed-source-disabled-color);
      opacity: 1;
    }
  }

  & .raw-html-embed__preview {
    min-height: var(--ck-html-embed-content-min-height);
    width: var(--ck-html-embed-content-width);
    position: relative;
    overflow: hidden;

    .ck-editor__editable:not(.ck-read-only) & {
      pointer-events: none;
    }

    display: flex;
  }

  & .raw-html-embed__preview-content {
    box-sizing: border-box;
    background-color: var(--ck-color-base-foreground);
    border-collapse: separate;
    width: 100%;
    margin: auto;
    display: table;
    position: relative;

    & > * {
      margin-left: auto;
      margin-right: auto;
    }

    border-spacing: 7px;
  }

  & .raw-html-embed__preview-placeholder {
    color: var(--ck-html-embed-source-disabled-color);
    justify-content: center;
    align-items: center;
    display: flex;
    position: absolute;
    inset: 0;
  }

  font-style: normal;
}

:root, :host {
  --ck-html-object-embed-unfocused-outline-width: 1px;
}

.ck-widget.html-object-embed {
  font-size: var(--ck-font-size-normal, var(--ck-font-size-base));
  background-color: var(--ck-color-base-foreground);
  padding: var(--ck-spacing-small, var(--ck-spacing-sm));
  padding-top: calc(var(--ck-font-size-tiny, var(--ck-font-size-xs)) + var(--ck-spacing-large, var(--ck-spacing-lg)));
  min-width: calc(76px + var(--ck-spacing-standard, var(--ck-spacing-base)));

  &:not(.ck-widget_selected):not(:hover) {
    outline: var(--ck-html-object-embed-unfocused-outline-width) dashed var(--ck-color-widget-blurred-border);
  }

  &:before {
    content: attr(data-html-object-embed-label);
    top: 0;
    left: var(--ck-spacing-standard, var(--ck-spacing-base));
    background: var(--ck-color-base-text-light);
    transition: background var(--ck-widget-handler-animation-duration) var(--ck-widget-handler-animation-curve);
    padding: calc(var(--ck-spacing-tiny, var(--ck-spacing-xs)) + var(--ck-html-object-embed-unfocused-outline-width)) var(--ck-spacing-small, var(--ck-spacing-sm)) var(--ck-spacing-tiny, var(--ck-spacing-xs));
    border-radius: 0 0 var(--ck-border-radius, var(--ck-radius-base)) var(--ck-border-radius, var(--ck-radius-base));
    color: var(--ck-color-base-background);
    font-style: normal;
    font-weight: normal;
    font-size: var(--ck-font-size-tiny, var(--ck-font-size-xs));
    font-family: var(--ck-font-face, var(--ck-font-family));
    position: absolute;
  }

  & .ck-widget__type-around .ck-widget__type-around__button.ck-widget__type-around__button_before {
    margin-left: 50px;
  }

  & .html-object-embed__content {
    pointer-events: none;
  }
}

div.ck-widget.html-object-embed {
  margin: 1em auto;
}

span.ck-widget.html-object-embed {
  display: inline-block;
}

:root, :host {
  --ck-content-color-image-caption-background: #f7f7f7;
  --ck-color-image-caption-highlighted-background: #fd0;
}

.ck.ck-editor__editable .image > figcaption.image__caption_highlighted {
  @media (forced-colors: none) {
    animation: .6s ease-out ck-image-caption-highlight;
  }

  @media (prefers-reduced-motion: reduce) {
    animation: none;
  }
}

@keyframes ck-image-caption-highlight {
  0% {
    background-color: var(--ck-color-image-caption-highlighted-background);
  }

  100% {
    background-color: var(--ck-content-color-image-caption-background);
  }
}

.ck.ck-editor__editable {
  & td, & th {
    & .image-inline.image_resized img {
      max-width: 100%;
    }
  }
}

[dir="ltr"] .ck.ck-button.ck-button_with-text.ck-resize-image-button .ck-button__icon {
  margin-right: var(--ck-spacing-standard, var(--ck-spacing-base));
}

[dir="rtl"] .ck.ck-button.ck-button_with-text.ck-resize-image-button .ck-button__icon {
  margin-left: var(--ck-spacing-standard, var(--ck-spacing-base));
}

.ck.ck-dropdown .ck-button.ck-resize-image-button .ck-button__label {
  width: 4em;
}

.ck.ck-editor__editable {
  & .image, & .image-inline {
    &.ck-appear {
      animation: .7s fadeIn;

      @media (prefers-reduced-motion: reduce) {
        opacity: 1;
        animation: none;
      }
    }

    position: relative;
  }

  & .image .ck-progress-bar, & .image-inline .ck-progress-bar {
    background: var(--ck-color-upload-bar-background);
    width: 0;
    height: 2px;
    transition: width .1s;
    position: absolute;
    top: 0;
    left: 0;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

:root, :host {
  --ck-color-image-upload-icon: var(--ck-color-base-background);
  --ck-color-image-upload-icon-background: var(--ck-color-base-success);
  --ck-image-upload-icon-size: 20;
  --ck-image-upload-icon-width: 2px;
  --ck-image-upload-icon-is-visible: clamp(0px, 100% - 50px, 1px);
}

.ck-image-upload-complete-icon {
  opacity: 0;
  background: var(--ck-color-image-upload-icon-background);
  font-size: calc(1px * var(--ck-image-upload-icon-size));
  width: calc(var(--ck-image-upload-icon-is-visible) * var(--ck-image-upload-icon-size));
  height: calc(var(--ck-image-upload-icon-is-visible) * var(--ck-image-upload-icon-size));
  top: min(var(--ck-spacing-medium, var(--ck-spacing-base)), 6%);
  right: min(var(--ck-spacing-medium, var(--ck-spacing-base)), 6%);
  border-radius: 50%;
  animation-name: ck-upload-complete-icon-show, ck-upload-complete-icon-hide;
  animation-duration: .5s, .5s;
  animation-delay: 0s, 3s;
  animation-fill-mode: forwards, forwards;
  display: block;
  position: absolute;
  overflow: hidden;

  &:after {
    opacity: 0;
    transform-origin: 0 0;
    border-top: var(--ck-image-upload-icon-width) solid var(--ck-color-image-upload-icon);
    border-right: var(--ck-image-upload-icon-width) solid var(--ck-color-image-upload-icon);
    box-sizing: border-box;
    content: "";
    width: 0;
    height: 0;
    animation-name: ck-upload-complete-icon-check;
    animation-duration: .5s;
    animation-delay: .5s;
    animation-fill-mode: forwards;
    position: absolute;
    top: 50%;
    left: 25%;
    transform: scaleX(-1) rotate(135deg);
  }

  @media (prefers-reduced-motion: reduce) {
    animation-duration: 0s;

    &:after {
      opacity: 1;
      width: .3em;
      height: .45em;
      animation: none;
    }
  }

  z-index: 1;
}

@keyframes ck-upload-complete-icon-show {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes ck-upload-complete-icon-hide {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@keyframes ck-upload-complete-icon-check {
  0% {
    opacity: 1;
    width: 0;
    height: 0;
  }

  33% {
    width: .3em;
    height: 0;
  }

  100% {
    opacity: 1;
    width: .3em;
    height: .45em;
  }
}

:root, :host {
  --ck-color-upload-placeholder-loader: #b3b3b3;
  --ck-upload-placeholder-loader-size: 32px;
  --ck-upload-placeholder-image-aspect-ratio: 2.8;
}

.ck .ck-image-upload-placeholder {
  width: 100%;
  margin: 0;

  &.image-inline {
    width: calc(2 * var(--ck-upload-placeholder-loader-size) * var(--ck-upload-placeholder-image-aspect-ratio));
  }

  & img {
    aspect-ratio: var(--ck-upload-placeholder-image-aspect-ratio);
  }
}

.ck .ck-upload-placeholder-loader {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
  top: 0;

  &:before {
    width: var(--ck-upload-placeholder-loader-size);
    height: var(--ck-upload-placeholder-loader-size);
    border-top: 3px solid var(--ck-color-upload-placeholder-loader);
    content: "";
    border-right: 2px solid #0000;
    border-radius: 50%;
    animation: 1s linear infinite ck-upload-placeholder-loader;
    position: relative;
  }

  left: 0;
}

@keyframes ck-upload-placeholder-loader {
  to {
    transform: rotate(360deg);
  }
}

.ck.ck-editor__editable {
  & .image > figcaption.ck-placeholder:before {
    padding-left: inherit;
    padding-right: inherit;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }

  & .image {
    z-index: 1;

    &.ck-widget_selected {
      z-index: 2;
    }
  }

  & .image-inline {
    z-index: 1;

    &.ck-widget_selected {
      z-index: 2;

      & ::selection {
        display: none;
      }
    }
  }

  & .image-inline img {
    height: auto;
  }

  & td, & th {
    & .image-inline img {
      max-width: none;
    }
  }
}

.ck.ck-editor__editable {
  & img.image_placeholder {
    background-size: 100% 100%;
  }
}

:root, :host {
  --ck-image-insert-insert-by-url-width: var(--ck-width-md);
  --ck-image-insert-form-padding: var(--ck-spacing-padding);
  --ck-image-insert-form-button-gap: var(--ck-spacing-gap-tight);
}

.ck.ck-image-insert-url {
  --ck-input-width: 100%;
  width: 400px;

  & .ck-image-insert-url__action-row {
    grid-column-gap: var(--ck-spacing-large, var(--ck-spacing-lg));
    margin-top: var(--ck-spacing-large, var(--ck-spacing-lg));
    display: grid;

    &:empty {
      margin-top: 0;
    }

    & .ck-button-save, & .ck-button-cancel {
      justify-content: center;
      min-width: auto;
    }

    & .ck-button .ck-button__label {
      color: var(--ck-color-text);
    }

    grid-template-columns: repeat(2, 1fr);
  }

  padding: var(--ck-dialog-content-padding);
}

.ck.ck-image-insert-form {
  padding: var(--ck-image-insert-form-padding);

  & > .ck.ck-button {
    width: 100%;
    display: block;

    [dir="ltr"] & {
      text-align: left;
    }

    [dir="rtl"] & {
      text-align: right;
    }

    &:not(:last-child) {
      margin-bottom: var(--ck-image-insert-form-button-gap);
    }
  }

  & > .ck.ck-collapsible {
    &:not(:first-child) {
      border-top: 1px solid var(--ck-color-base-border);
    }

    &:not(:last-child) {
      border-bottom: 1px solid var(--ck-color-base-border);
    }

    min-width: var(--ck-image-insert-insert-by-url-width);
  }

  &:focus {
    outline: none;
  }
}

:root, :host {
  --ck-image-custom-resize-form-width: var(--ck-width-balloon-form);
}

.ck.ck-image-custom-resize-form {
  &.ck-responsive-form {
    width: var(--ck-image-custom-resize-form-width);
  }
}

:root, :host {
  --ck-text-alternative-form-width: var(--ck-width-balloon-form);
}

.ck.ck-text-alternative-form {
  &.ck-responsive-form {
    width: var(--ck-text-alternative-form-width);
  }
}

:root, :host {
  --ck-content-color-image-caption-background: #f7f7f7;
  --ck-content-color-image-caption-text: #333;
  --ck-content-image-style-spacing: 1.5em;
  --ck-content-inline-image-style-spacing: calc(var(--ck-content-image-style-spacing) / 2);
}

.ck-content .image > figcaption {
  caption-side: bottom;
  word-break: normal;
  overflow-wrap: anywhere;
  break-before: avoid;
  color: var(--ck-content-color-image-caption-text);
  background-color: var(--ck-content-color-image-caption-background);
  outline-offset: -1px;
  padding: .6em;
  font-size: .75em;
  display: table-caption;

  @media (forced-colors: active) {
    background-color: unset;
    color: unset;
  }
}

.ck-content img.image_resized {
  height: auto;
}

.ck-content .image.image_resized {
  box-sizing: border-box;
  max-width: 100%;
  display: block;

  & img {
    width: 100%;
  }

  & > figcaption {
    display: block;
  }
}

.ck-content {
  & .image {
    &.image-style-block-align-left, &.image-style-block-align-right {
      max-width: calc(100% - var(--ck-content-image-style-spacing));
    }

    &.image-style-align-left, &.image-style-align-right {
      clear: none;
    }

    &.image-style-side {
      float: right;
      margin-left: var(--ck-content-image-style-spacing);
      max-width: 50%;
    }

    &.image-style-align-left {
      float: left;
      margin-right: var(--ck-content-image-style-spacing);
    }

    &.image-style-align-right {
      float: right;
      margin-left: var(--ck-content-image-style-spacing);
    }

    &.image-style-block-align-right {
      margin-left: auto;
      margin-right: 0;
    }

    &.image-style-block-align-left {
      margin-left: 0;
      margin-right: auto;
    }
  }

  & .image-style-align-center {
    margin-left: auto;
    margin-right: auto;
  }

  & .image-style-align-left {
    float: left;
    margin-right: var(--ck-content-image-style-spacing);
  }

  & .image-style-align-right {
    float: right;
    margin-left: var(--ck-content-image-style-spacing);
  }

  & p + .image.image-style-align-left, & p + .image.image-style-align-right, & p + .image.image-style-side {
    margin-top: 0;
  }

  & .image-inline {
    &.image-style-align-left, &.image-style-align-right {
      margin-top: var(--ck-content-inline-image-style-spacing);
      margin-bottom: var(--ck-content-inline-image-style-spacing);
    }

    &.image-style-align-left {
      margin-right: var(--ck-content-inline-image-style-spacing);
    }

    &.image-style-align-right {
      margin-left: var(--ck-content-inline-image-style-spacing);
    }
  }
}

.ck-content {
  & .image {
    clear: both;
    text-align: center;
    min-width: 50px;
    margin: .9em auto;
    display: table;

    & img {
      min-width: 100%;
      max-width: 100%;
      height: auto;
      margin: 0 auto;
      display: block;
    }
  }

  & .image-inline {
    align-items: flex-start;
    max-width: 100%;
    display: inline-flex;

    & picture {
      display: flex;
    }

    & picture, & img {
      flex-grow: 1;
      flex-shrink: 1;
      max-width: 100%;
    }
  }
}

.ck .ck-link_selected {
  background: var(--ck-color-link-selected-background);

  & span.image-inline {
    outline: var(--ck-widget-outline-thickness) solid var(--ck-color-link-selected-background);
  }
}

.ck .ck-fake-link-selection {
  background: var(--ck-color-link-fake-selection);
}

.ck .ck-fake-link-selection_collapsed {
  border-right: 1px solid var(--ck-color-base-text);
  outline: var(--ck-outline-fake-caret);
  height: 100%;
  margin-right: -1px;
}

:root, :host {
  --ck-link-bookmark-icon-size: calc(var(--ck-icon-size) * .7);
}

.ck.ck-toolbar.ck-link-toolbar {
  & > .ck-toolbar__items {
    flex-wrap: nowrap;
  }
}

a.ck.ck-button.ck-link-toolbar__preview {
  padding: 0 var(--ck-spacing-medium, var(--ck-spacing-base));
  color: var(--ck-color-link-default);
  cursor: pointer;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  display: flex;

  & .ck.ck-button__label {
    text-overflow: ellipsis;
    max-width: var(--ck-input-width);
  }

  &, &:hover, &:focus, &:active {
    background: none;
  }

  &:active {
    box-shadow: none;
  }

  &:hover, &:focus {
    text-decoration: underline;
  }

  &.ck-button_with-text .ck.ck-icon.ck-button__icon {
    width: var(--ck-link-bookmark-icon-size);
    height: var(--ck-link-bookmark-icon-size);

    [dir="ltr"] & {
      margin-right: var(--ck-spacing-tiny, var(--ck-spacing-xs));
      margin-left: var(--ck-spacing-small, var(--ck-spacing-sm));
    }

    [dir="rtl"] & {
      margin-left: var(--ck-spacing-tiny, var(--ck-spacing-xs));
      margin-right: var(--ck-spacing-small, var(--ck-spacing-sm));
    }
  }

  &:has(.ck-icon) {
    padding-left: var(--ck-spacing-extra-tiny, var(--ck-spacing-2xs));
  }
}

.ck.ck-link-toolbar__preview {
  display: inline-block;

  & .ck-button__label {
    overflow: hidden;
  }
}

:root, :host {
  --ck-link-image-indicator-icon-size: 20;
  --ck-link-image-indicator-icon-is-visible: clamp(0px, 100% - 50px, 1px);
}

.ck.ck-editor__editable {
  & figure.image > a, & a span.image-inline {
    &:after {
      content: "";
      top: min(var(--ck-spacing-medium, var(--ck-spacing-base)), 6%);
      right: min(var(--ck-spacing-medium, var(--ck-spacing-base)), 6%);
      width: calc(var(--ck-link-image-indicator-icon-is-visible) * var(--ck-link-image-indicator-icon-size));
      height: calc(var(--ck-link-image-indicator-icon-is-visible) * var(--ck-link-image-indicator-icon-size));
      background-color: #0006;
      background-image: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjAgMjAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0iI2ZmZiIgZD0ibTExLjA3NyAxNSAuOTkxLTEuNDE2YS43NS43NSAwIDEgMSAxLjIyOS44NmwtMS4xNDggMS42NGEuNzQ4Ljc0OCAwIDAgMS0uMjE3LjIwNiA1LjI1MSA1LjI1MSAwIDAgMS04LjUwMy01Ljk1NS43NDEuNzQxIDAgMCAxIC4xMi0uMjc0bDEuMTQ3LTEuNjM5YS43NS43NSAwIDEgMSAxLjIyOC44Nkw0LjkzMyAxMC43bC4wMDYuMDAzYTMuNzUgMy43NSAwIDAgMCA2LjEzMiA0LjI5NGwuMDA2LjAwNHptNS40OTQtNS4zMzVhLjc0OC43NDggMCAwIDEtLjEyLjI3NGwtMS4xNDcgMS42MzlhLjc1Ljc1IDAgMSAxLTEuMjI4LS44NmwuODYtMS4yM2EzLjc1IDMuNzUgMCAwIDAtNi4xNDQtNC4zMDFsLS44NiAxLjIyOWEuNzUuNzUgMCAwIDEtMS4yMjktLjg2bDEuMTQ4LTEuNjRhLjc0OC43NDggMCAwIDEgLjIxNy0uMjA2IDUuMjUxIDUuMjUxIDAgMCAxIDguNTAzIDUuOTU1em0tNC41NjMtMi41MzJhLjc1Ljc1IDAgMCAxIC4xODQgMS4wNDVsLTMuMTU1IDQuNTA1YS43NS43NSAwIDEgMS0xLjIyOS0uODZsMy4xNTUtNC41MDZhLjc1Ljc1IDAgMCAxIDEuMDQ1LS4xODR6Ii8+PC9zdmc+");
      background-position: center;
      background-repeat: no-repeat;
      background-size: 14px;
      border-radius: 100%;
      display: block;
      position: absolute;
      overflow: hidden;
    }
  }
}

:root, :host {
  --ck-link-panel-width: var(--ck-width-balloon-form);
  --ck-link-provider-list-item-text-height: calc(var(--ck-line-height-base) * var(--ck-font-size-normal, var(--ck-font-size-base)));
  --ck-link-provider-list-item-height: calc(var(--ck-link-provider-list-item-text-height) + var(--ck-spacing-small, var(--ck-spacing-sm)) + var(--ck-spacing-small, var(--ck-spacing-sm)));
  --ck-link-provider-list-padding-bottom: var(--ck-spacing-padding-compact);
}

.ck.ck-form.ck-link-form {
  width: var(--ck-link-panel-width);
  padding-bottom: 0;

  &.ck-responsive-form {
    @media screen and (width <= 600px) {
      & .ck-labeled-field-view {
        flex-basis: 0;
        margin: 0;
      }

      & .ck.ck-form__row.ck-form__row_with-submit {
        align-items: flex-start;
        gap: var(--ck-spacing-gap-comfortable) var(--ck-spacing-padding);
        padding: var(--ck-form-row-padding);
        padding-bottom: var(--ck-spacing-padding-comfortable);
        flex-flow: wrap;

        & > .ck {
          margin: 0;
        }

        & > .ck-button-action {
          flex-basis: 100%;
        }
      }
    }
  }

  & .ck-link-form__providers-list {
    padding-bottom: var(--ck-link-provider-list-padding-bottom);
    flex-direction: column;
    display: flex;
    position: relative;

    &:before {
      content: "";
      border-top: var(--ck-border-divider);
      height: 0;
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
    }

    &:has(.ck-list__item:nth-child(n+5)) {
      max-height: calc(var(--ck-link-provider-list-item-height) * 4 + var(--ck-spacing-large, var(--ck-spacing-lg)) + 1px);
      overflow: auto;
    }

    & .ck-link__button {
      padding: var(--ck-spacing-small, var(--ck-spacing-sm)) var(--ck-spacing-large, var(--ck-spacing-lg));
      border-radius: var(--ck-button-border-radius);

      & > .ck-button__label {
        text-overflow: ellipsis;
        flex-grow: 1;
        overflow: hidden;
      }
    }
  }
}

.ck.ck-link-form {
  & .ck-link__items:empty {
    display: none;
  }
}

:root, :host {
  --ck-link-properties-width: var(--ck-width-balloon-form);
}

.ck.ck-link-properties {
  width: var(--ck-link-properties-width);
}

:root, :host {
  --ck-link-providers-width: var(--ck-width-balloon-form);
  --ck-link-list-view-max-height: 240px;
  --ck-link-list-view-icon-size: calc(var(--ck-icon-size) * .8);
}

.ck.ck-link-providers {
  width: var(--ck-link-providers-width);

  & .ck-form__header__label {
    text-overflow: ellipsis;
    overflow: hidden;
  }

  & > .ck-link-providers__list {
    max-height: min(var(--ck-link-list-view-max-height), 40vh);
    overflow: hidden auto;

    & .ck-button {
      & > .ck-icon {
        width: var(--ck-link-list-view-icon-size);
        height: var(--ck-link-list-view-icon-size);
        flex-shrink: 0;
      }

      & > .ck-button__label {
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
      }
    }

    overscroll-behavior: contain;
  }

  & .ck-link__empty-list-info {
    padding: calc(2 * var(--ck-spacing-large, var(--ck-spacing-lg))) var(--ck-spacing-medium, var(--ck-spacing-base));
    text-align: center;
    font-style: italic;
  }
}

.ck-editor__editable .ck-list-bogus-paragraph {
  display: block;
}

:root, :host {
  --ck-list-style-button-size: 44px;
  --ck-list-styles-list-padding: var(--ck-spacing-padding);
}

.ck.ck-list-styles-list {
  row-gap: var(--ck-spacing-medium, var(--ck-spacing-base));
  column-gap: var(--ck-spacing-medium, var(--ck-spacing-base));
  padding: var(--ck-list-styles-list-padding);
  grid-template-columns: repeat(3, auto);

  & .ck-button {
    width: var(--ck-list-style-button-size);
    height: var(--ck-list-style-button-size);
    box-sizing: content-box;
    margin: 0;
    padding: 0;

    & .ck-icon {
      width: var(--ck-list-style-button-size);
      height: var(--ck-list-style-button-size);
    }
  }

  display: grid;
}

.ck.ck-list-properties {
  &.ck-list-properties_without-styles {
    padding: var(--ck-spacing-large, var(--ck-spacing-lg));

    & > * {
      min-width: 14em;

      & + * {
        margin-top: var(--ck-spacing-standard, var(--ck-spacing-base));
      }
    }
  }

  &.ck-list-properties_with-numbered-properties {
    & > .ck-list-styles-list {
      grid-template-columns: repeat(4, auto);
    }

    & > .ck-collapsible {
      border-top: var(--ck-border-divider);

      & > .ck-collapsible__children {
        & > * {
          width: 100%;

          & + * {
            margin-top: var(--ck-spacing-standard, var(--ck-spacing-base));
          }
        }
      }
    }
  }

  & .ck.ck-numbered-list-properties__start-index .ck-input {
    width: 100%;
    min-width: auto;
  }

  & .ck.ck-numbered-list-properties__reversed-order {
    margin-bottom: calc(-1 * var(--ck-spacing-tiny, var(--ck-spacing-xs)));
    background: none;
    padding-left: 0;
    padding-right: 0;

    &:active, &:hover {
      box-shadow: none;
      background: none;
      border-color: #0000;
    }
  }
}

:root, :host {
  --ck-content-todo-list-checkmark-size: 16px;
}

.ck-editor__editable.ck-content .todo-list .todo-list__label > span[contenteditable="false"] > input {
  -webkit-appearance: none;
  width: var(--ck-content-todo-list-checkmark-size);
  height: var(--ck-content-todo-list-checkmark-size);
  vertical-align: middle;
  border: 0;
  margin-left: 0;
  margin-right: -15px;
  display: inline-block;
  position: relative;
  left: -25px;
  right: 0;

  [dir="rtl"]& {
    margin-left: -15px;
    margin-right: 0;
    left: 0;
    right: -25px;
  }

  &:before {
    box-sizing: border-box;
    content: "";
    border: 1px solid #333;
    border-radius: 2px;
    width: 100%;
    height: 100%;
    transition: box-shadow .25s ease-in-out;
    display: block;
    position: absolute;

    @media (prefers-reduced-motion: reduce) {
      transition: none;
    }
  }

  &:after {
    box-sizing: content-box;
    pointer-events: none;
    content: "";
    left: calc(var(--ck-content-todo-list-checkmark-size) / 3);
    top: calc(var(--ck-content-todo-list-checkmark-size) / 5.3);
    width: calc(var(--ck-content-todo-list-checkmark-size) / 5.3);
    height: calc(var(--ck-content-todo-list-checkmark-size) / 2.6);
    border-style: solid;
    border-color: #0000;
    border-width: 0 calc(var(--ck-content-todo-list-checkmark-size) / 8) calc(var(--ck-content-todo-list-checkmark-size) / 8) 0;
    display: block;
    position: absolute;
    transform: rotate(45deg);
  }

  &[checked] {
    &:before {
      background: #26ab33;
      border-color: #26ab33;
    }

    &:after {
      border-color: #fff;
    }
  }
}

.ck-editor__editable.ck-content .todo-list .todo-list__label {
  & > input, & > span[contenteditable="false"] > input {
    cursor: pointer;

    &:hover:before {
      box-shadow: 0 0 0 5px #0000001a;
    }
  }

  &.todo-list__label_without-description {
    & input[type="checkbox"] {
      position: absolute;
    }
  }
}

:root, :host {
  --ck-content-list-marker-color: var(--ck-content-font-color);
  --ck-content-list-marker-font-family: var(--ck-content-font-family);
  --ck-content-list-marker-font-size: var(--ck-content-font-size);
  --ck-content-todo-list-checkmark-size: 16px;
}

.ck-content li {
  & > p:first-of-type {
    margin-top: 0;
  }

  & > p:only-of-type {
    margin-top: 0;
    margin-bottom: 0;
  }

  &.ck-list-marker-bold::marker {
    font-weight: bold;
  }

  &.ck-list-marker-italic::marker {
    font-style: italic;
  }

  &.ck-list-marker-color::marker {
    color: var(--ck-content-list-marker-color);
  }

  &.ck-list-marker-font-family::marker {
    font-family: var(--ck-content-list-marker-font-family);
  }

  &.ck-list-marker-font-size::marker {
    font-size: var(--ck-content-list-marker-font-size);
  }

  &.ck-list-marker-font-size-tiny::marker {
    font-size: var(--ck-content-font-size-tiny);
  }

  &.ck-list-marker-font-size-small::marker {
    font-size: var(--ck-content-font-size-small);
  }

  &.ck-list-marker-font-size-big::marker {
    font-size: var(--ck-content-font-size-big);
  }

  &.ck-list-marker-font-size-huge::marker {
    font-size: var(--ck-content-font-size-huge);
  }
}

.ck-content ol {
  list-style-type: decimal;

  & ol {
    list-style-type: lower-latin;

    & ol {
      list-style-type: lower-roman;

      & ol {
        list-style-type: upper-latin;

        & ol {
          list-style-type: upper-roman;
        }
      }
    }
  }
}

.ck-content ul {
  list-style-type: disc;

  & ul {
    list-style-type: circle;

    & ul {
      list-style-type: square;

      & ul {
        list-style-type: square;
      }
    }
  }
}

.ck-content .todo-list .todo-list__label > input {
  -webkit-appearance: none;
  width: var(--ck-content-todo-list-checkmark-size);
  height: var(--ck-content-todo-list-checkmark-size);
  vertical-align: middle;
  border: 0;
  margin-left: 0;
  margin-right: -15px;
  display: inline-block;
  position: relative;
  left: -25px;
  right: 0;

  [dir="rtl"]& {
    margin-left: -15px;
    margin-right: 0;
    left: 0;
    right: -25px;
  }

  &:before {
    box-sizing: border-box;
    content: "";
    border: 1px solid #333;
    border-radius: 2px;
    width: 100%;
    height: 100%;
    transition: box-shadow .25s ease-in-out;
    display: block;
    position: absolute;

    @media (prefers-reduced-motion: reduce) {
      transition: none;
    }
  }

  &:after {
    box-sizing: content-box;
    pointer-events: none;
    content: "";
    left: calc(var(--ck-content-todo-list-checkmark-size) / 3);
    top: calc(var(--ck-content-todo-list-checkmark-size) / 5.3);
    width: calc(var(--ck-content-todo-list-checkmark-size) / 5.3);
    height: calc(var(--ck-content-todo-list-checkmark-size) / 2.6);
    border-style: solid;
    border-color: #0000;
    border-width: 0 calc(var(--ck-content-todo-list-checkmark-size) / 8) calc(var(--ck-content-todo-list-checkmark-size) / 8) 0;
    display: block;
    position: absolute;
    transform: rotate(45deg);
  }

  &[checked] {
    &:before {
      background: #26ab33;
      border-color: #26ab33;
    }

    &:after {
      border-color: #fff;
    }
  }
}

.ck-content .todo-list {
  list-style: none;

  & li {
    margin-bottom: 5px;
    position: relative;

    & .todo-list {
      margin-top: 5px;
    }
  }

  & .todo-list__label {
    & .todo-list__label__description {
      vertical-align: middle;
    }

    &.todo-list__label_without-description input[type="checkbox"] {
      position: absolute;
    }
  }
}

:root, :host {
  --ck-media-embed-placeholder-icon-size: 3em;
  --ck-color-media-embed-placeholder-url-text: #757575;
  --ck-color-media-embed-placeholder-url-text-hover: var(--ck-color-base-text);
}

.ck-media__wrapper {
  margin: 0 auto;

  & .ck-media__placeholder {
    padding: calc(3 * var(--ck-spacing-standard, var(--ck-spacing-base)));
    background: var(--ck-color-base-foreground);
    flex-direction: column;
    align-items: center;
    display: flex;

    & .ck-media__placeholder__icon {
      min-width: var(--ck-media-embed-placeholder-icon-size);
      height: var(--ck-media-embed-placeholder-icon-size);
      margin-bottom: var(--ck-spacing-large, var(--ck-spacing-lg));
      background-position: center;
      background-size: cover;

      & .ck-icon {
        width: 100%;
        height: 100%;
      }
    }

    & .ck-media__placeholder__url__text {
      color: var(--ck-color-media-embed-placeholder-url-text);
      white-space: nowrap;
      text-align: center;
      text-overflow: ellipsis;
      font-style: italic;

      &:hover {
        color: var(--ck-color-media-embed-placeholder-url-text-hover);
        cursor: pointer;
        text-decoration: underline;
      }
    }

    & .ck-media__placeholder__url {
      max-width: 100%;
      position: relative;

      & .ck-media__placeholder__url__text {
        display: block;
        overflow: hidden;
      }
    }
  }

  &[data-oembed-url*="google.com/maps"] .ck-media__placeholder__icon, &[data-oembed-url*="goo.gl/maps"] .ck-media__placeholder__icon, &[data-oembed-url*="maps.google.com"] .ck-media__placeholder__icon, &[data-oembed-url*="maps.app.goo.gl"] .ck-media__placeholder__icon {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNTAuMzc4IiBoZWlnaHQ9IjI1NC4xNjciIHZpZXdCb3g9IjAgMCA2Ni4yNDYgNjcuMjQ4Ij48ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMTcyLjUzMSAtMjE4LjQ1NSkgc2NhbGUoLjk4MDEyKSI+PHJlY3Qgcnk9IjUuMjM4IiByeD0iNS4yMzgiIHk9IjIzMS4zOTkiIHg9IjE3Ni4wMzEiIGhlaWdodD0iNjAuMDk5IiB3aWR0aD0iNjAuMDk5IiBmaWxsPSIjMzRhNjY4IiBwYWludC1vcmRlcj0ibWFya2VycyBzdHJva2UgZmlsbCIvPjxwYXRoIGQ9Ik0yMDYuNDc3IDI2MC45bC0yOC45ODcgMjguOTg3YTUuMjE4IDUuMjE4IDAgMCAwIDMuNzggMS42MWg0OS42MjFjMS42OTQgMCAzLjE5LS43OTggNC4xNDYtMi4wMzd6IiBmaWxsPSIjNWM4OGM1Ii8+PHBhdGggZD0iTTIyNi43NDIgMjIyLjk4OGMtOS4yNjYgMC0xNi43NzcgNy4xNy0xNi43NzcgMTYuMDE0LjAwNyAyLjc2Mi42NjMgNS40NzQgMi4wOTMgNy44NzUuNDMuNzAzLjgzIDEuNDA4IDEuMTkgMi4xMDcuMzMzLjUwMi42NSAxLjAwNS45NSAxLjUwOC4zNDMuNDc3LjY3My45NTcuOTg4IDEuNDQgMS4zMSAxLjc2OSAyLjUgMy41MDIgMy42MzcgNS4xNjguNzkzIDEuMjc1IDEuNjgzIDIuNjQgMi40NjYgMy45OSAyLjM2MyA0LjA5NCA0LjAwNyA4LjA5MiA0LjYgMTMuOTE0di4wMTJjLjE4Mi40MTIuNTE2LjY2Ni44NzkuNjY3LjQwMy0uMDAxLjc2OC0uMzE0LjkzLS43OTkuNjAzLTUuNzU2IDIuMjM4LTkuNzI5IDQuNTg1LTEzLjc5NC43ODItMS4zNSAxLjY3My0yLjcxNSAyLjQ2NS0zLjk5IDEuMTM3LTEuNjY2IDIuMzI4LTMuNCAzLjYzOC01LjE2OS4zMTUtLjQ4Mi42NDUtLjk2Mi45ODgtMS40MzkuMy0uNTAzLjYxNy0xLjAwNi45NS0xLjUwOC4zNTktLjcuNzYtMS40MDQgMS4xOS0yLjEwNyAxLjQyNi0yLjQwMiAyLTUuMTE0IDIuMDA0LTcuODc1IDAtOC44NDQtNy41MTEtMTYuMDE0LTE2Ljc3Ni0xNi4wMTR6IiBmaWxsPSIjZGQ0YjNlIiBwYWludC1vcmRlcj0ibWFya2VycyBzdHJva2UgZmlsbCIvPjxlbGxpcHNlIHJ5PSI1LjU2NCIgcng9IjUuODI4IiBjeT0iMjM5LjAwMiIgY3g9IjIyNi43NDIiIGZpbGw9IiM4MDJkMjciIHBhaW50LW9yZGVyPSJtYXJrZXJzIHN0cm9rZSBmaWxsIi8+PHBhdGggZD0iTTE5MC4zMDEgMjM3LjI4M2MtNC42NyAwLTguNDU3IDMuODUzLTguNDU3IDguNjA2czMuNzg2IDguNjA3IDguNDU3IDguNjA3YzMuMDQzIDAgNC44MDYtLjk1OCA2LjMzNy0yLjUxNiAxLjUzLTEuNTU3IDIuMDg3LTMuOTEzIDIuMDg3LTYuMjkgMC0uMzYyLS4wMjMtLjcyMi0uMDY0LTEuMDc5aC04LjI1N3YzLjA0M2g0Ljg1Yy0uMTk3Ljc1OS0uNTMxIDEuNDUtMS4wNTggMS45ODYtLjk0Mi45NTgtMi4wMjggMS41NDgtMy45MDEgMS41NDgtMi44NzYgMC01LjIwOC0yLjM3Mi01LjIwOC01LjI5OSAwLTIuOTI2IDIuMzMyLTUuMjk5IDUuMjA4LTUuMjk5IDEuMzk5IDAgMi42MTguNDA3IDMuNTg0IDEuMjkzbDIuMzgxLTIuMzhjMC0uMDAyLS4wMDMtLjAwNC0uMDA0LS4wMDUtMS41ODgtMS41MjQtMy42Mi0yLjIxNS01Ljk1NS0yLjIxNXptNC40MyA1LjY2bC4wMDMuMDA2di0uMDAzeiIgZmlsbD0iI2ZmZiIgcGFpbnQtb3JkZXI9Im1hcmtlcnMgc3Ryb2tlIGZpbGwiLz48cGF0aCBkPSJNMjE1LjE4NCAyNTEuOTI5bC03Ljk4IDcuOTc5IDI4LjQ3NyAyOC40NzVjLjI4Ny0uNjQ5LjQ0OS0xLjM2Ni40NDktMi4xMjN2LTMxLjE2NWMtLjQ2OS42NzUtLjkzNCAxLjM0OS0xLjM4MiAyLjAwNS0uNzkyIDEuMjc1LTEuNjgyIDIuNjQtMi40NjUgMy45OS0yLjM0NyA0LjA2NS0zLjk4MiA4LjAzOC00LjU4NSAxMy43OTQtLjE2Mi40ODUtLjUyNy43OTgtLjkzLjc5OS0uMzYzLS4wMDEtLjY5Ny0uMjU1LS44NzktLjY2N3YtLjAxMmMtLjU5My01LjgyMi0yLjIzNy05LjgyLTQuNi0xMy45MTQtLjc4My0xLjM1LTEuNjczLTIuNzE1LTIuNDY2LTMuOTktMS4xMzctMS42NjYtMi4zMjctMy40LTMuNjM3LTUuMTY5bC0uMDAyLS4wMDN6IiBmaWxsPSIjYzNjM2MzIi8+PHBhdGggZD0iTTIxMi45ODMgMjQ4LjQ5NWwtMzYuOTUyIDM2Ljk1M3YuODEyYTUuMjI3IDUuMjI3IDAgMCAwIDUuMjM4IDUuMjM4aDEuMDE1bDM1LjY2Ni0zNS42NjZhMTM2LjI3NSAxMzYuMjc1IDAgMCAwLTIuNzY0LTMuOSAzNy41NzUgMzcuNTc1IDAgMCAwLS45ODktMS40NGMtLjI5OS0uNTAzLS42MTYtMS4wMDYtLjk1LTEuNTA4LS4wODMtLjE2Mi0uMTc2LS4zMjYtLjI2NC0uNDg5eiIgZmlsbD0iI2ZkZGM0ZiIgcGFpbnQtb3JkZXI9Im1hcmtlcnMgc3Ryb2tlIGZpbGwiLz48cGF0aCBkPSJNMjExLjk5OCAyNjEuMDgzbC02LjE1MiA2LjE1MSAyNC4yNjQgMjQuMjY0aC43ODFhNS4yMjcgNS4yMjcgMCAwIDAgNS4yMzktNS4yMzh2LTEuMDQ1eiIgZmlsbD0iI2ZmZiIgcGFpbnQtb3JkZXI9Im1hcmtlcnMgc3Ryb2tlIGZpbGwiLz48L2c+PC9zdmc+");
  }

  &[data-oembed-url*="facebook.com"] .ck-media__placeholder {
    background: #4268b3;

    & .ck-media__placeholder__icon {
      background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHdpZHRoPSIxMDI0cHgiIGhlaWdodD0iMTAyNHB4IiB2aWV3Qm94PSIwIDAgMTAyNCAxMDI0IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPiAgICAgICAgPHRpdGxlPkZpbGwgMTwvdGl0bGU+ICAgIDxkZXNjPkNyZWF0ZWQgd2l0aCBTa2V0Y2guPC9kZXNjPiAgICA8ZGVmcz48L2RlZnM+ICAgIDxnIGlkPSJQYWdlLTEiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPiAgICAgICAgPGcgaWQ9ImZMb2dvX1doaXRlIiBmaWxsPSIjRkZGRkZFIj4gICAgICAgICAgICA8cGF0aCBkPSJNOTY3LjQ4NCwwIEw1Ni41MTcsMCBDMjUuMzA0LDAgMCwyNS4zMDQgMCw1Ni41MTcgTDAsOTY3LjQ4MyBDMCw5OTguNjk0IDI1LjI5NywxMDI0IDU2LjUyMiwxMDI0IEw1NDcsMTAyNCBMNTQ3LDYyOCBMNDE0LDYyOCBMNDE0LDQ3MyBMNTQ3LDQ3MyBMNTQ3LDM1OS4wMjkgQzU0NywyMjYuNzY3IDYyNy43NzMsMTU0Ljc0NyA3NDUuNzU2LDE1NC43NDcgQzgwMi4yNjksMTU0Ljc0NyA4NTAuODQyLDE1OC45NTUgODY1LDE2MC44MzYgTDg2NSwyOTkgTDc4My4zODQsMjk5LjAzNyBDNzE5LjM5MSwyOTkuMDM3IDcwNywzMjkuNTI5IDcwNywzNzQuMjczIEw3MDcsNDczIEw4NjAuNDg3LDQ3MyBMODQwLjUwMSw2MjggTDcwNyw2MjggTDcwNywxMDI0IEw5NjcuNDg0LDEwMjQgQzk5OC42OTcsMTAyNCAxMDI0LDk5OC42OTcgMTAyNCw5NjcuNDg0IEwxMDI0LDU2LjUxNSBDMTAyNCwyNS4zMDMgOTk4LjY5NywwIDk2Ny40ODQsMCIgaWQ9IkZpbGwtMSI+PC9wYXRoPiAgICAgICAgPC9nPiAgICA8L2c+PC9zdmc+");
    }

    & .ck-media__placeholder__url__text {
      color: #cdf;

      &:hover {
        color: #fff;
      }
    }
  }

  &[data-oembed-url*="instagram.com"] .ck-media__placeholder {
    background: linear-gradient(-135deg, #1400c7, #b800b1, #f50000);

    & .ck-media__placeholder__icon {
      background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIHdpZHRoPSI1MDRweCIgaGVpZ2h0PSI1MDRweCIgdmlld0JveD0iMCAwIDUwNCA1MDQiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+ICAgICAgICA8dGl0bGU+Z2x5cGgtbG9nb19NYXkyMDE2PC90aXRsZT4gICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+ICAgIDxkZWZzPiAgICAgICAgPHBvbHlnb24gaWQ9InBhdGgtMSIgcG9pbnRzPSIwIDAuMTU5IDUwMy44NDEgMC4xNTkgNTAzLjg0MSA1MDMuOTQgMCA1MDMuOTQiPjwvcG9seWdvbj4gICAgPC9kZWZzPiAgICA8ZyBpZD0iZ2x5cGgtbG9nb19NYXkyMDE2IiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4gICAgICAgIDxnIGlkPSJHcm91cC0zIj4gICAgICAgICAgICA8bWFzayBpZD0ibWFzay0yIiBmaWxsPSJ3aGl0ZSI+ICAgICAgICAgICAgICAgIDx1c2UgeGxpbms6aHJlZj0iI3BhdGgtMSI+PC91c2U+ICAgICAgICAgICAgPC9tYXNrPiAgICAgICAgICAgIDxnIGlkPSJDbGlwLTIiPjwvZz4gICAgICAgICAgICA8cGF0aCBkPSJNMjUxLjkyMSwwLjE1OSBDMTgzLjUwMywwLjE1OSAxNzQuOTI0LDAuNDQ5IDE0OC4wNTQsMS42NzUgQzEyMS4yNCwyLjg5OCAxMDIuOTI3LDcuMTU3IDg2LjkwMywxMy4zODUgQzcwLjMzNywxOS44MjIgNTYuMjg4LDI4LjQzNiA0Mi4yODIsNDIuNDQxIEMyOC4yNzcsNTYuNDQ3IDE5LjY2Myw3MC40OTYgMTMuMjI2LDg3LjA2MiBDNi45OTgsMTAzLjA4NiAyLjczOSwxMjEuMzk5IDEuNTE2LDE0OC4yMTMgQzAuMjksMTc1LjA4MyAwLDE4My42NjIgMCwyNTIuMDggQzAsMzIwLjQ5NyAwLjI5LDMyOS4wNzYgMS41MTYsMzU1Ljk0NiBDMi43MzksMzgyLjc2IDYuOTk4LDQwMS4wNzMgMTMuMjI2LDQxNy4wOTcgQzE5LjY2Myw0MzMuNjYzIDI4LjI3Nyw0NDcuNzEyIDQyLjI4Miw0NjEuNzE4IEM1Ni4yODgsNDc1LjcyMyA3MC4zMzcsNDg0LjMzNyA4Ni45MDMsNDkwLjc3NSBDMTAyLjkyNyw0OTcuMDAyIDEyMS4yNCw1MDEuMjYxIDE0OC4wNTQsNTAyLjQ4NCBDMTc0LjkyNCw1MDMuNzEgMTgzLjUwMyw1MDQgMjUxLjkyMSw1MDQgQzMyMC4zMzgsNTA0IDMyOC45MTcsNTAzLjcxIDM1NS43ODcsNTAyLjQ4NCBDMzgyLjYwMSw1MDEuMjYxIDQwMC45MTQsNDk3LjAwMiA0MTYuOTM4LDQ5MC43NzUgQzQzMy41MDQsNDg0LjMzNyA0NDcuNTUzLDQ3NS43MjMgNDYxLjU1OSw0NjEuNzE4IEM0NzUuNTY0LDQ0Ny43MTIgNDg0LjE3OCw0MzMuNjYzIDQ5MC42MTYsNDE3LjA5NyBDNDk2Ljg0Myw0MDEuMDczIDUwMS4xMDIsMzgyLjc2IDUwMi4zMjUsMzU1Ljk0NiBDNTAzLjU1MSwzMjkuMDc2IDUwMy44NDEsMzIwLjQ5NyA1MDMuODQxLDI1Mi4wOCBDNTAzLjg0MSwxODMuNjYyIDUwMy41NTEsMTc1LjA4MyA1MDIuMzI1LDE0OC4yMTMgQzUwMS4xMDIsMTIxLjM5OSA0OTYuODQzLDEwMy4wODYgNDkwLjYxNiw4Ny4wNjIgQzQ4NC4xNzgsNzAuNDk2IDQ3NS41NjQsNTYuNDQ3IDQ2MS41NTksNDIuNDQxIEM0NDcuNTUzLDI4LjQzNiA0MzMuNTA0LDE5LjgyMiA0MTYuOTM4LDEzLjM4NSBDNDAwLjkxNCw3LjE1NyAzODIuNjAxLDIuODk4IDM1NS43ODcsMS42NzUgQzMyOC45MTcsMC40NDkgMzIwLjMzOCwwLjE1OSAyNTEuOTIxLDAuMTU5IFogTTI1MS45MjEsNDUuNTUgQzMxOS4xODYsNDUuNTUgMzI3LjE1NCw0NS44MDcgMzUzLjcxOCw0Ny4wMTkgQzM3OC4yOCw0OC4xMzkgMzkxLjYxOSw1Mi4yNDMgNDAwLjQ5Niw1NS42OTMgQzQxMi4yNTUsNjAuMjYzIDQyMC42NDcsNjUuNzIyIDQyOS40NjIsNzQuNTM4IEM0MzguMjc4LDgzLjM1MyA0NDMuNzM3LDkxLjc0NSA0NDguMzA3LDEwMy41MDQgQzQ1MS43NTcsMTEyLjM4MSA0NTUuODYxLDEyNS43MiA0NTYuOTgxLDE1MC4yODIgQzQ1OC4xOTMsMTc2Ljg0NiA0NTguNDUsMTg0LjgxNCA0NTguNDUsMjUyLjA4IEM0NTguNDUsMzE5LjM0NSA0NTguMTkzLDMyNy4zMTMgNDU2Ljk4MSwzNTMuODc3IEM0NTUuODYxLDM3OC40MzkgNDUxLjc1NywzOTEuNzc4IDQ0OC4zMDcsNDAwLjY1NSBDNDQzLjczNyw0MTIuNDE0IDQzOC4yNzgsNDIwLjgwNiA0MjkuNDYyLDQyOS42MjEgQzQyMC42NDcsNDM4LjQzNyA0MTIuMjU1LDQ0My44OTYgNDAwLjQ5Niw0NDguNDY2IEMzOTEuNjE5LDQ1MS45MTYgMzc4LjI4LDQ1Ni4wMiAzNTMuNzE4LDQ1Ny4xNCBDMzI3LjE1OCw0NTguMzUyIDMxOS4xOTEsNDU4LjYwOSAyNTEuOTIxLDQ1OC42MDkgQzE4NC42NSw0NTguNjA5IDE3Ni42ODQsNDU4LjM1MiAxNTAuMTIzLDQ1Ny4xNCBDMTI1LjU2MSw0NTYuMDIgMTEyLjIyMiw0NTEuOTE2IDEwMy4zNDUsNDQ4LjQ2NiBDOTEuNTg2LDQ0My44OTYgODMuMTk0LDQzOC40MzcgNzQuMzc5LDQyOS42MjEgQzY1LjU2NCw0MjAuODA2IDYwLjEwNCw0MTIuNDE0IDU1LjUzNCw0MDAuNjU1IEM1Mi4wODQsMzkxLjc3OCA0Ny45OCwzNzguNDM5IDQ2Ljg2LDM1My44NzcgQzQ1LjY0OCwzMjcuMzEzIDQ1LjM5MSwzMTkuMzQ1IDQ1LjM5MSwyNTIuMDggQzQ1LjM5MSwxODQuODE0IDQ1LjY0OCwxNzYuODQ2IDQ2Ljg2LDE1MC4yODIgQzQ3Ljk4LDEyNS43MiA1Mi4wODQsMTEyLjM4MSA1NS41MzQsMTAzLjUwNCBDNjAuMTA0LDkxLjc0NSA2NS41NjMsODMuMzUzIDc0LjM3OSw3NC41MzggQzgzLjE5NCw2NS43MjIgOTEuNTg2LDYwLjI2MyAxMDMuMzQ1LDU1LjY5MyBDMTEyLjIyMiw1Mi4yNDMgMTI1LjU2MSw0OC4xMzkgMTUwLjEyMyw0Ny4wMTkgQzE3Ni42ODcsNDUuODA3IDE4NC42NTUsNDUuNTUgMjUxLjkyMSw0NS41NSBaIiBpZD0iRmlsbC0xIiBmaWxsPSIjRkZGRkZGIiBtYXNrPSJ1cmwoI21hc2stMikiPjwvcGF0aD4gICAgICAgIDwvZz4gICAgICAgIDxwYXRoIGQ9Ik0yNTEuOTIxLDMzNi4wNTMgQzIwNS41NDMsMzM2LjA1MyAxNjcuOTQ3LDI5OC40NTcgMTY3Ljk0NywyNTIuMDggQzE2Ny45NDcsMjA1LjcwMiAyMDUuNTQzLDE2OC4xMDYgMjUxLjkyMSwxNjguMTA2IEMyOTguMjk4LDE2OC4xMDYgMzM1Ljg5NCwyMDUuNzAyIDMzNS44OTQsMjUyLjA4IEMzMzUuODk0LDI5OC40NTcgMjk4LjI5OCwzMzYuMDUzIDI1MS45MjEsMzM2LjA1MyBaIE0yNTEuOTIxLDEyMi43MTUgQzE4MC40NzQsMTIyLjcxNSAxMjIuNTU2LDE4MC42MzMgMTIyLjU1NiwyNTIuMDggQzEyMi41NTYsMzIzLjUyNiAxODAuNDc0LDM4MS40NDQgMjUxLjkyMSwzODEuNDQ0IEMzMjMuMzY3LDM4MS40NDQgMzgxLjI4NSwzMjMuNTI2IDM4MS4yODUsMjUyLjA4IEMzODEuMjg1LDE4MC42MzMgMzIzLjM2NywxMjIuNzE1IDI1MS45MjEsMTIyLjcxNSBaIiBpZD0iRmlsbC00IiBmaWxsPSIjRkZGRkZGIj48L3BhdGg+ICAgICAgICA8cGF0aCBkPSJNNDE2LjYyNywxMTcuNjA0IEM0MTYuNjI3LDEzNC4zIDQwMy4wOTIsMTQ3LjgzNCAzODYuMzk2LDE0Ny44MzQgQzM2OS43MDEsMTQ3LjgzNCAzNTYuMTY2LDEzNC4zIDM1Ni4xNjYsMTE3LjYwNCBDMzU2LjE2NiwxMDAuOTA4IDM2OS43MDEsODcuMzczIDM4Ni4zOTYsODcuMzczIEM0MDMuMDkyLDg3LjM3MyA0MTYuNjI3LDEwMC45MDggNDE2LjYyNywxMTcuNjA0IiBpZD0iRmlsbC01IiBmaWxsPSIjRkZGRkZGIj48L3BhdGg+ICAgIDwvZz48L3N2Zz4=");
    }

    & .ck-media__placeholder__url__text {
      color: #ffe0fe;

      &:hover {
        color: #fff;
      }
    }
  }

  &[data-oembed-url*="twitter.com"] .ck.ck-media__placeholder {
    background: linear-gradient(to right, #71c6f4, #0d70a5);

    & .ck-media__placeholder__icon {
      background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IldoaXRlIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDQwMCA0MDAiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDQwMCA0MDA7IiB4bWw6c3BhY2U9InByZXNlcnZlIj48c3R5bGUgdHlwZT0idGV4dC9jc3MiPi5zdDB7ZmlsbDojRkZGRkZGO308L3N0eWxlPjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik00MDAsMjAwYzAsMTEwLjUtODkuNSwyMDAtMjAwLDIwMFMwLDMxMC41LDAsMjAwUzg5LjUsMCwyMDAsMFM0MDAsODkuNSw0MDAsMjAweiBNMTYzLjQsMzA1LjVjODguNywwLDEzNy4yLTczLjUsMTM3LjItMTM3LjJjMC0yLjEsMC00LjItMC4xLTYuMmM5LjQtNi44LDE3LjYtMTUuMywyNC4xLTI1Yy04LjYsMy44LTE3LjksNi40LTI3LjcsNy42YzEwLTYsMTcuNi0xNS40LDIxLjItMjYuN2MtOS4zLDUuNS0xOS42LDkuNS0zMC42LDExLjdjLTguOC05LjQtMjEuMy0xNS4yLTM1LjItMTUuMmMtMjYuNiwwLTQ4LjIsMjEuNi00OC4yLDQ4LjJjMCwzLjgsMC40LDcuNSwxLjMsMTFjLTQwLjEtMi03NS42LTIxLjItOTkuNC01MC40Yy00LjEsNy4xLTYuNSwxNS40LTYuNSwyNC4yYzAsMTYuNyw4LjUsMzEuNSwyMS41LDQwLjFjLTcuOS0wLjItMTUuMy0yLjQtMjEuOC02YzAsMC4yLDAsMC40LDAsMC42YzAsMjMuNCwxNi42LDQyLjgsMzguNyw0Ny4zYy00LDEuMS04LjMsMS43LTEyLjcsMS43Yy0zLjEsMC02LjEtMC4zLTkuMS0wLjljNi4xLDE5LjIsMjMuOSwzMy4xLDQ1LDMzLjVjLTE2LjUsMTIuOS0zNy4zLDIwLjYtNTkuOSwyMC42Yy0zLjksMC03LjctMC4yLTExLjUtMC43QzExMC44LDI5Ny41LDEzNi4yLDMwNS41LDE2My40LDMwNS41Ii8+PC9zdmc+");
    }

    & .ck-media__placeholder__url__text {
      color: #b8e6ff;

      &:hover {
        color: #fff;
      }
    }
  }

  &[data-oembed-url*="twitter.com"], &[data-oembed-url*="google.com/maps"], &[data-oembed-url*="goo.gl/maps"], &[data-oembed-url*="maps.google.com"], &[data-oembed-url*="maps.app.goo.gl"], &[data-oembed-url*="facebook.com"], &[data-oembed-url*="instagram.com"] {
    & .ck-media__placeholder__icon * {
      display: none;
    }
  }
}

.ck-editor__editable:not(.ck-read-only) .ck-media__wrapper > :not(.ck-media__placeholder), .ck-editor__editable:not(.ck-read-only) .ck-widget:not(.ck-widget_selected) .ck-media__placeholder {
  pointer-events: none;
}

.ck .ck-widget.media:-webkit-drag > .ck-widget__resizer {
  display: none;
}

[dir="ltr"] .ck.ck-button.ck-button_with-text.ck-resize-media-embed-button .ck-button__icon {
  margin-right: var(--ck-spacing-standard, var(--ck-spacing-base));
}

[dir="rtl"] .ck.ck-button.ck-button_with-text.ck-resize-media-embed-button .ck-button__icon {
  margin-left: var(--ck-spacing-standard, var(--ck-spacing-base));
}

.ck.ck-dropdown .ck-button.ck-resize-media-embed-button .ck-button__label {
  width: 4em;
}

:root, :host {
  --ck-media-embed-custom-resize-form-width: 340px;
}

@media screen and (width <= 600px) {
  :root, :host {
    --ck-media-embed-custom-resize-form-width: 300px;
  }
}

.ck.ck-media-embed-custom-resize-form {
  &.ck-responsive-form {
    width: var(--ck-media-embed-custom-resize-form-width);
  }
}

:root, :host {
  --ck-media-form-width: var(--ck-width-dialog);
}

.ck.ck-media-form {
  width: var(--ck-media-form-width);
  padding: var(--ck-dialog-content-padding);
  flex-flow: row;
  align-items: flex-start;
  display: flex;

  & .ck-labeled-field-view {
    width: 100%;
    display: inline-block;
  }

  & .ck-label {
    display: none;
  }

  & .ck-input {
    width: 100%;
  }

  @media screen and (width <= 600px) {
    flex-wrap: wrap;

    & .ck-labeled-field-view {
      flex-basis: 100%;
    }

    & .ck-button {
      flex-basis: 50%;
    }
  }
}

.ck-content .media {
  clear: both;
  min-width: 15em;
  margin: .9em auto;
  display: block;
}

.ck-content .media:has( > div[data-oembed-url*="open.spotify.com"]) {
  width: 300px;
  min-width: 286px;
}

.ck-content .media.media_resized {
  box-sizing: border-box;
  max-width: 100%;
  display: block;

  & > div[data-oembed-url] {
    width: 100%;
  }
}

:root, :host {
  --ck-content-media-style-spacing: 1.5em;
}

.ck-content {
  & .media.media-style-align-left, & .media.media-style-align-right {
    clear: none;
    width: 100%;
  }

  & .media.media-style-align-left {
    float: left;
    margin-right: var(--ck-content-media-style-spacing);
  }

  & .media.media-style-align-right {
    float: right;
    margin-left: var(--ck-content-media-style-spacing);
  }

  & .media.media-style-block-align-left {
    margin-left: 0;
    margin-right: auto;
  }

  & .media.media-style-block-align-right {
    margin-left: auto;
    margin-right: 0;
  }
}

:root, :host {
  --ck-mention-list-max-height: 300px;
}

.ck.ck-mentions {
  max-height: var(--ck-mention-list-max-height);
  overscroll-behavior: contain;
  overflow: hidden auto;

  & > .ck-list__item {
    flex-shrink: 0;
    overflow: hidden;
  }

  & > .ck-list__item.ck-mentions__item_focused > .ck-button {
    border-color: var(--ck-button-focus-border-color);
    box-shadow: var(--ck-focus-outer-shadow, var(--ck-interactive-focus-shadow)), 0 0;
  }
}

div.ck.ck-balloon-panel.ck-mention-balloon {
  z-index: calc(var(--ck-z-dialog, var(--ck-z-modal)) + 1);
}

:root, :host {
  --ck-content-color-mention-background: #9900301a;
  --ck-content-color-mention-text: #990030;
}

.ck-content .mention {
  background: var(--ck-content-color-mention-background);
  color: var(--ck-content-color-mention-text);
}

:root, :host {
  --ck-color-minimap-tracker-background: 208, 0%, 51%;
  --ck-color-minimap-iframe-outline: #bfbfbf;
  --ck-color-minimap-iframe-shadow: #0000001c;
  --ck-color-minimap-progress-background: #666;
}

.ck.ck-minimap {
  -webkit-user-select: none;
  user-select: none;
  background: var(--ck-color-base-background);
  position: absolute;

  &, & iframe {
    width: 100%;
    height: 100%;
  }

  & iframe {
    pointer-events: none;
    outline: 1px solid var(--ck-color-minimap-iframe-outline);
    box-shadow: 0 2px 5px var(--ck-color-minimap-iframe-shadow);
    border: 0;
    margin: 0;
    position: relative;
  }

  & .ck.ck-minimap__position-tracker {
    background: hsla(var(--ck-color-minimap-tracker-background), .2);
    z-index: 1;
    width: 100%;
    transition: background .1s ease-in-out;
    position: absolute;
    top: 0;

    @media (prefers-reduced-motion: reduce) {
      transition: none;
    }

    &:hover {
      background: hsla(var(--ck-color-minimap-tracker-background), .3);
    }

    &.ck-minimap__position-tracker_dragging, &.ck-minimap__position-tracker_dragging:hover {
      background: hsla(var(--ck-color-minimap-tracker-background), .4);

      &:after {
        opacity: 1;
      }
    }

    &:after {
      content: attr(data-progress) "%";
      background: var(--ck-color-minimap-progress-background);
      color: var(--ck-color-base-background);
      border: 1px solid var(--ck-color-base-background);
      opacity: 0;
      border-radius: 3px;
      padding: 2px 4px;
      font-size: 10px;
      transition: opacity .1s ease-in-out;
      position: absolute;
      top: 5px;
      right: 5px;

      @media (prefers-reduced-motion: reduce) {
        transition: none;
      }
    }
  }
}

.ck-content .page-break {
  clear: both;
  justify-content: center;
  align-items: center;
  padding: 5px 0;
  display: flex;
  position: relative;

  &:after {
    content: "";
    border-bottom: 2px dashed #c4c4c4;
    width: 100%;
    position: absolute;
  }
}

.ck-content .page-break__label {
  z-index: 1;
  text-transform: uppercase;
  color: #333;
  -webkit-user-select: none;
  user-select: none;
  background: #fff;
  border: 1px solid #c4c4c4;
  border-radius: 2px;
  padding: .3em .6em;
  font-size: .75em;
  font-weight: bold;
  display: block;
  position: relative;
  box-shadow: 2px 2px 1px #00000026;
}

@media print {
  .ck-content .page-break {
    padding: 0;

    &:after {
      display: none;
    }
  }

  .ck-content :has( + .page-break) {
    margin-bottom: 0;
  }
}

:root, :host {
  --ck-color-restricted-editing-exception-background: #ffa94c33;
  --ck-color-restricted-editing-exception-hover-background: #ffa94c59;
  --ck-color-restricted-editing-exception-brackets: #cc690066;
  --ck-color-restricted-editing-selected-exception-background: #ffa94c80;
  --ck-color-restricted-editing-selected-exception-brackets: #cc690099;
}

.ck-editor__editable .restricted-editing-exception {
  background-color: var(--ck-color-restricted-editing-exception-background);
  border: 1px solid;
  border-image: linear-gradient(to right,
		var(--ck-color-restricted-editing-exception-brackets) 0%,
		var(--ck-color-restricted-editing-exception-brackets) 5px,
		#0000 6px,
		#0000 calc(100% - 6px),
		var(--ck-color-restricted-editing-exception-brackets) calc(100% - 5px),
		var(--ck-color-restricted-editing-exception-brackets) 100%) 1;
  transition: background .2s ease-in-out;

  @media (prefers-reduced-motion: reduce) {
    transition: none;
  }

  &.restricted-editing-exception_selected {
    background-color: var(--ck-color-restricted-editing-selected-exception-background);
    border-image: linear-gradient(to right,
			var(--ck-color-restricted-editing-selected-exception-brackets) 0%,
			var(--ck-color-restricted-editing-selected-exception-brackets) 5px,
			var(--ck-color-restricted-editing-selected-exception-brackets) calc(100% - 5px),
			var(--ck-color-restricted-editing-selected-exception-brackets) 100%) 1;
  }

  &.restricted-editing-exception_collapsed {
    padding-left: 1ch;
  }
}

.ck-restricted-editing_mode_restricted {
  cursor: default;

  & * {
    cursor: default;
  }

  & .restricted-editing-exception {
    cursor: text;

    & * {
      cursor: text;
    }

    &:hover {
      background: var(--ck-color-restricted-editing-exception-hover-background);
    }
  }
}

:root, :host {
  --ck-show-blocks-border-color: var(--ck-color-base-text-light);
}

.ck.ck-editor__editable.ck-editor__editable_inline.ck-show-blocks:not(.ck-widget) {
  & address {
    --ck-show-blocks-label-ltr: var(--ck-show-blocks-label-address-ltr);
    --ck-show-blocks-label-rtl: var(--ck-show-blocks-label-address-rtl);
  }

  & aside {
    --ck-show-blocks-label-ltr: var(--ck-show-blocks-label-aside-ltr);
    --ck-show-blocks-label-rtl: var(--ck-show-blocks-label-aside-rtl);
  }

  & blockquote {
    --ck-show-blocks-label-ltr: var(--ck-show-blocks-label-blockquote-ltr);
    --ck-show-blocks-label-rtl: var(--ck-show-blocks-label-blockquote-rtl);
  }

  & details {
    --ck-show-blocks-label-ltr: var(--ck-show-blocks-label-details-ltr);
    --ck-show-blocks-label-rtl: var(--ck-show-blocks-label-details-rtl);
  }

  & div:not(.ck-widget, .ck-widget *) {
    --ck-show-blocks-label-ltr: var(--ck-show-blocks-label-div-ltr);
    --ck-show-blocks-label-rtl: var(--ck-show-blocks-label-div-rtl);
  }

  & footer {
    --ck-show-blocks-label-ltr: var(--ck-show-blocks-label-footer-ltr);
    --ck-show-blocks-label-rtl: var(--ck-show-blocks-label-footer-rtl);
  }

  & h1 {
    --ck-show-blocks-label-ltr: var(--ck-show-blocks-label-h1-ltr);
    --ck-show-blocks-label-rtl: var(--ck-show-blocks-label-h1-rtl);
  }

  & h2 {
    --ck-show-blocks-label-ltr: var(--ck-show-blocks-label-h2-ltr);
    --ck-show-blocks-label-rtl: var(--ck-show-blocks-label-h2-rtl);
  }

  & h3 {
    --ck-show-blocks-label-ltr: var(--ck-show-blocks-label-h3-ltr);
    --ck-show-blocks-label-rtl: var(--ck-show-blocks-label-h3-rtl);
  }

  & h4 {
    --ck-show-blocks-label-ltr: var(--ck-show-blocks-label-h4-ltr);
    --ck-show-blocks-label-rtl: var(--ck-show-blocks-label-h4-rtl);
  }

  & h5 {
    --ck-show-blocks-label-ltr: var(--ck-show-blocks-label-h5-ltr);
    --ck-show-blocks-label-rtl: var(--ck-show-blocks-label-h5-rtl);
  }

  & h6 {
    --ck-show-blocks-label-ltr: var(--ck-show-blocks-label-h6-ltr);
    --ck-show-blocks-label-rtl: var(--ck-show-blocks-label-h6-rtl);
  }

  & header {
    --ck-show-blocks-label-ltr: var(--ck-show-blocks-label-header-ltr);
    --ck-show-blocks-label-rtl: var(--ck-show-blocks-label-header-rtl);
  }

  & main {
    --ck-show-blocks-label-ltr: var(--ck-show-blocks-label-main-ltr);
    --ck-show-blocks-label-rtl: var(--ck-show-blocks-label-main-rtl);
  }

  & nav {
    --ck-show-blocks-label-ltr: var(--ck-show-blocks-label-nav-ltr);
    --ck-show-blocks-label-rtl: var(--ck-show-blocks-label-nav-rtl);
  }

  & pre {
    --ck-show-blocks-label-ltr: var(--ck-show-blocks-label-pre-ltr);
    --ck-show-blocks-label-rtl: var(--ck-show-blocks-label-pre-rtl);
  }

  & ol {
    --ck-show-blocks-label-ltr: var(--ck-show-blocks-label-ol-ltr);
    --ck-show-blocks-label-rtl: var(--ck-show-blocks-label-ol-rtl);
  }

  & ul {
    --ck-show-blocks-label-ltr: var(--ck-show-blocks-label-ul-ltr);
    --ck-show-blocks-label-rtl: var(--ck-show-blocks-label-ul-rtl);
  }

  & p {
    --ck-show-blocks-label-ltr: var(--ck-show-blocks-label-p-ltr);
    --ck-show-blocks-label-rtl: var(--ck-show-blocks-label-p-rtl);
  }

  & section {
    --ck-show-blocks-label-ltr: var(--ck-show-blocks-label-section-ltr);
    --ck-show-blocks-label-rtl: var(--ck-show-blocks-label-section-rtl);
  }

  & :where(figure.image, figure.table) figcaption {
    --ck-show-blocks-label-ltr: var(--ck-show-blocks-label-figcaption-ltr);
    --ck-show-blocks-label-rtl: var(--ck-show-blocks-label-figcaption-rtl);
  }

  & :where(address, aside, blockquote, details, div:not(.ck-widget, .ck-widget *), footer, h1, h2, h3, h4, h5, h6, header, main, nav, pre, ol, ul, p, section, :where(figure.image, figure.table) figcaption) {
    background-repeat: no-repeat;
    padding-top: 15px;
  }

  & :where(address, aside, blockquote, details, div:not(.ck-widget, .ck-widget *), footer, h1, h2, h3, h4, h5, h6, header, main, nav, pre, ol, ul, p, section, :where(figure.image, figure.table) figcaption):where(:not(.ck-widget_selected):not(.ck-widget:hover)) {
    outline: 1px dashed var(--ck-show-blocks-border-color);
  }

  &:dir(ltr) :where(address, aside, blockquote, details, div:not(.ck-widget, .ck-widget *), footer, h1, h2, h3, h4, h5, h6, header, main, nav, pre, ol, ul, p, section, :where(figure.image, figure.table) figcaption) {
    background-image: var(--ck-show-blocks-label-ltr);
    background-position: 1px 1px;
  }

  &:dir(rtl) :where(address, aside, blockquote, details, div:not(.ck-widget, .ck-widget *), footer, h1, h2, h3, h4, h5, h6, header, main, nav, pre, ol, ul, p, section, :where(figure.image, figure.table) figcaption) {
    background-image: var(--ck-show-blocks-label-rtl);
    background-position: calc(100% - 1px) 1px;
  }
}

:root, :host {
  --ck-source-editing-area-border-radius: var(--ck-radius-md);
  --ck-source-editing-area-font-size: var(--ck-font-size-md);
}

.ck-source-editing-area {
  position: relative;
  overflow: hidden;
}

.ck-source-editing-area:after, .ck-source-editing-area textarea {
  padding: var(--ck-spacing-large, var(--ck-spacing-lg));
  line-height: var(--ck-line-height-base);
  font-size: var(--ck-source-editing-area-font-size);
  white-space: pre-wrap;
  border: 1px solid #0000;
  margin: 0;
  font-family: monospace;
}

.ck-source-editing-area:after {
  content: attr(data-value) " ";
  visibility: hidden;
  display: block;
}

.ck-source-editing-area textarea {
  resize: none;
  box-sizing: border-box;
  border-color: var(--ck-color-base-border);
  border-radius: var(--ck-rounded-corners-radius, var(--ck-radius-corners));
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  outline: none;
  width: 100%;
  height: 100%;
  position: absolute;
  overflow: hidden;

  &:not([readonly]):focus {
    border: var(--ck-focus-ring, var(--ck-interactive-focus-ring));
    box-shadow: var(--ck-inner-shadow, var(--ck-inset-shadow-sm)), 0 0;
    outline: none;
  }
}

.ck.ck-special-characters-navigation {
  & > .ck-label {
    text-overflow: ellipsis;
    max-width: 160px;
    overflow: hidden;
  }

  & > .ck-dropdown .ck-dropdown__panel {
    max-height: 250px;
    overflow: hidden auto;
  }

  @media screen and (width <= 600px) {
    max-width: 190px;

    & > .ck-form__header__label {
      text-overflow: ellipsis;
      overflow: hidden;
    }
  }
}

.ck.ck-special-characters {
  & > .ck-dialog__content > div {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    grid-template-rows: auto 1fr auto;
    grid-template-columns: 1fr;
    width: 350px;
    max-width: 100%;
    height: 100%;
    display: grid;

    & > .ck-character-categories {
      padding: var(--ck-dialog-actions-padding);
      grid-area: 1 / 1 / 2 / 2;

      & > .ck-labeled-field-view {
        padding-top: var(--ck-spacing-standard, var(--ck-spacing-base));
        width: 100%;

        & .ck.ck-labeled-field-view__status {
          background: var(--ck-color-base-error);
          color: var(--ck-color-base-background);
          padding: var(--ck-spacing-small, var(--ck-spacing-sm)) var(--ck-spacing-medium, var(--ck-spacing-base));
          min-width: var(--ck-table-properties-min-error-width);
          text-align: center;
          animation: .15s both ck-table-form-labeled-view-status-appear;

          &:after {
            border-color: transparent transparent var(--ck-color-base-error) transparent;
            border-width: 0 var(--ck-table-properties-error-arrow-size) var(--ck-table-properties-error-arrow-size) var(--ck-table-properties-error-arrow-size);
            border-style: solid;
          }

          @media (prefers-reduced-motion: reduce) {
            animation: none;
          }
        }

        & .ck-input.ck-error:not(:focus) + .ck.ck-labeled-field-view__status {
          display: none;
        }

        & > .ck-label {
          font-size: var(--ck-font-size-tiny, var(--ck-font-size-xs));
          text-align: center;
        }
      }

      & .ck-dropdown {
        width: 100%;
        display: block;

        & > button {
          &:not(:focus) {
            border: 1px solid var(--ck-color-base-border);
          }

          & > span {
            width: 100%;
          }
        }
      }
    }

    & > .ck-character-grid {
      grid-area: 2 / 1 / 3 / 2;
      max-height: 200px;
    }

    & > .ck-character-info {
      grid-area: 3 / 1 / 4 / 2;
    }
  }
}

:root, :host {
  --ck-character-grid-tile-size: 24px;
}

.ck.ck-character-grid {
  overflow: hidden auto;

  & .ck-character-grid__tiles {
    grid-template-columns: repeat(auto-fill, minmax(var(--ck-character-grid-tile-size), 1fr));
    margin: var(--ck-dialog-actions-padding);
    grid-gap: var(--ck-spacing-standard, var(--ck-spacing-base));
    display: grid;
  }

  & .ck-character-grid__tile {
    width: var(--ck-character-grid-tile-size);
    height: var(--ck-character-grid-tile-size);
    min-width: var(--ck-character-grid-tile-size);
    min-height: var(--ck-character-grid-tile-size);
    border: 0;
    padding: 0;
    font-size: 1.25em;
    transition: box-shadow .2s;

    @media (prefers-reduced-motion: reduce) {
      transition: none;
    }

    &:focus:not(.ck-disabled), &:hover:not(.ck-disabled) {
      box-shadow: inset 0 0 0 1px var(--ck-color-base-background), 0 0 0 2px var(--ck-color-focus-border);
      border: 0;
    }

    & .ck-button__label {
      line-height: var(--ck-character-grid-tile-size);
      text-align: center;
      width: 100%;
    }
  }

  max-width: 100%;
}

.ck.ck-character-info {
  padding: var(--ck-dialog-actions-padding);
  border-top: 1px solid var(--ck-color-base-border);
  display: flex;
  overflow: hidden;

  & > * {
    text-transform: uppercase;
    font-size: var(--ck-font-size-small, var(--ck-font-size-sm));
  }

  & .ck-character-info__name {
    text-overflow: ellipsis;
    max-width: 275px;
    overflow: hidden;
  }

  & .ck-character-info__code {
    opacity: .6;
  }

  justify-content: space-between;
}

.ck.ck-dropdown.ck-style-dropdown.ck-style-dropdown_multiple-active > .ck-button > .ck-button__label {
  font-style: italic;
}

:root, :host {
  --ck-style-panel-button-width: 120px;
  --ck-style-panel-button-height: 80px;
  --ck-style-panel-button-label-background: var(--ck-color-base-hover);
  --ck-style-panel-button-hover-label-background: #ebebeb;
  --ck-style-panel-button-hover-border-color: #b3b3b3;
  --ck-style-panel-columns: 3;
}

.ck.ck-style-panel .ck-style-grid {
  row-gap: var(--ck-spacing-large, var(--ck-spacing-lg));
  column-gap: var(--ck-spacing-large, var(--ck-spacing-lg));
  grid-template-columns: repeat(var(--ck-style-panel-columns),auto);
  display: grid;

  & .ck-style-grid__button {
    --ck-color-button-default-hover-background: var(--ck-color-base-background);
    --ck-color-button-default-active-background: var(--ck-color-base-background);
    width: var(--ck-style-panel-button-width);
    height: var(--ck-style-panel-button-height);
    justify-content: space-between;
    padding: 0;
    display: flex;

    &:not(:focus) {
      border: 1px solid var(--ck-color-base-border);
    }

    & .ck-button__label {
      width: 100%;
      height: 22px;
      padding: 0 var(--ck-spacing-medium, var(--ck-spacing-base));
      text-overflow: ellipsis;
      flex-shrink: 0;
      line-height: 22px;
      overflow: hidden;
    }

    & .ck-style-grid__button__preview {
      opacity: .9;
      width: 100%;
      padding: var(--ck-spacing-medium, var(--ck-spacing-base));
      background: var(--ck-color-base-background);
      border: 2px solid var(--ck-color-base-background);
      box-sizing: border-box;
      flex-grow: 1;
      flex-basis: 100%;
      place-content: center flex-start;
      align-items: center;
      display: flex;
      overflow: hidden;
    }

    &.ck-disabled {
      --ck-color-button-default-disabled-background: var(--ck-color-base-foreground);

      &:not(:focus) {
        border-color: var(--ck-style-panel-button-label-background);
      }

      & .ck-style-grid__button__preview {
        opacity: .4;
        border-color: var(--ck-color-base-foreground);
        filter: saturate(.3);
      }
    }

    &.ck-on {
      border-color: var(--ck-color-base-active);

      & .ck-button__label {
        box-shadow: 0 -1px 0 var(--ck-color-base-active);
        z-index: 1;
      }

      &:hover {
        border-color: var(--ck-color-base-active-focus);
      }
    }

    &:not(.ck-on) {
      & .ck-button__label {
        background: var(--ck-style-panel-button-label-background);
      }

      &:hover .ck-button__label {
        background: var(--ck-style-panel-button-hover-label-background);
      }
    }

    &:hover:not(.ck-disabled):not(.ck-on) {
      border-color: var(--ck-style-panel-button-hover-border-color);

      & .ck-style-grid__button__preview {
        opacity: 1;
      }
    }

    flex-direction: column;
  }

  justify-content: start;
}

.ck.ck-style-panel .ck-style-panel__style-group {
  & > .ck-label {
    margin: var(--ck-spacing-large, var(--ck-spacing-lg)) 0;
  }

  &:first-child {
    & > .ck-label {
      margin-top: 0;
    }
  }
}

:root, :host {
  --ck-style-panel-max-height: 470px;
}

.ck.ck-style-panel {
  padding: var(--ck-spacing-large, var(--ck-spacing-lg));
  max-height: var(--ck-style-panel-max-height);
  overflow-y: auto;
}

.ck-editor__editable .ck-table-bogus-paragraph {
  width: 100%;
  display: inline-block;
}

:root, :host {
  --ck-color-table-focused-cell-background: #9ec9fa4d;
  --ck-table-content-default-border-color: #d4d4d4;
  --ck-table-border-none-helper-line-color: #d4d4d4;
  --ck-table-border-none-helper-line-style: dashed;
  --ck-table-border-none-helper-line-width: var(--ck-border-width-thin);
}

.ck-widget.table {
  & table[style*="border:none"], & table[style*="border-style:none"], & table[style*="border:0"], & table[style*="border-width:0"] {
    outline: var(--ck-table-content-default-border-color) 1px dashed;
  }

  & td, & th {
    &.ck-editor__nested-editable {
      outline: unset;

      &:not(.ck-editor__editable_selected) {
        &.ck-editor__nested-editable_focused, &:focus {
          background: var(--ck-color-table-focused-cell-background);
          outline: 1px solid var(--ck-color-focus-border, var(--ck-color-interactive-focus-border));
          outline-offset: -1px;
        }
      }
    }
  }
}

:where(.ck.ck-editor__editable.ck-table-show-hidden-borders .ck-widget.table) {
  --ck-table-border-none-helper-line: var(--ck-table-border-none-helper-line-width)
		var(--ck-table-border-none-helper-line-style)
		var(--ck-table-border-none-helper-line-color);

  & :where(td, th):where([style*="border:none"], [style*="border:0"], [style*="border-style:none"], [style*="border-width:0"]) {
    border: var(--ck-table-border-none-helper-line) !important;
  }

  & :where(table, td, th) {
    &:where([style*="border-top-style:none"], [style*="border-top-width:0"]) {
      border-top: var(--ck-table-border-none-helper-line) !important;
    }

    &:where([style*="border-right-style:none"], [style*="border-right-width:0"]) {
      border-right: var(--ck-table-border-none-helper-line) !important;
    }

    &:where([style*="border-bottom-style:none"], [style*="border-bottom-width:0"]) {
      border-bottom: var(--ck-table-border-none-helper-line) !important;
    }

    &:where([style*="border-left-style:none"], [style*="border-left-width:0"]) {
      border-left: var(--ck-table-border-none-helper-line) !important;
    }
  }
}

:root, :host {
  --ck-table-cell-properties-width: var(--ck-width-balloon-form);
}

.ck.ck-table-cell-properties-form {
  width: var(--ck-table-cell-properties-width);

  & .ck-form__row {
    &.ck-table-cell-properties-form__padding-row {
      --ck-table-cell-properties-padding-width: calc((100% - 2 * var(--ck-spacing-large, var(--ck-spacing-lg))) / 3);
      width: var(--ck-table-cell-properties-padding-width);
      max-width: var(--ck-table-cell-properties-padding-width);
      min-width: var(--ck-table-cell-properties-padding-width);
      align-self: flex-end;
      padding: 0;
    }

    &.ck-table-cell-properties-form__alignment-row {
      & .ck.ck-toolbar {
        margin-top: var(--ck-spacing-standard, var(--ck-spacing-base));
        background: none;

        &.ck-table-cell-properties-form__horizontal-alignment-toolbar {
          --ck-table-cell-properties-horizontal-alignment-width: calc((100% - 2 * var(--ck-spacing-large, var(--ck-spacing-lg))) / 3 * 2 + var(--ck-spacing-large, var(--ck-spacing-lg)));
          width: var(--ck-table-cell-properties-horizontal-alignment-width);
          max-width: var(--ck-table-cell-properties-horizontal-alignment-width);
          min-width: var(--ck-table-cell-properties-horizontal-alignment-width);
          padding: 0;
        }

        &.ck-table-cell-properties-form__vertical-alignment-toolbar, & .ck-button {
          flex-grow: 1;
        }
      }

      flex-wrap: wrap;
    }

    &.ck-form__row.ck-table-form__action-row {
      & > .ck.ck-button {
        flex-grow: initial;

        & .ck-button__label {
          color: currentColor;
        }
      }
    }

    &.ck-table-form__cell-type-row {
      --ck-table-form-cell-type-width: calc((100% - 2 * var(--ck-spacing-large, var(--ck-spacing-lg))) / 3 * 2 + var(--ck-spacing-large, var(--ck-spacing-lg)));
      width: var(--ck-table-form-cell-type-width);
      max-width: var(--ck-table-form-cell-type-width);
      min-width: var(--ck-table-form-cell-type-width);
      padding: 0;

      & .ck-dropdown {
        width: 100%;
      }
    }
  }
}

:root, :host {
  --ck-table-layout-widget-type-around-button-size: 16px;
  --ck-table-layout-widget-type-around-icon-width: 10px;
  --ck-table-layout-widget-type-around-icon-height: 8px;
  --ck-table-layout-widget-handler-icon-size: 10px;
  --ck-table-layout-default-border-color: #d4d4d4;
}

.ck-editor__editable {
  & .table.layout-table {
    & > table {
      border-collapse: revert;
      width: 100%;
      height: 100%;

      &:not([style*="border:"], [style*="border-top"], [style*="border-bottom"], [style*="border-left"], [style*="border-right"], [style*="border-width"], [style*="border-style"], [style*="border-color"]) {
        border-width: 0;
        border-color: #0000;
        outline: none;
      }
    }

    & > table > tbody > tr > td {
      box-shadow: revert;
      padding: revert;
      text-indent: 1px;
      border-color: var(--ck-table-layout-default-border-color);
      border-style: dashed;
      min-width: 2em;

      &[style^="width:"], &[style*=" width:"], &[style*=";width:"] {
        min-width: auto;
      }

      &:focus {
        background-color: #0000;
      }

      &:not([style*="border:"], [style*="border-top"], [style*="border-bottom"], [style*="border-left"], [style*="border-right"], [style*="border-width"], [style*="border-style"], [style*="border-color"]) {
        outline: var(--ck-table-layout-default-border-color) 1px dashed;
        outline-offset: -1px;
        border-width: 0;
        border-color: #0000;

        &:focus {
          outline: var(--ck-color-focus-border, var(--ck-color-interactive-focus-border)) 1px solid;
        }
      }

      & > .ck-table-bogus-paragraph {
        text-indent: 0;
        width: calc(100% - 1px);
      }
    }

    &.ck-widget {
      & > .ck-widget__type-around {
        --ck-widget-type-around-button-size: var(--ck-table-layout-widget-type-around-button-size);

        & > .ck-widget__type-around__button {
          &.ck-widget__type-around__button_before, &.ck-widget__type-around__button_after {
            z-index: 2;
            transform: translateY(0);
          }

          &.ck-widget__type-around__button_before {
            margin-left: var(--ck-table-layout-widget-type-around-button-size);
            border-radius: 0 0 100px 100px;
            left: min(10%, 30px);

            &:after {
              border-radius: 0 0 100px 100px;
            }
          }

          &.ck-widget__type-around__button_after {
            border-radius: 100px 100px 0 0;

            &:after {
              border-radius: 100px 100px 0 0;
            }
          }

          & svg {
            width: var(--ck-table-layout-widget-type-around-icon-width);
            height: var(--ck-table-layout-widget-type-around-icon-height);
          }
        }
      }

      &.ck-widget_with-selection-handle {
        & > .ck-widget__selection-handle {
          --ck-widget-handler-icon-size: var(--ck-table-layout-widget-handler-icon-size);
          transform: translateY(calc(0px - var(--ck-widget-outline-thickness)));
          z-index: 3;
        }
      }

      &.ck-widget_type-around_show-fake-caret_before {
        & > .ck-widget__type-around {
          & > .ck-widget__type-around__fake-caret {
            top: 0;
          }
        }
      }

      &.ck-widget_type-around_show-fake-caret_after {
        & > .ck-widget__type-around {
          & > .ck-widget__type-around__fake-caret {
            bottom: 0;
          }
        }
      }

      &:hover {
        z-index: var(--ck-z-default, var(--ck-z-base));
      }

      &:hover > .ck-widget__selection-handle {
        opacity: .75;
        visibility: visible;

        &:hover {
          opacity: 1;
        }
      }

      &:has(.ck-widget.table:hover) > .ck-widget__selection-handle {
        opacity: 0;
        visibility: hidden;
      }

      &.ck-widget_selected {
        z-index: var(--ck-z-default, var(--ck-z-base));
      }
    }

    margin: 0;
    display: table;
  }

  &.ck-editor__editable_inline {
    & > .ck-widget.ck-widget_with-selection-handle.layout-table {
      &:first-child {
        margin-top: var(--ck-spacing-large, var(--ck-spacing-lg));
      }

      &:last-child, &:nth-last-child(2):has( + .ck-fake-selection-container) {
        margin-bottom: var(--ck-spacing-large, var(--ck-spacing-lg));
      }
    }
  }
}

:root, :host {
  --ck-table-scroll-widget-type-around-icon-width: 10px;
  --ck-table-scroll-widget-type-around-icon-height: 8px;
}

.ck.ck-editor__editable figure.table.ck-table-overflowing {
  flex-direction: column;
  max-width: 100%;
  margin-right: 0;
  display: flex;
  overflow: scroll clip;

  & > figcaption {
    box-sizing: border-box;
    order: -1;
    align-self: flex-start;
  }
}

.ck.ck-editor__editable figure.table.ck-table-overflowing.ck-widget {
  --ck-table-scroll-offset: 0px;

  & > table > :is(tbody, thead, tfoot) > tr > :is(td, th):last-of-type {
    --ck-table-column-resizer-position-offset: 0;
    --ck-table-column-resizer-width: 3.5px;
  }

  &.ck-widget_with-selection-handle > .ck-widget__selection-handle {
    --ck-widget-handler-icon-size: 10px;
    transform: translate(var(--ck-table-scroll-offset), calc(0px - var(--ck-widget-outline-thickness)));
    z-index: 3;
  }

  & > .ck-widget__type-around {
    --ck-widget-type-around-button-size: 16px;
    pointer-events: none;
    position: absolute;
    inset: 0;

    & > .ck-widget__type-around__button {
      &.ck-widget__type-around__button_before, &.ck-widget__type-around__button_after {
        transform: translate(var(--ck-table-scroll-offset), 0);
        z-index: 2;
      }

      &.ck-widget__type-around__button_before {
        margin-left: var(--ck-widget-type-around-button-size);
        border-radius: 0 0 100px 100px;
        left: min(10%, 30px);

        &:after {
          border-radius: 0 0 100px 100px;
        }
      }

      &.ck-widget__type-around__button_after {
        bottom: calc(-.5 * var(--ck-widget-outline-thickness));
        border-radius: 100px 100px 0 0;
        right: min(10%, 30px);

        &:after {
          border-radius: 100px 100px 0 0;
        }
      }

      & svg {
        width: var(--ck-table-scroll-widget-type-around-icon-width);
        height: var(--ck-table-scroll-widget-type-around-icon-height);
      }
    }
  }

  &.ck-widget_type-around_show-fake-caret_before {
    & > .ck-widget__type-around > .ck-widget__type-around__fake-caret {
      top: 0;
    }
  }

  &.ck-widget_type-around_show-fake-caret_after {
    & > .ck-widget__type-around > .ck-widget__type-around__fake-caret {
      bottom: 0;
    }
  }
}

.ck.ck-form__row {
  & > :not(.ck-label) {
    & + * {
      margin-inline-start: var(--ck-spacing-large, var(--ck-spacing-lg));
    }
  }

  & > .ck-label {
    width: 100%;
    min-width: 100%;
  }

  &.ck-table-form__action-row {
    justify-content: flex-end;

    & .ck-button-save, & .ck-button-cancel {
      justify-content: center;
    }
  }
}

:root, :host {
  --ck-table-properties-error-arrow-size: 6px;
  --ck-table-properties-min-error-width: 150px;
}

.ck.ck-table-form {
  --ck-table-form-default-input-width: 80px;

  & .ck-form__row {
    &.ck-table-form__border-row {
      & .ck-table-form__border-style, & .ck-table-form__border-width, & .ck-table-form__border-color {
        width: calc((100% - 2 * var(--ck-spacing-large, var(--ck-spacing-lg))) / 3);
        flex: none;
        min-width: 0;
      }

      & .ck-table-form__border-style .ck-dropdown {
        width: 100%;
      }
    }

    &.ck-table-form__dimensions-row {
      --ck-table-form-dimensions-input-width: calc((100% - 2 * var(--ck-spacing-large, var(--ck-spacing-lg))) / 3 * 2 + var(--ck-spacing-large, var(--ck-spacing-lg)));
      width: var(--ck-table-form-dimensions-input-width);
      max-width: var(--ck-table-form-dimensions-input-width);
      min-width: var(--ck-table-form-dimensions-input-width);
      padding: 0;

      & .ck-table-form__dimensions-row__width, & .ck-table-form__dimensions-row__height {
        flex: 1 1 0;
        margin: 0;
      }

      & .ck-table-form__dimension-operator {
        width: 0;
        height: var(--ck-size-control-min-height);
        line-height: var(--ck-size-control-min-height);
        margin: 0 calc(var(--ck-spacing-large, var(--ck-spacing-lg)) / 2);
        align-self: flex-end;
        display: inline-block;
        position: relative;
        left: -.5ch;
        overflow: visible;
      }
    }

    &.ck-table-form__background-row {
      --ck-table-form-background-width: calc((100% - 2 * var(--ck-spacing-large, var(--ck-spacing-lg))) / 3);
      width: var(--ck-table-form-background-width);
      max-width: var(--ck-table-form-background-width);
      min-width: var(--ck-table-form-background-width);
    }

    &.ck-table-form__border-row, &.ck-table-form__background-row, &.ck-table-form__cell-type-row {
      flex-wrap: wrap;
    }

    &.ck-table-form__dimensions-row, &.ck-table-form__cell-type-row {
      flex-wrap: wrap;
      align-items: center;

      & .ck-labeled-field-view {
        flex-direction: column-reverse;
        align-items: center;
        display: flex;

        & .ck.ck-dropdown {
          flex-grow: 0;
        }
      }
    }

    &:not(.ck-table-form__action-row) > :not(.ck-label, .ck-table-form__dimension-operator) {
      flex-grow: 1;
    }
  }

  & .ck.ck-labeled-field-view {
    padding-top: var(--ck-spacing-standard, var(--ck-spacing-base));

    & .ck.ck-labeled-field-view__status {
      border-radius: var(--ck-rounded-corners-radius, var(--ck-radius-corners));
      background: var(--ck-color-base-error);
      color: var(--ck-color-base-background);
      padding: var(--ck-spacing-small, var(--ck-spacing-sm)) var(--ck-spacing-medium, var(--ck-spacing-base));
      min-width: var(--ck-table-properties-min-error-width);
      text-align: center;
      left: 50%;
      bottom: calc(-1 * var(--ck-table-properties-error-arrow-size));
      animation: .15s both ck-table-form-labeled-view-status-appear;
      position: absolute;
      transform: translate(-50%, 100%);

      &:after {
        border-color: transparent transparent var(--ck-color-base-error) transparent;
        border-width: 0 var(--ck-table-properties-error-arrow-size) var(--ck-table-properties-error-arrow-size) var(--ck-table-properties-error-arrow-size);
        content: "";
        top: calc(-1 * var(--ck-table-properties-error-arrow-size));
        border-style: solid;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
      }

      @media (prefers-reduced-motion: reduce) {
        animation: none;
      }

      z-index: 1;
    }

    & .ck-input.ck-error:not(:focus) + .ck.ck-labeled-field-view__status {
      display: none;
    }

    position: relative;
  }
}

@keyframes ck-table-form-labeled-view-status-appear {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

:root, :host {
  --ck-table-properties-width: var(--ck-width-balloon-form);
}

.ck.ck-table-properties-form {
  width: var(--ck-table-properties-width);

  & .ck-form__row {
    &.ck-table-properties-form__alignment-row {
      flex-wrap: wrap;
      flex-basis: 0;
      align-content: baseline;
      align-self: flex-end;

      & .ck.ck-toolbar {
        margin-top: var(--ck-spacing-standard, var(--ck-spacing-base));
        background: none;

        & .ck-toolbar__items > * {
          flex: 1;
        }
      }

      & .ck.ck-toolbar .ck-toolbar__items {
        flex-wrap: nowrap;
      }
    }
  }
}

:root, :host {
  --ck-content-table-style-spacing: 1.5em;
}

.ck-editor__editable {
  & .table.layout-table {
    &.table-style-align-center {
      margin-left: auto;
      margin-right: auto;
    }

    &.table-style-align-left {
      margin-right: var(--ck-content-table-style-spacing);
    }

    &.table-style-align-right {
      margin-left: var(--ck-content-table-style-spacing);
    }

    &.table-style-block-align-left {
      margin-left: 0;
      margin-right: auto;
    }

    &.table-style-block-align-right {
      margin-left: auto;
      margin-right: 0;
    }
  }
}

:root, :host {
  --ck-content-color-table-caption-background: #f7f7f7;
  --ck-color-table-caption-highlighted-background: #fd0;
}

.ck.ck-editor__editable .table > figcaption, .ck.ck-editor__editable figure.table > table > caption {
  @media (forced-colors: none) {
    &.table__caption_highlighted {
      animation: .6s ease-out ck-table-caption-highlight;
    }
  }

  &.ck-placeholder:before {
    padding-left: inherit;
    padding-right: inherit;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }
}

@keyframes ck-table-caption-highlight {
  0% {
    background-color: var(--ck-color-table-caption-highlighted-background);
  }

  100% {
    background-color: var(--ck-content-color-table-caption-background);
  }
}

:root, :host {
  --ck-table-selected-cell-background: #9ecffa4d;
}

.ck.ck-editor__editable .table table {
  & :where(td, th).ck-editor__editable_selected {
    caret-color: #0000;
    box-shadow: unset;
    position: relative;

    &:after {
      content: "";
      pointer-events: none;
      background-color: var(--ck-table-selected-cell-background);
      position: absolute;
      inset: 0;
    }

    &:focus, & ::selection {
      background-color: #0000;
    }

    & .ck-widget {
      outline: unset;

      & > .ck-widget__selection-handle {
        display: none;
      }
    }
  }
}

:root, :host {
  --ck-color-table-column-resizer-hover: var(--ck-color-base-active);
  --ck-table-column-resizer-width: 7px;
  --ck-table-column-resizer-position-offset: calc(var(--ck-table-column-resizer-width) * -.5 - .5px);
}

.ck.ck-editor__editable .table td, .ck.ck-editor__editable .table th {
  position: relative;
}

.ck.ck-editor__editable .table .ck-table-column-resizer {
  top: 0;
  bottom: 0;
  right: var(--ck-table-column-resizer-position-offset);
  width: var(--ck-table-column-resizer-width);
  cursor: col-resize;
  -webkit-user-select: none;
  user-select: none;
  z-index: var(--ck-z-default, var(--ck-z-base));
  position: absolute;
}

.ck.ck-editor__editable.ck-column-resize_disabled .table .ck-table-column-resizer, .ck.ck-editor__editable .table[draggable] .ck-table-column-resizer {
  display: none;
}

.ck.ck-editor__editable .table .ck-table-column-resizer:hover, .ck.ck-editor__editable .table .ck-table-column-resizer__active {
  background-color: var(--ck-color-table-column-resizer-hover);
  opacity: .25;
}

.ck.ck-editor__editable[dir="rtl"] .table .ck-table-column-resizer {
  left: var(--ck-table-column-resizer-position-offset);
  right: unset;
}

.ck-table-column-resize__resizing-cursor, .ck-table-column-resize__resizing-cursor * {
  cursor: col-resize !important;
}

:root, :host {
  --ck-input-color-preview-border-radius: 0;
}

.ck.ck-input-color {
  & > .ck.ck-input-text {
    [dir="ltr"] & {
      border-top-right-radius: 0;
      border-bottom-right-radius: 0;
    }

    [dir="rtl"] & {
      border-top-left-radius: 0;
      border-bottom-left-radius: 0;
    }

    &:focus {
      z-index: 0;
    }
  }

  & > .ck.ck-dropdown {
    & > .ck.ck-button.ck-input-color__button {
      height: 100%;
      padding: 0;
      display: flex;

      [dir="ltr"] & {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;

        &:not(:focus) {
          border-left: 1px solid #0000;
        }
      }

      [dir="rtl"] & {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;

        &:not(:focus) {
          border-right: 1px solid #0000;
        }
      }

      &.ck-disabled {
        background: var(--ck-color-input-disabled-background, var(--ck-input-disabled-background-color));
      }

      & > .ck.ck-input-color__button__preview {
        border-radius: var(--ck-input-color-preview-border-radius);
        border: 1px solid var(--ck-color-input-border, var(--ck-input-border-color));
        width: 20px;
        height: 20px;
        position: relative;
        overflow: hidden;

        & > .ck.ck-input-color__button__preview__no-color-indicator {
          transform-origin: 50%;
          background: red;
          border-radius: 2px;
          width: 8%;
          height: 150%;
          display: block;
          position: absolute;
          top: -30%;
          left: 50%;
          transform: rotate(45deg);
        }
      }
    }
  }

  & .ck.ck-input-color__remove-color {
    width: 100%;
    padding: calc(var(--ck-spacing-standard, var(--ck-spacing-base)) / 2) var(--ck-spacing-standard, var(--ck-spacing-base));
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;

    &:not(:focus) {
      border-bottom: 1px solid var(--ck-color-input-border, var(--ck-input-border-color));
    }

    [dir="ltr"] & {
      border-top-right-radius: 0;
    }

    [dir="rtl"] & {
      border-top-left-radius: 0;
    }

    & .ck.ck-icon {
      margin-right: var(--ck-spacing-standard, var(--ck-spacing-base));

      [dir="rtl"] & {
        margin-right: 0;
        margin-left: var(--ck-spacing-standard, var(--ck-spacing-base));
      }
    }
  }

  flex-direction: row-reverse;
  width: 100%;
  display: flex;

  & > input.ck.ck-input-text {
    flex-grow: 1;
    min-width: auto;
  }

  & > div.ck.ck-dropdown {
    min-width: auto;

    & > .ck-input-color__button .ck-dropdown__arrow {
      display: none;
    }
  }
}

:root, :host {
  --ck-insert-table-dropdown-padding: var(--ck-spacing-padding);
  --ck-insert-table-dropdown-box-height: 16px;
  --ck-insert-table-dropdown-box-width: 16px;
  --ck-insert-table-dropdown-box-margin: 1px;
  --ck-insert-table-dropdown-box-border-radius: var(--ck-radius-xs);
  --ck-insert-table-dropdown-label-font-size: var(--ck-font-size-small, var(--ck-font-size-sm));
  --ck-insert-table-dropdown-label-padding: var(--ck-spacing-padding-compact) 0;
}

.ck .ck-insert-table-dropdown__grid {
  width: calc(var(--ck-insert-table-dropdown-box-width) * 10 + var(--ck-insert-table-dropdown-box-margin) * 20 + var(--ck-insert-table-dropdown-padding) * 2);
  padding: var(--ck-insert-table-dropdown-padding) var(--ck-insert-table-dropdown-padding) 0;
  flex-flow: wrap;
  display: flex;
}

.ck .ck-insert-table-dropdown__label, .ck[dir="rtl"] .ck-insert-table-dropdown__label {
  text-align: center;
  font-size: var(--ck-insert-table-dropdown-label-font-size);
  padding: var(--ck-insert-table-dropdown-label-padding);
}

.ck .ck-insert-table-dropdown-grid-box {
  min-width: var(--ck-insert-table-dropdown-box-width);
  min-height: var(--ck-insert-table-dropdown-box-height);
  margin: var(--ck-insert-table-dropdown-box-margin);
  border: var(--ck-border-width-thin) solid var(--ck-color-base-border);
  border-radius: var(--ck-insert-table-dropdown-box-border-radius);
  outline: none;
  transition: none;

  @media (prefers-reduced-motion: reduce) {
    transition: none;
  }

  &:focus {
    box-shadow: none;
  }

  &.ck-on {
    border-color: var(--ck-color-focus-border, var(--ck-color-interactive-focus-border));
    background: var(--ck-color-focus-outer-shadow, var(--ck-focus-shadow));
  }
}

:root, :host {
  --ck-content-table-style-spacing: 1.5em;
  --ck-content-color-table-caption-background: #f7f7f7;
  --ck-content-color-table-caption-text: #333;
}

.ck-content {
  & .table th {
    text-align: start;
  }

  &[dir="rtl"] .table th {
    text-align: right;
  }

  &[dir="ltr"] .table th {
    text-align: left;
  }

  & figure.table:not(.layout-table) {
    display: table;

    & > table {
      width: 100%;
      height: 100%;
    }
  }

  & .table:not(.layout-table) {
    margin: .9em auto;
  }

  & table.table:not(.layout-table), & figure.table:not(.layout-table) > table {
    border-collapse: collapse;
    border-spacing: 0;
    border: 1px double #b3b3b3;

    & > thead, & > tfoot, & > tbody {
      & > tr {
        & > th {
          background: #0000000d;
          font-weight: bold;
        }

        & > td, & > th {
          & > p:first-of-type {
            margin-top: 0;
          }

          & > p:last-of-type {
            margin-bottom: 0;
          }

          border: 1px solid #bfbfbf;
          min-width: 2em;
          padding: .4em;
        }
      }
    }
  }
}

@media print {
  .ck-content figure.table {
    &:not(.layout-table) {
      width: fit-content;
      height: fit-content;
    }

    &:not(.layout-table) > table {
      height: initial;
    }
  }
}

.ck-content {
  & table.table.layout-table, & figure.table.layout-table {
    margin-top: 0;
    margin-bottom: 0;
  }

  & table.table.layout-table, & figure.table.layout-table > table {
    border-spacing: 0;
  }
}

.ck-content {
  & .table {
    &.table-style-align-left {
      float: left;
      margin-right: var(--ck-content-table-style-spacing);
    }

    &.table-style-align-right {
      float: right;
      margin-left: var(--ck-content-table-style-spacing);
    }

    &.table-style-align-center {
      margin-left: auto;
      margin-right: auto;
    }

    &.table-style-block-align-left {
      margin-left: 0;
      margin-right: auto;
    }

    &.table-style-block-align-right {
      margin-left: auto;
      margin-right: 0;
    }
  }
}

.ck-content .table > figcaption, .ck-content figure.table > table > caption {
  caption-side: top;
  word-break: normal;
  overflow-wrap: anywhere;
  text-align: center;
  color: var(--ck-content-color-table-caption-text);
  background-color: var(--ck-content-color-table-caption-background);
  outline-offset: -1px;
  padding: .6em;
  font-size: .75em;
  display: table-caption;

  @media (forced-colors: active) {
    background-color: unset;
    color: unset;
  }
}

.ck-content .table .ck-table-resized {
  table-layout: fixed;
}

.ck-content .table td, .ck-content .table th {
  overflow-wrap: break-word;
}

:root, :host {
  --ck-widget-outline-thickness: 3px;
  --ck-widget-handler-icon-size: 16px;
  --ck-widget-handler-animation-duration: var(--ck-duration-base);
  --ck-widget-handler-animation-curve: var(--ck-ease-standard);
  --ck-color-widget-blurred-border: var(--ck-color-base-border-light);
  --ck-color-widget-hover-border: var(--ck-color-base-attention);
  --ck-color-widget-editable-focus-background: var(--ck-color-base-background);
  --ck-color-widget-drag-handler-icon-color: var(--ck-color-base-background);
  --ck-color-resizer: var(--ck-color-focus-border, var(--ck-color-interactive-focus-border));
  --ck-color-resizer-tooltip-background: var(--ck-color-surface-inverse);
  --ck-color-resizer-tooltip-text: var(--ck-color-text-inverse);
  --ck-resizer-border-radius: var(--ck-border-radius, var(--ck-radius-base));
  --ck-resizer-tooltip-offset: 10px;
  --ck-resizer-tooltip-height: calc(var(--ck-spacing-small, var(--ck-spacing-sm)) * 2 + 10px);
  --ck-widget-label-border-radius: 0 0 var(--ck-radius-sm) var(--ck-radius-sm);
  --ck-widget-selection-handle-border-radius: var(--ck-radius-sm) var(--ck-radius-sm) 0 0;
}

.ck .ck-widget {
  outline-width: var(--ck-widget-outline-thickness);
  transition: outline-color var(--ck-widget-handler-animation-duration) var(--ck-widget-handler-animation-curve);
  outline-style: solid;
  outline-color: #0000;

  @media (prefers-reduced-motion: reduce) {
    transition: none;
  }

  &.ck-widget_selected, &.ck-widget_selected:hover {
    outline: var(--ck-widget-outline-thickness) solid var(--ck-color-focus-border, var(--ck-color-interactive-focus-border));
  }

  &:hover {
    outline-color: var(--ck-color-widget-hover-border);
  }

  position: relative;
}

.ck .ck-editor__nested-editable {
  border: 1px solid #0000;

  &.ck-editor__nested-editable_focused, &:focus {
    box-shadow: var(--ck-inner-shadow, var(--ck-inset-shadow-sm)), 0 0;

    @media (forced-colors: none) {
      background-color: var(--ck-color-widget-editable-focus-background);
    }

    &:not(td, th) {
      border: var(--ck-focus-ring);
      outline: none;
    }
  }
}

.ck .ck-widget.ck-widget_with-selection-handle {
  & .ck-widget__selection-handle {
    box-sizing: border-box;
    opacity: 0;
    transition: background-color var(--ck-widget-handler-animation-duration) var(--ck-widget-handler-animation-curve),
			visibility var(--ck-widget-handler-animation-duration) var(--ck-widget-handler-animation-curve),
			opacity var(--ck-widget-handler-animation-duration) var(--ck-widget-handler-animation-curve);
    border-radius: var(--ck-widget-selection-handle-border-radius);
    left: calc(0px - var(--ck-widget-outline-thickness));
    background-color: #0000;
    padding: 4px;
    top: 0;
    transform: translateY(-100%);

    @media (prefers-reduced-motion: reduce) {
      transition: none;
    }

    & .ck-icon {
      width: var(--ck-widget-handler-icon-size);
      height: var(--ck-widget-handler-icon-size);
      color: var(--ck-color-widget-drag-handler-icon-color);

      & .ck-icon__selected-indicator {
        opacity: 0;
        transition: opacity .3s var(--ck-widget-handler-animation-curve);

        @media (prefers-reduced-motion: reduce) {
          transition: none;
        }
      }

      display: block;
    }

    &:hover .ck-icon .ck-icon__selected-indicator {
      opacity: 1;
    }

    position: absolute;
  }

  &:hover > .ck-widget__selection-handle {
    opacity: 1;
    background-color: var(--ck-color-widget-hover-border);
    visibility: visible;
  }

  &.ck-widget_selected, &.ck-widget_selected:hover {
    & > .ck-widget__selection-handle {
      opacity: 1;
      background-color: var(--ck-color-focus-border, var(--ck-color-interactive-focus-border));
      visibility: visible;

      & .ck-icon .ck-icon__selected-indicator {
        opacity: 1;
      }
    }
  }

  position: relative;
}

.ck[dir="rtl"] .ck-widget.ck-widget_with-selection-handle .ck-widget__selection-handle {
  left: auto;
  right: calc(0px - var(--ck-widget-outline-thickness));
}

.ck.ck-editor__editable.ck-read-only .ck-widget {
  transition: none;

  &:not(.ck-widget_selected) {
    --ck-widget-outline-thickness: 0px;
  }

  &.ck-widget_with-selection-handle {
    & .ck-widget__selection-handle, & .ck-widget__selection-handle:hover {
      background: var(--ck-color-widget-blurred-border);
    }
  }
}

.ck .ck-widget:has(.ck-widget.table:hover) {
  outline-color: #0000;
}

.ck .ck-widget.ck-widget_with-selection-handle:has(.ck-widget.table:hover) > .ck-widget__selection-handle {
  opacity: 0;
  visibility: hidden;
}

.ck.ck-editor__editable.ck-blurred .ck-widget {
  &.ck-widget_selected, &.ck-widget_selected:hover {
    outline-color: var(--ck-color-widget-blurred-border);

    &.ck-widget_with-selection-handle {
      & > .ck-widget__selection-handle, & > .ck-widget__selection-handle:hover {
        background: var(--ck-color-widget-blurred-border);
      }
    }
  }
}

.ck.ck-editor__editable:not(.ck-pagination-view) > .ck-widget.ck-widget_with-selection-handle:first-child, .ck.ck-editor__editable:not(.ck-pagination-view) blockquote > .ck-widget.ck-widget_with-selection-handle:first-child {
  margin-top: calc(1em + var(--ck-widget-handler-icon-size));
}

.ck .ck-size-view {
  background: var(--ck-color-resizer-tooltip-background);
  color: var(--ck-color-resizer-tooltip-text);
  border: 1px solid var(--ck-color-resizer-tooltip-text);
  border-radius: var(--ck-resizer-border-radius);
  font-size: var(--ck-font-size-tiny, var(--ck-font-size-xs));
  padding: 0 var(--ck-spacing-small, var(--ck-spacing-sm));
  height: var(--ck-resizer-tooltip-height);
  line-height: var(--ck-resizer-tooltip-height);
  display: block;

  &.ck-orientation-top-left, &.ck-orientation-top-right, &.ck-orientation-bottom-right, &.ck-orientation-bottom-left, &.ck-orientation-above-center {
    position: absolute;
  }

  &.ck-orientation-top-left {
    top: var(--ck-resizer-tooltip-offset);
    left: var(--ck-resizer-tooltip-offset);
  }

  &.ck-orientation-top-right {
    top: var(--ck-resizer-tooltip-offset);
    right: var(--ck-resizer-tooltip-offset);
  }

  &.ck-orientation-bottom-right {
    bottom: var(--ck-resizer-tooltip-offset);
    right: var(--ck-resizer-tooltip-offset);
  }

  &.ck-orientation-bottom-left {
    bottom: var(--ck-resizer-tooltip-offset);
    left: var(--ck-resizer-tooltip-offset);
  }

  &.ck-orientation-above-center {
    top: calc(var(--ck-resizer-tooltip-height) * -1);
    left: 50%;
    transform: translate(-50%);
  }
}

:root, :host {
  --ck-resizer-size: 10px;
  --ck-resizer-offset: calc(( var(--ck-resizer-size) / -2 ) - 2px);
  --ck-resizer-border-width: 1px;
}

.ck .ck-widget__resizer {
  outline: 1px solid var(--ck-color-resizer);
  pointer-events: none;
  display: none;
  position: absolute;
  top: 0;
  left: 0;
}

.ck .ck-widget__resizer__handle {
  width: var(--ck-resizer-size);
  height: var(--ck-resizer-size);
  background: var(--ck-color-focus-border, var(--ck-color-interactive-focus-border));
  border: var(--ck-resizer-border-width) solid var(--ck-color-base-background);
  border-radius: var(--ck-resizer-border-radius);
  pointer-events: all;
  position: absolute;

  &.ck-widget__resizer__handle-top-left {
    top: var(--ck-resizer-offset);
    left: var(--ck-resizer-offset);
  }

  &.ck-widget__resizer__handle-top-right {
    top: var(--ck-resizer-offset);
    right: var(--ck-resizer-offset);
  }

  &.ck-widget__resizer__handle-bottom-right {
    bottom: var(--ck-resizer-offset);
    right: var(--ck-resizer-offset);
  }

  &.ck-widget__resizer__handle-bottom-left {
    bottom: var(--ck-resizer-offset);
    left: var(--ck-resizer-offset);
  }

  &.ck-widget__resizer__handle-top-left, &.ck-widget__resizer__handle-bottom-right {
    cursor: nwse-resize;
  }

  &.ck-widget__resizer__handle-top-right, &.ck-widget__resizer__handle-bottom-left {
    cursor: nesw-resize;
  }
}

.ck .ck-widget_with-resizer {
  position: relative;
}

.ck-focused .ck-widget_with-resizer.ck-widget_selected {
  & > .ck-widget__resizer {
    display: block;
  }
}

:root, :host {
  --ck-widget-type-around-button-size: 20px;
  --ck-widget-type-around-button-border-radius: 100px;
  --ck-color-widget-type-around-button-active: var(--ck-color-focus-border, var(--ck-color-interactive-focus-border));
  --ck-color-widget-type-around-button-hover: var(--ck-color-widget-hover-border);
  --ck-color-widget-type-around-button-blurred-editable: var(--ck-color-widget-blurred-border);
  --ck-color-widget-type-around-button-radar-start-alpha: 0;
  --ck-color-widget-type-around-button-radar-end-alpha: .3;
  --ck-color-widget-type-around-button-icon: var(--ck-color-base-background);
}

.ck .ck-widget {
  & .ck-widget__type-around__button {
    width: var(--ck-widget-type-around-button-size);
    height: var(--ck-widget-type-around-button-size);
    background: var(--ck-color-widget-type-around-button);
    border-radius: var(--ck-widget-type-around-button-border-radius);
    transition: opacity var(--ck-widget-handler-animation-duration) var(--ck-widget-handler-animation-curve), background var(--ck-widget-handler-animation-duration) var(--ck-widget-handler-animation-curve);
    opacity: 0;
    pointer-events: none;
    z-index: var(--ck-z-default, var(--ck-z-base));
    display: block;
    position: absolute;
    overflow: hidden;

    @media (prefers-reduced-motion: reduce) {
      transition: none;
    }

    & svg {
      width: 10px;
      height: 8px;
      margin-top: 1px;
      transition: transform .5s;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);

      @media (prefers-reduced-motion: reduce) {
        transition: none;
      }

      & * {
        stroke-dasharray: 10;
        stroke-dashoffset: 0;
        fill: none;
        stroke: var(--ck-color-widget-type-around-button-icon);
        stroke-width: 1.5px;
        stroke-linecap: round;
        stroke-linejoin: round;
      }

      & line {
        stroke-dasharray: 7;
      }

      z-index: calc(var(--ck-z-default, var(--ck-z-base)) + 2);
    }

    &:hover {
      animation: 1s infinite ck-widget-type-around-button-sonar;

      & svg {
        & polyline {
          animation: 2s linear ck-widget-type-around-arrow-dash;
        }

        & line {
          animation: 2s linear ck-widget-type-around-arrow-tip-dash;
        }
      }

      @media (prefers-reduced-motion: reduce) {
        animation: none;

        & svg {
          & polyline, & line {
            animation: none;
          }
        }
      }
    }

    &.ck-widget__type-around__button_before {
      top: calc(-.5 * var(--ck-widget-outline-thickness));
      left: min(10%, 30px);
      transform: translateY(-50%);
    }

    &.ck-widget__type-around__button_after {
      bottom: calc(-.5 * var(--ck-widget-outline-thickness));
      right: min(10%, 30px);
      transform: translateY(50%);
    }
  }

  &:hover {
    & > .ck-widget__type-around > .ck-widget__type-around__button {
      opacity: 1;
      pointer-events: auto;
    }
  }

  &:not(.ck-widget_selected) > .ck-widget__type-around > .ck-widget__type-around__button {
    background: var(--ck-color-widget-type-around-button-hover);
  }

  &.ck-widget_selected > .ck-widget__type-around > .ck-widget__type-around__button, & > .ck-widget__type-around > .ck-widget__type-around__button:hover {
    background: var(--ck-color-widget-type-around-button-active);
  }

  &.ck-widget_selected {
    &.ck-widget_type-around_show-fake-caret_before, &.ck-widget_type-around_show-fake-caret_after {
      outline-color: #0000;
    }

    & > .ck-widget__type-around > .ck-widget__type-around__button {
      opacity: 1;
      pointer-events: auto;
    }
  }

  &.ck-widget_with-selection-handle > .ck-widget__type-around > .ck-widget__type-around__button_before {
    margin-left: 20px;
  }

  & .ck-widget__type-around__fake-caret {
    pointer-events: none;
    outline: var(--ck-outline-fake-caret);
    background: var(--ck-color-base-text);
    height: 1px;
    animation: 1s linear infinite forwards ck-widget-type-around-fake-caret-pulse;
  }

  &.ck-widget_type-around_show-fake-caret_before, &.ck-widget_type-around_show-fake-caret_after {
    &.ck-widget_selected:hover {
      outline-color: var(--ck-color-widget-hover-border);
    }

    & > .ck-widget__type-around > .ck-widget__type-around__button {
      opacity: 0;
      pointer-events: none;
    }

    &.ck-widget_with-selection-handle {
      &.ck-widget_selected, &.ck-widget_selected:hover {
        & > .ck-widget__selection-handle {
          opacity: 0;
        }
      }
    }

    &.ck-widget_selected.ck-widget_with-resizer > .ck-widget__resizer {
      opacity: 0;
    }
  }

  & > .ck-widget__type-around > .ck-widget__type-around__fake-caret {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
  }

  &:hover > .ck-widget__type-around > .ck-widget__type-around__fake-caret {
    left: calc(-1 * var(--ck-widget-outline-thickness));
    right: calc(-1 * var(--ck-widget-outline-thickness));
  }

  &.ck-widget_type-around_show-fake-caret_before > .ck-widget__type-around > .ck-widget__type-around__fake-caret {
    top: calc(-1 * var(--ck-widget-outline-thickness) - 1px);
    display: block;
  }

  &.ck-widget_type-around_show-fake-caret_after > .ck-widget__type-around > .ck-widget__type-around__fake-caret {
    bottom: calc(-1 * var(--ck-widget-outline-thickness) - 1px);
    display: block;
  }
}

.ck[dir="rtl"] .ck-widget.ck-widget_with-selection-handle .ck-widget__type-around > .ck-widget__type-around__button_before {
  margin-left: 0;
  margin-right: 20px;
}

.ck-editor__nested-editable.ck-editor__editable_selected {
  & .ck-widget {
    &.ck-widget_selected, &:hover {
      & > .ck-widget__type-around > .ck-widget__type-around__button {
        opacity: 0;
        pointer-events: none;
      }
    }
  }
}

.ck .ck-widget:has(.ck-widget.table:hover) {
  & > .ck-widget__type-around > .ck-widget__type-around__button {
    opacity: 0;
    pointer-events: none;
  }
}

.ck-editor__editable.ck-blurred .ck-widget.ck-widget_selected > .ck-widget__type-around > .ck-widget__type-around__button:not(:hover) {
  background: var(--ck-color-widget-type-around-button-blurred-editable);

  & svg * {
    stroke: var(--ck-color-widget-blurred-border);
  }
}

@keyframes ck-widget-type-around-arrow-dash {
  0% {
    stroke-dashoffset: 10px;
  }

  20%, 100% {
    stroke-dashoffset: 0;
  }
}

@keyframes ck-widget-type-around-arrow-tip-dash {
  0%, 20% {
    stroke-dashoffset: 7px;
  }

  40%, 100% {
    stroke-dashoffset: 0;
  }
}

@keyframes ck-widget-type-around-button-sonar {
  0% {
    box-shadow: 0 0 0 0 hsla(var(--ck-color-focus-border-coordinates), var(--ck-color-widget-type-around-button-radar-start-alpha));
  }

  50% {
    box-shadow: 0 0 0 5px hsla(var(--ck-color-focus-border-coordinates), var(--ck-color-widget-type-around-button-radar-end-alpha));
  }

  100% {
    box-shadow: 0 0 0 5px hsla(var(--ck-color-focus-border-coordinates), var(--ck-color-widget-type-around-button-radar-start-alpha));
  }
}

@keyframes ck-widget-type-around-fake-caret-pulse {
  0% {
    opacity: 1;
  }

  49% {
    opacity: 1;
  }

  50% {
    opacity: 0;
  }

  99% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.ck.ck-editor__editable.ck-read-only .ck-widget__type-around, .ck.ck-editor__editable.ck-widget__type-around_disabled .ck-widget__type-around {
  display: none;
}

.ck.ck-editor__editable.ck-restricted-editing_mode_restricted {
  & .ck-widget__type-around {
    display: none;
  }

  & div.restricted-editing-exception .ck-widget__type-around {
    display: initial;
  }
}

:root, :host {
  --ck-word-count-font-size: var(--ck-font-size-md);
}

.ck.ck-word-count {
  font-size: var(--ck-word-count-font-size);
}

/*# sourceMappingURL=ckeditor5.css.map */
/**
 * @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
 * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
 */
:root, :host {
  --ck-ai-form-submit-button-text-color: var(--ck-color-text);
  --ck-ai-form-submit-button-border-color: transparent;
  --ck-ai-form-submit-button-disabled-border-color: transparent;
  --ck-ai-toolbar-button-hover-color: var(--ck-color-text);
  --ck-ai-selection-color: var(--ck-ai-balloon-fake-selection-background-color);
}

.ck-ai-assistant-ui_theme {
  --ck-button-default-hover-background-color: inherit;
  --ck-button-default-active-background-color: inherit;
  --ck-button-on-background-color: inherit;
  --ck-button-on-hover-background-color: inherit;
  --ck-button-on-active-background-color: inherit;
  --ck-button-on-disabled-background-color: inherit;
  --ck-button-on-text-color: inherit;
  --ck-button-action-background-color: inherit;
  --ck-button-action-hover-background-color: inherit;
  --ck-button-action-active-background-color: inherit;
  --ck-button-action-disabled-background-color: inherit;
  --ck-list-button-hover-background-color: inherit;
  --ck-ai-form-content-background: inherit;
  --ck-ai-form-submit-button-text-color: inherit;
  --ck-ai-form-submit-button-border-color: inherit;
  --ck-ai-form-submit-button-disabled-border-color: inherit;
  --ck-ai-toolbar-button-hover-color: inherit;
}

.ck-ai-commands-dropdown > .ck-button:hover, .ck-ai-assistant-button:hover {
  color: var(--ck-ai-toolbar-button-hover-color);
}

.ck .ck-fake-ai-selection_collapsed {
  border-right: 1px solid var(--ck-color-base-text);
  outline: 1px solid #ffffff80;
  height: 100%;
  margin-right: -1px;
}

.ck.ck-content.ck-ai-form__content-field {
  & h2 {
    font-size: 1.3em;
  }

  & h3 {
    font-size: 1.2em;
  }

  & h4, & h5, & h6 {
    font-size: 1.1em;
  }

  & h2, & h3, & h4, & h5, & h6, & p, & ul, & ol {
    margin-block: .5em;
    line-height: 1.7em;
  }

  & > :first-child {
    margin-top: 0;
  }

  & > :last-child {
    margin-bottom: 0;
  }
}

:root, :host {
  --ck-ai-form-view-width: 600px;
  --ck-ai-form-content-height: 175px;
  --ck-ai-form-content-background: var(--ck-color-base-foreground);
  --ck-ai-form-history-font-size: .9em;
  --ck-ai-form-error-background: hsla(from var(--ck-color-feedback-error) h s l / .1);
}

.ck .ck-ai-form {
  width: var(--ck-ai-form-view-width);
  max-width: 100%;

  @media screen and (width <= 600px) {
    --ck-ai-form-view-width: 100vw;
  }

  & .ck-ai-form-content {
    padding: var(--ck-spacing-padding-comfortable);
    width: 100%;

    & .ck-input {
      width: 100%;
    }

    & .ck-ai-form__content-area-wrapper {
      width: 100%;
      max-height: var(--ck-ai-form-content-height);
      border: var(--ck-border-control);
      border-radius: var(--ck-border-radius-control);
      overflow-y: auto;

      &:focus {
        border: var(--ck-focus-ring);
        box-shadow: var(--ck-focus-shadow), 0 0;
        outline: none;
      }
    }

    & .ck-ai-form__content-area {
      background-color: var(--ck-ai-form-content-background);
      display: flex;

      &.ck-ai-form__content-area--processing {
        --ck-color-text: var(--ck-input-disabled-text-color);
        background-color: var(--ck-input-disabled-background-color);
      }

      & .ck-ai-form__content-field {
        white-space: normal;
        width: 100%;
        padding: var(--ck-spacing-padding-tight) var(--ck-spacing-padding);
        min-height: calc(var(--ck-line-height-base) * var(--ck-font-size-base));
        box-sizing: content-box;

        [dir="ltr"] & {
          padding-right: 0;
        }

        [dir="rtl"] & {
          padding-left: 0;
        }

        & > * {
          white-space: normal;
          color: inherit;
        }
      }

      & .ck-spinner-container {
        [dir="ltr"] & {
          margin-right: var(--ck-spacing-gap);
        }

        [dir="rtl"] & {
          margin-left: var(--ck-spacing-gap);
        }
      }

      & .ck-ai-form__copy-button-wrapper {
        flex-direction: column-reverse;
        padding-left: 2px;
        display: flex;
      }

      & .ck-ai-form__copy-button {
        min-height: unset;
        min-width: unset;
        padding: 4px;
        position: sticky;
        bottom: 1px;
        right: 1px;

        & svg {
          --ck-icon-size: 16px;
        }

        &.ck-ai-form__copy-button--copied {
          color: inherit;
        }
      }
    }

    & .ck-ai-form__toolbar {
      margin-top: var(--ck-spacing-gap);
      margin-bottom: calc(2 * var(--ck-spacing-gap));
      border: none;
      padding: 0;
    }

    & .ck-ai-form__loader {
      align-items: center;
      display: flex;

      & .ck-spinner {
        box-sizing: border-box;
      }
    }

    & .ck-autocomplete {
      justify-content: space-between;
      display: flex;

      & > .ck-labeled-field-view {
        flex-grow: 1;
      }

      & > .ck.ck-ai-form__submit {
        [dir="ltr"] & {
          margin-left: var(--ck-spacing-gap);
        }

        [dir="rtl"] & {
          margin-right: var(--ck-spacing-gap);
        }

        border-color: var(--ck-ai-form-submit-button-border-color);
        color: var(--ck-ai-form-submit-button-text-color);

        &.ck-disabled {
          border-color: var(--ck-ai-form-submit-button-disabled-border-color);
        }
      }

      & > .ck-labeled-field-view .ck-ai-form__toggle-history {
        font-size: var(--ck-font-size-xs);
        position: absolute;

        [dir="ltr"] & {
          right: var(--ck-spacing-base);
        }

        [dir="rtl"] & {
          left: var(--ck-spacing-base);
        }

        bottom: var(--ck-spacing-sm);
        top: var(--ck-spacing-sm);
        min-height: unset;
        min-width: unset;
        padding: 4px;
      }

      & .ck-textarea {
        [dir="ltr"] & {
          padding-right: 30px;
        }

        [dir="rtl"] & {
          padding-left: 30px;
        }

        @media screen and (width <= 600px) {
          --ck-input-width: auto;
        }
      }

      & .ck-search__results .ck-list .ck-list__group {
        grid-column-gap: 0px;
        grid-row-gap: 0px;
        grid-template-rows: auto;
        grid-template-columns: auto 1fr;
        display: grid;

        & > span {
          grid-area: 1 / 1 / 2 / 2;
        }

        & > .ck-button {
          min-height: auto;
          font-size: var(--ck-ai-form-history-font-size);
          margin: var(--ck-spacing-gap) 0 0;
          background: none;
          grid-area: 1 / 2 / 2 / 3;
          justify-self: start;
          padding: 0;

          & .ck-button__label {
            line-height: inherit;

            &:hover {
              text-decoration: underline;
            }
          }
        }

        & > .ck-list {
          grid-area: 2 / 1 / 3 / 3;

          & .ck-list__item .ck-button .ck-button__label {
            white-space: nowrap;
            text-overflow: ellipsis;
            max-width: 100%;
            font-size: var(--ck-ai-form-history-font-size);
            line-height: var(--ck-line-height-base);
            overflow: hidden;
          }
        }
      }
    }
  }

  & .ck-ai-form__error {
    padding: var(--ck-spacing-padding);
    background-color: var(--ck-ai-form-error-background);
    color: var(--ck-color-base-text);
    border-radius: var(--ck-border-radius-control);
    margin-bottom: var(--ck-spacing-gap);
    justify-content: center;
    align-items: center;
    display: flex;
  }
}

.ck.ck-button.ck-ai-tabs__resize {
  &.ck-on:not(:hover) {
    background-color: #0000;
  }
}

:root, :host {
  --ck-ai-chat-shortcuts-shortcut-border-color: var(--ck-ai-accent-100-color);
  --ck-ai-chat-shortcuts-shortcut-icon-color: var(--ck-ai-accent-700-color);
  --ck-ai-chat-shortcuts-shortcut-icon-hover-background-color: var(--ck-color-base-hover);
  --ck-ai-chat-shortcuts-prompt-highlight-background-color: var(--ck-ai-accent-700-a1-color);
  --ck-ai-chat-shortcuts-prompt-animation-glow-ring-color: var(--ck-ai-accent-700-a3-color);
  --ck-ai-chat-shortcuts-prompt-animation-border-color: var(--ck-ai-accent-700-color);
  --ck-ai-chat-shortcuts-prompt-input-animation: ck-ai-chat-shortcuts-prompt-input-glow .8s var(--ck-ease-interactive);
  --ck-ai-chat-shortcuts-prompt-input-animation-box-shadow: 0 0 0 4px var(--ck-ai-chat-shortcuts-prompt-animation-glow-ring-color);
  --ck-ai-chat-shortcuts-prompt-input-animation-border: var(--ck-border-width-thin) solid var(--ck-ai-chat-shortcuts-prompt-animation-border-color);
}

.ck.ck-ai-chat-shortcuts {
  & > .ck-list {
    --ck-list-item-outer-padding: 0;
    gap: var(--ck-spacing-gap);
    padding: 0;

    & .ck.ck-button.ck-ai-chat-shortcut {
      border-radius: var(--ck-radius-base);
      border-color: var(--ck-ai-chat-shortcuts-shortcut-border-color);
      padding: var(--ck-spacing-padding) var(--ck-spacing-padding-spacious);
      min-height: calc(var(--ck-size-control-min-height) + var(--ck-spacing-base));
      font-weight: var(--ck-font-weight-normal);

      & .ck-button__label {
        white-space: pre-wrap;
      }

      & .ck-icon {
        --ck-icon-size: var(--ck-font-size-lg);
        color: var(--ck-ai-chat-shortcuts-shortcut-icon-color);
        flex: none;
        margin-inline-end: var(--ck-spacing-gap);
      }

      &:hover:not(.ck-disabled) {
        background-color: var(--ck-ai-chat-shortcuts-shortcut-icon-hover-background-color);
      }

      &.ck-disabled {
        opacity: var(--ck-opacity-disabled);

        & .ck-button__label, & .ck-button__icon {
          opacity: 1;
        }
      }
    }
  }
}

.ck.ck-ai-chat__prompt-input.ck-search.ck-ai-chat__prompt-input_highlighted .ck.ck-input.ck-textarea {
  --ck-ai-chat-prompt-input-animation-background-color: var(--ck-ai-chat-shortcuts-prompt-highlight-background-color);
  animation: var(--ck-ai-chat-prompt-input-animation), var(--ck-ai-chat-shortcuts-prompt-input-animation);
}

@keyframes ck-ai-chat-shortcuts-prompt-input-glow {
  0% {
    box-shadow: var(--ck-ai-chat-shortcuts-prompt-input-animation-box-shadow);
    border: var(--ck-ai-chat-shortcuts-prompt-input-animation-border);
  }

  100% {
    box-shadow: var(--ck-focus-shadow);
    border: var(--ck-focus-ring);
  }
}

.ck.ck-body.ck-ai-body .ck.ck-balloon-panel:not(.ck-tooltip) {
  z-index: calc(var(--ck-ai-tabs-overlay-z-index) + 1);
}

:root, :host {
  --ck-ai-chat-suggestion-container-header-font-size: var(--ck-font-size-md);
}

.ck.ck-ai-suggestion__container {
  border-radius: var(--ck-radius-base);
  border: 1px solid var(--ck-color-base-border);
  position: relative;

  & .ck-ai-suggestion__header {
    border-radius: var(--ck-radius-base);
    padding: var(--ck-spacing-padding) var(--ck-spacing-padding-comfortable);
    border-bottom: 1px solid var(--ck-color-base-border);
    z-index: 1;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    display: flex;
    position: relative;

    & > span {
      font-size: var(--ck-ai-chat-suggestion-container-header-font-size);
      color: var(--ck-color-base-text);
      font-weight: var(--ck-font-weight-semibold);
      flex-grow: 1;
    }

    & > .ck-icon {
      width: 14px;
      height: 14px;
      margin-right: var(--ck-spacing-gap);
      color: var(--ck-color-base-text);
    }

    & > .ck-switchbutton {
      --ck-switch-button-toggle-width: 2.307em;
      --ck-switch-button-toggle-inner-size: 1em;
      --ck-switch-button-translation: calc(var(--ck-switch-button-toggle-width) - var(--ck-switch-button-toggle-inner-size) - 2px);
      --ck-switch-button-off-background-color: var(--ck-ai-chat-icon-color);

      & .ck-button__label {
        font-size: var(--ck-ai-chat-suggestion-container-header-font-size);
        margin-right: var(--ck-spacing-gap);
      }

      & .ck-button__toggle {
        border-radius: var(--ck-switch-button-toggle-inner-size);

        & .ck-button__toggle__inner {
          border-radius: 100%;
        }
      }
    }
  }

  & .ck-ai-suggestion__body {
    gap: var(--ck-spacing-gap-comfortable);
    border-radius: var(--ck-radius-corners);
    background: var(--ck-ai-chat-feed-item-background-color);
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    flex-direction: column;
    display: flex;

    & .ck-ai-suggestion__body__content-parts {
      gap: var(--ck-spacing-gap-comfortable);
      flex-direction: column;
      display: flex;

      & > .ck-ai-skeleton {
        --ck-ai-skeleton-gap: var(--ck-spacing-gap);
        padding-top: calc(var(--ck-ai-skeleton-gap) + var(--ck-spacing-gap-comfortable));
        padding-bottom: calc(var(--ck-ai-skeleton-gap) + var(--ck-spacing-gap-comfortable));
        background-color: var(--ck-color-base-background);
        border-radius: var(--ck-radius-corners);
        align-items: flex-start;
        transition-delay: 0s;
        position: static;

        &.ck-hidden {
          transition-duration: 0s;
        }
      }
    }

    & .ck.ck-ai-chat__feed__item.ck-ai-notification_warning {
      width: 100%;
      margin-left: 0;
      margin-right: 0;
    }
  }

  & .ck-ai-suggestion__body, & .ck-ai-suggestion__changes {
    padding: var(--ck-spacing-padding-comfortable) var(--ck-spacing-padding);
  }
}

:root, :host {
  --ck-ai-chat-feed-item-background-color: var(--ck-ai-neutral-50-color);
  --ck-ai-chat-feed-item-secondary-background-color: var(--ck-ai-neutral-50-color);
  --ck-ai-chat-feed-interaction-header-capabilities-text-color: var(--ck-ai-neutral-600-color);
  --ck-ai-chat-web-source-tooltip-url-color: var(--ck-ai-accent-700-color);
  --ck-ai-chat-web-source-tooltip-title-color: var(--ck-ai-neutral-900-color);
  --ck-ai-chat-feed-web-sources-header-icon-color: var(--ck-ai-neutral-600-color);
  --ck-ai-chat-feed-web-sources-header-text-color: var(--ck-ai-neutral-600-color);
  --ck-ai-chat-feed-interaction-header-capabilities-text-font-size: var(--ck-font-size-md);
  --ck-ai-chat-feed-interaction-header-capabilities-icon-size: calc(var(--ck-ai-chat-feed-interaction-header-capabilities-text-font-size) * 8 / 7);
  --ck-ai-chat-feed-web-sources-header-text-font-size: var(--ck-font-size-md);
  --ck-ai-chat-feed-web-sources-header-icon-size: calc(var(--ck-ai-chat-feed-web-sources-header-text-font-size) * 8 / 7);
  --ck-ai-chat-loader-text-font-size: var(--ck-font-size-md);
  --ck-ai-chat-loader-text-font-weight: var(--ck-font-weight-normal);
  --ck-ai-chat-loader-text-font-color: var(--ck-color-text-secondary);
}

.ck.ck-ai-chat__feed {
  padding-bottom: var(--ck-spacing-padding-spacious);
  justify-content: flex-start;
  align-items: stretch;
  gap: var(--ck-spacing-gap-comfortable);
  contain: size;
  flex-flow: column;
  flex: auto;
  display: flex;
  position: relative;
  overflow-y: auto;

  &:has( > .ck-ai-skeleton:not(.ck-hidden)) {
    overflow: hidden;
  }

  & > .ck-ai-skeleton {
    padding-bottom: var(--ck-spacing-padding-spacious);
  }

  & > .ck-ai-skeleton.ck-ai-chat__feed__init-skeleton {
    justify-content: flex-end;
  }

  & .ck.ck-ai-chat__feed__items {
    gap: var(--ck-spacing-gap-spacious) 0;
    flex-direction: column;
    margin-top: auto;
    display: flex;

    & > .ck-ai-chat__feed__item {
      &:first-child {
        margin-top: var(--ck-spacing-gap-spacious);
      }
    }
  }

  & .ck.ck-ai-chat__feed__item {
    margin: 0 var(--ck-spacing-padding-comfortable);
    scroll-margin: var(--ck-spacing-padding-comfortable);

    & .ck-ai-mini-toolbar, & .ck-ai-chat__feed__ai-suggestion__actions, & .ck-ai-suggestion__header__show-changes-toggle {
      transition: opacity var(--ck-duration-slower), display var(--ck-duration-slower) allow-discrete;

      @starting-style {
        & {
          opacity: 0;
        }
      }
    }

    &:not(.ck-ai-chat__feed__item_done) {
      & .ck-ai-mini-toolbar, & .ck-ai-chat__feed__ai-suggestion__actions, & .ck-ai-suggestion__header__show-changes-toggle {
        opacity: 0;
        display: none;
      }
    }

    &.ck.ck-ai-chat__feed__text-item {
      word-break: normal;
      text-wrap: auto;
    }

    &.ck.ck-ai-chat__feed__user-message {
      &:has(.ck-ai-chat-context-chips-wrapper) {
        max-width: 100%;
      }

      & .ck-ai-chat__feed__message-content {
        text-align: end;
        white-space: pre-wrap;
        overflow-wrap: break-word;
        max-width: 80%;
        margin-inline: auto 0;

        &, & * {
          box-sizing: border-box;
        }

        & * {
          text-align: start;
        }
      }

      & p {
        background-color: var(--ck-ai-chat-feed-item-secondary-background-color);
        padding: var(--ck-spacing-padding);
        border-radius: var(--ck-ai-border-radius);
        width: max-content;
        max-width: 100%;
        display: inline-block;
      }
    }

    &.ck-ai-chat__feed__ai-reply {
      & .ck-ai-chat__feed__ai-reply-container {
        white-space: pre-wrap;
      }
    }

    &.ck-ai-chat__feed__ai-suggestion {
      margin: 0 var(--ck-spacing-gap);

      & .ck-ai-chat__feed__ai-suggestion__actions {
        gap: var(--ck-spacing-gap);
        flex-direction: row;
        width: fit-content;
        display: flex;
      }
    }

    &.ck.ck-ai-chat__feed__interaction-header {
      & .ck-ai-chat__feed__interaction-header__capabilities {
        color: var(--ck-ai-chat-feed-interaction-header-capabilities-text-color);
        align-items: center;
        gap: 4px;
        display: flex;

        & svg {
          background-color: var(--ck-tabs-panels-container-background);
          width: var(--ck-ai-chat-feed-interaction-header-capabilities-icon-size);
          height: var(--ck-ai-chat-feed-interaction-header-capabilities-icon-size);
          border-radius: 50%;
          flex-shrink: 0;

          &:not(:first-child) {
            margin-left: calc(var(--ck-ai-chat-feed-interaction-header-capabilities-icon-size) * -.75);
          }
        }
      }

      & .ck-ai-chat__feed__interaction-header__capabilities__text {
        color: var(--ck-ai-chat-feed-interaction-header-capabilities-text-color);
        font-size: var(--ck-ai-chat-feed-interaction-header-capabilities-text-font-size);
      }
    }

    & .ck-ai-chat__feed__message-content, & .ck-ai-chat__feed__ai-reply-container {
      & > * {
        &:first-child {
          margin-top: 0;
        }

        &:last-child {
          margin-bottom: 0;
        }
      }
    }

    &.ck.ck-ai-chat__feed__ai-suggestion .ck-ai-suggestion__body {
      & .ck-suggestion-marker-insertion:not([data-author-id="$aiSuggestion"]), & .ck-suggestion-marker-formatInline:not([data-author-id="$aiSuggestion"]), & .ck-suggestion-marker-deletion:not([data-author-id="$aiSuggestion"]) {
        border-top: 3px solid var(--ck-ai-suggestion-inactive-border-color);
        border-bottom: 3px solid var(--ck-ai-suggestion-inactive-border-color);
        background: var(--ck-ai-suggestion-inactive-background-color);

        &.ck-widget {
          border: 3px solid var(--ck-ai-suggestion-inactive-border-color);
        }
      }

      & .ck-suggestion-marker-formatBlock:not([data-author-id="$aiSuggestion"]) {
        box-shadow: -7px 0 0 0 var(--ck-color-base-background), -10px 0 0 0 var(--ck-ai-suggestion-inactive-background-color);
      }

      & .ck-suggestion-marker-deletion:not([data-author-id="$aiSuggestion"]) {
        text-decoration: line-through 3px;
        text-decoration-color: var(--ck-ai-suggestion-inactive-border-color);
      }

      & .ck-suggestion-marker-insertion.table > tbody > tr > td {
        background-color: var(--ck-suggestion-widget-insertion-background-color);
      }
    }

    &.ck.ck-ai-chat__feed__text-item :not(.ck-ai-chat__feed__context-chips, .ck-ai-chat__feed__context-chips *, .ck-ai-web-source .ck-button__label, .ck-ai-chat-shortcut .ck-button__label, .ck-content.ck-ai-suggestion-streamable-content, .ck-content.ck-ai-suggestion-streamable-content *, .ck-ai-chat-content, .ck-ai-chat-content *) {
      white-space: pre-wrap;
    }

    & .ck-ai-chat__feed__context-chips {
      margin-bottom: var(--ck-spacing-gap-snug);
      justify-content: flex-end;
      display: flex;
    }

    & .ck-ai-web-sources {
      gap: var(--ck-spacing-gap);
      padding: var(--ck-spacing-padding) 0 0;
      grid-template-columns: repeat(3, 1fr);
      display: grid;

      & > .ck-ai-web-sources__header {
        grid-column-start: span 3;
        font-size: 12px;
        font-weight: 500;
        line-height: 1.4em;

        & > .ck-icon {
          margin-right: var(--ck-spacing-gap-snug);
          color: var(--ck-ai-chat-feed-web-sources-header-icon-color);
          height: var(--ck-ai-chat-feed-web-sources-header-icon-size);
          width: var(--ck-ai-chat-feed-web-sources-header-icon-size);
          vertical-align: middle;
        }

        & > span {
          color: var(--ck-ai-chat-feed-web-sources-header-text-color);
          font-size: var(--ck-ai-chat-feed-web-sources-header-text-font-size);
          vertical-align: middle;
        }
      }

      & > .ck-ai-web-source {
        padding: var(--ck-spacing-padding) var(--ck-spacing-padding-comfortable);
        background-color: var(--ck-color-base-background);
        border: 0;
        border-radius: 50px;

        &:hover {
          background-color: var(--ck-color-interactive-selected-surface-hover);
        }

        &:focus, &:active {
          box-shadow: none;
        }

        & .ck-ai-web-source__image, & .ck-button__icon {
          margin-right: var(--ck-spacing-gap);
          color: var(--ck-ai-chat-feed-web-sources-header-icon-color);
          width: 16px;
          height: 16px;
        }

        & .ck-button__label {
          white-space: nowrap;
          text-overflow: ellipsis;
          max-width: 75px;
          font-size: 10px;
          font-weight: 700;
          line-height: 1.4em;
          overflow: hidden;
        }

        & .ck-ai-web-source__title {
          align-items: center;
          gap: var(--ck-spacing-gap-compact);
          display: flex;
        }
      }
    }

    & > .ck-ai-web-sources {
      padding: var(--ck-spacing-padding-spacious) 0 var(--ck-spacing-padding) 0;
    }
  }

  & .ck.ck-ai-chat__loader {
    align-items: flex-start;
    display: flex;

    & .ck.ck-ai-dots-loader {
      margin-inline: var(--ck-spacing-gap-comfortable) var(--ck-spacing-gap);
    }

    & .ck.ck-ai-chat__loader-text {
      font-weight: var(--ck-ai-chat-loader-text-font-weight);
      font-size: var(--ck-ai-chat-loader-text-font-size);
      color: var(--ck-ai-chat-loader-text-font-color);
      white-space: normal;
      line-height: 1.462em;
    }
  }
}

.ck-ai-chat__feed__ai-suggestion__actions__balloon {
  &.ck-balloon-panel {
    z-index: calc(var(--ck-ai-tabs-overlay-z-index) + 1);
  }

  & .ck-list__item {
    min-width: fit-content;
  }

  & .ck-button.ck-list-item-button {
    padding-top: 0;
    padding-bottom: 0;

    &:hover:not(.ck-disabled) {
      background-color: var(--ck-color-interactive-hover-surface);
    }
  }
}

.ck-ai-web-source__tooltip-balloon {
  border-radius: var(--ck-radius-corners);

  & .ck-ai-web-source__tooltip {
    font-size: var(--ck-font-size-xs);
    line-height: var(--ck-line-height-base);
    width: 214px;
    padding: .8em;

    & .ck-ai-web-source__tooltip-row {
      align-items: center;
      gap: var(--ck-spacing-gap-snug);
      margin-bottom: var(--ck-spacing-gap-snug);
      display: flex;

      &:last-child {
        margin-bottom: 0;
      }
    }

    & .ck-ai-web-source__tooltip-image, & .ck-ai-web-source__tooltip-title, & .ck-ai-web-source__tooltip-url {
      font-size: var(--ck-font-size-xs);
      line-height: var(--ck-line-height-base);
    }

    & .ck-ai-web-source__tooltip-image {
      width: 1.6em;
      height: 1.6em;
      color: var(--ck-ai-chat-feed-web-sources-header-icon-color);
      flex-shrink: 0;
    }

    & .ck-ai-web-source__tooltip-url {
      color: var(--ck-ai-chat-web-source-tooltip-url-color);
      white-space: normal;
      word-wrap: break-word;
      overflow-wrap: break-word;
      word-break: break-all;
      text-decoration: none;
    }

    & .ck-ai-web-source__tooltip-title {
      color: var(--ck-ai-chat-web-source-tooltip-title-color);
      white-space: normal;
      vertical-align: middle;
    }
  }
}

@keyframes ck-html-streamer-fade-in {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

:root, :host {
  --ck-ai-chat-content-font-size: var(--ck-font-size-md);
  --ck-ai-chat-content-line-height: var(--ck-line-height-base);
  --ck-ai-chat-content-h1-font-size: calc(var(--ck-ai-chat-content-font-size) * 20 / 14);
  --ck-ai-chat-content-h1-line-height: calc(var(--ck-ai-chat-content-h1-font-size) + 8px);
  --ck-ai-chat-content-h1-font-weight: var(--ck-font-weight-semibold);
  --ck-ai-chat-content-h2-font-size: calc(var(--ck-ai-chat-content-font-size) * 18 / 14);
  --ck-ai-chat-content-h2-line-height: calc(var(--ck-ai-chat-content-h2-font-size) + 8px);
  --ck-ai-chat-content-h2-font-weight: var(--ck-font-weight-semibold);
  --ck-ai-chat-content-h3-font-size: calc(var(--ck-ai-chat-content-font-size) * 16 / 14);
  --ck-ai-chat-content-h3-line-height: var(--ck-line-height-base);
  --ck-ai-chat-content-h3-font-weight: var(--ck-font-weight-semibold);
  --ck-ai-chat-content-h4-font-size: var(--ck-ai-chat-content-font-size);
  --ck-ai-chat-content-h4-line-height: var(--ck-line-height-base);
  --ck-ai-chat-content-h4-font-weight: var(--ck-font-weight-semibold);
  --ck-ai-chat-content-code-font-size: calc(var(--ck-ai-chat-content-font-size) * 13 / 14);
  --ck-ai-chat-content-code-line-height: calc(var(--ck-ai-chat-content-font-size) * var(--ck-line-height-base));
  --ck-ai-chat-content-text-color: var(--ck-color-base-text);
  --ck-ai-chat-content-link-color: var(--ck-color-base-action);
  --ck-ai-chat-content-link-selected-background-color: #1fb0ff1a;
  --ck-ai-chat-content-code-background-color: var(--ck-ai-chat-content-block-background-color);
  --ck-ai-chat-content-block-background-color: var(--ck-color-base-foreground);
  --ck-ai-chat-content-pre-background-color: var(--ck-ai-chat-content-block-background-color);
  --ck-ai-chat-content-pre-text-color: var(--ck-color-base-text);
  --ck-ai-chat-content-hr-background-color: var(--ck-color-base-border);
  --ck-ai-chat-content-blockquote-border-color: var(--ck-color-base-border);
  --ck-ai-chat-content-table-border-color: var(--ck-color-base-border);
  --ck-ai-chat-content-table-th-background-color: #0000000d;
}

.ck-ai-chat-content {
  font-family: var(--ck-font-family);
  font-size: var(--ck-ai-chat-content-font-size);
  line-height: var(--ck-ai-chat-content-line-height);
  color: var(--ck-ai-chat-content-text-color);
}

.ck-ai-chat-content p {
  margin: 8px 0;
}

.ck-ai-chat-content strong, .ck-ai-chat-content b {
  font-weight: var(--ck-font-weight-bold);
}

.ck-ai-chat-content h1 {
  font-size: var(--ck-ai-chat-content-h1-font-size);
  line-height: var(--ck-ai-chat-content-h1-line-height);
  font-weight: var(--ck-ai-chat-content-h1-font-weight);
  margin: 16px 0 8px;
}

.ck-ai-chat-content h2 {
  font-size: var(--ck-ai-chat-content-h2-font-size);
  line-height: var(--ck-ai-chat-content-h2-line-height);
  font-weight: var(--ck-ai-chat-content-h2-font-weight);
  margin: 12px 0 8px;
}

.ck-ai-chat-content h3 {
  font-size: var(--ck-ai-chat-content-h3-font-size);
  line-height: var(--ck-ai-chat-content-h3-line-height);
  font-weight: var(--ck-ai-chat-content-h3-font-weight);
  margin: 8px 0;
}

.ck-ai-chat-content h4 {
  font-size: var(--ck-ai-chat-content-h4-font-size);
  line-height: var(--ck-ai-chat-content-h4-line-height);
  font-weight: var(--ck-ai-chat-content-h4-font-weight);
  margin: 8px 0;
}

.ck-ai-chat-content a {
  color: var(--ck-ai-chat-content-link-color);
  text-decoration: underline;
}

.ck-ai-chat-content a:focus-visible {
  background-color: var(--ck-ai-chat-content-link-selected-background-color);
}

.ck-ai-chat-content code, .ck-ai-chat-content pre {
  font-size: var(--ck-ai-chat-content-code-font-size);
  line-height: var(--ck-ai-chat-content-code-line-height);
}

.ck-ai-chat-content code {
  background-color: var(--ck-ai-chat-content-code-background-color);
  border-radius: 2px;
  padding: .15em;
}

.ck-ai-chat-content pre {
  background: var(--ck-ai-chat-content-pre-background-color);
  border-radius: var(--ck-radius-md);
  color: var(--ck-ai-chat-content-pre-text-color);
  padding: var(--ck-spacing-padding-comfortable);
  tab-size: 4;
  white-space: pre;
  text-align: left;
  direction: ltr;
  border: 0;
  min-width: 200px;
  margin: 8px 0;
  font-style: normal;
  overflow-x: auto;
}

.ck-ai-chat-content pre > code {
  background: unset;
  border-radius: 0;
  padding: 0;
}

.ck-ai-chat-content ul, .ck-ai-chat-content ol {
  margin: 8px 0;
  padding-left: 16px;
}

.ck-ai-chat-content ul {
  list-style-type: disc;
}

.ck-ai-chat-content ol {
  list-style-type: decimal;
}

.ck-ai-chat-content li > ul, .ck-ai-chat-content li > ol {
  margin: 2px 0;
}

.ck-ai-chat-content li + li {
  margin-top: 2px;
}

.ck-ai-chat-content ul ul, .ck-ai-chat-content ol ul {
  list-style-type: circle;
}

.ck-ai-chat-content ul ol, .ck-ai-chat-content ol ol {
  list-style-type: lower-latin;
}

.ck-ai-chat-content ul ul ul, .ck-ai-chat-content ul ol ul, .ck-ai-chat-content ol ul ul, .ck-ai-chat-content ol ol ul {
  list-style-type: square;
}

.ck-ai-chat-content ul ul ol, .ck-ai-chat-content ul ol ol, .ck-ai-chat-content ol ul ol, .ck-ai-chat-content ol ol ol {
  list-style-type: lower-roman;
}

.ck-ai-chat-content table {
  border-collapse: collapse;
  margin: 8px 0;
  display: block;
  overflow-x: auto;
}

.ck-ai-chat-content th, .ck-ai-chat-content td {
  border: 1px solid var(--ck-ai-chat-content-table-border-color);
  padding: 6px;
}

.ck-ai-chat-content th {
  font-weight: var(--ck-font-weight-bold);
  background: var(--ck-ai-chat-content-table-th-background-color);
  text-align: start;
}

.ck-ai-chat-content blockquote {
  border-left: solid 2px var(--ck-ai-chat-content-blockquote-border-color);
  margin: 20px 0 20px 16px;
  padding: 0 1.5em;
  font-style: italic;
}

.ck-ai-chat-content hr {
  background: var(--ck-ai-chat-content-hr-background-color);
  border: 0;
  height: 1px;
  margin: 12px 1.5em;
  display: block;
}

:root, :host {
  --ck-ai-model-selector-item-name-font-size: var(--ck-font-size-md);
  --ck-ai-model-selector-item-description-font-size: var(--ck-font-size-sm);
  --ck-ai-model-selector-item-capability-icon-size: var(--ck-font-size-base);
  --ck-ai-model-selector-item-secondary-color: var(--ck-ai-neutral-600-color);
}

.ck.ck-ai-model-selector {
  display: contents;
}

.ck.ck-ai-model-selector .ck.ck-dropdown .ck-button.ck-dropdown__button.ck-on {
  border-radius: var(--ck-button-border-radius);

  & .ck-dropdown__arrow {
    transform: rotate(180deg);
  }
}

.ck.ck-ai-model-selector .ck-dropdown__panel > .ck.ck-list {
  & > .ck.ck-list__item > .ck.ck-button {
    background-color: var(--ck-list-background-color);
    font-size: var(--ck-ai-model-selector-item-name-font-size);
    align-items: start;
    gap: 0;

    &:hover:not(.ck-disabled) {
      background-color: var(--ck-color-interactive-hover-surface);
    }

    & > .ck-list-item-button__check-holder {
      font-size: var(--ck-ai-model-selector-item-name-font-size);
      height: calc(var(--ck-line-height-base) * 1em);
      flex-shrink: 0;
      align-items: center;

      & > .ck-list-item-button__check-icon {
        height: .9em;
      }
    }

    & > .ck-button__label {
      flex: 1;
      min-width: 0;

      & > .ck-ai-model-selector__item-name {
        align-items: center;
        gap: var(--ck-spacing-gap-compact);
        display: flex;

        & > span {
          font-size: var(--ck-ai-model-selector-item-name-font-size);
          min-width: 0;
          font-weight: var(--ck-font-weight-medium);
          line-height: var(--ck-line-height-base);
          text-overflow: ellipsis;
          white-space: nowrap;
          flex: 1;
          overflow: hidden;
        }

        & > .ck-ai-model-selector__item-capabilities {
          --ck-icon-size: var(--ck-ai-model-selector-item-capability-icon-size);
          gap: var(--ck-spacing-gap-snug);
          flex-shrink: 0;
          display: flex;

          & > span {
            display: flex;
          }

          & .ck-icon {
            color: var(--ck-ai-model-selector-item-secondary-color);
            fill: var(--ck-ai-model-selector-item-secondary-color);
          }
        }
      }

      & > .ck-ai-model-selector__item-description {
        padding-top: var(--ck-spacing-gap-tight);

        & > span {
          font-size: var(--ck-ai-model-selector-item-description-font-size);
          line-height: var(--ck-line-height-base);
          color: var(--ck-ai-model-selector-item-secondary-color);
          white-space: normal;
          display: block;
        }
      }
    }
  }
}

:root, :host {
  --ck-ai-chat-model-selection-panel-max-width: 426px;
  --ck-ai-chat-model-selection-item-name-font-size: var(--ck-font-size-md);
  --ck-ai-chat-model-selection-item-description-font-size: var(--ck-font-size-sm);
  --ck-ai-chat-model-selection-item-capability-icon-size: var(--ck-font-size-base);
}

.ck.ck-ai-chat-controls {
  padding: var(--ck-spacing-padding-comfortable) var(--ck-spacing-padding-comfortable) var(--ck-spacing-padding-snug);
  border-top: var(--ck-border-width-divider) solid var(--ck-color-divider);
  position: relative;
  container-type: inline-size;

  &:has( > :first-child.ck-hidden) {
    padding-bottom: var(--ck-spacing-padding-comfortable);
  }

  &.ck-ai-chat-controls-disabled {
    opacity: .5;
    pointer-events: none;
    cursor: default;

    &:has( > .ck-ai-skeleton:not(.ck-hidden)) {
      opacity: 1;
    }
  }

  & > .ck-ai-chat-controls__content_covered {
    visibility: hidden;
  }

  &:has( > .ck-ai-skeleton:not(.ck-hidden)) .ck-ai-chat-context-controls {
    display: none;
  }

  & .ck-ai-chat-controls__drop-overlay {
    z-index: 1;
    background: var(--ck-color-base-background);
    justify-content: center;
    align-items: center;
    gap: var(--ck-spacing-gap-compact);
    flex-direction: column;
    display: none;
    position: absolute;
    inset: 0;

    & .ck-icon {
      width: 20px;
      height: 20px;
    }

    & .ck-ai-chat-controls__drop-overlay__label {
      font-size: 13px;
      font-weight: bold;
    }
  }

  &.ck-ai-chat-controls_drag-over .ck-ai-chat-controls__drop-overlay {
    display: flex;
  }

  & .ck-ai-chat-controls__model-selection {
    --ck-ai-model-selector-item-name-font-size: var(--ck-ai-chat-model-selection-item-name-font-size);
    --ck-ai-model-selector-item-description-font-size: var(--ck-ai-chat-model-selection-item-description-font-size);
    --ck-ai-model-selector-item-capability-icon-size: var(--ck-ai-chat-model-selection-item-capability-icon-size);
    --ck-ai-model-selector-item-secondary-color: var(--ck-ai-chat-icon-color);
    line-height: 0;

    & .ck-dropdown__panel.ck-dropdown__panel_ne {
      margin-bottom: var(--ck-spacing-gap-snug);
      width: min(var(--ck-ai-chat-model-selection-panel-max-width), 100cqw);
      max-width: max-content;
      max-height: 600px;
      top: auto;
      overflow-y: auto;
    }

    & .ck-button.ck-dropdown__button {
      --ck-icon-size: var(--ck-font-size-md);
      margin-inline-end: 0;

      & .ck-button__label {
        width: auto;
      }
    }
  }
}

:root, :host {
  --ck-ai-chat-prompt-input-animation-background-color: var(--ck-ai-prompt-glow-color);
  --ck-ai-chat-prompt-input-animation: ck-ai-chat-prompt-input-glow .8s ease-in-out;
  --ck-ai-chat-prompt-input-line-height: 1.4em;
  --ck-ai-chat-prompt-input-padding-vertical: calc((var(--ck-size-control-min-height) - var(--ck-ai-chat-prompt-input-line-height) - 2 * var(--ck-border-width-thin)) / 2);
  --ck-ai-chat-prompt-input-padding-inline-start: var(--ck-spacing-padding);
  --ck-ai-chat-prompt-input-padding-inline-end: 2.6em;
  --ck-ai-chat-prompt-input-font-size: var(--ck-font-size-md);
  --ck-ai-chat-prompt-submit-button-font-size: .95em;
}

.ck.ck-ai-chat__prompt-input.ck-search {
  & .ck-labeled-field-view {
    width: 100%;

    & .ck-labeled-field-view__status_error {
      line-height: 1.4em;
    }
  }

  & .ck-labeled-field-view__input-wrapper {
    & .ck.ck-input.ck-textarea {
      min-width: 0;
      padding-top: var(--ck-ai-chat-prompt-input-padding-vertical);
      padding-bottom: var(--ck-ai-chat-prompt-input-padding-vertical);
      line-height: var(--ck-ai-chat-prompt-input-line-height);
      font-size: var(--ck-ai-chat-prompt-input-font-size);
      padding-inline-start: var(--ck-ai-chat-prompt-input-padding-inline-start);
      padding-inline-end: var(--ck-ai-chat-prompt-input-padding-inline-end);
    }

    & > .ck.ck-label {
      visibility: hidden;
    }
  }

  &.ck-ai-chat__prompt-input_highlighted .ck.ck-input.ck-textarea {
    animation: var(--ck-ai-chat-prompt-input-animation);
  }

  & .ck-ai-chat__prompt-submit-button {
    height: auto;
    margin-left: var(--ck-spacing-gap);
    font-size: var(--ck-ai-chat-prompt-submit-button-font-size);
    align-self: flex-end;

    & .ck.ck-icon.ck-button__icon {
      --ck-icon-size: 20px;
    }
  }
}

@keyframes ck-ai-chat-prompt-input-glow {
  0% {
    background: var(--ck-ai-chat-prompt-input-animation-background-color);
  }

  100% {
    background: var(--ck-input-background-color);
  }
}

.ck.ck-ai-chat-controls .ck-ai-chat__prompt-capabilities {
  padding-top: var(--ck-spacing-padding);
  align-items: center;
  gap: var(--ck-spacing-gap-snug);
  display: flex;

  & .ck-ai-chat-controls__model-name {
    color: var(--ck-ai-chat-icon-color);
  }
}

:root, :host {
  --ck-ai-chat-model-unavailable-message-border-color: var(--ck-ai-tile-active-border-color);
  --ck-ai-chat-model-unavailable-message-background-color: var(--ck-ai-accent-700-a1-color);
}

.ck.ck-ai-chat-controls-model-unavailable-message {
  border: 1px solid var(--ck-ai-chat-model-unavailable-message-border-color);
  background-color: var(--ck-ai-chat-model-unavailable-message-background-color);
  border-radius: 4px;

  & p {
    white-space: normal;
    padding: var(--ck-spacing-padding-comfortable);
    line-height: 1.4;

    & button.ck-ai-chat-controls__start-new-chat-button {
      cursor: default;
      vertical-align: baseline;
      color: var(--ck-ai-chat-text-color);
      background: none;
      border: none;
      padding: 0;
      text-decoration: underline;

      &:hover {
        background: none;
      }

      &:active, &:focus {
        box-shadow: none;
        background: none;
      }
    }
  }
}

:root, :host {
  --ck-ai-chat-context-controls-balloon-width: 426px;
  --ck-ai-chat-context-controls-add-context-balloon-width: 204px;
}

.ck.ck-ai-chat-controls {
  & .ck-ai-chat-context-controls {
    place-content: center flex-start;
    align-items: flex-start;
    gap: var(--ck-spacing-gap-snug);
    padding-top: 0;
    padding-bottom: var(--ck-spacing-padding);
    flex-wrap: wrap;
    display: flex;

    &:has(.ck-ai-chat-context-controls__pending-contexts:empty) {
      padding-bottom: var(--ck-spacing-padding-compact);
    }

    & .ck-ai-chat-context-controls__pending-contexts {
      display: contents;
    }
  }

  & .ck-button.ck-ai-chat-controls-button.ck-ai-chat-context-controls__add-context-button {
    bottom: var(--ck-spacing-padding-compact);
    margin: 0;
    position: absolute;

    &:hover, &:focus {
      opacity: 1;
    }
  }
}

:root, :host {
  --ck-ai-chat-context-chip-label-font-size: var(--ck-font-size-sm);
  --ck-ai-chat-context-chip-icon-font-size: var(--ck-font-size-md);
  --ck-ai-chat-context-chip-padding: var(--ck-spacing-padding-compact) var(--ck-spacing-padding);
  --ck-ai-chat-context-chip-height: calc(var(--ck-ai-chat-context-chip-label-font-size) * var(--ck-line-height-base) +
		2 * var(--ck-spacing-sm) +
		2 * var(--ck-ai-chat-border-width));
  --ck-ai-chat-context-chip-min-width: calc(var(--ck-ai-chat-context-chip-label-font-size) * 10);
  --ck-ai-chat-context-chip-wide-min-width: calc(var(--ck-ai-chat-context-chip-label-font-size) * 20);
  --ck-ai-chat-context-balloon-width: calc(var(--ck-ai-chat-context-chip-label-font-size) * 24);
  --ck-ai-chat-context-balloon-max-height: calc(4 * var(--ck-ai-chat-context-chip-height) +
		3 * var(--ck-spacing-gap) +
		2 * var(--ck-spacing-padding));
}

.ck.ck-balloon-panel, .ck.ck-ai-chat {
  & .ck-ai-chat-context-chip {
    justify-content: center;
    align-items: center;
    gap: var(--ck-spacing-gap-compact);
    max-width: max(calc(33% - var(--ck-spacing-md) - (2 * var(--ck-spacing-lg) / 3)), var(--ck-ai-chat-context-chip-min-width));
    min-height: var(--ck-ai-chat-context-chip-height);
    box-sizing: border-box;
    width: auto;
    padding: var(--ck-ai-chat-context-chip-padding);
    background-color: var(--ck-ai-chat-user-context-background-color);
    border-radius: var(--ck-ai-border-radius);
    border: var(--ck-ai-chat-border-width) solid var(--ck-ai-chat-main-border-color);
    line-height: var(--ck-line-height-base);
    color: var(--ck-color-base-text);
    flex-shrink: 0;
    display: inline-flex;

    &.ck-ai-chat-context-chip_wide {
      max-width: max(calc(60% - var(--ck-spacing-md)), var(--ck-ai-chat-context-chip-wide-min-width));
      width: auto;
    }

    &.ck-ai-chat-context-chip_document {
      max-width: unset;
    }

    &.ck-ai-chat-context-chip_new-chip {
      animation: ck-ai-new-item-flash var(--ck-ai-chat-animation-duration) var(--ck-ai-chat-animation-timing);
    }

    & > .ck-ai-chat-context-chip__label {
      font-size: var(--ck-ai-chat-context-chip-label-font-size);
      font-weight: var(--ck-font-weight-medium);
      text-overflow: ellipsis;
      white-space: nowrap;
      min-width: 0;
      line-height: var(--ck-line-height-base);
      color: var(--ck-color-base-text);
      display: inline-block;
      overflow: hidden;
    }

    & > .ck-icon.ck-ai-chat-context-chip__type-icon {
      --ck-icon-size: var(--ck-ai-chat-context-chip-icon-font-size);
      font-size: var(--ck-ai-chat-context-chip-icon-font-size);
      fill: var(--ck-color-base-text);
      flex-shrink: 0;
    }

    & .ck-button {
      --ck-size-control-min-height: var(--ck-ai-chat-context-chip-icon-font-size);
      --ck-size-min-height: var(--ck-ai-chat-context-chip-icon-font-size);
      --ck-button-hover-background: var(--ck-color-interactive-hover-surface-strong);
      max-width: var(--ck-ai-chat-context-chip-icon-font-size);
      max-height: var(--ck-ai-chat-context-chip-icon-font-size);
      margin-inline-start: var(--ck-spacing-gap-tight);
      padding: 0;

      & > .ck-icon {
        --ck-icon-size: var(--ck-ai-chat-context-chip-icon-font-size);
        font-size: var(--ck-ai-chat-context-chip-icon-font-size);
        color: var(--ck-color-base-text);
      }
    }
  }

  & .ck-ai-chat-context-chips-wrapper {
    gap: var(--ck-spacing-gap-snug);
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    width: 100%;
    margin-bottom: 0;
    padding: 0;
    display: flex;
  }

  & .ck-ai-chat-context-chips-wrapper-balloon {
    gap: var(--ck-spacing-gap);
    width: var(--ck-ai-chat-context-balloon-width);
    max-height: var(--ck-ai-chat-context-balloon-max-height);
    padding: var(--ck-spacing-padding);
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    display: flex;
    overflow-y: auto;

    & .ck-ai-chat-context-chip {
      max-width: max(calc(50% - var(--ck-spacing-gap)), var(--ck-ai-chat-context-chip-min-width));
    }

    &.ck-ai-chat-context-chip_wide {
      max-width: 100%;
    }

    & .ck-ai-chat-context-chip.ck-ai-chat-context-chip_new-chip {
      animation: none;
    }
  }
}

@keyframes ck-ai-new-item-flash {
  0% {
    background-color: var(--ck-ai-chat-flash-color);
    color: var(--ck-ai-chat-flash-text-color);
    border-color: var(--ck-ai-chat-flash-text-color);
  }

  100% {
    background-color: var(--ck-ai-chat-user-context-background-color);
    color: var(--ck-color-base-text);
    border-color: var(--ck-ai-chat-main-border-color);
  }
}

:root, :host {
  --ck-ai-chat-controls-button-min-height: 1.5em;
}

.ck-ai-chat-controls-button:not(.ck-button_small) {
  --ck-size-min-height: var(--ck-ai-chat-controls-button-min-height);
  --ck-size-control-min-height: var(--ck-ai-chat-controls-button-min-height);
}

.ck.ck-button.ck-ai-chat-controls-button {
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  display: flex;

  & .ck-dropdown__arrow {
    display: none;
  }
}

.ck.ck-button.ck-ai-chat-controls_context_show-more-button {
  --ck-ai-chat-controls-button-min-height: var(--ck-ai-chat-context-chip-height);
  --ck-button-with-text-padding: var(--ck-spacing-padding-compact) 0;
  --ck-button-font-size: var(--ck-ai-chat-context-chip-label-font-size);
  --ck-button-border: var(--ck-ai-chat-border-width) solid var(--ck-ai-chat-main-border-color);
  --ck-button-border-radius: var(--ck-ai-border-radius);
  --ck-button-default-background-color: var(--ck-ai-chat-user-context-background-color);
  --ck-button-default-hover-background-color: var(--ck-color-interactive-hover-surface-strong);
  --ck-button-on-text-color: var(--ck-color-base-text);
  color: var(--ck-color-base-text);
  font-weight: var(--ck-font-weight-medium);
}

:root, :host {
  --ck-ai-chat-resources-list-height: calc(var(--ck-spacing-padding) +
		7 * var(--ck-size-control-min-height));
  --ck-ai-chat-context-balloon-resource-item-in-context-color: var(--ck-ai-neutral-900-a5-color);
}

.ck.ck-balloon-panel {
  &.ck-ai-chat-context-controls__add-context-balloon-panel {
    width: var(--ck-ai-chat-context-controls-add-context-balloon-width);

    & .ck-ai-chat-context-controls__balloon-list {
      --ck-list-item-min-width: 0;
      --ck-list-item-outer-padding: 0;
      gap: var(--ck-spacing-gap-tight);
    }

    & .ck-ai-chat-context-controls__balloon-button {
      min-height: var(--ck-size-control-min-height);

      & > .ck-button__icon {
        flex-shrink: 0;
      }

      & .ck-button__label {
        line-height: var(--ck-line-height-base);
        text-overflow: ellipsis;
        flex-grow: 1;
        overflow: hidden;
      }

      & > .ck-ai-chat-context-controls__balloon-button-source__arrow {
        width: var(--ck-dropdown-arrow-size);
        flex-shrink: 0;
        margin-inline-start: var(--ck-spacing-gap);

        [dir="ltr"] & {
          transform: rotate(-90deg);
        }

        [dir="rtl"] & {
          transform: rotate(90deg);
        }
      }
    }
  }

  &.ck-ai-chat-context-controls__url-balloon-panel {
    width: var(--ck-ai-chat-context-controls-balloon-width);

    & .ck-ai-chat-context-controls__url-input-section {
      padding: var(--ck-spacing-padding-spacious)
				var(--ck-spacing-padding-comfortable)
				var(--ck-spacing-padding-comfortable);
      align-items: flex-start;
      display: flex;

      & > .ck-labeled-field-view {
        width: 100%;

        & > .ck.ck-labeled-field-view__input-wrapper {
          & > .ck.ck-input {
            vertical-align: middle;
            width: 100%;
            line-height: var(--ck-line-height-base);
          }

          & > .ck.ck-label {
            visibility: hidden;
          }
        }
      }

      & > .ck.ck-button {
        height: auto;
        background-color: var(--ck-ai-chat-primary-button-background-color);
        color: var(--ck-ai-chat-primary-button-text-color);
        margin-inline-start: var(--ck-spacing-gap);

        &.ck-disabled {
          opacity: var(--ck-opacity-disabled);

          & > .ck-button__icon {
            opacity: 1;
          }
        }
      }
    }
  }

  &.ck-ai-chat-context-controls__source-balloon-panel {
    width: var(--ck-ai-chat-context-controls-balloon-width);

    &:has(.ck-ai-skeleton:not(.ck-hidden)) {
      overflow: hidden;
    }

    & .ck-search {
      padding: var(--ck-spacing-padding-spacious)
				var(--ck-spacing-padding-comfortable)
				var(--ck-spacing-padding-comfortable);
      border-bottom: var(--ck-border-width-divider) solid var(--ck-color-divider);
    }

    & .ck-ai-skeleton {
      --ck-ai-skeleton-gap: var(--ck-spacing-gap-compact);
      padding-block: var(--ck-spacing-padding);
    }

    & .ck-ai-chat-resources__list {
      --ck-list-padding: var(--ck-spacing-padding) var(--ck-spacing-padding-comfortable);
      gap: var(--ck-spacing-gap-tight);
      max-height: var(--ck-ai-chat-resources-list-height);
      overflow: hidden auto;

      & .ck-ai-chat-resources__item {
        min-height: var(--ck-size-control-min-height);
        padding-inline: var(--ck-spacing-padding-compact) var(--ck-spacing-padding-spacious);
        border-radius: var(--ck-border-radius-control);
        font-size: var(--ck-font-size-md);
        cursor: pointer;
        transition: background-color var(--ck-transition-duration-control) var(--ck-transition-timing-function-control);
        align-items: center;
        display: flex;

        &:hover {
          background-color: var(--ck-color-interactive-hover-surface);
        }

        &.ck-ai-chat-resources__item--in-context {
          color: var(--ck-ai-chat-context-balloon-resource-item-in-context-color);
          pointer-events: none;

          & * {
            color: inherit;
          }
        }

        & .ck-ai-chat-resources__item__check, & .ck-ai-chat-resources__item__icon {
          flex-shrink: 0;
          justify-content: center;
          align-items: center;
          display: flex;

          & .ck-icon {
            fill: currentColor;
          }
        }

        & .ck-ai-chat-resources__item__check {
          --ck-icon-size: var(--ck-font-size-sm);
          width: var(--ck-font-size-sm);
          margin-inline-end: var(--ck-spacing-gap-compact);
        }

        & .ck-ai-chat-resources__item__icon {
          --ck-icon-size: var(--ck-font-size-base);
          margin-inline-end: var(--ck-spacing-control-icon-gap);
        }

        & .ck-ai-chat-resources__item-title {
          font-size: var(--ck-font-size-md);
          line-height: var(--ck-line-height-base);
          text-overflow: ellipsis;
          white-space: nowrap;
          flex: 1;
          overflow: hidden;
        }
      }
    }

    & .ck-search ~ .ck-ai-chat-resources__list {
      height: var(--ck-ai-chat-resources-list-height);
    }
  }

  &.ck-ai-chat-context-controls__chip-tooltip {
    width: max-content;
    max-width: 260px;

    & .ck.ck-tooltip__text {
      white-space: normal;
      overflow-wrap: anywhere;
      display: inline-block;
    }
  }
}

:root, :host {
  --ck-ai-disclaimer-border-color: var(--ck-ai-neutral-300-color);
  --ck-ai-disclaimer-text-color: var(--ck-ai-neutral-600-color);
  --ck-ai-disclaimer-font-size: var(--ck-font-size-xs);
}

.ck.ck-ai-disclaimer {
  border-top: var(--ck-border-width-divider) solid var(--ck-ai-disclaimer-border-color);
  padding: var(--ck-spacing-padding) var(--ck-spacing-padding-spacious);

  & > .ck.ck-ai-disclaimer__content {
    color: var(--ck-ai-disclaimer-text-color);
    font-size: var(--ck-ai-disclaimer-font-size);
    line-height: var(--ck-line-height-base);
    text-align: center;
    word-break: normal;
    text-wrap: auto;
  }
}

:root, :host {
  --ck-ai-chat-main-border-color: var(--ck-ai-neutral-300-color);
  --ck-ai-chat-primary-button-background-color: var(--ck-ai-accent-700-color);
  --ck-ai-chat-primary-button-text-color: var(--ck-ai-white-color);
  --ck-ai-chat-text-color: var(--ck-ai-accent-700-color);
  --ck-ai-chat-icon-color: var(--ck-ai-neutral-600-color);
  --ck-ai-chat-border-width: var(--ck-border-width-thin);
  --ck-ai-chat-disclaimer-divider-band: var(--ck-spacing-gap-compact);
  --ck-ai-chat-disclaimer-divider-width: 210px;
  --ck-ai-chat-suggestion-icon-default-color: var(--ck-color-text);
  --ck-ai-chat-user-context-background-color: var(--ck-ai-neutral-50-color);
  --ck-ai-chat-flash-color: var(--ck-ai-accent-50-color);
  --ck-ai-chat-flash-text-color: var(--ck-ai-accent-700-color);
  --ck-ai-chat-animation-duration: .6s;
  --ck-ai-chat-animation-timing: ease-out;
}

.ck {
  &.ck-ai-chat {
    flex-direction: column;
    width: 100%;
    display: flex;

    & > .ck-ai-disclaimer {
      border-top: 0;
      margin-block-start: var(--ck-ai-chat-disclaimer-divider-band);
      position: relative;

      &:before {
        content: "";
        inset-block-start: calc(-.5 * var(--ck-ai-chat-disclaimer-divider-band));
        inset-inline: var(--ck-spacing-padding-spacious);
        max-width: var(--ck-ai-chat-disclaimer-divider-width);
        height: var(--ck-border-width-thin);
        background-color: var(--ck-color-base-border-light);
        margin-inline: auto;
        position: absolute;
      }
    }
  }
}

:root, :host {
  --ck-ai-suggestion-content-part-radius: var(--ck-radius-base);
  --ck-ai-suggestion-content-part-title-label-font-size: var(--ck-font-size-md);
  --ck-ai-suggestion-content-part-title-color: var(--ck-color-text);
  --ck-ai-suggestion-content-part-accent-color: var(--ck-ai-accent-700-color);
  --ck-ai-suggestion-content-part-active-border-color: hsla(from var(--ck-color-base-action) h s l / var(--ck-ai-alpha-5));
  --ck-ai-suggestion-content-part-hover-shadow-color: var(--ck-ai-shadow-color);
}

.ck.ck-ai-suggestion__body__content-part {
  border-radius: var(--ck-ai-suggestion-content-part-radius);
  border: 1px solid var(--ck-color-base-border);
  padding: var(--ck-spacing-padding-comfortable);
  background: var(--ck-color-base-background);
  padding-top: 0;
  animation: .2s ease-out ck-ai-suggestion-content-part-fade-in;
  position: relative;

  @media (prefers-reduced-motion: reduce) {
    animation: none;
  }

  & .ck-ai-suggestion__body__content-part__title {
    padding: var(--ck-spacing-padding) 0;
    color: var(--ck-ai-suggestion-content-part-title-color);
    justify-content: space-between;
    align-items: center;
    display: flex;

    & .ck-ai-suggestion__body__content-part__title__label {
      font-size: var(--ck-ai-suggestion-content-part-title-label-font-size);
    }
  }
}

.ck.ck-ai-suggestion__body__content-part_active {
  border-color: var(--ck-ai-suggestion-content-part-active-border-color);
  box-shadow: var(--ck-ai-tile-active-shadow);

  & .ck-ai-suggestion__body__content-part__title, & .ck-ai-suggestion__body__content-part__title .ck-toolbar .ck-icon {
    color: var(--ck-ai-suggestion-content-part-accent-color);
  }
}

.ck.ck-ai-suggestion__body__content-part_active .ck.ck-content.ck-ai-suggestion-streamable-content {
  & .ck-suggestion-marker-insertion:not([data-author-id="$aiSuggestion"]), & .ck-suggestion-marker-formatInline:not([data-author-id="$aiSuggestion"]) {
    border-top-color: var(--ck-ai-suggestion-preview-insertion-active-border-color);
    border-bottom-color: var(--ck-ai-suggestion-preview-insertion-active-border-color);
    background: var(--ck-ai-suggestion-preview-insertion-active-background-color);

    &.ck-widget {
      border-color: var(--ck-ai-suggestion-preview-insertion-active-border-color);
    }
  }

  & .ck-suggestion-marker-formatBlock:not([data-author-id="$aiSuggestion"]) {
    box-shadow: -7px 0 0 0 var(--ck-color-base-background), -10px 0 0 0 var(--ck-ai-suggestion-preview-insertion-active-background-color);
  }

  & .ck-suggestion-marker-deletion:not([data-author-id="$aiSuggestion"]) {
    border-top-color: var(--ck-ai-suggestion-preview-deletion-active-border-color);
    border-bottom-color: var(--ck-ai-suggestion-preview-deletion-active-border-color);
    background: var(--ck-ai-suggestion-preview-deletion-active-background-color);

    &.ck-widget {
      border-color: var(--ck-ai-suggestion-preview-deletion-active-border-color);
    }
  }
}

.ck.ck-ai-suggestion__body__content-part_accepted, .ck.ck-ai-suggestion__body__content-part_rejected, .ck.ck-ai-suggestion__body__content-part_outdated {
  & .ck-ai-suggestion-streamable-content, & .ck-ai-suggestion__body__content-part__title__label {
    opacity: .5;
  }
}

.ck.ck-ai-suggestion__body__content-part_pending:hover {
  box-shadow: 0 0 3px 1.5px var(--ck-ai-suggestion-content-part-hover-shadow-color);

  & .ck-ai-suggestion__body__content-part__title, & .ck-toolbar .ck-icon {
    color: var(--ck-ai-suggestion-content-part-accent-color);
  }
}

@keyframes ck-ai-suggestion-content-part-fade-in {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

:root, :host {
  --ck-ai-suggestion-content-part-toolbar-button-active-text-color: var(--ck-color-base-action);
  --ck-ai-suggestion-content-part-toolbar-button-hover-text-color: var(--ck-color-base-action);
  --ck-ai-suggestion-content-part-toolbar-button-active-background-color: var(--ck-color-interactive-selected-surface);
  --ck-ai-suggestion-content-part-toolbar-button-hover-background-color: var(--ck-color-interactive-hover-surface);
}

.ck.ck-toolbar.ck-ai-suggestion-content-part-toolbar {
  border: 0;
  padding: 0;

  & .ck-toolbar__items {
    gap: var(--ck-spacing-gap);
  }

  & .ck-button {
    color: var(--ck-ai-chat-suggestion-icon-default-color);
    margin: 0;

    &:active {
      background-color: var(--ck-ai-suggestion-content-part-toolbar-button-active-background-color);
      color: var(--ck-ai-suggestion-content-part-toolbar-button-active-text-color);
    }

    &:hover {
      background-color: var(--ck-ai-suggestion-content-part-toolbar-button-hover-background-color);
      color: var(--ck-ai-suggestion-content-part-toolbar-button-hover-text-color);
    }
  }
}

div.ck.ck-ai-suggestion__content-part-state {
  display: flex;

  & .ck-pill_accepted {
    --ck-pill-color: var(--ck-ai-suggestion-pill-accepted-text-color);
    --ck-pill-background: var(--ck-ai-suggestion-pill-accepted-background-color);
  }

  & .ck-pill_rejected {
    --ck-pill-color: var(--ck-ai-suggestion-pill-rejected-text-color);
    --ck-pill-background: var(--ck-ai-suggestion-pill-rejected-background-color);
  }

  & .ck-pill_outdated {
    --ck-pill-color: var(--ck-ai-suggestion-pill-outdated-text-color);
    --ck-pill-background: var(--ck-ai-suggestion-pill-outdated-background-color);
  }
}

:root, :host {
  --ck-ai-chat-balloon-height: 280px;
}

.ck.ck-ai-chat-balloon {
  height: var(--ck-ai-chat-balloon-height);

  & .ck.ck-form__header {
    gap: var(--ck-spacing-gap);

    & .ck-ai-chat-balloon-header-separator {
      height: var(--ck-icon-size);
      background: var(--ck-color-divider);
      width: 1px;
      min-width: 1px;
      margin-top: var(--ck-spacing-gap-compact);
      margin-bottom: var(--ck-spacing-gap-compact);
      display: inline-block;
    }

    & .ck-form__header__label {
      & .ck-ai-chat-balloon__label-faded {
        color: var(--ck-ai-neutral-600-color);
        vertical-align: baseline;
      }
    }
  }

  & .ck.ck-ai-chat-balloon-main {
    &.ck-ai-chat-balloon-main_state_accepted, &.ck-ai-chat-balloon-main_state_rejected, &.ck-ai-chat-balloon-main_state_outdated {
      & .ck-ai-suggestion-streamable-content {
        opacity: .5;
      }
    }
  }
}

:root, :host {
  --ck-ai-toggle-on-background-color: var(--ck-ai-accent-50-color);
  --ck-ai-toggle-on-hover-background-color: var(--ck-ai-accent-100-color);
  --ck-ai-toggle-on-active-background-color: var(--ck-ai-accent-100-color);
  --ck-ai-toggle-on-disabled-background-color: var(--ck-ai-accent-50-color);
  --ck-ai-toggle-on-text-color: var(--ck-ai-accent-700-color);
}

.ck.ck-button.ck-ai-toggle-button {
  --ck-button-on-background-color: var(--ck-ai-toggle-on-background-color);
  --ck-button-on-hover-background-color: var(--ck-ai-toggle-on-hover-background-color);
  --ck-button-on-active-background-color: var(--ck-ai-toggle-on-active-background-color);
  --ck-button-on-disabled-background-color: var(--ck-ai-toggle-on-disabled-background-color);
  --ck-button-on-text-color: var(--ck-ai-toggle-on-text-color);
}

:root, :host {
  --ck-ai-tabs-overlay-top-position: 0;
  --ck-ai-tabs-overlay-right-position: 0;
  --ck-ai-tabs-overlay-left-position: auto;
  --ck-ai-tabs-overlay-bottom-position: auto;
  --ck-ai-tabs-overlay-height: 100%;
  --ck-ai-tabs-overlay-width: 500px;
  --ck-ai-tabs-overlay-width-maximized: 50%;
  --ck-ai-tabs-overlay-z-index: calc(var(--ck-z-modal) - 1);
}

.ck.ck-tabs.ck-ai-tabs {
  --ck-tabs-buttons-container-buttons-vertical-spacing: 60px;

  &.ck-ai-tabs_collapsed {
    & .ck-tabs__buttons-container {
      border: none;
    }

    & .ck-tabs__panels-container {
      flex-grow: 0;
      overflow: hidden;
    }

    &.ck-tabs_left, &.ck-tabs_right {
      width: fit-content;
      min-width: 0;

      & .ck-tabs__panels-container {
        width: 0;
      }
    }

    &.ck-tabs_top {
      height: fit-content;
      min-height: 0;

      & .ck-tabs__panels-container {
        height: 0;
      }
    }
  }

  &.ck-ai-tabs__overlay {
    --ck-tabs-border-radius: 0;
    height: var(--ck-ai-tabs-overlay-height);
    top: var(--ck-ai-tabs-overlay-top-position);
    right: var(--ck-ai-tabs-overlay-right-position);
    left: var(--ck-ai-tabs-overlay-left-position);
    bottom: var(--ck-ai-tabs-overlay-bottom-position);
    z-index: var(--ck-ai-tabs-overlay-z-index);
    width: var(--ck-ai-tabs-overlay-width);
    transition: width var(--ck-duration-slow) ease;
    border-top: 0;
    border-bottom: 0;
    position: fixed;

    &.ck-ai-tabs_maximized {
      width: var(--ck-ai-tabs-overlay-width-maximized);
    }

    &.ck-ai-tabs_collapsed {
      --ck-ai-tabs-overlay-width: 0;
    }

    &.ck-tabs_left {
      --ck-ai-tabs-overlay-right-position: auto;
      --ck-ai-tabs-overlay-left-position: 0;
      border-left: 0;
    }

    &.ck-tabs_right {
      border-right: 0;
    }
  }
}

:root, :host {
  --ck-tabs-buttons-container-buttons-vertical-spacing: 0;
  --ck-tabs-panels-container-background: var(--ck-ai-white-color);
  --ck-tab-button-gap: var(--ck-spacing-gap);
  --ck-color-tabs-buttons-container-background: var(--ck-color-base-foreground);
}

.ck.ck-tabs {
  --ck-tabs-border-radius: var(--ck-border-radius-surface);
  font-size: var(--ck-font-size-base);
  border: var(--ck-border-surface);
  border-radius: var(--ck-tabs-border-radius);
  min-width: 0;
  display: flex;

  &.ck-tabs_top {
    flex-direction: column;
  }

  &.ck-tabs_left {
    flex-direction: row;
  }

  &.ck-tabs_right {
    flex-direction: row-reverse;
  }
}

.ck-tabs__panels-container {
  background-color: var(--ck-tabs-panels-container-background);
  flex-grow: 1;
  min-width: 0;
  transition: width .8s ease-in-out, height .8s ease-in-out;

  &.ck-tabs__panels-container_top {
    border-end-end-radius: var(--ck-tabs-border-radius);
    border-end-start-radius: var(--ck-tabs-border-radius);
  }

  &.ck-tabs__panels-container_left {
    border-start-end-radius: var(--ck-tabs-border-radius);
    border-end-end-radius: var(--ck-tabs-border-radius);
  }

  &.ck-tabs__panels-container_right {
    border-start-start-radius: var(--ck-tabs-border-radius);
    border-end-start-radius: var(--ck-tabs-border-radius);
  }
}

.ck-tabs__buttons-container {
  background-color: var(--ck-color-tabs-buttons-container-background);
  gap: var(--ck-tab-button-gap);
  display: flex;

  &.ck-tabs__buttons-container_top {
    border-top: none;
    border-bottom: var(--ck-border-width-divider) solid var(--ck-color-divider);
    border-start-start-radius: var(--ck-tabs-border-radius);
    border-start-end-radius: var(--ck-tabs-border-radius);
    flex-direction: row;
  }

  &.ck-tabs__buttons-container_left {
    border-left: none;
    border-right: var(--ck-border-width-divider) solid var(--ck-color-divider);
    border-start-start-radius: var(--ck-tabs-border-radius);
    border-end-start-radius: var(--ck-tabs-border-radius);
  }

  &.ck-tabs__buttons-container_right {
    border-right: none;
    border-left: var(--ck-border-width-divider) solid var(--ck-color-divider);
    border-start-end-radius: var(--ck-tabs-border-radius);
    border-end-end-radius: var(--ck-tabs-border-radius);
  }

  &.ck-tabs__buttons-container_left, &.ck-tabs__buttons-container_right {
    padding-top: var(--ck-tabs-buttons-container-buttons-vertical-spacing);
    padding-bottom: var(--ck-tabs-buttons-container-buttons-vertical-spacing);
    flex-direction: column;
  }
}

:root, :host {
  --ck-ai-skeleton-z-index: calc(var(--ck-z-base) + 1);
  --ck-ai-core-skeleton-gradient-edge-color: var(--ck-ai-skeleton-base-color);
  --ck-ai-core-skeleton-gradient-mid-color: var(--ck-ai-skeleton-flash-color);
  --ck-ai-skeleton-item-background: linear-gradient(90deg,
		var(--ck-ai-core-skeleton-gradient-edge-color) 0%,
		var(--ck-ai-core-skeleton-gradient-mid-color) 50%,
		var(--ck-ai-core-skeleton-gradient-edge-color) 100%);
  --ck-ai-skeleton-animation-duration: 1s;
  --ck-ai-skeleton-gap: var(--ck-spacing-gap);
  --ck-ai-skeleton-row-gap: var(--ck-spacing-gap-compact);
}

.ck.ck-ai-skeleton {
  z-index: var(--ck-ai-skeleton-z-index);
  align-items: flex-end;
  gap: var(--ck-ai-skeleton-gap) 0;
  padding: var(--ck-spacing-padding-spacious) var(--ck-spacing-padding-comfortable) var(--ck-spacing-padding-comfortable);
  background-color: var(--ck-color-base-background);
  opacity: 1;
  width: 100%;
  height: 100%;
  transition: opacity .4s, display .4s allow-discrete;
  flex-direction: column;
  transition-delay: .35s;
  display: flex;
  position: absolute;
  inset: 0;

  &.ck-hidden {
    opacity: 0;
    transition-delay: 0s;
  }

  @starting-style {
    opacity: 0;
  }

  & .ck.ck-ai-skeleton__item {
    background: var(--ck-ai-skeleton-item-background);
    animation: var(--ck-ai-skeleton-animation-duration) ck-ai-skeleton-shine linear infinite;
    background-size: 200% 100%;
    width: 100%;
    max-width: 100%;
  }

  & > .ck.ck-ai-skeleton__row {
    gap: var(--ck-ai-skeleton-row-gap) 0;
    flex-direction: column;
    width: 100%;
    display: flex;
  }
}

@keyframes ck-ai-skeleton-shine {
  to {
    background-position-x: -200%;
  }
}

:root, :host {
  --ck-ai-chat-history-check-slot-width: calc(var(--ck-font-size-md) * var(--ck-icon-size-ratio));
  --ck-ai-chat-history-section-title-font-size: var(--ck-font-size-sm);
  --ck-ai-chat-history-section-title-padding: var(--ck-spacing-padding-compact) var(--ck-spacing-padding-comfortable) 0 var(--ck-spacing-padding-comfortable);
  --ck-ai-chat-history-item-title-font-size: var(--ck-font-size-md);
  --ck-ai-chat-history-item-title-height: calc(var(--ck-line-height-base) * var(--ck-ai-chat-history-item-title-font-size) + var(--ck-spacing-md));
  --ck-ai-chat-history-item-date-font-size: var(--ck-font-size-md);
}

.ck .ck-ai-chat-history {
  --ck-search-results-info-secondary-font-size: var(--ck-font-size-md);
  flex-direction: column;
  height: 100%;
  display: flex;

  & .ck-ai-chat-history__content, & .ck-search {
    gap: var(--ck-spacing-gap-snug);
    flex-direction: column;
    flex: auto;
    min-height: 0;
    display: flex;
    position: relative;
  }

  & .ck-ai-chat-history__content {
    & .ck-ai-notification_error {
      margin: var(--ck-spacing-gap-spacious) var(--ck-spacing-gap-comfortable) var(--ck-spacing-gap) var(--ck-spacing-gap-comfortable);
    }
  }

  & .ck-search > .ck-labeled-field-view {
    margin-top: var(--ck-spacing-gap);
    padding: var(--ck-spacing-padding-comfortable)
			var(--ck-spacing-padding-comfortable)
			var(--ck-spacing-padding-tight);
  }

  & .ck-search__results {
    flex: auto;
    min-height: 0;
    overflow: hidden auto;
  }

  & .ck-dropdown .ck-dropdown__arrow {
    display: none;
  }

  & .ck-ai-chat-history__section {
    gap: var(--ck-spacing-gap-snug);
    flex-direction: column;
    display: flex;
  }

  & .ck-ai-chat-history__section > .ck-list {
    gap: var(--ck-spacing-gap-snug);
    padding: 0;
  }

  & .ck-dropdown .ck-dropdown__panel .ck-list {
    --ck-list-item-min-width: auto;
  }

  & .ck-dropdown .ck-dropdown__panel .ck-list__item > .ck-button {
    min-height: var(--ck-size-control-min-height);

    & .ck-button__label {
      line-height: var(--ck-line-height-base);
    }
  }

  & .ck-ai-chat-history__sections {
    gap: var(--ck-spacing-gap-snug);
  }

  & .ck.ck-dropdown .ck-button.ck-dropdown__button:not(.ck-button_with-text) {
    padding: 0;
  }

  & .ck-ai-chat-history__section-title {
    color: var(--ck-color-base-text-light);
    font-size: var(--ck-ai-chat-history-section-title-font-size);
    font-weight: var(--ck-font-weight-bold);
    line-height: var(--ck-line-height-base);
    padding: var(--ck-ai-chat-history-section-title-padding);
  }

  & .ck-confirm-view .ck-confirm-view-inner, & .ck-ai-chat-history__item {
    padding-block: var(--ck-spacing-padding-tight);
    padding-inline: var(--ck-spacing-padding-comfortable) var(--ck-spacing-padding-spacious);
  }

  & .ck-ai-chat-history__item {
    gap: var(--ck-spacing-gap);
    border-radius: var(--ck-radius-md);
    transition: transform var(--ck-duration-slow) ease;
    display: flex;
    position: relative;

    @media (prefers-reduced-motion: reduce) {
      transition: none;
    }

    &:not(.ck-confirm-view-active):hover {
      background-color: var(--ck-color-base-hover);
    }
  }

  & .ck-ai-chat-history__item-title-container {
    width: 100%;
    min-width: 0;
  }

  & .ck-ai-chat-history__item-title {
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
    font-size: var(--ck-ai-chat-history-item-title-font-size);
    color: var(--ck-color-base-text);
    display: inline-block;
    overflow: hidden;
  }

  & .ck-ai-loader__text {
    font-size: var(--ck-ai-chat-history-item-title-font-size);
    line-height: var(--ck-line-height-base);
    color: var(--ck-color-base-text-light);
  }

  & .ck-ai-chat-history__item--active {
    & .ck-ai-chat-history__item-title {
      font-weight: var(--ck-font-weight-bold);
    }
  }

  & .ck-ai-chat-history__item-row {
    width: 100%;
    min-width: 0;
  }

  & .ck-ai-chat-history__item-row, & .ck-ai-chat-history__item-actions {
    align-items: center;
    gap: var(--ck-spacing-gap);
    display: flex;
  }

  & .ck-ai-chat-history__item-actions {
    height: 100%;

    & .ck-dropdown {
      & .ck-dropdown__panel {
        & .ck-list__item {
          & .ck-button {
            &:hover, &:active {
              background-color: var(--ck-color-interactive-hover-surface);
            }
          }
        }
      }
    }
  }

  & .ck-ai-chat-history__item--edit .ck-input, & .ck-ai-chat-history__item--edit .ck-input_focused {
    width: 100%;
    min-width: 0;
    min-height: 0;
    box-shadow: none;
    background: none;
    border: none;
    padding: 0;
  }

  & .ck-ai-chat-history__item--edit {
    background: var(--ck-color-base-hover);

    & .ck-ai-chat-history__item-edit .ck-input {
      background: var(--ck-color-base-hover);
    }

    & .ck-ai-chat-history__item-actions {
      align-items: center;
    }
  }

  & .ck-ai-chat-history__item-content {
    flex-direction: column;
    flex: 1 0 0;
    justify-content: center;
    align-items: flex-start;
    display: flex;
    overflow: hidden;
  }

  & .ck-ai-chat-history__item-main-content {
    width: 100%;
    min-height: var(--ck-ai-chat-history-item-title-height);
    align-items: center;
    display: flex;
  }

  & .ck-ai-chat-history__item-check-container {
    height: var(--ck-size-control-min-height);
    --ck-icon-size: var(--ck-font-size-base);
    min-width: var(--ck-ai-chat-history-check-slot-width);
    align-items: center;
    display: flex;
  }

  & .ck-ai-chat-history__item-date {
    line-height: var(--ck-line-height-base);
    font-size: var(--ck-ai-chat-history-item-date-font-size);
    color: var(--ck-color-base-text-light);
  }

  & .ck-ai-chat-history__empty {
    padding: var(--ck-spacing-padding-comfortable);

    & .ck-ai-chat-history__empty-message {
      text-wrap: auto;
      font-size: var(--ck-font-size-md);
      line-height: var(--ck-line-height-base);
      margin: 0;
    }
  }

  & .ck-confirm-view {
    background: var(--ck-ai-error-background-color);
    border-radius: var(--ck-radius-md);

    & .ck-confirm-view-inner {
      justify-content: space-between;
      align-items: center;
      gap: var(--ck-spacing-gap);
      flex-direction: row;
      flex: 1 0 0;
      padding-inline-start: calc(var(--ck-spacing-padding-comfortable) + var(--ck-ai-chat-history-check-slot-width) + var(--ck-spacing-padding));

      & > p {
        font-size: var(--ck-font-size-md);
        line-height: var(--ck-line-height-base);
        text-wrap: auto;
      }
    }

    & .ck-confirm-view-actions {
      gap: var(--ck-spacing-gap);
      display: flex;
    }
  }

  & .ck.ck-ai-skeleton {
    --ck-ai-skeleton-gap: var(--ck-spacing-gap-snug);
    padding-inline: calc(var(--ck-spacing-padding-compact) + var(--ck-spacing-padding-comfortable)) calc(var(--ck-spacing-padding-compact) + var(--ck-spacing-padding-spacious));

    & .ck.ck-ai-skeleton__item {
      border-radius: var(--ck-radius-sm);
    }
  }

  & .ck.ck-search > .ck-search__results > .ck-search__info > span:last-child {
    line-height: var(--ck-line-height-base);
    color: var(--ck-color-base-text-light);
    margin-top: var(--ck-spacing-gap-tight);
  }
}

:root, :host {
  --ck-ai-actions-toolbar-button-default-hover-background-color: var(--ck-ai-neutral-100-color);
  --ck-ai-actions-toolbar-button-on-background-color: var(--ck-ai-accent-50-color);
  --ck-ai-actions-toolbar-button-on-hover-background-color: var(--ck-ai-accent-100-color);
  --ck-ai-actions-toolbar-button-on-active-background-color: var(--ck-ai-accent-100-color);
  --ck-ai-actions-toolbar-button-on-disabled-background-color: var(--ck-ai-accent-50-color);
  --ck-ai-actions-toolbar-button-on-text-color: var(--ck-ai-accent-700-color);
  --ck-ai-actions-dropdown-search-border-color: var(--ck-ai-neutral-300-color);
  --ck-ai-actions-search-result-highlight-text-color: var(--ck-ai-neutral-600-color);
  --ck-ai-quick-actions-button-text-color: var(--ck-ai-accent-700-color);
  --ck-ai-quick-actions-button-background-color: var(--ck-ai-neutral-100-color);
  --ck-ai-quick-actions-button-hover-background-color: var(--ck-ai-neutral-100-color);
  --ck-ai-quick-actions-list-item-group-row-color: var(--ck-ai-neutral-600-color);
  --ck-ai-quick-actions-dropdown-max-width: 278px;
  --ck-ai-quick-actions-list-visible-items: 9;
  --ck-ai-quick-actions-list-max-height: calc(2 * var(--ck-list-padding) +
		var(--ck-ai-quick-actions-list-visible-items) * (var(--ck-size-control-min-height) + 2 * var(--ck-border-width-control)) +
		(var(--ck-ai-quick-actions-list-visible-items) - 1) * var(--ck-spacing-gap-compact));
}

.ck-dropdown > .ck-dropdown__panel > .ck-ai-quick-actions {
  max-width: var(--ck-ai-quick-actions-dropdown-max-width);

  & .ck-list {
    --ck-list-item-outer-padding: 0;
    gap: var(--ck-spacing-gap-compact);
    max-height: var(--ck-ai-quick-actions-list-max-height);
    overflow: hidden auto;

    & .ck-button__label {
      text-overflow: ellipsis;
      min-width: 0;
      overflow: hidden;
    }
  }
}

.ck-ai-quick-actions-group-panel > .ck-ai-quick-actions-group-list {
  --ck-list-item-outer-padding: 0;
  gap: var(--ck-spacing-gap-compact);
  max-width: var(--ck-ai-quick-actions-dropdown-max-width);

  & span {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }
}

.ck-toolbar__items {
  & > .ck.ck-button.ck-ai-quick-actions-button, & > .ck-ai-quick-actions-dropdown > .ck.ck-button {
    --ck-button-default-hover-background-color: var(--ck-ai-actions-toolbar-button-default-hover-background-color);
    --ck-button-on-background-color: var(--ck-ai-actions-toolbar-button-on-background-color);
    --ck-button-on-hover-background-color: var(--ck-ai-actions-toolbar-button-on-hover-background-color);
    --ck-button-on-active-background-color: var(--ck-ai-actions-toolbar-button-on-active-background-color);
    --ck-button-on-disabled-background-color: var(--ck-ai-actions-toolbar-button-on-disabled-background-color);
    --ck-button-on-text-color: var(--ck-ai-actions-toolbar-button-on-text-color);
  }
}

.ck-ai-quick-actions-dropdown, .ck-ai-quick-actions-group-panel {
  --ck-list-button-hover-background-color: var(--ck-ai-quick-actions-button-background-color);
  --ck-button-default-hover-background-color: var(--ck-ai-quick-actions-button-hover-background-color);
  --ck-button-on-background-color: var(--ck-ai-quick-actions-button-background-color);
  --ck-button-on-hover-background-color: var(--ck-ai-quick-actions-button-background-color);

  & .ck.ck-button.ck-dropdown__button.ck-on {
    color: var(--ck-ai-quick-actions-button-text-color);
  }

  & .ck.ck-button:not(.ck-dropdown__button) {
    box-shadow: none;
    border-color: #0000;

    &:focus:not(.ck-disabled) {
      background: var(--ck-list-button-hover-background-color);
    }
  }

  & .ck-ai-quick-actions-search > .ck-search__query_with-icon {
    padding: var(--ck-spacing-padding-spacious)
			var(--ck-spacing-padding-comfortable)
			var(--ck-spacing-padding-comfortable);
  }

  & .ck-ai-quick-actions-search > .ck-search__results {
    border-top: var(--ck-border-width-divider) solid var(--ck-ai-actions-dropdown-search-border-color);
  }

  & .ck-search__info {
    width: 100%;
    padding: var(--ck-spacing-padding) var(--ck-spacing-padding-comfortable);

    & * {
      white-space: normal;
    }

    & > span:first-child {
      font-weight: bold;
      display: block;
    }

    &:not(.ck-hidden) ~ .ck.ck-list {
      display: none;
    }
  }

  & .ck-ai-quick-actions-button_with-group__open-paren {
    margin-inline-start: var(--ck-spacing-gap);
  }

  & .ck-list__item > .ck.ck-button.ck-ai-quick-actions-search-result-button {
    width: 100%;
    margin-bottom: 0;

    & .ck-button__label {
      width: 100%;
    }

    & .ck-ai-quick-actions-search-result__content {
      flex-direction: column;
      width: 100%;
      display: flex;
    }

    & .ck-ai-quick-actions-search-result__group-row {
      color: var(--ck-ai-quick-actions-list-item-group-row-color);
      font-size: var(--ck-font-size-sm);
      line-height: var(--ck-line-height-base);
      margin-bottom: var(--ck-spacing-gap-tight);
      align-items: center;
      display: flex;

      & .ck-icon {
        --ck-icon-size: var(--ck-font-size-sm);
        margin-inline-end: var(--ck-spacing-gap-compact);
      }

      & .ck.ck-highlighted-text {
        color: var(--ck-ai-actions-search-result-highlight-text-color);
        font-size: var(--ck-font-size-xs);
        line-height: var(--ck-line-height-base);
        margin-inline-start: var(--ck-spacing-gap-compact);
      }
    }

    &:not(.ck-ai-quick-actions-search-result-button_with-group) .ck-button__label > .ck-icon {
      display: none;
    }

    & .ck-ai-quick-actions-search-result__action-row {
      align-items: center;
      display: flex;

      & span {
        line-height: var(--ck-line-height-base);
      }
    }

    &.ck-ai-quick-actions-search-result-button_with-group span {
      white-space: normal;
    }
  }

  & .ck.ck-button.ck-disabled {
    opacity: var(--ck-opacity-disabled);
  }

  & .ck-list__item:last-child > .ck.ck-button:not(.ck-list-item-button) {
    margin-bottom: 0;
  }
}

.ck.ck-ai-mini-toolbar {
  & .ck-toolbar__items > :first-child {
    margin-left: 0;
  }

  & .ck-ai-interaction-counter {
    color: var(--ck-ai-chat-icon-color);
    font-size: var(--ck-font-size-md);
    margin: 0;
    line-height: 1.5em;
  }

  & .ck.ck-button {
    margin-right: var(--ck-spacing-gap);

    &.ck-ai-navigation-button {
      margin-right: var(--ck-spacing-gap-snug);
    }

    &.ck-ai-mini-toolbar-copy-button {
      & .ck-ai-mini-toolbar-copy-button__check-mark {
        color: var(--ck-color-base-action);
        display: none;
        position: absolute;
        top: 50%;
        right: 50%;
        transform: translate(50%, -50%);
      }

      &.ck-ai-mini-toolbar-copy-button_copied {
        & .ck-button__icon {
          display: none;
        }

        & .ck-ai-mini-toolbar-copy-button__check-mark {
          animation-name: ck-ai-mini-toolbar-copy-animation;
          animation-duration: 1s;
          animation-timing-function: ease-out;
          animation-iteration-count: 1;
          display: block;
        }
      }
    }
  }
}

@keyframes ck-ai-mini-toolbar-copy-animation {
  0% {
    clip-path: inset(0 100% 0 0);
  }

  50% {
    clip-path: inset(0);
  }

  100% {
    clip-path: inset(0);
  }
}

.ck.ck-content.ck-ai-suggestion-streamable-content {
  -webkit-user-select: text;
  user-select: text;
  padding: 0;
  padding-top: 3px;
  padding-bottom: 3px;
  overflow-x: auto;

  & :first-child {
    margin-top: 0;
  }

  & :last-child {
    margin-bottom: 0;
  }

  &, & * {
    white-space: normal;
  }

  & pre > code {
    white-space: pre-wrap;
  }

  & .ck-suggestion-marker-insertion:not([data-author-id="$aiSuggestion"]), & .ck-suggestion-marker-formatInline:not([data-author-id="$aiSuggestion"]) {
    border-top: 3px solid var(--ck-ai-suggestion-preview-insertion-border-color);
    border-bottom: 3px solid var(--ck-ai-suggestion-preview-insertion-border-color);
    background: var(--ck-ai-suggestion-preview-insertion-background-color);

    &.ck-widget {
      border: 3px solid var(--ck-ai-suggestion-preview-insertion-border-color);
    }
  }

  & .ck-suggestion-marker-deletion:not([data-author-id="$aiSuggestion"]) {
    border-top: 3px solid var(--ck-ai-suggestion-preview-deletion-border-color);
    border-bottom: 3px solid var(--ck-ai-suggestion-preview-deletion-border-color);
    background: var(--ck-ai-suggestion-preview-deletion-background-color);

    &.ck-widget {
      border: 3px solid var(--ck-ai-suggestion-preview-deletion-border-color);
    }
  }

  & .ck-suggestion-marker-formatBlock:not([data-author-id="$aiSuggestion"]) {
    box-shadow: -7px 0 0 0 var(--ck-color-base-background), -10px 0 0 0 var(--ck-ai-suggestion-preview-insertion-background-color);
  }

  & > .ck-suggestion-marker-formatBlock:not(.table:not(.layout-table):not(.table-style-align-left):not(.table-style-block-align-left)):not(.image:not(.image-style-align-left):not(.image-style-block-align-left)):not(.media:not(.media-style-align-left):not(.media-style-block-align-left)) {
    margin-left: 10px;
  }

  & .ck-suggestion-marker-deletion:not([data-author-id="$aiSuggestion"]) {
    text-decoration: line-through 3px;
    text-decoration-color: var(--ck-ai-suggestion-preview-deletion-stroke-color);
  }

  & .ck-suggestion-marker-insertion.table > tbody > tr > td {
    background-color: var(--ck-suggestion-widget-insertion-background-color);
  }
}

:root, :host {
  --ck-ai-actions-balloon-height: 280px;
}

.ck.ck-ai-actions-balloon {
  height: var(--ck-ai-actions-balloon-height);
}

:root, :host {
  --ck-ai-balloon-disclaimer-text-color: var(--ck-ai-neutral-600-color);
}

.ck.ck-ai-balloon {
  --ck-border-radius: 4px;
  --ck-radius-base: 4px;
  flex-direction: column;
  justify-content: space-between;
  display: flex;

  & .ck-dialog__content {
    flex-direction: column;
    flex-grow: 1;
    min-height: 0;
    display: flex;
  }

  & .ck.ck-form__header {
    border-bottom: none;

    & .ck-form__header__label {
      font-weight: 600;
      line-height: 1.5em;
    }
  }

  & .ck.ck-ai-suggestion__error.ck-ai-balloon-error {
    --ck-border-radius: 4px;
    --ck-radius-base: 4px;
    margin: var(--ck-spacing-gap-comfortable) var(--ck-spacing-gap-comfortable) 0;

    & .ck-ai-suggestion__error-text {
      font-size: var(--ck-font-size-md);
      background-color: var(--ck-ai-notification-error-background-color);
      border: 1px solid var(--ck-ai-notification-error-border-color);
      color: var(--ck-ai-notification-text-color);
      padding: var(--ck-spacing-padding);
      border-radius: var(--ck-radius-base);
      line-height: 1.5em;
      display: block;
    }
  }

  & .ck-ai-balloon-main {
    flex-direction: column;
    flex-grow: 1;
    justify-content: space-between;
    width: 700px;
    max-width: 100%;
    min-height: 0;
    display: flex;

    & .ck-ai-balloon__content {
      box-sizing: border-box;
      flex-direction: column;
      flex: 210px;
      min-height: 0;
      display: flex;
      position: relative;
    }

    & .ck-ai-suggestion-streamable-content {
      box-sizing: border-box;
      padding: var(--ck-spacing-padding-comfortable);
      flex: 1;
      max-width: 100%;
      min-height: 0;
      overflow-y: auto;
    }

    & .ck-ai-balloon__disclaimer {
      padding: var(--ck-spacing-padding-comfortable) var(--ck-spacing-padding-comfortable) var(--ck-spacing-padding-compact);
      border-top: 1px solid var(--ck-color-base-border);

      & .ck-ai-balloon__disclaimer-content {
        color: var(--ck-ai-balloon-disclaimer-text-color);
        font-size: var(--ck-font-size-xs);
        text-align: left;
        word-break: normal;
        text-wrap: auto;
        line-height: 1.5em;
      }
    }

    & .ck-ai-balloon__toolbar-container {
      padding: 0 var(--ck-spacing-padding-comfortable) var(--ck-spacing-padding-comfortable);
      justify-content: space-between;
      align-items: center;
      display: flex;

      & > * {
        border: 0;
        align-items: center;
        margin: 0;
        padding: 0;
        display: flex;
      }

      & .ck-toolbar__items * {
        margin-top: 0;
        margin-bottom: 0;
      }

      & .ck-ai-balloon__toolbar {
        flex-shrink: 0;

        & .ck.ck-button:not(:last-child) {
          margin-right: var(--ck-spacing-gap);
        }
      }
    }
  }
}

.ck.ck-editor__editable.ck-editor__editable_inline-root > :first-child {
  margin-top: 0;
}

.ck.ck-editor__editable.ck-editor__editable_inline-root > :last-child {
  margin-bottom: 0;
}

.ck.ck-balloon-panel.ck-dropdown-menu__nested-menu__panel.ck-ai-quick-actions-group-panel {
  max-height: 316px;
}

:root, :host {
  --ck-ai-balloon-fake-selection-background-color: var(--ck-ai-accent-100-color);
  --ck-ai-balloon-fake-selection-outline-color: var(--ck-ai-accent-100-color);
}

.ck span.ck-fake-ai-selection {
  background: var(--ck-ai-selection-color, var(--ck-ai-balloon-fake-selection-background-color));
}

.ck .ck-widget.ck-fake-ai-selection:not(.ck-fake-ai-selection-context) {
  outline-color: var(--ck-ai-selection-color, var(--ck-ai-balloon-fake-selection-outline-color));
}

.ck.ck-editor__editable span.ck-fake-ai-selection-context {
  background: none;
}

.ck.ck-editor__editable .ck-widget.ck-fake-ai-selection-context:not(.ck-widget_selected) {
  outline-color: #0000;
}

.ck.ck-editor__editable:not(:focus) span.ck-fake-ai-selection-context {
  background: var(--ck-ai-balloon-fake-selection-background-color);
}

.ck.ck-editor__editable:not(:focus) .ck-widget.ck-fake-ai-selection-context:not(.ck-widget_selected) {
  outline-color: var(--ck-ai-balloon-fake-selection-outline-color);
}

:root, :host {
  --ck-ai-review-navigation-panel-inset: var(--ck-spacing-lg);
  --ck-ai-review-navigation-panel-max-width: 750px;
  --ck-ai-review-navigation-panel-header-background: var(--ck-color-base-foreground);
}

.ck.ck-balloon-panel.ck-ai_review-navigation-panel-balloon {
  max-width: var(--ck-ai-review-navigation-panel-max-width);
  box-shadow: none;
  transition: top var(--ck-transition-duration-control-emphasized) ease,
		left var(--ck-transition-duration-control-emphasized) ease;
  background: none;
  border: 0;

  @media (prefers-reduced-motion: reduce) {
    transition: none;
  }

  & > .ck-ai_review-navigation-panel {
    margin-inline: var(--ck-ai-review-navigation-panel-inset);
    border: var(--ck-border-surface);
    border-radius: var(--ck-border-radius-surface);
    background: var(--ck-color-surface-canvas);
    box-shadow: var(--ck-shadow-surface-floating);
    flex-direction: column;
    display: flex;

    & .ck-ai_review-navigation-panel__header {
      justify-content: space-between;
      align-items: center;
      gap: var(--ck-spacing-gap);
      padding: var(--ck-spacing-padding) var(--ck-spacing-padding-comfortable);
      border-radius: var(--ck-border-radius-surface) var(--ck-border-radius-surface) 0 0;
      background: var(--ck-ai-review-navigation-panel-header-background);
      display: flex;
    }

    & .ck-ai_review-navigation-panel__header__notice {
      align-items: center;
      gap: var(--ck-spacing-gap-compact);
      min-width: 0;
      color: var(--ck-color-text-secondary);
      font-size: var(--ck-font-size-sm);
      white-space: nowrap;
      display: flex;
    }

    & .ck-ai_review-navigation-panel__header__notice__label {
      color: inherit;
      font: inherit;
      text-overflow: ellipsis;
      overflow: hidden;
    }

    & .ck-ai_review-navigation-panel__complete-container {
      flex-shrink: 0;
      display: flex;

      & .ck-dropdown {
        display: flex;
      }

      & .ck-dropdown__button {
        --ck-dropdown-panel-uniform-button-border-radius: var(--ck-button-border-radius);
      }
    }

    & .ck-ai_review-navigation-panel__header__icon {
      --ck-icon-size: 1em;
      color: inherit;
      flex-shrink: 0;
    }

    & .ck-ai_review-navigation-panel__body {
      justify-content: space-between;
      align-items: center;
      gap: var(--ck-spacing-gap-spacious);
      padding: var(--ck-spacing-padding) var(--ck-spacing-padding-comfortable);
      border-radius: 0 0 var(--ck-border-radius-surface) var(--ck-border-radius-surface);
      display: flex;
      overflow-x: auto;

      & > * {
        flex-shrink: 0;
      }
    }

    & .ck-ai_review-navigation-panel__controls, & .ck-ai_review-navigation-panel__navigation {
      align-items: center;
      gap: var(--ck-spacing-gap);
      display: flex;
    }

    & .ck-ai_review-navigation-panel__divider {
      width: var(--ck-border-width-divider);
      background: var(--ck-color-divider);
      align-self: stretch;
    }

    & .ck-ai_review-navigation-panel__counter {
      color: var(--ck-color-text-primary);
      font-size: var(--ck-font-size-sm);
      font-weight: var(--ck-font-weight-medium);
      white-space: nowrap;
    }

    & .ck-ai_review-navigation-panel__actions {
      align-items: center;
      gap: var(--ck-spacing-gap-snug);
      display: flex;
    }
  }
}

:root, :host {
  --ck-ai-header-icon-color: var(--ck-color-text);
}

.ck-ai-header {
  --ck-form-header-height: calc(var(--ck-size-control-min-height)
		+ 2 * var(--ck-spacing-gap-compact)
		+ var(--ck-border-width-divider));
  --ck-form-header-padding: var(--ck-spacing-gap-compact) var(--ck-spacing-padding-comfortable);
  --ck-border-divider: var(--ck-border-width-divider) solid var(--ck-color-divider);

  & > .ck-icon {
    --ck-icon-size: var(--ck-font-size-lg);
  }

  & > .ck-button {
    margin-inline-start: var(--ck-spacing-gap);

    & > .ck-button__icon {
      --ck-icon-size: var(--ck-font-size-base);
      color: var(--ck-ai-header-icon-color);
    }
  }

  & .ck-button_small {
    & .ck-button__label {
      line-height: calc(var(--ck-line-height-base) * var(--ck-button-small-font-size));
    }
  }

  & > .ck.ck-button.ck-ai-chat__start-conversation {
    padding: var(--ck-button-small-padding);

    & > .ck.ck-icon.ck-button__icon {
      --ck-icon-size: var(--ck-font-size-md);
      color: var(--ck-ai-chat-text-color);
    }
  }

  & .ck-form__header__label {
    &:not(:last-child) {
      margin-inline-end: var(--ck-spacing-gap-compact);
    }
  }

  &.ck-ai-header_loading > * {
    visibility: hidden;
  }
}

:root, :host {
  --ck-ai-notification-text-color: var(--ck-ai-neutral-900-color);
  --ck-ai-notification-font-size: var(--ck-font-size-md);
  --ck-ai-notification-error-background-color: var(--ck-ai-error-background-color);
  --ck-ai-notification-warning-background-color: var(--ck-ai-warning-background-color);
  --ck-ai-notification-error-border-color: var(--ck-ai-error-border-color);
  --ck-ai-notification-warning-border-color: var(--ck-ai-warning-border-color);
  --ck-ai-border-radius: var(--ck-radius-md);
}

.ck.ck-ai-notification {
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--ck-spacing-gap);
  width: fit-content;
  font-size: var(--ck-ai-notification-font-size);
  padding: var(--ck-spacing-padding);
  border-radius: var(--ck-ai-border-radius);
  display: flex;

  &.ck-ai-notification_error {
    background-color: var(--ck-ai-notification-error-background-color);
    border: 1px solid var(--ck-ai-notification-error-border-color);
  }

  &.ck-ai-notification_warning {
    background-color: var(--ck-ai-notification-warning-background-color);
    border: 1px solid var(--ck-ai-notification-warning-border-color);
  }

  & > p {
    font-size: inherit;
    white-space: normal;
    color: var(--ck-color-base-text);
    line-height: var(--ck-line-height-base);
    overflow-wrap: anywhere;
    flex: 1;
  }

  & > .ck-button {
    --ck-icon-font-size: .666em;

    &.ck-ai-notification_error__dismiss-button {
      --ck-icon-font-size: .666em;
      --ck-size-min-height: 16px;
      flex-shrink: 0;
      padding: 0;
    }
  }

  &.ck-ai-notification__full-width {
    & > p {
      max-width: 100%;
    }
  }
}

:root, :host {
  --ck-ai-button-stop-generating-font-size: var(--ck-font-size-md);
  --ck-ai-button-tertiary-on-disabled-background-color: hsla(from var(--ck-button-on-background-color) h s l / var(--ck-opacity-disabled));
}

.ck-ai-button-tertiary {
  --ck-button-on-disabled-background-color: var(--ck-ai-button-tertiary-on-disabled-background-color);
}

.ck.ck-button {
  &.ck-ai-button-stop-generating {
    min-height: 22px;
    padding: 0 var(--ck-spacing-padding) 0 var(--ck-spacing-padding-compact);

    & .ck.ck-icon.ck-button__icon {
      width: 14px;
      height: 14px;
      margin-right: 4px;
    }
  }
}

:root, :host {
  --ck-ai-alpha-1: .1;
  --ck-ai-alpha-2: .2;
  --ck-ai-alpha-3: .3;
  --ck-ai-alpha-5: .5;
  --ck-ai-alpha-8: .8;
  --ck-ai-black-color: #000;
  --ck-ai-neutral-900-color: var(--ck-color-base-text);
  --ck-ai-neutral-900-a5-color: hsla(from var(--ck-ai-neutral-900-color) h s l / var(--ck-ai-alpha-5));
  --ck-ai-neutral-600-color: var(--ck-color-base-text-light);
  --ck-ai-neutral-300-color: var(--ck-color-base-border);
  --ck-ai-neutral-100-color: var(--ck-color-base-hover);
  --ck-ai-neutral-50-color: var(--ck-color-base-foreground);
  --ck-ai-white-color: var(--ck-color-base-background);
  --ck-ai-accent-700-color: var(--ck-color-base-action);
  --ck-ai-accent-700-a1-color: hsla(from var(--ck-ai-accent-700-color) h s l / var(--ck-ai-alpha-1));
  --ck-ai-accent-700-a3-color: hsla(from var(--ck-ai-accent-700-color) h s l / var(--ck-ai-alpha-3));
  --ck-ai-accent-700-a5-color: hsla(from var(--ck-ai-accent-700-color) h s l / var(--ck-ai-alpha-5));
  --ck-ai-accent-800-color: var(--ck-color-base-action-hover);
  --ck-ai-accent-800-a8-color: hsla(from var(--ck-ai-accent-800-color) h s l / var(--ck-ai-alpha-8));
  --ck-ai-accent-100-color: var(--ck-color-base-selected-hover);
  --ck-ai-accent-50-color: var(--ck-color-base-selected);
  --ck-ai-tab-active-surface-color: #e5e8f6;
  --ck-ai-tile-active-border-color: hsla(from var(--ck-color-base-action) h s l / var(--ck-ai-alpha-5));
  --ck-ai-tile-active-shadow-color: hsla(from var(--ck-color-base-action) h s l / .15);
  --ck-ai-tile-active-shadow: 0 0 3px 1.5px var(--ck-color-ai-accent-400, var(--ck-ai-tile-active-shadow-color));
  --ck-ai-skeleton-base-color: #edf1f8;
  --ck-ai-skeleton-flash-color: #fff;
  --ck-ai-shadow-color: hsla(from var(--ck-ai-black-color) h s l / var(--ck-ai-alpha-1));
  --ck-ai-insertion-border-color: var(--ck-color-diff-insertion-border);
  --ck-ai-insertion-background-color: var(--ck-color-diff-insertion-background);
  --ck-ai-insertion-active-border-color: var(--ck-color-diff-insertion-border-active);
  --ck-ai-insertion-active-background-color: var(--ck-color-diff-insertion-background-active);
  --ck-ai-deletion-border-color: var(--ck-color-diff-deletion-border);
  --ck-ai-deletion-background-color: var(--ck-color-diff-deletion-background);
  --ck-ai-deletion-stroke-color: var(--ck-color-diff-deletion-stroke);
  --ck-ai-deletion-active-border-color: var(--ck-color-diff-deletion-border-active);
  --ck-ai-deletion-active-background-color: var(--ck-color-diff-deletion-background-active);
  --ck-ai-inactive-insertion-border-color: #b9bbba59;
  --ck-ai-inactive-insertion-active-border-color: #93959380;
  --ck-ai-inactive-insertion-background-color: #eceeec59;
  --ck-ai-inactive-insertion-active-background-color: #c4cac480;
  --ck-ai-inactive-deletion-border-color: #bdbcbc59;
  --ck-ai-inactive-deletion-background-color: #f4f1f259;
  --ck-ai-inactive-deletion-stroke-color: #9f9d9d59;
  --ck-ai-suggestion-preview-insertion-border-color: var(--ck-ai-insertion-border-color);
  --ck-ai-suggestion-preview-insertion-active-border-color: var(--ck-ai-insertion-active-border-color);
  --ck-ai-suggestion-preview-insertion-background-color: var(--ck-ai-insertion-background-color);
  --ck-ai-suggestion-preview-insertion-active-background-color: var(--ck-ai-insertion-active-background-color);
  --ck-ai-suggestion-preview-deletion-border-color: var(--ck-ai-deletion-border-color);
  --ck-ai-suggestion-preview-deletion-active-border-color: var(--ck-ai-deletion-active-border-color);
  --ck-ai-suggestion-preview-deletion-background-color: var(--ck-ai-deletion-background-color);
  --ck-ai-suggestion-preview-deletion-active-background-color: var(--ck-ai-deletion-active-background-color);
  --ck-ai-suggestion-preview-deletion-stroke-color: var(--ck-ai-deletion-stroke-color);
  --ck-ai-suggestion-pill-accepted-text-color: var(--ck-color-base-success);
  --ck-ai-suggestion-pill-accepted-background-color: hsla(from var(--ck-color-base-success) h s l / var(--ck-ai-alpha-1));
  --ck-ai-suggestion-pill-rejected-text-color: var(--ck-color-base-error);
  --ck-ai-suggestion-pill-rejected-background-color: hsla(from var(--ck-color-base-error) h s l / var(--ck-ai-alpha-1));
  --ck-ai-suggestion-pill-outdated-text-color: var(--ck-color-base-text-light);
  --ck-ai-suggestion-pill-outdated-background-color: hsla(from var(--ck-color-base-text-light) h s l / var(--ck-ai-alpha-1));
  --ck-ai-error-background-color: hsla(from var(--ck-color-base-error) h s l / var(--ck-ai-alpha-1));
  --ck-ai-error-border-color: var(--ck-ai-deletion-border-color);
  --ck-ai-warning-color: #f0b428;
  --ck-ai-warning-background-color: hsla(from var(--ck-ai-warning-color) h s l / var(--ck-ai-alpha-1));
  --ck-ai-warning-border-color: hsla(from var(--ck-ai-warning-color) h s l / var(--ck-ai-alpha-5));
  --ck-ai-prompt-glow-color: #fffde6;
  --ck-ai-suggestion-inactive-background-color: var(--ck-ai-inactive-insertion-background-color);
  --ck-ai-suggestion-inactive-active-background-color: var(--ck-ai-inactive-insertion-active-background-color);
  --ck-ai-suggestion-inactive-border-color: var(--ck-ai-inactive-insertion-border-color);
  --ck-ai-suggestion-inactive-active-border-color: var(--ck-ai-inactive-insertion-active-border-color);
  --ck-ai-suggestion-marker-insertion-border-color: var(--ck-suggestion-marker-insertion-border-color, var(--ck-ai-insertion-border-color));
  --ck-ai-suggestion-marker-insertion-background-color: var(--ck-suggestion-marker-insertion-background-color, var(--ck-ai-insertion-background-color));
  --ck-ai-suggestion-marker-deletion-border-color: var(--ck-suggestion-marker-deletion-border-color, var(--ck-ai-deletion-border-color));
  --ck-ai-suggestion-marker-deletion-background-color: var(--ck-suggestion-marker-deletion-background-color, var(--ck-ai-deletion-background-color));
  --ck-ai-suggestion-marker-deletion-stroke-color: var(--ck-suggestion-marker-deletion-stroke-color, var(--ck-ai-deletion-stroke-color));
  --ck-ai-suggestion-marker-deletion-active-border-color: var(--ck-ai-deletion-active-border-color);
  --ck-ai-suggestion-marker-deletion-active-background-color: var(--ck-ai-deletion-active-background-color);
  --ck-ai-suggestion-marker-insertion-active-border-color: var(--ck-ai-insertion-active-border-color);
  --ck-ai-suggestion-marker-insertion-active-background-color: var(--ck-ai-insertion-active-background-color);
  --ck-ai-review-suggestion-color: var(--ck-ai-accent-700-a5-color);
  --ck-ai-review-icon-color: var(--ck-ai-neutral-600-color);
}

.ck {
  & .ck-ai-review {
    flex-direction: column;
    height: 100%;
    max-height: 100%;
    display: flex;

    & .ck-ai_review__init-skeleton {
      height: auto;
      padding: var(--ck-spacing-padding-comfortable);
      box-sizing: border-box;
      position: static;
      overflow: hidden;
    }

    & .ck-ai_review__init-skeleton, & .ck-ai_review__check-run-skeleton-container {
      --ck-ai-skeleton-row-gap: var(--ck-spacing-gap);

      & .ck-ai-skeleton__row {
        border: var(--ck-border-width-thin) solid var(--ck-color-base-border-light);
        border-radius: var(--ck-radius-base);
        padding: var(--ck-spacing-padding-spacious) var(--ck-spacing-padding-comfortable);
        box-sizing: border-box;

        & .ck-ai-skeleton__item {
          border-radius: var(--ck-radius-sm);
        }
      }
    }
  }

  &.ck-ai_review-highlights {
    & span.ck-ai_review-marker_add, & span.ck-ai_review-marker_underline {
      border-bottom: 3px solid var(--ck-ai-review-suggestion-color);
    }

    & span.ck-ai_review-marker_hide:not(.ck-ai_review__change_active) {
      display: none;
    }

    & span.ck-ai_review-marker_strikethrough:not(.ck-ai_review__change_active) {
      position: relative;

      &:before {
        border-bottom: 3px solid var(--ck-ai-review-suggestion-color);
        content: "";
        width: 100%;
        height: 60%;
        position: absolute;
      }
    }
  }

  &.ck-ai_review-diff span, &.ck-ai_review-highlights span.ck-ai_review__change_active {
    &.ck-ai_review-marker_add {
      white-space: break-spaces;
      border-top: 3px solid var(--ck-ai-suggestion-marker-insertion-border-color);
      border-bottom: 3px solid var(--ck-ai-suggestion-marker-insertion-border-color);
      background-color: var(--ck-ai-suggestion-marker-insertion-background-color);

      &.ck-ai_review__change_active {
        border-color: var(--ck-ai-suggestion-marker-insertion-active-border-color);
        background-color: var(--ck-ai-suggestion-marker-insertion-active-background-color);
      }
    }

    &.ck-ai_review-marker_hide, &.ck-ai_review-marker_strikethrough {
      white-space: break-spaces;
      border-top: 3px solid var(--ck-ai-suggestion-marker-deletion-border-color);
      border-bottom: 3px solid var(--ck-ai-suggestion-marker-deletion-border-color);
      text-decoration: line-through;
      text-decoration-color: var(--ck-ai-suggestion-marker-deletion-stroke-color);
      background-color: var(--ck-ai-suggestion-marker-deletion-background-color);
      text-decoration-thickness: 3px;

      &.ck-ai_review__change_active {
        border-color: var(--ck-ai-suggestion-marker-deletion-active-border-color);
        background-color: var(--ck-ai-suggestion-marker-deletion-active-background-color);
      }
    }

    &.ck-ai_review-marker_underline {
      border: none;
    }
  }

  &.ck-ai_review-highlights, &.ck-ai_review-diff {
    & .ck-suggestion-marker-insertion, & .ck-suggestion-marker-formatInline, & .ck-suggestion-marker-deletion {
      border-top: 3px solid var(--ck-ai-suggestion-inactive-border-color);
      border-bottom: 3px solid var(--ck-ai-suggestion-inactive-border-color);
      background: var(--ck-ai-suggestion-inactive-background-color);
    }

    & .ck-suggestion-marker-insertion.ck-suggestion-marker--active, & .ck-suggestion-marker-formatInline.ck-suggestion-marker--active, & .ck-suggestion-marker-deletion.ck-suggestion-marker--active {
      border-top: 3px solid var(--ck-ai-suggestion-inactive-active-border-color);
      border-bottom: 3px solid var(--ck-ai-suggestion-inactive-active-border-color);
      background: var(--ck-ai-suggestion-inactive-active-background-color);
    }

    & .ck-suggestion-marker-formatBlock {
      box-shadow: -7px 0 0 0 var(--ck-color-base-background), -10px 0 0 0 var(--ck-ai-suggestion-inactive-background-color);
    }

    & .ck-suggestion-marker-formatBlock.ck-suggestion-marker--active {
      box-shadow: -7px 0 0 0 var(--ck-color-base-background), -10px 0 0 0 var(--ck-ai-suggestion-inactive-active-background-color);
    }

    & .ck-suggestion-marker-deletion {
      text-decoration: line-through 3px;
      text-decoration-color: var(--ck-ai-suggestion-inactive-border-color);
    }

    & .ck-suggestion-marker-deletion.ck-suggestion-marker--active {
      text-decoration: line-through 3px;
      text-decoration-color: var(--ck-ai-suggestion-inactive-active-border-color);
    }
  }

  & .ck-ai_review__general-error-container {
    padding: var(--ck-spacing-padding-spacious) var(--ck-spacing-padding-comfortable) var(--ck-spacing-padding) var(--ck-spacing-padding-comfortable);
    border-radius: var(--ck-ai-border-radius);

    & > p {
      white-space: normal;
      max-width: 100%;
      line-height: 1.4em;
    }
  }
}

:root, :host {
  --ck-ai-core-spinner-gradient-start-color: var(--ck-ai-white-color);
  --ck-ai-core-spinner-gradient-end-color: var(--ck-ai-neutral-600-color);
  --ck-ai-core-spinner-mask-edge-color: var(--ck-ai-black-color);
  --ck-ai-spinner-size: var(--ck-toolbar-spinner-size);
  --ck-ai-spinner-background: linear-gradient(to right,
		var(--ck-ai-core-spinner-gradient-start-color),
		var(--ck-ai-core-spinner-gradient-end-color));
  --ck-ai-spinner-mask: radial-gradient(farthest-side, transparent 66%, var(--ck-ai-core-spinner-mask-edge-color) 61%);
  --ck-ai-spinner-animation-duration: 1s;
}

.ck.ck-spinner-container {
  &.ck-ai-spinner {
    width: var(--ck-ai-spinner-size);
    height: var(--ck-ai-spinner-size);
    animation-duration: var(--ck-ai-spinner-animation-duration);
    flex-shrink: 0;
    margin: 0;
    display: inline-block;

    & .ck-spinner {
      width: var(--ck-ai-spinner-size);
      height: var(--ck-ai-spinner-size);
      background: var(--ck-ai-spinner-background);
      -webkit-mask: var(--ck-ai-spinner-mask);
      mask: var(--ck-ai-spinner-mask);
      box-sizing: border-box;
      border: none;
    }

    &.ck-ai-spinner_small {
      --ck-ai-spinner-size: 1em;
    }

    &.ck-ai-spinner_tiny {
      --ck-ai-spinner-size: 12px;
    }
  }

  &.ck-hidden {
    animation: none;
    display: none;
  }
}

@keyframes ck-spin {
  to {
    transform: rotate(360deg);
  }
}

:root, :host {
  --ck-ai-dots-loader-background-color: var(--ck-color-base-foreground);
  --ck-ai-dots-loader-dot-color: var(--ck-color-border-control);
  --ck-ai-dots-loader-dot-active-color: var(--ck-color-text-secondary);
  --ck-ai-dots-loader-width: 40px;
  --ck-ai-dots-loader-height: 20px;
  --ck-ai-dots-loader-border-radius: 8px;
  --ck-ai-dots-loader-dot-size: 6px;
  --ck-ai-dots-loader-animation-duration: 1.5s;
  --ck-ai-dots-loader-animation-delay: .3s;
}

.ck.ck-ai-dots-loader {
  box-sizing: border-box;
  width: var(--ck-ai-dots-loader-width);
  height: var(--ck-ai-dots-loader-height);
  padding: var(--ck-spacing-padding-compact) var(--ck-spacing-padding-snug);
  border-radius: var(--ck-ai-dots-loader-border-radius);
  background-color: var(--ck-ai-dots-loader-background-color);
  flex-shrink: 0;
  justify-content: space-between;
  align-items: center;
  display: flex;

  & .ck-ai-dots-loader__dot {
    width: var(--ck-ai-dots-loader-dot-size);
    height: var(--ck-ai-dots-loader-dot-size);
    background-color: var(--ck-ai-dots-loader-dot-color);
    animation: ck-ai-dots-loader-pulse var(--ck-ai-dots-loader-animation-duration) infinite;
    border-radius: 50%;
    flex-shrink: 0;

    @media (prefers-reduced-motion: reduce) {
      background-color: var(--ck-ai-dots-loader-dot-active-color);
      animation: none;
    }

    &:first-child {
      animation-delay: 0s;
    }

    &:nth-child(2) {
      animation-delay: var(--ck-ai-dots-loader-animation-delay);
    }

    &:nth-child(3) {
      animation-delay: calc(var(--ck-ai-dots-loader-animation-delay) * 2);
    }
  }
}

@keyframes ck-ai-dots-loader-pulse {
  0%, 80%, 100% {
    background-color: var(--ck-ai-dots-loader-dot-color);
  }

  40% {
    background-color: var(--ck-ai-dots-loader-dot-active-color);
  }
}

:root, :host {
  --ck-ai-review-complete-review-dropdown-panel-width: 180px;
}

.ck-ai_review__complete-review-dropdown .ck-dropdown__panel {
  width: var(--ck-ai-review-complete-review-dropdown-panel-width);

  & .ck-list__item {
    min-width: unset;
  }

  & .ck-list__separator {
    margin-inline: calc(-1 * var(--ck-list-padding));
    width: auto;
  }
}

.ck.ck-dropdown.ck-ai_review__complete-review-dropdown .ck-button.ck-dropdown__button .ck-button__label {
  width: auto;
}

.ck.ck-dropdown.ck-ai_review__complete-review-dropdown .ck-button.ck-dropdown__button.ck-on .ck-dropdown__arrow {
  transform: rotate(180deg);
}

.ck.ck-ai-review {
  & .ck-ai_review__check-run {
    flex-direction: column;
    height: 100%;
    display: flex;
    position: relative;
    overflow: auto;

    &:has(.ck-ai_review__check-run-skeleton-container:not(.ck-hidden)) {
      overflow: hidden;
    }

    & .ck-ai_review__check-run-result {
      padding: var(--ck-spacing-padding-spacious) var(--ck-spacing-padding-comfortable);
      transition-behavior: allow-discrete;
      transition: box-shadow .3s ease-in-out;
      animation: .25s .1s backwards ck-ai-check-run-list-item-show;
      box-shadow: inset 3px 0 #0000;

      @media (prefers-reduced-motion: reduce) {
        opacity: 1;
        visibility: visible;
        transition-duration: 0s;
        animation: none;
      }

      &:not(:first-child) {
        border-top: 1px solid var(--ck-color-base-border);
      }

      &:last-child {
        contain: layout;
        position: relative;
      }

      &:last-child:after {
        content: "";
        background: var(--ck-color-base-border);
        height: 1px;
        display: block;
        position: absolute;
        bottom: -1px;
        left: 0;
        right: 0;
      }

      & .ck-suggestion-marker {
        white-space: break-spaces;
      }

      &:hover {
        box-shadow: 3px 0px 0px 0px var(--ck-ai-review-check-list-item-hover-border-color) inset,
					var(--ck-ai-review-check-list-item-elevated-shadow);
      }

      &.ck-ai_review__check-run-result_active {
        box-shadow: 3px 0px 0px 0px var(--ck-ai-review-check-list-item-active-border-color) inset;

        & .ck-suggestion-marker-insertion {
          border-top: 3px solid var(--ck-ai-suggestion-marker-insertion-active-border-color);
          border-bottom: 3px solid var(--ck-ai-suggestion-marker-insertion-active-border-color);
          background: var(--ck-ai-suggestion-marker-insertion-active-background-color);
        }

        & .ck-suggestion-marker-deletion {
          border-top: 3px solid var(--ck-ai-suggestion-marker-deletion-active-border-color);
          border-bottom: 3px solid var(--ck-ai-suggestion-marker-deletion-active-border-color);
          background: var(--ck-ai-suggestion-marker-deletion-active-background-color);
        }
      }

      &.ck-ai_review__check-run-result_removing {
        animation: .2s forwards ck-ai-check-run-item-remove;
      }
    }

    & .ck-ai_review__check-run-results-header {
      justify-content: space-between;
      align-items: center;
      gap: var(--ck-spacing-gap-compact) var(--ck-spacing-gap);
      padding: var(--ck-spacing-padding-comfortable);
      padding-top: calc(var(--ck-spacing-padding-comfortable) + var(--ck-spacing-padding));
      flex-wrap: wrap;
      display: flex;

      & .ck-ai_review__check-run-results-header-title-wrapper {
        flex: 1 1 0;
        align-items: flex-start;
        min-width: 0;
        display: flex;

        & .ck-ai_review__check-run-results-header-title-content {
          min-width: 0;

          & .ck-ai_review__check-run-results-header-title, & .ck-ai_review__check-run-results-header-subtitle {
            font-size: var(--ck-font-size-md);
            white-space: nowrap;
            text-overflow: ellipsis;
            max-width: 100%;
            line-height: var(--ck-line-height-base);
            align-self: center;
            display: block;
            overflow: hidden;
          }

          & .ck-ai_review__check-run-results-header-title {
            color: var(--ck-color-base-text);
            font-size: var(--ck-font-size-md);
            font-weight: var(--ck-font-weight-bold);
          }
        }
      }

      & .ck-ai_review__check-run-results-header-buttons {
        gap: var(--ck-spacing-gap);
        min-height: var(--ck-size-control-min-height);
        flex-shrink: 0;
        align-items: center;
        display: flex;

        & .ck-ai-button-stop-generating {
          min-height: var(--ck-size-control-min-height);
          font-size: var(--ck-ai-button-stop-generating-font-size);
          padding: var(--ck-spacing-padding-compact) var(--ck-spacing-padding-comfortable);

          & .ck.ck-icon.ck-button__icon {
            --ck-icon-size: var(--ck-font-size-lg);
            height: var(--ck-icon-size);
            width: var(--ck-icon-size);
          }
        }
      }
    }

    & .ck-ai_review__check-run-results-container {
      height: 100%;
      overflow: auto;
    }

    & .ck-ai_review__check-run-skeleton-container {
      padding: var(--ck-spacing-padding-comfortable);
      box-sizing: border-box;
      width: 100%;
      height: 100%;
      padding-top: 0;
      position: static;
      overflow: hidden;
    }

    & .ck-ai_review__check-run-error-container {
      align-items: flex-end;
      gap: var(--ck-spacing-gap-snug);
      padding: var(--ck-spacing-padding-comfortable) var(--ck-spacing-padding-comfortable) var(--ck-spacing-padding) var(--ck-spacing-padding-comfortable);
      flex-direction: column;
      display: flex;

      &.ck-ai_review__check-run-error-container_border-bottom {
        border-bottom: 1px solid var(--ck-color-base-border);
      }

      &:not(.ck-hidden) + .ck-ai_review__check-run-results-container:not(.ck-hidden) {
        & > .ck-ai_review__check-run-result:first-child {
          border-top: 1px solid var(--ck-color-base-border);
        }
      }
    }
  }
}

@keyframes ck-ai-check-run-list-item-show {
  0% {
    opacity: 0;
    visibility: hidden;
  }

  100% {
    opacity: 1;
    visibility: visible;
  }
}

@keyframes ck-ai-check-run-item-remove {
  0% {
    opacity: 1;
    visibility: visible;
    display: block;
  }

  100% {
    opacity: 0;
    visibility: hidden;
    display: none;
  }
}

:root, :host {
  --ck-suggestion-marker-deletion-inactive-border-color: var(--ck-color-suggestion-marker-deletion-border-inactive, var(--ck-ai-inactive-deletion-border-color));
  --ck-suggestion-marker-deletion-inactive-background-color: var(--ck-color-suggestion-marker-deletion-background-inactive, var(--ck-ai-inactive-deletion-background-color));
  --ck-suggestion-marker-deletion-inactive-stroke-color: var(--ck-color-suggestion-marker-deletion-stroke-inactive, var(--ck-ai-inactive-deletion-stroke-color));
  --ck-suggestion-marker-insertion-inactive-border-color: var(--ck-color-suggestion-marker-insertion-border-inactive, var(--ck-ai-inactive-insertion-border-color));
  --ck-suggestion-marker-insertion-inactive-background-color: var(--ck-color-suggestion-marker-insertion-background-inactive, var(--ck-ai-inactive-insertion-background-color));
  --ck-ai-review-check-run-result-status-button-background-color: var(--ck-ai-neutral-100-color);
  --ck-ai-review-check-run-result-status-button-text-color: var(--ck-ai-neutral-600-color);
  --ck-ai-review-check-run-result-status-button-success-background-color: var(--ck-ai-suggestion-pill-accepted-background-color);
  --ck-ai-review-check-run-result-status-button-success-text-color: var(--ck-ai-suggestion-pill-accepted-text-color);
  --ck-ai-review-check-run-result-status-button-error-background-color: var(--ck-ai-suggestion-pill-rejected-background-color);
  --ck-ai-review-check-run-result-status-button-error-text-color: var(--ck-ai-suggestion-pill-rejected-text-color);
}

.ck-ai_review__check-run-result {
  & > .ck-ai_review__check-run-result-footer {
    margin-top: var(--ck-spacing-gap);
    justify-content: space-between;
    align-items: center;
    gap: var(--ck-spacing-gap);
    display: flex;

    & > .ck-ai_review__check-run-result-action-buttons {
      gap: var(--ck-spacing-gap);
      flex-grow: 1;
      display: flex;
    }

    & .ck.ck-button.ck-ai_review__check-run-result-info-button {
      --ck-icon-size: 16px;
      --ck-size-min-height: 1.75em;
      max-height: var(--ck-size-min-height);
      margin-left: auto;
    }

    & .ck.ck-button.ck-ai_review__check-run-result-status-button {
      background-color: var(--ck-ai-review-check-run-result-status-button-background-color);
      color: var(--ck-ai-review-check-run-result-status-button-text-color);

      &.ck-ai_review__check-run-result-status-button_success {
        background-color: var(--ck-ai-review-check-run-result-status-button-success-background-color);
        color: var(--ck-ai-review-check-run-result-status-button-success-text-color);
      }

      &.ck-ai_review__check-run-result-status-button_error {
        background-color: var(--ck-ai-review-check-run-result-status-button-error-background-color);
        color: var(--ck-ai-review-check-run-result-status-button-error-text-color);
      }

      & > .ck.ck-icon {
        --ck-icon-size: 16px;
      }
    }
  }

  & > .ck-ai_review__check-run-result-response {
    overflow: hidden;

    &.ck.ck-content:not(:focus) {
      border: 0;
      padding: 0;
    }

    &.ck-hidden {
      & + .ck-ai_review__check-run-result-footer {
        margin-top: 0;
      }
    }

    & > * {
      white-space: normal;
      margin: 0;
    }

    & img {
      max-width: 125px;
      max-height: 125px;
    }
  }

  &.ck-ai_review__check-run-result_grayout {
    pointer-events: none;

    & .ck-suggestion-marker {
      &.ck-suggestion-marker-deletion {
        --ck-suggestion-marker-deletion-border-color: var(--ck-suggestion-marker-deletion-inactive-border-color);
        --ck-suggestion-marker-deletion-background-color: var(--ck-suggestion-marker-deletion-inactive-background-color);
        --ck-suggestion-marker-deletion-stroke-color: var(--ck-suggestion-marker-deletion-inactive-stroke-color);
      }

      &.ck-suggestion-marker-insertion {
        --ck-suggestion-marker-insertion-border-color: var(--ck-suggestion-marker-insertion-inactive-border-color);
        --ck-suggestion-marker-insertion-background-color: var(--ck-suggestion-marker-insertion-inactive-background-color);
      }
    }

    & > .ck-ai_review__check-run-result-response {
      & > * {
        filter: grayscale();
      }
    }
  }
}

.ck .ck-ai-review.ck-ai-review-mode {
  & .ck-ai_review__check-run-results-container {
    gap: var(--ck-spacing-gap);
    padding: var(--ck-spacing-padding-comfortable);
    flex-direction: column;
    display: flex;
  }

  & .ck-ai-suggestion__body__content-part {
    @media (prefers-reduced-motion: reduce) {
      opacity: 1;
      visibility: visible;
      transition-duration: 0s;
      animation: none;
    }

    & .ck-suggestion-marker {
      white-space: break-spaces;
    }

    &.ck-ai-suggestion__body__content-part_active {
      & .ck-suggestion-marker-insertion {
        border-top: 3px solid var(--ck-ai-suggestion-preview-insertion-active-border-color);
        border-bottom: 3px solid var(--ck-ai-suggestion-preview-insertion-active-border-color);
        background: var(--ck-ai-suggestion-preview-insertion-active-background-color);
      }

      & .ck-suggestion-marker-deletion {
        border-top: 3px solid var(--ck-ai-suggestion-preview-deletion-active-border-color);
        border-bottom: 3px solid var(--ck-ai-suggestion-preview-deletion-active-border-color);
        background: var(--ck-ai-suggestion-preview-deletion-active-background-color);
      }
    }
  }
}

.ck.ck-ai-review {
  & .ck-ai_review__review-completed-header {
    justify-content: space-between;
    align-items: center;
    gap: var(--ck-spacing-gap);
    padding: var(--ck-spacing-padding-spacious) var(--ck-spacing-padding-comfortable);
    border-bottom: 1px solid var(--ck-color-base-border);
    display: flex;

    & > .ck-ai_review__review-completed-header-title {
      white-space: nowrap;
      text-overflow: ellipsis;
      align-self: center;
      min-width: 0;
      max-width: 100%;
      overflow: hidden;
    }

    & .ck-ai_review__review-completed-header-buttons {
      gap: var(--ck-spacing-gap);
      flex-shrink: 0;
      display: flex;
    }
  }

  & .ck-ai_review__review-completed {
    & .ck-ai_review__review-completed-content {
      padding: var(--ck-spacing-padding-spacious) var(--ck-spacing-padding-spacious) 0 var(--ck-spacing-padding-spacious);
      text-align: center;

      & .ck-ai_review__review-completed-content-icon {
        font-size: 20px;
        line-height: 20px;
      }

      & .ck-ai_review__review-completed-content-text {
        margin-top: var(--ck-spacing-gap-comfortable);
        text-align: center;
        white-space: normal;
      }
    }
  }
}

:root, :host {
  --ck-ai-review-check-list-item-hover-border-color: var(--ck-color-ai-accent-400, var(--ck-ai-tile-active-border-color));
  --ck-ai-review-check-list-item-active-border-color: var(--ck-ai-accent-700-color);
  --ck-ai-review-check-list-item-selected-border-color: var(--ck-color-ai-accent-400, var(--ck-ai-tile-active-border-color));
  --ck-ai-review-check-list-item-hover-icon-color: var(--ck-ai-accent-700-color);
  --ck-ai-review-check-list-item-border-color: var(--ck-color-base-border-light);
  --ck-ai-review-check-list-item-radius: var(--ck-radius-base);
  --ck-ai-review-check-list-item-padding: var(--ck-spacing-padding-comfortable);
  --ck-ai-review-check-list-item-elevated-shadow: var(--ck-shadow-lg);
  --ck-ai-review-check-list-item-active-shadow: var(--ck-ai-tile-active-shadow);
  --ck-ai-review-check-list-item-title-color: var(--ck-color-text);
  --ck-ai-review-check-list-item-description-color: var(--ck-ai-neutral-600-color);
  --ck-ai-review-check-list-item-title-icon-color: var(--ck-ai-neutral-600-color);
  --ck-ai-review-check-list-parameterized-dropdown-button-border-color: var(--ck-ai-neutral-300-color);
  --ck-ai-review-check-list-model-dropdown-max-width: 426px;
  --ck-ai-review-check-list-model-dropdown-max-height: 340px;
  --ck-ai-review-check-list-item-title-text-font-size: var(--ck-font-size-md);
  --ck-ai-review-check-list-item-description-font-size: var(--ck-font-size-md);
}

.ck.ck-ai-review {
  & .ck-ai_review__check-list {
    height: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative;
    overflow: auto;

    & .ck-ai_review__check-list-group {
      padding-inline: var(--ck-spacing-padding-comfortable);
      padding-bottom: var(--ck-spacing-padding-comfortable);

      &:has( ~ .ck-ai_review__check-list-group:not(.ck-hidden)) {
        padding-bottom: 0;
      }

      & > .ck-label {
        padding-block: var(--ck-spacing-padding-comfortable) var(--ck-spacing-padding);
        color: var(--ck-ai-review-check-list-item-description-color);
        font-size: var(--ck-font-size-sm);
        font-weight: var(--ck-font-weight-bold);
        display: block;
      }

      &:first-child:not(.ck-hidden) > .ck-label, &.ck-hidden:first-child + &:not(.ck-hidden) > .ck-label {
        padding-top: calc(var(--ck-spacing-padding-comfortable) + var(--ck-spacing-padding));
      }

      & > .ck-list {
        gap: var(--ck-spacing-gap);
        -webkit-user-select: text;
        user-select: text;
        background: none;
        padding: 0;
      }
    }

    & .ck-ai_review__check-list-item {
      border-radius: var(--ck-ai-review-check-list-item-radius);
      border: 1px solid var(--ck-ai-review-check-list-item-border-color);
      background: var(--ck-color-panel-background, var(--ck-color-base-background));
      padding: var(--ck-ai-review-check-list-item-padding);
      box-shadow: none;
      opacity: 0;
      visibility: hidden;
      transition: box-shadow var(--ck-duration-slow) ease-in-out, border-color var(--ck-duration-slow) ease-in-out;
      container-type: inline-size;

      @media (prefers-reduced-motion: reduce) {
        transition-duration: 0s;
      }

      & .ck-ai_review__check-list-item-description {
        color: var(--ck-ai-review-check-list-item-description-color);
        font-size: var(--ck-ai-review-check-list-item-description-font-size);
        font-weight: 400;
        line-height: var(--ck-line-height-base);
        white-space: normal;
      }

      & .ck-ai_review__check-list-item-title-text {
        line-height: var(--ck-line-height-base);
        white-space: normal;
        display: block;
      }

      &:hover {
        cursor: pointer;

        & .ck-ai_review__check-list-item-content, & .ck-ai_review__check-list-item-content * {
          cursor: pointer;
        }
      }

      &:has( > .ck-ai_review__check-list-item-content:focus) {
        box-shadow: var(--ck-focus-shadow), 0 0;
        outline: none;
      }

      &.ck-ai_review__check-list-item_rendered {
        opacity: 1;
        visibility: visible;
        transition: box-shadow var(--ck-duration-slow) ease-in-out,
					border-color var(--ck-duration-slow) ease-in-out,
					opacity .1s calc(50ms * var(--ck-ai-review-check-list-item-index)),
					visibility .1s calc(50ms * var(--ck-ai-review-check-list-item-index));

        @media (prefers-reduced-motion: reduce) {
          opacity: 1;
          visibility: visible;
        }
      }

      &.ck-ai_review__check-list-item_selected {
        border-color: var(--ck-ai-review-check-list-item-selected-border-color);
        box-shadow: var(--ck-ai-review-check-list-item-active-shadow);
      }

      &:has( > .ck-ai_review__check-list-item-content:focus).ck-ai_review__check-list-item_selected {
        box-shadow: var(--ck-ai-review-check-list-item-active-shadow), var(--ck-focus-shadow), 0 0;
      }

      &:has( > .ck-ai_review__check-list-item-parameterized) {
        & .ck-ai_review__check-list-item-icon-wrapper > .ck.ck-icon.ck-ai_review__check-list-item-title-icon {
          opacity: 1;
          visibility: visible;
        }

        &.ck-ai_review__check-list-item_selected {
          & .ck-ai_review__check-list-item-icon-wrapper > .ck.ck-icon.ck-ai_review__check-list-item-title-icon {
            color: var(--ck-ai-review-check-list-item-hover-icon-color);
            transform: rotate(180deg);
          }
        }
      }

      &:not(:has( > .ck-ai_review__check-list-item-parameterized)) {
        & .ck-ai_review__check-list-item-icon-wrapper {
          align-self: center;
        }

        & .ck-ai_review__check-list-item-icon-wrapper > .ck.ck-icon.ck-ai_review__check-list-item-title-icon {
          transform: rotate(-90deg);
        }
      }

      & .ck-ai_review__check-list-item-content {
        align-items: flex-start;
        gap: var(--ck-spacing-gap);
        display: flex;

        &:focus {
          outline: none;
        }
      }

      & .ck-ai_review__check-list-item-main-content {
        gap: var(--ck-spacing-gap-compact);
        flex-direction: column;
        flex: 1;
        min-width: 0;
        display: flex;
      }

      & .ck-ai_review__check-list-item-title {
        font-size: var(--ck-ai-review-check-list-item-title-text-font-size);
        line-height: var(--ck-line-height-base);

        & > .ck-ai_review__check-list-item-title-text {
          color: var(--ck-ai-review-check-list-item-title-color);
          font-size: var(--ck-ai-review-check-list-item-title-text-font-size);
          font-weight: var(--ck-font-weight-bold);
          line-height: var(--ck-line-height-base);
        }
      }

      & .ck-ai_review__check-list-item-icon-wrapper {
        height: calc(var(--ck-ai-review-check-list-item-title-text-font-size) * var(--ck-line-height-base));
        --ck-icon-size: var(--ck-font-size-xl);
        flex-shrink: 0;
        justify-content: center;
        align-self: flex-start;
        align-items: center;
        display: flex;

        & > .ck.ck-icon.ck-ai_review__check-list-item-title-icon {
          width: var(--ck-dropdown-arrow-size);
          height: var(--ck-dropdown-arrow-size);
          color: var(--ck-ai-review-check-list-item-title-icon-color);
          opacity: 0;
          visibility: hidden;
          transition: opacity var(--ck-duration-slow) ease-in-out,
						visibility var(--ck-duration-slow) ease-in-out,
						color var(--ck-duration-slow) ease-in-out,
						transform var(--ck-duration-slow) ease-in-out;

          @media (prefers-reduced-motion: reduce) {
            transition-duration: 0s;
          }
        }
      }

      &:hover, &:has( > .ck-ai_review__check-list-item-content:focus) {
        & .ck.ck-icon.ck-ai_review__check-list-item-title-icon {
          opacity: 1;
          visibility: visible;
          color: var(--ck-ai-review-check-list-item-hover-icon-color);
        }
      }

      &:not(.ck-ai_review__check-list-item_selected):not(:has( > .ck-ai_review__check-list-item-content:focus)):hover {
        box-shadow: var(--ck-ai-review-check-list-item-elevated-shadow);
      }

      & .ck-ai_review__check-list-item-parameterized {
        opacity: 1;
        margin-top: var(--ck-spacing-gap);
        transition: grid-template-rows var(--ck-duration-slow) ease-in-out,
					opacity var(--ck-duration-slow) ease-in-out,
					margin-top var(--ck-duration-slow) ease-in-out,
					overflow 0s linear var(--ck-duration-slow) allow-discrete,
					display var(--ck-duration-slow) ease-in-out allow-discrete;
        grid-template-rows: 1fr;
        display: grid;
        overflow: visible;

        & > * {
          min-height: 0;
        }

        &.ck-hidden {
          opacity: 0;
          transition: grid-template-rows var(--ck-duration-slow) ease-in-out,
						opacity var(--ck-duration-slow) ease-in-out,
						margin-top var(--ck-duration-slow) ease-in-out,
						overflow 0s linear 0s allow-discrete,
						display var(--ck-duration-slow) ease-in-out allow-discrete;
          grid-template-rows: 0fr;
          margin-top: 0;
          overflow: hidden;
        }

        @starting-style {
          opacity: 0;
          grid-template-rows: 0fr;
          margin-top: 0;
          overflow: hidden;
        }

        @media (prefers-reduced-motion: reduce) {
          transition-duration: 0s;
          transition-delay: 0s;
        }

        & .ck.ck-form__row {
          padding-left: 0;
          padding-right: 0;

          & > .ck.ck-ai_review__check-list-item-parameterized-form-element {
            flex: 1;

            & > :first-child {
              width: 100%;
            }

            &.ck-ai_review__check-list-item-parameterized-form-element_dropdown {
              & .ck-button.ck-dropdown__button {
                border-color: var(--ck-ai-review-check-list-parameterized-dropdown-button-border-color);

                & > .ck-button__label {
                  width: 100%;
                }
              }
            }
          }

          & .ck.ck-button {
            flex-shrink: 0;
          }

          & .ck.ck-labeled-field-view {
            width: 100%;
          }
        }
      }

      & .ck-ai_review__check-list-item-custom-actions {
        & .ck-ai_review__check-list-item-custom-actions-rows {
          gap: var(--ck-spacing-gap);
          flex-direction: column;
          display: flex;
        }

        & .ck.ck-form__row {
          padding-top: 0;
          padding-bottom: 0;

          & .ck.ck-input.ck-textarea.ck-review__prompt-input {
            width: 100%;
          }

          & .ck-ai_review__check-list-item-custom-actions-footer {
            justify-content: space-between;
            align-items: center;
            width: 100%;
            display: flex;

            & .ck-ai_review__check-list-item-model-name {
              color: var(--ck-color-base-text);
              font-size: .9em;
            }

            & .ck-ai_review__check-list-item-parameterized-custom-actions-buttons {
              gap: var(--ck-spacing-gap);
              margin-left: auto;
              display: flex;
            }
          }
        }
      }

      & .ck-ai_review__check-list-item-model-dropdown {
        --ck-ai-model-selector-item-secondary-color: var(--ck-ai-review-icon-color);

        & > .ck.ck-button.ck-dropdown__button {
          & > .ck.ck-button__label {
            width: auto;
          }
        }

        & .ck-dropdown__panel {
          width: min(var(--ck-ai-review-check-list-model-dropdown-max-width), 100cqw);

          & > .ck-list {
            max-height: var(--ck-ai-review-check-list-model-dropdown-max-height);
            overflow-y: auto;
          }

          &.ck-dropdown__panel_se, &.ck-dropdown__panel_sw, &.ck-dropdown__panel_s, &.ck-dropdown__panel_sme, &.ck-dropdown__panel_smw {
            margin-top: var(--ck-spacing-gap-snug);
            bottom: auto;
          }

          &.ck-dropdown__panel_ne, &.ck-dropdown__panel_nw, &.ck-dropdown__panel_n, &.ck-dropdown__panel_nme, &.ck-dropdown__panel_nmw {
            margin-bottom: var(--ck-spacing-gap-snug);
            top: auto;
          }
        }
      }
    }
  }
}

:root, :host {
  --ck-ai-review-progress-bar-fill-color: var(--ck-ai-accent-700-color);
  --ck-ai-review-progress-bar-track-color: var(--ck-color-base-border-light);
  --ck-ai-review-progress-bar-label-color: var(--ck-ai-neutral-600-color);
}

.ck.ck-ai-review {
  & .ck-ai_review__progress-bar-container {
    gap: var(--ck-spacing-gap-compact);
    flex-direction: column;
    flex: 0 0 100%;
    display: flex;
  }

  & .ck-ai_review__progress-bar-label {
    color: var(--ck-ai-review-progress-bar-label-color);
    font-size: var(--ck-font-size-md);

    & strong {
      font-size: var(--ck-font-size-md);
      color: inherit;
      font-weight: var(--ck-font-weight-bold);
      vertical-align: baseline;
    }
  }

  & .ck-ai_review__progress-bar-track {
    background: var(--ck-ai-review-progress-bar-track-color);
    border-radius: 2px;
    height: 5px;
    overflow: hidden;
  }

  & .ck-ai_review__progress-bar-fill {
    background: var(--ck-ai-review-progress-bar-fill-color);
    border-radius: 2px;
    height: 100%;
    transition: width .2s;

    @media (prefers-reduced-motion: reduce) {
      transition-duration: 0s;
    }
  }
}

:root, :host {
  --ck-ai-leave-confirmation-width: 400px;
}

.ck.ck-dialog.ck-ai-leave-confirmation {
  width: var(--ck-ai-leave-confirmation-width);

  & .ck-dialog__actions .ck-button {
    cursor: pointer;
  }
}

:root, :host {
  --ck-ai-translate-check-list-header-title-color: var(--ck-ai-neutral-900-color);
  --ck-ai-translate-check-list-header-font-size: var(--ck-font-size-md);
  --ck-ai-translate-check-list-header-title-font-size: var(--ck-font-size-md);
}

.ck {
  & .ck-ai-review.ck-ai-translate-mode {
    & .ck-ai-translate__check-list-wrapper {
      height: 100%;
      padding-block-start: var(--ck-spacing-padding);
      position: relative;
      overflow: auto;

      & .ck-ai-translate__check-list-header {
        padding-block-start: var(--ck-spacing-padding-comfortable);
        padding-inline: var(--ck-spacing-padding-comfortable);
        color: var(--ck-color-base-text);
        font-size: var(--ck-ai-translate-check-list-header-font-size);

        & > h2 {
          font-size: var(--ck-ai-translate-check-list-header-title-font-size);
          font-weight: var(--ck-font-weight-bold);
          white-space: normal;
          line-height: var(--ck-line-height-base);
          color: var(--ck-ai-translate-check-list-header-title-color);
        }

        & > p {
          font-weight: var(--ck-font-weight-normal);
          color: var(--ck-color-base-text-light);
          font-size: var(--ck-ai-translate-check-list-header-font-size);
          line-height: var(--ck-line-height-base);
        }
      }

      & .ck-ai_review__check-list {
        overflow: initial;
        gap: var(--ck-spacing-gap);
        height: auto;
        padding-inline: var(--ck-spacing-padding-comfortable);
        flex-direction: column;
        padding-block-start: var(--ck-spacing-padding);
        display: flex;
      }

      & .ck-ai_review__check-list-item {
        border-radius: var(--ck-radius-base);
        padding: var(--ck-spacing-padding-comfortable);

        & .ck-ai_review__check-list-item-description:empty {
          display: none;
        }
      }
    }

    & .ck-ai_review__check-run {
      & .ck-ai_review__check-run-results-header {
        padding-block-start: calc(var(--ck-spacing-padding-spacious) + var(--ck-spacing-padding-compact));
      }

      & .ck.ck-button.ck-ai-button-stop-generating {
        min-height: var(--ck-size-control-min-height);
        padding: var(--ck-spacing-padding-compact) var(--ck-spacing-padding-comfortable);

        & .ck.ck-icon.ck-button__icon {
          height: var(--ck-font-size-lg);
          width: var(--ck-font-size-lg);
        }
      }

      & .ck-ai_review__check-run-results-container {
        gap: var(--ck-spacing-gap);
        padding: var(--ck-spacing-padding-comfortable);
        flex-direction: column;
        padding-block-start: var(--ck-spacing-padding-compact);
        display: flex;
      }

      & .ck-ai_review__check-run-result {
        border: var(--ck-border-width-thin) solid var(--ck-color-base-border-light);
        border-radius: var(--ck-radius-base);
        background: var(--ck-color-base-background);
        padding: var(--ck-spacing-padding-comfortable);
        box-shadow: none;
        transition: box-shadow var(--ck-duration-slow) ease-in-out, border-color var(--ck-duration-slow) ease-in-out;

        @media (prefers-reduced-motion: reduce) {
          transition-duration: 0s;
        }

        &:hover {
          box-shadow: var(--ck-ai-review-check-list-item-elevated-shadow);
        }

        &.ck-ai_review__check-run-result_active {
          border-color: var(--ck-ai-tile-active-border-color);
          box-shadow: var(--ck-ai-tile-active-shadow);
        }

        & .ck-suggestion-marker, & .ck-ai_review__check-run-result-footer {
          visibility: hidden;
          display: none;
        }

        &.ck-ai_review__check-run-result_grayout {
          & .ck-ai_review__check-run-result-footer {
            visibility: visible;
            display: flex;
          }
        }

        &:last-child:after {
          display: none;
        }
      }
    }
  }

  &.ck-ai-translate-mode-content {
    & span.ck-ai_review-marker_add {
      border-bottom: none;

      &.ck-ai_review__change_active {
        border-bottom: 3px solid var(--ck-ai-review-suggestion-color);
      }

      &.ck-ai_review__change_active > span.ck-ai_review-marker_add {
        border-bottom: none;
      }
    }

    & .ck-ai_review-marker_hide, & .ck-ai_review-marker_strikethrough, & .ck-ai_review-marker_underline {
      display: none !important;
    }

    & .ck-suggestion-marker-insertion, & .ck-suggestion-marker-formatInline, & .ck-suggestion-marker-deletion, & .ck-suggestion-marker-insertion.ck-suggestion-marker--active, & .ck-suggestion-marker-formatInline.ck-suggestion-marker--active, & .ck-suggestion-marker-deletion.ck-suggestion-marker--active {
      border-top: 3px solid var(--ck-ai-suggestion-inactive-border-color);
      border-bottom: 3px solid var(--ck-ai-suggestion-inactive-border-color);
      background: var(--ck-ai-suggestion-inactive-background-color);
    }

    & .ck-suggestion-marker-formatBlock, & .ck-suggestion-marker-formatBlock.ck-suggestion-marker--active {
      box-shadow: -7px 0 0 0 var(--ck-color-base-background), -10px 0 0 0 var(--ck-ai-suggestion-inactive-background-color);
    }

    & .ck-suggestion-marker-deletion, & .ck-suggestion-marker-deletion.ck-suggestion-marker--active {
      text-decoration: line-through 3px;
      text-decoration-color: var(--ck-ai-suggestion-inactive-border-color);
    }
  }
}

:root, :host {
  --ck-user-colors--0: #6d78e8;
  --ck-user-colors--0-alpha: #6d78e826;
  --ck-user-colors--1: #007a6c;
  --ck-user-colors--1-alpha: #007a6c26;
  --ck-user-colors--2: #ba4545;
  --ck-user-colors--2-alpha: #ba454526;
  --ck-user-colors--3: #5635b1;
  --ck-user-colors--3-alpha: #5635b126;
  --ck-user-colors--4: #548a2e;
  --ck-user-colors--4-alpha: #548a2e26;
  --ck-user-colors--5: #c3185d;
  --ck-user-colors--5-alpha: #c3185d26;
  --ck-user-colors--6: #ea4343;
  --ck-user-colors--6-alpha: #ea434326;
  --ck-user-colors--7: #0bc3d0;
  --ck-user-colors--7-alpha: #0bc3d026;
  --ck-user-dot-size: 6px;
}

.ck [class^="ck-user__color--"], .ck [class*=" ck-user__color--"] {
  color: var(--ck-user-color, var(--ck-user-colors--0));
}

.ck [class^="ck-user__bg-color--"], .ck [class*=" ck-user__bg-color--"] {
  background-color: var(--ck-user-color, var(--ck-user-colors--0));
}

.ck [class^="ck-user__selection--"], .ck [class*=" ck-user__selection--"] {
  background-color: var(--ck-user-color-alpha, var(--ck-user-colors--0-alpha));

  &.ck-widget {
    border: 3px solid var(--ck-user-color, var(--ck-user-colors--0));
    background-color: #0000;
  }
}

.ck [class^="ck-user__marker--"], .ck [class*=" ck-user__marker--"] {
  &, & .ck-user__marker-tooltip, & .ck-user__marker-dot {
    background-color: var(--ck-user-color, var(--ck-user-colors--0));

    &::selection {
      background-color: var(--ck-user-color, var(--ck-user-colors--0));
    }
  }

  & .ck-user__marker-line {
    border: 1px solid var(--ck-user-color, var(--ck-user-colors--0));
  }
}

:root, :host {
  --ck-user-avatar-size: 40px;
  --ck-user-avatar-background-color: var(--ck-user-avatar-background, #0f084b);
  --ck-user-me-avatar-background-color: #4c9f70;
  --ck-user-avatar-text-color: var(--ck-user-avatar-color, #fff);
  --ck-user-me-border-color: #fff;
  --ck-user-name-font-size: var(--ck-font-size-md);
}

.ck.ck-user {
  background-color: var(--ck-user-avatar-background, var(--ck-user-avatar-background-color));
  box-sizing: border-box;
  height: var(--ck-user-avatar-size);
  width: var(--ck-user-avatar-size);
  min-width: var(--ck-user-avatar-size);
  min-height: var(--ck-user-avatar-size);
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  margin: 2px;
  line-height: 100%;
  display: flex;
  position: relative;

  &.ck-user_me {
    background-color: var(--ck-user-me-avatar-background-color);
  }
}

.ck.ck-user__name {
  color: var(--ck-user-avatar-color, var(--ck-user-avatar-text-color));
  font-size: var(--ck-user-name-font-size);
  cursor: default;
  -webkit-user-select: none;
  user-select: none;

  &.ck-user__name--hidden {
    display: none;
  }
}

.ck.ck-user__img {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: var(--ck-user-avatar-background, var(--ck-user-avatar-background-color));
  border: none;
  border-radius: 50%;
  width: 100%;
  height: 100%;
  display: none;

  &.ck-user__anonymous {
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2020%2020%22%3E%0A%20%20%3Cpath%20fill%3D%22%23FFF%22%20fill-rule%3D%22nonzero%22%20d%3D%22M9.8%2020H2c0-5.7%205-5.7%206-7l.2-.8c-1.6-.8-2.7-2.7-2.7-5%200-2.8%202-5.2%204.3-5.2S14%204.4%2014%207.3c0%202.2-1%204-2.6%205l.2.6c1.2%201.3%206%201.4%206%207H9.8z%22%2F%3E%0A%3C%2Fsvg%3E");
    display: block;

    & + .ck-user__name {
      display: none;
    }
  }

  &.ck-user__avatar {
    background-color: #fff;
    display: block;
  }

  &.ck-user__img--hidden {
    display: none;
  }
}

.ck.ck-user__notification {
  background: var(--ck-color-surface-canvas);
  border: 2px solid var(--ck-color-surface-canvas);
  box-sizing: content-box;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 15px;
  height: 15px;
  display: flex;
  position: absolute;
  top: -8px;
  right: -7px;
  overflow: hidden;
  transform: translateZ(0);

  & .ck-user__icon {
    color: var(--ck-color-annotation-info, var(--ck-annotation-info-color));
    background: var(--ck-color-surface-canvas);
    width: 19px;
    min-width: 19px;
    max-width: 19px;
    height: 19px;
    min-height: 19px;
    max-height: 19px;
  }
}

:root, :host {
  --ck-pill-height: var(--ck-size-control-min-height);
  --ck-pill-icon-size: var(--ck-font-size-lg);
  --ck-pill-font-size: var(--ck-font-size-md);
  --ck-pill-small-height: calc(var(--ck-font-size-normal, var(--ck-font-size-base)) * 1.5);
  --ck-pill-small-icon-size: var(--ck-font-size-md);
  --ck-pill-small-font-size: var(--ck-font-size-small, var(--ck-font-size-sm));
  --ck-pill-radius: 9999px;
  --ck-pill-line-height: var(--ck-line-height-base);
  --ck-pill-padding-block: 0;
  --ck-pill-padding-inline: var(--ck-spacing-padding-comfortable);
  --ck-pill-gap: var(--ck-spacing-gap-compact);
  --ck-pill-font-family: var(--ck-font-face, var(--ck-font-family));
  --ck-pill-font-weight: var(--ck-font-weight-medium);
  --ck-pill-background: var(--ck-color-interactive-hover-surface);
  --ck-pill-color: var(--ck-color-text);
}

.ck.ck-pill {
  align-items: center;
  gap: var(--ck-pill-gap);
  min-height: var(--ck-pill-height);
  padding: var(--ck-pill-padding-block) var(--ck-pill-padding-inline);
  border-radius: var(--ck-pill-radius);
  background: var(--ck-pill-background);
  color: var(--ck-pill-color);
  font-family: var(--ck-pill-font-family);
  font-size: var(--ck-pill-font-size);
  font-weight: var(--ck-pill-font-weight);
  line-height: var(--ck-pill-line-height);
  white-space: nowrap;
  cursor: default;
  display: inline-flex;

  &.ck-pill_small {
    --ck-pill-height: var(--ck-pill-small-height);
    --ck-pill-icon-size: var(--ck-pill-small-icon-size);
    --ck-pill-font-size: var(--ck-pill-small-font-size);
  }

  &.ck-pill_icon-right {
    flex-direction: row-reverse;
  }

  & .ck-pill__icon {
    flex: 0 0 var(--ck-pill-icon-size);
    width: var(--ck-pill-icon-size);
    height: var(--ck-pill-icon-size);
    display: inline-flex;

    & svg {
      width: 100%;
      height: 100%;
    }
  }

  & .ck-pill__label {
    color: inherit;
    font-size: inherit;
    line-height: inherit;
    display: inline-block;
  }
}

.ck .ck-confirm-view-active {
  transition: all var(--ck-transition-duration-control-emphasized) linear;
  transform: translate3d(-100%, 0, 0);
}

.ck .ck-confirm-view {
  font-size: var(--ck-font-size-normal, var(--ck-font-size-base));
  background-color: var(--ck-color-light-red);
  justify-content: flex-start;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
  top: 0;
  left: 100%;

  & .ck-confirm-view-inner {
    padding-top: var(--ck-spacing-standard, var(--ck-spacing-base));
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    max-height: 400px;
    display: flex;
  }

  & p {
    margin: 0;
    font-weight: bold;
  }

  & .ck-confirm-view-actions {
    gap: var(--ck-spacing-gap);
    display: flex;
  }
}

:root, :host {
  --ck-annotation-type-border-width: 0px;
  --ck-comment-box-border-color: var(--ck-color-comment-box-border);
  --ck-suggestion-box-deletion-border-color: var(--ck-color-suggestion-box-deletion-border, var(--ck-color-diff-deletion-box-border));
  --ck-suggestion-box-insertion-border-color: var(--ck-color-suggestion-box-insertion-border, var(--ck-color-diff-insertion-box-border));
  --ck-suggestion-box-format-border-color: var(--ck-color-base-active);
  --ck-suggestion-box-focus-background-color: var(--ck-color-interactive-hover-surface);
  --ck-suggestion-ai-accent-color: var(--ck-color-suggestion-ai-accent, var(--ck-color-base-action));
  --ck-suggestion-ai-accent-background-color: var(--ck-color-suggestion-ai-accent-background, hsla(from var(--ck-color-suggestion-ai-accent, var(--ck-suggestion-ai-accent-color)) h s l / .1));
  --ck-suggestion-ai-author-icon-size: 18px;
  --ck-suggestion-wrapper-border-radius: var(--ck-border-radius-surface);
  --ck-suggestion-marker-insertion-border-color: var(--ck-color-suggestion-marker-insertion-border, var(--ck-color-diff-insertion-border, #119c6780));
  --ck-suggestion-marker-insertion-active-border-color: var(--ck-color-suggestion-marker-insertion-border-active, var(--ck-color-diff-insertion-border-active, #119c6799));
  --ck-suggestion-marker-deletion-border-color: var(--ck-color-suggestion-marker-deletion-border, var(--ck-color-diff-deletion-border, #e0292966));
  --ck-suggestion-marker-deletion-active-border-color: var(--ck-color-suggestion-marker-deletion-border-active, var(--ck-color-diff-deletion-border-active, #e0292980));
  --ck-suggestion-widget-insertion-background-color: var(--ck-color-suggestion-widget-insertion-background, var(--ck-color-diff-insertion-widget-background, #66e5770d));
}

.ck .ck-suggestion {
  border-top-left-radius: var(--ck-border-radius-control);

  &:focus {
    background: var(--ck-suggestion-box-focus-background-color);
    outline: none;
  }
}

.ck .ck-annotation {
  border-left: var(--ck-annotation-type-border-width) solid transparent;
}

.ck .ck-suggestion--disabled-comments .ck-annotation {
  min-height: 80px;
}

.ck .ck-comment, .ck .ck-thread__comment-count, .ck .ck-comment__input-container, .ck .ck-thread__header {
  border-left: var(--ck-annotation-type-border-width) solid var(--ck-comment-box-border-color);
}

.ck .ck-suggestion-insertion .ck-suggestion {
  border-left-color: var(--ck-color-suggestion-box-insertion-border, var(--ck-suggestion-box-insertion-border-color));
}

.ck .ck-suggestion-deletion .ck-suggestion {
  border-left-color: var(--ck-color-suggestion-box-deletion-border, var(--ck-suggestion-box-deletion-border-color));
}

.ck .ck-suggestion-replace .ck-suggestion {
  border-left-color: var(--ck-color-suggestion-box-insertion-border, var(--ck-suggestion-box-insertion-border-color));
}

.ck .ck-suggestion-format .ck-suggestion {
  border-left-color: var(--ck-color-suggestion-box-format-border, var(--ck-suggestion-box-format-border-color));
}

.ck .ck-suggestion-wrapper {
  border-radius: var(--ck-suggestion-wrapper-border-radius);
  overflow: hidden;

  &:focus {
    outline: var(--ck-interactive-focus-ring);
    box-shadow: 0 0 0 4px var(--ck-color-focus-outer-shadow);
  }
}

.ck-balloon-panel:has(.ck-suggestion-wrapper:focus) {
  border: var(--ck-interactive-focus-ring);
  box-shadow: var(--ck-drop-shadow, var(--ck-shadow-md)), var(--ck-focus-outer-shadow, var(--ck-focus-shadow)), 0 0;
  outline: none;
}

.ck .ck-suggestion-type {
  font-weight: bold;
}

.ck .ck-suggestion-color {
  vertical-align: text-bottom;
  border-radius: 14px;
  width: 14px;
  height: 14px;
  margin: 0 5px;
  display: inline-block;
  box-shadow: 0 0 0 1px #454545;
}

.ck .ck-suggestion-insertion .ck-comment, .ck .ck-suggestion-insertion .ck-thread__comment-count, .ck .ck-suggestion-insertion .ck-comment__input-container, .ck .ck-suggestion-replace .ck-comment, .ck .ck-suggestion-replace .ck-thread__comment-count, .ck .ck-suggestion-replace .ck-comment__input-container {
  border-left-color: var(--ck-color-suggestion-box-insertion-border, var(--ck-suggestion-box-insertion-border-color));
}

.ck .ck-suggestion-deletion .ck-comment, .ck .ck-suggestion-deletion .ck-thread__comment-count, .ck .ck-suggestion-deletion .ck-comment__input-container {
  border-left-color: var(--ck-color-suggestion-box-deletion-border, var(--ck-suggestion-box-deletion-border-color));
}

.ck .ck-suggestion-format .ck-comment, .ck .ck-suggestion-format .ck-thread__comment-count, .ck .ck-suggestion-format .ck-comment__input-container {
  border-left-color: var(--ck-color-suggestion-box-format-border, var(--ck-suggestion-box-format-border-color));
}

.ck.ck-pill.ck-pill_ai {
  --ck-pill-background: var(--ck-suggestion-ai-accent-background-color);
  --ck-pill-color: var(--ck-color-suggestion-ai-accent, var(--ck-suggestion-ai-accent-color));
}

.ck .ck-user[data-user-id="ck-ai-author"] .ck-user__img.ck-user__avatar {
  background-color: var(--ck-color-base-foreground);
  box-shadow: 0 0 0 1.5px var(--ck-color-suggestion-ai-accent, var(--ck-suggestion-ai-accent-color));
  color: var(--ck-color-suggestion-ai-accent, var(--ck-suggestion-ai-accent-color));
  justify-content: center;
  align-items: center;
  display: flex;
}

.ck .ck-user[data-user-id="ck-ai-author"] .ck-user__avatar-icon {
  width: var(--ck-suggestion-ai-author-icon-size);
  height: var(--ck-suggestion-ai-author-icon-size);
}

.ck .ck-suggestion__ai-source-pill {
  margin-top: var(--ck-spacing-gap-compact);
  grid-column: 1 / -1;
  justify-content: flex-end;
  display: flex;
}

.ck.ck-aria-description {
  display: none;
}

:root, :host {
  --ck-suggestion-marker-insertion-border-color: var(--ck-color-suggestion-marker-insertion-border, var(--ck-color-diff-insertion-border, #119c6780));
  --ck-suggestion-marker-insertion-active-border-color: var(--ck-color-suggestion-marker-insertion-border-active, var(--ck-color-diff-insertion-border-active, #119c6799));
  --ck-suggestion-marker-insertion-background-color: var(--ck-color-suggestion-marker-insertion-background, var(--ck-color-diff-insertion-background, #119c6733));
  --ck-suggestion-marker-insertion-active-background-color: var(--ck-color-suggestion-marker-insertion-background-active, var(--ck-color-diff-insertion-background-active, #119c674d));
  --ck-suggestion-marker-deletion-border-color: var(--ck-color-suggestion-marker-deletion-border, var(--ck-color-diff-deletion-border, #e0292966));
  --ck-suggestion-marker-deletion-active-border-color: var(--ck-color-suggestion-marker-deletion-border-active, var(--ck-color-diff-deletion-border-active, #e0292980));
  --ck-suggestion-marker-deletion-background-color: var(--ck-color-suggestion-marker-deletion-background, var(--ck-color-diff-deletion-background, #e0292933));
  --ck-suggestion-marker-deletion-active-background-color: var(--ck-color-suggestion-marker-deletion-background-active, var(--ck-color-diff-deletion-background-active, #e029294d));
  --ck-suggestion-marker-deletion-stroke-color: var(--ck-color-suggestion-marker-deletion-stroke, var(--ck-color-diff-deletion-stroke, #c01b1b99));
  --ck-suggestion-marker-format-border-color: var(--ck-color-suggestion-marker-format-border, var(--ck-color-diff-format-border, #99d7e6));
  --ck-suggestion-marker-format-active-border-color: var(--ck-color-suggestion-marker-format-border-active, var(--ck-color-diff-format-border-active, #5cc0d6));
  --ck-suggestion-widget-insertion-background-color: var(--ck-color-suggestion-widget-insertion-background, var(--ck-color-diff-insertion-widget-background, #66e5770d));
  --ck-suggestion-widget-insertion-active-background-color: var(--ck-color-suggestion-widget-insertion-background-active, var(--ck-color-diff-insertion-widget-background-active, #25da3d12));
  --ck-suggestion-widget-deletion-background-color: var(--ck-color-suggestion-widget-deletion-background, var(--ck-color-diff-deletion-widget-background, #e566860d));
  --ck-suggestion-widget-deletion-active-background-color: var(--ck-color-suggestion-widget-deletion-background-active, var(--ck-color-diff-deletion-widget-background-active, #c4214a12));
  --ck-suggestion-widget-format-background-color: var(--ck-color-suggestion-widget-format-background, var(--ck-color-diff-format-widget-background, #0aa0c217));
  --ck-suggestion-widget-format-active-background-color: var(--ck-color-suggestion-widget-format-background-active, var(--ck-color-diff-format-widget-background-active, #0aa0c229));
  --ck-suggestion-widget-th-insertion-background-color: var(--ck-color-suggestion-widget-th-insertion-background, var(--ck-color-diff-insertion-widget-th-background, #66e5771f));
  --ck-suggestion-widget-th-insertion-active-background-color: var(--ck-color-suggestion-widget-th-insertion-background-active, var(--ck-color-diff-insertion-widget-th-background-active, #25da3d24));
  --ck-suggestion-widget-th-deletion-background-color: var(--ck-color-suggestion-widget-th-deletion-background, var(--ck-color-diff-deletion-widget-th-background, #e5668624));
  --ck-suggestion-widget-th-deletion-active-background-color: var(--ck-color-suggestion-widget-th-deletion-background-active, var(--ck-color-diff-deletion-widget-th-background-active, #c4214a29));
}

.ck-content .ck-suggestion-marker-insertion {
  border-top: 3px solid var(--ck-suggestion-marker-insertion-border-color);
  border-bottom: 3px solid var(--ck-suggestion-marker-insertion-border-color);
  background: var(--ck-suggestion-marker-insertion-background-color);

  &.ck-suggestion-marker--active {
    border-color: var(--ck-color-suggestion-marker-insertion-border-active, var(--ck-suggestion-marker-insertion-active-border-color));
    background: var(--ck-color-suggestion-marker-insertion-background-active, var(--ck-suggestion-marker-insertion-active-background-color));
  }

  &.ck-widget {
    border: 3px solid var(--ck-suggestion-marker-insertion-border-color);
    background: none;
    text-decoration: none;

    &.ck-suggestion-marker--active {
      border-color: var(--ck-color-suggestion-marker-insertion-border-active, var(--ck-suggestion-marker-insertion-active-border-color));
    }
  }
}

.ck-content .ck-suggestion-marker-deletion {
  border-top: 3px solid var(--ck-suggestion-marker-deletion-border-color);
  border-bottom: 3px solid var(--ck-suggestion-marker-deletion-border-color);
  text-decoration: line-through;
  text-decoration-color: var(--ck-suggestion-marker-deletion-stroke-color);
  background: var(--ck-suggestion-marker-deletion-background-color);
  text-decoration-thickness: 3px;

  &.ck-suggestion-marker--active {
    border-color: var(--ck-suggestion-marker-deletion-active-border-color);
    background: var(--ck-suggestion-marker-deletion-active-background-color);
  }

  &.ck-widget {
    border: 3px solid var(--ck-suggestion-marker-deletion-border-color);
    background: none;
    text-decoration: none;

    &.ck-suggestion-marker--active {
      border-color: var(--ck-suggestion-marker-deletion-active-border-color);
    }
  }
}

.ck-content .ck-suggestion-marker-merge {
  &:after {
    border-top: 3px solid var(--ck-suggestion-marker-deletion-border-color);
    border-bottom: 3px solid var(--ck-suggestion-marker-deletion-border-color);
    text-decoration: line-through;
    text-decoration-color: var(--ck-suggestion-marker-deletion-stroke-color);
    background: var(--ck-suggestion-marker-deletion-background-color);
    color: var(--ck-suggestion-marker-deletion-stroke-color);
    content: "¶";
  }

  &.ck-suggestion-marker--active:after {
    border-color: var(--ck-suggestion-marker-deletion-active-border-color);
    background: var(--ck-suggestion-marker-deletion-active-background-color);
  }
}

.ck-content .ck-suggestion-marker-split {
  &:after {
    border-top: 3px solid var(--ck-suggestion-marker-insertion-border-color);
    border-bottom: 3px solid var(--ck-suggestion-marker-insertion-border-color);
    background: var(--ck-suggestion-marker-insertion-background-color);
    color: var(--ck-suggestion-marker-insertion-border-color);
    content: "¶";
  }

  &.ck-suggestion-marker--active:after {
    border-color: var(--ck-color-suggestion-marker-insertion-border-active, var(--ck-suggestion-marker-insertion-active-border-color));
    background: var(--ck-color-suggestion-marker-insertion-background-active, var(--ck-suggestion-marker-insertion-active-background-color));
  }
}

.ck-content .ck-suggestion-marker-formatInline {
  border-top: 3px solid var(--ck-color-suggestion-marker-format-border, var(--ck-suggestion-marker-format-border-color));
  border-bottom: 3px solid var(--ck-color-suggestion-marker-format-border, var(--ck-suggestion-marker-format-border-color));

  &.ck-suggestion-marker--active {
    border-color: var(--ck-color-suggestion-marker-format-border-active, var(--ck-suggestion-marker-format-active-border-color));
  }

  &.ck-widget {
    border: 3px solid var(--ck-color-suggestion-marker-format-border, var(--ck-suggestion-marker-format-border-color));
    background: none;

    &.ck-suggestion-marker--active {
      border-color: var(--ck-color-suggestion-marker-format-border-active, var(--ck-suggestion-marker-format-active-border-color));
    }
  }
}

.ck-content .ck-suggestion-marker-formatBlock {
  box-shadow: -7px 0 0 0 var(--ck-color-base-background), -10px 0 0 0 var(--ck-color-suggestion-marker-format-border, var(--ck-suggestion-marker-format-border-color));
  background: none;
  border: 0;

  &.ck-suggestion-marker--active {
    box-shadow: -5px 0 0 0 var(--ck-color-base-background), -8px 0 0 0 var(--ck-color-suggestion-marker-format-border-active, var(--ck-suggestion-marker-format-active-border-color));
  }
}

.ck-content ul .ck-suggestion-marker-formatBlock, .ck-content ol .ck-suggestion-marker-formatBlock {
  box-shadow: -2px 0 0 0 var(--ck-color-base-background), -5px 0 0 0 var(--ck-color-suggestion-marker-format-border, var(--ck-suggestion-marker-format-border-color));

  &.ck-suggestion-marker--active {
    box-shadow: -2px 0 0 0 var(--ck-color-base-background), -5px 0 0 0 var(--ck-color-suggestion-marker-format-border-active, var(--ck-suggestion-marker-format-active-border-color));
  }
}

.ck-content .ck-widget.image > figcaption {
  &.ck-suggestion-marker-deletion {
    background-color: var(--ck-suggestion-widget-deletion-background-color);
    border: none;

    &.ck-suggestion-marker--active {
      background-color: var(--ck-suggestion-widget-deletion-active-background-color);
    }
  }

  &.ck-suggestion-marker-insertion {
    background-color: var(--ck-color-suggestion-widget-insertion-background, var(--ck-suggestion-widget-insertion-background-color));
    border: none;

    &.ck-suggestion-marker--active {
      background-color: var(--ck-color-suggestion-widget-insertion-background-active, var(--ck-suggestion-widget-insertion-active-background-color));
    }
  }
}

.ck-content .ck-suggestion-marker-deletion.ck-widget.image {
  background-color: var(--ck-suggestion-widget-deletion-background-color);

  & img {
    opacity: .6;
  }

  & figcaption {
    background-color: var(--ck-suggestion-widget-deletion-background-color);
  }

  &.ck-suggestion-marker--active {
    background-color: var(--ck-suggestion-widget-deletion-active-background-color);

    & figcaption {
      background-color: var(--ck-suggestion-widget-deletion-active-background-color);
    }
  }
}

.ck-content .ck-suggestion-marker-insertion.ck-widget.image {
  background-color: var(--ck-color-suggestion-widget-insertion-background, var(--ck-suggestion-widget-insertion-background-color));

  & figcaption {
    background-color: var(--ck-color-suggestion-widget-insertion-background, var(--ck-suggestion-widget-insertion-background-color));
  }

  &.ck-suggestion-marker--active {
    background-color: var(--ck-color-suggestion-widget-insertion-background-active, var(--ck-suggestion-widget-insertion-active-background-color));

    & figcaption {
      background-color: var(--ck-color-suggestion-widget-insertion-background-active, var(--ck-suggestion-widget-insertion-active-background-color));
    }
  }
}

.ck-content .ck-suggestion-marker-deletion.ck-widget.ck-horizontal-line {
  background-color: var(--ck-suggestion-widget-deletion-background-color);

  &.ck-suggestion-marker--active {
    background-color: var(--ck-suggestion-widget-deletion-active-background-color);
  }
}

.ck-content .ck-suggestion-marker-insertion.ck-widget.ck-horizontal-line {
  background-color: var(--ck-color-suggestion-widget-insertion-background, var(--ck-suggestion-widget-insertion-background-color));

  &.ck-suggestion-marker--active {
    background-color: var(--ck-color-suggestion-widget-insertion-background-active, var(--ck-suggestion-widget-insertion-active-background-color));
  }
}

.ck-content .ck-suggestion-marker-deletion.ck-widget.media {
  background-color: var(--ck-suggestion-widget-deletion-background-color);

  & .ck-media__wrapper {
    opacity: .6;
  }

  &.ck-suggestion-marker--active {
    background-color: var(--ck-suggestion-widget-deletion-active-background-color);
  }
}

.ck-content .ck-suggestion-marker-insertion.ck-widget.media {
  background-color: var(--ck-color-suggestion-widget-insertion-background, var(--ck-suggestion-widget-insertion-background-color));

  &.ck-suggestion-marker--active {
    background-color: var(--ck-color-suggestion-widget-insertion-background-active, var(--ck-suggestion-widget-insertion-active-background-color));
  }
}

.ck-content .ck-suggestion-marker.ck-widget.ck-merge-field, .ck-content .ck-comment-marker.ck-widget.ck-merge-field {
  border-width: 2px medium;
  border-left-style: none;
  border-left-color: currentColor;
  border-right-style: none;
  border-right-color: currentColor;
  padding-top: 0;
  padding-bottom: 0;
}

.ck-content .ck-suggestion-marker-deletion.ck-widget.ck-merge-field {
  border-top-color: var(--ck-suggestion-marker-deletion-border-color);
  border-bottom-color: var(--ck-suggestion-marker-deletion-border-color);
  background: var(--ck-suggestion-marker-deletion-background-color);

  & :not(.ck-merge-field__affix), &.ck-merge-field_with-value, &.ck-merge-field_with-warning {
    text-decoration: line-through;
    text-decoration-color: var(--ck-suggestion-marker-deletion-stroke-color);
    text-decoration-thickness: 3px;
  }

  &.ck-suggestion-marker--active {
    background-color: var(--ck-suggestion-marker-deletion-active-background-color);
  }
}

.ck-content .ck-suggestion-marker-insertion.ck-widget.ck-merge-field {
  background-color: var(--ck-suggestion-marker-insertion-background-color);

  &.ck-suggestion-marker--active {
    background-color: var(--ck-color-suggestion-marker-insertion-background-active, var(--ck-suggestion-marker-insertion-active-background-color));
  }
}

.ck-content .ck-comment-marker.ck-widget.ck-merge-field {
  background: var(--ck-color-comment-marker, var(--ck-comment-marker-color));

  &.ck-comment-marker--active {
    background: var(--ck-color-comment-marker-active, var(--ck-comment-marker-active-color));
  }
}

.ck-content span.ck-comment-marker:has( + .ck-comment-marker.ck-widget.ck-merge-field), .ck-content span.ck-suggestion-marker:has( + .ck-suggestion-marker.ck-widget.ck-merge-field) {
  margin-right: -1px;
  padding-right: 1px;
}

.ck-content .ck-suggestion-marker-deletion.ck-widget.page-break {
  background-color: var(--ck-suggestion-widget-deletion-background-color);

  &.ck-suggestion-marker--active {
    background-color: var(--ck-suggestion-widget-deletion-active-background-color);
  }
}

.ck-content .ck-suggestion-marker-insertion.ck-widget.page-break {
  background-color: var(--ck-color-suggestion-widget-insertion-background, var(--ck-suggestion-widget-insertion-background-color));

  &.ck-suggestion-marker--active {
    background-color: var(--ck-color-suggestion-widget-insertion-background-active, var(--ck-suggestion-widget-insertion-active-background-color));
  }
}

.ck-content figure.table .ck-suggestion-marker-formatBlock {
  box-shadow: -3px 0 0 0 var(--ck-color-suggestion-marker-format-border, var(--ck-suggestion-marker-format-border-color));

  &.ck-suggestion-marker--active {
    box-shadow: -3px 0 0 0 var(--ck-color-suggestion-marker-format-border-active, var(--ck-suggestion-marker-format-active-border-color));
  }
}

.ck-content .ck-widget.table {
  & > figcaption, & > table > caption {
    &.ck-suggestion-marker-deletion {
      background-color: var(--ck-suggestion-widget-deletion-background-color);
      border: none;

      &.ck-suggestion-marker--active {
        background-color: var(--ck-suggestion-widget-deletion-active-background-color);
      }
    }

    &.ck-suggestion-marker-insertion {
      background-color: var(--ck-color-suggestion-widget-insertion-background, var(--ck-suggestion-widget-insertion-background-color));
      border: none;

      &.ck-suggestion-marker--active {
        background-color: var(--ck-color-suggestion-widget-insertion-background-active, var(--ck-suggestion-widget-insertion-active-background-color));
      }
    }
  }
}

.ck-content .ck-suggestion-marker-insertion.table {
  border-color: var(--ck-suggestion-marker-insertion-border-color);

  & > figcaption, & > table > caption {
    background-color: var(--ck-color-suggestion-widget-insertion-background, var(--ck-suggestion-widget-insertion-background-color));
  }

  & > table {
    & > tbody > tr > th, & > thead > tr > th {
      background-color: var(--ck-color-suggestion-widget-th-insertion-background, var(--ck-suggestion-widget-th-insertion-background-color));
      border-color: var(--ck-suggestion-marker-insertion-border-color);
    }

    & > tbody > tr > td {
      background-color: var(--ck-color-suggestion-widget-insertion-background, var(--ck-suggestion-widget-insertion-background-color));
      border-color: var(--ck-suggestion-marker-insertion-border-color);
    }
  }
}

.ck-content .ck-suggestion-marker-insertion.ck-suggestion-marker--active.table {
  border-color: var(--ck-color-suggestion-marker-insertion-border-active, var(--ck-suggestion-marker-insertion-active-border-color));

  & > figcaption, & > table > caption {
    background-color: var(--ck-color-suggestion-widget-insertion-background-active, var(--ck-suggestion-widget-insertion-active-background-color));
  }

  & > table {
    & > tbody > tr > th, & > thead > tr > th {
      background-color: var(--ck-color-suggestion-widget-th-insertion-background-active, var(--ck-suggestion-widget-th-insertion-active-background-color));
      border-color: var(--ck-color-suggestion-marker-insertion-border-active, var(--ck-suggestion-marker-insertion-active-border-color));
    }

    & > tbody > tr > td {
      background-color: var(--ck-color-suggestion-widget-insertion-background-active, var(--ck-suggestion-widget-insertion-active-background-color));
      border-color: var(--ck-color-suggestion-marker-insertion-border-active, var(--ck-suggestion-marker-insertion-active-border-color));
    }
  }
}

.ck-content .ck-suggestion-marker-deletion.ck-widget.table {
  border-color: var(--ck-suggestion-marker-deletion-border-color);

  & > figcaption, & > table > caption {
    background-color: var(--ck-suggestion-widget-deletion-background-color);
  }

  & > table {
    & > tbody > tr > th, & > thead > tr > th {
      background-color: var(--ck-color-suggestion-widget-th-deletion-background, var(--ck-suggestion-widget-th-deletion-background-color));
      border-color: var(--ck-suggestion-marker-deletion-border-color);
      text-decoration: none;
    }

    & > tbody > tr > td {
      background-color: var(--ck-suggestion-widget-deletion-background-color);
      border-color: var(--ck-suggestion-marker-deletion-border-color);
      text-decoration: none;
    }
  }
}

.ck-content .ck-suggestion-marker-deletion.ck-suggestion-marker--active.table {
  border-color: var(--ck-suggestion-marker-deletion-active-border-color);

  & > figcaption, & > table > caption {
    background-color: var(--ck-suggestion-widget-deletion-active-background-color);
  }

  & > table {
    & > tbody > tr > th, & > thead > tr > th {
      background-color: var(--ck-color-suggestion-widget-th-deletion-background-active, var(--ck-suggestion-widget-th-deletion-active-background-color));
      border-color: var(--ck-suggestion-marker-deletion-active-border-color);
    }

    & > tbody > tr > td {
      background-color: var(--ck-suggestion-widget-deletion-active-background-color);
      border-color: var(--ck-suggestion-marker-deletion-active-border-color);
    }
  }
}

.ck-content .table {
  & th.ck-suggestion-marker-insertion {
    background-color: var(--ck-color-suggestion-widget-th-insertion-background, var(--ck-suggestion-widget-th-insertion-background-color));

    &.ck-suggestion-marker--active {
      background-color: var(--ck-color-suggestion-widget-th-insertion-background-active, var(--ck-suggestion-widget-th-insertion-active-background-color));
    }
  }

  & th.ck-suggestion-marker-deletion {
    background-color: var(--ck-color-suggestion-widget-th-deletion-background, var(--ck-suggestion-widget-th-deletion-background-color));
    text-decoration: none;

    &.ck-suggestion-marker--active {
      background-color: var(--ck-color-suggestion-widget-th-deletion-background-active, var(--ck-suggestion-widget-th-deletion-active-background-color));
    }
  }

  & td.ck-suggestion-marker-insertion {
    background-color: var(--ck-color-suggestion-widget-insertion-background, var(--ck-suggestion-widget-insertion-background-color));

    &.ck-suggestion-marker--active {
      background-color: var(--ck-color-suggestion-widget-insertion-background-active, var(--ck-suggestion-widget-insertion-active-background-color));
    }
  }

  & td.ck-suggestion-marker-deletion {
    background-color: var(--ck-suggestion-widget-deletion-background-color);
    text-decoration: none;

    &.ck-suggestion-marker--active {
      background-color: var(--ck-suggestion-widget-deletion-active-background-color);
    }
  }

  & th.ck-suggestion-marker-formatInline, & td.ck-suggestion-marker-formatInline, & th.ck-suggestion-marker-formatBlock, & td.ck-suggestion-marker-formatBlock {
    background-color: var(--ck-color-suggestion-widget-format-background, var(--ck-suggestion-widget-format-background-color));
    box-shadow: none;

    &.ck-suggestion-marker--active {
      background-color: var(--ck-color-suggestion-widget-format-background-active, var(--ck-suggestion-widget-format-active-background-color));
      box-shadow: none;
    }
  }
}

.ck-content pre > code.ck-suggestion-marker-formatBlock {
  box-shadow: -7px 0 0 0 #ededed, -10px 0 0 0 var(--ck-color-suggestion-marker-format-border, var(--ck-suggestion-marker-format-border-color));
  display: block;

  &.ck-suggestion-marker--active {
    box-shadow: -5px 0 0 0 #ededed, -8px 0 0 0 var(--ck-color-suggestion-marker-format-border-active, var(--ck-suggestion-marker-format-active-border-color));
  }
}

.ck-content .ck-suggestion-marker-deletion.ck-widget.footnotes-wrapper {
  background-color: var(--ck-suggestion-widget-deletion-background-color);

  &.ck-suggestion-marker--active {
    background-color: var(--ck-suggestion-widget-deletion-active-background-color);
  }
}

.ck-content .ck-suggestion-marker-insertion.ck-widget.footnotes-wrapper {
  background-color: var(--ck-color-suggestion-widget-insertion-background, var(--ck-suggestion-widget-insertion-background-color));

  &.ck-suggestion-marker--active {
    background-color: var(--ck-color-suggestion-widget-insertion-background-active, var(--ck-suggestion-widget-insertion-active-background-color));
  }
}

:root, :host {
  --ck-comment-background-color: #f7f9fd;
  --ck-comment-focus-background-color: var(--ck-color-interactive-hover-surface);
  --ck-comment-separator-color: var(--ck-color-comment-separator, #cddeef);
  --ck-comment-remove-background-color: var(--ck-color-comment-remove-background, var(--ck-color-light-red));
  --ck-comment-input-background-color: var(--ck-color-surface-canvas);
  --ck-comment-content-font-family: var(--ck-font-face, var(--ck-font-family));
  --ck-comment-content-font-size: var(--ck-font-size-md);
  --ck-comment-content-font-color: var(--ck-color-text);
  --ck-comment-context-border-color: var(--ck-color-base-attention);
  --ck-comment-thread-line-size: 1px;
  --ck-comment-border-radius: var(--ck-border-radius-surface);
}

.ck .ck-comment__wrapper {
  font-size: var(--ck-font-size-normal, var(--ck-font-size-base));
  transition: all var(--ck-transition-duration-control-emphasized) linear;
  outline: 0;
  position: relative;

  @media (prefers-reduced-motion: reduce) {
    transition: none;
  }

  &:first-of-type {
    border-top-right-radius: var(--ck-comment-border-radius);
    border-top-left-radius: var(--ck-comment-border-radius);
  }

  &:focus {
    background: var(--ck-comment-focus-background-color);
  }

  &:has( + .ck-thread__comment-count) {
    & .ck-comment {
      &:after {
        height: calc(100% - var(--ck-user-avatar-size) - var(--ck-spacing-padding)
					+ var(--ck-size-control-min-height) /* Comment count button height */);
      }
    }
  }
}

.ck .ck-comment {
  &:after {
    content: "";
    opacity: 1;
    left: calc(var(--ck-spacing-standard, var(--ck-spacing-base)) + ( var(--ck-user-avatar-size) / 2 )

			/* Half width of line. */
			- calc(var(--ck-comment-thread-line-size) / 2)
			/* Avatar margin size) */
			+ 2px);
    width: var(--ck-comment-thread-line-size);
    background-color: var(--ck-color-comment-separator, var(--ck-comment-separator-color));
    top: calc(var(--ck-user-avatar-size) + (2 * var(--ck-spacing-padding, var(--ck-spacing-sm))));
    height: calc(100% - var(--ck-user-avatar-size) - var(--ck-spacing-padding));
    border-radius: var(--ck-comment-border-radius);
    display: block;
    position: absolute;
  }
}

.ck .ck-comment--edit {
  background-color: var(--ck-color-comment-input-background, var(--ck-comment-input-background-color));

  &:after {
    opacity: 0;
  }

  & .ck-comment__input-actions {
    margin-top: var(--ck-spacing-standard, var(--ck-spacing-base));
  }
}

.ck .ck-comment__content {
  word-break: normal;
  overflow-wrap: anywhere;
  font-family: var(--ck-comment-content-font-family);
  color: var(--ck-comment-content-font-color);

  & .ck-comment__context {
    border-inline-start: 3px solid var(--ck-comment-context-border-color);
    margin-top: var(--ck-spacing-tiny, var(--ck-spacing-xs));
    margin-bottom: var(--ck-spacing-standard, var(--ck-spacing-base));
    color: var(--ck-color-base-text-light);
    padding-inline-start: var(--ck-spacing-standard, var(--ck-spacing-base));

    & > p {
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow: hidden;
    }
  }
}

.ck .ck-comment--info {
  & .ck-comment__content {
    font-style: italic;
    font-family: var(--ck-comment-content-font-family);
    font-size: var(--ck-comment-content-font-size);
    color: var(--ck-comment-content-font-color);
  }
}

.ck .ck-comment, .ck .ck-comment__input {
  & p {
    margin: 0;
  }

  & ul, & ol {
    margin-left: 10px;
    padding-left: 10px;
  }

  & ul {
    margin-top: 0;
    margin-bottom: 5px;
    list-style: outside;

    & ul {
      list-style: circle;

      & ul {
        list-style: square;
      }
    }
  }
}

.ck .ck-comment__main {
  & .ck-comment__input-wrapper {
    transition: all var(--ck-transition-duration-control-emphasized) linear;
    flex-direction: column;
    display: flex;
    position: relative;

    & .ck-comment__input {
      padding: 0;
    }
  }
}

.ck .ck-comment__user {
  z-index: var(--ck-z-default, var(--ck-z-base));
}

.ck-comment__input-actions .ck.ck-button.ck-comment__input-actions--submit {
  color: #fff;

  &.ck-disabled {
    cursor: default;
  }
}

.ck-comment__input-actions .ck.ck-button.ck-comment__input-actions--cancel {
  color: var(--ck-color-text);
}

.ck .ck-comment__external {
  color: var(--ck-color-annotation-info, var(--ck-annotation-info-color));
  font-style: italic;
  font-size: var(--ck-font-size-tiny, var(--ck-font-size-xs));
  margin-top: var(--ck-spacing-standard, var(--ck-spacing-base));
}

.ck .ck-comment .ck-dropdown {
  & .ck-dropdown__arrow {
    display: none;
  }

  & .ck-list {
    padding: var(--ck-list-padding);
    margin: 0;

    & .ck-list__item {
      color: var(--ck-color-text);
      min-width: auto;
      font-size: 1.2em;

      & .ck-button {
        color: var(--ck-color-text);
      }
    }
  }
}

:root, :host {
  --ck-thread-remove-background-color: var(--ck-color-thread-remove-background, var(--ck-comment-remove-background-color));
  --ck-comment-count-color: #223047;
  --ck-thread-header-background-color: var(--ck-color-thread-header-background, #f3f6fd);
  --ck-thread-header-active-background-color: var(--ck-color-thread-header-active-background, var(--ck-color-interactive-selected-surface));
  --ck-thread-header-button-hover-background: var(--ck-color-interactive-primary-surface-muted);
  --ck-thread-unlinked-background-color: var(--ck-color-unlinked-background, #f5f5f5);
  --ck-thread-unlinked-active-background-color: var(--ck-color-unlinked-active-background, #ebebeb);
  --ck-comment-thread-background-color: transparent;
  --ck-comment-thread-comments-background-color: var(--ck-color-surface-container);
  --ck-thread-header-padding: var(--ck-spacing-padding);
  --ck-thread-border-radius: calc(var(--ck-border-radius-surface) - var(--ck-border-width-surface));
  --ck-thread-comments-border-radius: var(--ck-border-radius-surface);
  --ck-thread-input-border-radius: var(--ck-border-radius-control);
}

.ck .ck-thread {
  border-radius: var(--ck-thread-border-radius);
  width: 100%;
  color: var(--ck-color-text);
  background-color: var(--ck-comment-thread-background-color);
  transition-property: color, background-color, width, outline;
  transition-duration: var(--ck-transition-duration-control-emphasized);
  outline: 0;
  transition-timing-function: ease;
  overflow: hidden;

  @media (prefers-reduced-motion: reduce) {
    transition: none;
  }

  &:focus {
    outline: var(--ck-interactive-focus-ring);
    box-shadow: 0 0 0 4px var(--ck-color-focus-outer-shadow);
  }
}

.ck-balloon-panel:has(.ck-thread:focus) {
  border: var(--ck-interactive-focus-ring);
  box-shadow: var(--ck-shadow-surface-floating), var(--ck-focus-outer-shadow, var(--ck-interactive-focus-shadow)), 0 0;
  outline: none;
}

.ck .ck-thread__header {
  padding: var(--ck-thread-header-padding);
  background-color: var(--ck-thread-header-background-color);
  line-height: 1.57;
  font-size: var(--ck-font-size-normal, var(--ck-font-size-base));
  justify-content: space-between;
  display: flex;

  & .ck-button {
    --ck-button-hover-background: var(--ck-thread-header-button-hover-background);
    font-size: var(--ck-annotation-button-size);
  }

  & .ck-context-wrapper {
    width: 100%;
    min-width: 0;
    padding-right: var(--ck-spacing-large, var(--ck-spacing-lg));
    display: inline-flex;
    position: relative;

    &:has(.ck-context--quotes.overlay) {
      &:before {
        content: " ";
        padding: var(--ck-spacing-control-padding-block) var(--ck-spacing-control-padding-inline);
        font-size: 16px;
        display: block;
      }
    }
  }

  & .ck-context {
    white-space: nowrap;
    width: 100%;
    padding: var(--ck-spacing-control-padding-block) var(--ck-spacing-control-padding-inline);
    display: flex;
    overflow: hidden;

    &.ck-context--quotes {
      &:after, &:before {
        content: "\"";
        display: inline-block;
      }
    }

    & .ck-context__type {
      padding-right: var(--ck-spacing-control-padding-inline);
      font-weight: bold;
    }

    & .ck-context__value {
      text-overflow: ellipsis;
      overflow: hidden;

      &:focus {
        border: var(--ck-interactive-focus-ring);
        box-shadow: var(--ck-focus-outer-shadow, var(--ck-interactive-focus-shadow)), 0 0;
        outline: none;
      }
    }

    &.overlay {
      z-index: 2;
      background: var(--ck-color-surface-canvas);
      box-shadow: var(--ck-shadow-surface-floating);
      border-radius: var(--ck-border-radius-surface);
      white-space: normal;
      box-sizing: border-box;
      display: inline-block;
      position: absolute;
      top: 0;
    }
  }
}

.ck .ck-thread__comment-count {
  --ck-user-avatar-size: 28px;
  padding-left: calc(var(--ck-user-avatar-size) + var(--ck-spacing-standard, var(--ck-spacing-base)) * 2);
  color: var(--ck-color-comment-count, var(--ck-color-base-text-light));
  font-size: var(--ck-font-size-small, var(--ck-font-size-sm));
  cursor: pointer;
  transition: background-color var(--ck-transition-duration-control-emphasized) ease;

  & .ck-button {
    color: var(--ck-color-base-text-light);
  }

  & .ck-button .ck-button__icon {
    width: calc(.5 * var(--ck-icon-size));
    height: calc(.5 * var(--ck-icon-size));
  }
}

.ck .ck-thread--remove {
  & .ck-comment {
    background-color: var(--ck-color-comment-remove-background, var(--ck-comment-remove-background-color));
  }

  & .ck-thread__input--active {
    &.ck-thread__input {
      background-color: var(--ck-color-comment-remove-background, var(--ck-comment-remove-background-color));
    }
  }

  & .ck-thread__comment-count {
    background-color: var(--ck-color-comment-remove-background, var(--ck-comment-remove-background-color));
  }

  & .ck-comment__wrapper {
    & .ck-comment:after {
      opacity: 0;
    }
  }
}

.ck .ck-thread__comments .ck-comment__wrapper {
  &:last-of-type {
    & .ck-comment:after {
      opacity: 0;
    }
  }
}

.ck .ck-thread__container {
  transition: transform var(--ck-transition-duration-control-emphasized) ease;

  @media (prefers-reduced-motion: reduce) {
    transition: none;
  }
}

.ck .ck-thread__comments {
  z-index: var(--ck-z-default, var(--ck-z-base));
  border-radius: var(--ck-thread-comments-border-radius);
  background-color: var(--ck-color-comment-background, var(--ck-comment-thread-comments-background-color));
  margin: 0;
  padding: 0;
  list-style: none;
  position: relative;
}

.ck .ck-thread__user {
  font-size: .85em;
}

.ck .ck-thread__input {
  width: calc(100% - var(--ck-user-avatar-size));
  white-space: normal;
  transition: background-color var(--ck-transition-duration-control) ease-in-out;
  border-radius: var(--ck-thread-input-border-radius);
  min-height: 38px;
}

.ck .ck-thread--active {
  & .ck-comment__options.ck-dropdown, & .ck-thread__input {
    display: block;
  }

  & .ck-thread__header {
    background-color: var(--ck-thread-header-active-background-color);
  }
}

.ck .ck-thread--unlinked {
  --ck-comment-box-border-color: var(--ck-color-comment-box-border, var(--ck-color-base-border));
  --ck-thread-header-background-color: var(--ck-thread-unlinked-background-color);
  --ck-thread-header-active-background-color: var(--ck-thread-unlinked-active-background-color);
}

.ck.ck-button.ck-confirm-view-submit {
  color: var(--ck-color-button-save, var(--ck-button-save-color));
}

.ck.ck-button.ck-confirm-view-cancel {
  color: var(--ck-color-button-cancel, var(--ck-button-cancel-color));
}

:root, :host {
  --ck-comment-input-padding: var(--ck-spacing-padding) var(--ck-spacing-padding);
}

.ck .ck-comment__input-container {
  --ck-user-avatar-size: 28px;
  font-size: var(--ck-font-size-normal, var(--ck-font-size-base));
  padding: var(--ck-comment-input-padding);
  display: none;

  & .ck-user {
    margin-top: calc(var(--ck-spacing-padding) * .8);
  }
}

.ck .ck-comment__input-container--active {
  align-items: flex-start;
  display: flex;
}

.ck .ck-comment__input {
  padding: var(--ck-comment-input-padding);
  color: var(--ck-color-text);
  resize: none;
  transition: color var(--ck-transition-duration-control-emphasized) ease-in-out;
  background-color: #0000;
  border-width: 0;

  @media (prefers-reduced-motion: reduce) {
    transition: none;
  }

  &:focus {
    outline: none;
  }

  & .ck-editor__editable_inline {
    --ck-focus-ring: none;
    --ck-inner-shadow: none;
    --ck-inset-shadow-sm: none;
    font-family: var(--ck-comment-content-font-family);
    font-size: var(--ck-comment-content-font-size);
    color: var(--ck-comment-content-font-color);
    word-break: normal;
    overflow-wrap: anywhere;
    background-color: #0000;
    border: 0;
    padding: 0;
    overflow: visible;
  }
}

.ck-comment__input-wrapper .ck.ck-editor__editable_inline :first-child {
  margin-top: 0;
}

.ck-comment__input-wrapper .ck.ck-editor__editable_inline :last-child {
  margin-bottom: 0;
}

.ck .ck-comment__input-actions {
  text-align: right;
  width: 100%;
  display: none;

  &.ck-comment__input-actions--active {
    display: block;
  }

  & .ck.ck-button {
    cursor: pointer;
    min-height: var(--ck-ui-component-min-height, var(--ck-size-min-height));
    min-width: 60px;
    font-size: var(--ck-annotation-button-size);
    margin-left: var(--ck-spacing-large, var(--ck-spacing-lg));
    padding: 0 var(--ck-spacing-control-padding-inline);
    justify-content: center;
    align-items: center;
    display: inline-flex;
  }
}

.ck .ck-comment__input-textarea {
  display: block;
}

:root, :host {
  --ck-inline-annotation-container-width: var(--ck-width-sm);
  --ck-inline-annotation-container-max-height: 400px;
}

.ck.ck-balloon-panel .ck-annotation-wrapper {
  border-radius: calc(var(--ck-balloon-panel-border-radius) - var(--ck-border-width-surface));
  width: var(--ck-inline-annotation-container-width);
  max-height: var(--ck-inline-annotation-container-max-height);
  overscroll-behavior-y: contain;
  border: none;
  position: static;
  overflow: hidden auto;
}

.ck.ck-balloon-panel .ck-annotation {
  animation: none;
}

.ck.ck-balloon-panel .ck-annotation-wrapper * {
  white-space: normal;
}

.ck.ck-balloon-panel .ck-annotation-wrapper strong {
  font-weight: bold;
}

.ck.ck-balloon-panel .ck-annotation-wrapper i {
  font-style: italic;
}

.ck.ck-balloon-panel .ck-annotation-wrapper .ck-suggestion-type {
  vertical-align: baseline;
}

:root, :host {
  --ck-annotation-counter-icon-font-size: var(--ck-annotation-counter-icon-size, 14px);
  --ck-annotation-counter-icon-left: 3px;
  --ck-annotation-counter-icon-top: 9px;
  --ck-annotation-counter-number-size: .642em;
  --ck-annotation-counter-badge-left: 15px;
  --ck-annotation-counter-badge-top: 1px;
  --ck-annotation-counter-badge-gap: 1px;
  --ck-annotation-counter-badge-size: var(--ck-annotation-counter-icon-font-size);
  --ck-annotation-counter-color: var(--ck-color-base-text-light);
  --ck-annotation-counter-hover-color: var(--ck-color-base-text);
  --ck-annotation-counter-focus-color: var(--ck-color-base-active);
}

.ck.ck-sidebar--narrow .ck-sidebar-item {
  justify-content: center;
  display: flex;
}

.ck.ck-sidebar--narrow .ck-annotation-counter {
  font-size: var(--ck-annotation-counter-icon-font-size);
  cursor: pointer;
  color: var(--ck-annotation-counter-color);
  padding: 0;

  &:hover {
    color: var(--ck-annotation-counter-hover-color);
    box-shadow: none;
    background: none;

    & .ck-annotation-counter__badge {
      background: var(--ck-annotation-counter-hover-color);
    }
  }

  &:focus {
    color: var(--ck-annotation-counter-focus-color);
    border-color: var(--ck-input-focus-border-color);
    box-shadow: var(--ck-focus-outer-shadow, var(--ck-interactive-focus-shadow)), 0 0;
    outline: none;

    & .ck-annotation-counter__badge {
      background: var(--ck-annotation-counter-focus-color);
    }
  }

  & .ck-icon {
    --ck-annotation-counter-icon-mask-x: calc(var(--ck-annotation-counter-badge-left) - var(--ck-annotation-counter-icon-left) + calc(var(--ck-annotation-counter-badge-size) / 2));
    --ck-annotation-counter-icon-mask-y: calc(var(--ck-annotation-counter-badge-top) - var(--ck-annotation-counter-icon-top) + calc(var(--ck-annotation-counter-badge-size) / 2));
    left: var(--ck-annotation-counter-icon-left);
    top: var(--ck-annotation-counter-icon-top);
    mask: radial-gradient(circle at var(--ck-annotation-counter-icon-mask-x) var(--ck-annotation-counter-icon-mask-y),
			transparent calc(var(--ck-annotation-counter-badge-size) / 2 + var(--ck-annotation-counter-badge-gap)),
			#000 calc(var(--ck-annotation-counter-badge-size) / 2 + var(--ck-annotation-counter-badge-gap) + .5px));
    position: absolute;
  }

  & .ck-annotation-counter__badge {
    width: var(--ck-annotation-counter-badge-size);
    height: var(--ck-annotation-counter-badge-size);
    background: var(--ck-annotation-counter-color);
    color: #fff;
    font-weight: bold;
    font-size: var(--ck-annotation-counter-number-size);
    font-family: var(--ck-font-face, var(--ck-font-family));
    left: var(--ck-annotation-counter-badge-left);
    top: var(--ck-annotation-counter-badge-top);
    line-height: var(--ck-annotation-counter-badge-size);
    z-index: 1;
    border-radius: 50%;
    justify-content: center;
    display: flex;
    position: absolute;

    &.ck-annotation-counter__badge--edit-mode {
      line-height: 1;
    }
  }
}

:root, :host {
  --ck-annotation-icon-color: var(--ck-color-text);
  --ck-annotation-info-color: var(--ck-color-text);
  --ck-annotation-info-name-color: var(--ck-color-text);
  --ck-annotation-info-icon-color: var(--ck-color-text-secondary);
  --ck-annotation-info-time-color: var(--ck-color-text-secondary);
  --ck-annotation-button-size: .85em;
  --ck-annotation-dropdown-button-size: 14px;
  --ck-annotation-padding: var(--ck-spacing-padding) var(--ck-spacing-padding);
  --ck-annotation-content-wrapper-padding-inline-end: var(--ck-spacing-padding);
  --ck-annotation-main-border-radius: var(--ck-border-radius-surface);
  --ck-annotation-button-border-radius: var(--ck-border-radius-control);
}

.ck .ck-annotation {
  --ck-user-avatar-size: 28px;
  font-size: var(--ck-font-size-normal, var(--ck-font-size-base));
  animation: annotationFadeInLeft var(--ck-animation-duration-surface-entrance);
  transition: background-color var(--ck-transition-duration-control-emphasized) ease;
  padding: var(--ck-annotation-padding);
  white-space: normal;
  display: flex;
  position: relative;

  @media (prefers-reduced-motion: reduce) {
    transition: none;
    animation: none;
  }

  & .ck-button {
    min-width: unset;
    min-height: unset;
    color: var(--ck-color-annotation-icon, var(--ck-annotation-icon-color));
    border-radius: var(--ck-annotation-button-border-radius);

    &:not(.ck-disabled) {
      cursor: pointer;
    }
  }

  & .ck-user {
    font-size: 12px;
  }

  & .ck-dropdown .ck-list {
    & > .ck-list__item:has( > .ck-hidden) {
      display: none;
    }

    & .ck-button {
      font-size: var(--ck-annotation-dropdown-button-size);
    }
  }
}

.ck .ck-annotation__main {
  width: calc(100% - var(--ck-user-avatar-size));
  transition: all var(--ck-transition-duration-control) ease;
  border-radius: var(--ck-annotation-main-border-radius);
  padding-left: var(--ck-spacing-padding);
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "info actions"
                       "content content";
  display: grid;

  @media (prefers-reduced-motion: reduce) {
    transition: none;
  }
}

.ck .ck-annotation__main p {
  white-space: normal;
  font-size: var(--ck-comment-content-font-size);
  margin: 0;
  line-height: 1.5em;

  & .ck-suggestion-type {
    font-size: var(--ck-comment-content-font-size);
    line-height: 1.5em;
  }
}

.ck .ck-annotation__user {
  margin-top: var(--ck-spacing-gap-compact);
}

.ck .ck-annotation__info {
  min-height: 2.4em;
  margin-bottom: var(--ck-spacing-gap-compact);
  grid-area: info;
  grid-template-columns: auto minmax(0, 1fr);
  display: grid;
}

.ck .ck-annotation__info-name, .ck .ck-annotation__info-time {
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: var(--ck-font-size-small, var(--ck-font-size-sm));
  line-height: var(--ck-line-height-base);
  overflow: hidden;
}

.ck .ck-annotation__info .ck-icon {
  font-size: var(--ck-font-size-tiny, var(--ck-font-size-xs));
  color: var(--ck-annotation-info-icon-color);
  grid-column: 1;
  align-self: center;
  margin-inline-end: var(--ck-spacing-padding-compact);
}

.ck .ck-annotation__info-name {
  font-weight: 500;
  font-size: var(--ck-font-size-control);
  color: var(--ck-color-annotation-info, var(--ck-annotation-info-name-color));
  grid-column: 1 / -1;
}

.ck .ck-annotation__info-time {
  color: var(--ck-color-annotation-info, var(--ck-annotation-info-time-color));
  grid-column: 2;
}

.ck.ck-balloon-panel .ck-annotation-wrapper .ck-annotation__info-name, .ck.ck-balloon-panel .ck-annotation-wrapper .ck-annotation__info-time {
  white-space: nowrap;
}

.ck .ck-annotation__actions {
  align-items: flex-start;
  gap: var(--ck-spacing-gap-snug);
  grid-area: actions;
  display: flex;

  & .ck.ck-dropdown {
    align-items: flex-start;
    display: flex;
  }
}

.ck .ck-annotation__content-wrapper {
  grid-area: content;
  width: 100%;

  &:not(:has(.ck-comment__input-wrapper)), & .ck-comment__input-wrapper .ck-comment__input {
    padding-inline-end: var(--ck-annotation-content-wrapper-padding-inline-end);
  }
}

@keyframes annotationFadeInLeft {
  from {
    opacity: 0;
    transform: translate3d(-5%, 0, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

:root, :host {
  --ck-annotation-wrapper-background-color: var(--ck-color-annotation-wrapper-background, #fff);
  --ck-annotation-wrapper-shadow: var(--ck-color-annotation-wrapper-drop-shadow, 0 1px 1px 1px #e6e6e6);
  --ck-annotation-wrapper-border-radius: var(--ck-border-radius-surface);
}

.ck.ck-sidebar {
  outline: 0;
  transition: min-height .25s;
  position: relative;

  @media (prefers-reduced-motion: reduce) {
    transition: none;
  }
}

.ck-sidebar-item {
  width: 100%;
  transition: top var(--ck-transition-duration-control-emphasized) ease, box-shadow var(--ck-transition-duration-control-emphasized) ease;
  position: absolute;

  @media (prefers-reduced-motion: reduce) {
    transition: none;
  }
}

.ck-sidebar-item--no-animation {
  transition: top !important;
}

.ck.ck-annotation-wrapper {
  border-radius: var(--ck-annotation-wrapper-border-radius);
  background: var(--ck-color-annotation-wrapper-background, var(--ck-annotation-wrapper-background-color));
  border: var(--ck-border-surface);
  outline: 0;
}

.ck.ck-annotation-wrapper--active, .ck.ck-annotation-wrapper:hover {
  & .ck-annotation__actions {
    opacity: 1;
  }
}

:root, :host {
  --ck-comments-archive-width: var(--ck-width-dialog);
  --ck-comments-archive-info-font-size: var(--ck-font-size-md);
}

.ck .ck-comments-archive-dropdown {
  &.ck-dropdown__panel {
    z-index: var(--ck-z-panel);
  }
}

.ck .ck-comments-archive {
  width: var(--ck-comments-archive-width);
  box-sizing: content-box;
  max-height: 450px;

  & .ck-annotation {
    animation: none;
  }

  & .ck-comments-archive__header, & .ck-comments-archive__content {
    max-height: 410px;
    padding: var(--ck-spacing-padding-comfortable);
    overflow: auto;
  }

  & .ck-comments-archive__header {
    max-height: 40px;
    line-height: var(--ck-font-size-normal, var(--ck-font-size-base));
    border-bottom: var(--ck-border-divider);
    font-weight: bold;
  }

  & .ck-comments-archive__content {
    & .ck-annotation-wrapper:not(:last-child) {
      margin-bottom: var(--ck-spacing-gap-comfortable);
    }
  }

  & .ck-comments-archive__info {
    text-align: center;
    font-style: italic;
    font-size: var(--ck-comments-archive-info-font-size);
    color: var(--ck-annotation-info-color);
  }
}

:root, :host {
  --ck-comment-marker-color: #fdecc3;
  --ck-comment-marker-active-color: #fbd988;
}

.ck-content .ck-comment-marker {
  background: var(--ck-color-comment-marker, var(--ck-comment-marker-color));
  border-top: 3px solid #0000;
  border-bottom: 3px solid #0000;

  &.ck-widget {
    border: 3px solid var(--ck-color-comment-marker, var(--ck-comment-marker-color));
    background-color: #0000;
  }
}

.ck-content .ck-comment-marker--active {
  background: var(--ck-color-comment-marker-active, var(--ck-comment-marker-active-color));

  & .ck-comment-marker {
    background: var(--ck-color-comment-marker-active, var(--ck-comment-marker-active-color));
  }

  &.ck-widget {
    border-color: var(--ck-color-comment-marker-active, var(--ck-comment-marker-active-color));

    & .ck-comment-marker {
      background-color: var(--ck-color-comment-marker, var(--ck-comment-marker-color));
    }
  }
}

:root, :host {
  --ck-document-outline-padding: var(--ck-spacing-padding-comfortable);
  --ck-document-outline-base-font-size: .875em;
  --ck-document-outline-placeholder-color: var(--ck-color-engine-placeholder-text);
  --ck-document-outline-indent-level-1: 0;
  --ck-document-outline-indent-level-2: 1.5em;
  --ck-document-outline-indent-level-3: 3em;
  --ck-document-outline-indent-level-4: 4.5em;
  --ck-document-outline-indent-level-5: 6em;
  --ck-document-outline-indent-level-6: 7.5em;
  --ck-document-outline-item-padding: var(--ck-spacing-control-padding-block);
  --ck-document-outline-item-active-color: var(--ck-color-base-active);
  --ck-document-outline-item-default-color: #424242;
  --ck-document-outline-item-hover-state-color: var(--ck-color-text);
}

.ck.ck-document-outline {
  padding: var(--ck-document-outline-padding);
  font-size: var(--ck-document-outline-base-font-size);
  -webkit-user-select: none;
  user-select: none;

  &:empty:before {
    content: attr(data-document-outline-empty-placeholder);
    color: var(--ck-document-outline-placeholder-color);
    display: inline-block;
  }

  & .ck-document-outline__item {
    padding: var(--ck-document-outline-item-padding);
    color: var(--ck-document-outline-item-default-color);
    white-space: nowrap;
    text-overflow: ellipsis;
    cursor: pointer;
    overflow: hidden;

    &.ck-document-outline__item_empty {
      font-style: italic;
    }

    &.ck-document-outline__item_empty:hover, &:hover {
      color: var(--ck-document-outline-item-hover-state-color);
      text-decoration: underline;
    }

    &.ck-document-outline__item_active {
      color: var(--ck-document-outline-item-active-color);
    }
  }

  &[dir="ltr"] {
    & .ck-document-outline__item {
      &.ck-document-outline__item_level-1 {
        padding-left: var(--ck-document-outline-indent-level-1);
      }

      &.ck-document-outline__item_level-2 {
        padding-left: var(--ck-document-outline-indent-level-2);
      }

      &.ck-document-outline__item_level-3 {
        padding-left: var(--ck-document-outline-indent-level-3);
      }

      &.ck-document-outline__item_level-4 {
        padding-left: var(--ck-document-outline-indent-level-4);
      }

      &.ck-document-outline__item_level-5 {
        padding-left: var(--ck-document-outline-indent-level-5);
      }

      &.ck-document-outline__item_level-6 {
        padding-left: var(--ck-document-outline-indent-level-6);
      }
    }
  }

  &[dir="rtl"] {
    & .ck-document-outline__item {
      &.ck-document-outline__item_level-1 {
        padding-right: var(--ck-document-outline-indent-level-1);
      }

      &.ck-document-outline__item_level-2 {
        padding-right: var(--ck-document-outline-indent-level-2);
      }

      &.ck-document-outline__item_level-3 {
        padding-right: var(--ck-document-outline-indent-level-3);
      }

      &.ck-document-outline__item_level-4 {
        padding-right: var(--ck-document-outline-indent-level-4);
      }

      &.ck-document-outline__item_level-5 {
        padding-right: var(--ck-document-outline-indent-level-5);
      }

      &.ck-document-outline__item_level-6 {
        padding-right: var(--ck-document-outline-indent-level-6);
      }
    }
  }
}

:root, :host {
  --ck-table-of-contents-border-color: var(--ck-color-border-container);
  --ck-table-of-contents-label-background-color: var(--ck-color-base-text-light);
  --ck-table-of-contents-background-color: var(--ck-color-base-foreground);
}

.ck-editor__editable .ck-widget.table-of-contents {
  background-color: var(--ck-table-of-contents-background-color);
  border: 1px solid var(--ck-table-of-contents-border-color);
  min-width: 15em;
  display: flow-root;
  position: relative;

  &.table-of-contents_empty {
    display: flow-root;
  }

  &[data-table-of-contents-label]:after {
    content: attr(data-table-of-contents-label);
    padding: var(--ck-spacing-control-padding-block-compact) var(--ck-spacing-control-padding-inline);
    background-color: var(--ck-table-of-contents-label-background-color);
    border-radius: var(--ck-widget-label-border-radius);
    font-size: 10px;
    font-family: var(--ck-font-face, var(--ck-font-family));
    color: #fff;
    white-space: nowrap;
    line-height: 16px;
    position: absolute;
    top: -1px;
    right: 10px;

    [dir="rtl"] & {
      left: 10px;
      right: auto;
    }
  }
}

:root, :host {
  --ck-content-table-of-contents-padding: 1em;
  --ck-content-table-of-contents-line-height: 1.5;
  --ck-content-table-of-contents-items-start-padding: 24px;
}

.ck-content {
  & .table-of-contents {
    margin: .9em auto;

    &.table-of-contents_empty {
      display: none;
    }

    & .table-of-contents__placeholder {
      padding: var(--ck-content-table-of-contents-padding);
      margin: 0;
      font-style: italic;
    }

    & > ol {
      padding: var(--ck-content-table-of-contents-padding);
    }

    & ol {
      line-height: var(--ck-content-table-of-contents-line-height);
      margin: 0;
      list-style-type: none;

      & ol {
        padding-inline-start: var(--ck-content-table-of-contents-items-start-padding);
      }

      & li {
        white-space: nowrap;
        text-overflow: ellipsis;
        cursor: default;
        overflow: hidden;
      }
    }
  }
}

:root, :host {
  --ck-footnotes-widget-label-background-color: var(--ck-color-base-text-light);
}

.ck.ck-editor__editable {
  & .footnotes.ck-widget {
    margin: .9em 0 .85em;
    display: flow-root;
    position: relative;

    &:not(:hover):not(.ck-widget_selected) {
      outline: 1px solid var(--ck-color-border-container);
    }

    &[data-footnotes-list-label]:after {
      content: attr(data-footnotes-list-label);
      padding: var(--ck-spacing-control-padding-block-compact) var(--ck-spacing-control-padding-inline);
      background-color: var(--ck-footnotes-widget-label-background-color);
      border-radius: var(--ck-widget-label-border-radius);
      font-size: 10px;
      font-family: var(--ck-font-face, var(--ck-font-family));
      color: #fff;
      white-space: nowrap;
      line-height: 16px;
      position: absolute;
      top: -1px;
      right: 10px;

      [dir="rtl"] & {
        left: 10px;
        right: auto;
      }
    }

    & > .footnotes-list > .footnote-definition {
      padding: var(--ck-spacing-padding-compact) 0;
    }
  }

  & .footnotes-divider {
    margin-top: 0;
  }

  & .footnotes-list {
    margin-top: 0;
    margin-bottom: .65em;
  }

  & .footnote-content.ck-editor__nested-editable {
    border-radius: var(--ck-input-border-radius);
    padding: var(--ck-input-padding);
    margin-top: calc(-1 * var(--ck-spacing-padding-compact));

    &.ck-editor__nested-editable_focused, &:focus {
      border-color: var(--ck-input-focus-border-color);
      box-shadow: var(--ck-focus-outer-shadow, var(--ck-interactive-focus-shadow)), 0 0;
      outline: none;
    }
  }
}

:root, :host {
  --ck-footnotes-styles-list-style-button-size: 44px;
}

.ck.ck-footnotes-definitions-properties {
  & > .ck-footnotes-definitions-styles-list {
    row-gap: var(--ck-spacing-gap);
    column-gap: var(--ck-spacing-gap);
    padding: var(--ck-list-styles-list-padding);
    grid-template-columns: repeat(4, auto);
    display: grid;

    & .ck-button {
      width: var(--ck-footnotes-styles-list-style-button-size);
      height: var(--ck-footnotes-styles-list-style-button-size);
      box-sizing: content-box;
      margin: 0;
      padding: 0;

      & .ck-icon {
        width: var(--ck-footnotes-styles-list-style-button-size);
        height: var(--ck-footnotes-styles-list-style-button-size);
      }
    }
  }

  & > .ck-collapsible {
    border-top: var(--ck-border-divider);

    & .ck-footnotes-definitions-properties__start-index .ck-input {
      min-width: 100%;
    }
  }
}

:root, :host {
  --ck-content-footnotes-list-background-color: none;
  --ck-content-footnotes-list-separator-color: #000;
  --ck-content-footnote-font-size: var(--ck-content-font-size-small);
}

.ck-content {
  & .footnote {
    margin-inline-end: .2em;
  }

  & .footnotes {
    font-size: var(--ck-content-footnote-font-size);
    background-color: var(--ck-content-footnotes-list-background-color);
    margin: .9em 0 1.5em;
    position: relative;
  }

  & .footnotes-divider {
    border: none;
    border-top: 1px solid var(--ck-content-footnotes-list-separator-color);
    background: none;
    width: min(30%, 350px);
    height: 1px;
    margin: 0 0 1em;
    display: block;

    [dir="rtl"] & {
      margin-left: auto;
      margin-right: 0;
    }
  }

  & .footnotes-list {
    margin: 0;
    padding-inline-start: 3em;
  }

  & .footnote-backlink {
    -webkit-user-select: none;
    user-select: none;
    vertical-align: top;
    width: auto;
    margin-inline-end: 1ch;
    display: inline-block;
  }

  & .footnote-content {
    vertical-align: top;
    width: calc(100% - 2em);
    padding: 0 4px;
    display: inline-block;

    & > p:first-of-type {
      margin-top: 0;
    }

    & > p:last-of-type {
      margin-bottom: 0;
    }

    & ol {
      list-style-type: decimal;
    }

    & ol ol {
      list-style-type: lower-latin;
    }

    & ol ol ol {
      list-style-type: lower-roman;
    }

    & ol ol ol ol {
      list-style-type: upper-latin;
    }

    & ol ol ol ol ol {
      list-style-type: upper-roman;
    }
  }
}

.ck.ck-editor__editable_inline.ck-format-painter-active {
  &, & a, & .ck-widget .ck-editor__nested-editable, & a .ck-widget .ck-editor__nested-editable {
    cursor: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMSAyMCIgd2lkdGg9IjMwIiBoZWlnaHQ9IjIwIj4KICA8cGF0aCBkPSJNMTQgM2ExIDEgMCAwIDEgMS0xaDEwYTEgMSAwIDAgMSAxIDF2MmExIDEgMCAwIDEtMSAxSDE1YTEgMSAwIDAgMS0xLTFWM1oiIGZpbGw9IiMwMDAiLz4KICA8cGF0aCBkPSJNMjcgMy4yNWExLjUgMS41IDAgMCAxIDEuNSAxLjV2MS43YTIuMjUgMi4yNSAwIDAgMS0xLjkzMiAyLjIyNmwtNC40MjQuNjMyYS43NS43NSAwIDAgMC0uNjQ0Ljc0M1YxMWExIDEgMCAwIDEgMSAxdjVhMSAxIDAgMCAxLTEgMUgyMGExIDEgMCAwIDEtMS0xdi01YTEgMSAwIDAgMSAxLTF2LS45NWEyLjI1IDIuMjUgMCAwIDEgMS45MzItMi4yMjZsNC40MjQtLjYzMkEuNzUuNzUgMCAwIDAgMjcgNi40NDlWMy4yNVoiIGZpbGw9IiMwMDAiLz4KICA8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTI2Ljg1NSAyLjI1SDI3YTIuNSAyLjUgMCAwIDEgMi41IDIuNXYxLjdhMy4yNSAzLjI1IDAgMCAxLTIuNzkgMy4yMTZsLTQuMjEuNjAyYTIgMiAwIDAgMSAxIDEuNzMydjVhMiAyIDAgMCAxLTIgMkgyMGEyIDIgMCAwIDEtMi0ydi01YTIgMiAwIDAgMSAxLTEuNzMydi0uMjE3QTMuMjUgMy4yNSAwIDAgMSAyMS4xMjkgN0gxNWEyIDIgMCAwIDEtMi0yVjNhMiAyIDAgMCAxIDItMmgxMGEyIDIgMCAwIDEgMS44NTUgMS4yNVpNMjAgMTAuMDVWMTFhMSAxIDAgMCAwLTEgMXY1YTEgMSAwIDAgMCAxIDFoMS41YTEgMSAwIDAgMCAxLTF2LTVhMSAxIDAgMCAwLTEtMXYtLjk1YzAtLjAxNiAwLS4wMzMuMDAyLS4wNWEuNzUuNzUgMCAwIDEgLjY0Mi0uNjkybDQuNDI0LS42MzJBMi4yNSAyLjI1IDAgMCAwIDI4LjUgNi40NVY0Ljc1YTEuNDk2IDEuNDk2IDAgMCAwLTEuNS0xLjV2My4yYS43NS43NSAwIDAgMS0uNjQ0Ljc0MmwtNC40MjQuNjMyQTIuMjUgMi4yNSAwIDAgMCAyMCAxMC4wNVpNMTUgMmExIDEgMCAwIDAtMSAxdjJhMSAxIDAgMCAwIDEgMWgxMGExIDEgMCAwIDAgMS0xVjNhMSAxIDAgMCAwLTEtMUgxNVoiIGZpbGw9IiNmZmYiLz4KICA8cGF0aCBkPSJNMi41IDIuNUEuNS41IDAgMCAxIDMgMmgyLjVhLjUuNSAwIDAgMSAuMzU0LjE0NmwuNjQ2LjY0Ny42NDYtLjY0N0EuNS41IDAgMCAxIDcuNSAySDEwYS41LjUgMCAwIDEgMCAxSDcuNzA3TDcgMy43MDdWMTBoLjVhLjUuNSAwIDAgMSAwIDFIN3Y0Ljc5M2wuNzA3LjcwN0gxMGEuNS41IDAgMCAxIDAgMUg3LjVhLjUuNSAwIDAgMS0uMzU0LS4xNDZsLS42NDYtLjY0Ny0uNjQ2LjY0N2EuNS41IDAgMCAxLS4zNTQuMTQ2SDNhLjUuNSAwIDAgMSAwLTFoMi4yOTNMNiAxNS43OTNWMTFoLS41YS41LjUgMCAwIDEgMC0xSDZWMy43MDdMNS4yOTMgM0gzYS41LjUgMCAwIDEtLjUtLjVaIiBmaWxsPSIjMDAwIi8+CiAgPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Im01Ljc5MyAzLjUtLjUtLjVIM2EuNS41IDAgMCAxIDAtMWgyLjVhLjUuNSAwIDAgMSAuMzU0LjE0NmwuMTQ1LjE0Ni41MDEuNS42NDYtLjY0NkEuNS41IDAgMCAxIDcuNSAySDEwYS41LjUgMCAwIDEgMCAxSDcuNzA3TDcgMy43MDdWMTBoLjVhLjUuNSAwIDAgMSAwIDFIN3Y0Ljc5M2wuNzA3LjcwN0gxMGEuNS41IDAgMCAxIDAgMUg3LjVhLjUuNSAwIDAgMS0uMzU0LS4xNDZsLS42NDYtLjY0Ny0uNS41LS4xNDYuMTQ3YS41LjUgMCAwIDEtLjM1NC4xNDZIM2EuNS41IDAgMCAxIDAtMWgyLjI5M0w2IDE1Ljc5M1YxMWgtLjVhLjUuNSAwIDAgMSAwLTFINlYzLjcwN0w1Ljc5MyAzLjVabS0uOTE0LjVMNSA0LjEyMXY0Ljk2NGExLjUgMS41IDAgMCAwIDAgMi44M3YzLjQ2NGwtLjEyMS4xMjFIM2ExLjUgMS41IDAgMCAwIDAgM2gyLjVhMS41IDEuNSAwIDAgMCAxLS4zODIgMS41IDEuNSAwIDAgMCAxIC4zODJIMTBhMS41IDEuNSAwIDAgMCAwLTNIOC4xMjFMOCAxNS4zNzl2LTMuNDY0YTEuNSAxLjUgMCAwIDAgMC0yLjgzVjQuMTIxTDguMTIxIDRIMTBhMS41IDEuNSAwIDAgMCAwLTNINy41YTEuNSAxLjUgMCAwIDAtMSAuMzgyQTEuNSAxLjUgMCAwIDAgNS41IDFIM2ExLjUgMS41IDAgMSAwIDAgM2gxLjg3OVoiIGZpbGw9IiNmZmYiLz4KPC9zdmc+Cg==") 3 3, text;
  }
}

.ck-editor__editable.ck-content .todo-list {
  & li.ck-list-marker-line-height > .todo-list__label.todo-list__label_without-description {
    & > span[contenteditable="false"] {
      width: 0;
      display: inline-block;
    }
  }
}

.ck-content .line-height-single {
  line-height: 1;
}

.ck-content .line-height-double {
  line-height: 2;
}

:root, :host {
  --ck-content-list-marker-line-height: var(--ck-content-line-height);
}

.ck-content .todo-list {
  & li.ck-list-marker-line-height {
    &:before {
      line-height: var(--ck-content-list-marker-line-height);
      content: "";
    }

    & > .todo-list__label.todo-list__label_without-description {
      width: 0;
      line-height: var(--ck-content-list-marker-line-height);
      position: absolute;

      & input[type="checkbox"] {
        margin: 0;
        position: relative;
      }
    }
  }
}

.ck-editor__editable .multi-level-list {
  & li {
    & .multi-level-list__marker {
      &:before {
        content: attr(data-multi-level-list-marker);
      }
    }
  }
}

.ck.ck-multi-level-list-properties {
  &.ck-multi-level-list-properties_without-styles {
    padding: var(--ck-list-styles-list-padding);

    & > * {
      min-width: 14em;

      & + * {
        margin-top: var(--ck-spacing-standard, var(--ck-spacing-base));
      }
    }
  }

  &.ck-multi-level-list-properties_with-multi-level-properties {
    & > .ck-multi-level-list-styles {
      grid-template-columns: repeat(4, auto);
    }

    & > .ck-collapsible {
      border-top: 1px solid var(--ck-color-divider);

      & > .ck-collapsible__children {
        & > * {
          width: 100%;

          & + * {
            margin-top: var(--ck-spacing-standard, var(--ck-spacing-base));
          }
        }
      }
    }
  }

  & .ck.ck-multi-level-list-properties__start-index .ck-input {
    width: 100%;
    min-width: auto;
  }
}

.ck-content .multi-level-list {
  list-style: none;

  & li {
    position: relative;

    & .multi-level-list__marker {
      pointer-events: none;

      &::selection {
        background-color: #0000;
      }

      &:not(:has(span)) {
        padding-inline-end: 5px;
        position: absolute;
        transform: translate(-100%);
      }

      &:has(span) {
        text-wrap: nowrap;
        width: 0;
        display: inline-block;
        position: relative;

        &:before, & > span {
          padding-inline-end: 5px;
          position: absolute;
          transform: translate(-100%);
        }
      }
    }

    &.ck-list-marker-bold > .multi-level-list__marker, &.ck-list-marker-bold > * > .multi-level-list__marker {
      font-weight: bold;
    }

    &.ck-list-marker-italic > .multi-level-list__marker, &.ck-list-marker-italic > * > .multi-level-list__marker {
      font-style: italic;
    }

    &.ck-list-marker-color > .multi-level-list__marker, &.ck-list-marker-color > * > .multi-level-list__marker {
      color: var(--ck-content-list-marker-color);
    }

    &.ck-list-marker-font-family > .multi-level-list__marker, &.ck-list-marker-font-family > * > .multi-level-list__marker {
      font-family: var(--ck-content-list-marker-font-family);
    }

    &.ck-list-marker-font-size > .multi-level-list__marker, &.ck-list-marker-font-size > * > .multi-level-list__marker {
      font-size: var(--ck-content-list-marker-font-size);
    }

    &.ck-list-marker-font-size-tiny > .multi-level-list__marker, &.ck-list-marker-font-size-tiny > * > .multi-level-list__marker {
      font-size: var(--ck-content-font-size-tiny);
    }

    &.ck-list-marker-font-size-small > .multi-level-list__marker, &.ck-list-marker-font-size-small > * > .multi-level-list__marker {
      font-size: var(--ck-content-font-size-small);
    }

    &.ck-list-marker-font-size-big > .multi-level-list__marker, &.ck-list-marker-font-size-big > * > .multi-level-list__marker {
      font-size: var(--ck-content-font-size-big);
    }

    &.ck-list-marker-font-size-huge > .multi-level-list__marker, &.ck-list-marker-font-size-huge > * > .multi-level-list__marker {
      font-size: var(--ck-content-font-size-huge);
    }
  }
}

.ck-content[dir="rtl"] .multi-level-list {
  & li {
    & .multi-level-list__marker {
      &:not(:has(span)), &:before, & > span {
        transform: translate(100%);
      }
    }
  }
}

:root, :host {
  --ck-merge-fields-icon-size: calc(var(--ck-line-height-base) * var(--ck-font-size-normal, var(--ck-font-size-base)) * .55);
  --ck-merge-fields-paddings-vertical: 2px;
  --ck-color-merge-fields-form-error-background: #fff4f0;
  --ck-color-merge-fields-outline: #3779eb;
  --ck-color-merge-fields-value-outline: #919191;
  --ck-color-merge-fields-with-warning-outline: #ea6d43;
  --ck-color-merge-fields-block-outline: #e3e3e3;
  --ck-color-merge-fields-affix-color: #3779eb;
}

.ck .ck-merge-field {
  border-radius: 2px;

  &:hover {
    cursor: default;
    transition: none;
  }

  &.ck-merge-field_with-warning {
    padding-left: .15em;
  }

  &:not(.ck-merge-field_with-value) {
    white-space: nowrap;
  }

  &:not(.ck-merge-field_with-warning):not(.ck-merge-field_with-value) {
    padding-top: var(--ck-merge-fields-paddings-vertical);
    padding-bottom: var(--ck-merge-fields-paddings-vertical);
    line-height: 1.2em;

    &:not(:hover):not(.ck-widget_selected) {
      outline: 1px solid var(--ck-color-merge-fields-outline);
    }
  }

  &:not(.ck-merge-field-block *):not(.ck-merge-field-image > .ck-merge-field) {
    -webkit-user-select: none;
    padding-top: var(--ck-merge-fields-paddings-vertical);
    padding-bottom: var(--ck-merge-fields-paddings-vertical);
    margin: 0 1px 0 2px;
    line-height: 0;

    &.ck-merge-field_with-warning {
      white-space: normal;

      &:not(:hover):not(.ck-widget_selected) {
        outline: 1px solid var(--ck-color-merge-fields-with-warning-outline);
      }
    }

    &.ck-merge-field_with-value {
      white-space: normal;

      &:not(:hover):not(.ck-widget_selected) {
        outline: 1px solid var(--ck-color-merge-fields-value-outline);
      }
    }
  }

  & .ck-merge-field__icon {
    padding: 0 .15em;
    position: relative;
    top: -1px;
  }

  & .ck.ck-icon {
    height: var(--ck-merge-fields-icon-size);
    width: var(--ck-merge-fields-icon-size);
  }

  & .ck-merge-field__affix {
    color: var(--ck-color-merge-fields-affix-color);
    font-family: Arial, sans-serif;
    font-size: .85em;
    position: relative;
    top: -.15em;

    &:first-child {
      padding-left: .25em;
      padding-right: .15em;
    }

    &:last-child {
      padding-left: .15em;
      padding-right: .25em;
    }
  }
}

.ck .ck-merge-field-block {
  margin: .9em auto;

  &:hover {
    cursor: default;
    transition: none;
  }

  &:not(.ck-merge-field-block_with-warning):not(.ck-merge-field-block_with-value), &.ck-merge-field-block_with-warning_no-default, &.ck-merge-field-block_with-warning_missing-data {
    background-image: url("data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100%\" height=\"100%\" viewBox=\"0 0 100 100\" preserveAspectRatio=\"none\"><line x1=\"0\" y1=\"0\" x2=\"100\" y2=\"100\" vector-effect=\"non-scaling-stroke\" stroke=\"hsl(0, 0%, 89%)\" /><line x1=\"100\" y1=\"0\" x2=\"0\" y2=\"100\" vector-effect=\"non-scaling-stroke\" stroke=\"hsl(0, 0%, 89%)\" /></svg>");
    justify-content: center;
    align-items: center;
    display: flex;

    & .ck-merge-field {
      pointer-events: all;
      background-color: #fff;
      align-items: baseline;
      max-width: 80%;
      margin: 0 .5em;
      display: flex;
      overflow: hidden;

      & .ck-merge-field__content {
        text-overflow: ellipsis;
        overflow: hidden;
      }
    }

    &.ck-merge-field-block_with-warning_no-default, &.ck-merge-field-block_with-warning_missing-data {
      & .ck-merge-field {
        outline: 1px solid var(--ck-color-merge-fields-with-warning-outline);
        line-height: 1.3em;
      }
    }
  }

  &.ck-merge-field-block_with-warning_default-value-used, &.ck-merge-field-block_with-value {
    & .ck-merge-field {
      overflow: hidden;
    }

    &:before {
      z-index: 1;
      top: var(--ck-spacing-small, var(--ck-spacing-sm));
      left: var(--ck-spacing-small, var(--ck-spacing-sm));
      background-color: #fff;
      border-radius: 2px;
      padding: 2px 2px 2.5px;
      line-height: 0;
      position: absolute;
    }

    &:not(.ck-merge-field-block_with-value) {
      &:before {
        content: url("data:image/svg+xml,%3Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"15\" viewBox=\"0 0 16 15\" fill=\"none\"%3E%3Ccircle cx=\"7.89981\" cy=\"7.70938\" r=\"1.35\" fill=\"%23333333\"/%3E%3Cpath d=\"M10.8241 1.3645C10.8242 0.6895 10.8243 0.6895 10.8243 0.6895L10.8254 0.689501L10.8275 0.689505L10.834 0.689533L10.8558 0.689721C10.8741 0.689929 10.8998 0.690334 10.9313 0.691122C10.9942 0.692692 11.0818 0.695814 11.1822 0.702076C11.3725 0.713953 11.648 0.739273 11.8889 0.799933C12.2461 0.889854 12.5529 1.05305 12.7956 1.29598C13.0364 1.5369 13.1814 1.82347 13.2674 2.11173C13.4307 2.65843 13.4025 3.29399 13.3646 3.83275C13.3558 3.95861 13.3462 4.0811 13.3369 4.20063C13.3027 4.63909 13.2716 5.03792 13.29 5.41777C13.3131 5.89278 13.4121 6.20897 13.5894 6.41849C13.7897 6.65519 14.0336 6.8041 14.2365 6.89438C14.3365 6.93893 14.4218 6.96703 14.4787 6.98333C14.507 6.99142 14.5277 6.99644 14.5391 6.99901L14.5476 7.00087L15.0991 7.09901V7.6645H12.9373C12.8081 7.55756 12.68 7.43372 12.5588 7.29052C12.1016 6.7501 11.9706 6.08078 11.9416 5.48324C11.9186 5.00885 11.9589 4.49792 11.9942 4.05032C12.0027 3.94209 12.0109 3.83752 12.0179 3.73811C12.0572 3.17882 12.0575 2.77784 11.9739 2.49806C11.9366 2.37307 11.8893 2.29891 11.8406 2.25018C11.794 2.20346 11.7142 2.14808 11.5593 2.10908C11.4429 2.07977 11.2684 2.06009 11.0981 2.04945C11.0181 2.04446 10.9477 2.04195 10.8977 2.0407C10.8728 2.04008 10.8532 2.03978 10.8405 2.03963L10.8266 2.03951L10.8239 2.0395L10.1491 2.03945L10.1492 0.689453L10.8243 0.6895L10.8241 1.3645Z\" fill=\"%23333333\"/%3E%3Cpath d=\"M10.8241 13.9645C10.8242 14.6395 10.8243 14.6395 10.8243 14.6395H10.8254L10.8275 14.6395L10.834 14.6395L10.8558 14.6393C10.8741 14.6391 10.8998 14.6387 10.9313 14.6379C10.9942 14.6363 11.0818 14.6332 11.1822 14.6269C11.3725 14.6151 11.648 14.5897 11.8889 14.5291C12.2461 14.4392 12.5529 14.276 12.7956 14.033C13.0364 13.7921 13.1814 13.5055 13.2674 13.2173C13.4307 12.6706 13.4025 12.035 13.3646 11.4963C13.3558 11.3704 13.3462 11.2479 13.3369 11.1284C13.3027 10.6899 13.2716 10.2911 13.29 9.91123C13.3131 9.43623 13.4121 9.12004 13.5894 8.91051C13.7897 8.67382 14.0336 8.52491 14.2365 8.43463C14.3365 8.39008 14.4218 8.36198 14.4787 8.34568C14.507 8.33759 14.5277 8.33257 14.5391 8.32999L14.5476 8.32813L15.0991 8.23V7.6645H12.9373C12.8081 7.77144 12.68 7.89528 12.5588 8.03849C12.1016 8.57891 11.9706 9.24823 11.9416 9.84577C11.9186 10.3202 11.9589 10.8311 11.9942 11.2787C12.0027 11.3869 12.0109 11.4915 12.0179 11.5909C12.0572 12.1502 12.0575 12.5512 11.9739 12.8309C11.9366 12.9559 11.8893 13.0301 11.8406 13.0788C11.794 13.1256 11.7142 13.1809 11.5593 13.2199C11.4429 13.2492 11.2684 13.2689 11.0981 13.2796C11.0181 13.2845 10.9477 13.2871 10.8977 13.2883C10.8728 13.2889 10.8532 13.2892 10.8405 13.2894L10.8266 13.2895L10.8239 13.2895L10.1491 13.2896L10.1492 14.6396L10.8243 14.6395L10.8241 13.9645Z\" fill=\"%23333333\"/%3E%3Cpath d=\"M4.97471 1.3645C4.97466 0.6895 4.97455 0.6895 4.97455 0.6895L4.97338 0.689501L4.97131 0.689505L4.96483 0.689533L4.94301 0.689721C4.92472 0.689929 4.89906 0.690334 4.86749 0.691122C4.8046 0.692692 4.71698 0.695814 4.61666 0.702076C4.42635 0.713953 4.15083 0.739273 3.9099 0.799933C3.55276 0.889854 3.24593 1.05305 3.00319 1.29598C2.76247 1.5369 2.61747 1.82347 2.53138 2.11173C2.3681 2.65843 2.39635 3.29399 2.43421 3.83275C2.44306 3.95861 2.45262 4.0811 2.46194 4.20063C2.49615 4.63909 2.52727 5.03792 2.50883 5.41777C2.48576 5.89278 2.38671 6.20897 2.20942 6.41849C2.00914 6.65519 1.76518 6.8041 1.56236 6.89438C1.46229 6.93893 1.37703 6.96703 1.32009 6.98333C1.29181 6.99142 1.2711 6.99644 1.25976 6.99901L1.25122 7.00087L0.699707 7.09901V7.6645H2.86155C2.9907 7.55756 3.11882 7.43372 3.23999 7.29052C3.69727 6.7501 3.82823 6.08078 3.85724 5.48324C3.88027 5.00885 3.83997 4.49792 3.80466 4.05032C3.79613 3.94209 3.78788 3.83752 3.78089 3.73811C3.74159 3.17882 3.74136 2.77784 3.82492 2.49806C3.86225 2.37307 3.9095 2.29891 3.95819 2.25018C4.00487 2.20346 4.0846 2.14808 4.23951 2.10908C4.35591 2.07977 4.53039 2.06009 4.70075 2.04945C4.78076 2.04446 4.85115 2.04195 4.90117 2.0407C4.92606 2.04008 4.94559 2.03978 4.95837 2.03963L4.97222 2.03951L4.97497 2.0395L5.64975 2.03945L5.64966 0.689453L4.97455 0.6895L4.97471 1.3645Z\" fill=\"%23333333\"/%3E%3Cpath d=\"M4.97471 13.9645C4.97466 14.6395 4.97455 14.6395 4.97455 14.6395H4.97338L4.97131 14.6395L4.96483 14.6395L4.94301 14.6393C4.92472 14.6391 4.89906 14.6387 4.86749 14.6379C4.8046 14.6363 4.71698 14.6332 4.61666 14.6269C4.42635 14.6151 4.15083 14.5897 3.9099 14.5291C3.55276 14.4392 3.24593 14.276 3.00319 14.033C2.76247 13.7921 2.61747 13.5055 2.53138 13.2173C2.3681 12.6706 2.39635 12.035 2.43421 11.4963C2.44306 11.3704 2.45261 11.2479 2.46194 11.1284C2.49615 10.6899 2.52727 10.2911 2.50883 9.91123C2.48576 9.43623 2.38671 9.12004 2.20942 8.91051C2.00914 8.67382 1.76518 8.52491 1.56236 8.43463C1.46229 8.39008 1.37703 8.36198 1.32009 8.34568C1.29181 8.33759 1.2711 8.33257 1.25976 8.32999L1.25122 8.32813L0.699707 8.23V7.6645H2.86155C2.9907 7.77144 3.11882 7.89528 3.23999 8.03849C3.69727 8.57891 3.82823 9.24823 3.85724 9.84577C3.88027 10.3202 3.83997 10.8311 3.80466 11.2787C3.79613 11.3869 3.78788 11.4915 3.78089 11.5909C3.74159 12.1502 3.74136 12.5512 3.82492 12.8309C3.86225 12.9559 3.9095 13.0301 3.95819 13.0788C4.00487 13.1256 4.0846 13.1809 4.23951 13.2199C4.35591 13.2492 4.53039 13.2689 4.70075 13.2796C4.78076 13.2845 4.85115 13.2871 4.90117 13.2883C4.92606 13.2889 4.94559 13.2892 4.95837 13.2894L4.97222 13.2895L4.97497 13.2895L5.64975 13.2896L5.64966 14.6396L4.97455 14.6395L4.97471 13.9645Z\" fill=\"%23333333\"/%3E%3C/svg%3E") url("data:image/svg+xml,%3Csvg width=\"15\" height=\"13\" viewBox=\"-2 0 13 13\" xmlns=\"http://www.w3.org/2000/svg\"%3E%3Cpath fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12 6C12 9.31371 9.31371 12 6 12C2.68629 12 0 9.31371 0 6C0 2.68629 2.68629 0 6 0C9.31371 0 12 2.68629 12 6ZM5.27988 2.40003H6.71988V6.72003H5.27988V2.40003ZM6.72009 8.16003H5.28009V9.60003H6.72009V8.16003Z\" fill=\"%23DB3700\"/%3E%3C/svg%3E");
        outline: 1px solid var(--ck-color-merge-fields-with-warning-outline);
      }
    }

    &:not(.ck-merge-field-block_with-warning) {
      &:before {
        content: url("data:image/svg+xml,%3Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"15\" viewBox=\"0 0 16 15\" fill=\"none\"%3E%3Ccircle cx=\"7.89981\" cy=\"7.70938\" r=\"1.35\" fill=\"%23333333\"/%3E%3Cpath d=\"M10.8241 1.3645C10.8242 0.6895 10.8243 0.6895 10.8243 0.6895L10.8254 0.689501L10.8275 0.689505L10.834 0.689533L10.8558 0.689721C10.8741 0.689929 10.8998 0.690334 10.9313 0.691122C10.9942 0.692692 11.0818 0.695814 11.1822 0.702076C11.3725 0.713953 11.648 0.739273 11.8889 0.799933C12.2461 0.889854 12.5529 1.05305 12.7956 1.29598C13.0364 1.5369 13.1814 1.82347 13.2674 2.11173C13.4307 2.65843 13.4025 3.29399 13.3646 3.83275C13.3558 3.95861 13.3462 4.0811 13.3369 4.20063C13.3027 4.63909 13.2716 5.03792 13.29 5.41777C13.3131 5.89278 13.4121 6.20897 13.5894 6.41849C13.7897 6.65519 14.0336 6.8041 14.2365 6.89438C14.3365 6.93893 14.4218 6.96703 14.4787 6.98333C14.507 6.99142 14.5277 6.99644 14.5391 6.99901L14.5476 7.00087L15.0991 7.09901V7.6645H12.9373C12.8081 7.55756 12.68 7.43372 12.5588 7.29052C12.1016 6.7501 11.9706 6.08078 11.9416 5.48324C11.9186 5.00885 11.9589 4.49792 11.9942 4.05032C12.0027 3.94209 12.0109 3.83752 12.0179 3.73811C12.0572 3.17882 12.0575 2.77784 11.9739 2.49806C11.9366 2.37307 11.8893 2.29891 11.8406 2.25018C11.794 2.20346 11.7142 2.14808 11.5593 2.10908C11.4429 2.07977 11.2684 2.06009 11.0981 2.04945C11.0181 2.04446 10.9477 2.04195 10.8977 2.0407C10.8728 2.04008 10.8532 2.03978 10.8405 2.03963L10.8266 2.03951L10.8239 2.0395L10.1491 2.03945L10.1492 0.689453L10.8243 0.6895L10.8241 1.3645Z\" fill=\"%23333333\"/%3E%3Cpath d=\"M10.8241 13.9645C10.8242 14.6395 10.8243 14.6395 10.8243 14.6395H10.8254L10.8275 14.6395L10.834 14.6395L10.8558 14.6393C10.8741 14.6391 10.8998 14.6387 10.9313 14.6379C10.9942 14.6363 11.0818 14.6332 11.1822 14.6269C11.3725 14.6151 11.648 14.5897 11.8889 14.5291C12.2461 14.4392 12.5529 14.276 12.7956 14.033C13.0364 13.7921 13.1814 13.5055 13.2674 13.2173C13.4307 12.6706 13.4025 12.035 13.3646 11.4963C13.3558 11.3704 13.3462 11.2479 13.3369 11.1284C13.3027 10.6899 13.2716 10.2911 13.29 9.91123C13.3131 9.43623 13.4121 9.12004 13.5894 8.91051C13.7897 8.67382 14.0336 8.52491 14.2365 8.43463C14.3365 8.39008 14.4218 8.36198 14.4787 8.34568C14.507 8.33759 14.5277 8.33257 14.5391 8.32999L14.5476 8.32813L15.0991 8.23V7.6645H12.9373C12.8081 7.77144 12.68 7.89528 12.5588 8.03849C12.1016 8.57891 11.9706 9.24823 11.9416 9.84577C11.9186 10.3202 11.9589 10.8311 11.9942 11.2787C12.0027 11.3869 12.0109 11.4915 12.0179 11.5909C12.0572 12.1502 12.0575 12.5512 11.9739 12.8309C11.9366 12.9559 11.8893 13.0301 11.8406 13.0788C11.794 13.1256 11.7142 13.1809 11.5593 13.2199C11.4429 13.2492 11.2684 13.2689 11.0981 13.2796C11.0181 13.2845 10.9477 13.2871 10.8977 13.2883C10.8728 13.2889 10.8532 13.2892 10.8405 13.2894L10.8266 13.2895L10.8239 13.2895L10.1491 13.2896L10.1492 14.6396L10.8243 14.6395L10.8241 13.9645Z\" fill=\"%23333333\"/%3E%3Cpath d=\"M4.97471 1.3645C4.97466 0.6895 4.97455 0.6895 4.97455 0.6895L4.97338 0.689501L4.97131 0.689505L4.96483 0.689533L4.94301 0.689721C4.92472 0.689929 4.89906 0.690334 4.86749 0.691122C4.8046 0.692692 4.71698 0.695814 4.61666 0.702076C4.42635 0.713953 4.15083 0.739273 3.9099 0.799933C3.55276 0.889854 3.24593 1.05305 3.00319 1.29598C2.76247 1.5369 2.61747 1.82347 2.53138 2.11173C2.3681 2.65843 2.39635 3.29399 2.43421 3.83275C2.44306 3.95861 2.45262 4.0811 2.46194 4.20063C2.49615 4.63909 2.52727 5.03792 2.50883 5.41777C2.48576 5.89278 2.38671 6.20897 2.20942 6.41849C2.00914 6.65519 1.76518 6.8041 1.56236 6.89438C1.46229 6.93893 1.37703 6.96703 1.32009 6.98333C1.29181 6.99142 1.2711 6.99644 1.25976 6.99901L1.25122 7.00087L0.699707 7.09901V7.6645H2.86155C2.9907 7.55756 3.11882 7.43372 3.23999 7.29052C3.69727 6.7501 3.82823 6.08078 3.85724 5.48324C3.88027 5.00885 3.83997 4.49792 3.80466 4.05032C3.79613 3.94209 3.78788 3.83752 3.78089 3.73811C3.74159 3.17882 3.74136 2.77784 3.82492 2.49806C3.86225 2.37307 3.9095 2.29891 3.95819 2.25018C4.00487 2.20346 4.0846 2.14808 4.23951 2.10908C4.35591 2.07977 4.53039 2.06009 4.70075 2.04945C4.78076 2.04446 4.85115 2.04195 4.90117 2.0407C4.92606 2.04008 4.94559 2.03978 4.95837 2.03963L4.97222 2.03951L4.97497 2.0395L5.64975 2.03945L5.64966 0.689453L4.97455 0.6895L4.97471 1.3645Z\" fill=\"%23333333\"/%3E%3Cpath d=\"M4.97471 13.9645C4.97466 14.6395 4.97455 14.6395 4.97455 14.6395H4.97338L4.97131 14.6395L4.96483 14.6395L4.94301 14.6393C4.92472 14.6391 4.89906 14.6387 4.86749 14.6379C4.8046 14.6363 4.71698 14.6332 4.61666 14.6269C4.42635 14.6151 4.15083 14.5897 3.9099 14.5291C3.55276 14.4392 3.24593 14.276 3.00319 14.033C2.76247 13.7921 2.61747 13.5055 2.53138 13.2173C2.3681 12.6706 2.39635 12.035 2.43421 11.4963C2.44306 11.3704 2.45261 11.2479 2.46194 11.1284C2.49615 10.6899 2.52727 10.2911 2.50883 9.91123C2.48576 9.43623 2.38671 9.12004 2.20942 8.91051C2.00914 8.67382 1.76518 8.52491 1.56236 8.43463C1.46229 8.39008 1.37703 8.36198 1.32009 8.34568C1.29181 8.33759 1.2711 8.33257 1.25976 8.32999L1.25122 8.32813L0.699707 8.23V7.6645H2.86155C2.9907 7.77144 3.11882 7.89528 3.23999 8.03849C3.69727 8.57891 3.82823 9.24823 3.85724 9.84577C3.88027 10.3202 3.83997 10.8311 3.80466 11.2787C3.79613 11.3869 3.78788 11.4915 3.78089 11.5909C3.74159 12.1502 3.74136 12.5512 3.82492 12.8309C3.86225 12.9559 3.9095 13.0301 3.95819 13.0788C4.00487 13.1256 4.0846 13.1809 4.23951 13.2199C4.35591 13.2492 4.53039 13.2689 4.70075 13.2796C4.78076 13.2845 4.85115 13.2871 4.90117 13.2883C4.92606 13.2889 4.94559 13.2892 4.95837 13.2894L4.97222 13.2895L4.97497 13.2895L5.64975 13.2896L5.64966 14.6396L4.97455 14.6395L4.97471 13.9645Z\" fill=\"%23333333\"/%3E%3C/svg%3E");
        outline: 1px solid var(--ck-color-merge-fields-value-outline);
      }
    }
  }

  &:not(:hover):not(.ck-widget_selected), &.ck-widget.ck-widget_selected.ck-widget_type-around_show-fake-caret_before, &.ck-widget.ck-widget_selected.ck-widget_type-around_show-fake-caret_after {
    outline: 1px solid var(--ck-color-merge-fields-block-outline);
  }

  &[dir="rtl"]:before {
    left: auto;
    right: var(--ck-spacing-medium, var(--ck-spacing-base));
  }
}

.ck .ck-merge-field-image {
  &:not(.ck-merge-field-image_with-warning):not(.ck-merge-field-image_with-value), &.ck-merge-field-image_with-warning_no-default, &.ck-merge-field-image_with-warning_missing-data {
    background-image: url("data:image/svg+xml,%3Csvg width=\"788\" height=\"456\" viewBox=\"0 0 788 456\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"%3E%3Cpath d=\"M488.076 321.87C538.248 313.878 596.911 164.982 665.095 281.279C665.103 281.292 665.1 281.29 665.109 281.302L726.554 367.884L787.449 453.692C787.689 454.029 787.428 454.468 787.014 454.468H665.107H89.78H0.885437C0.492737 454.468 0.247864 454.042 0.445435 453.703L89.78 300.244C126.705 231.881 182.704 101.93 267.335 101.93C360.102 101.929 430.397 331.058 488.076 321.87Z\" fill=\"%23F3F3F3\"/%3E%3Ccircle cx=\"514.76\" cy=\"87.6508\" r=\"67.6508\" fill=\"%23F3F3F3\"/%3E%3C/svg%3E%0A");
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: contain;

    & > .ck-merge-field {
      background-color: #fff;
      align-items: baseline;
      max-width: 80%;
      max-height: -webkit-fill-available;
      display: flex;
      position: absolute;
      top: 50%;
      left: 50%;
      overflow: hidden;
      -webkit-transform: translate(-50%, -50%);
      -moz-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);

      & .ck-merge-field__content {
        text-overflow: ellipsis;
        overflow: hidden;
      }

      &:hover {
        outline: 1px solid var(--ck-color-merge-fields-outline);
      }
    }

    &.ck-merge-field-image_with-warning_no-default, &.ck-merge-field-image_with-warning_missing-data {
      & > .ck-merge-field {
        outline: 1px solid var(--ck-color-merge-fields-with-warning-outline);
        line-height: 1.3em;
      }
    }

    &:not(:hover):not(.ck-widget_selected) {
      outline: 1px solid var(--ck-color-merge-fields-block-outline);
    }
  }

  &.ck-merge-field-image_with-warning_default-value-used, &.ck-merge-field-image_with-value {
    &:before {
      z-index: 1;
      top: var(--ck-spacing-small, var(--ck-spacing-sm));
      left: var(--ck-spacing-small, var(--ck-spacing-sm));
      background-color: #fff;
      border-radius: 2px;
      max-width: -webkit-fill-available;
      max-height: -webkit-fill-available;
      padding: 2px 2px 2.5px;
      line-height: 0;
      position: absolute;
      overflow: hidden;
    }

    &:not(.ck-merge-field-image_with-value) {
      &:before {
        content: url("data:image/svg+xml,%3Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"15\" viewBox=\"0 0 16 15\" fill=\"none\"%3E%3Ccircle cx=\"7.89981\" cy=\"7.70938\" r=\"1.35\" fill=\"%23333333\"/%3E%3Cpath d=\"M10.8241 1.3645C10.8242 0.6895 10.8243 0.6895 10.8243 0.6895L10.8254 0.689501L10.8275 0.689505L10.834 0.689533L10.8558 0.689721C10.8741 0.689929 10.8998 0.690334 10.9313 0.691122C10.9942 0.692692 11.0818 0.695814 11.1822 0.702076C11.3725 0.713953 11.648 0.739273 11.8889 0.799933C12.2461 0.889854 12.5529 1.05305 12.7956 1.29598C13.0364 1.5369 13.1814 1.82347 13.2674 2.11173C13.4307 2.65843 13.4025 3.29399 13.3646 3.83275C13.3558 3.95861 13.3462 4.0811 13.3369 4.20063C13.3027 4.63909 13.2716 5.03792 13.29 5.41777C13.3131 5.89278 13.4121 6.20897 13.5894 6.41849C13.7897 6.65519 14.0336 6.8041 14.2365 6.89438C14.3365 6.93893 14.4218 6.96703 14.4787 6.98333C14.507 6.99142 14.5277 6.99644 14.5391 6.99901L14.5476 7.00087L15.0991 7.09901V7.6645H12.9373C12.8081 7.55756 12.68 7.43372 12.5588 7.29052C12.1016 6.7501 11.9706 6.08078 11.9416 5.48324C11.9186 5.00885 11.9589 4.49792 11.9942 4.05032C12.0027 3.94209 12.0109 3.83752 12.0179 3.73811C12.0572 3.17882 12.0575 2.77784 11.9739 2.49806C11.9366 2.37307 11.8893 2.29891 11.8406 2.25018C11.794 2.20346 11.7142 2.14808 11.5593 2.10908C11.4429 2.07977 11.2684 2.06009 11.0981 2.04945C11.0181 2.04446 10.9477 2.04195 10.8977 2.0407C10.8728 2.04008 10.8532 2.03978 10.8405 2.03963L10.8266 2.03951L10.8239 2.0395L10.1491 2.03945L10.1492 0.689453L10.8243 0.6895L10.8241 1.3645Z\" fill=\"%23333333\"/%3E%3Cpath d=\"M10.8241 13.9645C10.8242 14.6395 10.8243 14.6395 10.8243 14.6395H10.8254L10.8275 14.6395L10.834 14.6395L10.8558 14.6393C10.8741 14.6391 10.8998 14.6387 10.9313 14.6379C10.9942 14.6363 11.0818 14.6332 11.1822 14.6269C11.3725 14.6151 11.648 14.5897 11.8889 14.5291C12.2461 14.4392 12.5529 14.276 12.7956 14.033C13.0364 13.7921 13.1814 13.5055 13.2674 13.2173C13.4307 12.6706 13.4025 12.035 13.3646 11.4963C13.3558 11.3704 13.3462 11.2479 13.3369 11.1284C13.3027 10.6899 13.2716 10.2911 13.29 9.91123C13.3131 9.43623 13.4121 9.12004 13.5894 8.91051C13.7897 8.67382 14.0336 8.52491 14.2365 8.43463C14.3365 8.39008 14.4218 8.36198 14.4787 8.34568C14.507 8.33759 14.5277 8.33257 14.5391 8.32999L14.5476 8.32813L15.0991 8.23V7.6645H12.9373C12.8081 7.77144 12.68 7.89528 12.5588 8.03849C12.1016 8.57891 11.9706 9.24823 11.9416 9.84577C11.9186 10.3202 11.9589 10.8311 11.9942 11.2787C12.0027 11.3869 12.0109 11.4915 12.0179 11.5909C12.0572 12.1502 12.0575 12.5512 11.9739 12.8309C11.9366 12.9559 11.8893 13.0301 11.8406 13.0788C11.794 13.1256 11.7142 13.1809 11.5593 13.2199C11.4429 13.2492 11.2684 13.2689 11.0981 13.2796C11.0181 13.2845 10.9477 13.2871 10.8977 13.2883C10.8728 13.2889 10.8532 13.2892 10.8405 13.2894L10.8266 13.2895L10.8239 13.2895L10.1491 13.2896L10.1492 14.6396L10.8243 14.6395L10.8241 13.9645Z\" fill=\"%23333333\"/%3E%3Cpath d=\"M4.97471 1.3645C4.97466 0.6895 4.97455 0.6895 4.97455 0.6895L4.97338 0.689501L4.97131 0.689505L4.96483 0.689533L4.94301 0.689721C4.92472 0.689929 4.89906 0.690334 4.86749 0.691122C4.8046 0.692692 4.71698 0.695814 4.61666 0.702076C4.42635 0.713953 4.15083 0.739273 3.9099 0.799933C3.55276 0.889854 3.24593 1.05305 3.00319 1.29598C2.76247 1.5369 2.61747 1.82347 2.53138 2.11173C2.3681 2.65843 2.39635 3.29399 2.43421 3.83275C2.44306 3.95861 2.45262 4.0811 2.46194 4.20063C2.49615 4.63909 2.52727 5.03792 2.50883 5.41777C2.48576 5.89278 2.38671 6.20897 2.20942 6.41849C2.00914 6.65519 1.76518 6.8041 1.56236 6.89438C1.46229 6.93893 1.37703 6.96703 1.32009 6.98333C1.29181 6.99142 1.2711 6.99644 1.25976 6.99901L1.25122 7.00087L0.699707 7.09901V7.6645H2.86155C2.9907 7.55756 3.11882 7.43372 3.23999 7.29052C3.69727 6.7501 3.82823 6.08078 3.85724 5.48324C3.88027 5.00885 3.83997 4.49792 3.80466 4.05032C3.79613 3.94209 3.78788 3.83752 3.78089 3.73811C3.74159 3.17882 3.74136 2.77784 3.82492 2.49806C3.86225 2.37307 3.9095 2.29891 3.95819 2.25018C4.00487 2.20346 4.0846 2.14808 4.23951 2.10908C4.35591 2.07977 4.53039 2.06009 4.70075 2.04945C4.78076 2.04446 4.85115 2.04195 4.90117 2.0407C4.92606 2.04008 4.94559 2.03978 4.95837 2.03963L4.97222 2.03951L4.97497 2.0395L5.64975 2.03945L5.64966 0.689453L4.97455 0.6895L4.97471 1.3645Z\" fill=\"%23333333\"/%3E%3Cpath d=\"M4.97471 13.9645C4.97466 14.6395 4.97455 14.6395 4.97455 14.6395H4.97338L4.97131 14.6395L4.96483 14.6395L4.94301 14.6393C4.92472 14.6391 4.89906 14.6387 4.86749 14.6379C4.8046 14.6363 4.71698 14.6332 4.61666 14.6269C4.42635 14.6151 4.15083 14.5897 3.9099 14.5291C3.55276 14.4392 3.24593 14.276 3.00319 14.033C2.76247 13.7921 2.61747 13.5055 2.53138 13.2173C2.3681 12.6706 2.39635 12.035 2.43421 11.4963C2.44306 11.3704 2.45261 11.2479 2.46194 11.1284C2.49615 10.6899 2.52727 10.2911 2.50883 9.91123C2.48576 9.43623 2.38671 9.12004 2.20942 8.91051C2.00914 8.67382 1.76518 8.52491 1.56236 8.43463C1.46229 8.39008 1.37703 8.36198 1.32009 8.34568C1.29181 8.33759 1.2711 8.33257 1.25976 8.32999L1.25122 8.32813L0.699707 8.23V7.6645H2.86155C2.9907 7.77144 3.11882 7.89528 3.23999 8.03849C3.69727 8.57891 3.82823 9.24823 3.85724 9.84577C3.88027 10.3202 3.83997 10.8311 3.80466 11.2787C3.79613 11.3869 3.78788 11.4915 3.78089 11.5909C3.74159 12.1502 3.74136 12.5512 3.82492 12.8309C3.86225 12.9559 3.9095 13.0301 3.95819 13.0788C4.00487 13.1256 4.0846 13.1809 4.23951 13.2199C4.35591 13.2492 4.53039 13.2689 4.70075 13.2796C4.78076 13.2845 4.85115 13.2871 4.90117 13.2883C4.92606 13.2889 4.94559 13.2892 4.95837 13.2894L4.97222 13.2895L4.97497 13.2895L5.64975 13.2896L5.64966 14.6396L4.97455 14.6395L4.97471 13.9645Z\" fill=\"%23333333\"/%3E%3C/svg%3E") url("data:image/svg+xml,%3Csvg width=\"15\" height=\"13\" viewBox=\"-2 0 13 13\" xmlns=\"http://www.w3.org/2000/svg\"%3E%3Cpath fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M12 6C12 9.31371 9.31371 12 6 12C2.68629 12 0 9.31371 0 6C0 2.68629 2.68629 0 6 0C9.31371 0 12 2.68629 12 6ZM5.27988 2.40003H6.71988V6.72003H5.27988V2.40003ZM6.72009 8.16003H5.28009V9.60003H6.72009V8.16003Z\" fill=\"%23DB3700\"/%3E%3C/svg%3E");
        outline: 1px solid var(--ck-color-merge-fields-with-warning-outline);
      }
    }

    &:not(.ck-merge-field-image_with-warning_default-value-used) {
      &:before {
        content: url("data:image/svg+xml,%3Csvg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"15\" viewBox=\"0 0 16 15\" fill=\"none\"%3E%3Ccircle cx=\"7.89981\" cy=\"7.70938\" r=\"1.35\" fill=\"%23333333\"/%3E%3Cpath d=\"M10.8241 1.3645C10.8242 0.6895 10.8243 0.6895 10.8243 0.6895L10.8254 0.689501L10.8275 0.689505L10.834 0.689533L10.8558 0.689721C10.8741 0.689929 10.8998 0.690334 10.9313 0.691122C10.9942 0.692692 11.0818 0.695814 11.1822 0.702076C11.3725 0.713953 11.648 0.739273 11.8889 0.799933C12.2461 0.889854 12.5529 1.05305 12.7956 1.29598C13.0364 1.5369 13.1814 1.82347 13.2674 2.11173C13.4307 2.65843 13.4025 3.29399 13.3646 3.83275C13.3558 3.95861 13.3462 4.0811 13.3369 4.20063C13.3027 4.63909 13.2716 5.03792 13.29 5.41777C13.3131 5.89278 13.4121 6.20897 13.5894 6.41849C13.7897 6.65519 14.0336 6.8041 14.2365 6.89438C14.3365 6.93893 14.4218 6.96703 14.4787 6.98333C14.507 6.99142 14.5277 6.99644 14.5391 6.99901L14.5476 7.00087L15.0991 7.09901V7.6645H12.9373C12.8081 7.55756 12.68 7.43372 12.5588 7.29052C12.1016 6.7501 11.9706 6.08078 11.9416 5.48324C11.9186 5.00885 11.9589 4.49792 11.9942 4.05032C12.0027 3.94209 12.0109 3.83752 12.0179 3.73811C12.0572 3.17882 12.0575 2.77784 11.9739 2.49806C11.9366 2.37307 11.8893 2.29891 11.8406 2.25018C11.794 2.20346 11.7142 2.14808 11.5593 2.10908C11.4429 2.07977 11.2684 2.06009 11.0981 2.04945C11.0181 2.04446 10.9477 2.04195 10.8977 2.0407C10.8728 2.04008 10.8532 2.03978 10.8405 2.03963L10.8266 2.03951L10.8239 2.0395L10.1491 2.03945L10.1492 0.689453L10.8243 0.6895L10.8241 1.3645Z\" fill=\"%23333333\"/%3E%3Cpath d=\"M10.8241 13.9645C10.8242 14.6395 10.8243 14.6395 10.8243 14.6395H10.8254L10.8275 14.6395L10.834 14.6395L10.8558 14.6393C10.8741 14.6391 10.8998 14.6387 10.9313 14.6379C10.9942 14.6363 11.0818 14.6332 11.1822 14.6269C11.3725 14.6151 11.648 14.5897 11.8889 14.5291C12.2461 14.4392 12.5529 14.276 12.7956 14.033C13.0364 13.7921 13.1814 13.5055 13.2674 13.2173C13.4307 12.6706 13.4025 12.035 13.3646 11.4963C13.3558 11.3704 13.3462 11.2479 13.3369 11.1284C13.3027 10.6899 13.2716 10.2911 13.29 9.91123C13.3131 9.43623 13.4121 9.12004 13.5894 8.91051C13.7897 8.67382 14.0336 8.52491 14.2365 8.43463C14.3365 8.39008 14.4218 8.36198 14.4787 8.34568C14.507 8.33759 14.5277 8.33257 14.5391 8.32999L14.5476 8.32813L15.0991 8.23V7.6645H12.9373C12.8081 7.77144 12.68 7.89528 12.5588 8.03849C12.1016 8.57891 11.9706 9.24823 11.9416 9.84577C11.9186 10.3202 11.9589 10.8311 11.9942 11.2787C12.0027 11.3869 12.0109 11.4915 12.0179 11.5909C12.0572 12.1502 12.0575 12.5512 11.9739 12.8309C11.9366 12.9559 11.8893 13.0301 11.8406 13.0788C11.794 13.1256 11.7142 13.1809 11.5593 13.2199C11.4429 13.2492 11.2684 13.2689 11.0981 13.2796C11.0181 13.2845 10.9477 13.2871 10.8977 13.2883C10.8728 13.2889 10.8532 13.2892 10.8405 13.2894L10.8266 13.2895L10.8239 13.2895L10.1491 13.2896L10.1492 14.6396L10.8243 14.6395L10.8241 13.9645Z\" fill=\"%23333333\"/%3E%3Cpath d=\"M4.97471 1.3645C4.97466 0.6895 4.97455 0.6895 4.97455 0.6895L4.97338 0.689501L4.97131 0.689505L4.96483 0.689533L4.94301 0.689721C4.92472 0.689929 4.89906 0.690334 4.86749 0.691122C4.8046 0.692692 4.71698 0.695814 4.61666 0.702076C4.42635 0.713953 4.15083 0.739273 3.9099 0.799933C3.55276 0.889854 3.24593 1.05305 3.00319 1.29598C2.76247 1.5369 2.61747 1.82347 2.53138 2.11173C2.3681 2.65843 2.39635 3.29399 2.43421 3.83275C2.44306 3.95861 2.45262 4.0811 2.46194 4.20063C2.49615 4.63909 2.52727 5.03792 2.50883 5.41777C2.48576 5.89278 2.38671 6.20897 2.20942 6.41849C2.00914 6.65519 1.76518 6.8041 1.56236 6.89438C1.46229 6.93893 1.37703 6.96703 1.32009 6.98333C1.29181 6.99142 1.2711 6.99644 1.25976 6.99901L1.25122 7.00087L0.699707 7.09901V7.6645H2.86155C2.9907 7.55756 3.11882 7.43372 3.23999 7.29052C3.69727 6.7501 3.82823 6.08078 3.85724 5.48324C3.88027 5.00885 3.83997 4.49792 3.80466 4.05032C3.79613 3.94209 3.78788 3.83752 3.78089 3.73811C3.74159 3.17882 3.74136 2.77784 3.82492 2.49806C3.86225 2.37307 3.9095 2.29891 3.95819 2.25018C4.00487 2.20346 4.0846 2.14808 4.23951 2.10908C4.35591 2.07977 4.53039 2.06009 4.70075 2.04945C4.78076 2.04446 4.85115 2.04195 4.90117 2.0407C4.92606 2.04008 4.94559 2.03978 4.95837 2.03963L4.97222 2.03951L4.97497 2.0395L5.64975 2.03945L5.64966 0.689453L4.97455 0.6895L4.97471 1.3645Z\" fill=\"%23333333\"/%3E%3Cpath d=\"M4.97471 13.9645C4.97466 14.6395 4.97455 14.6395 4.97455 14.6395H4.97338L4.97131 14.6395L4.96483 14.6395L4.94301 14.6393C4.92472 14.6391 4.89906 14.6387 4.86749 14.6379C4.8046 14.6363 4.71698 14.6332 4.61666 14.6269C4.42635 14.6151 4.15083 14.5897 3.9099 14.5291C3.55276 14.4392 3.24593 14.276 3.00319 14.033C2.76247 13.7921 2.61747 13.5055 2.53138 13.2173C2.3681 12.6706 2.39635 12.035 2.43421 11.4963C2.44306 11.3704 2.45261 11.2479 2.46194 11.1284C2.49615 10.6899 2.52727 10.2911 2.50883 9.91123C2.48576 9.43623 2.38671 9.12004 2.20942 8.91051C2.00914 8.67382 1.76518 8.52491 1.56236 8.43463C1.46229 8.39008 1.37703 8.36198 1.32009 8.34568C1.29181 8.33759 1.2711 8.33257 1.25976 8.32999L1.25122 8.32813L0.699707 8.23V7.6645H2.86155C2.9907 7.77144 3.11882 7.89528 3.23999 8.03849C3.69727 8.57891 3.82823 9.24823 3.85724 9.84577C3.88027 10.3202 3.83997 10.8311 3.80466 11.2787C3.79613 11.3869 3.78788 11.4915 3.78089 11.5909C3.74159 12.1502 3.74136 12.5512 3.82492 12.8309C3.86225 12.9559 3.9095 13.0301 3.95819 13.0788C4.00487 13.1256 4.0846 13.1809 4.23951 13.2199C4.35591 13.2492 4.53039 13.2689 4.70075 13.2796C4.78076 13.2845 4.85115 13.2871 4.90117 13.2883C4.92606 13.2889 4.94559 13.2892 4.95837 13.2894L4.97222 13.2895L4.97497 13.2895L5.64975 13.2896L5.64966 14.6396L4.97455 14.6395L4.97471 13.9645Z\" fill=\"%23333333\"/%3E%3C/svg%3E");
        outline: 1px solid var(--ck-color-merge-fields-value-outline);
      }
    }
  }
}

.ck pre code .ck-merge-field .ck-merge-field__affix {
  font-family: inherit;
  font-size: inherit;
  position: relative;
  top: 0;

  &:first-child {
    padding-left: .15em;
    padding-right: .18em;
  }

  &:last-child {
    padding-left: .18em;
    padding-right: .15em;
  }
}

.ck .ck-merge-fields-form {
  padding: var(--ck-spacing-medium, var(--ck-spacing-base));

  & .ck-merge-fields-form__status {
    padding: var(--ck-spacing-medium, var(--ck-spacing-base));
    color: var(--ck-color-text);
    background-color: var(--ck-color-merge-fields-form-error-background);
    border-radius: 2px;
    justify-content: center;
    align-items: center;
    line-height: 2.25em;
    display: flex;
  }
}

.ck-editor__editable.ck-read-only {
  & .ck-merge-field-block:hover:not(.ck-widget_selected), & .ck-merge-field-image:hover:not(.ck-widget_selected) {
    outline: 1px solid var(--ck-color-merge-fields-block-outline);
  }

  & .ck-merge-field:hover:not(.ck-widget_selected) {
    &:not(.ck-merge-field-block *) {
      outline: 1px solid var(--ck-color-merge-fields-outline);

      &.ck-merge-field_with-warning {
        outline: 1px solid var(--ck-color-merge-fields-with-warning-outline);
      }

      &.ck-merge-field_with-value {
        outline: 1px solid var(--ck-color-merge-fields-value-outline);
      }
    }

    &:not(.ck-merge-field_with-warning):not(.ck-merge-field_with-value) {
      outline: 1px solid var(--ck-color-merge-fields-outline);
      padding-top: var(--ck-merge-fields-paddings-vertical);
      padding-bottom: var(--ck-merge-fields-paddings-vertical);
    }
  }
}

.ck-editor__editable:not(.ck-read-only) .ck-widget.ck-merge-field-block .ck-merge-field:not(.ck-merge-field_with-warning_missing-data):not(.ck-merge-field_with-warning_no-default) {
  pointer-events: none;
}

:root, :host {
  --ck-insert-merge-field-dropdown-view-width: 260px;
  --ck-insert-merge-field-dropdown-view-list-max-height: 250px;
}

.ck.ck-menu-bar__menu:not(.ck-menu-bar__menu_top-level) {
  & .ck-menu-bar__merge-fields-submenu {
    & .ck-menu-bar__menu__button:not(:has(.ck-button__icon)) {
      & > .ck-button__label {
        margin-left: 0;
      }
    }
  }
}

.ck.ck-merge-fields-search {
  width: var(--ck-insert-merge-field-dropdown-view-width);

  & > .ck-labeled-field-view {
    padding: var(--ck-spacing-padding-comfortable);

    & .ck-input {
      min-width: unset;
    }
  }

  & > .ck-search__results {
    border-top: 1px solid var(--ck-color-divider);

    & > .ck-list {
      max-height: var(--ck-insert-merge-field-dropdown-view-list-max-height);
      overflow: auto;

      & .ck-button__label {
        text-overflow: ellipsis;
        overflow: hidden;
      }
    }
  }
}

:root, :host {
  --ck-pagination-divider-color: var(--ck-color-pagination-divider, #ababab);
  --ck-pagination-label-background-color: #c4c4c4;
  --ck-pagination-label-border-radius: 0 var(--ck-border-radius-control-small) var(--ck-border-radius-control-small) 0;
  --ck-pagination-label-padding: var(--ck-spacing-padding-compact);
}

.ck.ck-pagination_enabled {
  &.ck-content .page-break:after {
    display: none;
  }

  &.ck-pagination-view {
    & > .ck-content {
      box-sizing: border-box;
      width: auto;
      min-width: auto;
      max-width: none;
      height: auto;
      min-height: auto;
      max-height: none;
      overflow: unset;
      border: none;
      margin: 0;
      padding: 0;
    }

    & .ck-widget__type-around, & .ck-fake-selection-container, & .ck-widget__selection-handle, & .ck-widget__resizer, & .ck-table-column-resizer {
      display: none;
    }

    & .ck-widget {
      outline: none;
    }

    & .ck-editor__nested-editable:not(td, th) {
      border: 0;
    }

    & p:first-child {
      padding-top: 0;
    }

    & :has( + .page-break) {
      margin-bottom: 0;
    }

    & .page-break {
      break-after: column;
      height: 0;
      margin: 0;
      padding: 0;
      display: block;

      & .page-break__label, &:after {
        display: none;
      }
    }

    & .table table {
      overflow: initial;
    }

    & blockquote {
      overflow: initial;
      display: flow-root;
    }

    & .ck-bookmark {
      width: 0;
      height: 0;
      overflow: hidden;
    }

    & figure.table:not(.layout-table) {
      &:has( > figcaption) > table {
        width: fit-content;
        height: fit-content;
      }

      &:not(:has( > figcaption)) {
        width: fit-content;
        display: block;
      }
    }

    & .table-of-contents {
      border: 0;

      & ol li {
        overflow: visible;
      }
    }
  }
}

:root, :host {
  --ck-page-navigator-font-size: var(--ck-font-size-md);
}

.ck.ck-page-navigator {
  padding: 0 var(--ck-spacing-control-padding-inline);
  font-variant-numeric: tabular-nums;
  line-height: 1;

  & > .ck-input-number {
    width: calc(4ch + 2 * var(--ck-spacing-padding-compact) + 2px);
    min-width: calc(4ch + 2 * var(--ck-spacing-padding-compact) + 2px);
    font-size: var(--ck-page-navigator-font-size);
    text-align: center;
    -moz-appearance: textfield;
    background: none;

    &::-webkit-inner-spin-button, &::-webkit-outer-spin-button {
      -webkit-appearance: none;
      margin: 0;
    }

    &:not(:focus) {
      border: 1px solid #0000;
      border-bottom: 1px solid var(--ck-color-border-control);
    }
  }

  & > span {
    font-size: var(--ck-page-navigator-font-size);
    min-width: calc(2 * var(--ck-spacing-standard, var(--ck-spacing-base)) + 5ch);
    display: inline-block;

    &:before {
      content: "/";
      margin: 0 var(--ck-spacing-standard, var(--ck-spacing-base));
    }
  }
}

.ck.ck-pagination-view-line {
  border-top: 1px dotted var(--ck-pagination-divider-color);
  pointer-events: none;
  height: 0;
  position: absolute;

  &:after {
    content: attr(data-page-number);
    font-size: var(--ck-font-size-tiny, var(--ck-font-size-xs));
    background: var(--ck-pagination-label-background-color);
    border-radius: var(--ck-pagination-label-border-radius);
    color: var(--ck-color-text-inverse);
    text-align: center;
    min-width: 18px;
    padding: var(--ck-pagination-label-padding);
    display: inline-block;
    position: absolute;
    top: -1px;
    right: -1px;
    transform: translateX(100%);
  }
}

.ck .ck-user__marker-dot {
  left: 50%;
  top: calc(( var(--ck-user-dot-size) / 2 ) * -1);
  width: var(--ck-user-dot-size);
  height: var(--ck-user-dot-size);
  cursor: default;
  border-radius: 50%;
  display: block;
  position: absolute;
  transform: translate(-50%, -50%);
}

.ck .ck-user__marker-tooltip {
  font-family: var(--ck-font-face, var(--ck-font-family));
  font-size: var(--ck-font-size-normal, var(--ck-font-size-base));
  line-height: 1;
  font-style: initial;
  font-weight: initial;
  opacity: 0;
  padding: var(--ck-spacing-small, var(--ck-spacing-sm));
  color: #fff;
  white-space: nowrap;
  transition: opacity var(--ck-transition-duration-control) linear, transform var(--ck-duration-slow) ease-in-out;
  z-index: 99999;
  display: none;
  position: absolute;
  top: -20px;
  left: 0;

  @media (prefers-reduced-motion: reduce) {
    transition: none;
  }
}

.ck .ck-user__marker-line {
  width: 0;
  height: 100%;
  position: absolute;
  bottom: 0;
}

.ck .ck-user__marker {
  cursor: default;
  display: inline;
  position: relative;
}

.ck .ck-user__marker.ck-user__marker_hovered {
  & .ck-user__marker-dot {
    width: 0;
  }

  & .ck-user__marker-tooltip {
    opacity: 1;
    animation: userMarkersFadeInLeft var(--ck-duration-slow) ease-in-out;
    display: block;
  }
}

.ck .ck-placeholder {
  & .ck-user__marker {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ck .ck-user__marker {
    &, & *, &:after {
      animation: none !important;
    }
  }
}

@keyframes userMarkersFadeInLeft {
  from {
    opacity: 0;
    transform: translateX(-10px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

:root, :host {
  --ck-presence-list-dropdown-background-color: var(--ck-color-surface-container);
  --ck-presence-list-dropdown-border-color: var(--ck-color-border-container);
  --ck-presence-list-hover-background-color: var(--ck-color-interactive-hover-surface);
  --ck-presence-list-dropdown-list-max-width: 250px;
  --ck-presence-list-dropdown-list-min-width: 196px;
  --ck-presence-list-users-tooltip-max-width: 120px;
  --ck-presence-list-padding: var(--ck-spacing-padding-compact) var(--ck-spacing-padding);
  --ck-presence-list-border-radius: var(--ck-border-radius-surface);
  --ck-presence-list-list-item-padding: var(--ck-spacing-padding-compact);
  --ck-presence-list-marker-length: calc(var(--ck-font-size-base) * 1.25);
  --ck-presence-list-marker-thickness: calc(var(--ck-font-size-base) * .25);
  --ck-presence-list-marker-gap: var(--ck-spacing-gap-compact);
  --ck-presence-list-marker-border-radius: var(--ck-radius-md);
  --ck-presence-list-dropdown-avatar-size: 32px;
  --ck-presence-list-dropdown-list-item-padding: var(--ck-spacing-padding-compact) var(--ck-spacing-padding);
  --ck-presence-list-dropdown-list-item-gap: var(--ck-spacing-gap);
  --ck-presence-list-dropdown-list-item-border-radius: var(--ck-border-radius-control);
  --ck-presence-list-dropdown-user-name-font-size: var(--ck-font-size-md);
  --ck-presence-list-focus-border-radius: var(--ck-border-radius-control);
}

.ck.ck-presence-list {
  margin-right: var(--ck-spacing-standard, var(--ck-spacing-base));
  transition: margin-right var(--ck-transition-duration-control) ease-in-out;
  font-size: var(--ck-font-size-normal, var(--ck-font-size-base));
  align-items: center;
  display: inline-flex;

  & * {
    box-sizing: border-box;
  }
}

.ck.ck-presence-list__list {
  flex-direction: row;
  justify-content: flex-end;
  display: flex;
  position: relative;

  &:after {
    content: "";
    background: none;
    width: 100%;
    height: 15px;
    position: absolute;
    bottom: -15px;
    left: 0;
  }
}

.ck.ck-presence-list__counter--hidden {
  display: none;
}

.ck.ck-presence-list__list-item {
  font: inherit;
  color: inherit;
  padding: var(--ck-presence-list-list-item-padding);
  border-radius: var(--ck-presence-list-focus-border-radius);
  margin-left: var(--ck-spacing-gap-tight);
  background: none;
  border: 0;
  outline: none;
  position: relative;

  &:focus {
    outline: var(--ck-interactive-focus-ring);
    outline-offset: -1px;
    box-shadow: var(--ck-focus-outer-shadow, var(--ck-interactive-focus-shadow)), 0 0;
  }

  & .ck-user {
    margin: 0;
  }

  & .ck-label {
    width: 0;
    height: 0;
    overflow: hidden;
  }

  &:first-child {
    margin-left: 0;
  }
}

.ck.ck-tooltip.ck-presence-list__list-item__tooltip {
  & > .ck-tooltip__text {
    max-width: var(--ck-presence-list-users-tooltip-max-width);
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
    overflow: hidden;
  }
}

.ck.ck-presence-list__marker {
  width: var(--ck-presence-list-marker-length);
  height: var(--ck-presence-list-marker-thickness);
  margin: var(--ck-presence-list-marker-gap) auto 0;
  border-radius: var(--ck-presence-list-marker-border-radius);
  display: block;
  position: relative;
}

.ck-presence-list__list button.ck-presence-list__list-item *, .ck-presence-list__balloon button.ck-presence-list__dropdown-list-item * {
  cursor: pointer;
}

.ck.ck-presence-list--collapsed {
  & .ck-presence-list__list {
    padding: var(--ck-presence-list-padding);
    border-radius: var(--ck-presence-list-border-radius);
    cursor: pointer;
    min-width: calc(var(--ck-user-avatar-size) * 2);

    &:after {
      height: auto;
      top: 0;
    }

    & * {
      cursor: pointer;
      transition: all var(--ck-transition-duration-surface) ease-in-out;
    }

    &:hover {
      background: var(--ck-presence-list-hover-background-color);
    }

    &:focus {
      outline: var(--ck-interactive-focus-ring);
      outline-offset: -1px;
      box-shadow: var(--ck-focus-outer-shadow, var(--ck-interactive-focus-shadow)), 0 0;
    }
  }

  & .ck.ck-presence-list__list-item {
    margin-left: calc(var(--ck-user-avatar-size) * -.35);
    border: 0;
    padding: 0;

    &:first-child {
      margin-left: 0;
    }

    &:last-child {
      order: unset;
    }

    & .ck-user {
      --ck-presence-list-avatar-border-color: var(--ck-color-base-foreground);
      border: 2px solid var(--ck-presence-list-avatar-border-color);
    }

    & .ck-presence-list__users-counter {
      margin-left: 0;
      margin-right: 0;
    }
  }
}

.ck.ck-presence-list__balloon {
  --ck-balloon-panel-border-color: var(--ck-color-presence-list-dropdown-arrow-border, var(--ck-presence-list-dropdown-border-color));
  --ck-balloon-panel-border: var(--ck-border-width-surface) solid var(--ck-balloon-panel-border-color);
  --ck-balloon-panel-background-color: var(--ck-color-presence-list-dropdown-background, var(--ck-presence-list-dropdown-background-color));
  background-color: var(--ck-color-presence-list-dropdown-background, var(--ck-presence-list-dropdown-background-color));
  opacity: 1;
  animation: var(--ck-duration-slow) fadeIn ease-in-out;

  @media (prefers-reduced-motion: reduce) {
    animation: none;
  }

  & ul {
    background-color: var(--ck-color-presence-list-dropdown-background, var(--ck-presence-list-dropdown-background-color));
  }

  & .ck.ck-presence-list__dropdown-list-wrapper {
    min-width: var(--ck-presence-list-dropdown-list-min-width);
    max-width: var(--ck-presence-list-dropdown-list-max-width);

    &.ck-presence-list__dropdown-list-wrapper_scrollable {
      max-height: 80vh;
      overflow: hidden auto;
    }
  }

  & .ck.ck-presence-list__dropdown-list-item {
    font: inherit;
    color: inherit;
    align-items: center;
    gap: var(--ck-presence-list-dropdown-list-item-gap);
    margin: var(--ck-list-item-outer-padding);
    padding: var(--ck-presence-list-dropdown-list-item-padding);
    border-radius: var(--ck-presence-list-dropdown-list-item-border-radius);
    --ck-user-avatar-size: var(--ck-presence-list-dropdown-avatar-size);
    background: none;
    border: 0;
    outline: none;
    padding-inline-start: var(--ck-spacing-padding-snug);
    display: flex;
    position: relative;

    & .ck-user {
      margin: 0;
    }

    &:hover {
      background: var(--ck-presence-list-hover-background-color);
    }

    &:focus {
      z-index: 1;
      outline: var(--ck-interactive-focus-ring);
      outline-offset: -1px;
      box-shadow: var(--ck-focus-outer-shadow, var(--ck-interactive-focus-shadow)), 0 0;
      position: relative;
    }
  }

  & .ck.ck-presence-list__dropdown-list {
    &:before {
      content: "";
      inset: calc(-1 * (3px + var(--ck-border-width-surface))) 0;
      z-index: -1;
      position: absolute;
    }

    & .ck-user__full-name {
      white-space: nowrap;
      text-overflow: ellipsis;
      color: var(--ck-color-text);
      font-size: var(--ck-presence-list-dropdown-user-name-font-size);
      overflow: hidden;
    }

    & .ck.ck-presence-list__marker {
      width: var(--ck-presence-list-marker-thickness);
      height: var(--ck-presence-list-marker-length);
      flex-shrink: 0;
      order: -1;
      margin: 0;
    }
  }
}

.ck.ck-presence-list__users-counter {
  --ck-presence-list-counter-border-color: var(--ck-user-avatar-background, var(--ck-user-avatar-background-color));
  --ck-presence-list-counter-background-color: var(--ck-user-avatar-color, var(--ck-user-avatar-text-color));
  border: 2px solid var(--ck-presence-list-counter-border-color);
  background-color: var(--ck-presence-list-counter-background-color);
  box-sizing: border-box;
  height: calc(var(--ck-user-avatar-size) - 4px);
  width: calc(var(--ck-user-avatar-size) - 4px);
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  margin: 2px;
  line-height: 100%;
  display: flex;
  position: relative;
}

.ck.ck-presence-list__users-counter__text {
  --ck-presence-list-counter-text-color: var(--ck-user-avatar-background, var(--ck-user-avatar-background-color));
  color: var(--ck-presence-list-counter-text-color);
  cursor: default;
  -webkit-user-select: none;
  user-select: none;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

:root, :host {
  --ck-revision-history-loading-overlay-transition-duration: var(--ck-transition-duration-control);
  --ck-revision-history-loading-overlay-transition-delay: 0s;
  --ck-revision-history-loading-overlay-spinner-rotation-duration: 1s;
  --ck-revision-history-loading-overlay-spinner-size: 60px;
  --ck-revision-history-loading-overlay-visible-background-color: var(--ck-revision-history-loading-overlay-visible-background, #fff);
}

.ck.ck-editor__editable {
  &:before, &:after {
    visibility: hidden;
    transition: opacity var(--ck-revision-history-loading-overlay-transition-duration) ease;
    opacity: 0;
    content: "";
    transition-delay: 0s;
    position: absolute;

    @media (prefers-reduced-motion: reduce) {
      transition: none;
    }
  }

  &:before {
    background: var(--ck-revision-history-loading-overlay-visible-background-color);
    width: 100%;
    height: 100%;
    z-index: var(--ck-z-default, var(--ck-z-base));
    top: 0;
    left: 0;
  }

  &:after {
    box-sizing: border-box;
    width: var(--ck-revision-history-loading-overlay-spinner-size);
    height: var(--ck-revision-history-loading-overlay-spinner-size);
    border-radius: var(--ck-radius-full);
    border-top: 3px solid var(--ck-color-text);
    z-index: var(--ck-z-default, var(--ck-z-base));
    border-right: 3px solid #0000;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

  &.ck-editor__editable__loading-overlay, &.ck-editor__editable__overlay {
    min-height: calc(var(--ck-revision-history-loading-overlay-spinner-size) + 2 * var(--ck-spacing-large, var(--ck-spacing-lg)));
    position: relative;

    &:before, &:after {
      visibility: visible;
      z-index: 2;
      opacity: .8;
      transition-delay: var(--ck-revision-history-loading-overlay-transition-delay);
    }
  }

  &.ck-editor__editable__loading-overlay:after {
    animation: ck-revision-history-spinner-animation var(--ck-revision-history-loading-overlay-spinner-rotation-duration) linear infinite;
  }

  &.ck-editor__editable__overlay {
    &:after {
      visibility: hidden;
    }
  }
}

@keyframes ck-revision-history-spinner-animation {
  from {
    transform: translate(-50%, -50%) rotate(0);
  }

  to {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}

.ck.ck-revision-history-save-revision-form {
  width: 400px;
  padding: var(--ck-dialog-content-padding);
  flex-flow: row;
  align-items: flex-start;
  display: flex;

  & .ck-labeled-field-view {
    width: 100%;
  }

  & .ck-label {
    display: none;
  }

  & .ck-input {
    width: 100%;
  }
}

.ck.ck-revision-history-sidebar__revision-name {
  left: calc(-1 * var(--ck-spacing-small, var(--ck-spacing-sm)));
  margin-right: 30px;
  font-size: 1.2em;
  font-weight: bold;
  display: block;
  position: relative;

  & > .ck-labeled-field-view__input-wrapper {
    & > .ck-label {
      display: none;
    }

    & > .ck-input {
      padding: var(--ck-spacing-control-padding-block) var(--ck-spacing-control-padding-inline-compact);
      min-height: auto;
      color: inherit;
      font-family: inherit;
      font-weight: bold;
      font-size: var(--ck-font-size-normal, var(--ck-font-size-base));
      border-radius: var(--ck-border-radius-control);
      width: 100%;
      min-width: auto;
      transition: var(--ck-revision-history-revision-transition);
      text-overflow: ellipsis;
      background: none;

      @media (prefers-reduced-motion: reduce) {
        transition: none;
      }

      &, &:focus, &[readonly] {
        background: none;
      }

      &:not(.ck-input_focused) {
        border-color: #0000;
      }

      &::placeholder {
        color: inherit;
      }

      &[readonly] {
        pointer-events: none;
      }
    }
  }
}

.ck.ck-revision-history-sidebar__revision-author {
  transition: var(--ck-revision-history-revision-transition);
  display: block;
  position: relative;

  @media (prefers-reduced-motion: reduce) {
    transition: none;
  }

  & .ck-revision-history-sidebar__revision-author__name {
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
    font-weight: bold;
    font-size: var(--ck-revision-history-revision-author-font-size);
    color: var(--ck-revision-history-revision-author-text-color);
    display: block;
    overflow: hidden;
  }

  & .ck-icon {
    left: calc(-1 * var(--ck-revision-history-revision-author-icon-offset));
    top: calc(var(--ck-revision-history-revision-author-font-size)/2);
    width: 11px;
    height: 10px;
    position: absolute;
  }

  &:not(:first-of-type) .ck-icon {
    display: none;
  }
}

.ck {
  &.ck-revision-history-sidebar__revision {
    & .ck-revision-history-sidebar__revision__actions {
      top: var(--ck-revision-history-revision-padding-block);
      right: var(--ck-revision-history-revision-padding-inline);
      display: none;
      position: absolute;

      & .ck-dropdown__button {
        min-width: unset;
        min-height: unset;

        & .ck-button__icon {
          transform: scale(.7);
        }
      }

      & .ck-dropdown__arrow {
        display: none;
      }

      & .ck-list__item__danger {
        color: var(--ck-color-button-cancel, var(--ck-button-cancel-color));
      }
    }

    &.ck-revision-history-sidebar__revision_selected {
      & .ck-revision-history-sidebar__revision__actions {
        & .ck-dropdown__button {
          color: var(--ck-revision-history-revision-selected-input-text-color);

          &:hover, &.ck-on {
            background: var(--ck-button-hover-background);
            color: initial;
          }
        }
      }
    }

    &.ck-revision-history-sidebar__revision_highlighted {
      & .ck-revision-history-sidebar__revision__actions {
        & .ck-dropdown__button {
          &:hover, &.ck-on {
            background: var(--ck-revision-history-revision-highlighted-hover-background-color);

            &:hover {
              filter: brightness(95%);
            }
          }
        }
      }
    }

    &:hover:not(.ck-disabled) .ck-revision-history-sidebar__revision__actions, &:not(.ck-disabled) .ck-revision-history-sidebar__revision__actions.ck-on {
      display: block;
    }
  }
}

:root, :host {
  --ck-revision-history-revision-background-color: var(--ck-color-surface-container);
  --ck-revision-history-revision-padding-inline: var(--ck-spacing-padding-comfortable);
  --ck-revision-history-revision-padding-block: var(--ck-spacing-large, var(--ck-spacing-lg));
  --ck-revision-history-revision-padding: var(--ck-spacing-padding-comfortable);
  --ck-revision-history-revision-border-color: #47576b;
  --ck-revision-history-revision-selected-border-color: var(--ck-color-base-active);
  --ck-revision-history-revision-highlighted-border-color: transparent;
  --ck-revision-history-revision-author-text-color: inherit;
  --ck-revision-history-revision-date-text-color: inherit;
  --ck-revision-history-revision-shadow: var(--ck-revision-history-revision-box-shadow, 0);
  --ck-revision-history-revision-author-icon-offset: 20px;
  --ck-revision-history-revision-transition: var(--ck-revision-history-revision-transitions, background var(--ck-transition-duration-control-fast) ease-in, border var(--ck-transition-duration-control-fast) ease-in);
  --ck-revision-history-revision-selected-text-color: var(--ck-color-text-primary);
  --ck-revision-history-revision-selected-input-text-color: #4a67d6;
  --ck-revision-history-revision-selected-input-empty-text-color: var(--ck-revision-history-revision-selected-input-text-color-empty, var(--ck-color-base-background));
  --ck-revision-history-revision-selected-author-text-color: var(--ck-revision-history-revision-selected-text-color);
  --ck-revision-history-revision-author-font-size: var(--ck-font-size-md);
  --ck-revision-history-revision-selected-date-text-color: #525252;
  --ck-revision-history-revision-selected-background-color: var(--ck-color-surface-canvas);
  --ck-revision-history-revision-highlighted-background-color: #e0f1ff;
  --ck-revision-history-revision-highlighted-hover-background-color: var(--ck-revision-history-revision-highlighted-background-color-hover, #cce7ff);
  --ck-revision-history-revision-delete-confirmation-background-color: var(--ck-revision-history-revision-delete-confirmation-background, #fcc);
  --ck-revision-history-revision-delete-confirmation-active-button-background-color: var(--ck-revision-history-revision-delete-confirmation-active-button-background, #ffb3b3);
  --ck-revision-history-revision-radius: var(--ck-border-radius-surface);
  --ck-revision-history-revision-active-radius: 0 var(--ck-border-radius-surface) var(--ck-border-radius-surface) 0;
}

.ck.ck-revision-history-sidebar__revision-wrapper {
  & .ck-revision-history-sidebar__revision {
    background: var(--ck-revision-history-revision-background-color);
    padding: var(--ck-revision-history-revision-padding);
    border-radius: var(--ck-revision-history-revision-radius);
    border-left: 3px solid var(--ck-revision-history-revision-border-color);
    box-shadow: var(--ck-revision-history-revision-shadow);
    width: 100%;
    transition: transform var(--ck-transition-duration-control-emphasized) ease;
    display: block;
    position: relative;

    @media (prefers-reduced-motion: reduce) {
      transition: none;
    }

    &:last-child {
      margin-bottom: 0;
    }

    & .ck-revision-history-sidebar__revision__date {
      color: var(--ck-revision-history-revision-date-text-color);
      font-size: var(--ck-font-size-small, var(--ck-font-size-sm));
      opacity: .8;
      text-overflow: ellipsis;
      white-space: nowrap;
      width: 100%;
      font-weight: bold;
      display: block;
      overflow: hidden;
    }

    & .ck-revision-history-sidebar__revision__controls-wrapper {
      margin: var(--ck-spacing-standard, var(--ck-spacing-base)) 0 0;
      flex-direction: row;
      align-items: flex-start;
      display: flex;
    }

    & .ck-revision-history-sidebar__revision-authors {
      margin: 0 0 0 var(--ck-revision-history-revision-author-icon-offset);
      flex: 0 auto;
      min-width: 0;
      padding: 0;
    }

    & .ck-revision-history-sidebar__revision-ai-pill-row {
      width: 100%;
      margin-top: var(--ck-spacing-small, var(--ck-spacing-sm));
      justify-content: flex-end;
      display: flex;
    }

    &.ck-revision-history-sidebar__revision_selected, &.ck-revision-history-sidebar__revision_highlighted {
      transform: translateX(calc(-1 * var(--ck-revision-history-sidebar-timeline-padding)));
      border-radius: var(--ck-revision-history-revision-active-radius);
    }

    &.ck-revision-history-sidebar__revision_selected {
      border-left-color: var(--ck-revision-history-revision-selected-border-color);
      background: var(--ck-revision-history-revision-selected-background-color);
      color: var(--ck-revision-history-revision-selected-text-color);

      & .ck-revision-history-sidebar__revision__date {
        color: var(--ck-revision-history-revision-selected-date-text-color);
      }

      & .ck-revision-history-sidebar__revision-author__name {
        color: var(--ck-revision-history-revision-selected-author-text-color);
      }

      & .ck-revision-history-sidebar__revision-name .ck-input {
        color: var(--ck-revision-history-revision-selected-input-text-color);

        &.ck-input-text_empty::placeholder {
          opacity: .7;
        }
      }
    }

    &.ck-revision-history-sidebar__revision_highlighted {
      border-left-color: var(--ck-revision-history-revision-highlighted-border-color);
      background: var(--ck-revision-history-revision-highlighted-background-color);
    }

    &.ck-revision-history-sidebar__actions_dropdown_open {
      z-index: var(--ck-z-default, var(--ck-z-base));
    }
  }

  &.ck-revision-history-sidebar__revision-wrapper_confirmation_visible {
    & .ck-revision-history-sidebar__revision {
      box-shadow: none;
      position: relative;
      transform: translate3d(-100%, 0, 0);

      &, & * {
        --ck-revision-history-revision-background-color: transparent;
        --ck-revision-history-revision-selected-background-color: transparent;
        --ck-revision-history-revision-highlighted-background-color: transparent;
      }
    }
  }

  & .ck-confirm-view {
    border-radius: var(--ck-revision-history-revision-radius);
    width: 100%;
    height: 100%;
    box-shadow: var(--ck-revision-history-revision-shadow);
    background: var(--ck-revision-history-revision-delete-confirmation-background-color);
    -webkit-user-select: none;
    user-select: none;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
    display: flex;
    position: absolute;
    top: 0;
    left: 100%;

    & .ck-confirm-view-inner {
      text-align: center;
      margin-top: var(--ck-spacing-small, var(--ck-spacing-sm));

      & p {
        color: var(--ck-color-text);
        margin: 0;
        font-weight: bold;
      }

      & .ck-confirm-view-actions {
        flex-direction: row;
        justify-content: space-evenly;
        display: flex;

        & .ck.ck-button {
          &:hover, &:focus, &:active {
            background: var(--ck-revision-history-revision-delete-confirmation-active-button-background-color);
          }

          &.ck-confirm-view-submit {
            color: var(--ck-color-button-save, var(--ck-button-save-color));
          }

          &.ck-confirm-view-cancel {
            color: var(--ck-color-button-cancel, var(--ck-button-cancel-color));
          }
        }
      }
    }
  }

  & .ck-revision-history-sidebar__subrevisions {
    margin-left: var(--ck-spacing-large, var(--ck-spacing-lg));
  }
}

:root, :host {
  --ck-revision-history-sidebar-revision-vertical-spacing: calc(2 * var(--ck-spacing-standard, var(--ck-spacing-base)));
}

.ck.ck-revision-history-sidebar__time-period {
  width: 100%;

  & .ck-revision-history-sidebar__time-period__label {
    background: var(--ck-revision-history-sidebar-period-background-color);
    padding: var(--ck-spacing-control-padding-block) var(--ck-spacing-control-padding-inline);
    border-radius: var(--ck-border-radius-control);
    color: var(--ck-color-text-inverse);
    text-transform: uppercase;
    font-size: 9px;
    font-weight: bold;

    &:first-child {
      margin-top: var(--ck-spacing-standard, var(--ck-spacing-base));
    }
  }

  & .ck-revision-history-sidebar__time-period__revisions {
    flex-direction: column;
    display: flex;

    & .ck-revision-history-sidebar__revision-wrapper {
      margin-top: var(--ck-revision-history-sidebar-revision-vertical-spacing);
    }
  }

  &:not(.ck-hidden) + .ck-revision-history-sidebar__time-period {
    margin-top: var(--ck-revision-history-sidebar-revision-vertical-spacing);
  }
}

.ck.ck-revision-history-sidebar__header {
  --header-height: max(calc(var(--ck-ui-component-min-height, var(--ck-size-min-height)) + 2 * var(--ck-spacing-small, var(--ck-spacing-sm)) + 1px),
		calc(var(--ck-icon-size) + 2 * var(--ck-spacing-small, var(--ck-spacing-sm)) + 2 * var(--ck-spacing-small, var(--ck-spacing-sm)) + 1px));
  height: var(--header-height);
  min-height: var(--header-height);
  line-height: var(--header-height);
  border-bottom: var(--ck-border-divider);
  color: inherit;
  padding: 0 var(--ck-revision-history-sidebar-timeline-padding);
  flex-direction: row;
  align-items: center;
  font-family: inherit;
  font-weight: bold;
  display: flex;
  overflow: hidden;

  & .ck-revision-history-sidebar__header__label {
    color: inherit;
    font-family: inherit;
    font-size: 1.2em;
    font-weight: bold;
  }

  & .ck-icon {
    margin-right: var(--ck-spacing-large, var(--ck-spacing-lg));
  }
}

:root, :host {
  --ck-revision-history-sidebar-period-background-color: var(--ck-revision-history-sidebar-period-background, #ff5724);
  --ck-revision-history-sidebar-timeline-padding: var(--ck-spacing-padding-comfortable);
}

.ck.ck-revision-history-sidebar {
  flex-direction: column;
  display: flex;

  & .ck-revision-history-sidebar__timeline {
    padding: var(--ck-revision-history-sidebar-timeline-padding);
    font-size: var(--ck-font-size-normal, var(--ck-font-size-base));
    flex-direction: column;
    align-items: start;
    height: 100%;
    display: flex;
    overflow: hidden auto;

    &.ck-disabled {
      filter: grayscale(1) opacity(var(--ck-disabled-opacity, var(--ck-opacity-disabled)));
    }
  }
}

:root, :host {
  --ck-revision-history-changes-navigation-font-size: var(--ck-font-size-md);
}

.ck.ck-revision-history-ui.ck-revision-history-ui__changes-navigation {
  align-items: center;
  margin-left: auto;
  display: flex;

  & .ck-revision-history-ui__changes-navigation__wrapper {
    margin-right: var(--ck-spacing-standard, var(--ck-spacing-base));
    font-size: var(--ck-revision-history-changes-navigation-font-size);
    display: flex;
  }

  & .ck-revision-history-ui__changes-navigation__label {
    white-space: pre;
    font-weight: bold;
    font-size: var(--ck-revision-history-changes-navigation-font-size);
  }

  & .ck-revision-history-ui__changes-navigation__navigation {
    margin-left: var(--ck-spacing-small, var(--ck-spacing-sm));
  }
}

.ck .ck-revision-change {
  padding: var(--ck-spacing-control-padding-block) var(--ck-spacing-padding-comfortable);
  border-top-left-radius: var(--ck-border-radius-surface);
  outline: 0;

  & > * {
    vertical-align: bottom;
    font-size: var(--ck-font-size-standard);
  }

  &.ck-revision-change__add {
    border-left-color: var(--ck-color-suggestion-box-insertion-border, var(--ck-suggestion-box-insertion-border-color));
  }

  &.ck-revision-change__remove {
    border-left-color: var(--ck-color-suggestion-box-deletion-border, var(--ck-suggestion-box-deletion-border-color));
  }

  & .ck-revision-change__label {
    font-weight: bold;
    font-size: inherit;
    vertical-align: baseline;
  }

  & .ck-revision-change__author {
    vertical-align: baseline;
    font-weight: normal;
  }

  & .ck-revision-change__ai-note {
    color: var(--ck-color-suggestion-ai-accent, var(--ck-suggestion-ai-accent-color));
    vertical-align: baseline;
    font-weight: bold;
  }

  &.ck-revision-change_ai > span {
    align-items: center;
    gap: .3em;
    display: inline-flex;
  }

  & .ck-revision-change__ai-icon {
    width: 1.1em;
    height: 1.1em;
    color: var(--ck-color-suggestion-ai-accent, var(--ck-suggestion-ai-accent-color));
    flex: none;
  }
}

.ck.ck-button {
  &.ck-revision-history-ui__back-to-editing {
    background: var(--ck-color-interactive-primary-surface);
    color: var(--ck-color-text-inverse);

    &:hover:not(.ck-disabled) {
      background: var(--ck-color-interactive-primary-surface-hover);
    }
  }
}

.ck.ck-editor__editable_inline.ck-revision-history-root-add {
  border: 3px solid var(--ck-suggestion-marker-insertion-border-color);

  &.ck-revision-history-root--active {
    border-color: var(--ck-color-suggestion-marker-insertion-border-active, var(--ck-suggestion-marker-insertion-active-border-color));
  }
}

.ck.ck-editor__editable_inline.ck-revision-history-root-remove {
  border: 3px solid var(--ck-suggestion-marker-deletion-border-color);

  &.ck-revision-history-root--active {
    border-color: var(--ck-suggestion-marker-deletion-active-border-color);
  }
}

.ck-content {
  & .ck-suggestion-preview-marker, & .ck-suggestion-preview-marker-split {
    opacity: .75;
  }

  & .ck-suggestion-preview-marker-split:after {
    content: "¶";
  }

  & .ck-suggestion-preview-marker-merge {
    opacity: .75;
    text-decoration: line-through;
  }

  & .ck-suggestion-preview-marker-merge:after {
    content: "¶";
  }

  & .ck-suggestion-preview-marker-deletion {
    text-decoration: line-through;
  }

  & .ck-suggestion-marker-deletion-new:not(.ck-widget), & .ck-suggestion-marker-merge-new {
    --ck-suggestion-marker-deletion-border-color: none;
    --ck-suggestion-marker-deletion-active-border-color: none;
    --ck-suggestion-marker-deletion-background-color: none;
    --ck-suggestion-marker-deletion-active-background-color: none;
    --ck-suggestion-marker-deletion-stroke-color: #7a1f36cc;
    --ck-suggestion-widget-deletion-background-color: #e5668608;
    --ck-suggestion-widget-deletion-active-background-color: #c4214a0d;
  }

  & .ck-suggestion-marker-merge-new:after {
    color: inherit;
  }

  & .ck-suggestion-marker-insertion-new, & .ck-suggestion-marker-split-new {
    opacity: .75;
  }

  & .ck-suggestion-marker-deletion-new.ck-suggestion-marker--active:not(.table), & .ck-suggestion-marker-merge-new.ck-suggestion-marker--active {
    --ck-suggestion-marker-deletion-active-background-color: #da255214;
    --ck-suggestion-marker-deletion-stroke-color: #7a1f36;
    opacity: 1;
  }

  & .ck-suggestion-marker-insertion-new.ck-suggestion-marker--active, & .ck-suggestion-marker-split-new.ck-suggestion-marker--active {
    opacity: 1;
  }
}

:root, :host {
  --ck-slash-command-button-width: 250px;
  --ck-slash-command-description-width: 200px;
  --ck-slash-command-button-radius: var(--ck-list-dropdown-button-border-radius, 0);
}

.ck-mentions .ck.ck-button.ck-slash-command-button {
  max-width: var(--ck-slash-command-button-width);
  padding: calc(.2 * var(--ck-line-height-base) * var(--ck-font-size-normal, var(--ck-font-size-base)));
  border-radius: var(--ck-slash-command-button-radius);
  justify-content: flex-start;
  display: flex;
  overflow: hidden;

  & .ck.ck-icon {
    color: var(--ck-color-text);
    background-color: var(--ck-color-surface-container);
    box-sizing: initial;
    border-radius: 2px;
    flex-shrink: 0;
    margin-left: 0;
    padding: 5px;

    [dir="ltr"] & {
      margin: 0 var(--ck-spacing-gap-compact) 0 0;
    }

    [dir="rtl"] & {
      margin: 0 0 0 var(--ck-spacing-gap-compact);
    }
  }

  & > .ck-slash-command-button__text-part {
    flex-direction: column;
    min-width: 0;
    display: flex;

    [dir="ltr"] & {
      margin-left: var(--ck-spacing-gap-compact);
    }

    [dir="rtl"] & {
      margin-right: var(--ck-spacing-gap-compact);
    }

    & > span {
      line-height: 1.2em;
    }

    & > .ck-button__label, & > .ck-slash-command-button__description {
      width: var(--ck-slash-command-description-width);
      text-overflow: ellipsis;
      padding-inline-end: 10px;
      overflow: hidden;
    }

    & > .ck-button__label {
      font-weight: bold;
    }

    & > .ck-slash-command-button__description {
      font-size: var(--ck-font-size-small, var(--ck-font-size-sm));
      opacity: .75;
    }
  }

  &.ck-on > .ck-slash-command-button__text-part > span {
    color: var(--ck-color-list-button-on-text, var(--ck-list-button-on-text-color));
  }
}

:root, :host {
  --ck-source-editing-enhanced-height: calc(var(--ck-dialog-max-height)            /* ─▶   Total max height of the dialog     */
		- var(--ck-form-header-height)         /* ─▶   Height of the dialog header        */
		- 2 * var(--ck-spacing-large, var(--ck-spacing-lg))          /* ─┐                                       */
		- var(--ck-ui-component-min-height, var(--ck-size-min-height))    /*  ├─▶ Height of the dialog actions bar   */
		- 2 * var(--ck-spacing-tiny, var(--ck-spacing-xs))           /* ─┘                                       */
		- 2 * var(--ck-dialog-content-padding)           /* ─▶   Padding of the dialog content           */);
  --ck-source-editing-enhanced-width: min(80vw, 1200px);
  --ck-source-editing-enhanced-font-size: var(--ck-font-size-md);
}

.ck.ck-code-editor {
  white-space: initial;
  padding: var(--ck-dialog-content-padding);
  height: var(--ck-source-editing-enhanced-height);
  width: var(--ck-source-editing-enhanced-width);
  flex-direction: row;
  justify-content: flex-start;
  align-items: stretch;
  margin: 0 auto;
  display: flex;

  & .cm-editor {
    width: 100%;
    font-size: var(--ck-source-editing-enhanced-font-size);
    border: var(--ck-border-control);
    border-radius: var(--ck-input-border-radius);
    flex-grow: 1;

    &.cm-focused {
      border-color: var(--ck-input-focus-border-color);
      box-shadow: var(--ck-focus-outer-shadow, var(--ck-interactive-focus-shadow)), 0 0;
      outline: none;
    }

    & .cm-scroller {
      border-radius: var(--ck-input-border-radius);
    }
  }
}

:root, :host {
  --ck-template-dropdown-view-width: 345px;
  --ck-template-dropdown-view-height: 300px;
  --ck-template-icon-size: 32px;
  --ck-template-list-border-radius: var(--ck-list-border-radius);
  --ck-template-list-padding: var(--ck-spacing-padding);
  --ck-template-list-gap: var(--ck-spacing-gap-compact);
  --ck-template-search-field-padding: var(--ck-spacing-padding-comfortable);
  --ck-template-list-item-title-font-size: var(--ck-font-size-md);
}

.ck-button.ck-template-button {
  & .ck.ck-icon {
    color: unset;

    & * {
      color: unset;

      &:not([fill]) {
        fill: unset;
      }
    }
  }
}

.ck.ck-template-form {
  width: var(--ck-template-dropdown-view-width);

  @media screen and (width <= 600px) {
    --ck-template-dropdown-view-width: 260px;
  }

  & > .ck-labeled-field-view {
    padding: var(--ck-template-search-field-padding);

    & .ck-input {
      min-width: auto;
    }
  }

  & > .ck-search__results {
    border-top: 1px solid var(--ck-color-divider);

    & > .ck.ck-list.ck-template-list {
      max-height: var(--ck-template-dropdown-view-height);
      padding: var(--ck-template-list-padding);
      overscroll-behavior: contain;
      border-radius: var(--ck-template-list-border-radius);
      gap: var(--ck-template-list-gap);
      overflow: hidden auto;

      & > .ck.ck-list__item {
        & > .ck.ck-button {
          width: 100%;
          padding: calc(.2 * var(--ck-line-height-base) * var(--ck-font-size-normal, var(--ck-font-size-base)));
          border-radius: var(--ck-border-radius-uniform);
          grid-template-columns: var(--ck-template-icon-size) 1fr;
          grid-template-rows: minmax(var(--ck-template-icon-size), auto);
          gap: var(--ck-spacing-gap-comfortable) var(--ck-spacing-gap-comfortable);
          grid-template-areas: "ck-template-icon ck-template-content";
          grid-auto-columns: 1fr;
          grid-auto-flow: column dense;
          align-items: center;
          margin: 0;
          display: grid;
          overflow: hidden;

          &:not(:focus) {
            border-color: var(--ck-color-dropdown-panel-background, var(--ck-dropdown-panel-background-color));
          }

          & > .ck.ck-icon {
            width: var(--ck-template-icon-size);
            grid-area: ck-template-icon;
            height: auto;
            margin: 0;
          }

          & > .ck-template-form__text-part {
            flex-direction: column;
            grid-area: ck-template-content;
            justify-content: space-evenly;
            min-width: 0;
            height: 100%;
            margin: 0;
            display: flex;

            & > .ck.ck-button__label {
              font-weight: bold;
              font-size: var(--ck-template-list-item-title-font-size);
              color: var(--ck-color-text);
              white-space: nowrap;
              text-overflow: ellipsis;
              line-height: 1.2;
              display: block;
              overflow: hidden;
            }

            & .ck-template-form__description {
              font-size: var(--ck-font-size-small, var(--ck-font-size-sm));
              color: var(--ck-color-text);
              margin-top: var(--ck-spacing-tiny, var(--ck-spacing-xs));
              white-space: normal;
              text-overflow: ellipsis;
              -webkit-line-clamp: 2;
              -webkit-box-orient: vertical;
              line-height: 1.2;
              display: -webkit-box;
              overflow: hidden;
            }

            & mark {
              background: var(--ck-color-highlight-background);
              vertical-align: initial;
              font-weight: inherit;
              line-height: inherit;
              font-size: inherit;
            }
          }
        }
      }
    }
  }
}

:root, :host {
  --ck-track-changes-preview-margin: var(--ck-dialog-content-padding);
  --ck-track-changes-preview-padding: var(--ck-spacing-padding-comfortable);
  --ck-track-changes-preview-border: var(--ck-border-control);
  --ck-track-changes-preview-border-radius: var(--ck-input-border-radius);
}

.ck.ck-track-changes-preview {
  max-width: 80vw;
  max-height: 80vh;
  margin: var(--ck-track-changes-preview-margin);
  padding: var(--ck-track-changes-preview-padding);
  border: var(--ck-track-changes-preview-border);
  border-radius: var(--ck-track-changes-preview-border-radius);
  -webkit-user-select: text;
  user-select: text;
  overflow-x: hidden;
}

.ck.ck-content.ck-track-changes-preview__root-container[data-ck-root-name] {
  border: none;
  margin: 0;
}

@layer uc;

@layer uc.base {
  :where([uc-wgt-common]) {
    --cfg-init-activity: "start-from";
    --cfg-done-activity: "";
    --uc-font-family: system-ui;
    --uc-font-size: 14px;
    --uc-line-height: normal;
    --uc-simple-btn-font-family: system-ui;
    --uc-simple-btn-font-size: 14px;
    --uc-button-size: 32px;
    --uc-preview-size: 32px;
    --uc-padding: 10px;
    --uc-radius: 8px;
    --uc-transition: .2s ease;
    --uc-dialog-width: 430px;
    --uc-dialog-max-width: 920px;
    --uc-dialog-max-height: 675px;
    --uc-simple-btn-padding: 7px 14px;
    --uc-grid-col: 3;
    --uc-grid-preview-image-height: auto;
    --uc-grid-gap: calc(var(--uc-padding) / 2);
    --uc-grid-aspect-ratio: 1 / 1;
    --uc-background: var(--uc-background-light);
    --uc-foreground: var(--uc-foreground-light);
    --uc-primary: var(--uc-primary-light);
    --uc-primary-hover: var(--uc-primary-hover-light);
    --uc-primary-transparent: var(--uc-primary-transparent-light);
    --uc-primary-foreground: var(--uc-primary-foreground-light);
    --uc-secondary: var(--uc-secondary-light);
    --uc-secondary-hover: var(--uc-secondary-hover-light);
    --uc-secondary-foreground: var(--uc-secondary-foreground-light);
    --uc-muted: var(--uc-muted-light);
    --uc-muted-foreground: var(--uc-muted-foreground-light);
    --uc-destructive: var(--uc-destructive-light);
    --uc-destructive-foreground: var(--uc-destructive-foreground-light);
    --uc-border: var(--uc-border-light);
    --uc-dialog-shadow: var(--uc-dialog-shadow-light);
    --uc-simple-btn: var(--uc-simple-btn-light);
    --uc-simple-btn-hover: var(--uc-simple-btn-hover-light);
    --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-light);
  }

  @supports not (color: oklch(0% 0 0)) {
    :where([uc-wgt-common]) {
      --uc-primary-rgb-light: 23 75 215;
      --uc-primary-light: rgb(var(--uc-primary-rgb-light));
      --uc-primary-hover-light: rgb(var(--uc-primary-rgb-light) / 90%);
      --uc-primary-transparent-light: rgb(var(--uc-primary-rgb-light) / 10%);
      --uc-background-light: #fff;
      --uc-foreground-light: #181818;
      --uc-primary-foreground-light: #fff;
      --uc-secondary-light: #1818180d;
      --uc-secondary-hover-light: #18181814;
      --uc-secondary-foreground-light: #181818;
      --uc-muted-light: #f5f5f5;
      --uc-muted-foreground-light: #717171;
      --uc-destructive-light: #e813140d;
      --uc-destructive-foreground-light: #e81314;
      --uc-border-light: #e4e4e8;
      --uc-dialog-shadow-light: 0px 6px 20px #0000001a;
      --uc-simple-btn-light: #ebebeb;
      --uc-simple-btn-hover-light: #e4e4e4;
      --uc-simple-btn-foreground-light: #181818;
      --uc-primary-rgb-dark: 87 154 255;
      --uc-primary-dark: rgb(var(--uc-primary-rgb-dark));
      --uc-primary-hover-dark: rgb(var(--uc-primary-rgb-dark) / 90%);
      --uc-primary-transparent-dark: rgb(var(--uc-primary-rgb-dark) / 7%);
      --uc-background-dark: #1b1b1b;
      --uc-foreground-dark: #e1e1e1;
      --uc-primary-foreground-dark: #000;
      --uc-secondary-dark: #e1e1e112;
      --uc-secondary-hover-dark: #e1e1e11a;
      --uc-secondary-foreground-dark: #e1e1e1;
      --uc-muted-dark: #242424;
      --uc-muted-foreground-dark: #989898;
      --uc-destructive-dark: #f45a4f1a;
      --uc-destructive-foreground-dark: #f45a4f;
      --uc-border-dark: #3d3d3d;
      --uc-dialog-shadow-dark: 0px 6px 20px #00000040;
      --uc-simple-btn-dark: #242424;
      --uc-simple-btn-hover-dark: #2b2b2b;
      --uc-simple-btn-foreground-dark: #fff;
    }
  }

  @supports (color: oklch(0% 0 0)) {
    :where([uc-wgt-common]) {
      --uc-primary-oklch-light: 47% .22 264;
      --uc-primary-light: oklch(var(--uc-primary-oklch-light));
      --uc-primary-hover-light: oklch(var(--uc-primary-oklch-light) / 90%);
      --uc-primary-transparent-light: oklch(var(--uc-primary-oklch-light) / 7%);
      --uc-background-light: oklch(100% 0 0);
      --uc-foreground-light: oklch(21% 0 0);
      --uc-primary-foreground-light: oklch(100% 0 0);
      --uc-secondary-light: oklch(21% 0 0 / .05);
      --uc-secondary-hover-light: oklch(21% 0 0 / .08);
      --uc-secondary-foreground-light: oklch(21% 0 0);
      --uc-muted-light: oklch(97% 0 0);
      --uc-muted-foreground-light: oklch(40% 0 0);
      --uc-destructive-light: oklch(59% .235 28.5 / .05);
      --uc-destructive-foreground-light: oklch(59% .235 28.5);
      --uc-border-light: oklch(92% 0 0);
      --uc-dialog-shadow-light: 0px 6px 20px oklch(0% 0 0 / .1);
      --uc-simple-btn-light: oklch(94% 0 0);
      --uc-simple-btn-hover-light: oklch(92% 0 0);
      --uc-simple-btn-foreground-light: oklch(20% 0 0);
      --uc-primary-oklch-dark: 69% .1768 258.4;
      --uc-primary-dark: oklch(var(--uc-primary-oklch-dark));
      --uc-primary-hover-dark: oklch(var(--uc-primary-oklch-dark) / 90%);
      --uc-primary-transparent-dark: oklch(var(--uc-primary-oklch-dark) / 7%);
      --uc-background-dark: oklch(22% 0 0);
      --uc-foreground-dark: oklch(91% 0 0);
      --uc-primary-foreground-dark: oklch(0% 0 0);
      --uc-secondary-dark: oklch(91% 0 0 / .07);
      --uc-secondary-hover-dark: oklch(91% 0 0 / .1);
      --uc-secondary-foreground-dark: oklch(91% 0 0);
      --uc-muted-dark: oklch(26% 0 0);
      --uc-muted-foreground-dark: oklch(68% 0 0);
      --uc-destructive-dark: oklch(67% .191 27.5 / .1);
      --uc-destructive-foreground-dark: oklch(67% .191 27.5);
      --uc-border-dark: oklch(36% 0 0);
      --uc-dialog-shadow-dark: 0px 6px 20px oklch(0% 0 0 / .25);
      --uc-simple-btn-dark: oklch(26% 0 0);
      --uc-simple-btn-hover-dark: oklch(29% 0 0);
      --uc-simple-btn-foreground-dark: oklch(100% 0 0);
    }
  }

  @media only screen and (height <= 600px) {
    :where([uc-wgt-common]) {
      --uc-dialog-max-height: 100%;
    }
  }

  @media only screen and (width <= 680px) {
    :where([uc-wgt-common]) {
      --uc-grid-col: 2;
    }
  }

  @media only screen and (width <= 430px) {
    :where([uc-wgt-common]) {
      --uc-dialog-max-width: 100vw;
      --uc-dialog-max-height: var(--uploadcare-blocks-window-height);
      --uc-grid-col: 1;
    }
  }

  @media (prefers-color-scheme: light) {
    :where([uc-wgt-common]) {
      --uc-background: var(--uc-background-light);
      --uc-foreground: var(--uc-foreground-light);
      --uc-primary: var(--uc-primary-light);
      --uc-primary-hover: var(--uc-primary-hover-light);
      --uc-primary-transparent: var(--uc-primary-transparent-light);
      --uc-primary-foreground: var(--uc-primary-foreground-light);
      --uc-secondary: var(--uc-secondary-light);
      --uc-secondary-hover: var(--uc-secondary-hover-light);
      --uc-secondary-foreground: var(--uc-secondary-foreground-light);
      --uc-muted: var(--uc-muted-light);
      --uc-muted-foreground: var(--uc-muted-foreground-light);
      --uc-destructive: var(--uc-destructive-light);
      --uc-destructive-foreground: var(--uc-destructive-foreground-light);
      --uc-border: var(--uc-border-light);
      --uc-dialog-shadow: var(--uc-dialog-shadow-light);
      --uc-simple-btn: var(--uc-simple-btn-light);
      --uc-simple-btn-hover: var(--uc-simple-btn-hover-light);
      --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-light);
    }
  }

  @media (prefers-color-scheme: dark) {
    :where([uc-wgt-common]) {
      --uc-background: var(--uc-background-dark);
      --uc-foreground: var(--uc-foreground-dark);
      --uc-primary: var(--uc-primary-dark);
      --uc-primary-hover: var(--uc-primary-hover-dark);
      --uc-primary-transparent: var(--uc-primary-transparent-dark);
      --uc-primary-foreground: var(--uc-primary-foreground-dark);
      --uc-secondary: var(--uc-secondary-dark);
      --uc-secondary-hover: var(--uc-secondary-hover-dark);
      --uc-secondary-foreground: var(--uc-secondary-foreground-dark);
      --uc-muted: var(--uc-muted-dark);
      --uc-muted-foreground: var(--uc-muted-foreground-dark);
      --uc-destructive: var(--uc-destructive-dark);
      --uc-destructive-foreground: var(--uc-destructive-foreground-dark);
      --uc-border: var(--uc-border-dark);
      --uc-dialog-shadow: var(--uc-dialog-shadow-dark);
      --uc-simple-btn: var(--uc-simple-btn-dark);
      --uc-simple-btn-hover: var(--uc-simple-btn-hover-dark);
      --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-dark);
    }
  }

  :where([uc-wgt-common]) {
    color: var(--uc-foreground);
    font-size: var(--uc-font-size);
    line-height: var(--uc-line-height);
    font-family: var(--uc-font-family);
  }

  :where([uc-wgt-common]) * {
    box-sizing: border-box;
  }

  :where([uc-wgt-common]) button {
    height: var(--uc-button-size);
    white-space: nowrap;
    border-radius: var(--uc-radius);
    cursor: pointer;
    user-select: none;
    transition: background-color var(--uc-transition);
    border: none;
    justify-content: center;
    align-items: center;
    padding-left: 14px;
    padding-right: 14px;
    font-family: inherit;
    font-size: 1em;
    display: flex;
  }

  :where([uc-wgt-common]) button:focus-visible {
    outline-offset: 2px;
  }

  :where([uc-wgt-common]) {
    --uc-font-family: system-ui;
    --uc-font-size: 14px;
    --uc-line-height: normal;
    --uc-simple-btn-font-family: system-ui;
    --uc-simple-btn-font-size: 14px;
    --uc-button-size: 32px;
    --uc-preview-size: 32px;
    --uc-padding: 10px;
    --uc-radius: 8px;
    --uc-transition: .2s ease;
    --uc-dialog-width: 430px;
    --uc-dialog-max-width: 920px;
    --uc-dialog-max-height: 675px;
    --uc-simple-btn-padding: 7px 14px;
    --uc-grid-col: 3;
    --uc-grid-preview-image-height: auto;
    --uc-grid-gap: calc(var(--uc-padding) / 2);
    --uc-grid-aspect-ratio: 1 / 1;
    --uc-background: var(--uc-background-light);
    --uc-foreground: var(--uc-foreground-light);
    --uc-primary: var(--uc-primary-light);
    --uc-primary-hover: var(--uc-primary-hover-light);
    --uc-primary-transparent: var(--uc-primary-transparent-light);
    --uc-primary-foreground: var(--uc-primary-foreground-light);
    --uc-secondary: var(--uc-secondary-light);
    --uc-secondary-hover: var(--uc-secondary-hover-light);
    --uc-secondary-foreground: var(--uc-secondary-foreground-light);
    --uc-muted: var(--uc-muted-light);
    --uc-muted-foreground: var(--uc-muted-foreground-light);
    --uc-destructive: var(--uc-destructive-light);
    --uc-destructive-foreground: var(--uc-destructive-foreground-light);
    --uc-border: var(--uc-border-light);
    --uc-dialog-shadow: var(--uc-dialog-shadow-light);
    --uc-simple-btn: var(--uc-simple-btn-light);
    --uc-simple-btn-hover: var(--uc-simple-btn-hover-light);
    --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-light);
  }

  @supports not (color: oklch(0% 0 0)) {
    :where([uc-wgt-common]) {
      --uc-primary-rgb-light: 23 75 215;
      --uc-primary-light: rgb(var(--uc-primary-rgb-light));
      --uc-primary-hover-light: rgb(var(--uc-primary-rgb-light) / 90%);
      --uc-primary-transparent-light: rgb(var(--uc-primary-rgb-light) / 10%);
      --uc-background-light: #fff;
      --uc-foreground-light: #181818;
      --uc-primary-foreground-light: #fff;
      --uc-secondary-light: #1818180d;
      --uc-secondary-hover-light: #18181814;
      --uc-secondary-foreground-light: #181818;
      --uc-muted-light: #f5f5f5;
      --uc-muted-foreground-light: #717171;
      --uc-destructive-light: #e813140d;
      --uc-destructive-foreground-light: #e81314;
      --uc-border-light: #e4e4e8;
      --uc-dialog-shadow-light: 0px 6px 20px #0000001a;
      --uc-simple-btn-light: #ebebeb;
      --uc-simple-btn-hover-light: #e4e4e4;
      --uc-simple-btn-foreground-light: #181818;
      --uc-primary-rgb-dark: 87 154 255;
      --uc-primary-dark: rgb(var(--uc-primary-rgb-dark));
      --uc-primary-hover-dark: rgb(var(--uc-primary-rgb-dark) / 90%);
      --uc-primary-transparent-dark: rgb(var(--uc-primary-rgb-dark) / 7%);
      --uc-background-dark: #1b1b1b;
      --uc-foreground-dark: #e1e1e1;
      --uc-primary-foreground-dark: #000;
      --uc-secondary-dark: #e1e1e112;
      --uc-secondary-hover-dark: #e1e1e11a;
      --uc-secondary-foreground-dark: #e1e1e1;
      --uc-muted-dark: #242424;
      --uc-muted-foreground-dark: #989898;
      --uc-destructive-dark: #f45a4f1a;
      --uc-destructive-foreground-dark: #f45a4f;
      --uc-border-dark: #3d3d3d;
      --uc-dialog-shadow-dark: 0px 6px 20px #00000040;
      --uc-simple-btn-dark: #242424;
      --uc-simple-btn-hover-dark: #2b2b2b;
      --uc-simple-btn-foreground-dark: #fff;
    }
  }

  @supports (color: oklch(0% 0 0)) {
    :where([uc-wgt-common]) {
      --uc-primary-oklch-light: 47% .22 264;
      --uc-primary-light: oklch(var(--uc-primary-oklch-light));
      --uc-primary-hover-light: oklch(var(--uc-primary-oklch-light) / 90%);
      --uc-primary-transparent-light: oklch(var(--uc-primary-oklch-light) / 7%);
      --uc-background-light: oklch(100% 0 0);
      --uc-foreground-light: oklch(21% 0 0);
      --uc-primary-foreground-light: oklch(100% 0 0);
      --uc-secondary-light: oklch(21% 0 0 / .05);
      --uc-secondary-hover-light: oklch(21% 0 0 / .08);
      --uc-secondary-foreground-light: oklch(21% 0 0);
      --uc-muted-light: oklch(97% 0 0);
      --uc-muted-foreground-light: oklch(40% 0 0);
      --uc-destructive-light: oklch(59% .235 28.5 / .05);
      --uc-destructive-foreground-light: oklch(59% .235 28.5);
      --uc-border-light: oklch(92% 0 0);
      --uc-dialog-shadow-light: 0px 6px 20px oklch(0% 0 0 / .1);
      --uc-simple-btn-light: oklch(94% 0 0);
      --uc-simple-btn-hover-light: oklch(92% 0 0);
      --uc-simple-btn-foreground-light: oklch(20% 0 0);
      --uc-primary-oklch-dark: 69% .1768 258.4;
      --uc-primary-dark: oklch(var(--uc-primary-oklch-dark));
      --uc-primary-hover-dark: oklch(var(--uc-primary-oklch-dark) / 90%);
      --uc-primary-transparent-dark: oklch(var(--uc-primary-oklch-dark) / 7%);
      --uc-background-dark: oklch(22% 0 0);
      --uc-foreground-dark: oklch(91% 0 0);
      --uc-primary-foreground-dark: oklch(0% 0 0);
      --uc-secondary-dark: oklch(91% 0 0 / .07);
      --uc-secondary-hover-dark: oklch(91% 0 0 / .1);
      --uc-secondary-foreground-dark: oklch(91% 0 0);
      --uc-muted-dark: oklch(26% 0 0);
      --uc-muted-foreground-dark: oklch(68% 0 0);
      --uc-destructive-dark: oklch(67% .191 27.5 / .1);
      --uc-destructive-foreground-dark: oklch(67% .191 27.5);
      --uc-border-dark: oklch(36% 0 0);
      --uc-dialog-shadow-dark: 0px 6px 20px oklch(0% 0 0 / .25);
      --uc-simple-btn-dark: oklch(26% 0 0);
      --uc-simple-btn-hover-dark: oklch(29% 0 0);
      --uc-simple-btn-foreground-dark: oklch(100% 0 0);
    }
  }

  @media only screen and (height <= 600px) {
    :where([uc-wgt-common]) {
      --uc-dialog-max-height: 100%;
    }
  }

  @media only screen and (width <= 680px) {
    :where([uc-wgt-common]) {
      --uc-grid-col: 2;
    }
  }

  @media only screen and (width <= 430px) {
    :where([uc-wgt-common]) {
      --uc-dialog-max-width: 100vw;
      --uc-dialog-max-height: var(--uploadcare-blocks-window-height);
      --uc-grid-col: 1;
    }
  }

  @media (prefers-color-scheme: light) {
    :where([uc-wgt-common]) {
      --uc-background: var(--uc-background-light);
      --uc-foreground: var(--uc-foreground-light);
      --uc-primary: var(--uc-primary-light);
      --uc-primary-hover: var(--uc-primary-hover-light);
      --uc-primary-transparent: var(--uc-primary-transparent-light);
      --uc-primary-foreground: var(--uc-primary-foreground-light);
      --uc-secondary: var(--uc-secondary-light);
      --uc-secondary-hover: var(--uc-secondary-hover-light);
      --uc-secondary-foreground: var(--uc-secondary-foreground-light);
      --uc-muted: var(--uc-muted-light);
      --uc-muted-foreground: var(--uc-muted-foreground-light);
      --uc-destructive: var(--uc-destructive-light);
      --uc-destructive-foreground: var(--uc-destructive-foreground-light);
      --uc-border: var(--uc-border-light);
      --uc-dialog-shadow: var(--uc-dialog-shadow-light);
      --uc-simple-btn: var(--uc-simple-btn-light);
      --uc-simple-btn-hover: var(--uc-simple-btn-hover-light);
      --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-light);
    }
  }

  @media (prefers-color-scheme: dark) {
    :where([uc-wgt-common]) {
      --uc-background: var(--uc-background-dark);
      --uc-foreground: var(--uc-foreground-dark);
      --uc-primary: var(--uc-primary-dark);
      --uc-primary-hover: var(--uc-primary-hover-dark);
      --uc-primary-transparent: var(--uc-primary-transparent-dark);
      --uc-primary-foreground: var(--uc-primary-foreground-dark);
      --uc-secondary: var(--uc-secondary-dark);
      --uc-secondary-hover: var(--uc-secondary-hover-dark);
      --uc-secondary-foreground: var(--uc-secondary-foreground-dark);
      --uc-muted: var(--uc-muted-dark);
      --uc-muted-foreground: var(--uc-muted-foreground-dark);
      --uc-destructive: var(--uc-destructive-dark);
      --uc-destructive-foreground: var(--uc-destructive-foreground-dark);
      --uc-border: var(--uc-border-dark);
      --uc-dialog-shadow: var(--uc-dialog-shadow-dark);
      --uc-simple-btn: var(--uc-simple-btn-dark);
      --uc-simple-btn-hover: var(--uc-simple-btn-hover-dark);
      --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-dark);
    }
  }

  :where(.uc-light), :where(.uc-light) :where([uc-wgt-common]) {
    --uc-background: var(--uc-background-light);
    --uc-foreground: var(--uc-foreground-light);
    --uc-primary: var(--uc-primary-light);
    --uc-primary-hover: var(--uc-primary-hover-light);
    --uc-primary-transparent: var(--uc-primary-transparent-light);
    --uc-primary-foreground: var(--uc-primary-foreground-light);
    --uc-secondary: var(--uc-secondary-light);
    --uc-secondary-hover: var(--uc-secondary-hover-light);
    --uc-secondary-foreground: var(--uc-secondary-foreground-light);
    --uc-muted: var(--uc-muted-light);
    --uc-muted-foreground: var(--uc-muted-foreground-light);
    --uc-destructive: var(--uc-destructive-light);
    --uc-destructive-foreground: var(--uc-destructive-foreground-light);
    --uc-border: var(--uc-border-light);
    --uc-dialog-shadow: var(--uc-dialog-shadow-light);
    --uc-simple-btn: var(--uc-simple-btn-light);
    --uc-simple-btn-hover: var(--uc-simple-btn-hover-light);
    --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-light);
  }

  :where(.uc-dark), :where(.uc-dark) :where([uc-wgt-common]) {
    --uc-background: var(--uc-background-dark);
    --uc-foreground: var(--uc-foreground-dark);
    --uc-primary: var(--uc-primary-dark);
    --uc-primary-hover: var(--uc-primary-hover-dark);
    --uc-primary-transparent: var(--uc-primary-transparent-dark);
    --uc-primary-foreground: var(--uc-primary-foreground-dark);
    --uc-secondary: var(--uc-secondary-dark);
    --uc-secondary-hover: var(--uc-secondary-hover-dark);
    --uc-secondary-foreground: var(--uc-secondary-foreground-dark);
    --uc-muted: var(--uc-muted-dark);
    --uc-muted-foreground: var(--uc-muted-foreground-dark);
    --uc-destructive: var(--uc-destructive-dark);
    --uc-destructive-foreground: var(--uc-destructive-foreground-dark);
    --uc-border: var(--uc-border-dark);
    --uc-dialog-shadow: var(--uc-dialog-shadow-dark);
    --uc-simple-btn: var(--uc-simple-btn-dark);
    --uc-simple-btn-hover: var(--uc-simple-btn-hover-dark);
    --uc-simple-btn-foreground: var(--uc-simple-btn-foreground-dark);
  }

  :where(.uc-purple) {
    --uc-primary-oklch-light: 47% .22 300;
    --uc-primary-oklch-dark: 69% .1768 300;
  }

  :where(.uc-red) {
    --uc-primary-oklch-light: 47% .21 21;
    --uc-primary-oklch-dark: 71% .1768 21;
  }

  :where(.uc-orange) {
    --uc-primary-oklch-light: 47% .1376 51.88;
    --uc-primary-oklch-dark: 69% .1768 51.88;
  }

  :where(.uc-green) {
    --uc-primary-oklch-light: 45% .14 130;
    --uc-primary-oklch-dark: 69% .1768 130;
  }

  :where(.uc-turquoise) {
    --uc-primary-oklch-light: 45% .0854 174;
    --uc-primary-oklch-dark: 69% .1768 174;
  }

  :where(.uc-gray) {
    --uc-primary-oklch-light: 10% 0 0;
    --uc-primary-oklch-dark: 97% 0 0;
  }

  :where(.uc-contrast) {
    --uc-border-light: oklch(50% 0 0);
    --uc-border-dark: oklch(50% 0 0);
    --uc-muted-light: oklch(98% 0 0);
    --uc-muted-dark: oklch(16% 0 0);
    --uc-muted-foreground-light: oklch(20% 0 0);
    --uc-muted-foreground-dark: oklch(80% 0 0);
    --uc-background-light: oklch(100% 0 0);
    --uc-foreground-light: oklch(0% 0 0);
    --uc-background-dark: oklch(10% 0 0);
    --uc-foreground-dark: oklch(100% 0 0);
  }
}

@layer uc.shared {
  @supports selector(dialog::backdrop) {
    :where([uc-modal]) > dialog::backdrop {
      background-color: #0000001a;
    }

    :where([uc-modal])[strokes] > dialog::backdrop {
      background-image: var(--modal-backdrop-background-image);
    }
  }

  :where([uc-modal]) > dialog[open] {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
  }

  :where([uc-modal]) > dialog:not([open]) {
    visibility: hidden;
    opacity: 0;
    transform: translateY(20px);
  }

  :where([uc-modal]) > dialog {
    width: min(var(--uc-dialog-width),100%);
    max-width: min(calc(100% - var(--uc-padding) * 2),var(--uc-dialog-max-width));
    min-height: var(--uc-button-size);
    max-height: min(calc(100% - var(--uc-padding) * 2),var(--uc-dialog-max-height));
    background-color: var(--uc-background);
    border-radius: calc(var(--uc-radius) * 1.75);
    box-shadow: var(--uc-dialog-shadow);
    border: 0;
    flex-direction: column;
    margin: auto;
    padding: 0;
    transition: transform .4s, opacity .4s;
    display: flex;
    overflow: hidden;
  }

  :where(.uc-contrast) :where([uc-modal]) > dialog {
    outline: 1px solid var(--uc-border);
  }

  uc-progress-bar {
    --visible-opacity: 1;
    --l-progress-value: 0;
    pointer-events: none;
    opacity: 1;
    width: 100%;
    height: 100%;
    transition: opacity .3s;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
  }

  uc-progress-bar.uc-progress-bar--hidden {
    opacity: 0;
  }

  uc-progress-bar .uc-progress {
    width: calc(var(--l-progress-value) * 1%);
    background-color: var(--uc-primary);
    height: 100%;
    opacity: var(--visible-opacity);
    transition: width .6s, opacity .3s;
    position: absolute;
    transform: translate(0);
  }

  uc-progress-bar .uc-progress--hidden {
    opacity: 0;
    transition: opacity .3s;
  }

  uc-progress-bar .uc-fake-progress {
    --l-fake-progress-width: 30;
    width: calc(var(--l-fake-progress-width) * 1%);
    background-color: var(--uc-primary);
    height: 100%;
    opacity: var(--visible-opacity);
    z-index: 1;
    transition: opacity .3s;
    animation: 1s ease-in-out infinite fake-progress-animation;
    position: absolute;
  }

  uc-progress-bar .uc-fake-progress--hidden {
    opacity: 0;
    animation: none;
  }

  @keyframes fake-progress-animation {
    0% {
      transform: translate(-100%);
    }

    to {
      transform: translate(calc(100 / var(--l-fake-progress-width) * 100 * 1%));
    }
  }

  uc-progress-bar-common {
    z-index: 10000;
    background-color: var(--uc-background);
    height: 10px;
    transition: opacity .3s;
    display: block;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
  }

  uc-progress-bar-common:not([active]) {
    opacity: 0;
    pointer-events: none;
  }

  uc-select {
    display: inline-flex;
  }

  uc-select select {
    height: var(--uc-button-size);
    white-space: nowrap;
    border-radius: var(--uc-radius);
    cursor: pointer;
    user-select: none;
    transition: background-color var(--uc-transition);
    color: var(--uc-secondary-foreground);
    background-color: var(--uc-secondary);
    border: none;
    justify-content: center;
    align-items: center;
    padding: 0 14px;
    font-family: inherit;
    font-size: 1em;
    display: inline-flex;
    position: relative;
  }

  @keyframes uc-spinner-keyframes {
    0% {
      transform: rotate(0);
    }

    to {
      transform: rotate(360deg);
    }
  }

  .uc-spinner {
    border: 2px solid #0000;
    border-color: currentColor #0000 #0000 currentColor;
    border-radius: 50%;
    width: 1em;
    height: 1em;
    animation: .4s linear infinite uc-spinner-keyframes;
  }

  uc-thumb {
    width: 100%;
    height: 100%;
  }

  .uc-thumb {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
  }

  .uc-thumb__img {
    object-fit: cover;
    pointer-events: none;
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    inset: 0;
  }

  :is(uc-activity-header, .uc-ui-activity-header) {
    justify-content: space-between;
    gap: var(--uc-padding);
    padding: var(--uc-padding);
    color: var(--uc-foreground);
    font-size: 1em;
    font-weight: 500;
    display: flex;
  }

  :is(uc-activity-header, .uc-ui-activity-header) > * {
    align-items: center;
    display: flex;
  }

  :is(uc-activity-header, .uc-ui-activity-header) > div > uc-icon {
    width: auto;
  }

  :is(uc-activity-header, .uc-ui-activity-header) > div {
    gap: var(--uc-padding);
  }

  :where([uc-wgt-common]) :is(button.uc-primary-btn, button.uc-ui-primary-btn) {
    color: var(--uc-primary-foreground);
    background-color: var(--uc-primary);
  }

  :where([uc-wgt-common]) :is(button.uc-primary-btn, button.uc-ui-primary-btn):hover {
    background-color: var(--uc-primary-hover);
  }

  :where([uc-wgt-common]) :is(button.uc-secondary-btn, button.uc-ui-secondary-btn) {
    color: var(--uc-secondary-foreground);
    background-color: var(--uc-secondary);
  }

  :where([uc-wgt-common]) :is(button.uc-secondary-btn, button.uc-ui-secondary-btn):hover {
    background-color: var(--uc-secondary-hover);
  }

  :where([uc-wgt-common].uc-contrast) :is(button.uc-secondary-btn, button.uc-ui-secondary-btn) {
    border: 1px solid var(--uc-border);
  }

  :where([uc-wgt-common]) :is(button.uc-mini-btn, button.uc-ui-icon-btn) {
    height: var(--uc-button-size);
    color: var(--uc-secondary-foreground);
    background-color: #0000;
    padding: 0;
  }

  :where([uc-wgt-common]) :is(button.uc-mini-btn, button.uc-ui-icon-btn):hover {
    background-color: var(--uc-secondary);
  }

  :where([uc-wgt-common]) :is(button[disabled], button.uc-primary-btn[disabled], button.uc-secondary-btn[disabled], button.uc-ui-primary-btn[disabled], button.uc-ui-secondary-btn[disabled], button.uc-ui-icon-btn[disabled]) {
    opacity: .5;
    pointer-events: none;
  }

  :where([uc-wgt-common]) a {
    color: var(--uc-primary);
    text-decoration: none;
  }

  :where([uc-wgt-common]) a[disabled] {
    pointer-events: none;
  }

  :where([uc-wgt-common]) input[type="text"] {
    width: 100%;
    height: var(--uc-button-size);
    color: var(--uc-foreground);
    background-color: var(--uc-background);
    border: 1px solid var(--uc-border);
    border-radius: var(--uc-radius);
    transition: border-color var(--uc-transition),outline-color var(--uc-transition);
    outline: 1px solid #0000;
    padding-left: 10px;
    padding-right: 10px;
    font-family: inherit;
    font-size: 1em;
    display: flex;
  }

  :where([uc-wgt-common]) input[type="text"]::placeholder {
    color: var(--uc-muted-foreground);
  }

  :where([uc-wgt-common]) input[type="text"]:focus {
    outline-color: var(--uc-primary-hover);
    border-color: var(--uc-primary-hover);
  }

  :where([uc-wgt-common]) input[disabled], :where([uc-wgt-common]) uc-select[disabled], :where([uc-wgt-common]) select[disabled] {
    opacity: .6;
    pointer-events: none;
  }

  :where([uc-wgt-common]) .uc-ui-toolbar {
    padding: var(--uc-padding);
    background-color: var(--uc-background);
    align-items: center;
    gap: 4px;
    display: flex;
  }

  :where([uc-wgt-common]) .uc-ui-toolbar-spacer {
    flex: 1;
  }

  uc-icon {
    width: var(--uc-button-size);
    height: var(--uc-button-size);
    justify-content: center;
    align-items: center;
    display: inline-flex;
  }

  uc-icon svg {
    width: calc(var(--uc-button-size) / 2);
    height: calc(var(--uc-button-size) / 2);
    overflow: visible;
  }
}

@layer uc.components {
  uc-copyright {
    justify-content: center;
    width: 100%;
    display: flex;
  }

  uc-copyright .uc-credits {
    all: unset;
    background-color: var(--uc-background);
    color: var(--uc-muted-foreground);
    opacity: .9;
    cursor: pointer;
    transition: opacity var(--uc-transition),background-color var(--uc-transition);
    border-radius: 6px;
    padding: 2px 5px;
    font-size: 12px;
    font-weight: 400;
    position: absolute;
    bottom: 12px;
  }

  uc-copyright .uc-credits:focus-visible {
    outline: 1px auto highlight;
    outline: 1px auto -webkit-focus-ring-color;
  }

  uc-copyright .uc-credits:hover {
    opacity: 1;
    background-color: var(--uc-muted);
  }

  uc-source-btn > button {
    padding: 2px var(--uc-padding);
    color: var(--uc-foreground);
    border-radius: var(--uc-radius);
    cursor: pointer;
    transition: background-color var(--uc-transition),color var(--uc-transition);
    user-select: none;
    background-color: unset;
    width: 100%;
    height: unset;
    align-items: center;
    margin-bottom: 2px;
    display: flex;
  }

  uc-source-btn:last-child > button {
    margin-bottom: 0;
  }

  uc-source-btn > button:hover {
    background-color: var(--uc-primary-transparent);
  }

  :where(.uc-contrast) uc-source-btn > button:hover {
    background-color: var(--uc-secondary);
    color: var(--uc-foreground);
  }

  uc-source-btn uc-icon {
    min-width: var(--uc-button-size);
    margin-right: var(--uc-padding);
    opacity: .8;
    flex-grow: 1;
    justify-content: center;
    display: inline-flex;
  }

  :where(.uc-contrast) uc-source-btn uc-icon {
    opacity: 1;
  }

  uc-source-btn .uc-txt {
    box-sizing: border-box;
    width: 100%;
    height: var(--uc-button-size);
    white-space: nowrap;
    border: none;
    align-items: center;
    padding: 0;
    display: flex;
  }

  uc-start-from {
    display: block;
    overflow-y: auto;
  }

  uc-start-from .uc-content {
    gap: calc(var(--uc-padding) * 2);
    width: 100%;
    height: 100%;
    padding: calc(var(--uc-padding) * 2);
    background-color: var(--uc-background);
    grid-auto-flow: row;
    display: grid;
  }

  [uc-modal] > dialog:has(uc-start-from[active]) {
    width: var(--uc-dialog-width);
  }

  [uc-modal] uc-start-from uc-drop-area {
    border-radius: var(--uc-radius);
  }

  @media only screen and (width <= 430px) {
    [uc-modal] uc-start-from uc-drop-area {
      display: none;
    }
  }

  uc-upload-list {
    background-color: var(--uc-background);
    width: 100%;
    height: max-content;
    transition: opacity var(--uc-transition);
    flex-direction: column;
    display: flex;
    position: relative;
    overflow: hidden;
  }

  uc-upload-list .uc-no-files {
    height: 32px;
    padding: 20px;
  }

  uc-upload-list .uc-files {
    min-height: 32px;
    padding: 0 var(--uc-padding);
    flex: 1;
    display: block;
    overflow: auto;
  }

  uc-upload-list .uc-files-wrapper {
    display: contents;
  }

  uc-upload-list .uc-toolbar {
    padding: var(--uc-padding);
    background-color: var(--uc-background);
    justify-content: space-between;
    gap: 4px;
    display: flex;
  }

  uc-upload-list .uc-toolbar-spacer {
    flex: 1;
  }

  uc-upload-list uc-drop-area {
    width: calc(100% - var(--uc-padding) * 2);
    height: calc(100% - var(--uc-padding) * 2);
    margin: var(--uc-padding);
    border-radius: var(--uc-radius);
    position: absolute;
    top: 0;
    left: 0;
  }

  uc-upload-list uc-activity-header > .uc-header-text {
    padding: 0 var(--uc-padding);
  }

  uc-upload-list .uc-common-error {
    border-radius: var(--uc-radius);
    color: var(--uc-destructive-foreground);
    background-color: var(--uc-destructive);
    padding: var(--uc-padding);
    margin: 4px var(--uc-padding) 0 var(--uc-padding);
    justify-content: center;
    align-items: center;
    font-size: .925em;
    display: flex;
  }

  uc-upload-list .uc-add-more-btn uc-icon {
    display: none;
  }

  uc-upload-list[mode="grid"] .uc-files {
    gap: var(--uc-grid-gap);
    flex-wrap: wrap;
    display: flex;
  }

  uc-upload-list .uc-files .uc-add-more-btn, uc-upload-list[mode="grid"] uc-file-item {
    flex: 0 0 calc((100% - (var(--uc-grid-gap) * (var(--uc-grid-col) - 1))) / var(--uc-grid-col));
    max-width: calc((100% - (var(--uc-grid-gap) * (var(--uc-grid-col) - 1))) / var(--uc-grid-col));
    height: var(--uc-grid-preview-image-height);
    aspect-ratio: var(--uc-grid-aspect-ratio);
  }

  uc-upload-list .uc-files .uc-add-more-btn {
    display: none;
  }

  uc-file-item {
    --uc-file-item-gap: 4px;
    --uc-file-item-height: calc(var(--uc-preview-size) + var(--uc-padding) * 2 + var(--uc-file-item-gap));
    min-height: var(--uc-file-item-height);
    display: block;
    overflow: hidden;
  }

  uc-file-item:last-of-type {
    --uc-file-item-gap: 0;
  }

  uc-file-item > .uc-inner {
    grid-template-columns: var(--uc-preview-size) 1fr max-content;
    margin-bottom: var(--uc-file-item-gap);
    padding: var(--uc-padding);
    background-color: var(--uc-muted);
    border-radius: var(--uc-radius);
    transition: background-color var(--uc-transition);
    align-items: center;
    gap: 2px;
    font-size: .925em;
    display: grid;
    position: relative;
    overflow: hidden;
  }

  uc-file-item > .uc-inner[data-focused] {
    background-color: #0000;
  }

  uc-file-item > .uc-inner[data-uploading] .uc-edit-btn {
    display: none;
  }

  uc-file-item > :where(.uc-inner[data-failed], .uc-inner[data-limit-overflow]) {
    background-color: var(--uc-destructive);
  }

  uc-file-item .uc-thumb {
    width: var(--uc-preview-size);
    height: var(--uc-preview-size);
    background-color: var(--uc-secondary);
    border-radius: var(--uc-radius);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    display: inline-flex;
    position: relative;
  }

  uc-file-item .uc-file-name-wrapper {
    text-align: left;
    max-width: 100%;
    padding-right: var(--uc-padding);
    padding-left: var(--uc-padding);
    color: var(--uc-muted-foreground);
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    display: flex;
    overflow: hidden;
  }

  uc-file-item .uc-file-name {
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 100%;
    overflow: hidden;
  }

  uc-file-item .uc-file-error {
    color: var(--uc-destructive-foreground);
    z-index: 2;
    font-size: .85em;
    display: none;
  }

  uc-file-item button.uc-remove-btn, uc-file-item button.uc-edit-btn {
    color: var(--uc-muted-foreground);
  }

  uc-file-item button svg {
    pointer-events: none;
  }

  uc-file-item button.uc-upload-btn {
    display: none;
  }

  uc-file-item .uc-badge {
    width: 14px;
    height: 14px;
    color: var(--uc-background);
    background-color: var(--uc-foreground);
    opacity: 0;
    transition: opacity var(--uc-transition),transform var(--uc-transition);
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    display: flex;
    position: absolute;
    bottom: 2px;
    right: 2px;
    transform: scale(.3);
  }

  uc-file-item > .uc-inner:where([data-failed], [data-limit-overflow], [data-finished]) .uc-badge {
    opacity: 1;
    transform: scale(1);
  }

  uc-file-item > .uc-inner:where([data-failed], [data-limit-overflow]) .uc-badge {
    background-color: var(--uc-destructive-foreground);
  }

  uc-file-item > .uc-inner:where([data-failed], [data-limit-overflow]) .uc-file-error {
    display: block;
  }

  uc-file-item .uc-badge uc-icon, uc-file-item .uc-badge uc-icon svg {
    width: 100%;
    height: 100%;
  }

  uc-file-item .uc-progress-bar {
    --visible-opacity: .7;
    height: 2px;
    top: calc(100% - 2px);
  }

  :where(.uc-contrast) uc-file-item .uc-progress-bar {
    --visible-opacity: 1;
  }

  uc-file-item .uc-file-actions {
    justify-content: center;
    align-items: center;
    gap: 2px;
    display: flex;
  }

  uc-file-item[mode="grid"] {
    min-height: initial;
    overflow: visible;
  }

  uc-file-item[mode="grid"] .uc-inner {
    background-color: #0000;
    border-radius: 0;
    grid-template-rows: 1fr max-content;
    grid-template-columns: 1fr;
    height: 100%;
    margin-bottom: 0;
    padding: 0;
  }

  uc-file-item[mode="grid"] .uc-inner[data-failed] .uc-badge {
    display: none;
  }

  uc-file-item[mode="grid"] .uc-thumb {
    width: 100%;
    height: 100%;
  }

  uc-file-item[mode="grid"] .uc-badge {
    right: var(--uc-padding);
    bottom: var(--uc-padding);
  }

  uc-file-item[mode="grid"] .uc-file-name-wrapper {
    padding: 0;
  }

  uc-file-item[mode="grid"] .uc-file-name:not([hidden]) + .uc-file-error {
    bottom: calc(var(--uc-padding) + var(--uc-font-size));
  }

  uc-file-item[mode="grid"] .uc-file-error {
    background-color: var(--uc-destructive-foreground);
    border-radius: var(--uc-radius);
    color: var(--uc-background);
    bottom: var(--uc-padding);
    left: var(--uc-padding);
    right: var(--uc-padding);
    padding: calc(var(--uc-padding) / 2) var(--uc-padding);
    position: absolute;
  }

  uc-file-item[mode="grid"] .uc-file-hint {
    background-color: var(--uc-background);
    border-radius: var(--uc-radius);
    color: var(--uc-foreground);
    bottom: calc(var(--uc-padding) * 2);
    left: var(--uc-padding);
    right: var(--uc-padding);
    padding: calc(var(--uc-padding) / 2) var(--uc-padding);
    position: absolute;
  }

  uc-file-item[mode="grid"] .uc-file-actions {
    top: var(--uc-padding);
    right: var(--uc-padding);
    position: absolute;
  }

  uc-file-item[mode="grid"] button {
    background-color: var(--uc-background);
  }

  uc-file-item[mode="grid"] button:hover {
    background-color: var(--uc-muted);
  }

  uc-file-item[mode="grid"] .uc-progress-bar {
    width: initial;
    height: 4px;
    top: initial;
    bottom: var(--uc-padding);
    left: var(--uc-padding);
    right: var(--uc-padding);
    border-radius: var(--uc-radius);
    z-index: 1;
    background-color: var(--uc-background);
    transition: background-color .3s, opacity .3s;
  }

  uc-file-item[mode="grid"] .uc-progress-bar :is(.uc-fake-progress, .uc-progress) {
    background-color: var(--uc-primary);
  }

  uc-file-item[mode="grid"] .uc-progress-bar[hasfilename] {
    bottom: calc(var(--uc-padding) + var(--uc-font-size));
  }

  :where([uc-drop-area]) {
    border: 1px dashed var(--uc-border);
    border-radius: calc(var(--uc-radius) * 1.75);
    transition: border var(--uc-transition),border-radius var(--uc-transition);
    padding: 2px;
    overflow: hidden;
  }

  :where([uc-drop-area]), :where([uc-drop-area]) .uc-content-wrapper {
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    display: flex;
  }

  :where([uc-drop-area]) .uc-text {
    margin: var(--uc-padding);
    color: var(--uc-muted-foreground);
    transition: color var(--uc-transition);
    position: relative;
  }

  :where([uc-drop-area])[ghost][drag-state="inactive"] {
    display: none;
  }

  :where([uc-drop-area])[ghost]:not([fullscreen]):is([drag-state="active"], [drag-state="near"], [drag-state="over"]) {
    background: var(--uc-background);
  }

  :where([uc-drop-area]):is([drag-state="active"], [drag-state="near"], [drag-state="over"], :hover) {
    background: var(--uc-primary-transparent);
    border-color: var(--uc-primary-transparent);
  }

  :where(.uc-contrast) :where([uc-drop-area]):is([drag-state="active"], [drag-state="near"], [drag-state="over"], :hover) {
    color: var(--uc-foreground);
    border-color: var(--uc-foreground);
    background: none;
    border-style: solid;
    border-width: 2px;
  }

  :where([uc-drop-area]):is([drag-state="active"], [drag-state="near"]) {
    opacity: 1;
  }

  :where([uc-drop-area])[drag-state="over"] {
    border-color: var(--uc-primary);
    opacity: 1;
  }

  :where([uc-drop-area])[with-icon] {
    min-height: 180px;
  }

  :where([uc-drop-area])[with-icon] .uc-content-wrapper {
    flex-direction: column;
    display: flex;
  }

  :where([uc-drop-area])[with-icon] .uc-text {
    color: var(--uc-foreground);
    font-size: 1.1em;
    font-weight: 500;
  }

  :where([uc-drop-area])[with-icon] .uc-icon-container {
    width: 64px;
    height: 64px;
    margin: var(--uc-padding);
    color: var(--uc-foreground);
    background-color: var(--uc-muted);
    transition: color var(--uc-transition),background-color var(--uc-transition);
    border-radius: 50%;
    position: relative;
    overflow: hidden;
  }

  :where([uc-drop-area])[with-icon] uc-icon {
    width: 32px;
    height: 32px;
    transition: transform var(--uc-transition);
    position: absolute;
    top: calc(50% - 16px);
    left: calc(50% - 16px);
  }

  :where([uc-drop-area])[with-icon] uc-icon:last-child {
    transform: translateY(48px);
  }

  :where(.uc-contrast) :where([uc-drop-area])[with-icon]:hover .uc-icon-container, :where(.uc-contrast) :where([uc-drop-area])[with-icon]:hover .uc-text {
    color: var(--uc-foreground);
  }

  :where([uc-drop-area])[with-icon]:hover .uc-icon-container {
    background-color: var(--uc-primary-transparent);
  }

  :where(.uc-contrast) :where([uc-drop-area])[with-icon]:hover .uc-icon-container {
    background-color: var(--uc-muted);
  }

  :where([uc-drop-area])[with-icon] > .uc-content-wrapper:is([drag-state="active"], [drag-state="near"], [drag-state="over"]) .uc-icon-container {
    color: var(--uc-primary-foreground);
    background-color: var(--uc-primary);
  }

  :where([uc-drop-area])[with-icon] > .uc-content-wrapper:is([drag-state="active"], [drag-state="near"], [drag-state="over"]) .uc-text, :where(.uc-contrast) :where([uc-drop-area])[with-icon] > .uc-content-wrapper:is([drag-state="active"], [drag-state="near"], [drag-state="over"]) .uc-text {
    color: var(--uc-foreground);
  }

  :where([uc-drop-area])[with-icon] > .uc-content-wrapper:is([drag-state="active"], [drag-state="near"], [drag-state="over"]) uc-icon:first-child {
    transform: translateY(-48px);
  }

  :where([uc-drop-area])[with-icon] > .uc-content-wrapper:is([drag-state="active"], [drag-state="near"], [drag-state="over"]) uc-icon:last-child {
    transform: translateY(0);
  }

  :where([uc-drop-area])[with-icon] > .uc-content-wrapper[drag-state="near"] uc-icon:last-child {
    transform: scale(1.3);
  }

  :where([uc-drop-area])[with-icon] > .uc-content-wrapper[drag-state="over"] uc-icon:last-child {
    transform: scale(1.5);
  }

  :where([uc-drop-area])[fullscreen] {
    z-index: 2147483647;
    width: calc(100vw - var(--uc-padding) * 2);
    height: calc(100vh - var(--uc-padding) * 2);
    margin: var(--uc-padding);
    justify-content: center;
    align-items: center;
    display: flex;
    position: fixed;
    inset: 0;
  }

  :where([uc-drop-area])[fullscreen] .uc-content-wrapper {
    width: 100%;
    max-width: calc(var(--uc-dialog-width) * .8);
    height: 180px;
    color: var(--uc-foreground);
    background-color: var(--uc-background);
    border-radius: calc(var(--uc-radius) * 1.75);
    box-shadow: var(--uc-dialog-shadow);
    transition: color var(--uc-transition),background-color var(--uc-transition),box-shadow var(--uc-transition),border-radius var(--uc-transition),transform var(--uc-transition);
  }

  :where([uc-drop-area])[with-icon][fullscreen][drag-state="active"] > .uc-content-wrapper, :where([uc-drop-area])[with-icon][fullscreen][drag-state="near"] > .uc-content-wrapper {
    opacity: 0;
    transform: translateY(10px);
  }

  :where([uc-drop-area])[with-icon][fullscreen][drag-state="over"] > .uc-content-wrapper {
    opacity: 1;
    transform: translateY(0);
  }

  :where([uc-drop-area])[with-icon][fullscreen] > .uc-content-wrapper uc-icon:first-child {
    transform: translateY(-48px);
  }

  :where([uc-drop-area])[clickable] {
    cursor: pointer;
  }

  :where([uc-simple-btn]) {
    display: inline-flex;
    position: relative;
  }

  :where([uc-simple-btn]) button {
    height: auto;
    padding: var(--uc-simple-btn-padding);
    background-color: var(--uc-simple-btn);
    color: var(--uc-simple-btn-foreground);
    font-size: var(--uc-simple-btn-font-size);
    font-family: var(--uc-simple-btn-font-family);
    gap: .5em;
  }

  :where([uc-simple-btn]) button uc-icon {
    width: auto;
    height: auto;
  }

  :where([uc-simple-btn]) button uc-icon svg {
    width: .9em;
    height: .9em;
  }

  :where([uc-simple-btn]) button:hover {
    background-color: var(--uc-simple-btn-hover);
  }

  :where([uc-simple-btn]) > uc-drop-area {
    display: contents;
  }

  :where([uc-simple-btn]) .uc-visual-drop-area {
    width: 100%;
    height: 100%;
    padding: var(--uc-simple-btn-padding);
    color: #0000;
    font-size: var(--uc-simple-btn-font-size);
    border: 1px dashed var(--uc-simple-btn-foreground);
    border-radius: inherit;
    opacity: 0;
    transition: opacity var(--uc-transition);
    background-color: #0000;
    justify-content: center;
    align-items: center;
    display: flex;
    position: absolute;
    top: 0;
    left: 0;
  }

  :where([uc-simple-btn]) > uc-drop-area[drag-state="active"] .uc-visual-drop-area {
    opacity: 1;
  }

  :where([uc-simple-btn]) > uc-drop-area[drag-state="inactive"] .uc-visual-drop-area {
    opacity: 0;
  }

  :where([uc-simple-btn]) > uc-drop-area[drag-state="near"] .uc-visual-drop-area, :where([uc-simple-btn]) > uc-drop-area[drag-state="over"] .uc-visual-drop-area {
    opacity: 1;
  }

  uc-plugin-activity-host {
    display: contents;
  }

  uc-cloud-image-editor-activity {
    background-color: var(--uc-background);
    width: 100%;
    height: 100%;
    display: flex;
    position: relative;
    overflow: hidden;
  }

  [uc-modal] > dialog:has([activity="cloud-image-edit"][active]) {
    width: 100%;
    height: 100%;
  }

  uc-url-source {
    background-color: var(--uc-background);
    display: block;
  }

  uc-url-source > .uc-content {
    padding: var(--uc-padding);
    grid-template-columns: 1fr min-content;
    gap: 4px;
    padding-top: 0;
    display: grid;
  }

  uc-url-source .uc-url-input {
    display: flex;
  }

  uc-external-source {
    background-color: var(--uc-background);
    flex-direction: column;
    width: 100%;
    height: 100%;
    display: flex;
    position: relative;
    overflow: hidden;
  }

  [uc-modal] > dialog:has([activity="external"][active]) {
    width: 100%;
    height: 100%;
  }

  uc-external-source > .uc-content {
    flex: 1;
    grid-template-rows: 1fr min-content;
    display: grid;
    position: relative;
  }

  uc-external-source iframe {
    border: none;
    width: 100%;
    height: 100%;
    display: block;
  }

  uc-external-source .uc-iframe-wrapper {
    overflow: hidden;
  }

  uc-external-source .uc-toolbar {
    gap: var(--uc-padding);
    width: 100%;
    padding: var(--uc-padding);
    border-top: 1px solid var(--uc-border);
    justify-content: space-between;
    align-items: center;
    display: flex;
  }

  uc-external-source .uc-back-btn {
    padding-left: 0;
  }

  uc-external-source .uc-selection-status-box {
    color: var(--uc-foreground);
    flex-direction: column;
    justify-content: center;
    align-items: center;
    display: flex;
  }

  uc-external-source .uc-selection-status-box button {
    color: var(--uc-primary);
    background: none;
    height: auto;
    padding: 0;
  }

  uc-external-source .uc-selection-status-box button:hover {
    text-decoration: underline;
  }

  uc-external-source uc-activity-header {
    z-index: 1;
    pointer-events: none;
    justify-content: flex-end;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
  }

  uc-external-source uc-activity-header .uc-close-btn {
    pointer-events: auto;
  }

  uc-external-source .uc-done-btn > span.uc-hidden {
    visibility: hidden;
    pointer-events: none;
  }

  uc-external-source .uc-done-btn > uc-spinner {
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    display: flex;
    position: absolute;
  }

  uc-camera-source {
    background-color: var(--uc-background);
    border-radius: var(--uc-radius);
    flex-direction: column;
    width: 100%;
    height: 100%;
    max-height: 100%;
    display: flex;
    position: relative;
    overflow: hidden;
  }

  [uc-modal] > dialog:has([activity="camera"][active]) {
    width: 100%;
    height: 100%;
  }

  uc-camera-source video {
    object-fit: contain;
    object-position: center center;
    background-color: var(--uc-muted);
    border-radius: var(--uc-radius);
    width: 100%;
    max-height: 100%;
    display: block;
  }

  uc-camera-source .uc-toolbar {
    width: 100%;
    padding: var(--uc-padding);
    background-color: var(--uc-background);
    justify-content: space-between;
    display: flex;
    position: absolute;
    bottom: 0;
  }

  uc-camera-source .uc-content {
    width: 100%;
    height: 100%;
    padding: var(--uc-padding);
    flex: 1;
    justify-content: center;
    padding-top: 0;
    display: flex;
    overflow: hidden;
  }

  uc-camera-source .uc-message-box {
    color: var(--uc-foreground);
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 40px;
    padding: 40px 40px 0;
    display: flex;
  }

  uc-camera-source .uc-message-box button {
    color: var(--uc-primary-foreground);
    background-color: var(--uc-primary);
  }

  uc-camera-source .uc-shot-btn {
    width: 58px;
    height: 58px;
    color: var(--uc-background);
    background-color: var(--uc-primary-light);
    opacity: .85;
    transition: bottom var(--uc-transition),opacity var(--uc-transition),transform var(--uc-transition);
    border-radius: 50%;
  }

  uc-camera-source .uc-shot-btn:hover {
    opacity: 1;
    transform: scale(1.05);
  }

  uc-camera-source .uc-shot-btn:active {
    opacity: 1;
    transform: scale(1);
  }

  uc-camera-source .uc-shot-btn[disabled] {
    bottom: -80px;
  }

  uc-camera-source .uc-shot-btn uc-icon svg {
    width: 20px;
    height: 20px;
  }

  uc-camera-source .uc-controls {
    padding: 0 var(--uc-padding) var(--uc-padding);
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    min-height: 74px;
    display: flex;
    position: relative;
  }

  uc-camera-source:not(.uc-initialized) .uc-controls {
    display: none;
  }

  uc-camera-source .uc-switcher {
    gap: calc(var(--uc-padding) / 2);
    display: flex;
  }

  uc-camera-source .uc-switch.uc-active {
    background-color: var(--uc-secondary);
  }

  uc-camera-source .uc-camera-actions {
    justify-content: center;
    align-items: center;
    gap: 5px;
    display: flex;
  }

  uc-camera-source .uc-stop-record {
    background-color: var(--uc-destructive-foreground-light);
    opacity: 1;
  }

  :where(uc-camera-source.uc-recording) .uc-recording-timer uc-icon {
    display: none;
  }

  :where(uc-camera-source.uc-recording) .uc-recording-timer {
    pointer-events: none;
  }

  uc-camera-source .uc-recording-timer {
    z-index: 1;
    position: relative;
    overflow: hidden;
  }

  :where(uc-camera-source) .uc-recording-timer uc-icon {
    width: 10px;
    height: 10px;
    margin-right: 10px;
  }

  uc-camera-source .uc-recording-timer .uc-line {
    content: "";
    background-color: var(--uc-foreground-light);
    transform-origin: 0;
    height: 2px;
    transition: transform var(--uc-transition);
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    transform: scaleX(0);
  }

  uc-camera-source .uc-btn-microphone {
    z-index: 1;
  }

  uc-camera-source .uc-select {
    display: flex;
  }

  uc-camera-source .uc-audio-select {
    width: 98px;
  }

  uc-camera-source .uc-audio-select select {
    width: 100%;
  }

  uc-camera-source .uc-camera-action {
    inset: 0 var(--uc-padding) var(--uc-padding);
    margin: 0 auto;
    position: absolute;
  }

  uc-config {
    display: none;
  }
}

@layer uc.rules {
  :where([uc-wgt-common]) [hidden], :where([uc-wgt-common]) [activity]:not([active], .active), :where([uc-wgt-common]) dialog:not([open]) [activity] {
    display: none;
  }
}

@layer uc.solutions {
  @media only screen and (width <= 800px) {
    [uc-cloud-image-editor] > .uc-wrapper {
      --l-edit-button-width: 70px;
      --l-toolbar-horizontal-padding: var(--cldtr-gap-min);
    }
  }

  uc-editor-image-cropper.uc-active_from_editor, uc-editor-image-cropper.uc-active_from_viewer {
    opacity: 1;
    transition: transform var(--transition-duration-4) cubic-bezier(.37,0,.63,1) .4s,opacity var(--transition-duration-3);
    pointer-events: auto;
    transform: scale(1) translate(0);
  }

  @media only screen and (width <= 600px) {
    uc-editor-toolbar {
      --l-tab-gap: var(--cldtr-gap-mid-1);
      --l-slider-padding: var(--uc-padding);
      --l-controls-padding: var(--uc-padding);
    }
  }

  @media only screen and (width >= 601px) {
    uc-editor-toolbar {
      --l-tab-gap: var(--cldtr-gap-max);
      --l-slider-padding: var(--uc-padding);
      --l-controls-padding: var(--uc-padding);
    }
  }

  uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar > .uc-controls-row > .uc-tab-toggles > .uc-tab-toggle.uc-tab-toggle--hidden, uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar > .uc-controls-row > .uc-tab-toggles.uc-tab-toggles--hidden {
    display: none;
  }

  uc-btn-ui.uc-secondary-icon > button, uc-btn-ui.uc-tab > button {
    --idle-color-rgb: var(--uc-secondary-foreground);
    --idle-brightness: 1;
    --idle-opacity: 1;
    --idle-background: transparent;
    --hover-color-rgb: var(--uc-secondary-foreground);
    --hover-brightness: 1;
    --hover-opacity: 1;
    --hover-background: var(--uc-secondary);
    --down-color-rgb: var(--uc-secondary-foreground);
    --down-brightness: 1;
    --down-opacity: 1;
    --down-background: var(--uc-secondary);
    --active-color-rgb: var(--uc-secondary-foreground);
    --active-brightness: 1;
    --active-opacity: 1;
    --active-background: transparent;
    width: var(--uc-button-size);
    padding: 0;
  }

  [uc-file-uploader-inline] uc-start-from {
    height: 100%;
    container-type: inline-size;
  }

  [uc-file-uploader-inline] {
    --cfg-done-activity: "start-from";
    --cfg-init-activity: "start-from";
    flex: 1;
  }

  [uc-file-uploader-inline] uc-activity-header:after {
    width: var(--uc-button-size);
    height: var(--uc-button-size);
    content: "";
  }

  [uc-file-uploader-inline] uc-activity-header .uc-close-btn {
    display: none;
  }

  [uc-file-uploader-inline] uc-copyright .uc-credits {
    position: static;
  }

  @container (width >= 500px) {
    [uc-file-uploader-inline] uc-start-from .uc-content {
      grid-template-rows: 1fr max-content;
      grid-template-columns: 1fr max-content;
      height: 100%;
    }

    [uc-file-uploader-inline] uc-start-from uc-copyright {
      grid-column: 2;
    }

    [uc-file-uploader-inline] uc-start-from uc-drop-area {
      grid-row: span 3;
    }

    [uc-file-uploader-inline] uc-start-from:has(uc-copyright[hidden]) uc-drop-area, [uc-file-uploader-inline] uc-start-from:has(.uc-cancel-btn[hidden]) uc-drop-area {
      grid-row: span 2;
    }

    [uc-file-uploader-inline] uc-start-from:has(uc-copyright[hidden]):has(.uc-cancel-btn[hidden]) uc-drop-area {
      grid-row: span 1;
    }
  }

  :where([uc-file-uploader-minimal]) {
    --cfg-init-activity: "start-from";
    --cfg-done-activity: "upload-list";
    display: block;
    position: relative;
  }

  [uc-file-uploader-minimal] > uc-start-from .uc-content {
    background-color: #0000;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 0;
    display: flex;
    overflow: hidden;
  }

  :where([uc-file-uploader-minimal] > uc-start-from uc-drop-area) {
    width: 100%;
    min-height: calc(var(--uc-preview-size) + var(--uc-padding) * 2 + 8px);
    text-align: center;
    background-color: var(--uc-muted);
    border-radius: calc(var(--uc-radius) * 1.75);
    justify-content: center;
    align-items: center;
    padding: 0;
    display: flex;
    position: relative;
  }

  :where(.uc-contrast) :where([uc-file-uploader-minimal] > uc-start-from uc-drop-area) {
    background-color: #0000;
  }

  :where([uc-file-uploader-minimal] > uc-start-from uc-drop-area):before {
    content: "";
    z-index: -1;
    background-color: var(--uc-background);
    width: 100%;
    height: 100%;
    position: absolute;
  }

  :where([uc-file-uploader-minimal]:has([single]) > uc-start-from uc-drop-area) {
    aspect-ratio: var(--uc-grid-aspect-ratio);
  }

  [uc-file-uploader-minimal] uc-upload-list uc-activity-header {
    display: none;
  }

  [uc-file-uploader-minimal] uc-upload-list > .uc-toolbar {
    background-color: #0000;
  }

  [uc-file-uploader-minimal] uc-upload-list {
    width: 100%;
    height: unset;
    background-color: var(--uc-background);
    border: 1px dashed var(--uc-border);
    border-radius: calc(var(--uc-radius) * 1.75);
    padding: 4px;
  }

  [uc-file-uploader-minimal] uc-upload-list .uc-files {
    padding: 0;
  }

  [uc-file-uploader-minimal] uc-upload-list .uc-toolbar {
    padding: 0;
    display: block;
  }

  [uc-file-uploader-minimal] uc-upload-list .uc-toolbar .uc-cancel-btn, [uc-file-uploader-minimal] uc-upload-list .uc-toolbar .uc-upload-btn, [uc-file-uploader-minimal] uc-upload-list .uc-toolbar .uc-done-btn {
    display: none;
  }

  [uc-file-uploader-minimal] uc-upload-list .uc-toolbar .uc-add-more-btn {
    width: 100%;
    height: calc(var(--uc-preview-size) + var(--uc-padding) * 2);
    margin-top: 4px;
  }

  [uc-file-uploader-minimal] uc-upload-list .uc-toolbar .uc-add-more-btn[disabled], [uc-file-uploader-minimal] uc-upload-list .uc-toolbar .uc-add-more-btn > span {
    display: none;
  }

  [uc-file-uploader-minimal] uc-upload-list .uc-toolbar .uc-add-more-btn > uc-icon {
    display: flex;
  }

  [uc-file-uploader-minimal][mode="list"] uc-file-item uc-progress-bar {
    height: 100%;
    top: 0;
  }

  [uc-file-uploader-minimal][mode="list"] uc-file-item uc-progress-bar .uc-progress, [uc-file-uploader-minimal][mode="list"] uc-file-item uc-progress-bar .uc-fake-progress {
    background-color: var(--uc-primary-transparent);
    border-radius: var(--uc-radius);
  }

  [uc-file-uploader-minimal] uc-upload-list uc-drop-area {
    border-radius: calc(var(--uc-radius) * 1.75);
    width: 100%;
    height: 100%;
    margin: 0;
  }

  [uc-file-uploader-minimal] uc-upload-list .uc-common-error {
    margin: 4px 0 0;
  }

  [uc-file-uploader-minimal] uc-copyright .uc-credits {
    position: static;
  }

  [uc-file-uploader-minimal][mode="grid"] uc-upload-list .uc-toolbar .uc-add-more-btn {
    display: none;
  }

  [uc-file-uploader-minimal][mode="grid"] uc-upload-list .uc-files .uc-add-more-btn {
    display: flex;
  }

  [uc-file-uploader-minimal][mode="grid"] uc-upload-list .uc-files .uc-add-more-btn > span {
    display: none;
  }

  [uc-file-uploader-minimal][mode="grid"] uc-upload-list .uc-files .uc-add-more-btn > uc-icon {
    display: flex;
  }

  [uc-cloud-image-editor] {
    --color-primary-accent: var(--uc-primary);
    --color-text-base: var(--uc-foreground);
    --color-text-accent-contrast: var(--uc-background);
    --color-fill-contrast: var(--uc-background);
    --color-modal-backdrop: oklch(0% 0 0 / .1);
    --color-image-background: var(--uc-muted);
    --color-focus-ring: var(--color-primary-accent);
    --color-crop-guides: var(--uc-foreground);
    --font-size-ui: var(--uc-font-size);
    --size-touch-area: var(--uc-button-size);
    --size-panel-heading: calc(var(--uc-button-size) + var(--uc-padding) * 2);
    --size-ui-min-width: 130px;
    --size-line-width: 1px;
    --size-modal-width: 650px;
    --size-icon: calc(var(--uc-button-size) / 2);
    --border-radius-editor: var(--uc-radius);
    --border-radius-thumb: var(--uc-radius);
    --border-radius-ui: var(--uc-radius);
    --border-radius-base: var(--uc-radius);
    --cldtr-gap-min: 5px;
    --cldtr-gap-mid-1: 10px;
    --cldtr-gap-mid-2: 15px;
    --cldtr-gap-max: 20px;
    --transition-duration-2: var(--transition-duration-all, .2s);
    --transition-duration-3: var(--transition-duration-all, .3s);
    --transition-duration-4: var(--transition-duration-all, .4s);
    --transition-duration-5: var(--transition-duration-all, .5s);
    --modal-header-opacity: 1;
    --modal-header-height: var(--size-panel-heading);
    --modal-toolbar-height: var(--size-panel-heading);
    --transparent-pixel: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=");
    width: 100%;
    height: 100%;
    max-height: 100%;
    display: block;
  }

  [uc-cloud-image-editor] :is([can-handle-paste]:hover, [can-handle-paste]:focus) {
    --can-handle-paste: "true";
  }

  [uc-cloud-image-editor] :is([tabindex]:focus-visible, [tabindex]:hover, [with-effects]:focus-visible, [with-effects]:hover) {
    --filter-effect: var(--hover-filter) !important;
    --opacity-effect: var(--hover-opacity) !important;
    --color-effect: var(--hover-color-rgb) !important;
    --background-effect: var(--hover-background) !important;
  }

  [uc-cloud-image-editor] :is([tabindex]:active, [with-effects]:active) {
    --filter-effect: var(--down-filter) !important;
    --opacity-effect: var(--down-opacity) !important;
    --color-effect: var(--down-color-rgb) !important;
    --background-effect: var(--down-background) !important;
  }

  [uc-cloud-image-editor] :is([tabindex][active], [with-effects][active]) {
    --filter-effect: var(--active-filter) !important;
    --opacity-effect: var(--active-opacity) !important;
    --color-effect: var(--active-color-rgb) !important;
    --background-effect: var(--active-background) !important;
  }

  [uc-cloud-image-editor] [hidden-scrollbar]::-webkit-scrollbar {
    display: none;
  }

  [uc-cloud-image-editor] [hidden-scrollbar] {
    -ms-overflow-style: none;
    scrollbar-width: none;
  }

  [uc-cloud-image-editor].uc-editor_ON {
    --modal-header-opacity: 0;
    --modal-header-height: 0px;
    --modal-toolbar-height: calc(var(--size-panel-heading) * 2);
  }

  [uc-cloud-image-editor].uc-editor_OFF {
    --modal-header-opacity: 1;
    --modal-header-height: var(--size-panel-heading);
    --modal-toolbar-height: var(--size-panel-heading);
  }

  [uc-cloud-image-editor] > .uc-wrapper {
    --l-min-img-height: var(--modal-toolbar-height);
    --l-max-img-height: 100%;
    --l-edit-button-width: 120px;
    --l-toolbar-horizontal-padding: var(--cldtr-gap-mid-1);
    grid-template-rows: minmax(var(--l-min-img-height),var(--l-max-img-height)) minmax(var(--modal-toolbar-height),auto);
    height: 100%;
    display: grid;
    position: relative;
    overflow: hidden auto;
  }

  @media only screen and (width <= 800px) {
    [uc-cloud-image-editor] > .uc-wrapper {
      --l-edit-button-width: 70px;
      --l-toolbar-horizontal-padding: var(--cldtr-gap-min);
    }
  }

  [uc-cloud-image-editor] > .uc-wrapper > .uc-viewport {
    justify-content: center;
    align-items: center;
    display: flex;
    overflow: hidden;
  }

  [uc-cloud-image-editor] > .uc-wrapper > .uc-viewport > .uc-image_container > .uc-image {
    --viewer-image-opacity: 1;
    z-index: 10;
    box-sizing: border-box;
    object-fit: scale-down;
    background-color: var(--color-image-background);
    width: 100%;
    height: 100%;
    opacity: var(--viewer-image-opacity);
    user-select: none;
    pointer-events: auto;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    transform: scale(1);
  }

  [uc-cloud-image-editor] > .uc-wrapper > .uc-viewport > .uc-image_container > .uc-image.uc-image_visible_viewer {
    transition: opacity var(--transition-duration-3) ease-in-out,transform var(--transition-duration-4);
  }

  [uc-cloud-image-editor] > .uc-wrapper > .uc-viewport > .uc-image_container > .uc-image.uc-image_hidden_to_cropper {
    --viewer-image-opacity: 0;
    background-image: var(--transparent-pixel);
    transition: transform var(--transition-duration-4),opacity var(--transition-duration-3) steps(1,jump-end);
    pointer-events: none;
    transform: scale(1);
  }

  [uc-cloud-image-editor] > .uc-wrapper > .uc-viewport > .uc-image_container > .uc-image.uc-image_hidden_effects {
    --viewer-image-opacity: 0;
    transition: opacity var(--transition-duration-3) cubic-bezier(.5,0,1,1),transform var(--transition-duration-4);
    pointer-events: none;
    transform: scale(1);
  }

  [uc-cloud-image-editor] > .uc-wrapper > .uc-viewport > .uc-image_container {
    background-color: var(--color-image-background);
    width: 100%;
    height: 100%;
    transition: var(--transition-duration-3);
    display: block;
    position: relative;
  }

  [uc-cloud-image-editor] > .uc-wrapper > .uc-toolbar {
    transition: all .3s;
    position: relative;
  }

  [uc-cloud-image-editor] > .uc-wrapper > .uc-toolbar > .uc-toolbar_content {
    box-sizing: border-box;
    width: 100%;
    height: var(--modal-toolbar-height);
    min-height: var(--size-panel-heading);
    background-color: var(--color-fill-contrast);
    position: absolute;
    bottom: 0;
    left: 0;
  }

  [uc-cloud-image-editor] > .uc-wrapper > .uc-toolbar > .uc-toolbar_content.uc-toolbar_content__viewer {
    height: var(--size-panel-heading);
    padding-right: var(--l-toolbar-horizontal-padding);
    padding-left: var(--l-toolbar-horizontal-padding);
    justify-content: space-between;
    align-items: center;
    display: flex;
  }

  [uc-cloud-image-editor] > .uc-wrapper > .uc-toolbar > .uc-toolbar_content.uc-toolbar_content__editor {
    display: flex;
  }

  [uc-cloud-image-editor] > .uc-wrapper > .uc-viewport > .uc-info_pan {
    user-select: none;
    position: absolute;
  }

  [uc-cloud-image-editor] > .uc-wrapper > .uc-viewport > .uc-file_type_outer {
    z-index: 2;
    user-select: none;
    max-width: 120px;
    display: flex;
    position: absolute;
    transform: translate(-40px);
  }

  [uc-cloud-image-editor] > .uc-wrapper > .uc-viewport > .uc-file_type_outer > .uc-file_type {
    padding: 4px .8em;
  }

  [uc-cloud-image-editor] > .uc-wrapper > .uc-network_problems_splash {
    z-index: 999;
    background-color: var(--color-fill-contrast);
    flex-direction: column;
    width: 100%;
    height: 100%;
    display: flex;
    position: absolute;
  }

  [uc-cloud-image-editor] > .uc-wrapper > .uc-network_problems_splash > .uc-network_problems_content {
    flex-direction: column;
    flex: 1;
    justify-content: center;
    align-items: center;
    display: flex;
  }

  [uc-cloud-image-editor] > .uc-wrapper > .uc-network_problems_splash > .uc-network_problems_content > .uc-network_problems_icon {
    width: 40px;
    height: 40px;
    color: var(--uc-foreground);
    background-color: var(--uc-muted);
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    display: flex;
  }

  [uc-cloud-image-editor] > .uc-wrapper > .uc-network_problems_splash > .uc-network_problems_content > .uc-network_problems_text {
    margin-top: var(--cldtr-gap-max);
    font-size: var(--font-size-ui);
    color: var(--uc-foreground);
  }

  [uc-cloud-image-editor] > .uc-wrapper > .uc-network_problems_splash > .uc-network_problems_footer {
    height: var(--size-panel-heading);
    justify-content: center;
    align-items: center;
    display: flex;
  }

  uc-crop-frame > .uc-svg {
    z-index: 2;
    border-top-left-radius: var(--border-radius-base);
    border-top-right-radius: var(--border-radius-base);
    width: 100%;
    height: 100%;
    opacity: inherit;
    transition: var(--transition-duration-3);
    position: absolute;
    top: 0;
    left: 0;
  }

  uc-crop-frame > .uc-thumb {
    --idle-color-rgb: var(--color-text-base);
    --hover-color-rgb: var(--color-primary-accent);
    --focus-color-rgb: var(--color-primary-accent);
    --down-color-rgb: var(--color-primary-accent);
    --color-effect: var(--idle-color-rgb);
    color: var(--color-effect);
    transition: color var(--transition-duration-3),opacity var(--transition-duration-3);
  }

  uc-crop-frame .uc-thumb--visible {
    opacity: 1;
    pointer-events: auto;
  }

  uc-crop-frame .uc-thumb--hidden {
    opacity: 0;
    pointer-events: none;
  }

  uc-crop-frame .uc-guides {
    transition: var(--transition-duration-3);
  }

  uc-crop-frame .uc-guides--hidden {
    opacity: 0;
  }

  uc-crop-frame .uc-guides--semi-hidden {
    opacity: .2;
  }

  uc-crop-frame .uc-guides--visible {
    opacity: 1;
  }

  uc-editor-button-control, uc-editor-crop-button-control, uc-editor-aspect-ratio-button-control, uc-editor-freeform-button-control, uc-editor-filter-control, uc-editor-operation-control {
    --l-base-min-width: var(--uc-button-size);
    --l-base-height: var(--uc-button-size);
    --opacity-effect: var(--idle-opacity);
    --color-effect: var(--idle-color-rgb);
    --background-effect: var(--idle-background);
    --filter-effect: var(--idle-filter);
    --idle-color-rgb: var(--uc-secondary-foreground);
    --idle-opacity: 1;
    --idle-filter: 1;
    --idle-background: var(--uc-secondary);
    --hover-color-rgb: var(--uc-secondary-foreground);
    --hover-opacity: 1;
    --hover-filter: .8;
    --hover-background: var(--uc-secondary-hover);
    --down-color-rgb: var(--hover-color-rgb);
    --down-opacity: 1;
    --down-filter: .6;
    --down-background: var(--uc-secondary);
    border-radius: var(--uc-radius);
  }

  uc-editor-button-control > button, uc-editor-crop-button-control > button, uc-editor-aspect-ratio-button-control > button, uc-editor-freeform-button-control > button, uc-editor-filter-control > button, uc-editor-operation-control > button {
    all: unset;
    grid-template-columns: var(--l-base-min-width) auto;
    height: var(--l-base-height);
    color: var(--color-effect);
    opacity: var(--opacity-effect);
    cursor: pointer;
    transition: var(--l-width-transition);
    grid-template-rows: 100%;
    align-items: center;
    display: grid;
    position: relative;
  }

  uc-editor-freeform-button-control > button {
    grid-template-columns: auto var(--l-base-min-width);
  }

  uc-editor-freeform-button-control > button > uc-icon {
    margin-left: var(--cldtr-gap-mid-1);
    width: 10px;
  }

  :where(uc-editor-button-control, uc-editor-crop-button-control, uc-editor-aspect-ratio-button-control, uc-editor-freeform-button-control, uc-editor-filter-control, uc-editor-operation-control) > uc-icon > svg {
    width: var(--size-icon);
    height: var(--size-icon);
  }

  uc-editor-filter-control > uc-icon.uc-original-icon > svg {
    width: 100%;
    height: 100%;
  }

  uc-editor-button-control.uc-active, uc-editor-operation-control.uc-active, uc-editor-crop-button-control.uc-active, uc-editor-aspect-ratio-button-control.uc-active, uc-editor-freeform-button-control.uc-active, uc-editor-filter-control.uc-active {
    --idle-color-rgb: var(--uc-primary-foreground);
    --idle-background: var(--uc-primary);
    --idle-opacity: 1;
    --hover-color-rgb: var(--uc-primary-foreground);
    --hover-background: var(--uc-primary);
    --hover-opacity: 1;
  }

  uc-editor-button-control.uc-not_active, uc-editor-operation-control.uc-not_active, uc-editor-crop-button-control.uc-not_active, uc-editor-aspect-ratio-button-control.uc-not_active, uc-editor-freeform-button-control.uc-not_active, uc-editor-filter-control.uc-not_active {
    --idle-color-rgb: var(--uc-secondary-foreground);
  }

  :where(.uc-contrast) uc-editor-button-control.uc-not_active, :where(.uc-contrast) uc-editor-operation-control.uc-not_active, :where(.uc-contrast) uc-editor-crop-button-control.uc-not_active, :where(.uc-contrast) uc-editor-freeform-button-control.uc-not_active, :where(.uc-contrast) uc-editor-aspect-ratio-button-control.uc-not_active, :where(.uc-contrast) uc-editor-filter-control.uc-not_active {
    --idle-background: transparent;
    --hover-background: var(--uc-secondary);
    outline: 1px solid var(--uc-border);
    outline-offset: -1px;
  }

  uc-editor-button-control > button:before, uc-editor-operation-control > button:before, uc-editor-crop-button-control > button:before, uc-editor-freeform-button-control > button:before, uc-editor-aspect-ratio-button-control > button:before, uc-editor-filter-control > button:before {
    content: "";
    z-index: -1;
    background-color: var(--background-effect);
    border-radius: var(--border-radius-editor);
    width: 100%;
    height: 100%;
    transition: var(--transition-duration-3);
    position: absolute;
    left: 0;
    right: 0;
  }

  uc-editor-button-control > button .uc-title, uc-editor-operation-control > button .uc-title, uc-editor-crop-button-control > button .uc-title, uc-editor-aspect-ratio-button-control > button .uc-title, uc-editor-freeform-button-control > button .uc-title, uc-editor-filter-control > button .uc-title {
    padding-right: var(--cldtr-gap-mid-1);
    letter-spacing: 1.004px;
    text-transform: uppercase;
    font-size: .7em;
  }

  uc-editor-freeform-button-control > button .uc-title {
    padding-left: var(--cldtr-gap-mid-1);
    padding-right: 0;
  }

  uc-editor-button-control > button uc-icon, uc-editor-operation-control > button uc-icon, uc-editor-crop-button-control > button uc-icon, uc-editor-aspect-ratio-button-control > button uc-icon, uc-editor-freeform-button-control > button uc-icon, uc-editor-filter-control > button uc-icon {
    pointer-events: none;
  }

  uc-editor-filter-control > button .uc-preview {
    z-index: -1;
    width: 100%;
    height: var(--l-base-height);
    border-radius: var(--border-radius-editor);
    opacity: 0;
    filter: brightness(var(--filter-effect));
    transition: var(--transition-duration-3);
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    left: 0;
    right: 0;
  }

  uc-editor-filter-control.uc-not_active .uc-preview[data-loaded] {
    opacity: 1;
  }

  uc-editor-filter-control.uc-active .uc-preview {
    opacity: 0;
  }

  uc-editor-filter-control > .uc-original-icon {
    color: var(--color-effect);
    opacity: .3;
  }

  uc-editor-image-cropper {
    z-index: 10;
    opacity: 0;
    pointer-events: none;
    touch-action: none;
    width: 100%;
    height: 100%;
    color: var(--color-crop-guides);
    display: block;
    position: absolute;
    top: 0;
    left: 0;
  }

  uc-editor-image-cropper.uc-active_from_editor, uc-editor-image-cropper.uc-active_from_viewer {
    opacity: 1;
    transition: transform var(--transition-duration-4) cubic-bezier(.37,0,.63,1) .4s,opacity var(--transition-duration-3);
    pointer-events: auto;
    transform: scale(1) translate(0);
  }

  uc-editor-image-cropper.uc-inactive_to_editor {
    opacity: 0;
    transition: transform var(--transition-duration-4) cubic-bezier(.37,0,.63,1),opacity var(--transition-duration-3) calc(var(--transition-duration-3) + 50ms);
    pointer-events: none;
  }

  uc-editor-image-cropper > .uc-canvas {
    z-index: 1;
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
  }

  uc-editor-image-fader {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
  }

  uc-editor-image-fader.uc-active_from_viewer {
    z-index: 3;
    opacity: 1;
    transition: transform var(--transition-duration-4),opacity var(--transition-duration-3) steps(1,jump-start);
    pointer-events: auto;
    transform: scale(1);
  }

  uc-editor-image-fader.uc-active_from_cropper {
    z-index: 3;
    opacity: 1;
    transition: transform var(--transition-duration-4),opacity var(--transition-duration-3) steps(1,jump-end);
    pointer-events: auto;
    transform: scale(1);
  }

  uc-editor-image-fader.uc-inactive_to_cropper {
    z-index: 3;
    opacity: 0;
    transition: transform var(--transition-duration-4),opacity var(--transition-duration-3) steps(1,jump-end);
    pointer-events: none;
    transform: scale(1);
  }

  uc-editor-image-fader .uc-fader-image {
    object-fit: scale-down;
    user-select: none;
    content-visibility: auto;
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    transform: scale(1);
  }

  uc-editor-image-fader .uc-fader-image--preview {
    background-color: var(--color-image-background);
    border-top-left-radius: var(--border-radius-base);
    border-top-right-radius: var(--border-radius-base);
    opacity: 0;
    transition: var(--transition-duration-3);
    transform: scale(1);
  }

  uc-editor-scroller {
    align-items: center;
    width: 100%;
    height: 100%;
    display: flex;
    overflow-x: scroll;
  }

  uc-editor-slider {
    width: 100%;
    height: var(--size-panel-heading);
    justify-content: center;
    align-items: center;
    display: flex;
  }

  uc-editor-toolbar {
    width: 100%;
    height: 100%;
    position: relative;
  }

  @media only screen and (width <= 600px) {
    uc-editor-toolbar {
      --l-tab-gap: var(--cldtr-gap-mid-1);
      --l-slider-padding: var(--uc-padding);
      --l-controls-padding: var(--uc-padding);
    }
  }

  @media only screen and (width >= 601px) {
    uc-editor-toolbar {
      --l-tab-gap: var(--cldtr-gap-max);
      --l-slider-padding: var(--uc-padding);
      --l-controls-padding: var(--uc-padding);
    }
  }

  uc-editor-toolbar > .uc-toolbar-container {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
  }

  uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar {
    background-color: var(--color-fill-contrast);
    width: 100%;
    height: 100%;
    transition: opacity var(--transition-duration-3) ease-in-out,transform var(--transition-duration-3) ease-in-out,visibility var(--transition-duration-3) ease-in-out;
    grid-template-rows: 1fr 1fr;
    display: grid;
    position: absolute;
  }

  .uc-sub-toolbar > .uc-list-aspect-ratio-container > .uc-list-aspect-ratio {
    height: var(--size-panel-heading);
    grid-auto-flow: column;
    justify-content: center;
    align-items: center;
    gap: 6px;
    display: grid;
  }

  uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar.uc-sub-toolbar--visible {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
  }

  uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar.uc-sub-toolbar--top-hidden {
    opacity: 0;
    pointer-events: none;
    transform: translateY(100%);
  }

  uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar.uc-sub-toolbar--bottom-hidden {
    opacity: 0;
    pointer-events: none;
    transform: translateY(-100%);
  }

  uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar > .uc-controls-row {
    padding-right: var(--l-controls-padding);
    padding-left: var(--l-controls-padding);
    justify-content: space-between;
    align-items: center;
    display: flex;
  }

  uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar > .uc-controls-row > .uc-tab-toggles {
    gap: 0px var(--l-tab-gap);
    grid-auto-flow: column;
    align-items: center;
    height: 100%;
    display: grid;
    position: relative;
  }

  uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar > .uc-controls-row > .uc-tab-toggles > .uc-tab-toggles_indicator {
    width: var(--size-touch-area);
    background-color: var(--uc-secondary-foreground);
    height: 2px;
    transition: transform var(--transition-duration-3);
    position: absolute;
    bottom: 0;
    left: 0;
    transform: translate(0);
  }

  uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar > .uc-tab-content-row {
    position: relative;
  }

  uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar > .uc-tab-content-row > .uc-tab-content {
    content-visibility: auto;
    width: 100%;
    height: 100%;
    display: flex;
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
  }

  uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar > .uc-controls-row > .uc-tab-toggles > .uc-tab-toggle.uc-tab-toggle--visible {
    display: contents;
  }

  uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar > .uc-controls-row > .uc-tab-toggles > .uc-tab-toggle.uc-tab-toggle--hidden, uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar > .uc-controls-row > .uc-tab-toggles.uc-tab-toggles--hidden {
    display: none;
  }

  uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar > .uc-controls-row > .uc-tab-toggles > .uc-tab-toggle > uc-btn-ui {
    width: var(--uc-button-size);
  }

  uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar > .uc-controls-row > .uc-tab-toggles > .uc-tab-toggle > uc-btn-ui > uc-icon > svg {
    width: var(--size-icon);
    height: var(--size-icon);
  }

  uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar > .uc-tab-content-row > .uc-tab-content .uc-controls-list_align {
    box-sizing: border-box;
    min-width: 100%;
    padding-left: var(--uc-padding);
    grid-template-columns: 1fr auto 1fr;
    grid-template-areas: ". inner .";
    display: grid;
  }

  uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar > .uc-tab-content-row > .uc-tab-content .uc-controls-list_inner {
    grid-area: inner;
    grid-auto-flow: column;
    gap: 6px;
    display: grid;
  }

  uc-editor-toolbar > .uc-toolbar-container > .uc-sub-toolbar > .uc-tab-content-row > .uc-tab-content .uc-controls-list_inner:last-child {
    padding-right: var(--uc-padding);
  }

  uc-editor-toolbar .uc-info-tooltip_container {
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    height: 100%;
    display: flex;
    position: absolute;
  }

  uc-editor-toolbar .uc-info-tooltip_wrapper {
    top: calc(-100% - var(--cldtr-gap-mid-2));
    pointer-events: none;
    flex-direction: column;
    justify-content: flex-end;
    height: 100%;
    display: flex;
    position: absolute;
  }

  uc-editor-toolbar .uc-info-tooltip {
    z-index: 10;
    color: var(--color-text-base);
    letter-spacing: 1px;
    text-transform: uppercase;
    background-color: var(--color-text-accent-contrast);
    border-radius: var(--border-radius-editor);
    opacity: 0;
    transition: var(--transition-duration-3);
    padding: 3px 6px;
    font-size: .7em;
    transform: translateY(100%);
  }

  uc-editor-toolbar .uc-info-tooltip_visible {
    opacity: 1;
    transform: translateY(0);
  }

  uc-editor-toolbar .uc-slider {
    padding-right: var(--l-slider-padding);
    padding-left: var(--l-slider-padding);
  }

  uc-btn-ui > button {
    --filter-effect: var(--idle-brightness);
    --opacity-effect: var(--idle-opacity);
    --color-effect: var(--idle-color-rgb);
    --background-effect: var(--idle-background);
    --l-transition-effect: var(--css-transition, color var(--transition-duration-2), background-color var(--transition-duration-2), filter var(--transition-duration-2));
    all: unset;
    box-sizing: var(--css-box-sizing, border-box);
    height: var(--css-height, var(--uc-button-size));
    padding-right: var(--css-padding-right, 14px);
    padding-left: var(--css-padding-left, 14px);
    color: var(--color-effect);
    background-color: var(--background-effect);
    border-radius: var(--uc-radius);
    opacity: var(--opacity-effect);
    cursor: pointer;
    filter: brightness(var(--filter-effect));
    transition: var(--l-transition-effect);
    user-select: none;
    align-items: center;
    font-size: 1em;
    display: inline-flex;
  }

  uc-btn-ui > button > uc-icon {
    pointer-events: none;
  }

  uc-btn-ui .uc-text {
    white-space: nowrap;
  }

  uc-btn-ui .uc-icon {
    color: var(--color-effect);
    filter: brightness(var(--filter-effect));
    transition: var(--l-transition-effect);
    justify-content: center;
    align-items: center;
    display: flex;
  }

  uc-btn-ui .uc-icon_left {
    margin-right: var(--cldtr-gap-mid-1);
    margin-left: 0;
  }

  uc-btn-ui .uc-icon_right {
    margin-right: 0;
    margin-left: var(--cldtr-gap-mid-1);
  }

  uc-btn-ui .uc-icon_single {
    margin-left: 0;
    margin-right: 0;
  }

  uc-btn-ui .uc-icon_hidden {
    margin: 0;
    display: none;
  }

  uc-btn-ui.uc-primary > button {
    --idle-color-rgb: var(--uc-primary-foreground);
    --idle-brightness: 1;
    --idle-opacity: 1;
    --idle-background: var(--uc-primary);
    --hover-color-rgb: var(--uc-primary-foreground);
    --hover-brightness: 1;
    --hover-opacity: 1;
    --hover-background: var(--uc-primary-hover);
    --down-color-rgb: var(--uc-primary-foreground);
    --down-brightness: .75;
    --down-opacity: 1;
    --down-background: var(--uc-primary);
    --active-color-rgb: var(--uc-primary-foreground);
    --active-brightness: 1;
    --active-opacity: 1;
    --active-background: var(--uc-primary);
  }

  uc-btn-ui.uc-primary-icon > button {
    --idle-color-rgb: var(--uc-primary);
    --idle-brightness: 1;
    --idle-opacity: 1;
    --idle-background: transparent;
    --hover-color-rgb: var(--uc-primary);
    --hover-brightness: 1;
    --hover-opacity: 1;
    --hover-background: var(--uc-primary-transparent);
    --down-color-rgb: var(--uc-primary);
    --down-brightness: .75;
    --down-opacity: 1;
    --down-background: var(--uc-primary-transparent);
    --active-color-rgb: var(--uc-primary-foreground);
    --active-brightness: 1;
    --active-opacity: 1;
    --active-background: var(--uc-primary);
    width: var(--uc-button-size);
    padding: 0;
  }

  uc-btn-ui.uc-secondary > button {
    --idle-color-rgb: var(--uc-secondary-foreground);
    --idle-brightness: 1;
    --idle-opacity: 1;
    --idle-background: var(--uc-secondary);
    --hover-color-rgb: var(--uc-secondary-foreground);
    --hover-brightness: 1;
    --hover-opacity: 1;
    --hover-background: var(--uc-secondary-hover);
    --down-color-rgb: var(--uc-secondary-foreground);
    --down-brightness: 1;
    --down-opacity: 1;
    --down-background: var(--uc-secondary-hover);
    --active-color-rgb: var(--uc-secondary-foreground);
    --active-brightness: 1;
    --active-opacity: 1;
    --active-background: transparent;
  }

  :where(.uc-contrast) uc-btn-ui.uc-secondary > button {
    border: 1px solid var(--uc-border);
  }

  uc-btn-ui.uc-secondary-icon > button, uc-btn-ui.uc-tab > button {
    --idle-color-rgb: var(--uc-secondary-foreground);
    --idle-brightness: 1;
    --idle-opacity: 1;
    --idle-background: transparent;
    --hover-color-rgb: var(--uc-secondary-foreground);
    --hover-brightness: 1;
    --hover-opacity: 1;
    --hover-background: var(--uc-secondary);
    --down-color-rgb: var(--uc-secondary-foreground);
    --down-brightness: 1;
    --down-opacity: 1;
    --down-background: var(--uc-secondary);
    --active-color-rgb: var(--uc-secondary-foreground);
    --active-brightness: 1;
    --active-opacity: 1;
    --active-background: transparent;
    width: var(--uc-button-size);
    padding: 0;
  }

  uc-btn-ui.uc-default > button {
    --idle-color-rgb: var(--uc-secondary-foreground);
    --idle-brightness: 1;
    --idle-opacity: 1;
    --idle-background: var(--uc-secondary);
    --hover-color-rgb: var(--uc-secondary-foreground);
    --hover-brightness: 1;
    --hover-opacity: 1;
    --hover-background: var(--uc-secondary-hover);
    --down-color-rgb: var(--uc-secondary-foreground);
    --down-brightness: .75;
    --down-opacity: 1;
    --down-background: var(--uc-secondary);
    --active-color-rgb: var(--uc-primary);
    --active-brightness: 1;
    --active-opacity: 1;
    --active-background: var(--uc-primary-transparent);
  }

  :where(.uc-contrast) uc-btn-ui.uc-default > button {
    --idle-background: transparent;
    --hover-background: var(--uc-secondary);
    --active-background: var(--uc-foreground);
    --active-color-rgb: var(--uc-background);
  }

  uc-line-loader-ui {
    z-index: 9999;
    opacity: .5;
    width: 100%;
    height: 2px;
    position: absolute;
    top: 0;
    left: 0;
  }

  uc-line-loader-ui .uc-inner {
    width: 25%;
    max-width: 200px;
    height: 100%;
  }

  uc-line-loader-ui .uc-line {
    background-color: var(--uc-primary);
    width: 100%;
    height: 100%;
    transition: transform 1s;
    transform: translate(-101%);
  }

  uc-slider-ui {
    --l-thumb-size: 24px;
    --l-zero-dot-size: 5px;
    --l-zero-dot-offset: 2px;
    --idle-color-rgb: var(--uc-foreground);
    --hover-color-rgb: var(--uc-primary);
    --down-color-rgb: var(--uc-primary);
    --color-effect: var(--idle-color-rgb);
    --l-color: var(--color-effect);
    width: 100%;
    height: calc(var(--l-thumb-size) + (var(--l-zero-dot-size) + var(--l-zero-dot-offset)) * 2);
    justify-content: center;
    align-items: center;
    display: flex;
    position: relative;
  }

  uc-slider-ui .uc-thumb {
    width: var(--l-thumb-size);
    height: var(--l-thumb-size);
    background-color: var(--l-color);
    opacity: 1;
    transition: opacity var(--transition-duration-2),background-color var(--transition-duration-2);
    border-radius: 50%;
    position: absolute;
    left: 0;
    transform: translate(0);
  }

  uc-slider-ui .uc-steps {
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    padding-right: calc(var(--l-thumb-size) / 2);
    padding-left: calc(var(--l-thumb-size) / 2);
    justify-content: space-between;
    align-items: center;
    display: flex;
    position: absolute;
  }

  uc-slider-ui .uc-border-step {
    border-right: 1px solid var(--uc-foreground);
    opacity: 1;
    width: 0;
    height: 10px;
    transition: border-color var(--transition-duration-2);
  }

  uc-slider-ui .uc-minor-step {
    border-right: 1px solid var(--uc-foreground);
    opacity: .6;
    width: 0;
    height: 4px;
    transition: border-color var(--transition-duration-2);
  }

  uc-slider-ui .uc-zero-dot {
    top: calc(100% - var(--l-zero-dot-offset) * 2);
    left: calc(var(--l-thumb-size) / 2 - var(--l-zero-dot-size) / 2);
    width: var(--l-zero-dot-size);
    height: var(--l-zero-dot-size);
    background-color: var(--color-primary-accent);
    opacity: 0;
    transition: var(--transition-duration-3);
    border-radius: 50%;
    position: absolute;
  }

  uc-slider-ui .uc-input {
    cursor: pointer;
    opacity: 0;
    width: calc(100% - 10px);
    height: 100%;
    margin: 0;
    position: absolute;
  }

  uc-presence-toggle.uc-transition {
    transition: opacity var(--transition-duration-3),visibility var(--transition-duration-3);
  }

  uc-presence-toggle.uc-visible {
    opacity: 1;
    pointer-events: inherit;
  }

  uc-presence-toggle.uc-hidden {
    opacity: 0;
    pointer-events: none;
  }

  uc-presence-toggle.uc-initial {
    transition: none !important;
    display: none !important;
  }

  [uc-cloud-image-editor] [role="button"]:focus-visible, [uc-cloud-image-editor] button:focus-visible {
    outline: 1px auto highlight;
    outline: 1px auto -webkit-focus-ring-color;
  }

  [uc-cloud-image-editor] .uc-cloud-mask {
    pointer-events: none;
  }

  [uc-aspect-ratio-freeform] button {
    display: flex;
  }

  [uc-aspect-ratio-freeform] uc-icon {
    display: none;
  }

  [uc-aspect-ratio-freeform] .uc-title {
    padding-left: var(--cldtr-gap-mid-1);
  }

  :where(uc-editor-freeform-button-control, uc-editor-aspect-ratio-button-control:last-of-type) {
    margin-right: calc(3 * var(--cldtr-gap-mid-1));
  }

  :where([uc-cloud-image-editor]) uc-icon {
    justify-content: center;
    width: 100%;
    height: 100%;
    display: flex;
  }

  :where([uc-cloud-image-editor]) uc-icon svg {
    width: calc(var(--uc-button-size) / 2);
    height: calc(var(--uc-button-size) / 2);
  }
}

@layer uc.post-reset {
  :where([uc-wgt-common]) uc-source-btn[type] {
    all: unset;
  }
}

:root, :host {
  --ck-image-processing-highlight-color: #f9fafa;
  --ck-image-processing-background-color: #e3e5e8;
}

.ck.ck-editor__editable {
  & .image, & .image-inline {
    &.image-processing picture {
      width: 100%;
      height: 100%;
      display: block;
      position: relative;

      &:before {
        content: "";
        z-index: 1;
        background: linear-gradient(90deg,
					var(--ck-image-processing-background-color),
					var(--ck-image-processing-highlight-color),
					var(--ck-image-processing-background-color));
        background-size: 200% 100%;
        width: 100%;
        height: 100%;
        animation: 2s linear infinite ck-image-processing-animation;
        position: absolute;
        top: 0;
        left: 0;
      }

      & img {
        height: 100%;
      }
    }

    &.image-processing-blur {
      clip-path: inset(0);
      filter: blur(1.6rem);
    }
  }
}

@keyframes ck-image-processing-animation {
  0% {
    background-position: 200% 0;
  }

  100% {
    background-position: -200% 0;
  }
}

.ck-uploadcare-theme {
  --uc-font-size: 13px;
  --uc-radius: 2px;
  --uc-padding: calc(.6em * 1.5);
  --uc-primary-oklch-light: 54.45% .182 263.76;
  --uc-foreground-light: #333;
  --uc-secondary-foreground-light: #333;
  --uc-muted-foreground-light: #333;
  --uc-border-light: #ccced1;
}

:root, :host {
  --ck-uploadcare-form-view-width: 700px;
  --ck-uploadcare-external-source-view-height: 350px;
  --ck-uploadcare-color-image-background: oklch(97% 0 0);
  --ck-uploadcare-color-icon-error: #db3700;
  --ck-uploadcare-color-skeleton: #fafafa;
}

.ck .ck-uploadcare-form {
  max-width: 100%;
  width: var(--ck-uploadcare-form-view-width);

  & .ck-uploadcare-form__loading {
    & .ck-uploadcare-form__loading-spinner {
      width: 100%;
      height: var(--ck-uploadcare-external-source-view-height);
      background-color: var(--ck-uploadcare-color-image-background);
      flex-direction: column;
      justify-content: center;
      align-items: center;
      display: flex;

      & .ck-spinner-container {
        margin-bottom: 10px;
      }
    }
  }

  & .ck-uploadcare-form__error {
    & .ck-uploadcare-form__error-contents {
      width: 100%;
      height: var(--ck-uploadcare-external-source-view-height);
      background-color: var(--ck-uploadcare-color-image-background);
      flex-direction: column;
      justify-content: center;
      align-items: center;
      gap: 5px;
      display: flex;

      & h3 {
        margin: 0;
        padding: 0;
        font-weight: 700;
      }

      & .ck-icon {
        color: var(--ck-uploadcare-color-icon-error);
      }

      & .ck-button {
        margin-top: 10px;
      }
    }
  }

  & .ck-uploadcare-form__skeleton {
    width: 100%;
    height: 115px;

    & div {
      box-sizing: border-box;
      flex-direction: row;
      justify-content: center;
      align-items: center;
      min-width: 100%;
      height: 50%;
      display: flex;

      & span {
        background-color: var(--ck-uploadcare-color-skeleton);
        width: 32px;
        height: 32px;
        display: block;
      }
    }

    & div + div {
      gap: 20px;

      & span:first-child {
        width: 80px;
        position: absolute;
        left: 8px;
      }

      & span:last-child {
        width: 80px;
        position: absolute;
        right: 8px;
      }
    }

    & div:first-child {
      gap: 4px;
    }
  }

  & .mini-btn {
    display: none;
  }

  & .uc-viewport {
    height: var(--ck-uploadcare-external-source-view-height);
  }

  & uc-btn-ui button, & .uc-primary-btn, & .uc-secondary-btn {
    padding: var(--ck-spacing-control-padding-block-compact) var(--ck-spacing-control-padding-inline);
    min-width: var(--ck-ui-component-min-height, var(--ck-size-min-height));
    min-height: var(--ck-ui-component-min-height, var(--ck-size-min-height));
  }

  & .uc-primary-btn, & uc-btn-ui.uc-primary button {
    background: var(--ck-color-button-action-background, var(--ck-button-action-background-color));

    &:not(.ck-disabled) {
      &:hover {
        background: var(--ck-color-button-action-hover-background, var(--ck-button-action-hover-background-color));
      }

      &:active {
        background: var(--ck-color-button-action-active-background, var(--ck-button-action-active-background-color));
      }
    }

    &.ck-disabled {
      background: var(--ck-color-button-action-disabled-background, var(--ck-button-action-disabled-background-color));
    }
  }

  & .uc-secondary-btn, & uc-btn-ui.uc-secondary button {
    background: var(--ck-color-button-default-background, var(--ck-button-default-background-color));

    &:not(.ck-disabled) {
      &:hover {
        background: var(--ck-color-button-default-hover-background, var(--ck-button-default-hover-background-color));
      }

      &:active {
        background: var(--ck-color-button-default-active-background, var(--ck-button-default-active-background-color));
      }
    }

    &.ck-disabled {
      background: var(--ck-color-button-default-disabled-background, var(--ck-button-default-disabled-background-color));
    }
  }

  & uc-upload-list {
    & .uc-toolbar {
      gap: var(--ck-spacing-gap-comfortable);
    }

    & .uc-files {
      padding-top: var(--ck-spacing-large, var(--ck-spacing-lg));
      max-height: var(--ck-uploadcare-external-source-view-height);
      overflow-y: auto;
    }
  }

  & .uc-content {
    padding: var(--ck-spacing-large, var(--ck-spacing-lg));
    gap: var(--ck-spacing-gap-comfortable);

    & > .uc-iframe-wrapper {
      height: var(--ck-uploadcare-external-source-view-height);
    }

    & > .uc-toolbar {
      padding: var(--ck-spacing-large, var(--ck-spacing-lg)) 0 0;
    }
  }

  & uc-start-from {
    & .uc-content {
      border-radius: 0 0 var(--ck-dialog-border-radius) var(--ck-dialog-border-radius);
      gap: 0;
    }
  }

  & uc-file-item {
    & > .uc-inner {
      font-size: 1em;
    }

    & > .uc-inner:where([data-finished]) .uc-badge {
      background: var(--ck-color-button-action-active-background, var(--ck-button-action-active-background-color)) !important;
    }
  }

  & uc-external-source .uc-cancel-btn {
    visibility: hidden;
    pointer-events: none;
  }

  & uc-activity-header, & uc-source-list {
    display: none;
  }

  & uc-cloud-image-editor {
    & [icon="closeMax"] .uc-icon_left {
      transform: rotate(90deg);
    }
  }
}