/**
 * IMPORTANT!
 * We maintain a dark mode sync of this file in cmdevtools.darkmode.css.
 * This file is generated by a script. If you update this file, please use the following script to update the dark mode version:
 * node scripts/dark_mode/generate_dark_theme_sheet.js
 */

.CodeMirror {
  line-height: 1.2em !important;
  background-color: transparent !important;
  color: #222; /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
  height: 300px;
}

.CodeMirror-linewidget {
  overflow: visible !important;
}

.CodeMirror-gutter-performance {
  width: 60px;
  background-color: var(--color-background);
  margin-left: 3px;
}

.CodeMirror-gutter-memory {
  width: 48px;
  background-color: var(--color-background);
  margin-left: 3px;
}

.CodeMirror-gutter-coverage {
  width: 5px;
  background-color: var(--color-background);
  margin-left: 3px;
}

.CodeMirror .source-frame-eval-expression {
  outline: 0;
  border: 1px solid rgb(163 41 34); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
  border-left-width: 0;
  border-right-width: 0;
  background-color: rgb(255 255 194); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
}

.CodeMirror .source-frame-eval-expression-start {
  border-left-width: 1px;
  margin-left: -1px;
}

.CodeMirror .source-frame-eval-expression-end {
  border-right-width: 1px;
  margin-right: -1px;
}

.CodeMirror .source-frame-continue-to-location {
  outline: 0;
  border: 1px solid transparent;
  border-left-width: 0;
  border-right-width: 0;
  background-color: rgb(230 236 255); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
  cursor: pointer;
}

.CodeMirror .source-frame-continue-to-location:hover {
  border: 1px solid rgb(121 141 254); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
  background-color: rgb(171 191 254); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
}

.-theme-with-dark-background .CodeMirror .source-frame-continue-to-location,
:host-context(.-theme-with-dark-background) .CodeMirror .source-frame-continue-to-location {
  background-color: #14522b;
}

.-theme-with-dark-background .CodeMirror .source-frame-continue-to-location:hover,
:host-context(.-theme-with-dark-background) .CodeMirror .source-frame-continue-to-location:hover {
  border: 1px solid #33cc6b;
  background-color: #14522b;
}

.CodeMirror .source-frame-continue-to-location-start {
  border-left-width: 1px;
  margin-left: -1px;
}

.CodeMirror .source-frame-continue-to-location-end {
  border-right-width: 1px;
  margin-right: -1px;
}

.CodeMirror .source-frame-async-step-in {
  outline: 0;
  background-color: hsl(100deg 46% 80% / 100%); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
  cursor: pointer;
  border: 1px solid transparent;
  border-left-width: 0;
  border-right-width: 0;
}

.source-frame-async-step-in-hovered .source-frame-async-step-in {
  background-color: hsl(96deg 53% 65%); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
  border-color: rgb(100 154 100);
}

.source-frame-async-step-in-hovered .source-frame-async-step-in-start {
  border-left-width: 1px;
  margin-left: -1px;
}

.source-frame-async-step-in-hovered .source-frame-async-step-in-end {
  border-right-width: 1px;
  margin-right: -1px;
}

.CodeMirror-cursor {
  border-left: 1px solid #000; /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
  border-right: none;
  width: 0;
}

.CodeMirror-readonly .CodeMirror-cursor {
  display: none;
}

.CodeMirror-gutters {
  border-right: 1px solid var(--divider-color);
  white-space: nowrap;
  background-color: var(--color-background);
}

.CodeMirror-linenumber {
  color: hsl(0deg 0% 46%); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
  padding: 0 3px 0 9px;
  min-width: 28px;
  text-align: right;
  white-space: nowrap;
}

.pretty-printed .CodeMirror-linenumber {
  color: var(--accent-color);
}

.cm-non-breakable-line .CodeMirror-linenumber {
  color: rgb(128 128 128 / 40%); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
}

.cm-highlight {
  animation: fadeout 2s 0s;
}

.-theme-with-dark-background .cm-highlight,
:host-context(.-theme-with-dark-background) .cm-highlight {
  animation: fadeout-dark 2s 0s;
}

