/* ==============================
INDEX / STARTSEITE
============================== */

.index-page {
max-width: 1260px;
margin: 0 auto 60px auto;
box-sizing: border-box;
}

/* Boardtitel zwischen Header und Inhalt */
.index-board-title {
margin: 34px auto 26px auto;
text-align: center;
position: relative;
}

.index-board-title span {
display: inline-block;
position: relative;
padding: 0 34px;
font-family: Georgia, serif;
font-size: 25px;
letter-spacing: 0.22em;
text-transform: uppercase;
color: #3a302d;
}

.index-board-title span::before,
.index-board-title span::after {
content: "";
position: absolute;
top: 50%;
width: 110px;
height: 1px;
background: rgba(58,48,45,0.22);
}

.index-board-title span::before {
right: 100%;
}

.index-board-title span::after {
left: 100%;
}

/* Szenenverwaltung-Karte */
.index-scenehub {
margin: 0 auto 34px auto;
background:
linear-gradient(135deg, rgba(58,48,45,0.92), rgba(58,48,45,0.78)),
linear-gradient(90deg, rgba(255,255,255,0.06), transparent);
border: 1px solid rgba(255,255,255,0.18);
border-radius: 18px;
overflow: hidden;
box-shadow: 0 18px 45px rgba(45,36,31,0.16);
color: #f8f4ef;
}

/* Kopf der Szenenverwaltung */
.index-scenehub-head {
display: flex;
align-items: center;
gap: 18px;
padding: 24px 28px;
box-sizing: border-box;
}

.index-scenehub-icon {
width: 54px;
height: 54px;
border-radius: 50%;
border: 1px solid rgba(201,167,100,0.45);
display: flex;
align-items: center;
justify-content: center;
color: #c9a764;
font-size: 25px;
background: rgba(0,0,0,0.12);
box-shadow: inset 0 0 20px rgba(255,255,255,0.04);
flex: 0 0 auto;
}

.index-scenehub-title span {
display: block;
font-family: Georgia, serif;
font-size: 22px;
letter-spacing: 0.18em;
text-transform: uppercase;
color: #f8f4ef;
}

.index-scenehub-title strong {
display: block;
margin-top: 5px;
font-size: 12px;
font-weight: 400;
letter-spacing: 0.08em;
text-transform: uppercase;
color: rgba(248,244,239,0.72);
}

/* Reminder vom Szenentracker */
.index-scenehub-reminder {
padding: 0 28px 18px 28px;
box-sizing: border-box;
color: rgba(248,244,239,0.86);
}

.index-scenehub-reminder:empty {
display: none;
}

/* Details / Ausklapper */
.index-scenetracker-fold {
border-top: 1px solid rgba(255,255,255,0.12);
}

.index-scenetracker-fold summary {
list-style: none;
cursor: pointer;
padding: 18px 28px;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: space-between;
gap: 18px;
background: rgba(255,255,255,0.08);
color: #f8f4ef;
transition: background 0.2s ease;
}

.index-scenetracker-fold summary::-webkit-details-marker {
display: none;
}

.index-scenetracker-fold summary:hover {
background: rgba(255,255,255,0.12);
}

.index-scenetracker-fold summary span {
font-family: Georgia, serif;
font-size: 16px;
letter-spacing: 0.14em;
text-transform: uppercase;
}

.index-scenetracker-fold summary em {
font-style: normal;
font-size: 10px;
letter-spacing: 0.18em;
text-transform: uppercase;
color: #c9a764;
}

.index-scenetracker-fold summary::after {
content: "›";
font-size: 34px;
line-height: 1;
color: #c9a764;
transition: transform 0.2s ease;
}

.index-scenetracker-fold[open] summary::after {
transform: rotate(90deg);
}

/* Inhalt des aufgeklappten Trackers */
.index-scenetracker-content {
padding: 24px 28px 28px 28px;
background: rgba(248,244,239,0.96);
color: #2f2926;
box-sizing: border-box;
}

.index-scenetracker-content table {
width: 100%;
max-width: 100%;
box-sizing: border-box;
}

.index-scenetracker-content a {
color: #8d6f39;
font-weight: 700;
text-decoration: none;
}

.index-scenetracker-content a:hover {
text-decoration: underline;
}

/* Forenbereich danach */
.index-forums {
margin-top: 34px;
}

/* Mobile */
@media (max-width: 800px) {
.index-board-title span {
font-size: 18px;
letter-spacing: 0.14em;
padding: 0 18px;
}
.index-board-title span::before,
.index-board-title span::after {
    width: 45px;
}

.index-scenehub-head {
    flex-direction: column;
    align-items: flex-start;
}

.index-scenetracker-fold summary {
    flex-direction: column;
    align-items: flex-start;
}

.index-scenetracker-fold summary::after {
    align-self: flex-end;
}

}
/* ==============================
   INDEX - SZENENVERWALTUNG FEINSCHLIFF
   ============================== */

/* Szenenverwaltung etwas kompakter machen */
.index-scenehub-head {
    padding: 22px 28px 18px 28px;
}

/* Falls der Reminder leer ist oder nur Abstand erzeugt */
.index-scenehub-reminder {
    display: none;
}

/* Blauen Browser-Fokusrahmen entfernen */
.index-scenetracker-fold summary {
    outline: none;
    border: 0;
}

