/* User-selected appearance. Resource artwork and platform colors retain their identity. */
html[data-theme='light'] {
  color-scheme: light;
}
html[data-theme='dark'] {
  color-scheme: dark;
  --canvas: #121212;
  --surface: #1d1d1d;
  --surface-raised: #292929;
  --ink: #f3f3f3;
  --border: #414141;
  --line: #414141;
  --muted: #c3c3c3;
  --subtle: #a6a6a6;
  --accent: #dddddd;
  --accent-hover: #f2f2f2;
  --accent-text: #e4e4e4;
  --accent-soft: #303030;
  --accent-on: #181818;
  --green: #80d6ac;
  --green-soft: #193a31;
  --gold: #f0c779;
  --gold-soft: #3e321e;
  --red: #ffa6b2;
  --red-soft: #442832;
  --blue: #94c4ff;
  --discord: #aab4ff;
  --nav: #101010;
  --nav-muted: #b6b6b6;
  color: var(--ink);
  background: var(--canvas);
}
html[data-theme='dark'][data-surface='docs'] {
  --accent: #e4e4e4;
}
html[data-theme='dark'] [data-platform='discord'],
html[data-theme='dark'] .login {
  --accent: #5865f2;
  --accent-hover: #5d68e5;
  --accent-text: #b0b9ff;
  --accent-soft: #303030;
  --accent-on: #fff;
}
html[data-theme='dark'] [data-platform='roblox'] {
  --accent: #dedede;
  --accent-hover: #f1f1f1;
  --accent-text: #eeeeee;
  --accent-soft: #303030;
  --accent-on: #181818;
}
html[data-theme='dark'] [data-game-theme='raf'] {
  --accent: #57c5eb;
  --accent-hover: #86d9f5;
  --accent-text: #9fdef3;
  --accent-soft: #303030;
  --accent-on: #122a36;
}
html[data-theme='dark'] [data-game-theme='hac'] {
  --accent: #62b9ee;
  --accent-hover: #8fd0f6;
  --accent-text: #a8d9f8;
  --accent-soft: #303030;
  --accent-on: #15293b;
}
html[data-theme='dark'] body {
  color: var(--ink);
  background: var(--canvas);
}
html[data-theme='dark']
  :is(
    .topbar,
    .login,
    .stat-card,
    .connection-card,
    .settings-card,
    .settings-panel,
    .settings-linked-resources,
    .result-item,
    .request-card,
    .search-results,
    .community-picker-popover,
    .community-picker-option,
    .docs-menu,
    .skip,
    .skip-link
  ) {
  color: var(--ink);
  background: var(--surface);
  border-color: var(--border);
}
html[data-theme='dark']
  :is(
    .panel .panel,
    th,
    .badge.neutral,
    .role-options-list label,
    .setup-step-list,
    .demo-banner,
    .avatar,
    .item-art,
    .resource-image-fallback,
    .community-picker-search,
    .community-picker-browse,
    .doc-note,
    .code-block,
    .docs-search input,
    .docs-content th,
    .docs-content .doc-note
  ) {
  background: var(--surface-raised);
  border-color: var(--border);
}
html[data-theme='dark']
  :is(
    label,
    td,
    .resource-header h1,
    .sidebar-linked-game strong,
    .account-name strong,
    .topbar strong,
    .breadcrumb-list [aria-current='page'],
    .community-picker-option-copy strong,
    .setup-step-list > div,
    .docs-content strong,
    .docs-content td:first-child,
    .doc-flow b,
    .search-result strong,
    .sidebar-note strong
  ) {
  color: var(--ink);
}
html[data-theme='dark']
  :is(
    td,
    .settings-form .setting-row,
    .resource-tabs,
    .docs-brand small,
    .code-block,
    .code-heading,
    .docs-search kbd
  ) {
  border-color: var(--border);
}
html[data-theme='dark']
  :is(
    .community-picker-meta,
    .community-picker-empty,
    .community-picker-browse,
    .docs-content p,
    .docs-content li,
    .doc-lead,
    .doc-meta,
    .docs-content td,
    .docs-content th,
    .doc-flow span,
    .docs-toc h2,
    .docs-toc a,
    .toc-bottom,
    .doc-next small,
    .doc-footer,
    .search-result small,
    .search-empty,
    .nav-group h2,
    .dashboard-link,
    .docs-search kbd,
    .code-heading
  ) {
  color: var(--muted);
}
html[data-theme='dark']
  :is(
    tbody tr:hover,
    .settings-nav a:hover,
    .settings-nav button:hover,
    .quick-actions button:hover,
    .quick-actions .button:hover,
    .community-picker-option:hover,
    .start-option:hover,
    .docs-nav-link:hover
  ) {
  background: var(--surface-raised);
  color: var(--ink);
}
html[data-theme='dark']
  :is(
    .community-picker-option.is-current,
    .docs-nav-link[aria-current='page'],
    .search-result:hover,
    .search-result:focus,
    .role-options-list label:has(input:checked)
  ) {
  background: var(--accent-soft);
  border-color: var(--accent-text);
  color: var(--accent-text);
}
html[data-theme='dark'] :is(.community-picker-check, .setup-step-list .icon) {
  color: #aab4ff;
}
html[data-theme='dark']
  :is(.connected-text, .community-summary .connected-text, .checklist li::before) {
  color: var(--green);
}
html[data-theme='dark'] :is(.doc-tag, .http-method) {
  color: var(--green);
  background: var(--green-soft);
  border-color: #345d4e;
}
html[data-theme='dark'] .release-label {
  color: var(--gold);
}
html[data-theme='dark'] :is(button, .button) {
  color: var(--ink);
  background-color: var(--surface-raised);
  border-color: #575757;
}
html[data-theme='dark'] :is(button:hover, .button:hover) {
  background-color: #343434;
  border-color: #757575;
}
html[data-theme='dark'] :is(button.primary, .button.primary) {
  color: var(--accent-on);
  background: var(--accent);
  border-color: var(--accent);
}
html[data-theme='dark'] :is(button.primary:hover, .button.primary:hover) {
  background: var(--accent-hover);
  border-color: var(--accent-hover);
}
html[data-theme='dark'] :is(button.danger, .button.danger) {
  color: var(--red);
  background: var(--red-soft);
  border-color: #81505d;
}
html[data-theme='dark'] :is(button.quiet, .button.quiet) {
  background: transparent;
}
html[data-theme='dark'] :is(button.quiet:hover, .button.quiet:hover) {
  background: var(--surface-raised);
}
html[data-theme='dark'] :is(.settings-nav a.active, .settings-nav button.active) {
  color: var(--accent-on);
  background: var(--accent);
}
html[data-theme='dark'] .community-picker-trigger {
  background: #242424;
  color: var(--ink);
  border-color: #575757;
}
html[data-theme='dark'] .community-picker-trigger:hover {
  background: #333333;
}
html[data-theme='dark'] .community-picker-option {
  border-color: transparent;
  background: var(--surface);
}
html[data-theme='dark'] .community-picker-option.is-current {
  background: #303030;
  border-color: #676767;
}
html[data-theme='dark']
  :is(input, select, textarea, .setting-control > :is(input, select, textarea)) {
  color: var(--ink);
  background-color: #171717;
  border-color: #5a5a5a;
}
html[data-theme='dark'] :is(input, select, textarea):hover {
  border-color: #858585;
}
html[data-theme='dark'] :is(input, select, textarea):focus {
  border-color: var(--accent-text);
}
html[data-theme='dark'] :is(input, select, textarea):disabled {
  color: var(--subtle);
  background: #252525;
}
html[data-theme='dark'] input::file-selector-button {
  color: var(--ink);
  background: var(--surface-raised);
  border-color: var(--border);
}
html[data-theme='dark'] input::placeholder,
html[data-theme='dark'] textarea::placeholder {
  color: var(--subtle);
}
html[data-theme='dark'] :is(.badge, .badge.neutral) {
  color: var(--muted);
  background: #303030;
}
html[data-theme='dark'] .badge.good {
  color: var(--green);
  background: var(--green-soft);
}
html[data-theme='dark'] .badge.warn {
  color: var(--gold);
  background: var(--gold-soft);
}
html[data-theme='dark'] .badge.bad {
  color: var(--red);
  background: var(--red-soft);
}
html[data-theme='dark'] dialog {
  color: var(--ink);
  background: var(--surface);
  border-color: var(--border);
  box-shadow: 0 24px 100px #0008;
}
html[data-theme='dark'] dialog::backdrop {
  background: #000000b8;
}
html[data-theme='dark'] :is(code, .docs-content code) {
  color: #ededed;
  background: #2c2c2c;
}
html[data-theme='dark'] :is(pre.json, .json, .code-heading) {
  color: var(--ink);
  background: #161616;
}
html[data-theme='dark'] .docs-content .code-block code {
  color: #e7e7e7;
  background: transparent;
}
html[data-theme='dark'] .docs-header {
  color: var(--ink);
  background: #1a1a1af7;
  border-color: var(--border);
}
html[data-theme='dark'] .docs-brand {
  color: var(--ink);
}
html[data-theme='dark'] .docs-nav-link {
  color: var(--muted);
}
html[data-theme='dark'] .doc-flow small {
  color: var(--accent-text);
  background: var(--accent-soft);
}
html[data-theme='dark'] .start-option {
  border-color: var(--border);
}
html[data-theme='dark'] [data-community-setup] .form-grid > div:has(> .row > .check) {
  color: var(--ink);
  background: var(--surface);
  border-color: var(--border);
}
html[data-theme='dark'] [data-community-setup] .form-grid > div:has(> .row > .check input:checked) {
  background: var(--accent-soft);
  border-color: var(--accent-text);
}
html[data-theme='dark'] .settings-workspace .role-options-list label {
  background: var(--surface-raised);
  border-color: var(--border);
}
html[data-theme='dark'] .settings-workspace .role-options-list label:has(input:checked) {
  background: var(--accent-soft);
  border-color: var(--accent-text);
  color: var(--accent-text);
}
html[data-theme='dark'] .game-integration-link {
  color: var(--ink);
  background: var(--surface);
  border-color: var(--border);
}
html[data-theme='dark'] .skeleton {
  background: #303030;
}
html[data-theme='dark'] .select-menu-panel {
  border-color: var(--border);
  box-shadow:
    0 14px 36px #0006,
    0 3px 8px #0003;
}
html[data-theme='dark'] .select-menu-searchbar {
  color: var(--muted);
  background: #171717;
  border-color: #5a5a5a;
}
html[data-theme='dark'] .select-menu-searchbar:focus-within {
  border-color: var(--accent-text);
}
html[data-theme='dark'] .select-menu-panel .select-menu-search {
  color: var(--ink);
  background: transparent;
  border: 0;
}
html[data-theme='dark'] .select-menu-trigger:disabled {
  color: var(--subtle);
  background: #252525;
  border-color: var(--border);
}
html[data-theme='dark'] .select-menu-list {
  scrollbar-color: #636363 transparent;
}
html[data-theme='dark'] .analytics-gridline {
  stroke: #434343;
}
html[data-theme='dark'] .analytics-axis {
  fill: var(--muted);
}
html[data-theme='dark'] .fancy-loading__shadow {
  background: #000000;
  opacity: 0.35;
}
/* White source icons remain white. Brand art is never inverted or recolored. */
html[data-theme='dark']
  :is(
    .settings-nav-icon,
    .settings-nav .settings-symbol img,
    [data-game-theme] .settings-symbol img
  ) {
  filter: none;
  opacity: 0.9;
}
html[data-theme='dark']
  :is(.settings-nav a.active, .settings-nav button.active)
  .settings-nav-icon {
  background: #303030;
  border-radius: 3px;
  padding: 2px;
}
html[data-theme='dark']
  :is(
    .platform-mark.roblox,
    .settings-symbol-roblox,
    .docs-nav-link img[src$='/roblox.svg'],
    .start-option img[src$='/roblox.svg'],
    .login-platforms img[src$='/roblox.svg']
  ) {
  background: #f5f5f5;
  border-radius: 3px;
  padding: 2px;
}