@keyframes fadeout {
  from {
    background-color: rgb(255 255 120); /* stylelint-disable-line plugin/use_theme_colors */ /* See: crbug.com/1152736 for color variable migration. */
  }
  to { background-color: var(--color-background); }
}

@keyframes fadeout-dark {
  from {
    background-color: hsl(133deg 100% 30% / 50%); /* stylelint-disable-line plugin/use_theme_colors */ /* See: crbug.com/1152736 for color variable migration. */
  }
  to { background-color: transparent; }
}

.cm-readonly-highlight {
  background-color: rgb(255 255 120); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
}

.-theme-with-dark-background .cm-readonly-highlight,
:host-context(.-theme-with-dark-background) .cm-readonly-highlight {
  background-color: hsl(133deg 100% 30% / 50%);
}

.cm-highlight.cm-execution-line {
  animation: fadeout-execution-line 1s 0s;
}

.-theme-with-dark-background .cm-highlight.cm-execution-line,
:host-context(.-theme-with-dark-background) .cm-highlight.cm-execution-line {
  animation: fadeout-execution-line-dark 1s 0s;
}

@keyframes fadeout-execution-line {
  from {
    background-color: rgb(121 141 254); /* stylelint-disable-line plugin/use_theme_colors */ /* See: crbug.com/1152736 for color variable migration. */
  }

  to {
    background-color: rgb(171 191 254); /* stylelint-disable-line plugin/use_theme_colors */ /* See: crbug.com/1152736 for color variable migration. */
  }
}

@keyframes fadeout-execution-line-dark {
  from {
    background-color: #208043; /* stylelint-disable-line plugin/use_theme_colors */ /* See: crbug.com/1152736 for color variable migration. */
  }

  to {
    background-color: #14522b; /* stylelint-disable-line plugin/use_theme_colors */ /* See: crbug.com/1152736 for color variable migration. */
  }
}

.CodeMirror-linenumber:hover,
.cm-breakpoint .CodeMirror-gutter-wrapper .CodeMirror-linenumber,
.-theme-preserve {
  border-width: 1px 4px 1px 1px;
  padding-right: 3px;
  padding-left: 8px;
  height: 11px;
  line-height: 12px;
  border-style: solid;
  position: relative;
  /* The line number jumps slightly on hover when the minify banner is showing
     if this fractional value is not there. */
  top: -0.15px;
}
/* stylelint-disable no-descending-specificity */

.CodeMirror-linenumber:hover {
  -webkit-border-image: url('data:image/svg+xml,<svg height="11" width="26" xmlns="http://www.w3.org/2000/svg"><path d="M22.8.5l2.7 5-2.7 5H.5V.5z" fill="%23ebeced" stroke="%23ebeced"/></svg>') 1 3 1 1;
  padding-left: 8px;
}

.-theme-with-dark-background .CodeMirror-linenumber:hover,
:host-context(.-theme-with-dark-background) .CodeMirror-linenumber:hover {
  -webkit-border-image: url('data:image/svg+xml,<svg height="11" width="26" xmlns="http://www.w3.org/2000/svg"><path d="M22.8.5l2.7 5-2.7 5H.5V.5z" fill="%233c4043" stroke="%233c4043"/></svg>') 1 3 1 1;
}

.cm-breakpoint .CodeMirror-gutter-wrapper .CodeMirror-linenumber,
.-theme-preserve {
  color: #fff; /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
  -webkit-border-image: url('data:image/svg+xml,<svg height="11" width="26" xmlns="http://www.w3.org/2000/svg"><path d="M22.8.5l2.7 5-2.7 5H.5V.5z" fill="%234285f4" stroke="%231a73e8"/></svg>') 1 3 1 1;
}

