/* Desktop content surfaces share the flat palette measured from the local Discord installation. */
html[data-platform='desktop'] body.nova-ready {
  --studio-content-canvas: #1a1a1e;
  --studio-content-side: #202024;
  --studio-content-control: #222327;
  --studio-content-hover: #2c2c30;
  --studio-content-line: #29292d;
  --studio-content-text: #efeff1;
  --studio-content-muted: #96979e;
  --studio-content-accent: #6261ef;
}

/* The chat is a message list, with emphasis only on the selected or hovered row. */
html[data-platform='desktop'] body.nova-ready #chat .desktop-chat-layout,
html[data-platform='desktop'] body.nova-ready #chat .desktop-chat-content,
html[data-platform='desktop'] body.nova-ready #chat .chat-workspace,
html[data-platform='desktop'] body.nova-ready #chat .chat-workspace-main,
html[data-platform='desktop'] body.nova-ready #chat .chat-main-column,
html[data-platform='desktop'] body.nova-ready #chat .chat-main-column .chat-card,
html[data-platform='desktop'] body.nova-ready #chat #chatFeed {
  background: var(--studio-content-canvas) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

html[data-platform='desktop'] body.nova-ready #chat .chat-head {
  box-sizing: border-box;
  height: 50px !important;
  min-height: 50px !important;
  padding-inline: 16px !important;
  background: var(--studio-content-canvas) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--studio-content-line) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

html[data-platform='desktop'] body.nova-ready #chat #chatFeed {
  min-width: 0;
  padding: 8px 0 20px !important;
  scrollbar-color: #45454c transparent;
}

html[data-platform='desktop'] body.nova-ready #chat #chatFeed .chat-message {
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  width: 100%;
  min-width: 0;
  min-height: 54px;
  margin: 0 !important;
  padding: 8px 16px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--studio-content-text) !important;
  filter: none !important;
  transform: none !important;
}

html[data-platform='desktop'] body.nova-ready #chat #chatFeed .chat-message[hidden] {
  display: none !important;
}

/* Historical chat styles use a more specific theme selector and !important. */
html:root[data-platform='desktop'][data-theme][data-chat-style] body.nova-ready #chat #chatFeed .chat-message,
html:root[data-platform='desktop'][data-theme][data-chat-style] body.nova-ready #chat #chatFeed .chat-message[data-kind='chat'],
html:root[data-platform='desktop'][data-theme][data-chat-style] body.nova-ready #chat #chatFeed .chat-message[data-kind='gift'] {
  margin: 0 !important;
  padding: 8px 16px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: none !important;
}

html:root[data-platform='desktop'][data-theme][data-chat-style] body.nova-ready #chat #chatFeed .chat-message:hover {
  background: var(--studio-content-control) !important;
}

html:root[data-platform='desktop'][data-theme][data-chat-style] body.nova-ready #chat #chatFeed .chat-message:is(.special, .superfan-join, .moderator-join) {
  border-left: 2px solid var(--studio-content-accent) !important;
  background: var(--studio-content-side) !important;
}

html:root[data-platform='desktop'][data-theme][data-chat-style] body.nova-ready #chat #chatFeed .chat-message:is(.special, .superfan-join, .moderator-join):hover {
  background: var(--studio-content-hover) !important;
}

html[data-platform='desktop'] body.nova-ready #chat #chatFeed .chat-message:hover,
html[data-platform='desktop'] body.nova-ready #chat #chatFeed .chat-message.spam-selectable:hover {
  background: var(--studio-content-control) !important;
}

html[data-platform='desktop'] body.nova-ready #chat #chatFeed .message-leading-slot {
  width: 20px;
  flex: 0 0 20px;
  align-self: flex-start;
  min-height: 40px;
}

html[data-platform='desktop'] body.nova-ready #chat #chatFeed .message-avatar {
  width: 40px !important;
  height: 40px !important;
  flex: 0 0 40px !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: var(--studio-content-hover) !important;
  box-shadow: none !important;
  object-fit: cover;
}

html[data-platform='desktop'] body.nova-ready #chat #chatFeed .chat-message > div:last-child {
  min-width: 0;
  flex: 1 1 auto;
}

html[data-platform='desktop'] body.nova-ready #chat #chatFeed .chat-message > div:last-child > div {
  display: flex;
  align-items: baseline;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 3px 8px;
  min-width: 0;
}