/* Schöner eigener Fokus, falls man mit Tastatur navigiert */
.index-scenetracker-fold summary:focus-visible {
    outline: 1px solid rgba(201,167,100,0.65);
    outline-offset: -4px;
}

/* Summary-Bar etwas ruhiger */
.index-scenetracker-fold summary {
    border-top: 1px solid rgba(255,255,255,0.10);
}

/* Abstand zu den Foren etwas ausgewogener */
.index-forums {
    margin-top: 30px;
}
/* ==============================
   INDEX - ALTE BREADCRUMB AUSBLENDEN
   ============================== */

/* Die normale MyBB-Navigation/Breadcrumb auf der Startseite ausblenden */
.navigation {
    display: none !important;
}

/* Falls MyBB nach der Navigation noch einen einsamen Abstand setzt */
#content .wrapper > br:first-of-type {
    display: none;
}

/* Boardtitel etwas näher an Header/Szenenverwaltung ziehen */
.index-board-title {
    margin: 28px auto 26px auto;
}
/* ==============================
INDEX - ALTE NAVIGATION RESTE AUSBLENDEN
============================== */

/* Normale MyBB-Breadcrumbs auf der Startseite ausblenden */
.navigation,
navigation {
display: none !important;
}

/* Falls MyBB um die Navigation herum noch Abstand erzeugt */
#content .wrapper > navigation,
#content .wrapper > .navigation {
display: none !important;
}

/* Einzelne herumstehende Brüche nach der Navigation reduzieren */
#content .wrapper > br:first-of-type {
display: none !important;
}

/* Boardtitel etwas harmonischer setzen */
.index-board-title {
margin: 30px auto 26px auto;
}
/* ==============================
INDEX - HEADER NAVIGATION AUSBLENDEN
============================== */

/* Auf der Startseite die normale MyBB-Navigation ausblenden */
.mybb-navigation {
display: none !important;
}

/* Den zugehörigen Abstand direkt danach ebenfalls entfernen */
.mybb-navigation + br {
display: none !important;
}

/* Boardtitel danach etwas höher ziehen */
.index-board-title {
margin-top: 24px !important;
}
/* ==============================
INDEX - BOARD STATISTICS
============================== */

.index-boardstats-card {
margin: 34px auto 0 auto;
background: rgba(255,255,255,0.94);
border: 1px solid rgba(58,48,45,0.14);
border-radius: 18px;
overflow: hidden;
box-shadow: 0 18px 45px rgba(45,36,31,0.10);
box-sizing: border-box;
}

.index-boardstats-head {
display: flex;
align-items: center;
gap: 18px;
padding: 24px 28px;
background: #3a302d;
color: #f8f4ef;
box-sizing: border-box;
}

.index-boardstats-icon {
width: 50px;
height: 50px;
border-radius: 50%;
border: 1px solid rgba(201,167,100,0.45);
display: flex;
align-items: center;
justify-content: center;
color: #c9a764;
font-size: 23px;
background: rgba(0,0,0,0.12);
flex: 0 0 auto;
}

.index-boardstats-title span {
display: block;
font-family: Georgia, serif;
font-size: 20px;
letter-spacing: 0.18em;
text-transform: uppercase;
color: #f8f4ef;
}

.index-boardstats-title strong {
display: block;
margin-top: 5px;
font-size: 11px;
font-weight: 400;
letter-spacing: 0.08em;
text-transform: uppercase;
color: rgba(248,244,239,0.72);
}

.index-boardstats-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 22px;
padding: 24px 28px;
box-sizing: border-box;
}

.index-statbox {
background: #f8f4ef;
border: 1px solid rgba(58,48,45,0.10);
border-radius: 14px;
overflow: hidden;
box-sizing: border-box;
}

.index-statbox-title {
display: flex;
align-items: center;
justify-content: space-between;
gap: 14px;
padding: 14px 18px;
background: rgba(58,48,45,0.08);
box-sizing: border-box;
}

.index-statbox-title span {
font-family: Georgia, serif;
font-size: 14px;
font-weight: 700;
letter-spacing: 0.16em;
text-transform: uppercase;
color: #3a302d;
}

.index-statbox-title a {
color: #8d6f39;
font-size: 10px;
font-weight: 700;
letter-spacing: 0.12em;
text-transform: uppercase;
text-decoration: none;
}

.index-statbox-title a:hover {
text-decoration: underline;
}

.index-statbox-content {
padding: 18px;
color: #2f2926;
font-size: 13px;
line-height: 1.75;
box-sizing: border-box;
}

.index-statbox-content a {
color: #8d6f39;
font-weight: 700;
text-decoration: none;
}

.index-statbox-content a:hover {
text-decoration: underline;
}

.index-boardstats-footer {
padding: 16px 28px;
text-align: right;
background: rgba(58,48,45,0.06);
border-top: 1px solid rgba(58,48,45,0.10);
box-sizing: border-box;
font-size: 12px;
}

.index-boardstats-footer a {
color: #8d6f39;
font-weight: 700;
text-decoration: none;
margin-left: 14px;
}

.index-boardstats-footer a:hover {
text-decoration: underline;
}

@media (max-width: 800px) {
.index-boardstats-head {
flex-direction: column;
align-items: flex-start;
}

```
.index-boardstats-grid {
    grid-template-columns: 1fr;
}

.index-boardstats-footer {
    text-align: center;
}
```

}