.cm-breakpoint-disabled .CodeMirror-gutter-wrapper .CodeMirror-linenumber,
.breakpoints-deactivated .cm-breakpoint .CodeMirror-gutter-wrapper .CodeMirror-linenumber {
  color: #1a73e8; /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
  -webkit-border-image: url('data:image/svg+xml,<svg height="11" width="26" xmlns="http://www.w3.org/2000/svg"><path d="M22.8.5l2.7 5-2.7 5H.5V.5z" fill="%23d9e7fd" stroke="%231a73e8"/></svg>') 1 3 1 1;
}

.-theme-with-dark-background .cm-breakpoint-disabled .CodeMirror-gutter-wrapper .CodeMirror-linenumber,
.-theme-with-dark-background .breakpoints-deactivated .cm-breakpoint .CodeMirror-gutter-wrapper .CodeMirror-linenumber,
:host-context(.-theme-with-dark-background) .cm-breakpoint-disabled .CodeMirror-gutter-wrapper .CodeMirror-linenumber,
:host-context(.-theme-with-dark-background) .breakpoints-deactivated .cm-breakpoint .CodeMirror-gutter-wrapper .CodeMirror-linenumber {
  color: #1a73e8;
  -webkit-border-image: url('data:image/svg+xml,<svg height="11" width="26" xmlns="http://www.w3.org/2000/svg"><path d="M22.8.5l2.7 5-2.7 5H.5V.5z" fill="%232a384e" stroke="%231a73e8"/></svg>') 1 3 1 1;
}

.cm-breakpoint-conditional .CodeMirror-gutter-wrapper .CodeMirror-linenumber,
.-theme-preserve {
  -webkit-border-image: url('data:image/svg+xml,<svg height="11" width="26" xmlns="http://www.w3.org/2000/svg"><path d="M22.8.5l2.7 5-2.7 5H.5V.5z" fill="%23f29900" stroke="%23e37400"/></svg>') 1 3 1 1;
}

.cm-breakpoint-disabled.cm-breakpoint-conditional .CodeMirror-gutter-wrapper .CodeMirror-linenumber,
.breakpoints-deactivated .cm-breakpoint-conditional .CodeMirror-gutter-wrapper .CodeMirror-linenumber {
  color: #e37400; /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
  -webkit-border-image: url('data:image/svg+xml,<svg height="11" width="26" xmlns="http://www.w3.org/2000/svg"><path d="M22.8.5l2.7 5-2.7 5H.5V.5z" fill="%23fcebcc" stroke="%23e37400"/></svg>') 1 3 1 1;
}

.-theme-with-dark-background .cm-breakpoint-disabled.cm-breakpoint-conditional .CodeMirror-gutter-wrapper .CodeMirror-linenumber,
.-theme-with-dark-background .breakpoints-deactivated .cm-breakpoint-conditional .CodeMirror-gutter-wrapper .CodeMirror-linenumber,
:host-context(.-theme-with-dark-background) .cm-breakpoint-disabled.cm-breakpoint-conditional .CodeMirror-gutter-wrapper .CodeMirror-linenumber,
:host-context(.-theme-with-dark-background) .breakpoints-deactivated .cm-breakpoint-conditional .CodeMirror-gutter-wrapper .CodeMirror-linenumber {
  color: #e37400;
  -webkit-border-image: url('data:image/svg+xml,<svg height="11" width="26" xmlns="http://www.w3.org/2000/svg"><path d="M22.8.5l2.7 5-2.7 5H.5V.5z" fill="%234d3c1d" stroke="%23e37400"/></svg>') 1 3 1 1;
}

.cm-breakpoint-logpoint .CodeMirror-gutter-wrapper .CodeMirror-linenumber,
.-theme-preserve {
  -webkit-border-image: url('data:image/svg+xml,<svg height="11" width="26" xmlns="http://www.w3.org/2000/svg"><path d="M22.8.5l2.7 5-2.7 5H.5V.5z" fill="%23f439a0" stroke="%23d01884"/></svg>') 1 3 1 1;
}