html[data-platform='desktop'] body.nova-ready #chat #chatFeed .message-author {
  overflow: hidden;
  max-width: min(36ch, 70%);
  color: var(--studio-content-text) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
  background: none !important;
  background-clip: initial !important;
  -webkit-background-clip: initial !important;
  -webkit-text-fill-color: currentColor !important;
  text-shadow: none !important;
  filter: none !important;
  animation: none !important;
}

html[data-platform='desktop'] body.nova-ready #chat #chatFeed .chat-message time {
  margin: 0 !important;
  color: var(--studio-content-muted) !important;
  font-size: 10px !important;
  font-weight: 400 !important;
  line-height: 1.5;
}

html[data-platform='desktop'] body.nova-ready #chat #chatFeed .chat-message p,
html[data-platform='desktop'] body.nova-ready #chat #chatFeed .chat-message:is(.gift, .like, .envelope, .member, .share, .repost) p {
  min-width: 0;
  margin: 2px 0 0 !important;
  padding: 0 !important;
  color: var(--studio-content-text) !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
  overflow-wrap: anywhere;
}

html[data-platform='desktop'] body.nova-ready #chat #chatFeed .role-badges {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin: 0 !important;
}

html[data-platform='desktop'] body.nova-ready #chat #chatFeed .role {
  width: 18px;
  height: 18px;
  border-radius: 4px;
  background: var(--studio-content-hover);
  box-shadow: none;
}

html[data-platform='desktop'] body.nova-ready #chat #chatFeed .chat-message:is(.special, .superfan-join, .moderator-join) {
  border-left: 2px solid var(--studio-content-accent) !important;
  background: var(--studio-content-side) !important;
  color: var(--studio-content-text) !important;
  animation: none !important;
}

html[data-platform='desktop'] body.nova-ready #chat #chatFeed .chat-message:is(.special, .superfan-join, .moderator-join):hover {
  background: var(--studio-content-hover) !important;
}

html[data-platform='desktop'] body.nova-ready #chat #chatFeed .chat-message:is(.special, .superfan-join, .moderator-join)::after {
  display: none !important;
  animation: none !important;
}

html[data-platform='desktop'] body.nova-ready #chat #chatFeed .chat-message:is(.special, .superfan-join, .moderator-join) :is(.message-author, time, p) {
  color: var(--studio-content-text) !important;
}

html[data-platform='desktop'] body.nova-ready #chat #chatFeed .chat-message .special-avatar {
  color: var(--studio-content-accent) !important;
}

html[data-platform='desktop'][data-chat-style='compact'] body.nova-ready #chat #chatFeed .chat-message {
  min-height: 32px;
  gap: 8px !important;
  padding-block: 4px !important;
}

html[data-platform='desktop'][data-chat-style='compact'] body.nova-ready #chat #chatFeed .message-avatar {
  width: 26px !important;
  height: 26px !important;
  flex-basis: 26px !important;
}

html[data-platform='desktop'][data-chat-style='spacious'] body.nova-ready #chat #chatFeed .chat-message {
  min-height: 60px;
  padding-block: 10px !important;
}

/* The viewer roster follows the chat as a quiet, fixed-width inspector. */
html[data-platform='desktop'] body.nova-ready #chat .desktop-viewer-sidebar,
html[data-platform='desktop'] body.nova-ready #chat .desktop-viewer-sidebar > header {
  background: var(--studio-content-canvas) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

html[data-platform='desktop'] body.nova-ready #chat .desktop-viewer-sidebar {
  border-left: 1px solid var(--studio-content-line) !important;
}

html[data-platform='desktop'] body.nova-ready #chat .desktop-viewer-sidebar > header {
  box-sizing: border-box;
  height: 50px;
  min-height: 50px;
  padding: 0 12px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--studio-content-line) !important;
}

html[data-platform='desktop'] body.nova-ready #chat .desktop-viewer-sidebar > header h2 {
  color: var(--studio-content-text);
  font-size: 13px;
  font-weight: 700;
}

html[data-platform='desktop'] body.nova-ready #chat .desktop-viewer-scroll {
  padding: 8px 6px 16px;
}

html[data-platform='desktop'] body.nova-ready #chat .desktop-viewer-scroll h3 {
  min-height: 28px;
  padding-inline: 8px;
  color: var(--studio-content-muted) !important;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .04em;
}

