/**
 * Antamar "new"-Classic-CSS-Datei
   modernisiertes und vereinheitlichtes Classic Design
 * Standard-Stil variieren. Also hauptsächlich Farben und Bilder.
 *
 * @version $Id$
 * @package antamar
 */

/* Webfont (Josefin Sans) ist lokal — siehe css/antamar_fonts.css. */

/*
 * Mobile-Tokens (Antamar-Skin: hell/orange-braun).
 * Überschreibt die Bombast-Defaults aus antamar_tokens.css für die Mobile-
 * Komponenten in antamarGeneralv57.css (Top-Bar, Side-Drawer, Charakter-Hub).
 */
:root {
    --mobile-surface:          #FFF4DF;
    --mobile-surface-2:        rgba(64, 44, 19, 0.08);
    --mobile-surface-overlay:  rgba(64, 44, 19, 0.45);
    --mobile-body-bg:          #FFF4DF;
    --mobile-hint-bg:          rgba(64, 44, 19, 0.92);

    --mobile-border:           rgba(64, 44, 19, 0.45);
    --mobile-border-soft:      rgba(64, 44, 19, 0.3);
    --mobile-border-very-soft: rgba(64, 44, 19, 0.15);

    --mobile-text:             #402C13;
    --mobile-text-secondary:   #5a4020;
    --mobile-text-soft:        #7a5a3a;
    --mobile-text-muted:       #9a7a5a;

    --mobile-accent:           #AD4234;
    --mobile-accent-strong:    #D3913C;
    --mobile-accent-contrast:  #FFF4DF;
    --mobile-chip-bg:          rgba(64, 44, 19, 0.08);
    --listen-self-bg:          rgba(173, 66, 52, 0.15);

    /* Lesbare Bar-Akzente auf hellem Beige-Background */
    --bar-lep-color:           #AD4234;  /* Rot-Braun */
    --bar-asp-color:           #1f6d8c;  /* Stahlblau */
    --bar-gold-color:          #8b5e0c;  /* Dunkelgold */
    --bar-be-color:            #8b4513;  /* Sattelbraun */
    --bar-ep-color:            #4a6b1e;  /* Olivgrün */

    /* Heller Skin: native Formular-Controls hell rendern — sonst nutzen Inputs/
       Selects/Optionslisten bei OS-Dark-Mode das dunkle UA-Theme (schwarze Felder). */
    color-scheme: light;

    /* Tokens, die sonst auf die dunklen Bombast-Defaults zurückfallen würden. */
    --mobile-surface-2-hover:  rgba(64, 44, 19, 0.16);
    --mobile-action-bg:        #e2efd6;
    --mobile-action-border:    #7ba055;
    --mobile-action-bg-hover:  #d2e6bf;
    --mobile-action-text:      #1a7a1a;
    --mobile-warn-bg:          #fdecea;
    --mobile-warn-border:      #c0392b;
    --mobile-warn-text:        #a01b0f;
    --mobile-caution-bg:       #fff3cd;
    --mobile-caution-border:   #D3913C;
    --mobile-caution-text:     #5a3d0a;
}

html {
  margin: 0;
  padding: 0;
  /*background-color: #ffd98fba;*/
  background: url(../../bilder/design/antamar/noise.png);
  overflow-y: scroll; /* Scrollbalken immer anzeigen lassen */
}
body {
  font-size: 1em;
  margin: 0;
  padding: 0;
}
body, td, p {
  color: #402C13;
  font-family: "PT Serif", "Giovanni Book", Georgia, "Times New Roman", Times, serif;
  line-height: 1.333em;
}
p { margin-bottom: 1em; }
img { border: 0; vertical-align: middle; }
a { cursor: pointer; color: #AD4234; text-decoration: none; }
a:hover { color: #402C13; text-decoration: underline overline; }
h3 { 
  margin: 15px 0 5px 0;
  padding: 0;
  text-align: center;
  font-size: 1.4em;
  color: #402C13;
  font-variant: small-caps;
}
.noscript-notice {
  line-height: normal;
  margin: 0;
  padding: 0 0;
  text-align: center;
  width: 100%;
}

.noscript-notice {
  background: #FF3300 none repeat scroll 0 0;
  color: #FFF;
  opacity: 1;
  z-index: 100;
}

/* ------------------------------------------------------------------------------- */
div#wrapper {
  margin: 0;
  padding: 0;
  background: url(../../bilder/bg.gif) no-repeat bottom right;
  background-attachment: scroll;
}
div#content { margin: 0 3px 0 3px; }
table.main { width: 100%; }
.game { vertical-align: top; }
/* Lesefläche der Spielspalte: opakes Cream über der Noise-Textur. Früher kam die
   helle Fläche aus den .game-td-Zellhintergründen; ohne Ersatz läge Fließtext
   direkt auf dem Noise und die semi-transparenten surface-2-Tönungen würden
   matschig. Entspricht dem Mobile-Token-Modell (--mobile-body-bg). */
td.game { background-color: var(--mobile-surface); }
.game h2 { margin: 5px 0 10px 0; text-align: center; font-size: 1.6em; }
.game h3 { margin: 0; padding: 0; text-align: center; font-size: 1em; color: #402C13; font-variant: small-caps; }
.game h3:first-letter { font-size:1em; color:#AD4234; }
.game h4 { margin:0; font-size: 0.95em; }
/* Keine globalen Zellboxen mehr (frueher: jede td/th mit Vollrahmen + Hintergrund
   -> Kaesten-in-Kaesten bei Layout-Tabellen). Kopfzeilen behalten einen dezenten
   Tint, Linien gibt es nur noch komponentenweise (siehe Datentabellen-Block). */
.game th { background: var(--mobile-surface-2); padding: 5px; }
.game td { padding: 5px; }

/* Datentabellen: Zeilen-Trenner statt Zellrahmen (Selektorliste nach Bombast-Vorbild).
   Layout-Tabellen ausserhalb dieser Scopes bleiben linienlos. */
div.kampfmanoever td, div.kampfmanoever th,
div.kampfschule td,   div.kampfschule th,
div.lernschule td,    div.lernschule th,
div.rathaus td,       div.rathaus th,
div.highscore td,     div.highscore th,
div.orden td,         div.orden th,
table.jobstatistics td, table.jobstatistics th,
div.heldinfoSeite td, div.heldinfoSeite th,
div.einstellungen table.heldenwechsel td,
div.einstellungen table.heldenwechsel th,
table.bank td, table.bank th {
  padding: 0.3em 0.5em;
  border-bottom: 1px solid var(--mobile-border-very-soft);
}

/* Sektions-/Kopfzeilen: Goldlinie zitiert das alte Vollgold-th */
div.kampfmanoever th, div.kampfschule th, div.lernschule th,
div.rathaus th, div.highscore th, div.orden th,
div.heldinfoSeite th[colspan], div.einstellungen th[colspan] {
  border-bottom: 2px solid var(--mobile-accent-strong);
}
div.heldinfoSeite th[colspan], div.einstellungen th[colspan] {
  padding: 0.6em;
  font-size: 1.05em;
}

div.einstellungen td { padding: 0.3em 0.4em; }

/* Einstellungen-Formulartabellen: Sektionskoepfe, Label-Spalte, Zebra.
   Kind-Selektoren (> tbody > tr) halten verschachtelte Editor-Tabellen
   (TinyMCE) frei von Zeilen-Trennern. */
div.einstellungen table.heldeneinstellungen > tbody > tr > td,
div.einstellungen table.heldenprofil > tbody > tr > td,
div.einstellungen table.spielerprofil > tbody > tr > td,
div.einstellungen table.spielereinstellungen > tbody > tr > td,
div.einstellungen table.passwortEinstellungen > tbody > tr > td,
div.einstellungen table.heldenloeschen > tbody > tr > td {
  padding: 0.5em;
  border-bottom: 1px solid var(--mobile-border-very-soft);
}
div.einstellungen table.heldeneinstellungen > tbody > tr:nth-child(even) > td,
div.einstellungen table.heldenprofil > tbody > tr:nth-child(even) > td,
div.einstellungen table.spielerprofil > tbody > tr:nth-child(even) > td,
div.einstellungen table.spielereinstellungen > tbody > tr:nth-child(even) > td,
div.einstellungen table.passwortEinstellungen > tbody > tr:nth-child(even) > td,
div.einstellungen table.heldenloeschen > tbody > tr:nth-child(even) > td {
  background-color: var(--mobile-surface-2);
}
div.einstellungen table.heldeneinstellungen > tbody > tr > th.right,
div.einstellungen table.heldenprofil > tbody > tr > th.right,
div.einstellungen table.spielerprofil > tbody > tr > th.right,
div.einstellungen table.spielereinstellungen > tbody > tr > th.right,
div.einstellungen table.passwortEinstellungen > tbody > tr > th.right,
div.einstellungen table.heldenloeschen > tbody > tr > th.right {
  background-color: var(--mobile-surface-2);
  border-right: 1px solid var(--mobile-border-soft);
  min-width: 140px;
  vertical-align: top;
  padding-top: 0.5em;
}

/* Heldenwechsel-Liste: Zeilen-Trenner, Zebra, Hover */
div.einstellungen table.heldenwechsel {
  border-collapse: collapse;
}
div.einstellungen table.heldenwechsel td {
  padding: 0.5em 0.8em;
  border-bottom: 1px solid var(--mobile-border-soft);
  vertical-align: middle;
}
div.einstellungen table.heldenwechsel tr:nth-child(even) td {
  background-color: var(--mobile-surface-2);
}
div.einstellungen table.heldenwechsel tr:hover td {
  background-color: var(--mobile-surface-2-hover);
}
div.einstellungen table.heldenwechsel td:last-child {
  white-space: nowrap;
}

/* Gepaeck-/Ausruestungsliste: Hairlines + Zebra */
table.gepaeckansicht td {
  border-bottom: 1px solid var(--mobile-border-very-soft);
}
table.gepaeckansicht tr:nth-child(even) td {
  background-color: var(--mobile-surface-2);
}

/* Orden-Bewerben: Row-Liste statt zentriertem Flattersatz (die Spielspalte
   ist global text-align:center, die nackte ul erbte das). */
div.orden ul.orden-bewerben-liste {
  list-style: none;
  max-width: 480px;
  margin: 10px auto;
  padding: 0;
  text-align: left;
}
div.orden ul.orden-bewerben-liste > li {
  margin: 0;
  border-bottom: 1px dotted var(--mobile-border-soft);
}
div.orden ul.orden-bewerben-liste > li:last-child {
  border-bottom: none;
}
div.orden ul.orden-bewerben-liste > li > a {
  display: block;
  padding: 6px 10px;
  text-decoration: none;
  transition: background var(--motion-fast) var(--motion-ease);
}
div.orden ul.orden-bewerben-liste > li > a:hover {
  background: var(--mobile-border-very-soft);
}

/* -- Header ---------------------------------------------------------------- */

#header { height: 151px; width: 100%; margin: auto; table-layout: fixed; border-spacing: 0; empty-cells: show; border-collapse: collapse; }

/* die äußeren Grenzen (r+l) des Headers */

#header_border_left {
  width: 16px;
  margin: 0;
  background: url(../../bilder/header_border_left.png) no-repeat 0 0;
}
#header_border_right {
  width: 16px;
  margin: 0;
  background: url(../../bilder/head_right.gif) no-repeat 0 0;
}

#header_left {
  text-align: center;
  padding: 14px 0;
  vertical-align: middle;
  width: 30%;
  background: url(../../bilder/head_float.png) repeat-x 0 0;
}
#header_left div.heroPics { margin: auto; width: 300px; }
#header_left img { float:left; max-height:100px; max-width:120px; margin:0 0 0 20px; }