.cm-breakpoint-disabled.cm-breakpoint-logpoint .CodeMirror-gutter-wrapper .CodeMirror-linenumber,
.breakpoints-deactivated .cm-breakpoint-logpoint .CodeMirror-gutter-wrapper .CodeMirror-linenumber {
  color: #d01884; /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
  -webkit-border-image: url('data:image/svg+xml,<svg height="11" width="26" xmlns="http://www.w3.org/2000/svg"><path d="M22.8.5l2.7 5-2.7 5H.5V.5z" fill="%23fdd7ec" stroke="%23f439a0"/></svg>') 1 3 1 1;
}

.-theme-with-dark-background .cm-breakpoint-disabled.cm-breakpoint-logpoint .CodeMirror-gutter-wrapper .CodeMirror-linenumber,
.-theme-with-dark-background .breakpoints-deactivated .cm-breakpoint-logpoint .CodeMirror-gutter-wrapper .CodeMirror-linenumber,
:host-context(.-theme-with-dark-background) .cm-breakpoint-disabled.cm-breakpoint-logpoint .CodeMirror-gutter-wrapper .CodeMirror-linenumber,
:host-context(.-theme-with-dark-background) .breakpoints-deactivated .cm-breakpoint-logpoint .CodeMirror-gutter-wrapper .CodeMirror-linenumber {
  color: #d01884;
  -webkit-border-image: url('data:image/svg+xml,<svg height="11" width="26" xmlns="http://www.w3.org/2000/svg"><path d="M22.8.5l2.7 5-2.7 5H.5V.5z" fill="%234e283d" stroke="%23f439a0"/></svg>') 1 3 1 1;
}
/* stylelint-enable no-descending-specificity */

.cm-breakpoint-conditional .CodeMirror-gutter-wrapper .CodeMirror-linenumber::before,
.-theme-preserve {
  content: "?";
  position: absolute;
  top: 0;
  left: 1px;
}

.cm-breakpoint-logpoint .CodeMirror-gutter-wrapper .CodeMirror-linenumber::before,
.-theme-preserve {
  content: "‥";
  position: absolute;
  top: -3px;
  left: 1px;
}

.cm-inline-breakpoint {
  cursor: pointer;
  position: relative;
  top: 1px;
  content: url('data:image/svg+xml,<svg width="11" height="12" viewBox="0 0 11 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.5 0.5H5.80139C6.29382 0.5 6.7549 0.741701 7.03503 1.14669L10.392 6L7.03503 10.8533C6.7549 11.2583 6.29382 11.5 5.80139 11.5H0.5V0.5Z" fill="%234285F4" stroke="%231A73E8"/></svg>');
  height: 10px;
}

.cm-inline-breakpoint.cm-inline-disabled,
.breakpoints-deactivated .cm-inline-breakpoint {
  content: url('data:image/svg+xml,<svg width="11" height="12" viewBox="0 0 11 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.5 0.5H5.80139C6.29382 0.5 6.7549 0.741701 7.03503 1.14669L10.392 6L7.03503 10.8533C6.7549 11.2583 6.29382 11.5 5.80139 11.5H0.5V0.5Z" fill="%234285F4" fill-opacity="0.2" stroke="%231A73E8"/></svg>');
}

.cm-inline-breakpoint.cm-inline-breakpoint-conditional {
  content: url('data:image/svg+xml,<svg width="11" height="12" viewBox="0 0 11 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.5 0.5H5.80139C6.29382 0.5 6.75489 0.741701 7.03503 1.14669L10.392 6L7.03503 10.8533C6.75489 11.2583 6.29382 11.5 5.80138 11.5H0.5V0.5Z" fill="%23F29900" stroke="%23E37400"/><path d="M3.51074 7.75635H4.68408V9H3.51074V7.75635ZM4.68408 7.23779H3.51074V6.56104C3.51074 6.271 3.55615 6.02344 3.64697 5.81836C3.73779 5.61328 3.90039 5.39648 4.13477 5.16797L4.53027 4.77686C4.71484 4.59814 4.83936 4.4502 4.90381 4.33301C4.97119 4.21582 5.00488 4.09424 5.00488 3.96826C5.00488 3.77197 4.9375 3.62402 4.80273 3.52441C4.66797 3.4248 4.46582 3.375 4.19629 3.375C3.9502 3.375 3.69238 3.42773 3.42285 3.5332C3.15625 3.63574 2.88232 3.78955 2.60107 3.99463V2.81689C2.88818 2.65283 3.17822 2.52979 3.47119 2.44775C3.76709 2.36279 4.06299 2.32031 4.35889 2.32031C4.95068 2.32031 5.41504 2.45801 5.75195 2.7334C6.08887 3.00879 6.25732 3.38818 6.25732 3.87158C6.25732 4.09424 6.20752 4.30225 6.10791 4.49561C6.0083 4.68604 5.8208 4.91602 5.54541 5.18555L5.15869 5.56348C4.95947 5.75684 4.83203 5.91504 4.77637 6.03809C4.7207 6.16113 4.69287 6.31201 4.69287 6.49072C4.69287 6.51709 4.69141 6.54785 4.68848 6.58301C4.68848 6.61816 4.68701 6.65625 4.68408 6.69727V7.23779Z" fill="white"/></svg>');
}