html[data-platform='desktop'] body.nova-ready #chat .desktop-viewer-scroll h3 b {
  background: var(--studio-content-line);
  border-radius: 4px;
  color: var(--studio-content-muted);
}

html[data-platform='desktop'] body.nova-ready #chat .desktop-viewer-member {
  min-height: 44px;
  padding: 5px 8px;
  border-radius: 6px !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-platform='desktop'] body.nova-ready #chat .desktop-viewer-member:hover {
  background: var(--studio-content-hover) !important;
}

html[data-platform='desktop'] body.nova-ready #chat .desktop-viewer-member b {
  font-size: 12px;
  font-weight: 650;
}

html[data-platform='desktop'] body.nova-ready #chat .desktop-viewer-member small {
  color: var(--studio-content-muted);
  font-size: 10px;
}

html[data-platform='desktop'] body.nova-ready #chat .desktop-viewer-avatar,
html[data-platform='desktop'] body.nova-ready #chat .desktop-viewer-avatar-frame {
  box-shadow: none !important;
  filter: none !important;
}

html[data-platform='desktop'] body.nova-ready #chat .empty {
  background: var(--studio-content-canvas) !important;
  color: var(--studio-content-text);
}

html:root[data-platform='desktop'][data-theme] body.nova-ready #chat .empty-orbit {
  width: 52px;
  height: 52px;
  border: 1px solid var(--studio-content-line) !important;
  border-radius: 8px !important;
  background: var(--studio-content-control) !important;
  color: var(--studio-content-accent) !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
  animation: none !important;
}

html[data-platform='desktop'] body.nova-ready #chat .empty h2 {
  color: var(--studio-content-text);
  font-size: 18px;
  font-weight: 700;
}

html[data-platform='desktop'] body.nova-ready #chat .empty p {
  color: var(--studio-content-muted);
  font-size: 13px;
}

html[data-platform='desktop'] body.nova-ready #chat .chat-tts-bar {
  box-sizing: border-box;
  height: 52px;
  min-height: 52px;
  padding: 6px 12px;
  border: 0;
  border-top: 1px solid var(--studio-content-line);
  border-radius: 0;
  background: var(--studio-content-canvas);
  color: var(--studio-content-text);
  box-shadow: none;
}

html[data-platform='desktop'] body.nova-ready #chat .chat-tts-bar :is(.chat-tts-voice-button, .chat-tts-filter-button, .chat-tts-mute) {
  border-radius: 6px;
  box-shadow: none;
}

html[data-platform='desktop'] body.nova-ready #chat .chat-tts-bar :is(.chat-tts-voice-button, .chat-tts-filter-button, .chat-tts-mute):hover {
  border-color: var(--studio-content-line);
  background: var(--studio-content-control);
}

/* Settings are a dedicated page with a readable form column and row separators. */
html[data-platform='desktop'] body.nova-ready #settings.tab.active {
  background: var(--studio-content-side) !important;
  padding: 28px 32px !important;
}

html[data-platform='desktop'] body.nova-ready[data-nova-view='settings'] .topbar .desktop-settings-sidebar {
  flex: 1 1 auto !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 8px 10px 16px !important;
  overflow: auto hidden !important;
}

html:root[data-platform='desktop'][data-theme] body.nova-ready[data-nova-view='settings'] .topbar #accountDock:not([hidden]) {
  display: grid !important;
}

html[data-platform='desktop'] body.nova-ready #settings .settings-content,
html[data-platform='desktop'] body.nova-ready #settings .settings-layout {
  background: transparent !important;
}

html[data-platform='desktop'] body.nova-ready #settings .settings-content {
  padding: 24px 24px 72px !important;
}

html[data-platform='desktop'] body.nova-ready #settings .settings-section,
html[data-platform='desktop'] body.nova-ready #settings .page-title {
  width: 100%;
  max-width: 800px !important;
  margin-inline: auto !important;
}

html[data-platform='desktop'] body.nova-ready #settings .settings-section {
  margin-bottom: 32px !important;
}

html[data-platform='desktop'] body.nova-ready #settings .group-head {
  margin-bottom: 12px !important;
}

html[data-platform='desktop'] body.nova-ready #settings .group-head h2 {
  color: var(--studio-content-text) !important;
  font-size: 17px !important;
}

html[data-platform='desktop'] body.nova-ready #settings .group-head p {
  color: var(--studio-content-muted) !important;
  font-size: 12px !important;
}