/* header_logo - das Antamarlogo in der Mitte */
#header_logo {
  text-align: center;
  width: 310px;
  padding: 0;
  margin: 0;
  overflow: hidden;
  background: url(../../bilder/header_logo.png) no-repeat 0 0;
  background-repeat: no-repeat;
  background-position: top center;
  cursor: pointer;
}

#header_logo h1 { visibility: hidden; }

/* der bewegliche Teil auf der RECHTEN Seite */

#header_float {
  padding: 0;
  margin: 0;
  border: 0;
  background: transparent url(../../bilder/head_float.png) repeat-x 0 0;
}

/* der bewegliche Teil auf der LINKEN Seite */

#header_float_left {
  padding: 0;
  margin: 0;
  border: 0;
  background: url(../../bilder/head_float.png) repeat-x 0 0;
}

/* Heldenangaben im header_right */
#header_right {
  padding: 0;
  margin: 0;
  width: 30%;
  background: transparent url(../../bilder/head_float.png) repeat-x 0 0;
}

#header_right div.kalender { float: left; font-weight: bold; color: #402c13; text-align: center; min-height: 100px; width: 150px; }
#header_right div.kalender img { border: 1px solid var(--mobile-border); border-radius: 3px; }
#header_right div.kalender div.datum { font-size: 90%; white-space: nowrap; padding-top: 2px; }
#header_right div.heroShortInfo { margin-left: 150px; text-align: center; color: #402b22; }
#header_right div.heroShortInfo h2 { font-size: 1.2em; font-weight: bold; margin:auto; max-width: 300px; padding:5px 0 0 0; }
#header_right div.heroShortInfo span.held_ort { font-style: italic; }



/* --- Menü auf der linken Seite -------------------------------------------- */

td#menuBox { vertical-align: top; margin: 0; padding: 0; font-size: 1.0em; width:195px; }
div#menu { width: 195px; height: 550px; padding: 10px 0 0 0; background: transparent url(../../bilder/menu.png) no-repeat 0 0; }
div#menu img { vertical-align: baseline; }
div#menu a{ display: block; color: #402C13; font-weight: bolder; font-variant: small-caps; line-height:1.4em; }
div#menu a:first-letter { font-size: 1.15em; color: var(--mobile-accent); }

#menu a.extern {
  background: url(../../bilder/extern.gif) no-repeat;
  padding-left: 20px;
}

#menu a.info {
  background: url(../../bilder/info.png) no-repeat;
  padding-left: 20px;
}

#menu a.pdf {
  background: url(../../bilder/pdf-document.png) no-repeat;
  padding-left: 20px;
}

#menu a.rpg {
  background: url(../../bilder/kampf/aktion_bewegen.png) no-repeat;
  padding-left: 20px;
}

div#menu ul { width: 160px; margin: 10px 0 10px 25px; padding: 0; list-style-type: none; }
div#menu li.ungeleseneNachrichten { background: url(../../bilder/scroll.png) right no-repeat; margin-right: 20px; }

/* die kleinen Dolche zum Ausblenden vom Menü */
div#menuShort { position: fixed; top: 165px; left: 0; width: 10px; }
div#menuShort div.menu_show { background: #FFD98F url(../../bilder/menu_hint.png) repeat-y 50% 0; width: 10px; height: 75px; }
div#menu_pin_buttons { position: absolute; top: 165px; left: 174px; z-index: 100; max-width: 15px; }



/* --- Heldeninfo auf der rechten Seite ---------------------------------------- */
td#heldeninfoBox { vertical-align: top; padding: 0; margin: 0; font-size: 0.83em; width: 235px; }

div#heldeninfo {
  width: 230px;
  height: 750px;
  padding-top: 25px;
  background: transparent url(../../bilder/heldeninfo.png) no-repeat 0 0;
}
div#heldeninfo ul{
  margin:0 20px 0 20px;
  padding: 0 0 2px 0;
  border-bottom: 1px solid var(--mobile-border-soft);
  list-style-type: none;
  line-height: 0.95em;
}

div#heldeninfo h2 { font-size: 1.2em; margin: 10px 0 5px 0; }
div#heldeninfo h2 a{ display: block; text-align: center; padding: 0; margin: 0; color: #402C13; font-weight: bolder; font-variant: small-caps; line-height: 130%; }
div#heldeninfo h2 a:first-letter { font-size:1.15em; color:var(--mobile-accent); margin: 0; }

div#heldeninfo table { width: 190px; border-spacing:0; }
div#heldeninfo table.heldeninfo_eigenschaften { border: 0; padding: 0; margin: 0; border-collapse: collapse; }
div#heldeninfo table.heldeninfo_eigenschaften th { text-align:left; width:74%; }
div#heldeninfo table td.left { text-align: left; width: 13%; white-space: nowrap; }
div#heldeninfo table td.right { text-align:right; width:13%; }

/* Ampelfarben der Fuellstandsbalken (bilder/balken/*.png) an die warme
   Pergament-Palette heranfuehren — nur in diesem Skin. */
div#heldeninfo img[src*="bilder/balken/"],
.game img[src*="bilder/balken/"] {
  filter: saturate(0.7) sepia(0.15);
}

/* die kleinen Dolche zum Ausblenden der Heldeninfo */
div#heldeninfoShort { position: fixed; top: 165px; right: 0; width: 10px; }
div#heldeninfoShort div.heldeninfo_hint { background: #FFD98F url(../../bilder/heldeninfo_hint.png) repeat-y 50% 0; width: 10px; height: 160px; }
div#heldeninfo_pin_buttons { position: absolute; top: 165px; right: 220px; z-index: 101; max-width: 15px; }

/*Punkte, Gottheit, Geld*/
div#heldeninfo div.pgg {
  margin: 0 20px 3px 20px;
  padding: 0 0 2px 0;
  border-bottom: 1px solid var(--mobile-border-soft);
  font-size: 1.0em;
  white-space: nowrap;
  clear: right;
}

div#heldeninfo div.heldeninfo_inPGG { clear: both; width: 190px; }
div#heldeninfo div.heldeninfo_inPGG strong { float: right; text-align: right; }
div#heldeninfo div.withoutHeight { height: 0; } /* Klasse ist für den IE nötig */
div#heldeninfo span.EP_gesamt { float: left; width: 120px; }
div#heldeninfo span.groschen, div#heldeninfo span.thaler, div#heldeninfo span.gulden, div#heldeninfo span.EP_guthaben, div#heldeninfo span.stufe { float: left; width: 70px; }
div#heldeninfo span.gott { float: left; width: 60px; }
div#heldeninfo div.geld { margin: 3px 20px 3px 20px; padding:0 0 2px 0; border-bottom: 1px solid var(--mobile-border-soft); }
div#heldeninfo div.heldeninfo_rs_waffen { padding:0 0 2px 0; width: 200px; margin: 3px 20px 3px 20px; }

/* Heldenbild */
div#heldeninfo div.heldeninfo_rs_waffen div#heldeninfo_rs { float: none; }
div#heldeninfo div.heldeninfo_rs_waffen div#heldeninfo_rs div.trefferzonen { height: 255px; } /* hier wird das Heldenbild angezeigt, siehe antamar_png.css */
div#heldeninfo div.heldeninfo_rs_waffen div#heldeninfo_rs span#wundentext{ font-size: 0.8em; width: 90px; }

/* Waffen */
div#heldeninfo div.heldeninfo_rs_waffen div.heldeninfo_waffen { float: right; text-align: right; width: 90px; }
div#heldeninfo div.heldeninfo_rs_waffen div.heldeninfo_waffen div.heldeninfo_ausgeruestete_waffen { border-left: 1px solid var(--mobile-border-soft); }

/* Teleporterbox */
div#held_teleporter_box { clear: both; text-align: right; width: 225px; font-size: 0.9em; }
div#held_teleporter_box form.teleporterForm input.teleport_input { width: 150px; color: #4D3409; font-size: 0.9em; }

/* ----------------------------------------------------------------------------- */
td.game_border_left { width:1px; }
td.game_border_right { width:2px; }

/* ----------------------------------------------------------------------------- */

.hero-active {
  font-weight: bold;
}

.hero-inactive {
  font-style:italic;
}

.button {
  font-variant:small-caps;
  border: 1px solid #402C13;
  background-color: #FEEFD2;
  color: #000;
  margin: 2px;
  padding: 2px;
  cursor: pointer;
  font-size: 1.2em;
  border-radius: 3px;
}
.button:hover {
  background-color: #f5e0b8;
}

