/* Chuột GPT dark workspace: high-contrast red OLED surfaces, scoped to oprt only. */
html[data-accent] body.openrouter-body,
body.openrouter-body {
  --ink: #f8fafc !important;
  --ink-soft: #e2e8f0 !important;
  --muted: #a8b3c2 !important;
  --muted-dark: #7f8da0 !important;
  --line: #7f1d1d !important;
  --paper: #05070a !important;
  --surface: #16090c !important;
  --gold: #fecaca !important;
  --gold-deep: #ef4444 !important;
  --theme-page-bg: #05070a !important;
  --theme-page-surface: #16090c !important;
  --theme-page-soft: #1c0b0f !important;
  --theme-page-glow: #450a0a !important;
  color: #f8fafc !important;
  background: #05070a !important;
  color-scheme: dark;
}

html[data-accent] body.openrouter-body,
html[data-accent] body.openrouter-body :where(a, button, input, textarea, select, label, p, span, strong, small, h1, h2, h3),
body.openrouter-body,
body.openrouter-body :where(a, button, input, textarea, select, label, p, span, strong, small, h1, h2, h3) {
  font-family: "Noto Sans Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
}

html[data-accent] body.openrouter-body .app-shell,
body.openrouter-body .app-shell {
  background: #05070a !important;
}

html[data-accent] body.openrouter-body .main-content,
body.openrouter-body .main-content {
  background: #05070a !important;
}

html[data-accent] body.openrouter-body .sidebar,
body.openrouter-body .sidebar {
  color: #f8fafc !important;
  background: #020407 !important;
  border-right-color: #3f1115 !important;
}

html[data-accent] body.openrouter-body .brand,
html[data-accent] body.openrouter-body .sidebar-label,
html[data-accent] body.openrouter-body .sidebar .nav-item,
html[data-accent] body.openrouter-body .sidebar .muted,
body.openrouter-body .brand,
body.openrouter-body .sidebar-label,
body.openrouter-body .sidebar .nav-item,
body.openrouter-body .sidebar .muted {
  color: #cbd5e1 !important;
}

html[data-accent] body.openrouter-body .sidebar .nav-item:hover,
body.openrouter-body .sidebar .nav-item:hover {
  color: #ffffff !important;
  background: #2a0f14 !important;
}

html[data-accent] body.openrouter-body .sidebar .nav-item.active,
body.openrouter-body .sidebar .nav-item.active {
  color: #ffffff !important;
  background: #450a0a !important;
  box-shadow: inset 3px 0 0 #ef4444 !important;
}

html[data-accent] body.openrouter-body .secure-note,
body.openrouter-body .secure-note {
  color: #a8b3c2 !important;
  border-color: #3f1115 !important;
}

html[data-accent] body.openrouter-body .secure-note strong,
body.openrouter-body .secure-note strong {
  color: #e2e8f0 !important;
}

html[data-accent] body.openrouter-body .secure-note small,
body.openrouter-body .secure-note small {
  color: #7f8da0 !important;
}

html[data-accent] body.openrouter-body .ai-mobile-tabs,
body.openrouter-body .ai-mobile-tabs {
  border-color: #7f1d1d !important;
  background: #17090b !important;
}

html[data-accent] body.openrouter-body .ai-mobile-tab,
body.openrouter-body .ai-mobile-tab {
  color: #a8b3c2 !important;
}

html[data-accent] body.openrouter-body .ai-mobile-tab:hover,
html[data-accent] body.openrouter-body .ai-mobile-tab.active,
body.openrouter-body .ai-mobile-tab:hover,
body.openrouter-body .ai-mobile-tab.active {
  color: #ffffff !important;
  background: #3b1118 !important;
}

html[data-accent] body.openrouter-body .ai-chat-panel,
body.openrouter-body .ai-chat-panel {
  color: #f8fafc !important;
  background: #16090c !important;
  border-color: #7f1d1d !important;
  box-shadow: 0 20px 54px rgb(0 0 0 / 42%) !important;
}

