body.roberin-random-roulette-spinner-the-new {
  --rrtn-ink: #1a1208;
  --rrtn-muted: #5a4a30;
  --rrtn-line: #b8a888;
  --rrtn-soft-line: #ddd4be;
  --rrtn-paper: #faf6ee;
  --rrtn-wash: #f5efdf;
  --rrtn-button: #ede6d4;
  --rrtn-button-hover: #dfd4bb;
  --rrtn-accent: #c44a00;
  --rrtn-accent-dark: #893700;
  --rrtn-good: #355b2f;
  --rrtn-wheel-1: #c45a2a;
  --rrtn-wheel-2: #d8a15a;
  --rrtn-wheel-3: #66724a;
  --rrtn-wheel-4: #8c5b3d;
  --rrtn-sans: -apple-system, BlinkMacSystemFont, 'Pretendard', 'Segoe UI', system-ui, 'Apple SD Gothic Neo', 'Noto Sans KR', sans-serif;
  color: var(--rrtn-ink);
}

body.roberin-random-roulette-spinner-the-new .tn-hero,
body.roberin-random-roulette-spinner-the-new .tn-roulette-tool,
body.roberin-random-roulette-spinner-the-new .tool-meta-row,
body.roberin-random-roulette-spinner-the-new .tn-design-note,
body.roberin-random-roulette-spinner-the-new .tn-article-panel,
body.roberin-random-roulette-spinner-the-new .tn-ad {
  max-width: 1180px;
  margin-left: auto;
  margin-right: auto;
}

.tn-roulette-tool,
.tn-roulette-tool * {
  box-sizing: border-box;
}

.tn-roulette-tool ul,
.tn-roulette-tool ol,
.tn-roulette-tool li,
.tn-article-panel ul,
.tn-article-panel ol,
.tn-article-panel li {
  list-style: none;
  padding-left: 0;
  margin: 0;
}

.tn-roulette-tool {
  margin-top: 24px;
  background: linear-gradient(180deg, var(--rrtn-paper), var(--rrtn-wash));
  border: 1px solid var(--rrtn-line);
  border-top: 3px double var(--rrtn-line);
  border-bottom: 3px double var(--rrtn-line);
  color: var(--rrtn-ink);
  -webkit-text-fill-color: var(--rrtn-ink);
  font-family: Georgia, 'Times New Roman', 'Noto Serif KR', serif;
  padding: 14px;
}

.tn-roulette-grid {
  display: grid;
  grid-template-columns: minmax(300px, .88fr) minmax(360px, 1.12fr);
  gap: 12px;
  align-items: stretch;
}

.tn-roulette-composer,
.tn-roulette-stage,
.tn-result-window,
.tn-history-row,
.tn-modal-panel {
  background: color-mix(in srgb, var(--rrtn-paper) 86%, #fff 14%);
  border: 1px solid var(--rrtn-line);
  color: var(--rrtn-ink);
  -webkit-text-fill-color: var(--rrtn-ink);
}

.tn-roulette-composer,
.tn-roulette-stage {
  min-width: 0;
  padding: 12px;
}

/* The stage is the taller pane, so the composer would otherwise end in dead space.
   Let the item list absorb the difference and show more rows instead. */
.tn-roulette-composer {
  display: grid;
  grid-template-rows: auto auto auto minmax(120px, 1fr) auto auto;
}

.tn-pane-head,
.tn-summary-head,
.tn-modal-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  border-bottom: 1px solid var(--rrtn-line);
  padding-bottom: 7px;
  margin-bottom: 10px;
}

.tn-pane-head h2,
.tn-summary-head h3,
.tn-modal-head h2 {
  margin: 0;
  font-size: 15px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: .01em;
  color: var(--rrtn-ink);
  -webkit-text-fill-color: var(--rrtn-ink);
}

.tn-pane-head small,
.tn-summary-head span,
.tn-modal-head span,
.tn-history-row > span,
.tn-roulette-status,
.tn-result-window span {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
  line-height: 1.25;
  color: var(--rrtn-muted);
  -webkit-text-fill-color: var(--rrtn-muted);
}