.cm-inline-breakpoint.cm-inline-breakpoint-conditional.cm-inline-disabled,
.breakpoints-deactivated .cm-inline-breakpoint.cm-inline-breakpoint-conditional {
  content: url('data:image/svg+xml,<svg width="11" height="12" viewBox="0 0 11 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.5 0.5H5.80139C6.29382 0.5 6.75489 0.741701 7.03503 1.14669L10.392 6L7.03503 10.8533C6.75489 11.2583 6.29382 11.5 5.80138 11.5H0.5V0.5Z" fill="%23F9AB00" fill-opacity="0.2" stroke="%23E37400"/><path d="M3.51074 7.75635H4.68408V9H3.51074V7.75635ZM4.68408 7.23779H3.51074V6.56104C3.51074 6.271 3.55615 6.02344 3.64697 5.81836C3.73779 5.61328 3.90039 5.39648 4.13477 5.16797L4.53027 4.77686C4.71484 4.59814 4.83936 4.4502 4.90381 4.33301C4.97119 4.21582 5.00488 4.09424 5.00488 3.96826C5.00488 3.77197 4.9375 3.62402 4.80273 3.52441C4.66797 3.4248 4.46582 3.375 4.19629 3.375C3.9502 3.375 3.69238 3.42773 3.42285 3.5332C3.15625 3.63574 2.88232 3.78955 2.60107 3.99463V2.81689C2.88818 2.65283 3.17822 2.52979 3.47119 2.44775C3.76709 2.36279 4.06299 2.32031 4.35889 2.32031C4.95068 2.32031 5.41504 2.45801 5.75195 2.7334C6.08887 3.00879 6.25732 3.38818 6.25732 3.87158C6.25732 4.09424 6.20752 4.30225 6.10791 4.49561C6.0083 4.68604 5.8208 4.91602 5.54541 5.18555L5.15869 5.56348C4.95947 5.75684 4.83203 5.91504 4.77637 6.03809C4.7207 6.16113 4.69287 6.31201 4.69287 6.49072C4.69287 6.51709 4.69141 6.54785 4.68848 6.58301C4.68848 6.61816 4.68701 6.65625 4.68408 6.69727V7.23779Z" fill="%23E37400"/></svg>');
}

.cm-inline-breakpoint.cm-inline-logpoint {
  content: url('data:image/svg+xml,<svg width="11" height="12" viewBox="0 0 11 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.5 0.5H5.80139C6.29382 0.5 6.7549 0.741701 7.03503 1.14669L10.392 6L7.03503 10.8533C6.7549 11.2583 6.29382 11.5 5.80139 11.5H0.5V0.5Z" fill="%23F439A0" stroke="%23D01884"/><circle cx="3" cy="6" r="1" fill="white"/><circle cx="7" cy="6" r="1" fill="white"/></svg>');
}

