/*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */ @layer properties; @layer theme, base, components, utilities; @layer theme { :root, :host { --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif; --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace; --spacing: 0.25rem; --container-xs: 20rem; --container-2xl: 42rem; --text-xs: 0.75rem; --text-xs--line-height: calc(1 / 0.75); --text-sm: 0.875rem; --text-sm--line-height: calc(1.25 / 0.875); --tracking-wide: 0.025em; --default-font-family: var(--font-sans); --default-mono-font-family: var(--font-mono); } } @layer base { *, ::after, ::before, ::backdrop, ::file-selector-button { box-sizing: border-box; margin: 0; padding: 0; border: 0 solid; } html, :host { line-height: 1.5; -webkit-text-size-adjust: 100%; tab-size: 4; font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'); font-feature-settings: var(--default-font-feature-settings, normal); font-variation-settings: var(--default-font-variation-settings, normal); -webkit-tap-highlight-color: transparent; } hr { height: 0; color: inherit; border-top-width: 1px; } abbr:where([title]) { -webkit-text-decoration: underline dotted; text-decoration: underline dotted; } h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; } a { color: inherit; -webkit-text-decoration: inherit; text-decoration: inherit; } b, strong { font-weight: bolder; } code, kbd, samp, pre { font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace); font-feature-settings: var(--default-mono-font-feature-settings, normal); font-variation-settings: var(--default-mono-font-variation-settings, normal); font-size: 1em; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } table { text-indent: 0; border-color: inherit; border-collapse: collapse; } :-moz-focusring { outline: auto; } progress { vertical-align: baseline; } summary { display: list-item; } ol, ul, menu { list-style: none; } img, svg, video, canvas, audio, iframe, embed, object { display: block; vertical-align: middle; } img, video { max-width: 100%; height: auto; } button, input, select, optgroup, textarea, ::file-selector-button { font: inherit; font-feature-settings: inherit; font-variation-settings: inherit; letter-spacing: inherit; color: inherit; border-radius: 0; background-color: transparent; opacity: 1; } :where(select:is([multiple], [size])) optgroup { font-weight: bolder; } :where(select:is([multiple], [size])) optgroup option { padding-inline-start: 20px; } ::file-selector-button { margin-inline-end: 4px; } ::placeholder { opacity: 1; } @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) { ::placeholder { color: currentcolor; @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, currentcolor 50%, transparent); } } } textarea { resize: vertical; } ::-webkit-search-decoration { -webkit-appearance: none; } ::-webkit-date-and-time-value { min-height: 1lh; text-align: inherit; } ::-webkit-datetime-edit { display: inline-flex; } ::-webkit-datetime-edit-fields-wrapper { padding: 0; } ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field { padding-block: 0; } ::-webkit-calendar-picker-indicator { line-height: 1; } :-moz-ui-invalid { box-shadow: none; } button, input:where([type='button'], [type='reset'], [type='submit']), ::file-selector-button { appearance: button; } ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; } [hidden]:where(:not([hidden='until-found'])) { display: none !important; } } @layer utilities { .visible { visibility: visible; } .absolute { position: absolute; } .relative { position: relative; } .top-full { top: 100%; } .right-0 { right: calc(var(--spacing) * 0); } .z-10 { z-index: 10; } .mt-2 { margin-top: calc(var(--spacing) * 2); } .block { display: block; } .flex { display: flex; } .grid { display: grid; } .hidden { display: none; } .inline { display: inline; } .inline-flex { display: inline-flex; } .table { display: table; } .h-6 { height: calc(var(--spacing) * 6); } .h-8 { height: calc(var(--spacing) * 8); } .h-9 { height: calc(var(--spacing) * 9); } .h-12 { height: calc(var(--spacing) * 12); } .h-\[22px\] { height: 22px; } .h-\[35px\] { height: 35px; } .h-full { height: 100%; } .max-h-\[80vh\] { max-height: 80vh; } .min-h-0 { min-height: calc(var(--spacing) * 0); } .min-h-\[8rem\] { min-height: 8rem; } .min-h-\[16rem\] { min-height: 16rem; } .w-6 { width: calc(var(--spacing) * 6); } .w-8 { width: calc(var(--spacing) * 8); } .w-12 { width: calc(var(--spacing) * 12); } .w-full { width: 100%; } .max-w-2xl { max-width: var(--container-2xl); } .max-w-\[240px\] { max-width: 240px; } .max-w-full { max-width: 100%; } .max-w-xs { max-width: var(--container-xs); } .min-w-0 { min-width: calc(var(--spacing) * 0); } .min-w-9 { min-width: calc(var(--spacing) * 9); } .min-w-56 { min-width: calc(var(--spacing) * 56); } .min-w-72 { min-width: calc(var(--spacing) * 72); } .flex-1 { flex: 1; } .shrink-0 { flex-shrink: 0; } .transform { transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,); } .resize { resize: both; } .resize-y { resize: vertical; } .flex-col { flex-direction: column; } .flex-wrap { flex-wrap: wrap; } .items-center { align-items: center; } .items-end { align-items: flex-end; } .items-start { align-items: flex-start; } .items-stretch { align-items: stretch; } .justify-between { justify-content: space-between; } .justify-center { justify-content: center; } .justify-end { justify-content: flex-end; } .gap-1 { gap: calc(var(--spacing) * 1); } .gap-1\.5 { gap: calc(var(--spacing) * 1.5); } .gap-2 { gap: calc(var(--spacing) * 2); } .gap-3 { gap: calc(var(--spacing) * 3); } .gap-4 { gap: calc(var(--spacing) * 4); } .truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .overflow-auto { overflow: auto; } .overflow-hidden { overflow: hidden; } .overflow-x-auto { overflow-x: auto; } .overflow-y-auto { overflow-y: auto; } .rounded { border-radius: 0.25rem; } .border { border-style: var(--tw-border-style); border-width: 1px; } .p-4 { padding: calc(var(--spacing) * 4); } .px-3 { padding-inline: calc(var(--spacing) * 3); } .px-4 { padding-inline: calc(var(--spacing) * 4); } .py-2 { padding-block: calc(var(--spacing) * 2); } .py-3 { padding-block: calc(var(--spacing) * 3); } .py-6 { padding-block: calc(var(--spacing) * 6); } .pt-2 { padding-top: calc(var(--spacing) * 2); } .pr-2 { padding-right: calc(var(--spacing) * 2); } .text-left { text-align: left; } .text-sm { font-size: var(--text-sm); line-height: var(--tw-leading, var(--text-sm--line-height)); } .text-xs { font-size: var(--text-xs); line-height: var(--tw-leading, var(--text-xs--line-height)); } .tracking-wide { --tw-tracking: var(--tracking-wide); letter-spacing: var(--tracking-wide); } .uppercase { text-transform: uppercase; } .outline { outline-style: var(--tw-outline-style); outline-width: 1px; } .invert { --tw-invert: invert(100%); filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); } .md\:grid-cols-2 { @media (width >= 48rem) { grid-template-columns: repeat(2, minmax(0, 1fr)); } } .md\:grid-cols-\[minmax\(0\,1fr\)_auto\] { @media (width >= 48rem) { grid-template-columns: minmax(0,1fr) auto; } } .md\:grid-cols-\[minmax\(0\,1fr\)_minmax\(0\,1fr\)_auto\] { @media (width >= 48rem) { grid-template-columns: minmax(0,1fr) minmax(0,1fr) auto; } } .xl\:grid-cols-\[minmax\(0\,2fr\)_minmax\(280px\,1fr\)\] { @media (width >= 80rem) { grid-template-columns: minmax(0,2fr) minmax(280px,1fr); } } .xl\:grid-cols-\[minmax\(320px\,1fr\)_minmax\(0\,1\.2fr\)\] { @media (width >= 80rem) { grid-template-columns: minmax(320px,1fr) minmax(0,1.2fr); } } } :root { --accent-color: #007acc; --accent-color-transparent: rgba(0, 122, 204, 0.25); --vscode-editor-background: #1e1e1e; --vscode-editor-foreground: #cccccc; --vscode-sideBar-background: #252526; --vscode-activityBar-background: #333333; --vscode-activityBar-foreground: #ffffff; --vscode-panel-background: #1e1e1e; --vscode-titleBar-activeBackground: #252526; --vscode-titleBar-activeForeground: #cccccc; --vscode-statusBar-background: #007acc; --vscode-statusBar-foreground: #ffffff; --vscode-tab-activeBackground: #1e1e1e; --vscode-tab-inactiveBackground: #2d2d2d; --vscode-tab-activeForeground: #ffffff; --vscode-tab-inactiveForeground: #969696; --vscode-editorGroupHeader-tabsBackground: #252526; --vscode-editorGroupHeader-tabsBorder: #1e1e1e; --vscode-toolbar-hoverBackground: rgba(90, 93, 94, 0.31); --vscode-toolbar-activeBackground: rgba(99, 102, 103, 0.31); --vscode-foreground: #cccccc; --vscode-descriptionForeground: #858585; --vscode-panel-border: #80808059; --vscode-sideBar-border: #80808059; --vscode-tab-border: #252526; --vscode-focusBorder: #007fd4; --vscode-input-background: rgba(255, 255, 255, 0.06); --vscode-input-border: rgba(255, 255, 255, 0.12); --vscode-list-hoverBackground: #2a2d2e; --vscode-list-activeSelectionBackground: #094771; --vscode-list-activeSelectionForeground: #ffffff; --vscode-activityBarBadge-background: #007acc; --vscode-activityBarBadge-foreground: #ffffff; --vscode-testing-iconPassed: #73c991; --vscode-editorWarning-foreground: #cca700; --vscode-input-foreground: #cccccc; --vscode-input-placeholderForeground: #a6a6a6; --vscode-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; --vscode-font-size: 13px; --panel-1: var(--vscode-editor-background); --panel-2: var(--vscode-sideBar-background); --panel-3: var(--vscode-input-background); --ink: var(--vscode-foreground); --line: var(--vscode-panel-border); --accent: var(--vscode-focusBorder); --accent-soft: var(--vscode-list-hoverBackground); --success: var(--vscode-testing-iconPassed); --sidebar-width: 280px; --assistant-width: 360px; color-scheme: dark; } * { box-sizing: border-box; } html, body { margin: 0; width: 100%; height: 100%; background: var(--vscode-editor-background); color: var(--vscode-foreground); } body { overflow: hidden; user-select: none; font-family: var(--vscode-font-family); font-size: var(--vscode-font-size); } body > [data-phx-session], body > [data-phx-main] { width: 100%; height: 100%; min-height: 0; } button { font-family: var(--vscode-font-family); font-size: var(--vscode-font-size); color: var(--vscode-button-foreground); background-color: var(--vscode-button-background); border: none; padding: 6px 14px; cursor: pointer; border-radius: 2px; } button:hover { background-color: var(--vscode-button-hoverBackground); } button:focus { outline: 1px solid var(--vscode-focusBorder); outline-offset: 2px; } button.secondary { background-color: var(--vscode-button-secondaryBackground); } button.secondary:hover { background-color: #4a4d51; } button.compact { padding: 4px 8px; font-size: 12px; } button.primary { background-color: var(--vscode-button-background); font-weight: 500; } button.primary:hover { background-color: var(--vscode-button-hoverBackground); } button.success { background-color: #28a745; } button.success:hover { background-color: #218838; } button.danger { background-color: #dc3545; } button.danger:hover { background-color: #c82333; } button:disabled { opacity: 0.5; cursor: not-allowed; } button svg, button svg * { pointer-events: none; } .app { width: 100%; height: 100%; display: flex; flex-direction: column; background-color: var(--vscode-editor-background); } .app-main { flex: 1; display: flex; overflow: hidden; min-height: 0; } .app-content { flex: 1; display: flex; flex-direction: column; overflow: hidden; min-width: 0; } .window-titlebar { position: relative; height: 34px; display: flex; align-items: center; justify-content: space-between; background-color: var(--vscode-editorGroupHeader-tabsBackground); border-bottom: 1px solid var(--vscode-editorGroupHeader-tabsBorder); flex-shrink: 0; app-region: drag; -webkit-app-region: drag; padding-right: calc(10px + var(--bds-titlebar-overlay-right, 0px)); } .window-titlebar-menu-bar { display: flex; align-items: center; height: 100%; margin-left: 6px; gap: 2px; app-region: no-drag; -webkit-app-region: no-drag; z-index: 2; } .window-titlebar-menu-group { position: relative; display: flex; align-items: center; height: 100%; } .window-titlebar-menu-bar.is-hidden { display: none; } .window-titlebar.is-mac .window-titlebar-menu-bar { margin-left: max(var(--bds-titlebar-macos-left-inset, 78px), calc(6px + var(--bds-titlebar-overlay-left, 0px))); } .window-titlebar-menu-button { height: 24px; border: none; background: transparent; color: var(--vscode-titleBar-activeForeground); padding: 0 8px; border-radius: 4px; font-size: 12px; line-height: 1; cursor: pointer; } .window-titlebar-menu-button:hover, .window-titlebar-action-button:hover { background-color: var(--vscode-toolbar-hoverBackground); } .window-titlebar-menu-button.is-active { background-color: var(--vscode-toolbar-hoverBackground); } .window-titlebar-menu-button:focus, .window-titlebar-menu-button:focus-visible, .window-titlebar-action-button:focus, .window-titlebar-action-button:focus-visible { outline: none; box-shadow: none; } .window-titlebar-menu-dropdown { position: absolute; top: 30px; left: 0; min-width: 210px; padding: 6px; display: flex; flex-direction: column; gap: 2px; background-color: var(--vscode-menu-background, var(--vscode-editorWidget-background)); border: 1px solid var(--vscode-menu-border, var(--vscode-panel-border)); border-radius: 6px; box-shadow: var(--vscode-widget-shadow, 0 8px 24px rgba(0, 0, 0, 0.4)); app-region: no-drag; -webkit-app-region: no-drag; z-index: 10; } .window-titlebar-menu-item { border: none; background: transparent; color: var(--vscode-menu-foreground, var(--vscode-foreground)); display: flex; align-items: center; justify-content: space-between; gap: 16px; text-align: left; border-radius: 4px; padding: 6px 8px; font-size: 12px; cursor: pointer; } .window-titlebar-menu-item:focus, .window-titlebar-menu-item:focus-visible { outline: none; box-shadow: none; background-color: var(--vscode-toolbar-hoverBackground); } .window-titlebar-menu-item:hover, .window-titlebar-menu-item.is-keyboard-active { background-color: var(--vscode-menu-selectionBackground, var(--vscode-toolbar-hoverBackground)); } .window-titlebar-menu-item-accelerator { opacity: 0.8; } .window-titlebar-menu-separator { height: 1px; margin: 4px 2px; background-color: var(--vscode-menu-separatorBackground, rgba(255, 255, 255, 0.08)); } .window-titlebar-drag-region { flex: 1; height: 100%; } .window-titlebar-title { position: absolute; left: 50%; transform: translateX(-50%); max-width: 45%; height: 100%; display: flex; align-items: center; justify-content: center; color: var(--vscode-titleBar-activeForeground); font-size: 12px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; user-select: none; pointer-events: none; } .window-titlebar-actions { height: 100%; display: flex; align-items: center; margin-right: 6px; app-region: no-drag; -webkit-app-region: no-drag; } .window-titlebar-action-button { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; padding: 0; line-height: 0; background: transparent; border: none; color: var(--vscode-foreground); cursor: pointer; border-radius: 4px; } .window-titlebar-sidebar-icon, .window-titlebar-panel-icon, .window-titlebar-assistant-icon { width: 14px; height: 14px; border: 1.5px solid currentColor; border-radius: 2px; display: block; position: relative; overflow: hidden; } .window-titlebar-sidebar-icon::before { content: ""; position: absolute; top: 0; bottom: 0; left: 33.3333%; width: 1.5px; transform: translateX(-50%); background-color: currentColor; } .window-titlebar-panel-icon::before { content: ""; position: absolute; left: 0; right: 0; top: 66.6667%; height: 1.5px; transform: translateY(-50%); background-color: currentColor; } .window-titlebar-assistant-icon::before { content: ""; position: absolute; top: 0; bottom: 0; left: 66.6667%; width: 1.5px; transform: translateX(-50%); background-color: currentColor; } .window-titlebar-sidebar-pane, .window-titlebar-panel-pane, .window-titlebar-assistant-pane { position: absolute; background-color: currentColor; transition: opacity 120ms ease; } .window-titlebar-sidebar-pane { left: 0; top: 0; width: 33.3333%; height: 100%; } .window-titlebar-panel-pane { left: 0; bottom: 0; width: 100%; height: 33.3333%; } .window-titlebar-assistant-pane { right: 0; top: 0; width: 33.3333%; height: 100%; } .window-titlebar-sidebar-icon.is-inactive .window-titlebar-sidebar-pane, .window-titlebar-panel-icon.is-inactive .window-titlebar-panel-pane, .window-titlebar-assistant-icon.is-inactive .window-titlebar-assistant-pane { opacity: 0; } .panel-shell { height: 200px; border-top: 1px solid var(--vscode-panel-border); background: var(--vscode-panel-background); display: flex; flex-direction: column; } .panel-shell.is-hidden { display: none; } .editor-toolbar-button.is-destructive { color: #f48771; } .shell-overlay-backdrop, .gallery-overlay-backdrop { position: fixed; inset: 0; background: rgba(0, 0, 0, 0.68); display: flex; align-items: center; justify-content: center; pointer-events: auto; z-index: 10000; } .shell-overlay-dismiss { position: absolute; inset: 0; border: none; background: transparent; padding: 0; } .gallery-overlay { position: relative; width: min(980px, calc(100vw - 48px)); max-height: calc(100vh - 48px); display: flex; flex-direction: column; overflow: hidden; background: #1e1e1e; border: 1px solid #3c3c3c; border-radius: 8px; box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4); z-index: 1; } .insert-modal-media-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; padding: 16px; } .insert-modal-media-item { display: flex; flex-direction: column; gap: 8px; border: 1px solid #3c3c3c; border-radius: 8px; background: #252526; color: inherit; padding: 10px; text-align: left; } .insert-modal-media-thumb { width: 100%; min-height: 112px; border-radius: 6px; object-fit: cover; background: rgba(255, 255, 255, 0.04); } .insert-modal-media-title { font-weight: 600; color: #ffffff; } .language-picker-options { display: flex; flex-direction: column; gap: 8px; } .language-picker-option { width: 100%; display: grid; grid-template-columns: 28px 1fr auto; gap: 12px; align-items: center; border: none; border-radius: 4px; padding: 12px 16px; background: transparent; color: inherit; text-align: left; } .language-picker-label, .language-picker-status, .lightbox-counter { color: #9d9d9d; font-size: 12px; } .lightbox-counter { margin-top: 4px; } @media (max-width: 720px) { .insert-modal-media-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } .panel-header { height: 35px; display: flex; align-items: center; justify-content: space-between; padding: 0 8px; background-color: var(--vscode-sideBar-background); border-bottom: 1px solid var(--vscode-panel-border); } .panel-tabs { display: flex; align-items: stretch; height: 100%; } .panel-tab { border: none; background: transparent; color: var(--vscode-descriptionForeground); padding: 0 12px; cursor: pointer; } .panel-tab.active { color: var(--vscode-tab-activeForeground); } .panel-close { background: transparent; border: none; color: var(--vscode-descriptionForeground); font-size: 18px; width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; cursor: pointer; border-radius: 4px; padding: 0; } .panel-close:hover { background-color: var(--vscode-list-hoverBackground); color: var(--vscode-editor-foreground); } .panel-content { flex: 1; overflow: auto; padding: 12px 14px; } .panel-entry, .assistant-card { display: flex; flex-direction: column; gap: 4px; padding: 10px 12px; border-bottom: 1px solid var(--vscode-panel-border); } .output-list, .git-log-list { display: flex; flex-direction: column; } .task-list { display: flex; flex-direction: column; } .task-entry-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; } .task-status { font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--vscode-descriptionForeground); } .task-status-running { color: var(--vscode-terminal-ansiGreen, var(--vscode-statusBar-foreground)); } .task-status-pending { color: var(--vscode-terminal-ansiYellow, var(--vscode-statusBar-foreground)); } .panel-empty-state { min-height: 100%; justify-content: center; } .status-bar { height: 22px; background: var(--vscode-statusBar-background); color: var(--vscode-statusBar-foreground); display: flex; align-items: center; justify-content: space-between; padding: 0 8px; font-size: 12px; flex-shrink: 0; } .status-bar-left, .status-bar-right { display: flex; align-items: center; gap: 4px; flex-shrink: 0; } .status-bar-left { flex-shrink: 1; min-width: 0; } .status-shell-controls { display: flex; align-items: stretch; gap: 2px; flex-shrink: 0; } .status-shell-toggle-button { display: flex; align-items: center; justify-content: center; width: 22px; height: 100%; padding: 0; line-height: 0; background: transparent; border: none; color: inherit; cursor: pointer; border-radius: 3px; } .status-shell-toggle-button:hover { background-color: rgba(255, 255, 255, 0.1); } .status-shell-toggle-button:focus, .status-shell-toggle-button:focus-visible { outline: none; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.45); } .status-shell-toggle-button .window-titlebar-sidebar-icon, .status-shell-toggle-button .window-titlebar-panel-icon, .status-shell-toggle-button .window-titlebar-assistant-icon { width: 12px; height: 12px; } .status-bar-item { display: flex; align-items: center; gap: 6px; padding: 0 8px; height: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .status-bar-item:hover { background-color: rgba(255, 255, 255, 0.1); } .status-bar-task-button { border: none; background: transparent; color: inherit; cursor: pointer; } .status-bar-item.theme-badge { border: 1px solid rgba(255, 255, 255, 0.18); border-radius: 3px; } .status-bar-item.language-badge { border: 1px solid rgba(255, 255, 255, 0.18); border-radius: 3px; gap: 4px; } .status-bar-item.offline-badge { border: none; background: transparent; color: inherit; cursor: pointer; opacity: 0.4; font-size: 13px; padding: 0 4px; } .status-bar-item.offline-badge.active { background-color: rgba(255, 196, 0, 0.28); opacity: 1; } .project-selector { position: relative; flex-shrink: 0; } .project-selector-trigger { display: flex; align-items: center; gap: 6px; padding: 0 8px; height: 22px; background: transparent; border: none; color: var(--vscode-statusBar-foreground); cursor: pointer; font-size: 12px; text-align: left; } .project-selector-trigger:hover { background-color: rgba(255, 255, 255, 0.1); } .project-selector-trigger:focus { outline: none; } .project-icon, .dropdown-arrow, .project-check-icon { flex-shrink: 0; } .project-name, .project-item-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .project-name { max-width: 180px; } .dropdown-arrow { opacity: 0.6; } .project-dropdown { position: absolute; left: 0; bottom: 100%; min-width: 220px; margin-bottom: 4px; background-color: #252526; border: 1px solid rgba(255, 255, 255, 0.16); border-radius: 4px; box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.3); z-index: 1000; overflow: hidden; } .project-dropdown-header { padding: 8px 12px; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; color: var(--vscode-descriptionForeground); border-bottom: 1px solid rgba(255, 255, 255, 0.12); } .project-list { max-height: 200px; overflow-y: auto; } .project-item { display: flex; align-items: center; width: 100%; gap: 8px; padding: 8px 12px; border: none; background: transparent; color: inherit; cursor: pointer; } .project-item:hover, .project-item.active { background-color: var(--vscode-list-hoverBackground); } .project-item.active .project-check-icon { color: #89d185; } .project-dropdown-footer { padding: 8px; border-top: 1px solid rgba(255, 255, 255, 0.12); display: grid; gap: 6px; } .create-project-btn, .existing-project-btn { display: flex; align-items: center; justify-content: center; gap: 6px; width: 100%; padding: 6px 12px; background-color: rgba(255, 255, 255, 0.12); color: inherit; border: none; border-radius: 4px; font-size: 12px; cursor: pointer; } .create-project-btn:hover, .existing-project-btn:hover { background-color: rgba(255, 255, 255, 0.18); } .status-bar-language-select { background: transparent; border: none; color: inherit; font: inherit; padding: 0; } .status-bar-language-select:focus { outline: none; } .status-bar-count { font-size: 11px; opacity: 0.85; } .status-bar-item.brand { font-weight: 600; } @media (max-width: 960px) { .editor-frame { grid-template-columns: minmax(0, 1fr); } .editor-meta { border-left: none; border-top: 1px solid var(--vscode-panel-border); padding-left: 0; padding-top: 10px; } } .editor-section ul { margin: 12px 0 0; padding-left: 18px; } .editor-toolbar { display: flex; gap: 10px; } .editor-toolbar button { padding: 9px 14px; border: 1px solid var(--line); border-radius: 999px; background: var(--panel-3); color: var(--ink); } .editor-meta { display: flex; flex-direction: column; gap: 12px; } .editor-meta-card, .assistant-card, .panel-entry { padding: 16px; } .sidebar-header, .assistant-header, .panel-header { display: flex; justify-content: space-between; gap: 12px; padding: 16px 18px; border-bottom: 1px solid var(--line); } .activity-bar { width: 48px; height: 100%; background-color: var(--vscode-activityBar-background); display: flex; flex-direction: column; justify-content: space-between; border-right: 1px solid var(--vscode-panel-border); } .activity-bar-top, .activity-bar-bottom { display: flex; flex-direction: column; align-items: center; padding: 4px 0; } .activity-bar-item { width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; background: transparent; border: none; color: var(--vscode-activityBar-foreground); opacity: 0.6; cursor: pointer; position: relative; padding: 0; border-radius: 0; } .activity-bar-item:hover { opacity: 1; background: transparent; } .activity-bar-item.active { opacity: 1; } .activity-bar-item.active::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 2px; background-color: var(--vscode-activityBar-foreground); } .activity-bar-badge { position: absolute; top: 8px; right: 8px; min-width: 16px; height: 16px; padding: 0 4px; font-size: 10px; font-weight: 600; background-color: var(--vscode-activityBarBadge-background); color: var(--vscode-activityBarBadge-foreground); border-radius: 8px; display: flex; align-items: center; justify-content: center; } .activity-bar-item svg, .tab-icon svg { display: block; } .sidebar-shell, .assistant-sidebar-shell { display: flex; min-width: 0; } .sidebar-shell { width: var(--sidebar-width); } .assistant-sidebar-shell { width: var(--assistant-width); } .sidebar, .assistant-sidebar { width: 100%; height: 100%; background: var(--vscode-sideBar-background); display: flex; flex-direction: column; min-width: 0; } .sidebar { border-right: 1px solid var(--vscode-sideBar-border); } .assistant-sidebar { border-left: 1px solid var(--vscode-sideBar-border); } .sidebar-shell.is-hidden, .assistant-sidebar-shell.is-hidden { width: 0; overflow: hidden; } .sidebar-shell.is-hidden .resizable-panel-divider, .assistant-sidebar-shell.is-hidden .resizable-panel-divider { display: none; } .resizable-panel-divider { width: 4px; cursor: col-resize; background: transparent; position: relative; } .resizable-panel-divider:hover::after { background-color: var(--vscode-focusBorder); } .resizable-panel-divider::after { content: ""; position: absolute; top: 0; bottom: 0; left: 1px; width: 1px; background-color: var(--vscode-panel-border); } .assistant-header { padding: 10px 12px; border-bottom: 1px solid var(--vscode-panel-border); } .assistant-header { display: flex; flex-direction: column; gap: 2px; } .assistant-card span, .panel-entry span, .editor-meta-row span, .editor-subtitle, .sidebar-item span { color: var(--vscode-descriptionForeground); } .sidebar-content, .assistant-content { flex: 1; overflow: auto; padding: 8px 0; } .sidebar-section { padding-bottom: 10px; } .sidebar-section-header { padding: 0 12px 6px; font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--vscode-descriptionForeground); } .sidebar-item { width: 100%; display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 7px 12px; border: none; cursor: pointer; border-radius: 4px; background: var(--vscode-sideBar-background); color: var(--vscode-foreground); } .sidebar-item:hover { background: var(--vscode-list-hoverBackground); } .sidebar-item.selected { outline: 1px solid var(--vscode-focusBorder); background: var(--vscode-list-activeSelectionBackground); color: var(--vscode-list-activeSelectionForeground); } .sidebar-badge { margin-top: 2px; padding: 1px 6px; border-radius: 10px; background: rgba(110, 203, 139, 0.16); color: var(--vscode-testing-iconPassed); } .sidebar-content { overflow-y: auto; overflow-x: hidden; padding: 0; } .sidebar-section { margin-bottom: 4px; padding-bottom: 0; } .sidebar-section-header { display: flex; align-items: center; justify-content: space-between; padding: 8px 12px; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; color: var(--vscode-sideBar-foreground); } .sidebar-section-title { display: flex; align-items: center; gap: 6px; padding: 4px 12px; font-size: 12px; color: var(--vscode-descriptionForeground); } .section-icon { font-size: 8px; } .section-icon.status-draft { color: var(--vscode-editorWarning-foreground); } .section-icon.status-published { color: var(--vscode-testing-iconPassed); } .section-icon.status-archived { color: var(--vscode-descriptionForeground); } .sidebar-list { display: flex; flex-direction: column; } .sidebar-item-row { display: flex; align-items: stretch; } .sidebar-item { width: 100%; display: flex; align-items: flex-start; gap: 8px; padding: 6px 12px 6px 12px; border: none; border-left: 2px solid transparent; border-radius: 0; background: transparent; color: inherit; cursor: pointer; text-align: left; } .sidebar-item:hover { background-color: var(--vscode-list-hoverBackground); } .sidebar-item.selected { background-color: var(--vscode-list-activeSelectionBackground); border-left-color: var(--vscode-focusBorder); color: var(--vscode-list-activeSelectionForeground); } .sidebar-post-item { flex-direction: row; } .sidebar-item.post-type-picture { background: linear-gradient(90deg, rgba(139, 92, 246, 0.05) 0%, transparent 100%); } .sidebar-item.post-type-aside { background: linear-gradient(90deg, rgba(245, 158, 11, 0.05) 0%, transparent 100%); } .sidebar-item.post-type-quote { background: linear-gradient(90deg, rgba(34, 197, 94, 0.05) 0%, transparent 100%); } .sidebar-item.post-type-link { background: linear-gradient(90deg, rgba(59, 130, 246, 0.05) 0%, transparent 100%); } .sidebar-item.post-type-video { background: linear-gradient(90deg, rgba(239, 68, 68, 0.05) 0%, transparent 100%); } .post-type-icon { font-size: 14px; line-height: 1.4; flex-shrink: 0; opacity: 0.85; } .sidebar-item-content { display: flex; flex: 1; min-width: 0; flex-direction: column; } .sidebar-item-title-row { display: flex; align-items: center; gap: 6px; } .sidebar-item-title { font-size: 13px; color: var(--vscode-sideBar-foreground); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .sidebar-item-language-badge { flex-shrink: 0; min-width: 18px; padding: 1px 5px; border-radius: 999px; background: var(--vscode-badge-background); @supports (color: color-mix(in lab, red, red)) { background: color-mix(in srgb, var(--vscode-badge-background) 82%, transparent); } color: var(--vscode-badge-foreground); font-size: 10px; font-weight: 700; text-align: center; } .sidebar-item-meta { font-size: 11px; color: var(--vscode-descriptionForeground); margin-top: 2px; } .media-grid { display: grid; grid-template-columns: 1fr; gap: 2px; padding: 4px; } .media-item-row { display: flex; align-items: stretch; gap: 4px; } .media-item { display: flex; align-items: center; gap: 8px; width: 100%; padding: 6px 8px; border: none; border-radius: 4px; background: transparent; color: inherit; text-align: left; } .media-item:hover { background-color: var(--vscode-list-hoverBackground); } .media-item.selected { background-color: var(--vscode-list-activeSelectionBackground); color: var(--vscode-list-activeSelectionForeground); } .media-thumbnail { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; background-color: var(--vscode-input-background); border-radius: 4px; flex-shrink: 0; overflow: hidden; font-size: 20px; } .media-thumbnail.has-image { position: relative; } .media-thumbnail-fallback { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; } .media-thumbnail-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity 0.15s ease; } .media-thumbnail.is-loaded .media-thumbnail-image { opacity: 1; } .media-thumbnail.is-loaded .media-thumbnail-fallback { opacity: 0; } .media-item-info { flex: 1; min-width: 0; } .media-item-name { font-size: 12px; color: var(--vscode-sideBar-foreground); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .media-item-size { font-size: 10px; color: var(--vscode-descriptionForeground); } .sidebar-item-row .sidebar-item, .media-item-row .media-item { flex: 1; min-width: 0; } .sidebar-actions { display: flex; gap: 4px; } .sidebar-action { background: transparent; border: none; padding: 2px; color: var(--vscode-sideBar-foreground); cursor: pointer; opacity: 0.7; display: flex; align-items: center; justify-content: center; border-radius: 3px; } .sidebar-action:hover { opacity: 1; background-color: var(--vscode-list-hoverBackground); } .sidebar-action.active { background-color: var(--vscode-list-activeSelectionBackground); opacity: 1; } .search-box { display: flex; align-items: center; gap: 4px; padding: 4px 12px 8px; position: relative; } .search-box input { flex: 1; min-width: 0; padding: 6px 28px 6px 8px; font-size: 12px; background-color: var(--vscode-input-background); border: 1px solid var(--vscode-input-border); color: var(--vscode-input-foreground); border-radius: 3px; } .search-box input::placeholder { color: var(--vscode-input-placeholderForeground); } .search-box input:focus { outline: none; border-color: var(--vscode-focusBorder); } .search-box button[type="submit"] { position: absolute; right: 40px; background: transparent; border: none; padding: 4px; color: var(--vscode-descriptionForeground); cursor: pointer; opacity: 0.7; } .search-box button[type="submit"]:hover { opacity: 1; } .search-box .clear-search { position: absolute; right: 16px; background: transparent; border: none; padding: 4px; color: var(--vscode-descriptionForeground); cursor: pointer; font-size: 10px; opacity: 0.7; } .search-box .clear-search:hover { opacity: 1; } .calendar-view { padding: 8px 12px; border-bottom: 1px solid var(--vscode-sideBar-border); } .calendar-header { display: flex; align-items: center; justify-content: space-between; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; color: var(--vscode-descriptionForeground); margin-bottom: 8px; } .calendar-header.collapsible-header { cursor: pointer; padding: 4px 6px; margin: 0 -6px 8px -6px; border-radius: 3px; user-select: none; } .calendar-header.collapsible-header:hover { background-color: var(--vscode-list-hoverBackground); } .calendar-header.collapsible-header.collapsed { margin-bottom: 0; } .calendar-header .collapse-icon { font-size: 9px; margin-right: 4px; opacity: 0.7; } .calendar-header .clear-filter { background: transparent; border: none; color: var(--vscode-descriptionForeground); cursor: pointer; font-size: 10px; padding: 2px 4px; opacity: 0.7; } .calendar-header .clear-filter:hover { opacity: 1; } .calendar-years { display: flex; flex-direction: column; gap: 2px; } .calendar-year-header { display: flex; align-items: center; gap: 6px; padding: 4px 6px; cursor: pointer; border-radius: 3px; font-size: 12px; color: var(--vscode-sideBar-foreground); background: transparent; text-align: left; } .calendar-year-header:hover { background-color: var(--vscode-list-hoverBackground); } .calendar-year-header.selected { background-color: var(--vscode-list-activeSelectionBackground); } .calendar-year-header .expand-icon { font-size: 8px; color: var(--vscode-descriptionForeground); width: 10px; } .calendar-year-header .year-label { flex: 1; } .calendar-year-header .year-count { font-size: 10px; color: var(--vscode-descriptionForeground); background-color: var(--vscode-badge-background); padding: 1px 6px; border-radius: 8px; } .calendar-months { display: flex; flex-direction: column; gap: 1px; padding-left: 16px; margin-top: 2px; } .calendar-month { display: flex; align-items: center; justify-content: space-between; padding: 3px 6px; cursor: pointer; border-radius: 3px; font-size: 12px; color: var(--vscode-sideBar-foreground); background: transparent; text-align: left; } .calendar-month:hover { background-color: var(--vscode-list-hoverBackground); } .calendar-month.selected { background-color: var(--vscode-list-activeSelectionBackground); } .calendar-month .month-count { font-size: 10px; color: var(--vscode-descriptionForeground); } .calendar-empty { font-size: 12px; color: var(--vscode-descriptionForeground); padding: 8px; text-align: center; } .month-count, .sidebar-section-count { font-size: 10px; color: var(--vscode-descriptionForeground); } .filter-panel { padding: 8px 12px; border-bottom: 1px solid var(--vscode-sideBar-border); } .filter-section { margin-bottom: 12px; } .filter-section:last-child { margin-bottom: 0; } .filter-header { display: flex; align-items: center; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; color: var(--vscode-descriptionForeground); margin-bottom: 6px; } .filter-header.collapsible-header { cursor: pointer; padding: 4px 6px; margin: 0 -6px 6px -6px; border-radius: 3px; user-select: none; } .filter-header.collapsible-header:hover { background-color: var(--vscode-list-hoverBackground); } .filter-header.collapsible-header.collapsed { margin-bottom: 0; } .filter-header .collapse-icon { font-size: 9px; margin-right: 4px; opacity: 0.7; } .filter-header .clear-filter { background: transparent; border: none; color: var(--vscode-descriptionForeground); cursor: pointer; font-size: 10px; padding: 2px 4px; margin-left: auto; opacity: 0.7; } .filter-header .clear-filter:hover { opacity: 1; } .filter-chips { display: flex; flex-wrap: wrap; gap: 4px; } .filter-chip { background-color: var(--vscode-button-secondaryBackground); color: var(--vscode-button-secondaryForeground); border: none; padding: 2px 8px; font-size: 11px; border-radius: 12px; cursor: pointer; transition: background-color 0.15s, opacity 0.15s; } .filter-chip:hover { background-color: var(--vscode-button-secondaryHoverBackground); } .filter-chip.active { background-color: var(--vscode-button-background); color: var(--vscode-button-foreground); } .filter-chip.has-color { border: 1px solid transparent; } .filter-chip.has-color:hover { opacity: 0.85; } .filter-chip.has-color.active { box-shadow: 0 0 0 2px var(--vscode-focusBorder, #007fd4); } .filter-status { display: flex; align-items: center; justify-content: space-between; padding: 6px 12px; font-size: 11px; color: var(--vscode-descriptionForeground); background-color: var(--vscode-list-hoverBackground); border-bottom: 1px solid var(--vscode-sideBar-border); } .filter-status button { background: transparent; border: none; color: var(--accent-color); cursor: pointer; font-size: 11px; padding: 0; } .filter-status button:hover { text-decoration: underline; background: transparent; } .sidebar-load-more { padding: 12px 16px; display: flex; justify-content: center; } .load-more-button { width: 100%; padding: 8px 16px; background-color: var(--vscode-button-secondaryBackground); color: var(--vscode-button-secondaryForeground); border: none; border-radius: 4px; font-size: 12px; cursor: pointer; transition: background-color 0.2s; } .load-more-button:hover:not(:disabled) { background-color: var(--vscode-button-secondaryHoverBackground); } .filter-section { padding-top: 4px; } .filter-header { width: 100%; padding: 6px 0; background: transparent; color: var(--vscode-foreground); text-align: left; } .filter-chips { flex-direction: row; flex-wrap: wrap; } .filter-chip { padding: 5px 10px; border-radius: 999px; background: var(--vscode-input-background); color: var(--vscode-foreground); } .filter-status { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--vscode-descriptionForeground); font-size: 12px; } .filter-status button, .load-more-button { padding: 6px 10px; border-radius: 6px; background: var(--vscode-input-background); color: var(--vscode-foreground); } .sidebar-load-more { padding-bottom: 12px; } .load-more-button { width: 100%; } .media-item-info { display: flex; flex-direction: column; gap: 2px; } .media-item-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .media-item-size { color: var(--vscode-descriptionForeground); font-size: 12px; } .chat-list-item { display: flex; align-items: center; width: 100%; padding: 8px 12px; border: none; border-bottom: 1px solid var(--vscode-sideBar-border); background: transparent; color: inherit; text-align: left; } .chat-list-item:hover { background: var(--vscode-list-hoverBackground); } .chat-list-item.active { background: var(--vscode-list-activeSelectionBackground); color: var(--vscode-list-activeSelectionForeground); } .chat-item-content { display: flex; flex: 1; min-width: 0; flex-direction: column; gap: 2px; } .chat-item-open { display: flex; flex: 1; min-width: 0; padding: 0; border: none; background: transparent; color: inherit; text-align: left; } .chat-item-open:hover { background: transparent; } .chat-item-open:focus-visible { outline: 1px solid var(--vscode-focusBorder); outline-offset: 2px; } .chat-item-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .chat-item-date { color: var(--vscode-descriptionForeground); font-size: 12px; } .sidebar-delete-button { background: transparent; border: none; color: var(--vscode-descriptionForeground); cursor: pointer; font-size: 16px; line-height: 1; padding: 0 6px; flex-shrink: 0; opacity: 1; transition: opacity 0.15s, color 0.15s; } .sidebar-item-row:hover .sidebar-delete-button, .sidebar-item-row .sidebar-item.selected ~ .sidebar-delete-button, .media-item-row:hover .sidebar-delete-button, .media-item-row .media-item.selected ~ .sidebar-delete-button, .chat-list-item:hover .sidebar-delete-button, .chat-list-item.active .sidebar-delete-button { opacity: 1; } .sidebar-delete-button:hover { color: var(--vscode-errorForeground); } .sidebar-item-row .sidebar-item.selected ~ .sidebar-delete-button, .media-item-row .media-item.selected ~ .sidebar-delete-button { background-color: var(--vscode-list-activeSelectionBackground); color: var(--vscode-list-activeSelectionForeground); } .settings-nav-list { display: flex; flex-direction: column; gap: 6px; padding: 0 12px 12px; } .settings-nav-entry { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px 12px; border: none; border-radius: 10px; background: transparent; color: inherit; text-align: left; } .settings-nav-entry:hover { background: var(--vscode-list-hoverBackground); } .settings-nav-entry-icon { width: 18px; flex: 0 0 18px; text-align: center; } .sidebar-empty { padding: 16px 12px; color: var(--vscode-descriptionForeground); } @media (max-width: 820px) { .dashboard-stats { grid-template-columns: 1fr; } .recent-post-item { align-items: flex-start; flex-wrap: wrap; } .media-grid { grid-template-columns: 1fr; } } .tab-bar { display: flex; align-items: center; background-color: var(--vscode-editorGroupHeader-tabsBackground); border-bottom: 1px solid var(--vscode-editorGroupHeader-tabsBorder); height: 35px; overflow: hidden; flex-shrink: 0; position: relative; } .tab-bar-tabs { display: flex; align-items: center; height: 100%; overflow-x: auto; overflow-y: hidden; flex: 1; } .tab-bar-tabs::-webkit-scrollbar { height: 0; display: none; } .tab-bar-empty { display: flex; align-items: center; height: 100%; padding: 0 12px; color: var(--vscode-descriptionForeground); font-size: 12px; } .tab { display: flex; align-items: center; gap: 4px; padding: 0 6px 0 10px; height: 100%; min-width: 100px; max-width: 180px; cursor: pointer; background-color: var(--vscode-tab-inactiveBackground); border: none; border-right: 1px solid var(--vscode-tab-border); color: var(--vscode-tab-inactiveForeground); font-size: 13px; user-select: none; position: relative; flex-shrink: 0; } .tab-select { display: flex; align-items: center; gap: 4px; min-width: 0; flex: 1; height: 100%; padding: 0; background: transparent; border: none; color: inherit; font: inherit; cursor: inherit; } .tab:hover { background-color: var(--vscode-list-hoverBackground); } .tab.active { background-color: var(--vscode-tab-activeBackground); color: var(--vscode-tab-activeForeground); } .tab.active::after { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 1px; background-color: var(--vscode-focusBorder); } .tab.transient .tab-title { font-style: italic; } .tab-actions { display: flex; align-items: center; gap: 2px; margin-left: auto; flex-shrink: 0; } .tab-dirty-indicator { color: var(--vscode-editorWarning-foreground, #e2c08d); font-size: 10px; line-height: 1; } .tab-icon { display: flex; align-items: center; justify-content: center; flex-shrink: 0; opacity: 0.85; } .tab-title, .status-bar-item { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .tab-close { width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; font-size: 15px; line-height: 1; color: var(--vscode-icon-foreground, #c5c5c5); border-radius: 3px; cursor: pointer; flex-shrink: 0; border: none; background: transparent; padding: 0; opacity: 0; } .tab:hover .tab-close { opacity: 0.7; } .tab.active .tab-close { opacity: 0.7; } .tab-close:hover { opacity: 1 !important; background-color: var(--vscode-toolbar-hoverBackground); color: var(--vscode-tab-activeForeground); } .tab-close:active { background-color: var(--vscode-toolbar-activeBackground, rgba(99, 102, 103, 0.31)); } .tab.dirty .tab-dirty-indicator { display: block; } .tab.dirty .tab-close { display: none; } .tab.dirty:hover .tab-close { display: flex; opacity: 0.7; } .tab.dirty:hover .tab-dirty-indicator { display: none; } .tab:focus-visible { outline: 1px solid var(--vscode-focusBorder, #007fd4); outline-offset: -1px; } .output-item-details { margin: 4px 0 0; padding: 8px; border-radius: 4px; background: rgba(255, 255, 255, 0.03); color: inherit; font: 11px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; white-space: pre-wrap; user-select: text; } .editor-shell { flex: 1; min-height: 0; overflow: auto; background: var(--vscode-editor-background); } .editor-frame { display: grid; grid-template-columns: minmax(0, 1fr) 240px; gap: 16px; padding: 14px 16px; } .editor-main, .editor-meta, .panel-shell, .assistant-card { min-width: 0; } .editor-kicker { font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--vscode-descriptionForeground); } .editor-title { margin: 10px 0 6px; font-size: 24px; font-weight: 600; } .editor-subtitle { margin: 0 0 14px; } .editor-toolbar { display: flex; gap: 8px; margin-bottom: 14px; } .editor-toolbar-button { border: 1px solid var(--vscode-panel-border); background: transparent; color: var(--vscode-foreground); padding: 4px 8px; border-radius: 3px; } .editor-toolbar-button:hover, .panel-tab:hover { background: var(--vscode-toolbar-hoverBackground); } .editor-section { padding-top: 4px; } .editor-section h2 { margin: 0 0 8px; font-size: 16px; } .editor-list { margin: 0; padding-left: 18px; line-height: 1.5; } .editor-list.compact li { margin-bottom: 6px; } .editor-meta { border-left: 1px solid var(--vscode-panel-border); padding-left: 16px; } .editor-meta-row { display: flex; flex-direction: column; gap: 3px; padding: 10px 0; border-bottom: 1px solid var(--vscode-panel-border); } .post-editor .post-editor-markdown-surface, .scripts-monaco.monaco-editor-shell, .templates-monaco.monaco-editor-shell { min-height: 0; background: var(--vscode-editor-background); color: var(--vscode-editor-foreground); border-color: var(--vscode-panel-border); } .post-editor .monaco-editor-instance, .scripts-monaco .monaco-editor-instance, .templates-monaco .monaco-editor-instance { min-height: 0; background: var(--vscode-editor-background); } .monaco-editor-shell .monaco-editor, .monaco-editor-shell .monaco-editor .margin, .monaco-editor-shell .monaco-editor-background, .monaco-editor-shell .monaco-editor .inputarea.ime-input { background-color: var(--vscode-editor-background) !important; } .monaco-editor-shell .monaco-editor, .monaco-editor-shell .monaco-editor .view-line { color: var(--vscode-editor-foreground) !important; } .monaco-editor-shell .monaco-editor .line-numbers { color: var(--vscode-editorLineNumber-foreground, #858585) !important; } .monaco-editor-shell .monaco-editor .current-line, .monaco-editor-shell .monaco-editor .view-overlays .current-line { border-color: var(--vscode-editor-lineHighlightBorder, transparent) !important; } .help-doc-view { --doc-bg: var(--panel-1, #1e1e1e); --doc-surface: var(--panel-2, #252526); --doc-border: var(--line, #3c3c3c); --doc-text: var(--vscode-editor-foreground, #d4d4d4); --doc-muted: var(--vscode-descriptionForeground, #9da3ad); --doc-link: var(--vscode-textLink-foreground, #9cdcfe); --doc-code-bg: var(--vscode-textCodeBlock-background, rgba(0, 0, 0, 0.2)); --doc-hover: var(--vscode-list-hoverBackground, rgba(255, 255, 255, 0.06)); } .help-doc-view .misc-editor-content { padding: 0; overflow: hidden; } .documentation-view, .documentation-scroll { background: var(--doc-bg, var(--vscode-editor-background)); } .documentation-view { display: flex; flex-direction: column; min-height: 0; height: 100%; } .documentation-scroll { flex: 1; min-height: 0; overflow: auto; padding: 28px 24px 40px; } .documentation-content { max-width: 920px; margin: 0 auto; color: var(--doc-text, var(--vscode-editor-foreground)); } .documentation-article, .help-doc-markdown { background: var(--doc-surface); padding: 18px 20px 24px; border: 1px solid var(--doc-border); border-radius: 10px; box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18); } .documentation-content.markdown-body > .documentation-article > :first-child { margin-top: 0; } .documentation-content.markdown-body > .documentation-article > :last-child { margin-bottom: 0; } .documentation-content.markdown-body h1, .documentation-content.markdown-body h2, .documentation-content.markdown-body h3 { color: var(--doc-text); border-bottom: 1px solid var(--doc-border); padding-bottom: 6px; line-height: 1.25; } .documentation-content.markdown-body h1 { font-size: 1.9rem; } .documentation-content.markdown-body h2 { margin-top: 2rem; font-size: 1.35rem; } .documentation-content.markdown-body h3 { margin-top: 1.6rem; font-size: 1.05rem; } .documentation-content.markdown-body p, .documentation-content.markdown-body li, .documentation-content.markdown-body td, .documentation-content.markdown-body th { line-height: 1.6; } .documentation-content.markdown-body a { color: var(--doc-link); text-decoration-thickness: 1px; text-underline-offset: 0.14em; } .documentation-content.markdown-body a:hover { color: var(--doc-text); } .documentation-content.markdown-body hr { border: 0; border-top: 1px solid var(--doc-border); opacity: 0.8; } .documentation-content.markdown-body code { background: var(--doc-code-bg); padding: 0.12em 0.4em; border-radius: 4px; font: 0.92em/1.45 "SFMono-Regular", Menlo, Monaco, Consolas, monospace; } .documentation-content.markdown-body pre { margin: 0.9rem 0 1.2rem; background: var(--doc-code-bg); border: 1px solid var(--doc-border); border-radius: 8px; padding: 14px 16px; overflow: auto; } .documentation-content.markdown-body pre code { padding: 0; background: transparent; font-size: 0.9em; } .documentation-content.markdown-body blockquote { margin: 1rem 0; padding: 0 0 0 12px; border-left: 3px solid var(--doc-border); color: var(--doc-muted); } .documentation-content.markdown-body table { width: 100%; margin: 1rem 0 1.4rem; border-collapse: collapse; display: table; } .documentation-content.markdown-body th, .documentation-content.markdown-body td { border: 1px solid var(--doc-border); padding: 8px 10px; text-align: left; vertical-align: top; } .documentation-content.markdown-body th { background: var(--doc-hover); font-weight: 700; } .documentation-content.markdown-body ul, .documentation-content.markdown-body ol { margin: 0.85rem 0 1rem; padding-left: 1.5rem; display: block; } .documentation-content.markdown-body ul { list-style: disc; } .documentation-content.markdown-body ol { list-style: decimal; } .documentation-content.markdown-body li { margin: 0.3rem 0; } .documentation-content.markdown-body li > ul, .documentation-content.markdown-body li > ol { margin-top: 0.35rem; margin-bottom: 0.35rem; } .documentation-content.markdown-body strong { color: var(--doc-text); } .documentation-content.markdown-body img { max-width: 100%; height: auto; } .post-editor.editor, .scripts-view-shell.editor, .templates-view-shell.editor { flex: 1; display: flex; flex-direction: column; background-color: var(--vscode-editor-background); overflow: hidden; } .post-editor .editor-tab-dirty { color: var(--vscode-notificationsWarningIcon-foreground, var(--vscode-editorWarning-foreground)); font-size: 10px; } .post-editor .editor-tab-meta { color: var(--vscode-descriptionForeground); font-size: 11px; white-space: nowrap; } .post-editor .quick-actions-wrapper { position: relative; display: inline-block; } .post-editor .quick-actions-btn { display: flex; align-items: center; gap: 4px; white-space: nowrap; } .post-editor .quick-actions-btn-icon { font-size: 12px; line-height: 1; } .post-editor .quick-actions-divider { height: 1px; background: var(--vscode-dropdown-border, #454545); } .post-editor .quick-action-icon { font-size: 16px; flex-shrink: 0; margin-top: 2px; } .post-editor .quick-action-text strong { font-size: 13px; font-weight: 500; } .post-editor .quick-action-text small { font-size: 11px; opacity: 0.7; } .post-editor .status-badge, .scripts-view-shell.editor .status-badge, .templates-view-shell.editor .status-badge { padding: 2px 8px; border-radius: 10px; font-size: 11px; font-weight: 500; text-transform: uppercase; } .post-editor .status-badge.status-draft, .scripts-view-shell.editor .status-badge.status-draft, .templates-view-shell.editor .status-badge.status-draft { background-color: rgba(204, 167, 0, 0.2); color: var(--vscode-notificationsWarningIcon-foreground, var(--vscode-editorWarning-foreground)); } .post-editor .status-badge.status-published, .scripts-view-shell.editor .status-badge.status-published, .templates-view-shell.editor .status-badge.status-published { background-color: rgba(115, 201, 145, 0.2); color: var(--vscode-testing-iconPassed); } .post-editor .status-badge.status-archived, .scripts-view-shell.editor .status-badge.status-archived, .templates-view-shell.editor .status-badge.status-archived { background-color: rgba(133, 133, 133, 0.2); color: var(--vscode-descriptionForeground); } .post-editor .auto-save-indicator { font-size: 11px; color: var(--vscode-descriptionForeground); font-style: italic; } .post-editor .metadata-toggle { display: flex; align-items: center; gap: 8px; padding: 6px 4px; background: none; border: none; color: var(--vscode-descriptionForeground); font-size: 11px; font-weight: 500; text-transform: uppercase; letter-spacing: 0.5px; cursor: pointer; transition: color 0.15s; flex-shrink: 0; } .post-editor .metadata-toggle:hover { color: var(--vscode-foreground); } .post-editor .metadata-toggle-chevron { font-size: 10px; } .post-editor .editor-header-row.is-collapsed { display: none; } .post-editor .editor-media-panel { width: 200px; flex-shrink: 0; } .post-editor .editor-field label, .post-editor .editor-body label, .post-editor .post-editor-links-label { font-size: 11px; font-weight: 500; color: var(--vscode-descriptionForeground); text-transform: uppercase; letter-spacing: 0.5px; } .post-editor .editor-checkbox-label { display: inline-flex; align-items: center; gap: 8px; text-transform: none; letter-spacing: 0; color: var(--vscode-foreground); } .post-editor .post-editor-input.is-readonly { opacity: 0.7; cursor: not-allowed; } .post-editor .post-editor-excerpt { min-height: 96px; } .post-editor .tag-input-container { position: relative; width: 100%; } .post-editor .tag-input-container.is-disabled { opacity: 0.72; } .post-editor .tag-input-wrapper { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 6px 8px; min-height: 38px; border: 1px solid var(--vscode-input-border, #3c3c3c); border-radius: 4px; background: var(--vscode-input-background, #3c3c3c); cursor: text; } .post-editor .tag-input-wrapper:focus-within { border-color: var(--vscode-focusBorder, #007fd4); outline: none; } .post-editor .tag-chip { display: inline-flex; align-items: center; gap: 4px; padding: 3px 8px; font-size: 0.85rem; background: var(--vscode-badge-background, #4d4d4d); border: 1px solid var(--vscode-widget-border, #454545); border-radius: 4px; color: var(--vscode-badge-foreground, #ffffff); white-space: nowrap; } .post-editor .tag-chip.has-color { border-radius: 12px; padding: 3px 10px; } .post-editor .tag-chip-remove { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; padding: 0; margin-left: 2px; border: none; background: transparent; color: inherit; font-size: 1rem; line-height: 1; cursor: pointer; opacity: 0.6; border-radius: 50%; transition: opacity 0.15s, background 0.15s; } .post-editor .tag-chip-remove:hover { opacity: 1; background: rgba(0, 0, 0, 0.1); } .post-editor .tag-chip.has-color .tag-chip-remove:hover { background: rgba(0, 0, 0, 0.2); } .post-editor .tag-input-field { flex: 1; min-width: 120px; padding: 2px 4px; border: none; background: transparent; color: var(--vscode-input-foreground, #cccccc); font-family: inherit; font-size: 0.9rem; outline: none; } .post-editor .tag-input-field::placeholder { color: var(--vscode-input-placeholderForeground, #a6a6a6); } .post-editor .tag-input-field:disabled { cursor: not-allowed; } .post-editor .tag-suggestions { position: absolute; top: 100%; left: 0; right: 0; margin-top: 4px; padding: 4px; background: var(--vscode-dropdown-background, #3c3c3c); border: 1px solid var(--vscode-widget-border, #454545); border-radius: 6px; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(0, 0, 0, 0.2); z-index: 1000; max-height: 240px; overflow-y: auto; } .post-editor .tag-suggestion { display: flex; align-items: center; gap: 8px; width: 100%; padding: 8px 12px; border: none; background: transparent; color: var(--vscode-dropdown-foreground, #f0f0f0); font-family: inherit; font-size: 0.9rem; text-align: left; cursor: pointer; border-radius: 4px; transition: background 0.1s; } .post-editor .tag-suggestion:hover, .post-editor .tag-suggestion.selected { background: var(--vscode-list-hoverBackground, #2a2d2e); } .post-editor .tag-suggestion-color { width: 12px; height: 12px; border-radius: 50%; flex-shrink: 0; } .post-editor .tag-suggestion-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .post-editor .tag-suggestion.create-new { border-top: 1px solid var(--vscode-widget-border, #454545); margin-top: 4px; padding: 6px 8px; padding-top: 12px; color: var(--vscode-notificationsInfoIcon-foreground, #75beff); } .post-editor .tag-suggestion.create-new:first-child { border-top: none; margin-top: 0; padding-top: 8px; } .post-editor .tag-suggestion-icon { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; border: 1px dashed currentColor; border-radius: 4px; font-size: 0.9rem; font-weight: 600; } .post-editor .editor-language-row select { flex: 1; min-width: 0; } .post-editor .editor-translation-flag { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; padding: 0; border: 1px solid transparent; border-radius: 999px; background: transparent; font-size: 14px; line-height: 1; cursor: pointer; flex: 0 0 auto; } .post-editor .editor-translation-flag.status-draft { opacity: 0.82; } .post-editor .editor-translation-flag.status-archived { opacity: 0.45; filter: grayscale(0.35); } .post-editor .editor-translation-flag.active { border-color: var(--vscode-testing-iconQueued, #cca700); background: var(--vscode-testing-iconQueued, #cca700); @supports (color: color-mix(in lab, red, red)) { background: color-mix(in srgb, var(--vscode-testing-iconQueued, #cca700) 14%, transparent); } } .post-editor .editor-translation-flag:hover { background: var(--vscode-list-hoverBackground); @supports (color: color-mix(in lab, red, red)) { background: color-mix(in srgb, var(--vscode-list-hoverBackground) 75%, transparent); } } .post-editor .post-editor-links-panel, .post-editor .post-editor-side-panel { padding: 12px; border: 1px solid var(--vscode-panel-border); border-radius: 8px; background: var(--vscode-editor-background); @supports (color: color-mix(in lab, red, red)) { background: color-mix(in srgb, var(--vscode-editor-background) 82%, white 3%); } } .post-editor .post-editor-side-panel-header { display: flex; align-items: center; justify-content: space-between; gap: 10px; } .post-editor .post-editor-links-columns { display: flex; gap: 18px; align-items: flex-start; margin-top: 10px; } .post-editor .post-editor-links-columns > div { flex: 1; min-width: 0; } .post-editor .post-editor-empty, .post-editor .post-editor-media-meta { color: var(--vscode-descriptionForeground); font-size: 12px; } .post-editor .post-editor-media-list { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-direction: column; gap: 8px; } .post-editor .post-editor-media-item { display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; border-radius: 6px; background: rgba(255, 255, 255, 0.03); } .post-editor .editor-body { flex: 1; display: flex; flex-direction: column; gap: 4px; min-height: 320px; } .post-editor .editor-toolbar { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; margin-bottom: 8px; } .post-editor .editor-toolbar-left { display: flex; align-items: center; justify-content: flex-start; } .post-editor .editor-toolbar-center { display: flex; align-items: center; justify-content: center; } .post-editor .editor-toolbar-right { display: flex; align-items: center; justify-content: flex-end; gap: 6px; min-width: 0; flex-wrap: wrap; } .post-editor .editor-mode-toggle { display: flex; gap: 4px; } .post-editor .editor-mode-toggle button, .post-editor .editor-toolbar-button { padding: 4px 12px; font-size: 12px; border-radius: 4px; border: none; cursor: pointer; transition: background-color 0.15s; } .post-editor .editor-mode-toggle button { background-color: var(--vscode-button-secondaryBackground, rgba(255, 255, 255, 0.08)); color: var(--vscode-button-secondaryForeground, var(--vscode-foreground)); } .post-editor .editor-mode-toggle button:hover, .post-editor .editor-toolbar-button:hover { background-color: var(--vscode-button-secondaryHoverBackground, var(--vscode-toolbar-hoverBackground)); } .post-editor .editor-mode-toggle button.active { background-color: var(--vscode-button-background, var(--accent-color)); color: var(--vscode-button-foreground, #ffffff); } .post-editor .editor-toolbar-button { background: var(--vscode-button-secondaryBackground, rgba(255, 255, 255, 0.08)); color: var(--vscode-button-secondaryForeground, var(--vscode-foreground)); } .post-editor .editor-excerpt-panel.is-collapsed { display: none; } .post-editor .gallery-button { padding: 4px 12px; font-size: 12px; border-radius: 4px; background-color: var(--vscode-button-secondaryBackground); color: var(--vscode-button-secondaryForeground); border: none; cursor: pointer; transition: background-color 0.15s; } .post-editor .gallery-button:hover { background-color: var(--vscode-button-secondaryHoverBackground); } .post-editor .insert-post-link-button, .post-editor .insert-media-button { padding: 4px 8px; font-size: 14px; border-radius: 4px; background-color: var(--vscode-button-secondaryBackground); color: var(--vscode-button-secondaryForeground); border: none; cursor: pointer; transition: background-color 0.15s; } .post-editor .insert-post-link-button:hover, .post-editor .insert-media-button:hover { background-color: var(--vscode-button-secondaryHoverBackground); } .post-editor .editor-preview { flex: 1; background-color: var(--vscode-input-background); border-radius: 4px; overflow: hidden; position: relative; min-height: 240px; padding: 0; border: none; } .post-editor .editor-preview { flex: 1; min-height: 240px; padding: 14px; background-color: var(--vscode-input-background); border: 1px solid var(--vscode-panel-border); border-radius: 4px; overflow: auto; line-height: 1.6; } .post-editor .editor-preview-frame { width: 100%; min-height: 520px; border: none; background: #ffffff; } .post-editor .post-editor-markdown-surface { position: relative; flex: 1; min-height: 380px; border: 1px solid var(--vscode-input-border, var(--vscode-panel-border)); border-radius: 4px; background: var(--vscode-input-background); overflow: hidden; } .post-editor .monaco-editor-shell, .scripts-monaco.monaco-editor-shell, .templates-monaco.monaco-editor-shell { position: relative; } .monaco-editor-instance { width: 100%; height: 100%; min-height: 100%; } .post-editor .monaco-editor-instance { min-height: 380px; } .scripts-monaco .monaco-editor-instance, .templates-monaco .monaco-editor-instance { min-height: 420px; } .monaco-editor-input { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: pre; border: 0; } .post-editor .editor-footer { display: flex; align-items: center; gap: 16px; padding: 8px 16px; border-top: 1px solid var(--vscode-panel-border); background-color: var(--vscode-sideBar-background); color: var(--vscode-descriptionForeground); font-size: 12px; flex-wrap: wrap; } @media (max-width: 980px) { .post-editor .editor-header, .scripts-view-shell.editor .editor-header, .templates-view-shell.editor .editor-header, .post-editor .metadata-toggle-header, .post-editor .editor-toolbar { display: flex; flex-direction: column; align-items: flex-start; } .post-editor .editor-header-row, .post-editor .editor-field-row, .post-editor .post-editor-links-columns { flex-direction: column; } .post-editor .editor-media-panel { width: 100%; } .post-editor .editor-toolbar-right, .post-editor .editor-actions, .scripts-view-shell.editor .editor-actions, .templates-view-shell.editor .editor-actions { justify-content: flex-start; } } .settings-view, .style-view { height: 100%; display: flex; flex-direction: column; } .settings-header, .style-view-header { padding: 18px 20px; border-bottom: 1px solid var(--line, #3c3c3c); display: flex; align-items: center; justify-content: space-between; gap: 16px; } .settings-search input { width: min(320px, 40vw); } .settings-content { padding: 20px; overflow: auto; display: flex; flex-direction: column; gap: 18px; } .setting-section { border: 1px solid var(--line, #3c3c3c); border-radius: 12px; background: var(--panel-2, #252526); } .setting-section-header { padding: 14px 16px; border-bottom: 1px solid var(--line, #3c3c3c); } .setting-section-content { padding: 16px; display: flex; flex-direction: column; gap: 14px; } .setting-row { display: grid; grid-template-columns: minmax(180px, 240px) minmax(0, 1fr); gap: 16px; align-items: start; } .setting-label { font-weight: 600; } .setting-control, .setting-input-group { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; } .setting-actions { padding: 0 16px 16px; display: flex; gap: 10px; flex-wrap: wrap; } .style-theme-picker { padding: 20px; display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 14px; } .style-theme-option { border: 1px solid var(--line, #3c3c3c); background: var(--panel-2, #252526); border-radius: 14px; padding: 14px; text-align: left; cursor: pointer; } .style-theme-option.selected { border-color: var(--accent-color); box-shadow: 0 0 0 1px var(--accent-color); } .style-theme-swatch { display: flex; flex-direction: column; gap: 12px; } .style-theme-tones { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 8px; } .style-theme-tone { height: 42px; border-radius: 10px; border: 1px solid rgba(255, 255, 255, 0.08); } .style-apply-row { padding: 0 20px 20px; display: flex; gap: 12px; align-items: center; justify-content: space-between; flex-wrap: wrap; } .style-preview-container { padding: 0 20px 20px; flex: 1; min-height: 0; } .style-preview-frame { width: 100%; height: 100%; min-height: 420px; border: 1px solid var(--line, #3c3c3c); border-radius: 14px; background: #ffffff; } @media (max-width: 1100px) { .setting-row { grid-template-columns: 1fr; } } .panel-shell { min-height: 160px; max-height: 160px; border-top: 1px solid var(--line); } .panel-shell.is-hidden { display: none; } .panel-tabs { display: flex; gap: 8px; } .panel-tabs { display: flex; gap: 2px; } .panel-tab { background: transparent; border: none; padding: 6px 12px; font-size: 12px; color: var(--vscode-tab-inactiveForeground); cursor: pointer; border-bottom: 2px solid transparent; border-radius: 0; } .panel-tab:hover { color: var(--vscode-tab-activeForeground); background: transparent; } .panel-tab.active { color: var(--vscode-tab-activeForeground); border-bottom-color: var(--vscode-focusBorder); background: transparent; } .assistant-content { display: flex; flex-direction: column; gap: 12px; padding: 12px; } .assistant-sidebar-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; } .assistant-sidebar-heading { display: flex; flex-direction: column; gap: 4px; } .assistant-sidebar-description, .assistant-sidebar-context-text, .assistant-sidebar-message-content { color: var(--vscode-descriptionForeground); } .assistant-sidebar-status { border-radius: 999px; border: 1px solid var(--vscode-panel-border); padding: 2px 8px; font-size: 11px; line-height: 1.4; } .assistant-sidebar-status.is-offline { background: rgba(255, 196, 0, 0.18); border-color: rgba(255, 196, 0, 0.35); color: var(--vscode-editor-foreground); } .assistant-sidebar-context { display: flex; flex-direction: column; gap: 10px; padding: 8px; border: 1px solid var(--vscode-panel-border); border-radius: 6px; background: var(--vscode-editorWidget-background, rgba(0, 0, 0, 0.2)); } .assistant-sidebar-context-row { display: flex; justify-content: space-between; gap: 12px; } .assistant-sidebar-context-label, .assistant-sidebar-message-role { font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--vscode-descriptionForeground); } .assistant-sidebar-context-value { text-align: right; color: var(--vscode-editor-foreground); } .assistant-sidebar-context-text, .assistant-sidebar-message-content { margin: 0; white-space: pre-wrap; } .assistant-sidebar-prompt-form, .assistant-sidebar-welcome, .assistant-sidebar-transcript { display: flex; flex-direction: column; gap: 10px; } .assistant-sidebar-prompt { width: 100%; min-height: 120px; resize: vertical; border: 1px solid var(--vscode-input-border); border-radius: 6px; background: var(--vscode-input-background); color: var(--vscode-input-foreground); padding: 10px; font: inherit; } .assistant-sidebar-prompt:focus { outline: 1px solid var(--vscode-focusBorder); outline-offset: 1px; } .assistant-sidebar-start-button { align-self: flex-start; border: 1px solid var(--vscode-button-border, transparent); border-radius: 999px; background: var(--vscode-button-background); color: var(--vscode-button-foreground); padding: 7px 14px; cursor: pointer; } .assistant-sidebar-start-button:disabled { cursor: default; opacity: 0.55; } .assistant-card, .assistant-sidebar-message { display: flex; flex-direction: column; gap: 6px; padding: 12px; border: 1px solid var(--vscode-panel-border); border-radius: 6px; border-bottom-width: 1px; background: var(--vscode-editorWidget-background, rgba(0, 0, 0, 0.2)); } .assistant-sidebar-message.user { background: var(--vscode-list-hoverBackground); } .assistant-sidebar-message.assistant { background: var(--vscode-editorWidget-background, rgba(0, 0, 0, 0.2)); } .status-bar { height: 22px; display: flex; align-items: center; justify-content: space-between; background-color: var(--vscode-statusBar-background); color: var(--vscode-statusBar-foreground); font-size: 12px; padding: 0 8px; user-select: none; flex-wrap: nowrap; gap: 0; border-top: none; } .status-bar-left, .status-bar-right { display: flex; align-items: center; gap: 4px; flex-shrink: 0; min-width: 0; } .status-bar-item { display: flex; align-items: center; gap: 6px; padding: 0 8px; height: 100%; max-width: none; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; border-radius: 0; background: transparent; font-size: 12px; } .status-bar-item .task-message-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 300px; } .task-spinner { width: 10px; height: 10px; border: 2px solid rgba(255, 255, 255, 0.3); border-top-color: white; border-radius: 50%; animation: spin 0.8s linear infinite; } @keyframes spin { to { transform: rotate(360deg); } } .panel-content { padding: 8px; } .task-list { gap: 4px; } .output-list, .git-log-list { gap: 6px; } .task-entry { padding: 8px; border-bottom: none; border-radius: 4px; background-color: var(--vscode-sideBar-background); } .output-entry { padding: 8px; border-bottom: none; border-radius: 4px; background-color: var(--vscode-sideBar-background); font-size: 12px; color: var(--vscode-editor-foreground); } @media (max-width: 1100px) { .editor-frame { grid-template-columns: 1fr; } .assistant-sidebar-shell { display: none; } .dashboard-grid { grid-template-columns: 1fr; } } .text-muted { color: var(--vscode-descriptionForeground); } .editor-empty { flex: 1; display: flex; align-items: flex-start; justify-content: center; background-color: var(--vscode-editor-background); overflow-y: auto; padding: 40px 20px; } .dashboard-content { max-width: 720px; width: 100%; } .dashboard-content h1 { font-size: 24px; font-weight: 400; margin: 0 0 4px; color: var(--vscode-editor-foreground); } .dashboard-content > .text-muted { margin-bottom: 24px; display: block; } .dashboard-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 24px; } .stat-card { padding: 16px; background-color: var(--vscode-sideBar-background); border-radius: 6px; } .stat-number { font-size: 32px; font-weight: 600; color: var(--vscode-editor-foreground); line-height: 1; margin-bottom: 4px; } .stat-label { font-size: 12px; color: var(--vscode-descriptionForeground); text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 10px; } .stat-breakdown { display: flex; flex-wrap: wrap; gap: 6px; } .stat-tag { font-size: 11px; padding: 2px 8px; border-radius: 3px; background-color: var(--vscode-input-background); color: var(--vscode-descriptionForeground); } .stat-published { color: var(--vscode-testing-iconPassed); } .stat-draft { color: var(--vscode-editorWarning-foreground); } .stat-archived { color: var(--vscode-descriptionForeground); } .dashboard-section { background-color: var(--vscode-sideBar-background); border-radius: 6px; padding: 16px; margin-bottom: 12px; } .dashboard-section h4 { font-size: 11px; font-weight: 600; color: var(--vscode-descriptionForeground); text-transform: uppercase; letter-spacing: 0.5px; margin: 0 0 12px; } .timeline-chart { display: flex; align-items: flex-end; gap: 4px; height: 100px; } .timeline-bar-container { flex: 1; display: flex; flex-direction: column; align-items: center; height: 100%; } .timeline-bar { width: 100%; max-width: 40px; background-color: var(--vscode-activityBarBadge-background); border-radius: 3px 3px 0 0; margin-top: auto; min-height: 4px; position: relative; transition: opacity 0.15s; } .timeline-bar:hover { opacity: 0.8; } .timeline-bar-count { position: absolute; top: -16px; left: 50%; transform: translateX(-50%); font-size: 10px; color: var(--vscode-descriptionForeground); } .timeline-bar-label { display: flex; flex-direction: column; align-items: center; font-size: 9px; color: var(--vscode-descriptionForeground); margin-top: 4px; line-height: 1.15; } .timeline-bar-label-month { white-space: nowrap; } .timeline-bar-label-year { font-size: 8px; } .tag-cloud { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: baseline; line-height: 1.6; } .dashboard-tag { padding: 2px 8px; border-radius: 10px; background-color: var(--vscode-input-background); color: var(--vscode-editor-foreground); cursor: default; transition: opacity 0.15s; white-space: nowrap; } .dashboard-tag:hover { opacity: 0.75; } .dashboard-tag.has-color { border-radius: 12px; } .dashboard-tag.has-color:hover { opacity: 0.85; } .tag-cloud-more { font-size: 11px; } .tag-count { font-size: 10px; opacity: 0.5; margin-left: 2px; } .dashboard-category { font-size: 12px; border: 1px solid var(--vscode-input-border); } .recent-posts-list { display: flex; flex-direction: column; } .recent-post-item { display: flex; align-items: center; gap: 10px; padding: 6px 8px; border-radius: 4px; cursor: pointer; font-size: 12px; width: 100%; border: none; background: transparent; text-align: left; color: inherit; } .recent-post-item:hover { background-color: var(--vscode-list-hoverBackground); } .recent-post-title { flex: 1; color: var(--vscode-editor-foreground); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .recent-post-status { font-size: 10px; padding: 1px 6px; border-radius: 3px; background-color: var(--vscode-input-background); text-transform: uppercase; letter-spacing: 0.3px; } .recent-post-status.status-published { color: var(--vscode-testing-iconPassed); } .recent-post-status.status-draft { color: var(--vscode-editorWarning-foreground); } .recent-post-status.status-archived { color: var(--vscode-descriptionForeground); } .recent-post-date { color: var(--vscode-descriptionForeground); white-space: nowrap; } .settings-view-shell, .style-view, .tags-view-shell, .scripts-view-shell, .templates-view-shell, .chat-panel { height: 100%; background: var(--vscode-editor-background); } .chat-panel { color: var(--vscode-editor-foreground); } .chat-panel-header { border-bottom: 1px solid var(--vscode-panel-border); background: var(--vscode-sideBar-background); } .chat-panel-title { flex: 1; min-width: 0; gap: 10px; overflow: visible; font-size: 14px; font-weight: 600; } .chat-panel-title-main { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .chat-panel-header-actions { display: flex; align-items: center; gap: 8px; } .chat-model-selector-wrap { position: relative; display: inline-flex; min-width: 0; } .chat-model-selector-button, .chat-model-selector-option { border: 1px solid var(--vscode-input-border); background: var(--vscode-input-background); color: var(--vscode-input-foreground); } .chat-model-selector-menu { position: absolute; top: calc(100% + 4px); left: 0; right: auto; border: 1px solid var(--vscode-dropdown-border, var(--vscode-panel-border)); background: var(--vscode-dropdown-background, var(--vscode-sideBar-background)); color: var(--vscode-dropdown-foreground, var(--vscode-foreground)); z-index: 20; } .chat-panel .chat-model-selector-button.chat-model-selector-inline { display: inline-flex; align-items: center; gap: 6px; } .chat-panel .chat-model-selector-caret { position: static; font-size: 10px; } .chat-messages, .chat-surface-scroll { flex: 1; min-height: 0; overflow-y: auto; } .chat-message { display: flex; max-width: 100%; } .chat-message.user { justify-content: flex-end; } .chat-message-content { max-width: min(760px, 100%); border: 1px solid var(--vscode-panel-border); border-radius: 6px; padding: 12px 14px; background: var(--vscode-sideBar-background); color: var(--vscode-editor-foreground); } .chat-panel .chat-message.user .chat-message-content { background: transparent; color: var(--vscode-list-activeSelectionForeground); border: 0; padding: 6px 12px; line-height: 1.35; } .chat-tool-surface-table { width: 100%; border-collapse: collapse; } .chat-tool-surface-table th, .chat-tool-surface-table td { border-bottom: 1px solid var(--vscode-panel-border); padding: 6px 8px; text-align: left; } .chat-tool-surface-json { overflow: auto; padding: 10px 12px; border: 1px solid var(--vscode-panel-border); border-radius: 4px; background: var(--vscode-textCodeBlock-background); } .chat-panel .chat-input-container { --chat-input-line-height: 20px; --chat-input-min-height: 20px; border-top: 1px solid var(--vscode-panel-border); padding: 8px 16px; background: var(--vscode-sideBar-background); } .chat-panel .chat-input-wrapper { min-height: 30px; border: 1px solid var(--vscode-input-border); border-radius: 6px; padding: 4px 6px; background: var(--vscode-input-background); } .chat-panel .chat-input-wrapper:focus-within { border-color: var(--vscode-focusBorder); } .chat-panel .chat-input { flex: 1; box-sizing: border-box; height: var(--chat-input-min-height); min-height: var(--chat-input-min-height); margin: 0; padding: 6px 8px; line-height: var(--chat-input-line-height); max-height: 160px; resize: vertical; border: 0; background: transparent; color: var(--vscode-input-foreground); overflow-y: hidden; } .chat-panel .chat-input::placeholder { color: var(--vscode-input-placeholderForeground); } .chat-panel .chat-send-button { flex: 0 0 auto; width: 22px; height: 22px; max-width: 22px; max-height: 22px; padding: 0; background: var(--vscode-button-background); color: var(--vscode-button-foreground); } .chat-panel .chat-send-button:hover:not(:disabled) { background: var(--vscode-button-hoverBackground); } .chat-panel .chat-send-button:disabled { opacity: 0.5; } @media (max-width: 720px) { .chat-panel-header { align-items: stretch; flex-direction: column; padding: 10px 12px; } .chat-panel-title { width: 100%; flex-wrap: wrap; } .chat-model-selector-wrap { width: 100%; } .chat-panel .chat-model-selector-button.chat-model-selector-inline { justify-content: space-between; width: 100%; } .chat-messages { padding: 12px; } .chat-message-content { max-width: 100%; } .chat-panel .chat-input-container { padding: 8px 12px; } } .overlay-root { position: fixed; inset: 0; pointer-events: none; z-index: 10000; } .overlay-root:empty { display: none; } .editor-shared-actions { position: relative; margin-bottom: 14px; } .ai-suggestions-modal-backdrop, .insert-modal-backdrop, .language-picker-modal-backdrop, .confirm-delete-modal-backdrop, .confirm-dialog-overlay, .gallery-overlay, .lightbox-overlay { position: fixed; inset: 0; background: rgba(0, 0, 0, 0.68); display: flex; align-items: center; justify-content: center; pointer-events: auto; } .ai-suggestions-modal, .insert-modal, .language-picker-modal, .confirm-delete-modal, .confirm-dialog, .gallery-overlay-content { background: #1e1e1e; border: 1px solid #3c3c3c; border-radius: 8px; box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4); } .ai-suggestions-modal, .language-picker-modal, .confirm-delete-modal, .confirm-dialog { width: min(680px, calc(100vw - 32px)); max-height: calc(100vh - 48px); display: flex; flex-direction: column; } .insert-modal { width: min(680px, calc(100vw - 32px)); max-height: calc(100vh - 48px); display: flex; flex-direction: column; overflow: hidden; } .gallery-overlay-content { width: min(980px, calc(100vw - 48px)); max-height: calc(100vh - 48px); display: flex; flex-direction: column; overflow: hidden; } .ai-suggestions-modal-header, .language-picker-modal-header, .confirm-delete-modal-header, .insert-modal-header, .gallery-overlay-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px; border-bottom: 1px solid #3c3c3c; } .insert-modal-header { flex-direction: column; align-items: stretch; gap: 12px; } .insert-modal-header.media-header-only { flex-direction: row; align-items: center; } .ai-suggestions-modal-header h2, .language-picker-modal-header h2, .confirm-delete-modal-header h2, .gallery-overlay-header h2, .insert-modal-title, .confirm-dialog h3 { margin: 0; color: #ffffff; } .ai-suggestions-modal-close, .confirm-delete-modal-close, .gallery-overlay-close, .shared-popover-close, .lightbox-close { border: none; background: transparent; color: #c5c5c5; cursor: pointer; font-size: 20px; line-height: 1; } .ai-suggestions-modal-body, .language-picker-modal-body, .confirm-delete-modal-body { padding: 20px; overflow: auto; } .ai-suggestions-list { display: flex; flex-direction: column; gap: 16px; } .ai-suggestion-item { display: flex; gap: 12px; padding: 16px; border: 1px solid #3c3c3c; border-radius: 6px; background: #252526; } .ai-suggestion-checkbox { position: relative; display: flex; align-items: flex-start; cursor: pointer; } .ai-suggestion-checkbox input { position: absolute; opacity: 0; } .checkmark { width: 20px; height: 20px; border: 2px solid #555555; border-radius: 4px; display: inline-flex; align-items: center; justify-content: center; background: #1e1e1e; } .ai-suggestion-checkbox input:checked + .checkmark, .ai-suggestion-checkbox input:checked ~ .checkmark { background: #0078d4; border-color: #0078d4; } .ai-suggestion-checkbox input:checked + .checkmark::after, .ai-suggestion-checkbox input:checked ~ .checkmark::after { content: "✓"; color: #ffffff; font-size: 12px; } .ai-suggestion-content { flex: 1; min-width: 0; } .ai-suggestion-label { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; font-weight: 600; } .ai-suggestion-has-value, .language-picker-badge, .insert-modal-similarity-badge { display: inline-flex; align-items: center; padding: 2px 6px; border-radius: 999px; background: rgba(255, 255, 255, 0.08); color: #c5c5c5; font-size: 11px; } .ai-suggestion-comparison { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 12px; align-items: center; } .ai-suggestion-column { display: flex; flex-direction: column; gap: 4px; padding: 10px 12px; border-radius: 6px; background: rgba(255, 255, 255, 0.03); } .ai-suggestion-column.muted { color: #9d9d9d; } .ai-suggestion-column.highlighted { border: 1px solid rgba(0, 122, 204, 0.4); color: #ffffff; } .ai-suggestion-column-label { font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em; } .ai-suggestion-arrow { color: #9d9d9d; } .ai-suggestion-value { min-height: 1.4em; } .ai-suggestion-value.loading { color: var(--accent-color); font-style: italic; } .ai-suggestions-error { display: flex; flex-direction: column; gap: 4px; padding: 12px 16px; margin-bottom: 16px; border-radius: 6px; background: rgba(220, 50, 50, 0.12); border: 1px solid rgba(220, 50, 50, 0.35); color: #ff6b6b; } .ai-suggestions-modal-footer, .confirm-delete-modal-footer, .confirm-dialog-actions { display: flex; justify-content: flex-end; gap: 10px; padding: 16px 20px; border-top: 1px solid #3c3c3c; } .button-cancel, .button-delete, .button-apply, .confirm-dialog-actions button, .insert-modal-submit, .language-picker-row, .shared-popover-entry, .colour-swatch { cursor: pointer; } .button-cancel, .confirm-dialog-actions button, .insert-modal-submit { border: 1px solid #4c4c4c; border-radius: 4px; padding: 8px 14px; background: transparent; color: #f0f0f0; } .button-apply, .confirm-dialog-actions .primary, .insert-modal-submit { background: #0e639c; border-color: #0e639c; } .button-delete { border: none; border-radius: 4px; padding: 8px 14px; background: #c73c3c; color: #ffffff; } .insert-modal-tabs { display: flex; margin: 0 -20px; } .insert-modal-tab { flex: 1; border: none; border-bottom: 2px solid transparent; background: transparent; color: #9d9d9d; padding: 10px 16px; } .insert-modal-tab.active { color: #ffffff; border-bottom-color: #0e639c; background: #252526; } .insert-modal-search { border-bottom: 1px solid #3c3c3c; } .insert-modal-input, .shared-popover-input { width: 100%; border: none; background: transparent; color: #f0f0f0; padding: 14px 20px; font: inherit; } .menu-editor-header h2 { margin: 0; } .menu-editor-header p { margin: 0.25rem 0 0; color: var(--vscode-descriptionForeground); } .menu-editor-tree-wrap { border: 1px solid var(--vscode-panel-border); border-radius: 6px; background: var(--vscode-editor-background); padding: 0.5rem; min-height: 0; } .menu-editor-toolbar { margin-bottom: 0.5rem; padding-bottom: 0.4rem; border-bottom: 1px solid var(--vscode-panel-border); } .menu-editor-tool { width: 1.8rem; height: 1.8rem; display: inline-flex; align-items: center; justify-content: center; border: 1px solid transparent; border-radius: 4px; background: transparent; color: var(--vscode-foreground); cursor: pointer; padding: 0; } .menu-editor-tool:hover:not(:disabled) { background: var(--vscode-toolbar-hoverBackground); border-color: var(--vscode-panel-border); } .menu-editor-tool:disabled { opacity: 0.45; cursor: not-allowed; } .menu-editor-tree-shell { flex: 1; min-height: 0; overflow: auto; } .menu-editor-tree-level { list-style: none; margin: 0; padding: 0; } .menu-editor-tree-item { margin: 0; padding: 0; } .menu-editor-row { --menu-editor-indent: calc(var(--menu-editor-depth) * 1rem); display: flex; align-items: flex-start; gap: 0.5rem; padding: 0.3rem 0.45rem 0.3rem calc(0.4rem + var(--menu-editor-indent)); border-radius: 4px; cursor: pointer; position: relative; } .menu-editor-row.is-selected { background: var(--vscode-list-activeSelectionBackground); color: var(--vscode-list-activeSelectionForeground); } .menu-editor-row.is-dragging { opacity: 0.45; } .menu-editor-row.is-drop-before::before, .menu-editor-row.is-drop-after::after { content: ""; position: absolute; left: calc(0.4rem + var(--menu-editor-indent)); right: 0.45rem; height: 2px; background: var(--vscode-focusBorder); } .menu-editor-row.is-drop-before::before { top: 0; } .menu-editor-row.is-drop-after::after { bottom: 0; } .menu-editor-row.is-drop-inside { box-shadow: inset 0 0 0 1px var(--vscode-focusBorder); background: var(--vscode-list-hoverBackground); } .menu-editor-row-handle { display: inline-flex; align-items: center; justify-content: center; width: 1rem; min-width: 1rem; color: var(--vscode-descriptionForeground); cursor: grab; user-select: none; } .menu-editor-row-handle:active { cursor: grabbing; } .menu-editor-row-kind { display: inline-flex; align-items: center; justify-content: center; width: 1rem; min-width: 1rem; opacity: 0.9; } .menu-editor-row-title { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .menu-editor-row-title.is-editing { white-space: normal; overflow: visible; text-overflow: clip; } .menu-editor-entry-form { display: block; } .menu-editor-inline-input { width: 100%; border: 1px solid var(--vscode-focusBorder); border-radius: 4px; background: var(--vscode-input-background); color: var(--vscode-input-foreground); padding: 0.25rem 0.45rem; min-height: 1.8rem; } .menu-editor-inline-search { margin-top: 0.5rem; border-top: 1px solid var(--vscode-panel-border); padding-top: 0.5rem; display: flex; flex-direction: column; gap: 0.4rem; max-height: 18rem; overflow: hidden; } .menu-editor-inline-search-head { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; } .menu-editor-inline-search-head strong { display: block; font-size: 0.8rem; } .menu-editor-inline-search-head span { color: var(--vscode-descriptionForeground); font-size: 0.75rem; } .menu-editor-inline-actions { display: inline-flex; align-items: center; gap: 0.5rem; } .menu-editor-inline-action { border: 1px solid var(--vscode-button-border, transparent); border-radius: 4px; background: var(--vscode-button-secondaryBackground); color: var(--vscode-button-secondaryForeground); padding: 0.2rem 0.5rem; cursor: pointer; } .menu-editor-inline-action:hover { background: var(--vscode-button-secondaryHoverBackground); } .menu-editor-picker-list { display: flex; flex-direction: column; gap: 0.35rem; max-height: 16rem; overflow-y: auto; } .menu-editor-picker-item { display: flex; justify-content: space-between; align-items: center; width: 100%; border: 1px solid var(--vscode-panel-border); border-radius: 4px; background: var(--vscode-input-background); color: var(--vscode-input-foreground); padding: 0.45rem 0.55rem; text-align: left; cursor: pointer; } .menu-editor-picker-item:hover { border-color: var(--vscode-focusBorder); background: var(--vscode-list-hoverBackground); } .menu-editor-picker-item small, .menu-editor-picker-state { color: var(--vscode-descriptionForeground); } .menu-editor-empty { color: var(--vscode-descriptionForeground); padding: 0.5rem 0.25rem; } @media (max-width: 720px) { .menu-editor-inline-search-head { flex-direction: column; align-items: flex-start; } .menu-editor-inline-actions { width: 100%; justify-content: flex-start; flex-wrap: wrap; } } [data-testid="media-editor"] .editor-tab-dirty { color: var(--vscode-notificationsWarningIcon-foreground, var(--vscode-editorWarning-foreground)); font-size: 10px; } [data-testid="media-editor"] .editor-actions button { padding: 4px 10px; font-size: 12px; } [data-testid="media-editor"] .editor-actions button.danger:hover { background-color: var(--vscode-notificationsErrorIcon-foreground); } [data-testid="media-editor"] .auto-save-indicator { font-size: 11px; color: var(--vscode-descriptionForeground); font-style: italic; } [data-testid="media-editor"] .quick-actions-wrapper { position: relative; } [data-testid="media-editor"] .quick-actions-btn { display: inline-flex; align-items: center; gap: 6px; } [data-testid="media-editor"] .quick-actions-btn-icon { font-size: 12px; line-height: 1; } [data-testid="media-editor"] .quick-actions-divider { height: 1px; background: var(--vscode-dropdown-border, #454545); } [data-testid="media-editor"] .quick-action-icon { font-size: 16px; flex-shrink: 0; margin-top: 2px; } [data-testid="media-editor"] .quick-action-text strong { font-size: 13px; font-weight: 500; } [data-testid="media-editor"] .quick-action-text small { font-size: 11px; opacity: 0.7; } [data-testid="media-editor"] > .editor-content.media-editor { flex-direction: row; align-items: stretch; gap: 24px; } [data-testid="media-editor"] .editor-field label { font-size: 11px; font-weight: 500; color: var(--vscode-descriptionForeground); text-transform: uppercase; letter-spacing: 0.5px; } [data-testid="media-editor"] .post-editor-input.disabled, [data-testid="media-editor"] .post-editor-input:disabled { opacity: 0.6; cursor: not-allowed; } [data-testid="media-editor"] .media-preview { flex: 1; display: flex; align-items: center; justify-content: center; background-color: var(--vscode-input-background); border-radius: 8px; min-height: 300px; overflow: hidden; } [data-testid="media-editor"] .media-preview-placeholder { display: flex; flex-direction: column; align-items: center; gap: 12px; color: var(--vscode-descriptionForeground); } [data-testid="media-editor"] .media-preview-image { display: flex; align-items: center; justify-content: center; align-self: stretch; width: 100%; height: 100%; min-height: 0; padding: 16px; box-sizing: border-box; } [data-testid="media-editor"] .media-preview-image img { width: 100%; height: 100%; object-fit: contain; border-radius: 4px; } [data-testid="media-editor"] .media-details { width: 320px; gap: 12px; flex-shrink: 0; } [data-testid="media-editor"] .media-details textarea { resize: vertical; } [data-testid="media-editor"] .linked-posts-section label { display: flex; justify-content: space-between; align-items: center; } [data-testid="media-editor"] .add-link-btn { background: var(--vscode-button-secondaryBackground); border: none; color: var(--vscode-button-secondaryForeground); padding: 2px 8px; border-radius: 3px; cursor: pointer; font-size: 11px; } [data-testid="media-editor"] .add-link-btn:hover { background: var(--vscode-button-secondaryHoverBackground); } [data-testid="media-editor"] .post-picker { background: var(--vscode-dropdown-background); border: 1px solid var(--vscode-dropdown-border); border-radius: 4px; margin-top: 8px; max-height: 250px; overflow-y: auto; } [data-testid="media-editor"] .post-picker-search { padding: 8px; border-bottom: 1px solid var(--vscode-dropdown-border); position: sticky; top: 0; background: var(--vscode-dropdown-background); } [data-testid="media-editor"] .post-picker-search input { width: 100%; padding: 6px 10px; background: var(--vscode-input-background); border: 1px solid var(--vscode-input-border); border-radius: 3px; color: var(--vscode-input-foreground); font-size: 12px; } [data-testid="media-editor"] .post-picker-search input:focus { outline: none; border-color: var(--vscode-focusBorder); } [data-testid="media-editor"] .post-picker-list { padding: 4px; } [data-testid="media-editor"] .post-picker-item { width: 100%; padding: 6px 8px; cursor: pointer; border: none; border-radius: 3px; background: transparent; color: inherit; font-size: 12px; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } [data-testid="media-editor"] .post-picker-item:hover { background: var(--vscode-list-hoverBackground); } [data-testid="media-editor"] .post-picker-more { padding: 6px 8px; color: var(--vscode-descriptionForeground); font-size: 11px; font-style: italic; } [data-testid="media-editor"] .no-posts, [data-testid="media-editor"] .no-linked-posts { padding: 12px 8px; color: var(--vscode-descriptionForeground); font-size: 12px; font-style: italic; } [data-testid="media-editor"] .linked-posts-list { margin-top: 8px; display: flex; flex-direction: column; gap: 4px; } [data-testid="media-editor"] .linked-post-item { display: flex; align-items: center; justify-content: space-between; padding: 6px 8px; background: var(--vscode-sideBar-background); border-radius: 4px; } [data-testid="media-editor"] .linked-post-title, [data-testid="media-editor"] .linked-post-link { flex: 1; min-width: 0; border: none; background: transparent; padding: 0; color: inherit; text-align: left; cursor: pointer; font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } [data-testid="media-editor"] .linked-post-title:hover, [data-testid="media-editor"] .linked-post-link:hover { color: var(--vscode-textLink-foreground); text-decoration: underline; } [data-testid="media-editor"] .linked-post-item .unlink-btn { background: none; border: none; color: var(--vscode-descriptionForeground); cursor: pointer; padding: 0 4px; font-size: 14px; opacity: 0; transition: opacity 0.1s; } [data-testid="media-editor"] .linked-post-item:hover .unlink-btn { opacity: 1; } [data-testid="media-editor"] .linked-post-item .unlink-btn:hover { color: var(--vscode-errorForeground); } .translation-modal-backdrop { position: fixed; inset: 0; background: rgba(0, 0, 0, 0.68); display: flex; align-items: center; justify-content: center; pointer-events: auto; z-index: 10001; } .translation-modal { width: min(640px, calc(100vw - 32px)); background: #1e1e1e; border: 1px solid #3c3c3c; border-radius: 8px; box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4); } .translation-modal-header, .translation-modal-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px; } .translation-modal-header { border-bottom: 1px solid #3c3c3c; } .translation-modal-footer { border-top: 1px solid #3c3c3c; justify-content: flex-end; gap: 10px; } .translation-modal-body { padding: 20px; display: flex; flex-direction: column; gap: 14px; } .translation-modal-close { border: none; background: transparent; color: #c5c5c5; cursor: pointer; font-size: 20px; line-height: 1; } .import-analysis { display: flex; flex-direction: column; gap: 16px; padding: 18px 20px 26px; color: var(--vscode-foreground); } .import-analysis-header { display: flex; flex-direction: column; gap: 8px; } .import-analysis-header p { margin: 0; color: var(--vscode-descriptionForeground); font-size: 13px; line-height: 1.5; } .import-definition-name { width: min(480px, 100%); border: 1px solid var(--vscode-input-border, transparent); background: var(--vscode-input-background); color: var(--vscode-input-foreground, var(--vscode-foreground)); border-radius: 6px; padding: 10px 12px; font-size: 18px; font-weight: 600; } .import-file-selectors { display: grid; gap: 12px; } .import-file-row { display: grid; grid-template-columns: 150px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 12px 14px; border: 1px solid var(--vscode-panel-border); border-radius: 8px; background: var(--vscode-editor-background); @supports (color: color-mix(in lab, red, red)) { background: color-mix(in srgb, var(--vscode-editor-background) 76%, var(--vscode-input-background)); } } .import-file-row label { font-size: 12px; font-weight: 600; color: var(--vscode-descriptionForeground); text-transform: uppercase; letter-spacing: 0.04em; } .import-file-path { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: var(--vscode-editor-font-family, ui-monospace, monospace); font-size: 12px; } .import-file-path.placeholder { color: var(--vscode-descriptionForeground); } .import-analysis button, .import-analysis select { border: 1px solid var(--vscode-button-border, transparent); border-radius: 6px; font-size: 12px; } .import-analysis button { background: var(--vscode-button-secondaryBackground, var(--vscode-button-background)); color: var(--vscode-button-secondaryForeground, var(--vscode-button-foreground)); padding: 8px 12px; cursor: pointer; } .import-analysis button:hover:not(:disabled) { background: var(--vscode-button-secondaryHoverBackground, var(--vscode-button-hoverBackground)); } .import-analyze-btn, .import-execute-btn { background: var(--vscode-button-background) !important; color: var(--vscode-button-foreground) !important; } .import-analysis button:disabled { opacity: 0.65; cursor: not-allowed; } .import-loading { display: flex; align-items: center; gap: 12px; padding: 16px; border: 1px solid var(--vscode-panel-border); border-radius: 10px; background: var(--vscode-editor-background); @supports (color: color-mix(in lab, red, red)) { background: color-mix(in srgb, var(--vscode-editor-background) 84%, var(--vscode-input-background)); } } .import-spinner { width: 18px; height: 18px; border: 2px solid var(--vscode-descriptionForeground); border-top-color: var(--vscode-button-background); border-radius: 50%; animation: import-spinner-rotate 0.8s linear infinite; flex-shrink: 0; } .import-progress { display: flex; flex-direction: column; gap: 2px; } .import-progress-step { font-size: 13px; color: var(--vscode-foreground); } .import-progress-detail { font-size: 11px; color: var(--vscode-descriptionForeground); } @keyframes import-spinner-rotate { to { transform: rotate(360deg); } } .import-site-info { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; } .import-site-info-item, .import-stat-card, .import-date-distribution, .import-detail-section, .import-execute-section { border: 1px solid var(--vscode-panel-border); border-radius: 10px; background: var(--vscode-editor-background); @supports (color: color-mix(in lab, red, red)) { background: color-mix(in srgb, var(--vscode-editor-background) 84%, var(--vscode-input-background)); } } .import-site-info-item { display: flex; flex-direction: column; gap: 6px; padding: 14px; } .info-label { font-size: 11px; font-weight: 600; color: var(--vscode-descriptionForeground); text-transform: uppercase; letter-spacing: 0.05em; } .info-value { font-size: 13px; font-weight: 500; overflow-wrap: anywhere; } .import-stat-cards { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; } .import-stat-card { padding: 14px; } .import-stat-card h3, .import-date-distribution h3, .import-detail-section h3, .taxonomy-group h4 { margin: 0; } .import-stat-number { margin-top: 10px; font-size: 28px; font-weight: 700; line-height: 1; } .import-stat-breakdown, .import-execute-summary, .import-taxonomy-list { display: flex; flex-wrap: wrap; gap: 8px; } .import-stat-breakdown { margin-top: 12px; } .import-stat-tag, .import-count-tag, .import-taxonomy-pill, .macro-status-badge { display: inline-flex; align-items: center; gap: 4px; padding: 4px 9px; border-radius: 999px; font-size: 11px; font-weight: 600; } .stat-new, .import-taxonomy-pill.new-tax { background: rgba(117, 190, 255, 0.16); color: #75beff; } .stat-update, .stat-mapped, .import-taxonomy-pill.exists, .import-taxonomy-pill.mapped, .macro-status-badge.mapped, .import-execution-complete { background: rgba(115, 201, 145, 0.16); color: #73c991; } .stat-conflict { background: rgba(255, 166, 87, 0.16); color: #ffb169; } .stat-duplicate, .stat-missing, .macro-status-badge.unmapped, .import-execution-error { background: rgba(204, 167, 0, 0.16); color: #cca700; } .import-date-distribution, .import-detail-section, .import-execute-section { padding: 16px; } .import-section-toggle { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0; border: none !important; background: transparent !important; color: inherit !important; font-size: 16px !important; font-weight: 600; text-align: left; } .import-section-toggle:hover { background: transparent !important; opacity: 0.9; } .toggle-icon { font-size: 12px; color: var(--vscode-descriptionForeground); } .distribution-bars { display: grid; gap: 10px; margin-top: 14px; } .distribution-row { display: grid; grid-template-columns: 56px minmax(0, 1fr) 72px; gap: 10px; align-items: center; } .distribution-year, .distribution-count, .slug-cell { font-family: var(--vscode-editor-font-family, ui-monospace, monospace); font-size: 11px; } .distribution-bar-container { height: 10px; border-radius: 999px; overflow: hidden; background: var(--vscode-input-background); } .distribution-bar { height: 100%; min-width: 8px; border-radius: inherit; } .distribution-bar-posts { background: linear-gradient(90deg, rgba(117, 190, 255, 0.8), rgba(117, 190, 255, 0.35)); } .import-execute-section { display: flex; align-items: center; justify-content: space-between; gap: 16px; } .import-execute-summary { color: var(--vscode-descriptionForeground); } .import-execution-complete, .import-execution-error { padding: 10px 12px; border-radius: 8px; font-size: 12px; font-weight: 600; } .import-execution-progress { display: grid; gap: 10px; padding: 16px; border: 1px solid var(--vscode-panel-border); border-radius: 10px; background: var(--vscode-editor-background); @supports (color: color-mix(in lab, red, red)) { background: color-mix(in srgb, var(--vscode-editor-background) 84%, var(--vscode-input-background)); } } .import-execution-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; } .import-execution-header h3 { margin: 0; font-size: 14px; } .import-progress-bar { height: 10px; border-radius: 999px; overflow: hidden; background: var(--vscode-input-background); } .import-progress-fill { height: 100%; background: linear-gradient(90deg, rgba(117, 190, 255, 0.85), rgba(117, 190, 255, 0.45)); } .import-progress-info { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; font-size: 12px; } .import-phase { font-weight: 600; } .import-detail, .import-counter { color: var(--vscode-descriptionForeground); } .import-detail-table { width: 100%; border-collapse: collapse; margin-top: 14px; } .import-detail-table th, .import-detail-table td { padding: 10px 8px; text-align: left; border-bottom: 1px solid var(--vscode-panel-border); vertical-align: middle; font-size: 12px; } .import-detail-table th { font-size: 11px; color: var(--vscode-descriptionForeground); text-transform: uppercase; letter-spacing: 0.04em; } .import-detail-table .status-badge { display: inline-flex; align-items: center; border-radius: 999px; padding: 4px 9px; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; } .import-detail-table .status-badge.new { background: rgba(117, 190, 255, 0.16); color: #75beff; } .import-detail-table .status-badge.update { background: rgba(115, 201, 145, 0.16); color: #73c991; } .import-detail-table .status-badge.conflict { background: rgba(255, 166, 87, 0.16); color: #ffb169; } .import-detail-table .status-badge.duplicate, .import-detail-table .status-badge.missing { background: rgba(204, 167, 0, 0.16); color: #cca700; } .categories-cell, .existing-match, .mime-type-cell, .post-type-cell { font-size: 11px; color: var(--vscode-descriptionForeground); } .mime-type-cell, .post-type-cell, .existing-match, .slug-cell { font-family: var(--vscode-editor-font-family, ui-monospace, monospace); } .resolution-select, .taxonomy-mapping-input { min-width: 150px; background: var(--vscode-dropdown-background, var(--vscode-input-background)); color: var(--vscode-dropdown-foreground, var(--vscode-foreground)); border: 1px solid var(--vscode-dropdown-border, var(--vscode-panel-border)); padding: 6px 8px; } .taxonomy-analyze-row { display: flex; align-items: center; gap: 12px; padding: 0 0 12px; margin-top: 12px; border-bottom: 1px solid var(--vscode-panel-border); } .taxonomy-analyze-dropdown { position: relative; } .taxonomy-analyze-btn { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; } .taxonomy-model-dropdown { position: absolute; top: calc(100% + 6px); left: 0; min-width: 220px; max-height: 280px; overflow-y: auto; background: var(--vscode-dropdown-background, var(--vscode-sideBar-background)); border: 1px solid var(--vscode-dropdown-border, var(--vscode-panel-border)); border-radius: 6px; box-shadow: 0 10px 24px rgba(0, 0, 0, 0.24); z-index: 20; } .taxonomy-model-option { width: 100%; display: block; border: none !important; border-radius: 0 !important; background: transparent !important; color: var(--vscode-foreground) !important; text-align: left; padding: 8px 12px !important; } .taxonomy-model-option:hover { background: var(--vscode-list-hoverBackground) !important; } .taxonomy-analyze-hint { font-size: 11px; color: var(--vscode-descriptionForeground); } .import-taxonomy-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 14px; } .taxonomy-group { display: flex; flex-direction: column; gap: 12px; } .import-taxonomy-entry, .import-taxonomy-edit-form { display: inline-flex; align-items: center; gap: 8px; } .import-taxonomy-entry, .import-taxonomy-edit-form { flex-wrap: wrap; } .import-taxonomy-pill { border: none; cursor: default; } button.import-taxonomy-pill { cursor: pointer; } .mapped-target { background: rgba(115, 201, 145, 0.1); } .taxonomy-mapping-arrow { color: var(--vscode-descriptionForeground); font-size: 12px; } .taxonomy-mapping-input { min-width: 170px; border-radius: 6px; } .taxonomy-edit-btn, .taxonomy-clear-btn { min-width: 28px; min-height: 28px; padding: 0 8px !important; display: inline-flex; align-items: center; justify-content: center; } .taxonomy-edit-btn.ghost, .taxonomy-clear-btn { background: transparent !important; border: 1px solid var(--vscode-panel-border) !important; color: var(--vscode-descriptionForeground) !important; } .macros-list { display: grid; gap: 10px; margin-top: 14px; } .macro-item { border: 1px solid var(--vscode-panel-border); border-radius: 8px; background: var(--vscode-input-background); } .macro-item.unmapped { border-left: 3px solid #cca700; } .macro-header { display: flex; align-items: center; gap: 10px; padding: 12px 14px; } .macro-name, .import-taxonomy-pill { font-family: var(--vscode-editor-font-family, ui-monospace, monospace); } .macro-count { margin-left: auto; font-size: 11px; color: var(--vscode-descriptionForeground); } .import-empty-state { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 56px 20px; color: var(--vscode-descriptionForeground); border: 1px dashed var(--vscode-panel-border); border-radius: 12px; } .import-empty-state p { margin: 0; font-size: 13px; } @media (max-width: 1100px) { .import-site-info, .import-stat-cards, .import-taxonomy-groups { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (max-width: 780px) { .import-analysis { padding: 14px; } .import-file-row, .distribution-row, .import-execute-section, .import-site-info, .import-stat-cards, .import-taxonomy-groups { grid-template-columns: 1fr; } .import-execute-section { align-items: stretch; } .import-file-row { align-items: stretch; } .import-analysis button, .resolution-select, .taxonomy-mapping-input { width: 100%; } .taxonomy-analyze-row { flex-direction: column; align-items: stretch; } .import-taxonomy-entry, .import-taxonomy-edit-form { width: 100%; flex-direction: column; align-items: stretch; } } @layer components { .ui-button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 28px; padding: 4px 10px; border: 1px solid transparent; border-radius: 4px; font: inherit; line-height: 1.2; cursor: pointer; user-select: none; } .ui-button:hover:not(:disabled) { background: var(--vscode-button-hoverBackground, #0e639c); } .ui-button:disabled { opacity: 0.5; cursor: not-allowed; } .ui-button-primary { color: var(--vscode-button-foreground, #ffffff); background: var(--vscode-button-background, var(--vscode-focusBorder)); } .ui-button-primary:hover:not(:disabled) { background: var(--vscode-button-hoverBackground, #0e639c); } .ui-button-secondary { color: var(--vscode-button-secondaryForeground, var(--vscode-foreground)); background: var(--vscode-button-secondaryBackground, rgba(255, 255, 255, 0.08)); border-color: var(--vscode-button-border, transparent); } .ui-button-secondary:hover:not(:disabled) { background: var(--vscode-button-secondaryHoverBackground, #4a4d51); } .ui-button-danger { color: var(--vscode-errorForeground, #f48771); background: transparent; border-color: var(--vscode-errorForeground, #f48771); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in srgb, var(--vscode-errorForeground, #f48771) 45%, transparent); } } .ui-button-danger:hover:not(:disabled) { background: var(--vscode-errorForeground, #f48771); @supports (color: color-mix(in lab, red, red)) { background: color-mix(in srgb, var(--vscode-errorForeground, #f48771) 14%, transparent); } } .ui-button-compact { min-height: 24px; padding: 3px 8px; font-size: 12px; } .ui-input, .ui-textarea { width: 100%; padding: 8px 10px; border: 1px solid var(--vscode-input-border, var(--vscode-panel-border)); border-radius: 4px; background: var(--vscode-input-background, rgba(255, 255, 255, 0.06)); color: var(--vscode-input-foreground, var(--vscode-foreground)); font: inherit; } .ui-textarea { line-height: 1.5; resize: vertical; } .ui-input:focus, .ui-textarea:focus { outline: 1px solid var(--vscode-focusBorder, #007fd4); outline-offset: 1px; } .ui-input-readonly, .ui-input[readonly] { opacity: 0.7; cursor: not-allowed; } .ui-input-disabled, .ui-input:disabled { opacity: 0.6; cursor: not-allowed; } .ui-tab { border: none; color: var(--vscode-tab-inactiveForeground, var(--vscode-foreground)); background: transparent; } .ui-tab:hover { color: var(--vscode-tab-activeForeground, var(--vscode-foreground)); } .ui-tab-active { color: var(--vscode-tab-activeForeground, var(--vscode-foreground)); } .ui-badge { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 500; text-transform: uppercase; letter-spacing: 0.04em; } .ui-panel-entry { border: 1px solid var(--vscode-panel-border); border-radius: 4px; background-color: var(--vscode-sideBar-background); } .ui-empty-state { display: flex; flex-direction: column; gap: 6px; color: var(--vscode-descriptionForeground); } .ui-editor-shell { height: 100%; min-height: 0; display: flex; flex-direction: column; overflow: hidden; background: var(--vscode-editor-background); } .ui-editor-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; min-height: 35px; padding: 0 12px; border-bottom: 1px solid var(--vscode-panel-border); background: var(--vscode-tab-activeBackground); } .ui-editor-tab-current { display: inline-flex; max-width: 100%; align-items: center; gap: 6px; overflow: hidden; padding: 6px 12px; border-radius: 4px 4px 0 0; background: var(--vscode-tab-activeBackground); color: var(--vscode-tab-activeForeground); } .ui-editor-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; } .ui-toolbar { display: flex; align-items: center; gap: 12px; min-height: 32px; } .ui-toolbar-group { display: flex; align-items: center; gap: 8px; min-width: 0; } .ui-field-stack { display: flex; flex-direction: column; gap: 6px; min-width: 0; } .ui-field-stack > label, .ui-field-label { font-size: 11px; font-weight: 500; color: var(--vscode-descriptionForeground); text-transform: uppercase; letter-spacing: 0.5px; } .ui-field-grid-2, .ui-field-grid-3 { display: grid; gap: 16px; } .ui-dropdown-menu { background: var(--vscode-dropdown-background, var(--vscode-sideBar-background)); border: 1px solid var(--vscode-dropdown-border, var(--vscode-panel-border)); border-radius: 6px; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35); overflow: hidden; } .ui-dropdown-item { display: flex; align-items: flex-start; gap: 10px; width: 100%; padding: 10px 12px; border: none; background: transparent; color: var(--vscode-dropdown-foreground, var(--vscode-foreground)); cursor: pointer; text-align: left; transition: background 0.1s; } .ui-dropdown-item:hover:not(:disabled) { background: var(--vscode-list-hoverBackground, #2a2d2e); } .ui-dropdown-item:disabled { opacity: 0.5; cursor: not-allowed; } .ui-section-card { border: 1px solid var(--vscode-panel-border); border-radius: 8px; background: var(--vscode-editor-background); @supports (color: color-mix(in lab, red, red)) { background: color-mix(in srgb, var(--vscode-editor-background) 84%, var(--vscode-input-background)); } } .btn-base { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 28px; padding: 4px 10px; border: 1px solid transparent; border-radius: 4px; font: inherit; line-height: 1.2; cursor: pointer; user-select: none; } .btn-theme-primary { color: var(--vscode-button-foreground, #ffffff); background: var(--vscode-button-background, var(--vscode-focusBorder)); } .btn-theme-primary:hover { background: var(--vscode-button-hoverBackground, #0e639c); } .btn-theme-danger { color: var(--vscode-errorForeground, #f48771); background: transparent; border-color: var(--vscode-errorForeground, #f48771); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in srgb, var(--vscode-errorForeground, #f48771) 45%, transparent); } } .btn-theme-danger:hover { background: var(--vscode-errorForeground, #f48771); @supports (color: color-mix(in lab, red, red)) { background: color-mix(in srgb, var(--vscode-errorForeground, #f48771) 14%, transparent); } } .panel-entry { border: 1px solid var(--vscode-panel-border); border-radius: 4px; background-color: var(--vscode-sideBar-background); } .monaco-host { min-width: 0; min-height: 0; overflow: hidden; } } @media (min-width: 768px) { .ui-field-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ui-field-grid-3 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; } } @property --tw-rotate-x { syntax: "*"; inherits: false; } @property --tw-rotate-y { syntax: "*"; inherits: false; } @property --tw-rotate-z { syntax: "*"; inherits: false; } @property --tw-skew-x { syntax: "*"; inherits: false; } @property --tw-skew-y { syntax: "*"; inherits: false; } @property --tw-border-style { syntax: "*"; inherits: false; initial-value: solid; } @property --tw-tracking { syntax: "*"; inherits: false; } @property --tw-outline-style { syntax: "*"; inherits: false; initial-value: solid; } @property --tw-blur { syntax: "*"; inherits: false; } @property --tw-brightness { syntax: "*"; inherits: false; } @property --tw-contrast { syntax: "*"; inherits: false; } @property --tw-grayscale { syntax: "*"; inherits: false; } @property --tw-hue-rotate { syntax: "*"; inherits: false; } @property --tw-invert { syntax: "*"; inherits: false; } @property --tw-opacity { syntax: "*"; inherits: false; } @property --tw-saturate { syntax: "*"; inherits: false; } @property --tw-sepia { syntax: "*"; inherits: false; } @property --tw-drop-shadow { syntax: "*"; inherits: false; } @property --tw-drop-shadow-color { syntax: "*"; inherits: false; } @property --tw-drop-shadow-alpha { syntax: ""; inherits: false; initial-value: 100%; } @property --tw-drop-shadow-size { syntax: "*"; inherits: false; } @keyframes spin { to { transform: rotate(360deg); } } @layer properties { @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) { *, ::before, ::after, ::backdrop { --tw-rotate-x: initial; --tw-rotate-y: initial; --tw-rotate-z: initial; --tw-skew-x: initial; --tw-skew-y: initial; --tw-border-style: solid; --tw-tracking: initial; --tw-outline-style: solid; --tw-blur: initial; --tw-brightness: initial; --tw-contrast: initial; --tw-grayscale: initial; --tw-hue-rotate: initial; --tw-invert: initial; --tw-opacity: initial; --tw-saturate: initial; --tw-sepia: initial; --tw-drop-shadow: initial; --tw-drop-shadow-color: initial; --tw-drop-shadow-alpha: 100%; --tw-drop-shadow-size: initial; } } }