/* Theme Starry Sky (starry-sky): its tokens, then 17 rule(s) that decorate or still
   target components without a token. Material: frosted. */
@layer themes {
/* Component tokens: the theme values of hooks that base rules read. */
html[data-theme="starry-sky"],
html[data-theme="starry-sky"] body {
  --ref-starry-sky-btn-send-color: #161128;
  --ref-starry-sky-btn-send-border: #d5c9ff88;
  --ref-starry-sky-btn-send-hover-shadow: 0 0 14px #c4b5fd40;
  --ref-starry-sky-message-action-color: #e3e3f4;
  --ref-starry-sky-message-action-bg: #1a2040;
  --ref-starry-sky-message-action-border: #b7b8d333;
  --ref-starry-sky-reaction-pill-selected-color: #161128;
  --ref-starry-sky-reaction-pill-selected-bg: #c4b5fd;
  --ref-starry-sky-reaction-pill-selected-border: #d5c9ff;
  --ref-starry-sky-message-time-color: #b7b8d3;
  --ref-starry-sky-message-input-placeholder-color: #a9aac8;
  --ref-starry-sky-code-block-border: #b7b8d333;
  --ref-starry-sky-webkit-scrollbar-thumb-bg: #c4b5fd55;
  --ref-starry-sky-focus-visible-outline: #c4b5fd;
  --ref-starry-sky-theme-scene-bg: radial-gradient(ellipse 85% 70% at 50% 115%, rgba(29, 35, 66, .55), transparent 70%);
  --ref-starry-sky-theme-scene-before-bg: radial-gradient(ellipse 46% 40% at 8% 14%, rgba(120, 86, 184, .3), rgba(120, 86, 184, .12) 55%, transparent),
    radial-gradient(ellipse 42% 38% at 94% 86%, rgba(187, 111, 169, .22), rgba(187, 111, 169, .09) 55%, transparent);
  --ref-starry-sky-theme-scene-after-bg: radial-gradient(circle at 18% 30%, #f4f1ff 0 1.6px, rgba(196, 181, 253, .35) 2.4px, transparent 5px),
    radial-gradient(circle at 82% 18%, #f4f1ff 0 1.6px, rgba(196, 181, 253, .35) 2.4px, transparent 5px),
    radial-gradient(circle at 88% 70%, #f4f1ff 0 1.6px, rgba(196, 181, 253, .35) 2.4px, transparent 5px),
    radial-gradient(circle at 11% 62%, #f4f1ff 0 1.6px, rgba(196, 181, 253, .35) 2.4px, transparent 5px),
    radial-gradient(circle at 6% 12%, #d9daf3cc 0 1px, transparent 1.8px),
    radial-gradient(circle at 24% 84%, #d9daf3aa 0 1px, transparent 1.8px),
    radial-gradient(circle at 35% 8%, #d9daf3aa 0 .9px, transparent 1.6px),
    radial-gradient(circle at 64% 6%, #d9daf3cc 0 1px, transparent 1.8px),
    radial-gradient(circle at 93% 40%, #d9daf3aa 0 .9px, transparent 1.6px),
    radial-gradient(circle at 72% 92%, #d9daf3cc 0 1px, transparent 1.8px),
    radial-gradient(circle at 46% 95%, #d9daf399 0 .9px, transparent 1.6px),
    radial-gradient(circle at 4% 90%, #d9daf3aa 0 1px, transparent 1.8px),
    radial-gradient(circle at 96% 8%, #d9daf3aa 0 .9px, transparent 1.6px),
    radial-gradient(circle at 14% 46%, #d9daf399 0 .9px, transparent 1.6px),
    radial-gradient(circle at 86% 54%, #d9daf3aa 0 1px, transparent 1.8px),
    radial-gradient(circle at 54% 3%, #d9daf399 0 .8px, transparent 1.5px);
  --comp-message-sent-glow: drop-shadow(0 0 12px #c4b5fd88) drop-shadow(0 0 4px #e9e3ffaa);
  --comp-message-sent-duration: 900ms;
  --comp-message-more-open-summary-color: #eaeaf7;
  --comp-message-more-open-summary-background: #2e2a58;
  --comp-message-more-open-summary-border-color: #c4b5fd;
  --comp-code-block-background: #0b0f26;
}
html[data-theme="starry-sky"] { color-scheme: dark; }
html[data-theme="starry-sky"],
html[data-theme="starry-sky"] body {
  --sys-bg-base: #090d20;
  --comp-panel-on-accent: var(--sys-bg-base);
  --sys-bg-raised: #141a35;
  --sys-bg-high: #1d2342;
  --sys-bg-overlay: #1d2342;
  --sys-surface: rgba(20, 26, 53, .74);
  --sys-border: rgba(183, 184, 211, .18);
  --sys-border-strong: rgba(196, 181, 253, .5);
  --sys-surface-hover: rgba(196, 181, 253, .1);
  --sys-surface-shell: linear-gradient(155deg, rgba(20, 26, 53, .9), rgba(9, 13, 32, .86));
  --sys-surface-plate: linear-gradient(145deg, rgba(29, 35, 66, .96), rgba(20, 26, 53, .96));
  --sys-surface-control: rgba(20, 26, 53, .86);
  --sys-elevation-2: inset 0 1px 0 #e4ddff14, 0 12px 32px #02040e70;
  --sys-elevation-1: inset 0 1px 0 #e4ddff12, 0 4px 14px #02040e4a;
  --sys-refraction: blur(10px) saturate(110%);
  --sys-refraction-subtle: blur(8px) saturate(110%);
  --sys-accent: #c4b5fd;
  --sys-accent-strong: #a796f2;
  --sys-accent-alt: #e2a9d4;
  --sys-accent-gradient: linear-gradient(135deg, #c4b5fd, #b4a3f8);
  --sys-accent-gradient-hover: linear-gradient(135deg, #d5c9ff, #c4b5fd);
  --sys-on-surface: #eaeaf7;
  --sys-on-surface-variant: #b7b8d3;
  --sys-on-surface-muted: #a9aac8;
  --comp-bubble-own-bg: linear-gradient(135deg, rgba(41, 35, 75, .5), rgba(35, 31, 68, .38));
  --comp-bubble-own-border: rgba(196, 181, 253, .42);
  --comp-bubble-other-bg: rgba(20, 26, 53, .36);
  --comp-bubble-other-border: rgba(183, 184, 211, .2);
  --sys-status-online: #8fd6b0;
  --sys-status-warning: #f0c987;
  --sys-status-danger: #ff9bb0;
  --ref-theme-accent: #c4b5fd;
  --ref-theme-own-author: #ddd3ff;
  --ref-theme-body-bg: radial-gradient(ellipse at 10% 0%, #2a1f5238, transparent 55%), radial-gradient(ellipse at 100% 100%, #3b1f4a30, transparent 55%), linear-gradient(170deg, #090d20, #0e1430);
  --ref-theme-own-bubble: var(--comp-bubble-own-bg);
  --ref-theme-own-border: var(--comp-bubble-own-border);
  --ref-theme-popover-bg: #1d2342;
  --liquid-glass-surface: rgba(20, 26, 53, .84);
  --liquid-glass-plate: rgba(29, 35, 66, .96);
  --liquid-glass-control: rgba(20, 26, 53, .86);
  --liquid-glass-border: rgba(183, 184, 211, .2);
  --liquid-glass-border-strong: rgba(196, 181, 253, .5);
  --liquid-refraction: blur(10px) saturate(110%);
  --vscode-foreground: #eaeaf7;
  --vscode-editor-foreground: #eaeaf7;
  --vscode-editor-background: #090d20;
  --vscode-descriptionForeground: #b7b8d3;
  --vscode-input-foreground: #eaeaf7;
  --vscode-input-placeholderForeground: #a9aac8;
  --vscode-focusBorder: #c4b5fd;
  --comp-message-text-link: #c4b5fd;
  --vscode-textLink-activeForeground: #e4dcff;
  --vscode-textBlockQuote-border: #7856b8;
  /* Lavender buttons carry dark text and icons. */
  --vscode-button-background: #c4b5fd;
  --vscode-button-hoverBackground: #d5c9ff;
  --vscode-button-foreground: #161128;
  --vscode-list-hoverBackground: #232a4f;
  --vscode-list-activeSelectionForeground: #e4dcff;
  --vscode-list-activeSelectionBackground: #2e2a58;
  --vscode-toolbar-hoverBackground: #232a4f;
  --vscode-badge-background: #c4b5fd;
  --vscode-badge-foreground: #161128;
  --vscode-menu-background: #1d2342;
  --vscode-dropdown-background: #1d2342;
  color: var(--sys-on-surface);
}
/* Starry Sky: lavender accent, dark text on light controls. */
html[data-theme="starry-sky"] .message:not(.own) > .message-author,
html[data-theme="starry-sky"] .message-other .message-user { filter: brightness(1.22) saturate(1.05); }
html[data-theme="starry-sky"] :is(.btn-send, .btn-enter, .logo-icon, .logo-small, .btn-create-group:hover, .btn-scroll-bottom:hover) { color: var(--ref-starry-sky-btn-send-color); }
html[data-theme="starry-sky"] :is(.btn-send) { background: var(--sys-accent-gradient); border-color: var(--ref-starry-sky-btn-send-border); }
html[data-theme="starry-sky"] :is(.btn-send):hover { background: var(--sys-accent-gradient-hover); box-shadow: var(--ref-starry-sky-btn-send-hover-shadow); }
html[data-theme="starry-sky"] :is(.message-action, .reaction-pill, .message-more > summary) { color: var(--ref-starry-sky-message-action-color); background: var(--ref-starry-sky-message-action-bg); border-color: var(--ref-starry-sky-message-action-border); }
html[data-theme="starry-sky"] :is(.reaction-pill.selected, .message-reactions .reaction.selected) { color: var(--ref-starry-sky-reaction-pill-selected-color); background: var(--ref-starry-sky-reaction-pill-selected-bg); border-color: var(--ref-starry-sky-reaction-pill-selected-border); }
html[data-theme="starry-sky"] :is(.message-time, .message-system, .message-viewers, .message time) { color: var(--ref-starry-sky-message-time-color); }
html[data-theme="starry-sky"] :is(.message-input, .form-group input)::placeholder { color: var(--ref-starry-sky-message-input-placeholder-color); opacity: 1; }
html[data-theme="starry-sky"] .code-block { border-color: var(--ref-starry-sky-code-block-border); }
html[data-theme="starry-sky"] ::-webkit-scrollbar-thumb { background: var(--ref-starry-sky-webkit-scrollbar-thumb-bg); }
html[data-theme="starry-sky"] :focus-visible { outline-color: var(--ref-starry-sky-focus-visible-outline); }
html[data-theme="starry-sky"] .theme-scene {
  background: var(--ref-starry-sky-theme-scene-bg);
}
html[data-theme="starry-sky"] .theme-scene::before {
  background:
    var(--ref-starry-sky-theme-scene-before-bg);
}
html[data-theme="starry-sky"] .theme-scene::after {
  background:
    var(--ref-starry-sky-theme-scene-after-bg);
}
}