html[data-platform='desktop'] body.nova-ready #settings .settings-card {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-platform='desktop'] body.nova-ready #settings .setting-row {
  min-height: 66px !important;
  padding: 12px 18px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--studio-content-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-platform='desktop'] body.nova-ready #settings .settings-card > .setting-row:last-child {
  border-bottom: 0 !important;
}

html[data-platform='desktop'] body.nova-ready #settings .setting-row b {
  color: var(--studio-content-text) !important;
  font-size: 13px !important;
  font-weight: 650 !important;
}

html[data-platform='desktop'] body.nova-ready #settings .setting-row small {
  color: var(--studio-content-muted) !important;
  font-size: 11px !important;
}

html[data-platform='desktop'] body.nova-ready #settings :is(.account-profile-card, .gift-sound-row) {
  border: 1px solid var(--studio-content-line) !important;
  border-radius: 8px !important;
  background: var(--studio-content-canvas) !important;
  box-shadow: none !important;
}

html[data-platform='desktop'] body.nova-ready #settings-usage .usage-block {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-platform='desktop'] body.nova-ready #settings-usage :is(.usage-limits-card, .usage-reset-card) {
  border: 1px solid var(--codex-divider, var(--line)) !important;
  border-radius: 12px !important;
  background: var(--panel) !important;
  box-shadow: none !important;
}

html[data-platform='desktop'] body.nova-ready #settings :is(input:not([type='checkbox']):not([type='range']), select, textarea) {
  border-color: #3a3a40 !important;
  border-radius: 6px !important;
  background: var(--studio-content-canvas) !important;
  color: var(--studio-content-text) !important;
  box-shadow: none !important;
}

html[data-platform='desktop'] body.nova-ready #settings .segmented {
  border: 1px solid var(--studio-content-line);
  border-radius: 7px;
  background: var(--studio-content-canvas) !important;
  box-shadow: none !important;
}

html[data-platform='desktop'] body.nova-ready #settings .segmented button.active {
  border-radius: 5px;
  background: var(--studio-content-hover) !important;
  color: var(--studio-content-text) !important;
  box-shadow: none !important;
}