/* The shell stays neutral; platform artwork, actions and status text retain their colors. */
html[data-theme='dark'] .sidebar :is(.resource-picker, .game-picker, .sidebar-linked-game) {
  color: var(--ink);
  background: var(--surface);
  border-color: var(--border);
}
html[data-theme='dark']
  .sidebar
  :is(.brand small, .nav a, .sidebar-bottom > a, .theme-switcher > summary, .theme-switcher-value) {
  color: var(--nav-muted);
}
html[data-theme='dark']
  .sidebar
  :is(.nav a:hover, .nav a.active, .sidebar-bottom > a:hover, .sidebar-bottom > a.active) {
  color: var(--ink);
  background: var(--surface-raised);
}
html[data-theme='dark']
  .sidebar
  :is(.account .icon-box, .resource-picker select, .game-picker select) {
  color: var(--ink);
  background: var(--surface);
}
html[data-theme='dark'] .sidebar-note {
  border-color: var(--border);
}
html[data-theme='dark'] .sidebar .nav a.active .icon {
  color: var(--accent-text);
}
/* One compact control in the sidebar, sign-in header, and public docs header. */
.theme-switcher {
  position: relative;
  flex: none;
  color: var(--ink, #202737);
  font-size: 12px;
  line-height: 1.4;
}
.theme-switcher > summary {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  width: 36px;
  min-height: 36px;
  border: 1px solid var(--border, #dfe4ec);
  border-radius: 7px;
  background: var(--surface, #fff);
  cursor: pointer;
  list-style: none;
}
.theme-switcher > summary::-webkit-details-marker {
  display: none;
}
.theme-switcher > summary:hover,
.theme-switcher[open] > summary {
  color: var(--accent-text, #6246bf);
  border-color: var(--accent-text, #6246bf);
}
.theme-switcher > summary:focus-visible {
  outline: 2px solid var(--accent-text, #6246bf);
  outline-offset: 3px;
}
.theme-switcher svg {
  display: block;
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.theme-switcher-label,
.theme-switcher-value {
  display: none;
}
.theme-options {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  width: 188px;
  z-index: 180;
  display: grid;
  gap: 3px;
  padding: 8px;
  border: 1px solid var(--border, #dfe4ec);
  border-radius: 9px;
  background: var(--surface, #fff);
  box-shadow: 0 10px 34px #11172229;
  color: var(--ink, #202737);
}
.theme-options-title {
  display: block;
  padding: 6px 9px 8px;
  color: var(--muted, #526077);
  font-size: 10px;
  font-weight: 650;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.theme-options button {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  min-height: 36px;
  padding: 8px 9px;
  border: 1px solid transparent;
  border-radius: 5px;
  color: var(--ink, #202737);
  background: transparent;
  font-size: 12px;
  font-weight: 500;
  text-align: left;
}
.theme-options button:hover,
.theme-options button[aria-pressed='true'] {
  color: var(--accent-text, #6246bf);
  background: var(--accent-soft, #f0ecfd);
  border-color: transparent;
}
.theme-options button[aria-pressed='true']::after {
  content: '';
  width: 5px;
  height: 9px;
  margin-left: auto;
  border: solid currentColor;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.sidebar-bottom > .theme-switcher {
  margin-top: 15px;
}
.sidebar .theme-switcher > summary {
  justify-content: flex-start;
  width: 100%;
  padding: 9px 0;
  color: #bbc6d9;
  background: transparent;
  border-color: transparent;
}
.sidebar .theme-switcher-label,
.sidebar .theme-switcher-value {
  display: block;
}
.sidebar .theme-switcher-value {
  margin-left: auto;
  color: #91a1bb;
  font-size: 10px;
}
.sidebar .theme-options {
  top: auto;
  bottom: calc(100% + 6px);
  left: 0;
  right: 0;
  width: auto;
}
.login-top {
  flex-wrap: wrap;
}
.login-top > .theme-switcher {
  margin-left: auto;
}
.docs-header > .theme-switcher {
  order: 3;
}
@media (max-width: 760px) {
  html[data-theme='dark'] .docs-sidebar {
    background: var(--canvas);
  }
  .docs-header > .theme-switcher {
    order: 2;
    margin-left: auto;
  }
  .docs-header .docs-menu {
    order: 3;
    margin-left: 0;
  }
}
@media (max-width: 480px) {
  .docs-brand small {
    display: none;
  }
  .docs-header {
    gap: 10px;
  }
}