html[data-accent] body.openrouter-body .ai-chat-header,
body.openrouter-body .ai-chat-header {
  border-color: #5f151c !important;
  background: linear-gradient(135deg, #1a090d 0%, #2b0f14 100%) !important;
}

html[data-accent] body.openrouter-body .ai-identity strong,
body.openrouter-body .ai-identity strong {
  color: #ffffff !important;
}

html[data-accent] body.openrouter-body .ai-identity small,
body.openrouter-body .ai-identity small {
  color: #a8b3c2 !important;
}

html[data-accent] body.openrouter-body .ai-avatar,
body.openrouter-body .ai-avatar {
  color: #fecaca !important;
  background: #450a0a !important;
}

html[data-accent] body.openrouter-body .model-controls,
body.openrouter-body .model-controls {
  color: #e2e8f0 !important;
}

html[data-accent] body.openrouter-body .model-controls label,
body.openrouter-body .model-controls label {
  color: #94a3b8 !important;
}

html[data-accent] body.openrouter-body .model-controls select,
html[data-accent] body.openrouter-body .model-picker-button,
body.openrouter-body .model-controls select,
body.openrouter-body .model-picker-button {
  color: #f8fafc !important;
  background: #1c0b0f !important;
  border-color: #7f1d1d !important;
  color-scheme: dark;
}

html[data-accent] body.openrouter-body .model-picker-button:hover,
html[data-accent] body.openrouter-body .model-picker-button[aria-expanded="true"],
body.openrouter-body .model-picker-button:hover,
body.openrouter-body .model-picker-button[aria-expanded="true"] {
  color: #ffffff !important;
  background: #2b0f14 !important;
  border-color: #ef4444 !important;
}

html[data-accent] body.openrouter-body .model-picker-icon,
body.openrouter-body .model-picker-icon {
  color: #fecaca !important;
}

html[data-accent] body.openrouter-body .model-controls .text-button,
body.openrouter-body .model-controls .text-button {
  color: #cbd5e1 !important;
}

html[data-accent] body.openrouter-body .model-controls .text-button:hover,
body.openrouter-body .model-controls .text-button:hover {
  color: #fecaca !important;
}

html[data-accent] body.openrouter-body .model-controls .model-buy-button,
body.openrouter-body .model-controls .model-buy-button {
  color: #ffffff !important;
  background: #b91c1c !important;
  border-color: #b91c1c !important;
}

html[data-accent] body.openrouter-body .model-controls .model-buy-button:hover:not(:disabled),
body.openrouter-body .model-controls .model-buy-button:hover:not(:disabled) {
  color: #ffffff !important;
  background: #991b1b !important;
  border-color: #991b1b !important;
}

html[data-accent] body.openrouter-body .model-info,
html[data-accent] body.openrouter-body .model-library,
body.openrouter-body .model-info,
body.openrouter-body .model-library {
  color: #cbd5e1 !important;
  border-color: #5f151c !important;
  background: #16090c !important;
}

html[data-accent] body.openrouter-body .model-card,
body.openrouter-body .model-card {
  color: #e2e8f0 !important;
  background: #1c0b0f !important;
  border-color: #7f1d1d !important;
}

html[data-accent] body.openrouter-body .model-card:hover,
html[data-accent] body.openrouter-body .model-card.is-selected,
body.openrouter-body .model-card:hover,
body.openrouter-body .model-card.is-selected {
  color: #ffffff !important;
  background: #2b0f14 !important;
  border-color: #ef4444 !important;
}

html[data-accent] body.openrouter-body .model-card-name,
body.openrouter-body .model-card-name {
  color: #f8fafc !important;
}

html[data-accent] body.openrouter-body .model-card-position,
body.openrouter-body .model-card-position {
  color: #94a3b8 !important;
}

html[data-accent] body.openrouter-body .model-card-badge.free,
body.openrouter-body .model-card-badge.free {
  color: #bae6fd !important;
  background: #450a0a !important;
}

html[data-accent] body.openrouter-body .model-card-badge.paid,
body.openrouter-body .model-card-badge.paid {
  color: #fde68a !important;
  background: #422006 !important;
}

html[data-accent] body.openrouter-body .model-card-badge.owned,
body.openrouter-body .model-card-badge.owned {
  color: #cbd5e1 !important;
  background: #5b151b !important;
}

html[data-accent] body.openrouter-body .ai-messages,
body.openrouter-body .ai-messages {
  color: #f8fafc !important;
  background: #0b0506 !important;
  border-color: #5f151c !important;
  color-scheme: dark;
}

html[data-accent] body.openrouter-body .ai-message:not(.error),
html[data-accent] body.openrouter-body .ai-message:not(.error) p,
html[data-accent] body.openrouter-body .ai-message:not(.error) .ai-message-label,
html[data-accent] body.openrouter-body .ai-message.user,
html[data-accent] body.openrouter-body .ai-message.user p,
html[data-accent] body.openrouter-body .ai-message.user .ai-message-label,
html[data-accent] body.openrouter-body .ai-message p mjx-container,
body.openrouter-body .ai-message:not(.error),
body.openrouter-body .ai-message:not(.error) p,
body.openrouter-body .ai-message:not(.error) .ai-message-label,
body.openrouter-body .ai-message.user,
body.openrouter-body .ai-message.user p,
body.openrouter-body .ai-message.user .ai-message-label,
body.openrouter-body .ai-message p mjx-container {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
}

html[data-accent] body.openrouter-body .ai-message.user,
body.openrouter-body .ai-message.user {
  background: #3b1118 !important;
  border-color: #7f1d1d !important;
  box-shadow: 0 8px 22px rgb(0 0 0 / 24%) !important;
}

html[data-accent] body.openrouter-body .ai-message-label,
body.openrouter-body .ai-message-label {
  color: #94a3b8 !important;
}

html[data-accent] body.openrouter-body .ai-message.error,
body.openrouter-body .ai-message.error {
  color: #fca5a5 !important;
  -webkit-text-fill-color: #fca5a5 !important;
}

html[data-accent] body.openrouter-body .ai-quota-box,
body.openrouter-body .ai-quota-box {
  color: #cbd5e1 !important;
  background: #1c0b0f !important;
  border-color: #7f1d1d !important;
}

html[data-accent] body.openrouter-body .ai-quota-label,
body.openrouter-body .ai-quota-label {
  color: #f8fafc !important;
}

html[data-accent] body.openrouter-body .ai-quota-box strong,
body.openrouter-body .ai-quota-box strong {
  color: #ffffff !important;
  background: #ef4444 !important;
}

html[data-accent] body.openrouter-body .ai-quota-purchase,
body.openrouter-body .ai-quota-purchase {
  color: #ffffff !important;
  background: #b91c1c !important;
  border-color: #f87171 !important;
}

html[data-accent] body.openrouter-body .ai-quota-purchase:hover:not(:disabled),
body.openrouter-body .ai-quota-purchase:hover:not(:disabled) {
  color: #ffffff !important;
  background: #991b1b !important;
}

html[data-accent] body.openrouter-body .ai-composer,
body.openrouter-body .ai-composer {
  color: #f8fafc !important;
  background: #16090c !important;
  border-color: #5f151c !important;
}

html[data-accent] body.openrouter-body .ai-composer textarea,
html[data-accent] body.openrouter-body .ai-composer textarea:hover,
html[data-accent] body.openrouter-body .ai-composer textarea:focus,
body.openrouter-body .ai-composer textarea,
body.openrouter-body .ai-composer textarea:hover,
body.openrouter-body .ai-composer textarea:focus {
  color: #f8fafc !important;
  -webkit-text-fill-color: #f8fafc !important;
  caret-color: #ffffff !important;
  background: #1c0b0f !important;
  border-color: #7f1d1d !important;
  color-scheme: dark;
}

html[data-accent] body.openrouter-body .ai-composer textarea::placeholder,
body.openrouter-body .ai-composer textarea::placeholder {
  color: #94a3b8 !important;
  opacity: 1 !important;
}

html[data-accent] body.openrouter-body .ai-composer textarea,
html[data-accent] body.openrouter-body .ai-composer textarea:hover,
html[data-accent] body.openrouter-body .ai-composer textarea:focus,
body.openrouter-body .ai-composer textarea,
body.openrouter-body .ai-composer textarea:hover,
body.openrouter-body .ai-composer textarea:focus {
  color: #450a0a !important;
  -webkit-text-fill-color: #450a0a !important;
  caret-color: #450a0a !important;
  background: #ef4444 !important;
  border-color: #fca5a5 !important;
  box-shadow: 0 0 0 3px rgb(239 68 68 / 34%) !important;
  color-scheme: light;
}

html[data-accent] body.openrouter-body .ai-composer textarea::placeholder,
body.openrouter-body .ai-composer textarea::placeholder {
  color: #7f1d1d !important;
  -webkit-text-fill-color: #7f1d1d !important;
  opacity: 1 !important;
}

html[data-accent] body.openrouter-body #openrouter-send,
body.openrouter-body #openrouter-send {
  color: #ffffff !important;
  background: #b91c1c !important;
  border-color: #b91c1c !important;
}