/* Secondary workspaces keep one canvas and use separators instead of decorative tiles. */
html[data-platform='desktop'] body.nova-ready :is(#archive.workspace-panel.page, .notes-dialog, .calendar-panel, .radio-panel, .radio-detail-shell, .archive-detail-mobile, .note-editor, .nova-module-page, #obsWorkspacePage) {
  background: var(--studio-content-canvas) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

html[data-platform='desktop'] body.nova-ready :is(.archive-row, .notes-list button, .category-row, .radio-playlist-row) {
  border: 0 !important;
  border-bottom: 1px solid var(--studio-content-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--studio-content-text) !important;
  box-shadow: none !important;
}

html[data-platform='desktop'] body.nova-ready :is(.archive-row, .notes-list button, .category-row, .radio-playlist-row):hover {
  background: var(--studio-content-control) !important;
}

html[data-platform='desktop'] body.nova-ready :is(.radio-now-card, .radio-playlist-card, .calendar-settings-card) {
  border: 1px solid var(--studio-content-line) !important;
  border-radius: 8px !important;
  background: var(--studio-content-side) !important;
  box-shadow: none !important;
}

html[data-platform='desktop'] body.nova-ready .calendar-days {
  gap: 0 !important;
}

html[data-platform='desktop'] body.nova-ready .calendar-day {
  border: 1px solid var(--studio-content-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-platform='desktop'] body.nova-ready .calendar-day:hover {
  background: var(--studio-content-control) !important;
}

html[data-platform='desktop'] body.nova-ready :is(.obs-editor, .obs-connection, .obs-panel, .obs-content, .obs-form, .obs-aside) {
  border-color: var(--studio-content-line) !important;
  border-radius: 8px !important;
  background: var(--studio-content-side) !important;
  box-shadow: none !important;
}

html[data-platform='desktop'] body.nova-ready #obsWorkspacePage :is(input, select, button) {
  border-color: #3a3a40 !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}

/* The shell provides each page's accessible H1; repeated inner titles waste space. */
html[data-platform='desktop'] body.nova-ready #obsWorkspacePage #settings-obs > h2,
html[data-platform='desktop'] body.nova-ready #novaPlaybookMount .nova-playbook-header h1,
html[data-platform='desktop'] body.nova-ready #novaRadarMount .li-header h2,
html[data-platform='desktop'] body.nova-ready #novaPlaybookMount .nova-playbook-eyebrow,
html[data-platform='desktop'] body.nova-ready #novaRadarMount .li-eyebrow {
  display: none !important;
}

html[data-platform='desktop'] body.nova-ready[data-nova-view='settings'] .nova-heading-clock,
html[data-platform='desktop'] body.nova-ready[data-nova-view='about'] .nova-heading-clock {
  display: none;
}

/* Radar LIVE: a data view with a flat chart, lists and a single accent. */
html[data-platform='desktop'] body.nova-ready .li-root {
  --li-bg: var(--studio-content-canvas);
  --li-surface: var(--studio-content-side);
  --li-surface-raised: var(--studio-content-hover);
  --li-line: var(--studio-content-line);
  --li-text: var(--studio-content-text);
  --li-muted: var(--studio-content-muted);
  --li-accent: var(--studio-content-accent);
  --li-accent-soft: #303044;
}

html[data-platform='desktop'] body.nova-ready .li-panel {
  border: 0;
  border-radius: 0;
  background: var(--studio-content-canvas);
}

html[data-platform='desktop'] body.nova-ready .li-header,
html[data-platform='desktop'] body.nova-ready .li-activity,
html[data-platform='desktop'] body.nova-ready .li-content,
html[data-platform='desktop'] body.nova-ready .li-metrics,
html[data-platform='desktop'] body.nova-ready .li-footnote {
  border-color: var(--studio-content-line);
}

html[data-platform='desktop'] body.nova-ready .li-metrics > div {
  background: var(--studio-content-side);
}

html[data-platform='desktop'] body.nova-ready .li-bar,
html[data-platform='desktop'] body.nova-ready .li-bar:last-child {
  background: var(--studio-content-accent);
  border-radius: 2px 2px 0 0;
}

html[data-platform='desktop'] body.nova-ready :is(.li-topic, .li-signal, .li-marker) {
  border: 0;
  border-bottom: 1px solid var(--studio-content-line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

html[data-platform='desktop'] body.nova-ready :is(.li-topic, .li-signal, .li-marker):hover {
  background: var(--studio-content-control);
}

/* Scenariusz LIVE: flat run-of-show rows and a clearly selected cue. */
html[data-platform='desktop'] body.nova-ready #novaPlaybookMount.nova-playbook {
  background: var(--studio-content-canvas);
  color: var(--studio-content-text);
}

html[data-platform='desktop'] body.nova-ready #novaPlaybookMount .nova-playbook-card {
  border: 1px solid var(--studio-content-line);
  border-radius: 0;
  background: var(--studio-content-canvas);
  box-shadow: none;
}

html[data-platform='desktop'] body.nova-ready #novaPlaybookMount .nova-playbook-segment {
  border: 0;
  border-bottom: 1px solid var(--studio-content-line);
  border-radius: 0;
  background: transparent;
}

html[data-platform='desktop'] body.nova-ready #novaPlaybookMount .nova-playbook-segment[data-active='true'] {
  border-left: 2px solid var(--studio-content-accent);
  background: var(--studio-content-hover);
}

html[data-platform='desktop'] body.nova-ready #novaPlaybookMount :is(.nova-playbook-index, .nova-playbook-metrics) {
  border-color: var(--studio-content-line);
  border-radius: 4px;
  background: var(--studio-content-side);
  box-shadow: none;
}

html[data-platform='desktop'] body.nova-ready #novaPlaybookMount .nova-playbook-segment[data-active='true'] .nova-playbook-index {
  background: var(--studio-content-accent);
}

html[data-platform='desktop'] body.nova-ready #novaPlaybookMount :is(button, input) {
  border-color: #3a3a40;
  border-radius: 6px;
  box-shadow: none;
}

html[data-platform='desktop'] body.nova-ready #novaPlaybookMount :is(.nova-playbook-form, .nova-playbook-card > header, .nova-playbook-history-row) {
  border-color: var(--studio-content-line);
}

@media (max-width: 1120px) {
  html[data-platform='desktop'] body.nova-ready #settings.tab.active {
    padding: 20px !important;
  }

  html[data-platform='desktop'] body.nova-ready #chat #chatFeed .chat-message {
    padding-inline: 12px !important;
  }
}