.tn-roulette-add {
  display: grid;
  grid-template-columns: 1fr 76px;
  gap: 8px;
  align-items: end;
}

.tn-field {
  display: grid;
  gap: 5px;
  min-width: 0;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
  color: var(--rrtn-muted);
  -webkit-text-fill-color: var(--rrtn-muted);
}

.tn-field input,
.tn-input-wrap input {
  width: 100%;
  min-width: 0;
  height: 36px;
  border: 1px solid var(--rrtn-line);
  border-radius: 0;
  background: var(--rrtn-paper);
  color: var(--rrtn-ink);
  -webkit-text-fill-color: var(--rrtn-ink);
  padding: 8px 10px;
  font: 14px/1.2 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  box-shadow: none;
}

.tn-field input:focus,
.tn-input-wrap input:focus,
.tn-btn:focus-visible,
.tn-text-btn:focus-visible,
.tn-switch input:focus-visible + span {
  outline: 2px solid color-mix(in srgb, var(--rrtn-accent) 65%, transparent);
  outline-offset: 2px;
}

.tn-input-wrap {
  display: grid;
  grid-template-columns: 1fr 42px;
  align-items: stretch;
  min-width: 0;
}

.tn-input-wrap b[aria-hidden='true'] {
  display: grid;
  place-items: center;
  min-height: 36px;
  border: 1px solid var(--rrtn-line);
  border-left: 0;
  border-bottom: 1px solid var(--rrtn-line);
  border-right: 1px solid var(--rrtn-line);
  background: var(--rrtn-button);
  color: var(--rrtn-muted);
  -webkit-text-fill-color: var(--rrtn-muted);
  font: 12px/1 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.tn-btn,
.tn-text-btn,
.quick-add-btn {
  border-radius: 0;
  box-shadow: none;
  cursor: pointer;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  transition: background-color .14s ease, color .14s ease, border-color .14s ease;
}

.tn-btn {
  min-height: 36px;
  border: 1px solid var(--rrtn-line);
  background: var(--rrtn-button);
  color: var(--rrtn-ink);
  -webkit-text-fill-color: var(--rrtn-ink);
  padding: 8px 12px;
  font-size: 13px;
  font-weight: 700;
}

.tn-btn--primary {
  background: var(--rrtn-ink);
  border-color: var(--rrtn-ink);
  color: var(--rrtn-paper);
  -webkit-text-fill-color: var(--rrtn-paper);
}

.tn-btn:hover,
.tn-text-btn:hover,
.quick-add-btn:hover {
  background: var(--rrtn-button-hover);
}

.tn-btn--primary:hover {
  background: var(--rrtn-accent-dark);
  border-color: var(--rrtn-accent-dark);
  color: var(--rrtn-paper);
  -webkit-text-fill-color: var(--rrtn-paper);
}

.tn-text-btn,
.quick-add-btn {
  min-height: 32px;
  border: 1px solid var(--rrtn-soft-line);
  background: transparent;
  color: var(--rrtn-ink);
  -webkit-text-fill-color: var(--rrtn-ink);
  padding: 6px 9px;
  font-size: 12px;
}

.tn-roulette-status {
  margin: 8px 0;
  padding: 7px 8px;
  border: 1px dotted var(--rrtn-line);
  background: color-mix(in srgb, var(--rrtn-wash) 82%, transparent);
}

.tn-roulette-items {
  display: grid;
  gap: 5px;
}

.tn-roulette-item,
.tn-empty-row,
.tn-history-list li {
  display: grid;
  grid-template-columns: 14px minmax(0, 1fr) 46px 52px 27px;
  align-items: center;
  gap: 7px;
  min-height: 31px;
  border: 1px solid var(--rrtn-soft-line);
  background: var(--rrtn-paper);
  padding: 4px 5px;
  color: var(--rrtn-ink);
  -webkit-text-fill-color: var(--rrtn-ink);
  font: 13px/1.25 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.tn-empty-row {
  grid-template-columns: minmax(0, 1fr);
  color: var(--rrtn-muted);
  -webkit-text-fill-color: var(--rrtn-muted);
}

.tn-item-swatch {
  width: 14px;
  height: 14px;
  border: 1px solid var(--rrtn-line);
}

.tn-item-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tn-remove-item {
  min-width: 27px;
  height: 24px;
  border: 1px solid var(--rrtn-soft-line);
  background: transparent;
  color: var(--rrtn-muted);
  -webkit-text-fill-color: var(--rrtn-muted);
  cursor: pointer;
  font: 14px/1 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.tn-remove-item:hover {
  background: var(--rrtn-button);
  color: var(--rrtn-ink);
  -webkit-text-fill-color: var(--rrtn-ink);
}

.tn-roulette-lowbar {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 9px;
  padding-top: 8px;
  border-top: 1px solid var(--rrtn-soft-line);
}

.tn-roulette-pattern {
  margin-top: 8px;
  padding: 8px;
  border: 1px dotted var(--rrtn-line);
  background: color-mix(in srgb, var(--rrtn-wash) 82%, transparent);
}

.tn-switch {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font: 12px/1 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  color: var(--rrtn-ink);
  -webkit-text-fill-color: var(--rrtn-ink);
  cursor: pointer;
}

.tn-switch input {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  opacity: 0;
}

.tn-switch span {
  position: relative;
  width: 34px;
  height: 18px;
  border: 1px solid var(--rrtn-line);
  background: var(--rrtn-paper);
}

.tn-switch span::after {
  content: '';
  position: absolute;
  top: 2px;
  left: 2px;
  width: 12px;
  height: 12px;
  background: var(--rrtn-muted);
  transition: transform .14s ease, background-color .14s ease;
}

.tn-switch input:checked + span::after {
  transform: translateX(16px);
  background: var(--rrtn-accent);
}

.tn-pattern-controls {
  display: grid;
  grid-template-columns: 1fr 92px auto;
  gap: 7px;
  align-items: end;
  margin-top: 8px;
}

.tn-pattern-controls[hidden],
.tn-roulette-modal[hidden] {
  display: none !important;
}

.tn-roulette-stage {
  display: grid;
  grid-template-rows: auto minmax(230px, 1fr) auto auto auto;
  gap: 9px;
}

.tn-wheel-shell,
.tn-modal-wheel {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 0;
  overflow: hidden;
  background: radial-gradient(circle at center, color-mix(in srgb, var(--rrtn-paper) 80%, #fff 20%) 0 45%, var(--rrtn-wash) 46% 100%);
  border: 1px solid var(--rrtn-line);
}

.tn-wheel-shell canvas,
.tn-modal-wheel canvas {
  display: block;
  width: min(100%, 420px);
  height: auto;
  max-height: 44vh;
  aspect-ratio: 1 / 1;
  contain: content;
}

.tn-wheel-pointer {
  position: absolute;
  top: 7px;
  left: 50%;
  width: 0;
  height: 0;
  transform: translateX(-50%);
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 20px solid var(--rrtn-ink);
  filter: drop-shadow(0 1px 0 var(--rrtn-paper));
}

.tn-result-window {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px;
  align-items: baseline;
  min-height: 49px;
  padding: 10px;
}

.tn-result-window strong {
  color: var(--rrtn-accent-dark);
  -webkit-text-fill-color: var(--rrtn-accent-dark);
  font-size: clamp(20px, 3vw, 31px);
  line-height: 1;
  overflow-wrap: anywhere;
}

.tn-roulette-actions {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
}

.tn-roulette-actions .tn-btn {
  min-width: 104px;
}

.tn-history-row {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 6px;
}

.tn-history-list {
  display: flex;
  gap: 5px;
  overflow: auto;
  min-width: 0;
}

.tn-history-list li {
  grid-template-columns: 1fr;
  white-space: nowrap;
  min-height: 28px;
  padding: 4px 7px;
}

.tn-roulette-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: 18px;
}

.tn-modal-overlay {
  position: absolute;
  inset: 0;
  background: color-mix(in srgb, #120c05 78%, transparent);
}

.tn-modal-panel {
  position: relative;
  width: min(920px, 100%);
  max-height: calc(100vh - 36px);
  overflow: auto;
  padding: 12px;
  display: grid;
  gap: 10px;
}

.tn-modal-wheel canvas {
  width: min(100%, 620px);
  max-height: 58vh;
}

.tn-modal-panel .tn-btn {
  justify-self: center;
  min-width: 190px;
}

.tool-meta-row.last-modified {
  margin-top: 10px;
  margin-bottom: 16px;
  text-align: right;
  font: 12px/1.3 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  color: var(--rrtn-muted);
  -webkit-text-fill-color: var(--rrtn-muted);
}

.tn-ad--top {
  min-height: 90px;
  display: grid;
  place-items: center;
  margin-top: 54px;
  margin-bottom: 20px;
}

.tn-ad--below {
  display: flex;
  gap: 12px;
  justify-content: center;
  align-items: flex-start;
  margin-bottom: 20px;
}

.tn-ad,
.tn-ad__box,
.tn-side-ad {
  background: transparent;
  border: 0;
  box-shadow: none;
}

.tn-side-rails {
  display: none;
}

.tn-article-panel {
  color: var(--rrtn-ink);
  -webkit-text-fill-color: var(--rrtn-ink);
}

.tn-article-panel ul {
  display: grid;
  gap: 6px;
  margin-top: 10px;
}

.tn-article-panel li {
  position: relative;
  padding-left: 14px;
}

.tn-article-panel li::before {
  content: '';
  position: absolute;
  left: 0;
  top: .72em;
  width: 5px;
  height: 1px;
  background: var(--rrtn-line);
}

.tn-source-link {
  box-shadow: none;
}

/* ── 2026-09-07 확장: 비중·확률 열, 중복 없이 뽑기, 기록 복사, 숫자 타이포그래피 ── */

/* Kill list #1. 테마의 `.cs-main-content .entry-content ul:not(…)`는 특이도 (0,3,1)로
   위의 `.tn-roulette-tool ul`(0,1,1) 리셋을 이겨 항목 목록에 padding-left 32px·
   padding-right 16px를 넣고, 같은 계열의 li 규칙이 행마다 padding-left 4px와
   margin-bottom 8px를 더한다. 그래서 도구 안의 목록만 더 높은 특이도로 되돌린다.
   본문(`.tn-article-panel`) 목록은 공용 fixed-partial이 소유하므로 건드리지 않는다. */
html body.roberin-random-roulette-spinner-the-new .entry-content .tn-roulette-tool :is(ul, ol) {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

html body.roberin-random-roulette-spinner-the-new .entry-content .tn-roulette-tool :is(.tn-roulette-item, .tn-empty-row) {
  padding: 4px 5px !important;
  margin: 0 !important;
}

html body.roberin-random-roulette-spinner-the-new .entry-content .tn-roulette-tool .tn-history-list li {
  padding: 4px 7px !important;
  margin: 0 !important;
}

/* 숫자 입력은 사이트 전역 숫자 표준(시스템 sans 600)을 따른다. */
.tn-roulette-tool input[type='number'],
.tn-roulette-tool .tn-item-weight {
  font-family: var(--rrtn-sans);
  font-size: 13px;
  font-weight: 600;
  font-variant-numeric: lining-nums tabular-nums;
  letter-spacing: normal;
}

/* `.tn-field input` 의 mono `font` shorthand 가 placeholder 까지 내려오기 때문에
   family 를 명시한다. 한글 placeholder 가 mono fallback 으로 떨어지는 것도 막는다. */
.tn-roulette-tool input::placeholder {
  color: var(--rrtn-muted);
  -webkit-text-fill-color: var(--rrtn-muted);
  font-family: var(--rrtn-sans);
  font-weight: 400;
  opacity: .35;
}

/* 숫자 결과는 시스템 sans 800 + lining/tabular. */
.tn-roulette-tool #itemCount,
.tn-roulette-tool #modalItemCount,
.tn-roulette-tool .tn-item-chance,
.tn-roulette-tool .tn-result-chance,
.tn-result-window strong {
  font-family: var(--rrtn-sans);
  font-weight: 800;
  font-variant-numeric: lining-nums tabular-nums;
  letter-spacing: normal;
}

/* The legend and the rows must resolve their tracks against the same box, so both
   live inside one scroll container and the legend sticks to its top. A legend outside
   the scroller would drift by the scrollbar width the moment the list overflows. */
.tn-roulette-listbox {
  min-height: 0;
  overflow: auto;
}

.tn-items-legend {
  position: sticky;
  top: 0;
  z-index: 1;
  display: grid;
  grid-template-columns: 14px minmax(0, 1fr) 46px 52px 27px;
  align-items: center;
  gap: 7px;
  border: 1px solid transparent;
  /* padding, not margin: a sticky header with a margin leaves a transparent strip
     that a scrolled row shows through. */
  padding: 0 5px 5px;
  background: color-mix(in srgb, var(--rrtn-paper) 86%, #fff 14%);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11px;
  line-height: 1.25;
  color: var(--rrtn-muted);
  -webkit-text-fill-color: var(--rrtn-muted);
}

.tn-items-legend > span:nth-child(3),
.tn-items-legend > span:nth-child(4) {
  text-align: center;
}

.tn-item-weight {
  width: 100%;
  min-width: 0;
  height: 24px;
  border: 1px solid var(--rrtn-soft-line);
  border-radius: 0;
  background: var(--rrtn-paper);
  color: var(--rrtn-ink);
  -webkit-text-fill-color: var(--rrtn-ink);
  padding: 0 4px;
  text-align: center;
  box-shadow: none;
  -moz-appearance: textfield;
}

.tn-item-weight::-webkit-outer-spin-button,
.tn-item-weight::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.tn-item-weight:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--rrtn-accent) 65%, transparent);
  outline-offset: -1px;
}

.tn-item-chance {
  font-size: 12px;
  line-height: 1.2;
  text-align: right;
  white-space: nowrap;
  color: var(--rrtn-accent-dark);
  -webkit-text-fill-color: var(--rrtn-accent-dark);
}

.tn-roulette-item[data-drawn='true'] {
  opacity: .45;
}

.tn-roulette-switchrow {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  gap: 7px;
}

.tn-result-window {
  grid-template-columns: auto minmax(0, 1fr) auto;
}

.tn-result-chance {
  font-size: 13px;
  line-height: 1.2;
  text-align: right;
  white-space: nowrap;
  color: var(--rrtn-muted);
  -webkit-text-fill-color: var(--rrtn-muted);
}

.tn-history-row {
  grid-template-columns: auto minmax(0, 1fr) auto auto;
}

.tn-wheel-shell canvas {
  cursor: pointer;
}

@media (prefers-reduced-motion: reduce) {
  .tn-switch span::after {
    transition: none;
  }
}

@media (min-width: 1840px) {
  .tn-side-rails {
    display: block;
  }

  .tn-side-ad {
    position: fixed;
    top: 160px;
  }

  .tn-side-ad--left {
    left: calc((100vw - 1180px) / 2 - 330px);
  }

  .tn-side-ad--right {
    right: calc((100vw - 1180px) / 2 - 330px);
  }
}

@media (max-width: 720px) {
  body.roberin-random-roulette-spinner-the-new .tn-hero,
  body.roberin-random-roulette-spinner-the-new .tn-roulette-tool,
  body.roberin-random-roulette-spinner-the-new .tool-meta-row,
  body.roberin-random-roulette-spinner-the-new .tn-design-note,
  body.roberin-random-roulette-spinner-the-new .tn-article-panel,
  body.roberin-random-roulette-spinner-the-new .tn-ad {
    width: calc(100% - 10px);
  }

  .tn-ad--top {
    margin-top: 48px;
  }

  .tn-roulette-tool {
    padding: 8px;
  }

  .tn-roulette-grid {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .tn-roulette-composer,
  .tn-roulette-stage {
    padding: 9px;
  }

  .tn-roulette-add,
  .tn-pattern-controls,
  .tn-history-row,
  .tn-result-window {
    grid-template-columns: minmax(0, 1fr);
  }

  .tn-roulette-item,
  .tn-items-legend {
    grid-template-columns: 12px minmax(0, 1fr) 42px 46px 24px;
    gap: 5px;
  }

  .tn-history-row {
    justify-items: stretch;
  }

  .tn-roulette-composer {
    grid-template-rows: none;
  }

  .tn-roulette-listbox {
    max-height: 180px;
  }

  .tn-roulette-stage {
    grid-template-rows: auto auto auto auto auto;
  }

  .tn-wheel-shell canvas {
    width: min(100%, 330px);
    max-height: none;
  }

  .tn-result-window strong {
    font-size: 24px;
  }

  .tn-roulette-actions,
  .tn-roulette-lowbar {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .tn-roulette-actions .tn-btn,
  .tn-roulette-actions .tn-text-btn,
  .tn-roulette-lowbar .quick-add-btn {
    width: 100%;
  }

  .tn-history-list {
    width: 100%;
  }

  .tn-ad--below {
    flex-direction: column;
    align-items: center;
  }
}

body[data-scheme='dark'].roberin-random-roulette-spinner-the-new,
body[data-scheme='inverse'].roberin-random-roulette-spinner-the-new,
body[data-scheme='auto'][data-l='dark'].roberin-random-roulette-spinner-the-new,
body[data-scheme='auto'][data-d='dark'].roberin-random-roulette-spinner-the-new,
html[data-scheme='dark'] body.roberin-random-roulette-spinner-the-new:not([data-scheme='light']) {
  --rrtn-ink: #f7ead3;
  --rrtn-muted: #d9c8aa;
  --rrtn-line: #7b684b;
  --rrtn-soft-line: #584832;
  --rrtn-paper: #21180f;
  --rrtn-wash: #171109;
  --rrtn-button: #342716;
  --rrtn-button-hover: #4a3820;
  --rrtn-accent: #ff9a54;
  --rrtn-accent-dark: #ffc091;
  --rrtn-good: #bdd2a0;
}

body[data-scheme='dark'].roberin-random-roulette-spinner-the-new .tn-roulette-tool,
body[data-scheme='dark'].roberin-random-roulette-spinner-the-new .tn-roulette-composer,
body[data-scheme='dark'].roberin-random-roulette-spinner-the-new .tn-roulette-stage,
body[data-scheme='dark'].roberin-random-roulette-spinner-the-new .tn-result-window,
body[data-scheme='dark'].roberin-random-roulette-spinner-the-new .tn-history-row,
body[data-scheme='dark'].roberin-random-roulette-spinner-the-new .tn-modal-panel,
body[data-scheme='inverse'].roberin-random-roulette-spinner-the-new .tn-roulette-tool,
body[data-scheme='inverse'].roberin-random-roulette-spinner-the-new .tn-roulette-composer,
body[data-scheme='inverse'].roberin-random-roulette-spinner-the-new .tn-roulette-stage,
body[data-scheme='inverse'].roberin-random-roulette-spinner-the-new .tn-result-window,
body[data-scheme='inverse'].roberin-random-roulette-spinner-the-new .tn-history-row,
body[data-scheme='inverse'].roberin-random-roulette-spinner-the-new .tn-modal-panel,
body[data-scheme='auto'][data-l='dark'].roberin-random-roulette-spinner-the-new .tn-roulette-tool,
body[data-scheme='auto'][data-l='dark'].roberin-random-roulette-spinner-the-new .tn-roulette-composer,
body[data-scheme='auto'][data-l='dark'].roberin-random-roulette-spinner-the-new .tn-roulette-stage,
body[data-scheme='auto'][data-l='dark'].roberin-random-roulette-spinner-the-new .tn-result-window,
body[data-scheme='auto'][data-l='dark'].roberin-random-roulette-spinner-the-new .tn-history-row,
body[data-scheme='auto'][data-l='dark'].roberin-random-roulette-spinner-the-new .tn-modal-panel,
body[data-scheme='auto'][data-d='dark'].roberin-random-roulette-spinner-the-new .tn-roulette-tool,
body[data-scheme='auto'][data-d='dark'].roberin-random-roulette-spinner-the-new .tn-roulette-composer,
body[data-scheme='auto'][data-d='dark'].roberin-random-roulette-spinner-the-new .tn-roulette-stage,
body[data-scheme='auto'][data-d='dark'].roberin-random-roulette-spinner-the-new .tn-result-window,
body[data-scheme='auto'][data-d='dark'].roberin-random-roulette-spinner-the-new .tn-history-row,
body[data-scheme='auto'][data-d='dark'].roberin-random-roulette-spinner-the-new .tn-modal-panel,
html[data-scheme='dark'] body.roberin-random-roulette-spinner-the-new:not([data-scheme='light']) .tn-roulette-tool,
html[data-scheme='dark'] body.roberin-random-roulette-spinner-the-new:not([data-scheme='light']) .tn-roulette-composer,
html[data-scheme='dark'] body.roberin-random-roulette-spinner-the-new:not([data-scheme='light']) .tn-roulette-stage,
html[data-scheme='dark'] body.roberin-random-roulette-spinner-the-new:not([data-scheme='light']) .tn-result-window,
html[data-scheme='dark'] body.roberin-random-roulette-spinner-the-new:not([data-scheme='light']) .tn-history-row,
html[data-scheme='dark'] body.roberin-random-roulette-spinner-the-new:not([data-scheme='light']) .tn-modal-panel {
  background-color: var(--rrtn-paper);
  color: var(--rrtn-ink);
  -webkit-text-fill-color: var(--rrtn-ink);
}

body[data-scheme='dark'].roberin-random-roulette-spinner-the-new input,
body[data-scheme='dark'].roberin-random-roulette-spinner-the-new button,
body[data-scheme='dark'].roberin-random-roulette-spinner-the-new .tn-roulette-status,
body[data-scheme='dark'].roberin-random-roulette-spinner-the-new .tn-roulette-item,
body[data-scheme='dark'].roberin-random-roulette-spinner-the-new .tn-empty-row,
body[data-scheme='dark'].roberin-random-roulette-spinner-the-new .tn-history-list li,
body[data-scheme='inverse'].roberin-random-roulette-spinner-the-new input,
body[data-scheme='inverse'].roberin-random-roulette-spinner-the-new button,
body[data-scheme='inverse'].roberin-random-roulette-spinner-the-new .tn-roulette-status,
body[data-scheme='inverse'].roberin-random-roulette-spinner-the-new .tn-roulette-item,
body[data-scheme='inverse'].roberin-random-roulette-spinner-the-new .tn-empty-row,
body[data-scheme='inverse'].roberin-random-roulette-spinner-the-new .tn-history-list li,
body[data-scheme='auto'][data-l='dark'].roberin-random-roulette-spinner-the-new input,
body[data-scheme='auto'][data-l='dark'].roberin-random-roulette-spinner-the-new button,
body[data-scheme='auto'][data-l='dark'].roberin-random-roulette-spinner-the-new .tn-roulette-status,
body[data-scheme='auto'][data-l='dark'].roberin-random-roulette-spinner-the-new .tn-roulette-item,
body[data-scheme='auto'][data-l='dark'].roberin-random-roulette-spinner-the-new .tn-empty-row,
body[data-scheme='auto'][data-l='dark'].roberin-random-roulette-spinner-the-new .tn-history-list li,
body[data-scheme='auto'][data-d='dark'].roberin-random-roulette-spinner-the-new input,
body[data-scheme='auto'][data-d='dark'].roberin-random-roulette-spinner-the-new button,
body[data-scheme='auto'][data-d='dark'].roberin-random-roulette-spinner-the-new .tn-roulette-status,
body[data-scheme='auto'][data-d='dark'].roberin-random-roulette-spinner-the-new .tn-roulette-item,
body[data-scheme='auto'][data-d='dark'].roberin-random-roulette-spinner-the-new .tn-empty-row,
body[data-scheme='auto'][data-d='dark'].roberin-random-roulette-spinner-the-new .tn-history-list li,
html[data-scheme='dark'] body.roberin-random-roulette-spinner-the-new:not([data-scheme='light']) input,
html[data-scheme='dark'] body.roberin-random-roulette-spinner-the-new:not([data-scheme='light']) button,
html[data-scheme='dark'] body.roberin-random-roulette-spinner-the-new:not([data-scheme='light']) .tn-roulette-status,
html[data-scheme='dark'] body.roberin-random-roulette-spinner-the-new:not([data-scheme='light']) .tn-roulette-item,
html[data-scheme='dark'] body.roberin-random-roulette-spinner-the-new:not([data-scheme='light']) .tn-empty-row,
html[data-scheme='dark'] body.roberin-random-roulette-spinner-the-new:not([data-scheme='light']) .tn-history-list li {
  color: var(--rrtn-ink);
  -webkit-text-fill-color: var(--rrtn-ink);
}

@media (prefers-color-scheme: dark) {
  body[data-scheme='auto'].roberin-random-roulette-spinner-the-new:not([data-l='light']):not([data-d='light']) {
    --rrtn-ink: #f7ead3;
    --rrtn-muted: #d9c8aa;
    --rrtn-line: #7b684b;
    --rrtn-soft-line: #584832;
    --rrtn-paper: #21180f;
    --rrtn-wash: #171109;
    --rrtn-button: #342716;
    --rrtn-button-hover: #4a3820;
    --rrtn-accent: #ff9a54;
    --rrtn-accent-dark: #ffc091;
  }
}

body[data-scheme='dark'].roberin-random-roulette-spinner-the-new button.tn-btn--primary,
body[data-scheme='inverse'].roberin-random-roulette-spinner-the-new button.tn-btn--primary,
body[data-scheme='auto'][data-l='dark'].roberin-random-roulette-spinner-the-new button.tn-btn--primary,
body[data-scheme='auto'][data-d='dark'].roberin-random-roulette-spinner-the-new button.tn-btn--primary,
html[data-scheme='dark'] body.roberin-random-roulette-spinner-the-new:not([data-scheme='light']) button.tn-btn--primary {
  background: var(--rrtn-ink) !important;
  border-color: var(--rrtn-ink) !important;
  color: var(--rrtn-paper) !important;
  -webkit-text-fill-color: var(--rrtn-paper) !important;
}

@media (prefers-color-scheme: dark) {
  body[data-scheme='auto'].roberin-random-roulette-spinner-the-new:not([data-l='light']):not([data-d='light']) button.tn-btn--primary {
    background: var(--rrtn-ink) !important;
    border-color: var(--rrtn-ink) !important;
    color: var(--rrtn-paper) !important;
    -webkit-text-fill-color: var(--rrtn-paper) !important;
  }
}

body[data-scheme='dark'].roberin-random-roulette-spinner-the-new .entry-content :is(#spinBtn,#modalSpinBtn).tn-btn--primary,
body[data-scheme='inverse'].roberin-random-roulette-spinner-the-new .entry-content :is(#spinBtn,#modalSpinBtn).tn-btn--primary,
body[data-scheme='auto'][data-l='dark'].roberin-random-roulette-spinner-the-new .entry-content :is(#spinBtn,#modalSpinBtn).tn-btn--primary,
body[data-scheme='auto'][data-d='dark'].roberin-random-roulette-spinner-the-new .entry-content :is(#spinBtn,#modalSpinBtn).tn-btn--primary,
html[data-scheme='dark'] body.roberin-random-roulette-spinner-the-new:not([data-scheme='light']) .entry-content :is(#spinBtn,#modalSpinBtn).tn-btn--primary {
  background: var(--rrtn-ink) !important;
  border-color: var(--rrtn-ink) !important;
  color: var(--rrtn-paper) !important;
  -webkit-text-fill-color: var(--rrtn-paper) !important;
}

@media (prefers-color-scheme: dark) {
  body[data-scheme='auto'].roberin-random-roulette-spinner-the-new:not([data-l='light']):not([data-d='light']) .entry-content :is(#spinBtn,#modalSpinBtn).tn-btn--primary {
    background: var(--rrtn-ink) !important;
    border-color: var(--rrtn-ink) !important;
    color: var(--rrtn-paper) !important;
    -webkit-text-fill-color: var(--rrtn-paper) !important;
  }
}