/* Formular-Controls überall im Spielbereich im warmen Ton — überschreibt die
   helle .input_zahl-Basis aus antamarGeneral und das Browser-Default-Grau
   ungestylter Selects/Inputs. Buttons/Checkboxen bleiben unberührt.
   (Pendant zur Bombast-Regel, hell statt dunkel.) */
.game .input,
.game .input_longer,
.game .input_long,
.game .input_text,
.game .input_zahl,
.game input[type="text"],
.game input[type="password"],
.game input[type="number"],
.game input[type="search"],
.game select,
.game textarea {
  background-color: #fffdf7;
  color: var(--mobile-text);
  border: 1px solid var(--mobile-border-soft);
  border-radius: 3px;
}

.game .input:focus,
.game .input_longer:focus,
.game .input_long:focus,
.game .input_text:focus,
.game .input_zahl:focus,
.game input[type="text"]:focus,
.game input[type="password"]:focus,
.game input[type="number"]:focus,
.game input[type="search"]:focus,
.game select:focus,
.game textarea:focus {
  border-color: var(--mobile-accent-strong);
  outline: none;
}

/* Footer: Basis-Styling kommt aus antamarGeneralv95.css (token-basiert) */

.aoqml.quest {
  border-radius: 6px;
  border: 1px solid var(--mobile-border-soft);
  background: var(--mobile-surface);
  box-shadow: 0 1px 4px rgba(64,44,19,0.25);
  margin: 6px 6px 16px 6px;
}

.aoqml.quest a{
  font-family: 'Josefin Sans', sans-serif;
}

.aoqml .oog {
  background-color: #FFD98F;
  font-family: 'Josefin Sans', sans-serif;
}

/* -- ZB-Ausgabe ------------------------------------------------------------ */
.tag {
  padding:10px 10px 3px 10px;
  margin:16px 6px 6px 6px;
  text-align: left;
  border-radius: 6px;
  border: 1px solid var(--mobile-border-soft);
  background: var(--mobile-surface);
  box-shadow: 0 1px 4px rgba(64,44,19,0.25);
}

.tag_ooc {
  border:1px solid var(--mobile-border-soft);
  border-radius: 5px;
  padding: 0 0.4em 0 0.4em;
  margin:0; 
  margin-left:-1px;
  margin-bottom: 6px;
  background-color: #FCD98E;
  font-family: 'Josefin Sans', sans-serif;
  line-height: 2em;
}

.tag_ooc img{
  vertical-align: top;
}

.tag_ooc .liste {
  padding-left: 15px;
}

.tag_ooc .verloren{
  color: #DC0000;
}

#zb_container{
  padding-bottom: 16px;
}



/*--- Dungeon ------------------------------------------------------------------*/

.dungeon table {
  clear:both;
  width:auto;
  height:auto;
  margin:0px;
  border-collapse:collapse;
}

.dungeon th {
  background:#D3913C;
  border:0px;
  padding: 0px;
}

.dungeon td {
  border:0px;
  padding: 0px;
}

.dungeon p img {
  width:100%;
}

.dungeon img {
  width:100%;
}

.dungeon .kampf img {
  margin:0;
}

.dungeon img.pure {
  border:0;
  margin:0;
}

table.liste {
  width: 90%;
}

table.liste td, table.liste th {
  padding: 3px;
}

div.opacity_30 {
  opacity: 0.3;
}

.ooc_chat {
  color:#666666;
}

.meister {
  color: #C3812C;
  font-style: oblique;
  font-weight: bold;
  letter-spacing: 0em;
}

.gelernt {
  color:black;
}

.ungelernt {
  color:gray;
}

.tip_content .tip {
  border: 0;
}

.tip_content .tip img {
  width: 100px;
  height: 100px;
  max-width: 100px;
  max-height: 100px;
}

#chatterList {
  position: absolute;
  font-weight: 600;
  width: 250px;
  border: 1px solid #402C13;
  margin: 0px;
  background-color: #402C13;
  color: #fff4df;
}

#chatterList > div {
  height: 5.4em;
  font-weight: 300;
  overflow: hidden;
  background-color: #fff4df;
  text-align: left;
  font-size: 1em;
}

.inlimit {
  color: #402C13;
  width: 3.5em;
}

.toomuch {
  color: #AD4234;
  width: 3.5em;
}

/* -- Trefferzonenanzeige --------------------------------------------------- */
.verwundet {
  position: absolute;
  display: inline;
  width: 15px;
  height: 15px;
  float: left;
  background: url(../../bilder/kampf/verwundet.png) no-repeat;
}

div.trefferzonen {
  float: left;
  width: 103px;
  height: 231px;
  background: url(../../bilder/trefferzonen/hintergrund.png) no-repeat;
  margin-left: -10px;
}

div.trefferzonen div {
  position: absolute;
  width: 10px;
  height: 12px;
  float: left;
}

div.trefferzonen .wunde {
  width: 5px;
  height: 5px;
  margin: 0px;
  position: absolute;
  float: left;
  background: url(../../bilder/trefferzonen/wunde.png) no-repeat;
}

div.trefferzonen #rs_kopf {
  margin-left: 47px;
  margin-top: 17px;
}

div.trefferzonen #rs_rarm {
  margin-left: 5px;
  margin-top: 67px;
}

div.trefferzonen #rs_larm {
  margin-left: 89px;
  margin-top: 67px;
}

div.trefferzonen #rs_brust {
  margin-left: 42px;
  margin-top: 49px;
}

div.trefferzonen #rs_ruecken {
  margin-left: 52px;
  margin-top: 49px;
}

div.trefferzonen #rs_uleib {
  margin-left: 47px;
  margin-top: 86px;
}

div.trefferzonen #rs_rbein {
  margin-left: 33px;
  margin-top: 173px;
}

div.trefferzonen #rs_lbein {
  margin-left: 61px;
  margin-top: 173px;
}

div.trefferzonen #w1_kopf {
  margin-left: 42px;
  margin-top: 10px;
}

div.trefferzonen #w2_kopf {
  margin-left: 49px;
  margin-top: 10px;
}

div.trefferzonen #w3_kopf {
  margin-left: 56px;
  margin-top: 10px;
}

div.trefferzonen #w1_rarm {
  margin-left: 11px;
  margin-top: 60px;
}

div.trefferzonen #w2_rarm {
  margin-left: 16px;
  margin-top: 55px;
}

div.trefferzonen #w3_rarm {
  margin-left: 21px;
  margin-top: 50px;
}

div.trefferzonen #w1_larm {
  margin-left: 78px;
  margin-top: 50px;
}

div.trefferzonen #w2_larm {
  margin-left: 83px;
  margin-top: 55px;
}

div.trefferzonen #w3_larm {
  margin-left: 88px;
  margin-top: 60px;
}

div.trefferzonen #w1_brust {
  margin-left: 42px;
  margin-top: 42px;
}

div.trefferzonen #w2_brust {
  margin-left: 49px;
  margin-top: 42px;
}

div.trefferzonen #w3_brust {
  margin-left: 56px;
  margin-top: 42px;
}

div.trefferzonen #w1_bauch {
  margin-left: 42px;
  margin-top: 79px;
}

div.trefferzonen #w2_bauch {
  margin-left: 49px;
  margin-top: 79px;
}

div.trefferzonen #w3_bauch {
  margin-left: 56px;
  margin-top: 79px;
}

div.trefferzonen #w1_rbein {
  margin-left: 35px;
  margin-top: 152px;
}

div.trefferzonen #w2_rbein {
  margin-left: 35px;
  margin-top: 159px;
}

div.trefferzonen #w3_rbein {
  margin-left: 35px;
  margin-top: 166px;
}

div.trefferzonen #w1_lbein {
  margin-left: 63px;
  margin-top: 152px;
}

div.trefferzonen #w2_lbein {
  margin-left: 63px;
  margin-top: 159px;
}

div.trefferzonen #w3_lbein {
  margin-left: 63px;
  margin-top: 166px;
}

div.trefferzonen .rs0 {
  background: url(../../bilder/trefferzonen/rs0.png) no-repeat;
}

div.trefferzonen .rs1 {
  background: url(../../bilder/trefferzonen/rs1.png) no-repeat;
}

div.trefferzonen .rs2 {
  background: url(../../bilder/trefferzonen/rs2.png) no-repeat;
}

div.trefferzonen .rs3 {
  background: url(../../bilder/trefferzonen/rs3.png) no-repeat;
}

div.trefferzonen .rs4 {
  background: url(../../bilder/trefferzonen/rs4.png) no-repeat;
}

div.trefferzonen .rs5 {
  background: url(../../bilder/trefferzonen/rs5.png) no-repeat;
}

div.trefferzonen .rs6 {
  background: url(../../bilder/trefferzonen/rs6.png) no-repeat;
}

div.trefferzonen .rs7 {
  background: url(../../bilder/trefferzonen/rs7.png) no-repeat;
}

div.trefferzonen .rs8 {
  background: url(../../bilder/trefferzonen/rs8.png) no-repeat;
}

/* -- Tooltip --------------------------------------------------------------- */
div.tip,
span.tip,
a.tip,
a.tip:link,
a.tip:hover,
a.tip:visited,
a.tip:active {
  text-decoration: none;
  cursor:help;
  border-bottom: 1px dotted #402C13;
  color: #402C13;
}

/* -- Jobangebote im Rathaus ------------------------------------------------ */
.job { margin: 5px; width: 700px; }
.job  td{ background-color: var(--mobile-surface-2); }
#job_ende { max-width: 90%; background-color: var(--mobile-surface-2); }


.marktstand {
  max-height: 28em; /* ~ 10 Waren */
  overflow: auto;
}

.marktstand table {
  width: 98%;
  margin: 3px auto 3px auto;
}

.auswahl table {
  width: 98%;
  margin: 3px auto 3px auto;
}

