@yuebai008/cli
Version:
Command line interface for rapid qg-minigame development
1 lines • 28.8 kB
JavaScript
const styles=new CSSStyleSheet;styles.replaceSync('/*\n * Copyright 2015 The Chromium Authors. All rights reserved.\n * Use of this source code is governed by a BSD-style license that can be\n * found in the LICENSE file.\n */\n\n* {\n box-sizing: border-box;\n /* This is required for correct sizing of flex items because we rely\n * on an old version of the flexbox spec. */\n\n min-width: 0;\n min-height: 0;\n}\n\n:root {\n height: 100%;\n overflow: hidden;\n /**\n * NOTE: please don\'t add to these colours!\n * We are migrating to a new set of theme colors (see below for details) and over time these colors will be deprecated / removed.\n * Chat to jacktfranklin@ or petermueller@ if you have questions.\n * https://crbug.com/1122511\n */\n --legacy-accent-color: #1a73e8;\n --legacy-accent-fg-color: #1a73e8;\n --legacy-accent-color-hover: #3b86e8;\n --legacy-accent-fg-color-hover: #1567d3;\n --legacy-active-control-bg-color: #5a5a5a;\n --legacy-focus-bg-color: hsl(214deg 40% 92%);\n --legacy-focus-ring-inactive-shadow-color: #e0e0e0;\n --legacy-input-validation-error: #db1600;\n --legacy-toolbar-hover-bg-color: #eaeaea;\n --legacy-selection-fg-color: #fff;\n --legacy-selection-bg-color: var(--legacy-accent-color);\n --legacy-selection-inactive-fg-color: #5a5a5a;\n --legacy-selection-inactive-bg-color: #dadada;\n --legacy-divider-border: 1px solid var(--color-details-hairline);\n --legacy-focus-ring-inactive-shadow: 0 0 0 1px var(--legacy-focus-ring-inactive-shadow-color);\n --legacy-focus-ring-active-shadow: 0 0 0 1px var(--legacy-accent-color);\n --legacy-item-selection-bg-color: #cfe8fc;\n --legacy-item-selection-inactive-bg-color: #e0e0e0;\n --item-hover-color: rgb(56 121 217 / 10%);\n --monospace-font-size: 10px;\n --monospace-font-family: monospace;\n --source-code-font-size: 11px;\n --source-code-font-family: monospace;\n}\n\n.-theme-with-dark-background {\n /**\n * Inherit the native form control colors when using a dark theme.\n * Override them using CSS variables if needed.\n */\n color-scheme: dark;\n /**\n * NOTE: please don\'t add to these colours!\n * We are migrating to a new set of theme colors (see below for details) and over time these colors will be deprecated / removed.\n * Chat to jacktfranklin@ or petermueller@ if you have questions.\n * https://crbug.com/1122511\n */\n --legacy-accent-color: #0e639c;\n --legacy-accent-fg-color: #ccc;\n --legacy-accent-fg-color-hover: #fff;\n --legacy-accent-color-hover: rgb(17 119 187);\n --legacy-active-control-bg-color: #cdcdcd;\n --legacy-focus-bg-color: hsl(214deg 19% 27%);\n --legacy-focus-ring-inactive-shadow-color: #5a5a5a;\n --legacy-toolbar-hover-bg-color: #202020;\n --legacy-selection-fg-color: #cdcdcd;\n --legacy-selection-inactive-fg-color: #cdcdcd;\n --legacy-selection-inactive-bg-color: hsl(0deg 0% 28%);\n --legacy-focus-ring-inactive-shadow: 0 0 0 1px var(--legacy-focus-ring-inactive-shadow-color);\n --legacy-item-selection-bg-color: hsl(207deg 88% 22%);\n --legacy-item-selection-inactive-bg-color: #454545;\n}\n\nbody {\n height: 100%;\n width: 100%;\n position: relative;\n overflow: hidden;\n margin: 0;\n cursor: default;\n font-family: ".SFNSDisplay-Regular", "Helvetica Neue", "Lucida Grande", sans-serif;\n font-size: 12px;\n tab-size: 4;\n user-select: none;\n color: var(--color-text-primary);\n background: var(--sys-color-cdt-base-container);\n}\n\n/* Default fonts */\n.platform-linux {\n font-family: Roboto, Ubuntu, Arial, sans-serif;\n}\n\n.platform-mac {\n font-family: ".SFNSDisplay-Regular", "Helvetica Neue", "Lucida Grande", sans-serif;\n}\n\n.platform-mac,\n.platform-linux {\n --override-text-color: rgb(48 57 66);\n\n color: var(--override-text-color);\n}\n\n.platform-windows {\n font-family: "Segoe UI", Tahoma, sans-serif;\n}\n\n:focus {\n outline-width: 0;\n}\n\n/* Monospace font per platform configuration */\n.platform-mac,\n:host-context(.platform-mac) {\n --monospace-font-size: 11px;\n --monospace-font-family: menlo, monospace;\n --source-code-font-size: 11px;\n --source-code-font-family: menlo, monospace;\n}\n\n.platform-windows,\n:host-context(.platform-windows) {\n --monospace-font-size: 12px;\n --monospace-font-family: consolas, lucida console, courier new, monospace;\n --source-code-font-size: 12px;\n --source-code-font-family: consolas, lucida console, courier new, monospace;\n}\n\n.platform-linux,\n:host-context(.platform-linux) {\n --monospace-font-size: 11px;\n --monospace-font-family: dejavu sans mono, monospace;\n --source-code-font-size: 11px;\n --source-code-font-family: dejavu sans mono, monospace;\n}\n\n.-theme-with-dark-background .platform-linux,\n.-theme-with-dark-background .platform-mac,\n:host-context(.-theme-with-dark-background) .platform-linux,\n:host-context(.-theme-with-dark-background) .platform-mac {\n --override-text-color: rgb(189 198 207);\n}\n\n.monospace {\n font-family: var(--monospace-font-family);\n font-size: var(--monospace-font-size) !important; /* stylelint-disable-line declaration-no-important */\n}\n\n.source-code {\n font-family: var(--source-code-font-family);\n font-size: var(--source-code-font-size) !important; /* stylelint-disable-line declaration-no-important */\n white-space: pre-wrap;\n}\n\nimg {\n -webkit-user-drag: none;\n}\n\niframe,\na img {\n border: none;\n}\n\n.fill {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n}\n\niframe.fill {\n width: 100%;\n height: 100%;\n}\n\n.widget {\n position: relative;\n flex: auto;\n contain: style;\n}\n\n.hbox {\n display: flex;\n flex-direction: row !important; /* stylelint-disable-line declaration-no-important */\n position: relative;\n}\n\n.vbox {\n display: flex;\n flex-direction: column !important; /* stylelint-disable-line declaration-no-important */\n position: relative;\n}\n\n.view-container > .toolbar {\n border-bottom: 1px solid var(--sys-color-divider);\n}\n\n.flex-auto {\n flex: auto;\n}\n\n.flex-none {\n flex: none;\n}\n\n.flex-centered {\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.overflow-auto {\n overflow: auto;\n background-color: var(--sys-color-cdt-base-container);\n}\n\niframe.widget {\n position: absolute;\n width: 100%;\n height: 100%;\n left: 0;\n right: 0;\n top: 0;\n bottom: 0;\n}\n\n.hidden {\n display: none !important; /* stylelint-disable-line declaration-no-important */\n}\n\n.highlighted-search-result {\n --override-highlighted-search-result-background-color: rgb(255 255 0 / 80%);\n\n border-radius: 1px;\n background-color: var(--override-highlighted-search-result-background-color);\n outline: 1px solid var(--override-highlighted-search-result-background-color);\n}\n\n.-theme-with-dark-background .highlighted-search-result,\n:host-context(.-theme-with-dark-background) .highlighted-search-result {\n --override-highlighted-search-result-background-color: hsl(133deg 100% 30%);\n\n color: #333;\n}\n\n.link {\n cursor: pointer;\n text-decoration: underline;\n color: var(--color-link);\n outline-offset: 2px;\n}\n\nbutton,\ninput,\nselect {\n /* Form elements do not automatically inherit font style from ancestors. */\n font-family: inherit;\n font-size: inherit;\n}\n\nselect option,\nselect optgroup,\ninput {\n background-color: var(--sys-color-cdt-base-container);\n}\n\ninput {\n color: inherit;\n}\n\ninput::placeholder {\n --override-input-placeholder-color: rgb(0 0 0 / 54%);\n\n color: var(--override-input-placeholder-color);\n}\n\n.-theme-with-dark-background input::placeholder,\n:host-context(.-theme-with-dark-background) input::placeholder {\n --override-input-placeholder-color: rgb(230 230 230 / 54%);\n}\n\n:host-context(.-theme-with-dark-background) input[type="checkbox"]:not(.-theme-preserve) {\n accent-color: var(--color-checkbox-accent-color);\n}\n\n.harmony-input:not([type]),\n.harmony-input[type="number"],\n.harmony-input[type="text"] {\n padding: 3px 6px;\n height: 24px;\n border: 1px solid var(--sys-color-neutral-outline);\n border-radius: 4px;\n\n &.error-input,\n &:invalid {\n border-color: var(--sys-color-error);\n }\n\n &:not(.error-input):not(:invalid):focus {\n border-color: var(--sys-color-state-focus-ring);\n }\n\n &:not(.error-input):not(:invalid):hover:not(:focus) {\n background: var(--sys-color-state-hover-on-subtle);\n }\n}\n\n.highlighted-search-result.current-search-result {\n /* Note: this value is used in light & dark mode */\n --override-current-search-result-background-color: rgb(255 127 0 / 80%);\n\n border-radius: 1px;\n padding: 1px;\n margin: -1px;\n background-color: var(--override-current-search-result-background-color);\n}\n\n.dimmed {\n opacity: 60%;\n}\n\n.editing {\n box-shadow: var(--drop-shadow);\n background-color: var(--color-background);\n text-overflow: clip !important; /* stylelint-disable-line declaration-no-important */\n padding-left: 2px;\n margin-left: -2px;\n padding-right: 2px;\n margin-right: -2px;\n margin-bottom: -1px;\n padding-bottom: 1px;\n opacity: 100% !important; /* stylelint-disable-line declaration-no-important */\n}\n\n.editing,\n.editing * {\n color: var(--color-text-primary) !important; /* stylelint-disable-line declaration-no-important */\n text-decoration: none !important; /* stylelint-disable-line declaration-no-important */\n}\n\n.chrome-select {\n --override-chrome-select-border-color: rgb(0 0 0 / 20%);\n\n appearance: none;\n user-select: none;\n border: 1px solid var(--override-chrome-select-border-color);\n border-radius: 2px;\n color: var(--color-text-primary);\n font: inherit;\n margin: 0;\n outline: none;\n padding-right: 20px;\n padding-left: 6px;\n background-image: var(--image-file-arrow-drop-down-light);\n background-color: var(--color-background-elevation-0);\n background-position: right center;\n background-repeat: no-repeat;\n min-height: 24px;\n min-width: 80px;\n}\n\n.chrome-select:disabled {\n opacity: 38%;\n}\n\n.-theme-with-dark-background .chrome-select,\n:host-context(.-theme-with-dark-background) .chrome-select {\n --override-chrome-select-border-color: rgb(230 230 230 / 20%);\n\n background-image: var(--image-file-arrow-drop-down-dark);\n}\n\n.chrome-select:enabled:active,\n.chrome-select:enabled:focus,\n.chrome-select:enabled:hover {\n --override-select-box-shadow: 0 0 0 2px var(--color-button-outline-focus);\n\n background-color: var(--color-background-elevation-1);\n box-shadow: var(--override-select-box-shadow);\n}\n\n.chrome-select:enabled:active {\n background-color: var(--color-background-elevation-2);\n}\n\n.chrome-select:enabled:focus {\n border-color: transparent;\n}\n\n@media (forced-colors: active) and (prefers-color-scheme: light) {\n .chrome-select {\n background-image: var(--image-file-arrow-drop-down-light);\n }\n\n .-theme-with-dark-background .chrome-select,\n :host-context(.-theme-with-dark-background) .chrome-select {\n background-image: var(--image-file-arrow-drop-down-light);\n }\n}\n\n@media (forced-colors: active) and (prefers-color-scheme: dark) {\n .chrome-select {\n background-image: var(--image-file-arrow-drop-down-dark);\n }\n\n .-theme-with-dark-background .chrome-select,\n :host-context(.-theme-with-dark-background) .chrome-select {\n background-image: var(--image-file-arrow-drop-down-dark);\n }\n}\n\n.-theme-with-dark-background .chrome-select:enabled:active,\n.-theme-with-dark-background .chrome-select:enabled:focus,\n.-theme-with-dark-background .chrome-select:enabled:hover,\n:host-context(.-theme-with-dark-background) .chrome-select:enabled:active,\n:host-context(.-theme-with-dark-background) .chrome-select:enabled:focus,\n:host-context(.-theme-with-dark-background) .chrome-select:enabled:hover {\n --override-select-box-shadow: 0 0 0 2px var(--color-button-outline-focus);\n}\n\n.chrome-select-label {\n margin: 0 22px;\n flex: none;\n}\n\n.chrome-select-label p p {\n margin-top: 0;\n color: var(--color-text-secondary);\n}\n\n/* This class is used outside of the settings screen in the "Renderer" and\n "Sensors" panel. As such we need to override their style globally */\n.settings-select {\n margin: 0;\n}\n\n.chrome-select optgroup,\n.chrome-select option {\n background-color: var(--sys-color-cdt-base-container);\n color: var(--color-text-primary);\n\n &:hover {\n background-color: var(--sys-color-state-hover-on-subtle);\n }\n}\n\n.gray-info-message {\n text-align: center;\n font-style: italic;\n padding: 6px;\n color: var(--color-text-secondary);\n white-space: nowrap;\n}\n\nspan[is="dt-icon-label"] {\n flex: none;\n}\n\n.full-widget-dimmed-banner a {\n color: inherit;\n}\n\n.full-widget-dimmed-banner {\n color: var(--color-text-secondary);\n background-color: var(--color-background);\n display: flex;\n justify-content: center;\n align-items: center;\n text-align: center;\n padding: 20px;\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n font-size: 13px;\n overflow: auto;\n z-index: 500;\n}\n\n[is="ui-icon"] {\n display: inline-block;\n flex-shrink: 0;\n}\n\n.-theme-with-dark-background [is="ui-icon"].icon-invert,\n:host-context(.-theme-with-dark-background) [is="ui-icon"].icon-invert {\n filter: invert(80%) hue-rotate(180deg);\n}\n\n[is="ui-icon"].icon-mask {\n background-color: var(--icon-default);\n -webkit-mask-position: var(--spritesheet-position);\n}\n\n.-theme-with-dark-background [is="ui-icon"].icon-mask,\n:host-context(.-theme-with-dark-background) [is="ui-icon"].icon-mask {\n --override-icon-mask-background-color: rgb(145 145 145);\n}\n\n[is="ui-icon"]:not(.icon-mask) {\n background-position: var(--spritesheet-position);\n}\n\n.spritesheet-smallicons:not(.icon-mask) {\n background-image: var(--image-file-smallIcons);\n}\n\n.spritesheet-smallicons.icon-mask {\n -webkit-mask-image: var(--image-file-smallIcons);\n}\n\n.spritesheet-largeicons:not(.icon-mask) {\n background-image: var(--image-file-largeIcons);\n}\n\n.spritesheet-largeicons.icon-mask {\n -webkit-mask-image: var(--image-file-largeIcons);\n}\n\n.spritesheet-mediumicons:not(.icon-mask) {\n background-image: var(--image-file-mediumIcons);\n}\n\n.spritesheet-mediumicons.icon-mask {\n -webkit-mask-image: var(--image-file-mediumIcons);\n}\n\n.spritesheet-arrowicons {\n background-image: var(--image-file-popoverArrows);\n}\n\n.spritesheet-3d-center.icon-mask {\n -webkit-mask-image: var(--image-file-3d-center);\n}\n\n.spritesheet-3d-pan.icon-mask {\n -webkit-mask-image: var(--image-file-3d-pan);\n}\n\n.spritesheet-3d-rotate.icon-mask {\n -webkit-mask-image: var(--image-file-3d-rotate);\n}\n\n.spritesheet-arrow-up-down-circle.icon-mask {\n -webkit-mask-image: var(--image-file-arrow-up-down-circle);\n}\n\n.spritesheet-arrow-up-down.icon-mask {\n -webkit-mask-image: var(--image-file-arrow-up-down);\n}\n\n.spritesheet-bell.icon-mask {\n -webkit-mask-image: var(--image-file-bell);\n}\n\n.spritesheet-bezier-curve-filled.icon-mask {\n -webkit-mask-image: var(--image-file-bezier-curve-filled);\n}\n\n.spritesheet-bin.icon-mask {\n -webkit-mask-image: var(--image-file-bin);\n}\n\n.spritesheet-bottom-panel-close.icon-mask {\n -webkit-mask-image: var(--image-file-bottom-panel-close);\n}\n\n.spritesheet-bottom-panel-open.icon-mask {\n -webkit-mask-image: var(--image-file-bottom-panel-open);\n}\n\n.spritesheet-brackets.icon-mask {\n -webkit-mask-image: var(--image-file-brackets);\n}\n\n.spritesheet-breakpoint-crossed-filled.icon-mask {\n -webkit-mask-image: var(--image-file-breakpoint-crossed-filled);\n}\n\n.spritesheet-breakpoint-crossed.icon-mask {\n -webkit-mask-image: var(--image-file-breakpoint-crossed);\n}\n\n.spritesheet-brush-filled.icon-mask {\n -webkit-mask-image: var(--image-file-brush-filled);\n}\n\n.spritesheet-brush.icon-mask {\n -webkit-mask-image: var(--image-file-brush);\n}\n\n.spritesheet-bug.icon-mask {\n -webkit-mask-image: var(--image-file-bug);\n}\n\n.spritesheet-check-double.icon-mask {\n -webkit-mask-image: var(--image-file-check-double);\n}\n\n.spritesheet-checkmark.icon-mask {\n -webkit-mask-image: var(--image-file-checkmark);\n}\n\n.spritesheet-chevron-double-right.icon-mask {\n -webkit-mask-image: var(--image-file-chevron-double-right);\n}\n\n.spritesheet-chevron-down.icon-mask {\n -webkit-mask-image: var(--image-file-chevron-down);\n}\n\n.spritesheet-chevron-up.icon-mask {\n -webkit-mask-image: var(--image-file-chevron-up);\n}\n\n.spritesheet-clear-list.icon-mask {\n -webkit-mask-image: var(--image-file-clear-list);\n}\n\n.spritesheet-clear.icon-mask {\n -webkit-mask-image: var(--image-file-clear);\n}\n\n.spritesheet-cloud.icon-mask {\n -webkit-mask-image: var(--image-file-cloud);\n}\n\n.spritesheet-code-circle.icon-mask {\n -webkit-mask-image: var(--image-file-code-circle);\n}\n\n.spritesheet-color-picker-filled.icon-mask {\n -webkit-mask-image: var(--image-file-color-picker-filled);\n}\n\n.spritesheet-color-picker.icon-mask {\n -webkit-mask-image: var(--image-file-color-picker);\n}\n\n.spritesheet-cookie.icon-mask {\n -webkit-mask-image: var(--image-file-cookie);\n}\n\n.spritesheet-copy.icon-mask {\n -webkit-mask-image: var(--image-file-copy);\n}\n\n.spritesheet-credit-card.icon-mask {\n -webkit-mask-image: var(--image-file-credit-card);\n}\n\n.spritesheet-cross-circle.icon-mask {\n -webkit-mask-image: var(--image-file-cross-circle);\n}\n\n.spritesheet-cross.icon-mask {\n -webkit-mask-image: var(--image-file-cross);\n}\n\n.spritesheet-custom-typography.icon-mask {\n -webkit-mask-image: var(--image-file-custom-typography);\n}\n\n.spritesheet-database.icon-mask {\n -webkit-mask-image: var(--image-file-database);\n}\n\n.spritesheet-device-fold.icon-mask {\n -webkit-mask-image: var(--image-file-device-fold);\n}\n\n.spritesheet-devices.icon-mask {\n -webkit-mask-image: var(--image-file-devices);\n}\n\n.spritesheet-dock-bottom.icon-mask {\n -webkit-mask-image: var(--image-file-dock-bottom);\n}\n\n.spritesheet-dock-left.icon-mask {\n -webkit-mask-image: var(--image-file-dock-left);\n}\n\n.spritesheet-dock-right.icon-mask {\n -webkit-mask-image: var(--image-file-dock-right);\n}\n\n.spritesheet-dock-window.icon-mask {\n -webkit-mask-image: var(--image-file-dock-window);\n}\n\n.spritesheet-document.icon-mask {\n -webkit-mask-image: var(--image-file-document);\n}\n\n.spritesheet-dots-vertical.icon-mask {\n -webkit-mask-image: var(--image-file-dots-vertical);\n}\n\n.spritesheet-download.icon-mask {\n -webkit-mask-image: var(--image-file-download);\n}\n\n.spritesheet-edit.icon-mask {\n -webkit-mask-image: var(--image-file-edit);\n}\n\n.spritesheet-experiment-check.icon-mask {\n -webkit-mask-image: var(--image-file-experiment-check);\n}\n\n.spritesheet-eye.icon-mask {\n -webkit-mask-image: var(--image-file-eye);\n}\n\n.spritesheet-filter-clear.icon-mask {\n -webkit-mask-image: var(--image-file-filter-clear);\n}\n\n.spritesheet-filter-filled.icon-mask {\n -webkit-mask-image: var(--image-file-filter-filled);\n}\n\n.spritesheet-filter.icon-mask {\n -webkit-mask-image: var(--image-file-filter);\n}\n\n.spritesheet-frame-crossed.icon-mask {\n -webkit-mask-image: var(--image-file-frame-crossed);\n}\n\n.spritesheet-frame.icon-mask {\n -webkit-mask-image: var(--image-file-frame);\n}\n\n.spritesheet-gear-filled.icon-mask {\n -webkit-mask-image: var(--image-file-gear-filled);\n}\n\n.spritesheet-gear.icon-mask {\n -webkit-mask-image: var(--image-file-gear);\n}\n\n.spritesheet-gears.icon-mask {\n -webkit-mask-image: var(--image-file-gears);\n}\n\n.spritesheet-heap-snapshot.icon-mask {\n -webkit-mask-image: var(--image-file-heap-snapshot);\n}\n\n.spritesheet-heap-snapshots.icon-mask {\n -webkit-mask-image: var(--image-file-heap-snapshots);\n}\n\n.spritesheet-iframe-crossed.icon-mask {\n -webkit-mask-image: var(--image-file-iframe-crossed);\n}\n\n.spritesheet-iframe.icon-mask {\n -webkit-mask-image: var(--image-file-iframe);\n}\n\n.spritesheet-import.icon-mask {\n -webkit-mask-image: var(--image-file-import);\n}\n\n.spritesheet-info.icon-mask {\n -webkit-mask-image: var(--image-file-info);\n}\n\n.spritesheet-keyboard-pen.icon-mask {\n -webkit-mask-image: var(--image-file-keyboard-pen);\n}\n\n.spritesheet-layers-filled.icon-mask {\n -webkit-mask-image: var(--image-file-layers-filled);\n}\n\n.spritesheet-layers.icon-mask {\n -webkit-mask-image: var(--image-file-layers);\n}\n\n.spritesheet-left-panel-close.icon-mask {\n -webkit-mask-image: var(--image-file-left-panel-close);\n}\n\n.spritesheet-left-panel-open.icon-mask {\n -webkit-mask-image: var(--image-file-left-panel-open);\n}\n\n.spritesheet-list.icon-mask {\n -webkit-mask-image: var(--image-file-list);\n}\n\n.spritesheet-pause.icon-mask {\n -webkit-mask-image: var(--image-file-pause);\n}\n\n.spritesheet-play.icon-mask {\n -webkit-mask-image: var(--image-file-play);\n}\n\n.spritesheet-plus.icon-mask {\n -webkit-mask-image: var(--image-file-plus);\n}\n\n.spritesheet-popup.icon-mask {\n -webkit-mask-image: var(--image-file-popup);\n}\n\n.spritesheet-profile.icon-mask {\n -webkit-mask-image: var(--image-file-profile);\n}\n\n.spritesheet-record-start.icon-mask {\n -webkit-mask-image: var(--image-file-record-start);\n}\n\n.spritesheet-record-stop.icon-mask {\n -webkit-mask-image: var(--image-file-record-stop);\n}\n\n.spritesheet-refresh.icon-mask {\n -webkit-mask-image: var(--image-file-refresh);\n}\n\n.spritesheet-replace.icon-mask {\n -webkit-mask-image: var(--image-file-replace);\n}\n\n.spritesheet-resume.icon-mask {\n -webkit-mask-image: var(--image-file-resume);\n}\n\n.spritesheet-right-panel-close.icon-mask {\n -webkit-mask-image: var(--image-file-right-panel-close);\n}\n\n.spritesheet-right-panel-open.icon-mask {\n -webkit-mask-image: var(--image-file-right-panel-open);\n}\n\n.spritesheet-screen-rotation.icon-mask {\n -webkit-mask-image: var(--image-file-screen-rotation);\n}\n\n.spritesheet-search.icon-mask {\n -webkit-mask-image: var(--image-file-search);\n}\n\n.spritesheet-select-element.icon-mask {\n -webkit-mask-image: var(--image-file-select-element);\n}\n\n.spritesheet-shadow.icon-mask {\n -webkit-mask-image: var(--image-file-shadow);\n}\n\n.spritesheet-step-into.icon-mask {\n -webkit-mask-image: var(--image-file-step-into);\n}\n\n.spritesheet-step-out.icon-mask {\n -webkit-mask-image: var(--image-file-step-out);\n}\n\n.spritesheet-step-over.icon-mask {\n -webkit-mask-image: var(--image-file-step-over);\n}\n\n.spritesheet-step.icon-mask {\n -webkit-mask-image: var(--image-file-step);\n}\n\n.spritesheet-stop.icon-mask {\n -webkit-mask-image: var(--image-file-stop);\n}\n\n.spritesheet-sync.icon-mask {\n -webkit-mask-image: var(--image-file-sync);\n}\n\n.spritesheet-table.icon-mask {\n -webkit-mask-image: var(--image-file-table);\n}\n\n.spritesheet-top-panel-close.icon-mask {\n -webkit-mask-image: var(--image-file-top-panel-close);\n}\n\n.spritesheet-top-panel-open.icon-mask {\n -webkit-mask-image: var(--image-file-top-panel-open);\n}\n\n.spritesheet-replay.icon-mask {\n -webkit-mask-image: var(--image-file-replay);\n}\n\n.spritesheet-triangle-bottom-right.icon-mask {\n -webkit-mask-image: var(--image-file-triangle-bottom-right);\n}\n\n.spritesheet-triangle-down.icon-mask {\n -webkit-mask-image: var(--image-file-triangle-down);\n}\n\n.spritesheet-triangle-left.icon-mask {\n -webkit-mask-image: var(--image-file-triangle-left);\n}\n\n.spritesheet-triangle-right.icon-mask {\n -webkit-mask-image: var(--image-file-triangle-right);\n}\n\n.spritesheet-triangle-up.icon-mask {\n -webkit-mask-image: var(--image-file-triangle-up);\n}\n\n.spritesheet-undo.icon-mask {\n -webkit-mask-image: var(--image-file-undo);\n}\n\n.spritesheet-warning.icon-mask {\n -webkit-mask-image: var(--image-file-warning);\n}\n\n.spritesheet-watch.icon-mask {\n -webkit-mask-image: var(--image-file-watch);\n}\n\n.dot::before {\n content: url("Images/empty.svg");\n width: 6px;\n height: 6px;\n border-radius: 50%;\n outline: 1px solid var(--icon-gap-default);\n left: 9px;\n position: absolute;\n top: 9px;\n z-index: 1;\n}\n\n.green::before {\n background-color: var(--color-tertiary-bright);\n}\n\n.purple::before {\n background-color: var(--color-purple-bright);\n}\n\n.expandable-inline-button {\n background-color: var(--color-background-elevation-2);\n color: var(--color-text-primary);\n cursor: pointer;\n border-radius: 3px;\n}\n\n.undisplayable-text,\n.expandable-inline-button {\n padding: 1px 3px;\n margin: 0 2px;\n font-size: 11px;\n font-family: sans-serif;\n white-space: nowrap;\n display: inline-block;\n}\n\n.undisplayable-text::after,\n.expandable-inline-button::after {\n content: attr(data-text);\n}\n\n.undisplayable-text {\n color: var(--color-text-disabled);\n font-style: italic;\n}\n\n.expandable-inline-button:hover,\n.expandable-inline-button:focus-visible {\n background-color: var(--color-background-elevation-1);\n}\n\n.expandable-inline-button:focus-visible {\n background-color: var(--color-background-elevation-1);\n}\n\n::selection {\n background-color: var(--text-selection);\n}\n\n.reload-warning {\n align-self: center;\n margin-left: 10px;\n}\n\nbutton.link {\n border: none;\n background: none;\n padding: 3px;\n}\n\nbutton.link:focus-visible {\n --override-link-focus-background-color: rgb(0 0 0 / 8%);\n\n background-color: var(--override-link-focus-background-color);\n border-radius: 2px;\n}\n\n.-theme-with-dark-background button.link:focus-visible,\n:host-context(.-theme-with-dark-background) button.link:focus-visible {\n --override-link-focus-background-color: rgb(230 230 230 / 8%);\n}\n\n@media (forced-colors: active) {\n .dimmed,\n .chrome-select:disabled {\n opacity: 100%;\n }\n\n [is="ui-icon"].icon-mask,\n .force-white-icons [is="ui-icon"].spritesheet-smallicons,\n :host-context(.force-white-icons) [is="ui-icon"].spritesheet-smallicons,\n [is="ui-icon"].force-white-icons.spritesheet-smallicons,\n .force-white-icons [is="ui-icon"].spritesheet-largeicons,\n :host-context(.force-white-icons) [is="ui-icon"].spritesheet-largeicons,\n [is="ui-icon"].force-white-icons.spritesheet-largeicons,\n .force-white-icons [is="ui-icon"].spritesheet-mediumicons,\n :host-context(.force-white-icons) [is="ui-icon"].spritesheet-mediumicons,\n [is="ui-icon"].force-white-icons.spritesheet-mediumicons,\n .-theme-preserve {\n forced-color-adjust: none;\n background-color: ButtonText;\n }\n\n .harmony-input:not([type]),\n .harmony-input[type="number"],\n .harmony-input[type="text"] {\n border: 1px solid ButtonText;\n }\n\n .harmony-input:not([type]):focus,\n .harmony-input[type="number"]:focus,\n .harmony-input[type="text"]:focus {\n border: 1px solid Highlight;\n }\n}\n/* search input with customized styling */\ninput.custom-search-input::-webkit-search-cancel-button {\n appearance: none;\n cursor: pointer;\n width: 16px;\n height: 15px;\n margin-right: 0;\n background-position: -32px 32px;\n background-image: var(--image-file-mediumIcons);\n}\n/* loading spinner */\n.spinner::before {\n display: block;\n width: var(--dimension, 24px);\n height: var(--dimension, 24px);\n border: var(--override-spinner-size, 3px) solid var(--override-spinner-color, var(--color-text-secondary));\n border-radius: 12px;\n clip: rect(0, var(--clip-size, 15px), var(--clip-size, 15px), 0);\n content: "";\n position: absolute;\n animation: spinner-animation 1s linear infinite;\n box-sizing: border-box;\n}\n\n@keyframes spinner-animation {\n from { transform: rotate(0); }\n to { transform: rotate(360deg); }\n}\n/** Adorner */\n.adorner-container {\n display: inline-block;\n}\n\n.adorner-container.hidden {\n display: none;\n}\n\n.adorner-container devtools-adorner {\n margin-left: 3px;\n}\n\n:host-context(.-theme-with-dark-background) devtools-adorner {\n --override-adorner-border-color: rgb(var(--color-syntax-2-rgb) / 50%);\n --override-adorner-focus-border-color: var(--color-syntax-2);\n --override-adorner-active-background-color: var(--color-syntax-8);\n}\n\n/* General panel styles */\n.panel {\n display: flex;\n overflow: hidden;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n z-index: 0;\n background-color: var(--sys-color-cdt-base-container);\n}\n\n.panel-sidebar {\n overflow-x: hidden;\n background-color: var(--sys-color-cdt-base-container);\n}\n\niframe.extension {\n flex: auto;\n width: 100%;\n height: 100%;\n}\n\niframe.panel.extension {\n display: block;\n height: 100%;\n}\n\n@media (forced-colors: active) {\n :root {\n --legacy-accent-color: Highlight;\n --legacy-focus-ring-inactive-shadow-color: ButtonText;\n }\n}\n\n/*# sourceURL=inspectorCommon.css */\n');export default styles;