.cm-inline-breakpoint.cm-inline-logpoint.cm-inline-disabled,
.breakpoints-deactivated .cm-inline-breakpoint.cm-inline-logpoint {
  content: url('data:image/svg+xml,<svg width="11" height="12" viewBox="0 0 11 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.5 0.5H5.80139C6.29382 0.5 6.7549 0.741701 7.03503 1.14669L10.392 6L7.03503 10.8533C6.7549 11.2583 6.29382 11.5 5.80139 11.5H0.5V0.5Z" fill="%23F439A0" fill-opacity="0.2" stroke="%23D01884"/><circle cx="3" cy="6" r="1" fill="%23D01884"/><circle cx="7" cy="6" r="1" fill="%23D01884"/></svg>');
}

.cm-execution-line-tail + .CodeMirror-widget {
  background-color: #abbffe; /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
}

.source-frame-eval-expression + .CodeMirror-widget {
  border: 1px solid rgb(163 41 34); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
  border-left-width: 0;
  border-right-width: 0;
  background-color: rgb(255 255 194); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
}

.cm-inline-breakpoint.cm-execution-line-tail {
  background-color: #698cfe; /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
}

.cm-execution-line-tail .cm-inline-breakpoint {
  background-color: var(--color-background);
}

.cm-inline-breakpoint.cm-inline-conditional {
  background-color: #ef9d0d; /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
}

.cm-continue-to-location {
  cursor: pointer;
  opacity: 80%;
  position: relative;
  top: 2px;
}

.cm-continue-to-location:hover {
  opacity: 100%;
}

div.CodeMirror:focus-within span.CodeMirror-matchingbracket {
  background-color: rgb(0 0 0 / 7.000000000000001%); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
  border-bottom: 1px solid rgb(0 0 0 / 50%); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
}

div.CodeMirror:focus-within span.CodeMirror-nonmatchingbracket {
  background-color: rgb(255 0 0 / 7.000000000000001%); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
  border-bottom: 1px solid rgb(255 0 0 / 50%); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
}

.-theme-with-dark-background div.CodeMirror:focus-within span.CodeMirror-matchingbracket,
:host-context(.-theme-with-dark-background) div.CodeMirror:focus-within span.CodeMirror-matchingbracket {
  border-bottom: 1px solid rgb(217 217 217);
  background-color: initial;
}

.-theme-with-dark-background div.CodeMirror:focus-within span.CodeMirror-nonmatchingbracket,
:host-context(.-theme-with-dark-background) div.CodeMirror:focus-within span.CodeMirror-nonmatchingbracket {
  border-bottom: 1px solid rgb(255 26 26);
  background-color: initial;
}

.cm-whitespace::before {
  position: absolute;
  pointer-events: none;
  color: rgb(175 175 175); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
}

.cm-tab {
  display: inline-block;
  text-decoration: inherit;
  position: relative;
}

.cm-tab::before {
  display: none;
  content: ".";
  color: transparent;
  border-bottom: 1px solid rgb(175 175 175); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
  position: absolute;
  width: 90%;
  bottom: 50%;
  left: 5%;
}

.show-whitespaces .CodeMirror .cm-tab::before {
  display: block !important;
}

.cm-execution-line {
  background-color: rgb(0 59 255 / 10%); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
}

.cm-execution-line-outline {
  outline: 1px solid rgb(64 115 244);
}

.cm-execution-line-tail {
  background-color: rgb(171 191 254); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
}

.-theme-with-dark-background .cm-execution-line,
:host-context(.-theme-with-dark-background) .cm-execution-line {
  background-color: #14522b;
}

.-theme-with-dark-background .cm-execution-line-outline,
:host-context(.-theme-with-dark-background) .cm-execution-line-outline {
  outline: 1px solid #33cc6b;
}

.-theme-with-dark-background .cm-execution-line-tail,
:host-context(.-theme-with-dark-background) .cm-execution-line-tail {
  background-color: #347132;
}

.cm-token-highlight {
  position: relative;
}

.cm-token-highlight::before {
  position: absolute;
  border: 1px solid #808080; /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
  border-radius: 3px;
  top: 0;
  bottom: -1px;
  left: 0;
  right: 0;
  content: "";
}

.cm-line-with-selection .cm-column-with-selection::before {
  border: none;
}