.ortsbeschreibung {
  width: 98%;
  box-sizing: border-box;
  overflow: auto;
  margin: 3px auto 3px auto;
  background: var(--mobile-surface);
  border: 1px solid var(--mobile-border-soft);
  border-radius: 6px;
  box-shadow: 0 1px 4px rgba(64,44,19,0.25);
  padding: 10px;
}
.ortsbeschreibung img{
  width: 30%;
  float: right;
}

/* -- Accordion --------------------------------------------------------------
   Token-Koepfe statt Cream + Grau-Borders (#bbb/#ccc). Box-Modell (height,
   overflow, line-height) bleibt unangetastet — accordion-v39.js misst Hoehen.
   Desktop-Modernpattern (Flex-Kopf, Chevron, Content-Box) siehe Block unten. */
.accordion_toggle {
  text-align: left;
  display: block;
  overflow: hidden;
  height: 30px;
  width: 98%;
  box-sizing: border-box;
  background-color: var(--mobile-surface-2);
  line-height: 28px;
  color: var(--mobile-text);
  cursor: pointer;
  margin: 0;
  border: 1px solid var(--mobile-border-soft);
  border-radius: 4px;
  padding-left: 10px;
}

.accordion_toggle2 {
  position: relative;
  text-align: left;
  display: block;
  overflow: hidden;
  height: 30px;
  width: 98%;
  box-sizing: border-box;
  background-color: var(--mobile-surface-2);
  line-height: 28px;
  color: var(--mobile-text);
  cursor: pointer;
  margin: 0;
  border: 1px solid var(--mobile-border-soft);
  border-radius: 4px;
  padding-left: 10px;
}

.leave {
  display: block;
  overflow: hidden;
  height: 30px;
  width: 98%;
  background-color: transparent;
  line-height: 30px;
  color: var(--mobile-text);
  cursor: pointer;
  margin: 0;
  border-top: 1px solid var(--mobile-border-soft);
  padding-left: 10px;
}

.accordion_toggle_active {
  background-color: var(--mobile-surface-2-hover);
  color: var(--mobile-text);
  border-radius: 4px 4px 0 0;
}

.accordion_content {
  color: var(--mobile-text);
  overflow: hidden;
  text-align: left;
  padding-left: 0;
  max-height: 0;
  opacity: 0;
}

.accordion_content2 {
  overflow: hidden;
  max-height: 0;
  opacity: 0;
}

/* -- Chat Toggle Button im Gruppen-Accordion ------------------------------- */
.chat-toggle-btn {
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  padding: 0 10px;
  cursor: pointer;
  font-size: 0.9em;
  line-height: 30px;
  color: var(--mobile-text);
  background: transparent;
  border: none;
  border-left: 1px solid var(--mobile-border-soft);
}


.chat-toggle-btn:hover {
  background: var(--mobile-surface-2-hover);
}

.chat-toggle-icon {
  display: inline-block;
}

#chat_gruppe_wrapper {
  overflow: hidden;
}

/* -- Sortable Tables ------------------------------------------------------- */
table.sortable th {
  padding: 0.3em;
  font-size: 1.1em;
  border-bottom: 2px solid var(--mobile-accent-strong);
}
table.sortable td {
  padding: 0.4em;
  border-bottom: 1px solid var(--mobile-border-very-soft);
}
table.sortable tr.odd td {
  background-color: var(--mobile-surface-2);
}
table.sortable tr.even td {
  background-color: transparent;
}
table.sortable tbody tr:hover td {
  background-color: var(--mobile-surface-2-hover);
}

/* -- Kampfbericht ---------------------------------------------------------- */
.kampf td{
  text-align:center;
  padding:1px;
}

.held {
  color: #00A100;
}

.gegner {
  color: #DC0000;
}

.kampf .name_single_held {
}

.kampf .name_single_gegner {
}

.kampf .name_multi_held {
  color: #00A100;
}

.kampf .name_multi_gegner {
  color: #DC0000;
}

.kampf .beschreibung {
  color: #333333;
}

/* -- Cash Symbole (Dukaten, Silberlinge, Heller) ------------------------------*/

.game p img.cash {
  margin: 1px;
  width: 17px;
  height: 14px;
  float: none;
  display: inline;
}

/* -- AOQML --------------------------------------------------------------------------*/

.eoq {
  text-align:center;
}

.aoqml li {
  list-style-type: disc;
  margin: 0.2em 1.2em;
}

.aoqml q {
  font-style: italic;
  color: #505050;
}

.aoqml q span.tip {
  color: #505050;
}

.aoqml span.cite {
  font-style: italic;
  color: #505050;
  margin-left:1em;
}

.aoqml cite {
  font-style: italic;
  color: #505050;
  margin-left:1em;
}

.aoqml a {
  text-decoration: underline;
}

.aoqml .debug {
  text-align: center;
  color: gray;
}

.aoqml .antamar {
  font-style: italic;
  color: sienna;
  border: none;
}

.aoqml p img {
  width: auto;
}

.aoqml .maze img {
  padding: 0;
  margin: 0;
}

/* -- held_wechsel -------------------------------------------------------------*/
.white_box {
  padding:8px 8px 3px 8px;
  margin:16px 6px 6px 6px;
  text-align: center;
  border-radius: 6px;
  border: 1px solid var(--mobile-border-soft);
  background: var(--mobile-surface);
  box-shadow: 0 1px 4px rgba(64,44,19,0.25);
  font-family: 'Josefin Sans', sans-serif;
}

.bold {
  font-weight: bold;
}

#Ladebalken {
  margin: 0 auto;
  padding: 0;
  width: 200px;
}

.geladen {
  max-width: 200px;
  height: 12px;
  margin-top: 1px;
  background-image: url(../../bilder/ladebalken/strich.png);
}
.geladen div {
  width: 200px;
  height: 12px;
  margin: 0;
  padding: 0;
  background-color: transparent;
  background-image: url(../../bilder/ladebalken/rahmen.png);
}

.geladen_text {
  width: 200px;
  background-color: transparent;
}

/* -- routenplaner -------------------------------------------------------------*/

.outputRoutenplaner {
  text-align: center;
  border: none;
  margin: 0;
  table-layout: fixed;
  font-size: smaller;
  width: 95%;
  overflow: auto;
}

/* -- regiezna -----------------------------------------------------------------*/
.egiezna {
  text-align: center;
  border: 1px double var(--mobile-border);
  background: #f5efd9;
  width: 93.25%;
}

.egiezna_kopf {
  width: 100%;
  max-width: 100%;
  font-size: 0.8em;
  border-bottom: 1px double var(--mobile-border);
}

.egiezna_inhalt {
  padding: 5px;
  text-align: left;
}

.egiezna_spam_lnk {
  cursor: pointer;
  text-align: right;
  font-size: 0.6em;
  padding-right: 3px;
}

.regiezna {
  width: 95%;
  max-width: 500px;
  background: #fbfaf3;
}

.regiezna hr {
  width: 10%;
  color: #402C13;
}

.regiezna_top {
  text-align: center;
  vertical-align: middle;
  height: 80px;
  width: 500px;
  max-width: 500px;
  background-image: url(../../bilder/rathaus/ParchementHeader.png);
  background-repeat: no-repeat;
}

.regiezna_title {
  padding: 8px 0px 0px 0px;
  height: 72px;
  background-image: url(../../bilder/rathaus/anzeiger.png);
  background-repeat: no-repeat;
  background-position: center 20px;
}

.regiezna_middle h3 {
  padding: 0px 0px 0px 0px;
  text-align: center;
  vertical-align: middle;
  width: 500px;
  font-size: 2.0em;
  line-height: 1em;
  font-weight: 600;
  color: #402C13;
}

.regiezna_middle h3:first-letter {
  font-size: 1.4em;
  line-height: 1em;
  font-weight: 900;
  color: #AD4234;
  vertical-align: middle;
}

.regiezna_middle {
  text-align: center;
  background-image: url(../../bilder/rathaus/RepeatingParchement.png);
  background-repeat: repeat-y;
  width: 500px;
  max-width: 500px;
  min-width: 500px;
}

.regiezna_bottom {
  background-image: url(../../bilder/rathaus/ParchementFooter.png);
  background-repeat: no-repeat;
  height: 80px;
  width: 500px;
  max-width: 500px;
}

.regiezna_inhalt {
  padding: 10px 40px 10px 40px;
  max-width: 500px;
}

.regiezna_rubrik {
  border: 1px solid #402C13;
  width: 96%;
  /* Zeitungs-Optik des Anzeigers gegen die Token-Accordion-Basis fixieren */
  background-color: #FFF4DF;
  border-radius: 0;
}
.regiezna_rubrik.accordion_toggle_active {
  background-color: #FFEDCC;
  border-radius: 0;
}

.regiezna_rubrik_beschreibung {
  font-size: 0.8em;
  text-align: left;
  font-style: oblique;
  margin-bottom: 5px;
  border-bottom: 1px dotted #402C13;
}

.regiezna_rubrik_inhalt {
  padding-bottom: 10px;
  max-height: 200px;
  overflow: auto;
  text-align: center;
}

/* -- Console ------------------------------------------------------------------*/

.console {
  position: absolute;
  top: 10px;
  left: 10px;
  width: 400px;
  height: 250px;
  max-height: 250px;
  border: 2px groove black;
  z-index: 60000;
  background-color: #D3913C;
}

.console .console_header {
  width: 100%;
  height: 10%;
  max-height: 10%;
  color: #402C13;
  background-color: #D3913C;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  font-weight: bold;
}

.console .console_header .console_close_button {
  width: 16px;
  height: 16px;
  position: absolute;
  top: 2px;
  right: 2px;
  vertical-align: top;
}

.console .console_outputwrap {
  width: 100%;
  max-width: 100%;
  height: 80%;
  max-height: 80%;
  font-family: monospace;
  font-size: 12px;
  background-color: #FFD98F;
  text-align: left;
  line-height: 13px;
  overflow: auto;
  border-top: 1px solid black;
  margin-top: -1px;
}

.console .console_output {
  padding: 2px;
}

.console .console_footer {
  width: 100%;
  height: 10%;
  max-height: 10%;
  font-size: 10px;
  background-color: #D3913C;
  text-align: center;
  line-height: 13px;
  overflow: auto;
  display: inline-block;
  border-top: 1px solid black;
  margin-top: -1px;
}

