body.ui-skin .settings-title {
  padding-bottom: 8px;
  margin-bottom: 7px;
  border-bottom: 1px solid var(--ui-line);
  color: var(--ui-bright);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}

body.ui-skin .setting-row {
  min-height: 31px;
}

body.ui-skin .setting-label {
  color: var(--ui-muted);
  font-size: 12px;
}

body.ui-skin :is(#settings-menu, #streamer-menu, .chat-report-dialog, .tip-modal-content, .admin-field, .form-group, .invite-section) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="hidden"]), select, textarea),
body.ui-skin :is(#emoji-search input, .emoji-picker-search) {
  border: 1px solid #e3b47d33;
  border-radius: 9px;
  background-color: #110e0baa;
  color: var(--ui-text);
  box-shadow: inset 0 2px 5px #0002, 0 1px #ffe4bd08;
  transition: border-color .16s, box-shadow .16s;
}

body.ui-skin :is(#settings-menu, #streamer-menu, .chat-report-dialog, .tip-modal-content, .admin-field, .form-group, .invite-section) :is(input, select, textarea):focus-visible,
body.ui-skin :is(#emoji-search input, .emoji-picker-search):focus-visible {
  border-color: var(--ui-orange);
  outline: 2px solid #f7931a44;
  outline-offset: 2px;
}

body.ui-skin :is(#settings-menu, #streamer-menu, .chat-report-dialog, .tip-modal-content, .admin-field, .form-group) :is(input, textarea)::placeholder {
  color: #aa9179;
  opacity: .8;
}

body.ui-skin :is(#settings-menu, #streamer-menu) select option,
body.ui-skin :is(.admin-field, .form-group) select option {
  background: var(--ui-panel);
  color: var(--ui-text);
}

body.ui-skin :is(#settings-menu, #streamer-menu) input[type="checkbox"],
body.ui-skin .chat-report-categories input,
body.ui-admin input[type="checkbox"] {
  accent-color: var(--ui-orange);
}

body.ui-skin .toggle-slider {
  background: #35291f;
  box-shadow: inset 0 1px 3px #0004;
}

body.ui-skin .toggle-switch input:checked + .toggle-slider {
  background: linear-gradient(120deg, #cf6914, #ffad47);
}

body.ui-skin :is(
  button, [role="button"], .btn, .auth-btn, .info-icon, .msg-reply,
  .pending-reply-cancel, .stage-invite-btn, .stage-kick-btn,
  #streamer-menu-btn, #ban-popup .ban-btn, #viewer-count, #stage-header-btn, #twitch-indicator
):not(:where(
  .stream-chrome *, .main-video-wrap *, .featured-video-wrap *,
  .vod-video-wrap *, .stream-quality-picker *
)) {
  --btn-solid: transparent;
  --btn-rest: var(--ui-button-rest);
  --btn-hover: var(--ui-button-hover);
  --btn-active: var(--ui-button-active);
  --btn-border: var(--ui-button-edge);
  --btn-border-hover: #f7931a66;
  --btn-color: var(--ui-bright);
  --btn-color-hover: var(--ui-bright);
  --btn-role-shadow: var(--ui-button-glow);
  --btn-role-shadow-hover: var(--ui-button-glow-hover);
  --btn-shadow-active: var(--ui-button-glow), inset 0 1px 3px #0003;
  --btn-radius: 9px;
  --btn-focus: var(--ui-bright);
  background-color: transparent !important;
  background-image: var(--btn-rest) !important;
  border: 1px solid var(--btn-border) !important;
  border-radius: var(--btn-radius) !important;
  color: var(--btn-color) !important;
  box-shadow: var(--btn-role-shadow);
  transition: background-color .16s, border-color .16s, color .16s, opacity .16s;
}

body.ui-skin :is(
  button, [role="button"], .btn, .auth-btn, .info-icon, .msg-reply,
  .pending-reply-cancel, .stage-invite-btn, .stage-kick-btn,
  #streamer-menu-btn, #ban-popup .ban-btn, #viewer-count, #stage-header-btn, #twitch-indicator
):not(:where(
  .stream-chrome *, .main-video-wrap *, .featured-video-wrap *,
  .vod-video-wrap *, .stream-quality-picker *
)):not(:disabled):not([aria-disabled="true"]):hover {
  background-image: var(--btn-hover) !important;
  border-color: var(--btn-border-hover) !important;
  color: var(--btn-color-hover) !important;
  box-shadow: var(--btn-role-shadow-hover);
}

body.ui-skin :is(
  button, [role="button"], .btn, .auth-btn, .info-icon, .msg-reply,
  .pending-reply-cancel, .stage-invite-btn, .stage-kick-btn,
  #streamer-menu-btn, #ban-popup .ban-btn, #viewer-count, #stage-header-btn, #twitch-indicator
):not(:where(
  .stream-chrome *, .main-video-wrap *, .featured-video-wrap *,
  .vod-video-wrap *, .stream-quality-picker *
)):not(:disabled):not([aria-disabled="true"]):active {
  background-image: var(--btn-active) !important;
  box-shadow: var(--btn-shadow-active);
}

body.ui-skin :is(
  button, [role="button"], .btn, .auth-btn, .info-icon, .msg-reply,
  .pending-reply-cancel, .stage-invite-btn, .stage-kick-btn,
  #streamer-menu-btn, #ban-popup .ban-btn, #viewer-count, #stage-header-btn, #twitch-indicator
):not(:where(
  .stream-chrome *, .main-video-wrap *, .featured-video-wrap *,
  .vod-video-wrap *, .stream-quality-picker *
)):is(.active, .selected, .on, [aria-pressed="true"], [aria-selected="true"], [aria-current="page"]) {
  --btn-rest: var(--ui-button-active);
  --btn-hover: linear-gradient(#f7931a40, #f7931a40);
  --btn-border: #f7931a80;
  --btn-role-shadow: var(--ui-button-glow), inset 0 -2px 1px #ffa63e99;
}

body.ui-skin :is(
  button, [role="button"], .btn, .auth-btn, .info-icon, .msg-reply,
  .pending-reply-cancel, .stage-invite-btn, .stage-kick-btn,
  #streamer-menu-btn, #ban-popup .ban-btn, #viewer-count, #stage-header-btn, #twitch-indicator
):not(:where(
  .stream-chrome *, .main-video-wrap *, .featured-video-wrap *,
  .vod-video-wrap *, .stream-quality-picker *
)):focus-visible {
  outline: 2px solid var(--ui-bright) !important;
  outline-offset: 2px;
}

body.ui-skin :is(
  button, [role="button"], .btn, .auth-btn, .info-icon, .msg-reply,
  .pending-reply-cancel, .stage-invite-btn, .stage-kick-btn,
  #streamer-menu-btn, #ban-popup .ban-btn, #viewer-count, #stage-header-btn, #twitch-indicator
):not(:where(
  .stream-chrome *, .main-video-wrap *, .featured-video-wrap *,
  .vod-video-wrap *, .stream-quality-picker *
)):is(:disabled, [aria-disabled="true"]) {
  opacity: .45;
  cursor: not-allowed;
}

body.ui-skin #chat-header #viewer-count,
body.ui-skin #chat-header #stage-header-btn {
  background: none !important;
  border: 0 !important;
  box-shadow: none;
}

body.ui-skin #chat-header #stage-header-btn .stage-icon {
  display: block;
  width: 18px;
  height: 18px;
  color: #ffd4a0;
}

body.ui-skin #streamer-menu-btn {
  width: 30px;
  height: 30px;
  padding: 0;
  flex-shrink: 0;
}

body.ui-skin #streamer-menu-btn svg {
  width: 18px;
  height: 18px;
}

body.ui-skin #emoji-picker {
  border-color: var(--ui-edge);
  border-radius: 18px;
  background: radial-gradient(ellipse at top left, #f7931a14, transparent 65%), #1b1612ed;
  box-shadow: var(--ui-pop-shadow);
  backdrop-filter: var(--ui-blur);
  -webkit-backdrop-filter: var(--ui-blur);
}

body.ui-skin :is(#emoji-tabs, #gif-provider-tabs) {
  gap: 6px;
  border-color: var(--ui-line);
  background: #ffffff03;
}

body.ui-skin .emoji-item {
  border-color: #e3b47d14;
  background: #ffffff03;
  box-shadow: none;
}

body.ui-skin .emoji-item:hover {
  border-color: var(--ui-edge);
  background: #f7931a12;
}

body.ui-skin :is(.gif-item, .music-request, .bobs-panel, .bobs-offer, .bobs-runtime-row) {
  border-color: var(--ui-line);
  border-radius: 9px;
}

body.ui-skin #music-queue-panel {
  background: linear-gradient(120deg, #342515aa, #1c1713dd);
  border-color: var(--ui-edge);
}

body.ui-skin #music-queue-toggle {
  --btn-color: var(--ui-bright);
  --btn-color-hover: var(--ui-text);
  font-weight: 700;
  letter-spacing: .025em;
}

body.ui-skin :is(#mod-queue-popup, .chat-report-dialog) {
  border: 1px solid #d9925b66;
  border-radius: 16px;
  background: linear-gradient(155deg, #37251eed, #191411f5);
  color: var(--ui-text);
  box-shadow: var(--ui-pop-shadow);
  backdrop-filter: var(--ui-blur);
  -webkit-backdrop-filter: var(--ui-blur);
}

body.ui-skin :is(.mod-queue-heading, .mod-queue-pagination) {
  border-color: var(--ui-line);
}

body.ui-skin .mod-queue-entry {
  border-color: var(--ui-line);
  border-radius: 10px;
  background: #100d0b80;
}

body.ui-skin .chat-report-form h2 {
  color: var(--ui-text);
  letter-spacing: -.025em;
}

body.ui-skin .chat-report-categories span {
  border-color: var(--ui-line);
  border-radius: 9px;
  background: #100d0b66;
  color: var(--ui-muted);
}

body.ui-skin .chat-report-categories input:checked + span {
  border-color: var(--ui-orange);
  background: #f7931a18;
  color: var(--ui-bright);
}

body.ui-skin :is(.tip-modal-backdrop, .whats-new-backdrop),
body.ui-skin .chat-report-dialog::backdrop {
  background: #100b07b8;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}

body.ui-skin .tip-modal-content {
  border: 1px solid #f7931a66;
  border-radius: 22px;
  background: radial-gradient(ellipse at top, #f7931a24, transparent 68%), #21170fed;
  box-shadow: 0 24px 80px #0008, inset 0 1px #ffdfb51a;
  backdrop-filter: var(--ui-blur);
  -webkit-backdrop-filter: var(--ui-blur);
  color: var(--ui-text);
}

body.ui-skin :is(.tip-modal-content, .overlay-content) {
  max-height: calc(100dvh - 40px);
  overflow-y: auto;
  overscroll-behavior: contain;
}

body.ui-skin .tip-modal-header {
  color: var(--ui-bright);
  font-weight: 750;
  letter-spacing: -.02em;
}

body.ui-skin .tip-modal-amount {
  color: #ffd09a;
  font-size: 28px;
  font-variant-numeric: tabular-nums;
}

body.ui-skin .whats-new-card {
  border: 1px solid #f7931a55;
  border-radius: 24px;
  background: radial-gradient(ellipse at top right, #f7931a1f, transparent 55%), #211a14f2;
  color: var(--ui-text);
  box-shadow: 0 24px 80px #0008, inset 0 1px #ffdfb51a;
  backdrop-filter: var(--ui-blur);
  -webkit-backdrop-filter: var(--ui-blur);
}

body.ui-skin .whats-new-title {
  color: var(--ui-text);
  font-size: 24px;
  font-weight: 750;
  letter-spacing: -.035em;
}

body.ui-skin .whats-new-date {
  color: var(--ui-dim);
  letter-spacing: .12em;
}

body.ui-skin .whats-new-entry {
  border-color: var(--ui-line);
}

body.ui-skin .whats-new-entry-title {
  color: var(--ui-text);
  font-weight: 650;
}

body.ui-skin .whats-new-entry-body {
  color: var(--ui-muted);
  line-height: 1.65;
}

body.ui-skin :is(.whats-new-tag, .whats-new-count) {
  border: 1px solid #f7931a33;
  background: #f7931a12;
  color: var(--ui-bright);
}

body.ui-skin :is(.ui-empty, .empty-state, #auth-wall, .error-state, .vod-empty) {
  border: 1px solid var(--ui-line);
  border-radius: 18px;
  background: linear-gradient(145deg, #30221880, #1c1713a6);
  color: var(--ui-muted);
  box-shadow: inset 0 1px #ffe4bd0a;
}