html[data-accent] body.openrouter-body #openrouter-send:hover:not(:disabled),
body.openrouter-body #openrouter-send:hover:not(:disabled) {
  color: #ffffff !important;
  background: #991b1b !important;
  border-color: #991b1b !important;
}

html[data-accent] body.openrouter-body .ai-form-hint,
body.openrouter-body .ai-form-hint {
  color: #7f8da0 !important;
}

html[data-accent] body.openrouter-body .ai-connection,
body.openrouter-body .ai-connection {
  color: #a8b3c2 !important;
}

html[data-accent] body.openrouter-body .ai-connection .status-dot,
body.openrouter-body .ai-connection .status-dot {
  background: #22c55e !important;
  box-shadow: 0 0 0 3px rgb(34 197 94 / 20%) !important;
}

html[data-accent] body.openrouter-body .ai-connection .status-dot.offline,
body.openrouter-body .ai-connection .status-dot.offline {
  background: #64748b !important;
  box-shadow: none !important;
}

@media (max-width: 820px) {
  html[data-accent] body.openrouter-body .ai-chat-panel,
  body.openrouter-body .ai-chat-panel {
    box-shadow: none !important;
  }

  html[data-accent] body.openrouter-body .model-controls,
  body.openrouter-body .model-controls {
    background: #16090c !important;
  }
}

/* Final specificity override for the actual AI chat input. */
html[data-accent] body.openrouter-body .openrouter-page #openrouter-input,
html[data-accent] body.openrouter-body .openrouter-page #openrouter-input:hover,
html[data-accent] body.openrouter-body .openrouter-page #openrouter-input:focus,
body.openrouter-body .openrouter-page #openrouter-input,
body.openrouter-body .openrouter-page #openrouter-input:hover,
body.openrouter-body .openrouter-page #openrouter-input:focus {
  color: #450a0a !important;
  -webkit-text-fill-color: #450a0a !important;
  caret-color: #450a0a !important;
  background: #ef4444 !important;
  border-color: #fca5a5 !important;
  box-shadow: 0 0 0 3px rgb(239 68 68 / 34%) !important;
  color-scheme: light;
}

html[data-accent] body.openrouter-body .openrouter-page #openrouter-input::placeholder,
body.openrouter-body .openrouter-page #openrouter-input::placeholder {
  color: #7f1d1d !important;
  -webkit-text-fill-color: #7f1d1d !important;
  opacity: 1 !important;
}