.console .console_footer_checkbox {
  width: 13px;
  height: 13px;
  vertical-align: top;
}

.console .console_footer_checkbox_label {
  text-align: left;
  color: black;
  width: 45%;
  height: 2.5em;
  display: inline-block;
}

.console .console_footer_checkbox_general {
  width: 13px;
  height: 13px;
  vertical-align: top;
}

.console .console_footer_checkbox__general_label {
  text-align: left;
  color: black;
  width: 45%;
  height: 2.5em;
  display: inline-block;
}

/**
 * Hauptseite
 */
div#gameContent { text-align: center; }
#ajax_loader { float: left; }
div.spielSeite { text-align: left; }

/**
 * weitere Helden im Ort/Taverne/Orden usw.
 */
div.weitere_helden { text-align: center; padding-bottom: 10px; }
div.weitere_helden div.weitere_helden_output { width: 98%; }
div.weitere_helden form { margin: 10px 0; }

/**
 * Kampf
 */
div.kampfseite div#meldung { margin: 10px; }
div.kampfmanoever table td { text-align: left; }
div.kampfmanoever select.input { width: 250px; }
table#KampfwerteAktuell td{text-align: center;}

/**
 * Fertigkeiten/Talente
 */
div.talenteBox table.sortable { width: 75%; text-align: center; }

/**
 * Orden
 */
div.orden table td { text-align: left; }
div.orden div#ausspionierenBox { margin: 40px; }

/**
 * Notizen
 */
div.notiz { text-align: center; text-align: center; margin: 5px; }
div.notiz textarea { width: 99%; }
div.notiz div.save_button { margin-top: 5px; text-align: center; }
div.notiz #meldung { font-weight: bold; }

/**
 * im Rathaus
 */
div.rathaus, div.illegaleAufgaben { padding: 10px; max-width: 800px; text-align: center; margin: auto; }
div.rathaus table, div.illegaleAufgaben table { text-align: left; }
div.illegaleAufgaben table th { text-align: center; }
div.illegaleAufgaben td.zurueck { text-align: center; }
div.illegaleAufgaben td.inhalt { padding-left: 10px; }
div.illegaleAufgaben img.float { max-width: 450px; width: 45%; float: right; margin-left: 10px; }

/**
 * Kampf- und Lernschule
 */
div.kampfschule, div.lernschule { padding: 10px; }
div.kampfschule table td { text-align: left; }
div.lernschule table td { text-align: left; }

/**
 * Markstand
 */
table.markstand { margin: 0; border: 0; border-spacing: 0; border-collapse: collapse; width: 100%; height: 100%; }

/**
 * Bank
 */
table.bank { text-align: left; }
table.bank td.bank_beschreibung div.bank_bild { width: 30%; float: left; }
table.bank td.bank_beschreibung div.bank_bild img { width: 93%; }
table.bank td.bank_beschreibung div.beschreibung_txt { line-height: 150%; }


/* Währungseingabe */
.bank-currency-input {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

/* Aktions-Buttons */
.bank-actions {
    margin-top: 10px;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

/* Konto auflösen Link */
.bank-account-close {
    margin-top: 10px;
    text-align: right;
    font-size: 0.9em;
}


.bank-creditletter-scope {
    margin: 8px 0;
}

.bank-creditletter-scope label {
    margin-right: 15px;
}

.bank-redeem-input {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
}

.bank-redeem-input label {
    white-space: nowrap;
}

/* Kreditbrief-Tabelle */
.bank-transfers {
    width: 100%;
    border-collapse: collapse;
    margin: 10px 0;
    font-size: 0.95em;
}

.bank-transfers th {
    text-align: left;
    padding: 6px 8px;
    border-bottom: 2px solid rgba(64, 44, 19, 0.3);
    font-weight: normal;
    color: #666;
}

.bank-transfers td {
    padding: 6px 8px;
    border-bottom: 1px solid rgba(64, 44, 19, 0.1);
    vertical-align: middle;
}

.bank-transfers .phrase-text {
    font-family: monospace;
    white-space: nowrap;
}

.bank-transfers .transfer-amount {
    white-space: nowrap;
}

.bank-transfers .transfer-note input {
    width: 100%;
    max-width: 150px;
}

/* Bank Filialen-Karte */
.bank-branches-section {
    display: flex;
    gap: 15px;
    align-items: flex-start;
    flex-wrap: wrap;
}

.bank-branches-map {
    position: relative;
    flex-shrink: 0;
}

.bank-branches-map img {
    display: block;
    width: 300px;
    height: auto;
    border: 1px solid rgba(64, 44, 19, 0.4);
    border-radius: 3px;
}

.bank-branches-map .branch-marker {
    position: absolute;
    width: 8px;
    height: 8px;
    background-color: #8B4513;
    border: 2px solid #FFD700;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.5);
    cursor: help;
    z-index: 10;
}

.bank-branches-map .branch-marker.current {
    background-color: #FFD700;
    border-color: #8B4513;
    width: 10px;
    height: 10px;
    z-index: 1;
}

.bank-branches-list {
    flex: 1;
    min-width: 200px;
}

.bank-branches-list p {
    margin: 0 0 8px 0;
}

/**
 * auf Reisen
 */
span.probe { font-style: italic; cursor:help; border-bottom: 1px dotted #402C13; }
span.probe_ohne_tip { font-style: italic; border-bottom: 1px dotted #402C13; }
div.tag span.zb_debug_output { color: blue; }
div.tag span.zb_debug_output span { padding-right: 20px; }
div.tag q  { font-style: italic; color: #505050; } /* vgl. .aoqml q */
div.tag img.zb_pic { float: right; }
div.tag div.tag_clear { clear: right; }

.reise table{
  border: 0;
}

/* Reise-Hauptbox als Karte (Pendant zur Bombast-Regel, hell) */
table.reise {
  border: 1px solid var(--mobile-border-soft);
  border-radius: 6px;
  background: var(--mobile-surface);
  box-shadow: 0 1px 4px rgba(64,44,19,0.25);
}

/**
 * Nachrichten
 */
div.nachrichten table#nachrichten { width: 98%; margin: 3px auto 3px auto; }
div.nachrichten table#nachrichten td.betreff { text-align: left; }
table.tableNachrichten { width: 85%; }
table.tableNachrichten td.nachricht_inhalt { text-align: left; }

/* Nachrichten DataTables — warmer Kopf + Tint-Zebra statt der General-Hardcodes */
#nachrichten.dataTable thead th {
    background-color: var(--mobile-surface-2);
    color: var(--mobile-text);
    border-bottom: 2px solid var(--mobile-accent-strong);
}
#nachrichten.dataTable tbody tr.odd {
    background-color: var(--mobile-surface-2);
}
#nachrichten.dataTable tbody tr.even {
    background-color: transparent;
}
#nachrichten.dataTable tbody tr:hover {
    background-color: var(--mobile-surface-2-hover) !important;
}
#nachrichten.dataTable td {
    border-bottom: 1px solid var(--mobile-border-very-soft);
}

/* Nachrichten Tabs - Antamar Theme (Aktiv-Zustand wie p.tab-nav: dunkler Grund) */
.nachrichten-tabs .tab {
    border: 1px solid #402C13;
    background-color: #FEEFD2;
    color: #000;
    border-radius: 4px;
}
.nachrichten-tabs .tab:hover {
    background-color: #f5e4be;
}
.nachrichten-tabs .tab.active {
    background-color: #402C13;
    color: #FFF4DF;
    font-weight: bold;
}

/**
 * Arena
 */
div.arena img.arena_img1 { width: 60%; text-align: right; }
div.arena img.arena_img2 { width: 30%; text-align: right; }

/**
 * Kerker
 */
div.kerker { max-width: 400px; text-align: center; margin: auto; padding-bottom: 20px; }
div.kerker img.kerkerImg { display: block; max-width: 390px; }

/**
 * Taverne
 */
div.tische ul { list-style: disc; line-height: 100%; }

/**
 * Gepäck
 */
div.gepaeck_inhalt_box { background-color: var(--mobile-surface); border: 1px solid var(--mobile-border-soft); border-radius: 4px; }
div.gepaeck_inhalt table.nahwaffen, div.gepaeck_inhalt table.schilde, div.gepaeck_inhalt table.ruestung, div.gepaeck_inhalt table.fernwaffen { clear:none; margin:0; }

/*--- RSS Teaser ---------------------------------------------------------------*/
.RssTeaser {
  padding:8px 8px 3px 8px;
  text-align: left;
  border-radius: 6px;
  border: 1px solid var(--mobile-border-soft);
  background: var(--mobile-surface);
  box-shadow: 0 1px 4px rgba(64,44,19,0.25);
  font-family: 'Josefin Sans', sans-serif;
}

div.RssTeaser { margin: 1em auto; width: 780px; }
div.RssTeaser h1 { text-align: center; }

/* -----------   */
.stadt_info{
  border-radius: 6px;
  border: 1px solid var(--mobile-border-soft);
  background: var(--mobile-surface);
  box-shadow: 0 1px 4px rgba(64,44,19,0.25);
}

.stadt_info td{
  border: 0;
}

/* Kein globaler Tabellen-Schlagschatten mehr; nur Bilder behalten einen weichen. */
img.zb_pic{
  box-shadow: 0 2px 6px rgba(64,44,19,0.35);
}

/**
Talente Übersicht
 */
td.fertigkeiten {
    text-align: left;
}

div.privathaus_bild img{
  margin: 0;
  max-width: 90%;
}

/**
 * Kampfmanöver Cards - helles Theme Anpassungen
 */