.cm-search-highlight {
  position: relative;
}

.cm-search-highlight::before {
  position: absolute;
  border-top-style: solid;
  border-bottom-style: solid;
  border-top-color: #808080; /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
  border-bottom-color: #808080; /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
  border-top-width: 1px;
  border-bottom-width: 1px;
  top: -1px;
  bottom: 0;
  left: 0;
  right: 0;
  content: "";
}

.cm-search-highlight-full::before {
  border: 1px solid #808080; /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
  border-radius: 3px;
}

.cm-search-highlight-start::before {
  border-left-width: 1px;
  border-top-left-radius: 2px;
  border-bottom-left-radius: 2px;
  border-left-style: solid;
  border-left-color: #808080; /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
}

.cm-search-highlight-end::before {
  border-right-width: 1px;
  border-top-right-radius: 2px;
  border-bottom-right-radius: 2px;
  border-right-style: solid;
  border-right-color: #808080; /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
}

.cm-line-with-selection .cm-column-with-selection.cm-search-highlight-full::before {
  border-radius: 1px;
}

.cm-line-with-selection .cm-column-with-selection.cm-search-highlight-start::before {
  border-top-left-radius: 1px;
  border-bottom-left-radius: 1px;
}

.cm-line-with-selection .cm-column-with-selection.cm-search-highlight-end::before {
  border-top-right-radius: 1px;
  border-bottom-right-radius: 1px;
}

.cm-line-with-selection .cm-column-with-selection.cm-search-highlight::before {
  margin: -1px -1px -1px -1px;
  background-color: rgb(241 234 0); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
  z-index: -1;
}

.-theme-with-dark-background .cm-line-with-selection .cm-column-with-selection.cm-search-highlight::before,
:host-context(.-theme-with-dark-background) .cm-line-with-selection .cm-column-with-selection.cm-search-highlight::before {
  background-color: hsl(133deg 100% 30%);
}

.-theme-with-dark-background .cm-line-with-selection .cm-search-highlight,
:host-context(.-theme-with-dark-background) .cm-line-with-selection .cm-search-highlight {
  color: #eee;
}

.CodeMirror .text-editor-line-marker-text {
  text-align: right;
  padding-right: 3px;
  height: 12px;
}

.CodeMirror .text-editor-line-marker-text span.line-marker-units {
  color: #555; /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
  font-size: 75%;
  margin-left: 3px;
}

.CodeMirror .text-editor-coverage-unused-marker {
  text-align: right;
  padding-right: 2px;
  background-color: #ee442f; /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
}

.CodeMirror .text-editor-coverage-unused-marker::after {
  content: "\200B";
}

.CodeMirror .text-editor-coverage-used-marker {
  text-align: right;
  padding-right: 2px;
  background-color: #63acbe; /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
}

.CodeMirror .text-editor-coverage-used-marker::after {
  content: "\200B";
}

.CodeMirror .text-editor-line-decoration {
  position: absolute;
}

.CodeMirror .text-editor-line-decoration-wave {
  position: absolute;
  top: -2px;
  right: -4px;
  left: 4px;
  cursor: pointer;
  height: 4px;
  background-image: url(Images/errorWave.svg);
  background-repeat: repeat-x;
  background-size: contain;
}

.CodeMirror .text-editor-value-decoration {
  position: absolute;
  bottom: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 1000px;
  opacity: 80%;
  background-color: #ffe3c7; /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
  margin-left: 10px;
  padding-left: 5px;
  color: #222; /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
  user-select: text;
}

.CodeMirror .cm-execution-line .text-editor-value-decoration {
  background-color: transparent;
  opacity: 50%;
}

.CodeMirror .text-editor-line-decoration-icon {
  position: absolute;
  cursor: pointer;
  left: calc(100% + 4px);
  white-space: nowrap;
  top: -9px;
}

.CodeMirror .text-editor-line-decoration-icon > * {
  margin-right: 2px;
}

.CodeMirror .text-editor-line-decoration-icon-issue {
  cursor: pointer;
}

