.muted { color: var(--parchment-muted); font-size: 12px; }
.danger-text { background: none; border: none; color: var(--danger-text); cursor: pointer; font-size: 14px; }
.danger-text:hover { color: #ef8a83; }


/* Bewusst hier belassen (nicht nach character-sheet.css verschoben): ueberschreibt
   bis hierhin kaskadierend die allgemeine .danger-text-Regel weiter oben. Wuerde
   diese Regel in eine vor style.css geladene Komponentendatei wandern, wuerde sie
   ihre Override-Wirkung verlieren (Ladereihenfolge in index.html/character.html). */
.danger-text { background: none; border: none; color: var(--danger-text); cursor: pointer; font-size: 16px; }
.danger-text:hover { color: #ef8a83; }

/* ==========================================================================
   Restliche Oberflaeche an den neuen Look angleichen
   ========================================================================== */



.to-row.active { background: var(--accent-soft); border-left: 2px solid var(--accent); }
.to-title, #token-card .tc-header .tc-name {
  font-family: var(--font-display); letter-spacing: 0.6px;
}

/* Kampagnenliste auf der Startseite */
.campaign-row {
  background: rgba(255,255,255,0.03); border: 1px solid var(--border-soft);
  border-radius: var(--radius-sm); padding: 11px 14px; transition: background 0.15s, border-color 0.15s;
}
.campaign-row:hover { background: rgba(255,255,255,0.07); border-color: var(--accent-line); }
.campaign-row-name { font-family: var(--font-display); font-size: 16px; letter-spacing: 0.4px; }



/* Charakterbogen-interne Nachjustierung/Feinschliff (ehem. Abschnitte 10, 11,
   Teil von 12 und 13) verschoben nach public/styles/components/character-sheet.css
   (an dessen Ende angehaengt, damit die Kaskaden-Reihenfolge gegenueber allen
   spaeteren gleichnamigen Selektoren weiter unten in dieser Datei erhalten bleibt). */
/* Neue Kampagne anlegen: Feld und Knopf untereinander statt gequetscht */
#new-campaign-form { flex-direction: column; gap: 8px; margin-top: 12px; }
#new-campaign-form input { width: 100%; padding: 10px 12px; }
#new-campaign-form button {
  width: 100%; padding: 11px; font-size: 14px; letter-spacing: 0.8px;
  border-radius: var(--radius-sm);
}
#open-rulebook-btn, .home-box .secondary-btn { width: 100%; padding: 11px; font-size: 14px; }
.home-box { width: 400px; }
#campaign-list { max-height: 260px; }

/* Regelwerk-Knopf auf der Startseite mittig */
.home-box .secondary-btn { margin-top: 10px; }


.to-header {
  padding: 6px 8px;
}
.to-title {
  font-size: 11px;
}
#to-collapse-btn {
  width: 20px;
  height: 20px;
  font-size: 12px;
}
#to-list {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
}
.to-row {
  gap: 6px;
  padding: 5px 7px;
}
.to-avatar {
  width: 24px;
  height: 24px;
  font-size: 9px;
}
.to-name {
  font-size: 11px;
}
.to-value {
  font-size: 12px;
  min-width: 18px;
}
#to-gm-controls {
  padding: 6px;
}
#to-gm-controls .secondary-btn {
  padding: 5px 4px;
  font-size: 10px;
  min-height: 28px;
  width: auto !important;
  white-space: nowrap;
}
#to-gm-controls .to-gm-row {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) 42px;
  gap: 5px;
}
/* Das 3-Spalten-Raster ist nur fuer die Zeile "+ / Weiter / Leer" gedacht.
   Zeilen mit einem Button nutzen die volle Breite, Zeilen mit zwei Buttons
   teilen sie sich; langer Text darf dort umbrechen statt aus dem Rahmen
   zu laufen. */
#to-gm-controls .to-gm-row:has(> :only-child) { grid-template-columns: minmax(0, 1fr); }
#to-gm-controls .to-gm-row:has(> :nth-child(2):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
#to-gm-controls .to-gm-row:has(> :only-child) .secondary-btn,
#to-gm-controls .to-gm-row:has(> :nth-child(2):last-child) .secondary-btn {
  white-space: normal;
  line-height: 1.2;
  overflow-wrap: anywhere;
}
#to-add-btn {
  font-size: 14px !important;
  line-height: 1;
}

.to-row.active {
  background: rgba(208, 70, 74, 0.18);
  border-left-color: var(--accent);
}


/* Bewusst hier belassen (nicht mit dem "Unwritten Realm"-Block nach
   character-sheet.css verschoben): .secondary-btn ist keine Charakterbogen-
   Klasse, sondern app-weit (Topbar, Startseite, GM-Kontrollen) im Einsatz.
   Diese border-radius-Ueberschreibung ueberschreibt kaskadierend die
   Basis-/Chrome-Regeln aus character-sheet.css und app-shell.css (beide
   laden vor dieser Datei). Wuerde sie mitwandern, wuerde app-shell.css
   (laedt nach character-sheet.css, aber weiterhin vor style.css) mit
   border-radius: var(--radius-sm) wieder gewinnen. Die uebrigen Selektoren
   der urspruenglichen Sammelregel (.cs-subfilter-btn, .cs-row-actions
   button, .wizard-nav button) sind echte Charakterbogen-/Wizard-Klassen
   und sind mitgewandert. */
.secondary-btn {
  border-radius: 6px;
}