/* ============================================================================
 * report.css - tc-report / tc-placement / tc-lastbattle
 * ----------------------------------------------------------------------------
 * SCHICHT 1. Bausteine des "Kriegsberichts" (eigene Bande auf einen Blick):
 *   - tc-report     Layout-Glue: Identity-Zeile, 2-Spalten-Grid, tc-subhead
 *   - tc-placement  Platzierungs-Strip: eigene Raenge je Rangliste (Medaille 1-3)
 *   - tc-lastbattle Ergebnis-Highlight (Sieg/Niederlage/Remis)
 *
 * THEME-GETRIEBEN, ausser Medaillen-/Ergebnis-Farben (DATEN).
 *
 * Struktur:
 *   .tc-report__identity ( strong = Bandenname )
 *   .tc-report__grid      2 Spalten (1 auf Mobile)
 *   .tc-subhead           kleine Abschnitts-Ueberschrift
 *   .tc-placement / .tc-placement__item ( __rank[--1/--2/--3] . __label )
 *   .tc-lastbattle ( __result . __info ( __date ) )   (--loss / --draw)
 * ============================================================================ */

.tc-report__identity { font-size: 0.8rem; color: var(--tc-text-muted); margin-bottom: 16px; }
.tc-report__identity strong { color: var(--tc-text-strong); font-family: var(--tc-font-display, 'Cinzel', serif); font-weight: 600; font-size: 1.02rem; }
.tc-report__grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 18px; margin-top: 18px; }

.tc-subhead { margin: 0 0 10px; font-family: var(--tc-font-body, sans-serif); font-size: 0.66rem; font-weight: 700; letter-spacing: 0.09em; text-transform: uppercase; color: var(--tc-highlight); }

.tc-placement { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.tc-placement__item { display: flex; align-items: center; gap: 9px; padding: 8px 12px; border-radius: var(--tc-radius-md, 8px); background: rgba(255,255,255,0.02); border: 1px solid var(--tc-border-subtle); }
.tc-placement__rank { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-family: var(--tc-font-display, 'Cinzel', serif); font-weight: 700; font-size: 0.8rem; color: var(--tc-text-default); background: rgba(255,255,255,0.05); border: 1px solid var(--tc-border-default); flex-shrink: 0; }
.tc-placement__rank--1 { background: linear-gradient(135deg, #FFD700, #B8860B); color: #1a1208; border-color: #FFD700; }
.tc-placement__rank--2 { background: linear-gradient(135deg, #C0C0C0, #808080); color: #1a1208; border-color: #C0C0C0; }
.tc-placement__rank--3 { background: linear-gradient(135deg, #CD7F32, #8B4513); color: #fff; border-color: #CD7F32; }
.tc-placement__label { font-size: 0.74rem; color: var(--tc-text-default); line-height: 1.25; }
.tc-placement__label small { display: block; font-size: 0.58rem; color: var(--tc-text-muted); text-transform: uppercase; letter-spacing: 0.04em; }

.tc-lastbattle { display: flex; align-items: center; gap: 12px; padding: 11px 14px; border-radius: var(--tc-radius-md, 8px); margin-top: 14px; background: linear-gradient(90deg, rgba(74,222,128,0.1), rgba(0,0,0,0.12)); border: 1px solid rgba(74,222,128,0.25); border-left: 3px solid var(--tc-success, #4ade80); }
.tc-lastbattle--loss { background: linear-gradient(90deg, rgba(248,113,113,0.1), rgba(0,0,0,0.12)); border-color: rgba(248,113,113,0.25); border-left-color: var(--tc-danger, #f87171); }
.tc-lastbattle--draw { background: linear-gradient(90deg, rgba(255,255,255,0.05), rgba(0,0,0,0.12)); border-color: var(--tc-border-default); border-left-color: var(--tc-text-muted); }
.tc-lastbattle__result { font-family: var(--tc-font-display, 'Cinzel', serif); font-weight: 700; font-size: 0.78rem; letter-spacing: 0.07em; color: var(--tc-success, #4ade80); flex-shrink: 0; }
.tc-lastbattle--loss .tc-lastbattle__result { color: var(--tc-danger, #f87171); }
.tc-lastbattle--draw .tc-lastbattle__result { color: var(--tc-text-default); }
.tc-lastbattle__info { flex: 1; min-width: 0; font-size: 0.78rem; color: var(--tc-text-default); display: flex; flex-direction: column; gap: 1px; }
.tc-lastbattle__date { font-size: 0.64rem; color: var(--tc-text-muted); }

@media (max-width: 820px) { .tc-report__grid { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .tc-placement { grid-template-columns: 1fr; } }