.manoever-card {
    background: rgba(64,44,19,0.1);
    border-color: rgba(64,44,19,0.3);
    color: #402C13;
}
.manoever-header {
    border-bottom-color: rgba(64,44,19,0.2);
    color: #402C13;
}
.manoever-range-visual {
    background: rgba(64,44,19,0.15);
    border-color: rgba(64,44,19,0.3);
}
.manoever-range-label {
    color: #402C13;
    text-shadow: none;
}
.manoever-range-bar {
    background: linear-gradient(to bottom, #AD4234, #8B3429);
}

/* Nicht ausführbare Manöver */
.manoever-card.nicht-ausfuehrbar {
    background: rgba(173,66,52,0.15);
    border-color: rgba(173,66,52,0.4);
}
.manoever-card.nicht-ausfuehrbar .manoever-header {
    color: #8B3429;
}
.manoever-warning-reason {
    background: rgba(173,66,52,0.15);
    color: #8B3429;
}
.manoever-details summary {
    color: #666;
}
.manoever-details summary:hover {
    color: #402C13;
}

/* Überlappungs-Übersicht */
.manoever-overlap-overview {
    background: rgba(64,44,19,0.08);
    border-color: rgba(64,44,19,0.2);
}
.overlap-row-bar {
    background: rgba(64,44,19,0.15);
}

/* Kampfstile */
.kampfstil-option {
    background: rgba(64,44,19,0.08);
    border-color: rgba(64,44,19,0.3);
    color: #402C13;
}
.kampfstil-option:hover {
    border-color: rgba(64,44,19,0.5);
}
.kampfstil-option.selected {
    border-color: #27ae60;
    background: rgba(39,174,96,0.15);
}

/* Allgemeine Einstellungen */
.allgemein-item {
    background: rgba(64,44,19,0.05);
    border-color: rgba(64,44,19,0.15);
}

/* Akkordeon Toggles */
.manoever-toggle {
    color: #402C13;
}

/* Manöver-Karten: die General-Basis nutzt dunkle Translucents (für Bombast
   entworfen) — auf dem hellen Skin als Token-Karten übersteuern. */
.manoever-card {
    background-color: var(--mobile-body-bg);
    background-image: linear-gradient(var(--mobile-surface-2), var(--mobile-surface-2));
    border-color: var(--mobile-border-soft);
}
.manoever-card.nicht-ausfuehrbar {
    background-color: var(--mobile-warn-bg);
    background-image: none;
    border-color: rgba(192, 57, 43, 0.4);
}
/* Bereichs-Balken: heller Track, dunkle Beschriftung (statt weiß auf grau) */
.manoever-range-visual {
    background: var(--mobile-surface-2);
    border-color: var(--mobile-border-soft);
}
.manoever-range-label {
    color: var(--mobile-text);
    text-shadow: 0 0 3px rgba(255, 255, 255, 0.8);
}
/* ============================================
 * Gespann-Styles (Mehrspänner)
 * ============================================ */
div.begleiter .gespann_box { background:#FFF4DF; border:1px solid #D3913C; border-radius:4px; padding:10px; margin:5px 0; }
div.begleiter .gespann_header { margin-bottom:8px; padding-bottom:5px; border-bottom:1px solid #D3913C; }
div.begleiter .gespann_header strong { font-size:1.05em; color:#402C13; }
div.begleiter .gespann_info { color:#666; font-size:0.9em; margin-left:8px; }
div.begleiter .gespann_warnung { color:#AD4234; font-size:0.85em; margin-left:10px; font-weight:bold; }
div.begleiter .gespann_liste { list-style:none; margin:0 0 10px 0; padding:0; }
div.begleiter .gespann_liste li { padding:5px 8px; margin:3px 0; background:#fff; border:1px solid #D3913C; border-radius:3px; display:flex; align-items:center; gap:10px; }
div.begleiter .gespann_leittier { background:#e8f4e8 !important; border-color:#8cb88c !important; }
div.begleiter .gespann_liste .tier_name { font-weight:bold; flex:1; color:#402C13; }
div.begleiter .gespann_liste .tier_info { color:#666; font-size:0.85em; }
div.begleiter .gespann_liste .tier_zugkraft { color:#AD4234; font-size:0.85em; min-width:100px; text-align:right; }
div.begleiter .gespann_summe { padding-top:8px; border-top:1px solid #D3913C; font-size:0.95em; }
div.begleiter .gespann_anspannen { margin-top:10px; padding-top:10px; border-top:1px dashed #D3913C; }
div.begleiter .gespann_anspannen select { padding:4px 8px; margin-right:8px; min-width:200px; border:1px solid #D3913C; }
div.begleiter .gespann_anspannen button { padding:4px 12px; cursor:pointer; background:#D3913C; color:#402C13; border:1px solid #402C13; border-radius:3px; }
div.begleiter .gespann_anspannen button:hover { background:#c07828; }
div.begleiter .btn_abspannen { padding:2px 8px; font-size:0.8em; cursor:pointer; background:#FFF4DF; border:1px solid #D3913C; border-radius:3px; color:#402C13; }
div.begleiter .btn_abspannen:hover { background:#fee; border-color:#AD4234; }
div.begleiter .angespannt_info { background:#fff8e8; border:1px solid #D3913C; border-radius:4px; padding:10px; display:flex; align-items:center; gap:10px; }
div.begleiter .angespannt_icon { font-size:1.3em; }
div.begleiter .anspannen_option { padding:5px 0; }
div.begleiter .anspannen_option select { padding:4px 8px; margin-right:8px; min-width:200px; border:1px solid #D3913C; }
div.begleiter .anspannen_option button { padding:4px 12px; cursor:pointer; background:#D3913C; color:#402C13; border:1px solid #402C13; border-radius:3px; }
div.begleiter .anspannen_option button:hover { background:#c07828; }

/**
 * Fertigkeiten-UI (Hell/Braun Theme)
 */
.fertigkeiten-ep-info {
    background: rgba(64,44,19,0.1);
    border: 1px solid rgba(64,44,19,0.3);
    border-radius: 4px;
    padding: 10px 15px;
    margin-bottom: 15px;
    display: flex;
    justify-content: center;
    gap: 30px;
    flex-wrap: wrap;
}
.fertigkeiten-ep-info .ep-value { font-weight: bold; font-size: 1.1em; }
.fertigkeiten-ep-info .ep-label { color: rgba(64,44,19,0.7); }

.fertigkeiten-filter {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 15px;
    justify-content: center;
}
.fertigkeiten-filter-btn {
    padding: 5px 12px;
    border-radius: 15px;
    border: 1px solid rgba(64,44,19,0.3);
    background: rgba(64,44,19,0.05);
    cursor: pointer;
    font-size: 0.9em;
    transition: all 0.2s;
}
.fertigkeiten-filter-btn:hover { background: rgba(64,44,19,0.15); }
.fertigkeiten-filter-btn.active { background: rgba(64,44,19,0.25); font-weight: bold; }
.fertigkeiten-filter-btn .count {
    background: rgba(64,44,19,0.2);
    border-radius: 10px;
    padding: 1px 6px;
    font-size: 0.85em;
    margin-left: 4px;
}

.fertigkeiten-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 12px;
    margin-bottom: 20px;
}

.fertigkeit-card {
    background: rgba(64,44,19,0.08);
    border: 1px solid rgba(64,44,19,0.25);
    border-radius: 6px;
    padding: 12px;
    text-align: left;
    transition: box-shadow 0.2s, border-color 0.2s;
}
.fertigkeit-card:hover {
    box-shadow: 0 2px 8px rgba(64,44,19,0.15);
    border-color: rgba(64,44,19,0.4);
}
.fertigkeit-card.nicht-steigerbar { opacity: 0.7; }
.fertigkeit-card.maximum-erreicht {
    background: rgba(0,161,0,0.08);
    border-color: rgba(0,161,0,0.3);
}

.fertigkeit-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}
.fertigkeit-name { font-weight: bold; font-size: 1.05em; }
.fertigkeit-name .tip { cursor: help; border-bottom: 1px dotted; }
.fertigkeit-attribute {
    color: rgba(64,44,19,0.6);
    font-size: 0.9em;
    white-space: nowrap;
}

.fertigkeit-progress-container { margin: 10px 0; }
.fertigkeit-progress-bar {
    height: 20px;
    background: rgba(64,44,19,0.15);
    border-radius: 10px;
    overflow: hidden;
    position: relative;
}
.fertigkeit-progress-fill {
    height: 100%;
    background: linear-gradient(90deg, rgba(64,44,19,0.4), rgba(64,44,19,0.6));
    border-radius: 10px;
    transition: width 0.3s ease;
}
.fertigkeit-progress-fill.maximum {
    background: linear-gradient(90deg, rgba(0,161,0,0.5), rgba(0,161,0,0.7));
}
.fertigkeit-progress-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 0.85em;
    font-weight: bold;
    text-shadow: 0 0 3px rgba(255,255,255,0.8);
}

.fertigkeit-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 10px;
    flex-wrap: wrap;
    gap: 8px;
}
.fertigkeit-ep-info { font-size: 0.85em; color: rgba(64,44,19,0.7); }
.fertigkeit-actions { display: flex; gap: 6px; }
.fertigkeit-steigern-btn {
    padding: 6px 14px;
    border-radius: 4px;
    border: 1px solid rgba(64,44,19,0.4);
    background: rgba(64,44,19,0.15);
    cursor: pointer;
    font-size: 0.9em;
    transition: all 0.2s;
    text-decoration: none;
    color: inherit;
}
.fertigkeit-steigern-btn:hover {
    background: rgba(64,44,19,0.3);
    border-color: rgba(64,44,19,0.5);
}
.fertigkeit-steigern-btn:disabled,
.fertigkeit-steigern-btn.disabled { opacity: 0.5; cursor: not-allowed; }
.fertigkeit-steigern-btn.primary {
    background: rgba(0,100,0,0.2);
    border-color: rgba(0,100,0,0.4);
}
.fertigkeit-steigern-btn.primary:hover { background: rgba(0,100,0,0.35); }

.fertigkeit-voraussetzungen {
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px dashed rgba(64,44,19,0.2);
    font-size: 0.85em;
}
.fertigkeit-voraussetzungen summary { cursor: pointer; color: rgba(64,44,19,0.6); }
.fertigkeit-voraussetzungen-list { margin-top: 5px; padding-left: 15px; }

.fertigkeiten-aktivieren {
    background: rgba(64,44,19,0.05);
    border: 1px dashed rgba(64,44,19,0.3);
    border-radius: 6px;
    padding: 15px;
    margin-top: 20px;
}
.fertigkeiten-aktivieren h3 { margin: 0 0 10px 0; font-size: 1em; }
.fertigkeiten-aktivieren select {
    padding: 8px;
    border-radius: 4px;
    border: 1px solid rgba(64,44,19,0.3);
    background: #fff;
    min-width: 200px;
}

.fertigkeit-status {
    font-size: 0.8em;
    padding: 2px 8px;
    border-radius: 10px;
    margin-left: 8px;
}
.fertigkeit-status.blockiert { background: rgba(255,0,0,0.15); color: #c00; }
.fertigkeit-status.ep-fehlen { background: rgba(255,165,0,0.2); color: #b86e00; }
.fertigkeit-status.maximum { background: rgba(0,161,0,0.15); color: #008000; }

/* Tipp-Banner */
.fertigkeiten-tipp-banner {
    background: rgba(211,145,60,0.15);
    border: 1px solid rgba(211,145,60,0.4);
    border-left: 4px solid #D3913C;
    border-radius: 6px;
    padding: 12px 15px;
    margin-bottom: 15px;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    text-align: left;
}
.fertigkeiten-tipp-banner img { width: 24px; height: 24px; flex-shrink: 0; margin-top: 2px; }
.fertigkeiten-tipp-banner .tipp-content { flex: 1; }
.fertigkeiten-tipp-banner h2 { margin: 0 0 8px 0; font-size: 1.1em; color: #402C13; }
.fertigkeiten-tipp-banner p { margin: 0 0 6px 0; font-size: 0.9em; line-height: 1.4; }
.fertigkeiten-tipp-banner p:last-child { margin-bottom: 0; }
.fertigkeiten-tipp-banner b { color: #AD4234; }

@media (max-width: 700px) {
    .fertigkeiten-grid { grid-template-columns: 1fr; }
    .fertigkeiten-tabs { gap: 2px; }
    .fertigkeiten-tab { padding: 6px 10px; font-size: 0.9em; }
    .fertigkeiten-ep-info { flex-direction: column; gap: 5px; text-align: center; }
}

/**
 * Zauber-UI (Hell/Braun Theme)
 */
.zauberBox { padding: 10px; }

.zauber-ep-info {
    background: rgba(64,44,19,0.12);
    border: 1px solid rgba(64,44,19,0.4);
    border-radius: 4px;
    padding: 10px 15px;
    margin-bottom: 15px;
    display: inline-block;
    color: #402C13;
}
.zauber-ep-info .ep-label { color: #5a4020; }
.zauber-ep-info .ep-value { font-weight: bold; font-size: 1.1em; color: #2a1a08; }

.zauber-filter {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 15px;
    justify-content: center;
}
.zauber-filter-btn {
    padding: 5px 12px;
    border-radius: 15px;
    border: 1px solid rgba(64,44,19,0.4);
    background: rgba(64,44,19,0.08);
    color: #402C13;
    cursor: pointer;
    font-size: 0.9em;
    transition: all 0.2s;
}
.zauber-filter-btn:hover { background: rgba(64,44,19,0.2); }
.zauber-filter-btn.active { background: rgba(64,44,19,0.3); font-weight: bold; color: #2a1a08; }
.zauber-filter-btn .count {
    background: rgba(64,44,19,0.25);
    border-radius: 10px;
    padding: 1px 6px;
    font-size: 0.85em;
    margin-left: 4px;
}

.zauber-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 12px;
    margin-bottom: 20px;
}

.zauber-card {
    background: rgba(64,44,19,0.1);
    border: 1px solid rgba(64,44,19,0.35);
    border-radius: 6px;
    padding: 12px;
    text-align: left;
    color: #402C13;
    transition: box-shadow 0.2s, border-color 0.2s;
}
.zauber-card:hover {
    box-shadow: 0 2px 8px rgba(64,44,19,0.2);
    border-color: rgba(64,44,19,0.5);
}
.zauber-card.im-kampf-aktiv {
    border-color: #2a8a2a;
    border-width: 2px;
    background: rgba(0,161,0,0.08);
}
.zauber-card.maximum-erreicht {
    background: rgba(0,161,0,0.1);
    border-color: #2a8a2a;
}
.zauber-card.nicht-steigerbar { }

.zauber-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}
.zauber-name { flex: 1; font-weight: bold; font-size: 1.05em; color: #2a1a08; }
.zauber-name a {
    color: #2a1a08;
    text-decoration: none;
    cursor: help;
    border-bottom: 1px dotted #5a4020;
}
.zauber-name a:hover { color: #AD4234; }
.zauber-name img { vertical-align: middle; margin-right: 5px; }

.zauber-status {
    font-size: 0.8em;
    padding: 2px 8px;
    border-radius: 10px;
    margin-left: 8px;
    display: inline-block;
    margin-top: 4px;
}
.zauber-status.maximum { background: rgba(0,120,0,0.2); color: #006600; }
.zauber-status.ep-fehlen { background: rgba(200,80,0,0.2); color: #a04000; }

.zauber-attribute {
    color: #5a4020;
    font-size: 0.9em;
    white-space: nowrap;
}

.zauber-progress-container { margin: 10px 0; }
.zauber-progress-bar {
    height: 20px;
    background: rgba(64,44,19,0.2);
    border-radius: 10px;
    overflow: hidden;
    position: relative;
    border: 1px solid rgba(64,44,19,0.25);
}
.zauber-progress-fill {
    height: 100%;
    background: linear-gradient(90deg, #8B6914, #AD8234);
    border-radius: 10px;
    transition: width 0.3s ease;
}
.zauber-progress-fill.maximum {
    background: linear-gradient(90deg, #2a8a2a, #3aa03a);
}
.zauber-progress-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 0.85em;
    font-weight: bold;
    color: #2a1a08;
    text-shadow: 0 0 3px rgba(255,255,255,0.9);
}

.zauber-details {
    font-size: 0.85em;
    color: #402C13;
    margin-bottom: 10px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.zauber-detail {
    background: rgba(64,44,19,0.15);
    padding: 3px 8px;
    border-radius: 3px;
    border: 1px solid rgba(64,44,19,0.2);
}
.zauber-detail-label { color: #5a4020; }

.zauber-footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding-top: 10px;
    border-top: 1px solid rgba(64,44,19,0.2);
}

.zauber-kampf-toggle { display: flex; align-items: center; }
.zauber-toggle-label {
    display: flex;
    align-items: center;
    cursor: pointer;
    gap: 8px;
}
.zauber-kampf-checkbox { display: none; }
.zauber-toggle-slider {
    width: 36px;
    height: 18px;
    background: rgba(64,44,19,0.35);
    border-radius: 18px;
    position: relative;
    transition: background 0.3s;
}
.zauber-toggle-slider::after {
    content: '';
    position: absolute;
    width: 14px;
    height: 14px;
    background: #FFF4DF;
    border-radius: 50%;
    top: 2px;
    left: 2px;
    transition: transform 0.3s;
    box-shadow: 0 1px 3px rgba(0,0,0,0.3);
}
.zauber-kampf-checkbox:checked + .zauber-toggle-slider { background: #2a8a2a; }
.zauber-kampf-checkbox:checked + .zauber-toggle-slider::after { transform: translateX(18px); }
.zauber-toggle-text { font-size: 0.85em; color: #5a4020; }

.zauber-ep-info-card { font-size: 0.85em; color: #5a4020; }
.zauber-actions { margin-left: auto; }

.zauber-steigern-btn {
    padding: 6px 14px;
    border-radius: 4px;
    border: 1px solid rgba(64,44,19,0.5);
    background: rgba(64,44,19,0.2);
    cursor: pointer;
    font-size: 0.9em;
    transition: all 0.2s;
    text-decoration: none;
    color: #402C13;
    display: inline-block;
}
.zauber-steigern-btn:hover {
    background: rgba(64,44,19,0.35);
    border-color: rgba(64,44,19,0.6);
}
.zauber-steigern-btn.primary {
    background: rgba(0,100,0,0.25);
    border-color: #2a8a2a;
    color: #006600;
}
.zauber-steigern-btn.primary:hover { background: rgba(0,100,0,0.4); }
.zauber-steigern-btn.disabled { opacity: 0.5; cursor: not-allowed; }

.zauber-einstellungen {
    background: rgba(64,44,19,0.08);
    border: 1px dashed rgba(64,44,19,0.4);
    border-radius: 6px;
    padding: 15px;
    margin-bottom: 20px;
    color: #402C13;
}
.zauber-einstellungen h3 { margin: 0 0 12px 0; font-size: 1em; color: #2a1a08; }
.zauber-einstellung-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
}
.zauber-einstellung-row label { color: #402C13; }
.zauber-einstellung-actions { display: flex; align-items: center; gap: 10px; }

.zauber-sonderfertigkeiten {
    background: rgba(64,44,19,0.08);
    border: 1px solid rgba(64,44,19,0.3);
    border-radius: 6px;
    padding: 15px;
    color: #402C13;
}
.zauber-sonderfertigkeiten h3 { margin: 0 0 10px 0; font-size: 1em; color: #2a1a08; }
.zauber-sf-list { text-align: center; }
.zauber-sf-list a { color: #AD4234; }

@media (max-width: 700px) {
    .zauber-grid { grid-template-columns: 1fr; }
}

/* ========== Kampfseite Redesign v2 - Theme-Anpassungen ========== */
.kampfwert_card {
    background: rgba(255,244,223,0.4);
    border-color: #D3913C;
    color: #402C13;
}

.kampfwert_card .label {
    color: #5a4020;
}

.kampfwert_card.warning {
    border-color: #c0392b;
    background: rgba(192,57,43,0.15);
}

.kampf_tabs .tab {
    background: rgba(255,244,223,0.5);
    color: #402C13;
}

.kampf_tabs .tab:hover {
    background: rgba(255,244,223,0.7);
}

.kampf_tabs .tab.selektiert {
    border-color: #D3913C;
    background: #FFF4DF;
}

.kampf_tabs .tab .tab-label {
    color: #5a4020;
}

/* Mobile-Layout-Baseline (Header/Menu ausblenden, Mobile-Bars, Typografie)
   liegt zentral in antamarGeneralv57.css und greift via Tokens auf die oben
   im :root gesetzten Antamar-Farben zu. */

/* ============================================================
 * Accordions — Desktop-Adoption des Mobil-Looks (>770px).
 * Flache Token-Köpfe + Row-Liste + inline gedämpfte Meta.
 * Gilt generell (Ort, Taverne, Ordenshalle, Reise-Chats, Gruppe);
 * Ausnahmen: .regiezna_rubrik (Rathaus-Anzeiger, Pergament-Optik)
 * und .manoever-toggle (Kampfmanöver, eigenes .toggle-icon-Dreieck).
 * Ort-Block-Vorbild stammt aus css/bombast/antamarv70.css (dort weiter
 * ortsuebersicht-scoped). Mobil (<=770px, antamar_mobile_patterns.css)
 * bleibt unberührt.
 * ============================================================ */
@media (min-width: 771px) {

    /* Köpfe: flache Token-Leiste statt Verlauf/Beige. overflow:hidden + Teaser-Kürzung
       wie mobil (Chat-Köpfe tragen einen Live-#*_tl-Span). */
    .accordion_toggle:not(.regiezna_rubrik):not(.manoever-toggle),
    .accordion_toggle2 {
        display: flex;
        align-items: center;
        width: 100%;
        box-sizing: border-box;
        height: auto;
        margin: var(--space-xs) 0 0;
        padding: var(--space-xs) var(--space-md); /* desktop-kompakt ~32px, NICHT 44px */
        background: var(--mobile-surface-2);
        border: 1px solid var(--mobile-border-soft);
        border-radius: 4px;
        color: var(--mobile-text);
        font-size: 1.05em;
        line-height: 1.5;
        overflow: hidden;
        cursor: pointer;
        transition: background var(--motion-fast) var(--motion-ease);
    }
    .accordion_toggle:not(.regiezna_rubrik):not(.manoever-toggle):hover,
    .accordion_toggle2:hover,
    .accordion_toggle.accordion_toggle_active:not(.regiezna_rubrik):not(.manoever-toggle),
    .accordion_toggle2.accordion_toggle_active {
        background: var(--mobile-surface-2-hover);
        color: var(--mobile-text);
    }
    /* offener Kopf schließt bündig an die Inhalts-Box an (untere Ecken eckig) */
    .accordion_toggle.accordion_toggle_active:not(.regiezna_rubrik):not(.manoever-toggle),
    .accordion_toggle2.accordion_toggle_active {
        border-radius: 4px 4px 0 0;
    }
    /* Chevron + Auf/Zu-Rotation (accordion-v39.js setzt accordion_toggle_active — kein
       JS-Change). Kein Chevron für .accordion_toggle2: dort sitzt rechts der
       absolut positionierte Chat-Toggle-Button. */
    .accordion_toggle:not(.regiezna_rubrik):not(.manoever-toggle)::after {
        content: "\203A";
        margin-left: auto;
        padding-left: var(--space-sm);
        opacity: 0.6;
        transition: transform var(--motion-fast) var(--motion-ease);
    }
    .accordion_toggle.accordion_toggle_active:not(.regiezna_rubrik):not(.manoever-toggle)::after {
        transform: rotate(90deg);
    }
    /* Platz für den absoluten Chat-Toggle-Button im Gruppen-Kopf */
    .accordion_toggle2 { padding-right: 40px; }
    .accordion_toggle > span[id$="_tl"],
    .accordion_toggle2 > span[id$="_tl"] {
        flex: 1;
        min-width: 0;
        /* Desktop in table-layout:auto (Mantis #1229): nowrap+Ellipsis klippt hier NICHT,
           sondern zieht die Spielspalte auf. Darum weiter umbrechen lassen (white-space:normal
           + overflow-wrap:anywhere haelt die min-content-Breite bei ~1 Zeichen -> kein
           Spaltenzug) UND per line-clamp auf genau EINE Zeile mit Ellipsis begrenzen, damit
           der Kopf bei schmalem Desktop-Fenster nicht zweizeilig waechst.
           Mobil greift weiter die nowrap-Ellipsis-Regel in antamar_mobile_patterns.css. */
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
        line-clamp: 1;
        overflow: hidden;
        white-space: normal;
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    /* Inhalt als Box unter dem Kopf: dezenter Surface-Hintergrund + Rahmen (per
       inset box-shadow, damit die Accordion-Höhenmessung nicht um die Border-Breite
       klippt) + untere Rundung. overflow/max-height/opacity NICHT anfassen — Animation. */
    .accordion_content,
    .accordion_content2 {
        margin: 0;
        padding: var(--space-xs) var(--space-md) var(--space-sm);
        box-sizing: border-box;
        background: var(--mobile-surface-2);
        border-radius: 0 0 4px 4px;
        box-shadow:
            inset 1px 0 0 var(--mobile-border-soft),
            inset -1px 0 0 var(--mobile-border-soft),
            inset 0 -1px 0 var(--mobile-border-soft);
    }
    /* Ortsübersicht: Row-Listen (Gebäude/Chat-Zeilen) laufen bewusst bis an
       die Boxkante (Hover-Balken full-bleed) — Horizontal-Padding nur dort 0. */
    #accordion_container_ortsuebersicht .accordion_content {
        padding-left: 0;
        padding-right: 0;
    }
    /* Ausnahmen behalten ihre eigene Optik (Anzeiger-Pergament, Manöver-Karten) */
    .manoever-content,
    .regiezna .accordion_content {
        background: none;
        box-shadow: none;
        border-radius: 0;
        padding: 0;
        margin: 0;
    }

    /* Orts-Chat: in der 0-Padding-Box braucht das AOChat-Panel eigene Luft. */
    #accordion_container_ortsuebersicht .accordion_content .AOChatBox {
        padding: 0 var(--space-sm);
    }

    /* Kampfseite-Detailsections: auf Desktop bewusst statisch offen
       (VanillaAccordion wird in kampfseite.inc.php nur mobil initialisiert) —
       darum hier keine Accordion-Affordance vortäuschen: kein Chevron, kein
       Pointer, kein Hover. Optik bleibt Sektionsleiste + Inhalts-Box. */
    .kampf_v2 .kampf-details .accordion_toggle {
        cursor: default;
        border-radius: 4px 4px 0 0;
    }
    .kampf_v2 .kampf-details .accordion_toggle::after {
        content: none;
    }
    .kampf_v2 .kampf-details .accordion_toggle:hover {
        background: var(--mobile-surface-2);
    }
    /* Innenabstand: das generische 0-Horizontal-Padding ist für vollflächige
       Row-Listen (Ort/Chat) gedacht — hier steht Fließtext direkt in der Box
       und braucht Luft. Horizontal wie der Kopf (space-md) -> Text fluchtet. */
    .kampf_v2 .kampf-details .accordion_content {
        padding: var(--space-sm) var(--space-md);
    }

    /* Linklisten → Row-Liste (greift via .ort_uebersicht auch auf die "Wohin"-Hauptliste) */
    .ort_uebersicht ul.ort_gebaeude {
        list-style: none;
        margin: 0;
        padding: 0;
    }
    .ort_uebersicht ul.ort_hauptgebaeude {
        margin-left: 0;
    }
    .ort_uebersicht ul.ort_gebaeude > li {
        margin: 0;
        padding: 0;
        border-bottom: 1px dotted var(--mobile-border-soft);
        background-position: var(--space-sm) center;
        background-size: 20px;
        line-height: 1.4;
    }
    .ort_uebersicht ul.ort_gebaeude > li:last-child {
        border-bottom: none;
    }

    /* Zeile = einzeiliger Link: Titel in Akzent (Fettschrift erbt von GebaeudeIcons),
       Hover-Highlight (Desktop hat Hover). */
    .ort_uebersicht ul.ort_gebaeude > li > a {
        display: flex;
        align-items: center;
        min-height: 28px;
        padding: 3px var(--space-sm) 3px calc(20px + var(--space-sm) * 2);
        color: var(--mobile-accent);
        text-decoration: none;
        transition: background var(--motion-fast) var(--motion-ease);
    }
    .ort_uebersicht ul.ort_gebaeude > li > a:hover {
        background: var(--mobile-border-very-soft); /* dezenter Tint statt voller Surface-Fläche */
    }

    /* Klammer-Typ / Tavernen-Ambiente inline & gedämpft (statt rote Textwand) */
    .ort_uebersicht ul.ort_gebaeude .ort-meta,
    .ort_uebersicht ul.ort_gebaeude > li > em {
        margin-left: var(--space-xs);
        color: var(--mobile-text-soft);
        font-weight: 400;
        font-size: 0.9em;
        font-style: normal;
    }

    /* Nicht verlinkte Einträge ("… während der Arbeit nicht nutzbar") gedämpft */
    .ort_uebersicht ul.ort_gebaeude > li:not(:has(a)) {
        padding: 3px var(--space-sm) 3px calc(20px + var(--space-sm) * 2);
        color: var(--mobile-text-soft);
        font-style: italic;
    }
}

/* -- Party-Leiste: Chips im Skin-Look (Pergament-Karten) -------------------- */
.party-held {
    background: var(--mobile-surface);
    border: 1px solid var(--mobile-border);
    border-radius: 4px;
}
a.party-held:hover { background: #F7E7C0; }
/* Header-Variante: aktiver Held gross + Gefaehrten-Minis im heroPics-Slot
   (Einzug wie das ersetzte Portrait, #header_left img margin-left:20px).
   Das Band existiert auf dem Desktop nicht mehr (party-nur-mobil) — die
   frueheren Pin-Verschiebungsregeln sind damit hinfaellig. */
.party-header { margin-left: 20px; }
.party-mini {
    background: var(--mobile-surface);
    border: 1px solid var(--mobile-border);
    border-radius: 4px;
}
a.party-mini:hover { background: #F7E7C0; }