.CodeMirror .text-editor-line-with-warning:not(.cm-execution-line):not(.cm-readonly-highlight) {
  background-color: rgb(241 230 0 / 10%); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
}

.CodeMirror .text-editor-line-with-error:not(.cm-execution-line):not(.cm-readonly-highlight) {
  background-color: rgb(255 0 0 / 5%); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
}
/** @see crbug.com/358161 */

.CodeMirror .CodeMirror-vscrollbar,
.CodeMirror .CodeMirror-hscrollbar {
  transform: translateZ(0);
}

.cm-trailing-whitespace {
  background-color: rgb(255 0 0 / 5%); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
}

.CodeMirror-activeline .cm-trailing-whitespace {
  background-color: transparent;
}

.CodeMirror .CodeMirror-selected {
  background-color: var(--item-selection-inactive-bg-color);
}

.CodeMirror-focused .CodeMirror-selected {
  background-color: var(--item-selection-bg-color);
}

.-theme-with-dark-background .CodeMirror .CodeMirror-selected,
:host-context(.-theme-with-dark-background) .CodeMirror .CodeMirror-selected {
  background-color: #454545;
}

.-theme-with-dark-background span.CodeMirror-selectedtext,
:host-context(.-theme-with-dark-background) span.CodeMirror-selectedtext {
  background: #000;
}

.CodeMirror .auto-complete-text {
  color: rgb(128 128 128); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
}

.CodeMirror .placeholder-text {
  height: 0;
  color: rgb(128 128 128); /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
}
/** Prevent the codemirror textarea from stealing PageUp events **/

.CodeMirror textarea {
  resize: none;
  overflow: hidden;
}

.CodeMirror-lines {
  padding: 4px 0; /* Vertical padding around content */
}

.CodeMirror pre {
  padding: 0 4px; /* Horizontal padding of content */
}

.CodeMirror-scrollbar-filler,
.CodeMirror-gutter-filler {
  background-color: transparent; /* The little square between H and V scrollbars */
}
/* Shown when moving in bi-directional text */

.CodeMirror div.CodeMirror-secondarycursor {
  border-left: 1px solid #c0c0c0; /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
}

.CodeMirror-composing {
  border-bottom: 2px solid;
}

.CodeMirror-foldmarker {
  cursor: pointer;
  font-size: 0;
  line-height: 0;
  height: 0;
}

.CodeMirror-foldmarker::before {
  content: '\2026';
  font-size: 13px;
  color: #666; /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
}

.CodeMirror-foldgutter {
  width: 1.5em;
}

.CodeMirror-gutters:hover .CodeMirror-foldgutter {
  background-color: transparent;
}

.CodeMirror-foldgutter-open,
.CodeMirror-foldgutter-folded {
  cursor: pointer;
  position: relative;
}

.CodeMirror-foldgutter-open {
  transition: opacity 0.2s;
  opacity: 0%;
}

.CodeMirror-gutter-hovered .CodeMirror-foldgutter-open {
  opacity: 100%;
}

.CodeMirror-foldgutter-open::before,
.CodeMirror-foldgutter-folded::before {
  background-color: #727272; /* stylelint-disable-line plugin/use_theme_colors */
  /* See: crbug.com/1152736 for color variable migration. */
  user-select: none;
  -webkit-mask-image: url(Images/treeoutlineTriangles.svg);
  -webkit-mask-size: 32px 24px;
  content: "";
  display: block;
  width: 8px;
  color: transparent;
  text-shadow: none;
  height: 12px;
  position: absolute;
  right: 4px;
}

.CodeMirror-foldgutter-open::before {
  -webkit-mask-position: -16px 0;
}

.CodeMirror-foldgutter-folded::before {
  -webkit-mask-position: 0 0;
}

.CodeMirror .CodeMirror-line::selection,
.CodeMirror .CodeMirror-line > span::selection,
.CodeMirror .CodeMirror-line > span > span::selection {
  background: var(--item-selection-bg-color);
}

@media (forced-colors: active) {
  .cm-token-highlight::before {
    forced-color-adjust: none;
    border-color: Highlight;
  }
}