/* Routenkino — gemeinsames Stylesheet
   Änderungen hier wirken sich automatisch auf alle Seiten aus
   (index.php, ergebnisse.php, upload.php). Seitentypisches (z. B. die
   Filmstreifen-Liste oder die Formulare der Verwaltung) steht weiterhin
   im jeweiligen <style>-Block der einzelnen Datei. */

:root{
  --bg:#0b0a09; --panel:#141210; --panel-2:#1c1916; --edge:#2c2722;
  --text:#ece5d8; --text-dim:#a89c8a; --amber:#e8a33d; --amber-dim:#8a6626;
  --red:#8b3a2e; --green:#5f8a5a;
  --serif: Georgia, 'Iowan Old Style', 'Palatino Linotype', Palatino, serif;
  --mono: ui-monospace, 'SF Mono', 'Cascadia Code', 'Courier New', monospace;
  --sans: -apple-system, 'Segoe UI', system-ui, sans-serif;
}

*{ box-sizing:border-box; }

html,body{ margin:0; padding:0; background:var(--bg); color:var(--text); font-family:var(--sans); min-height:100vh; }

.stage{ max-width:1040px; margin:0 auto; padding:36px 20px 80px; }

/* Kopfzeile mit Titel */
header{ display:flex; align-items:baseline; justify-content:space-between; gap:16px;
  border-bottom:1px solid var(--edge); padding-bottom:18px; margin-bottom:28px; flex-wrap:wrap; }
header h1{ font-family:var(--serif); font-weight:400; font-size:clamp(24px,4vw,34px); letter-spacing:0.5px; margin:0; }
header h1 a{ color:inherit; text-decoration:none; }
header h1 em{ font-style:normal; color:var(--amber); }
header .sub{ font-family:var(--mono); font-size:12px; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-dim); }
header a{ color:var(--text-dim); font-family:var(--mono); font-size:12px; text-decoration:none;
  letter-spacing:0.06em; text-transform:uppercase; border:1px solid var(--edge); padding:6px 10px; border-radius:3px; }
header a:hover{ color:var(--amber); border-color:var(--amber-dim); }

/* Logo-Leiste — hier die Größe für ALLE Seiten auf einmal ändern */
.brandbar{ display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:22px 28px; padding-top:18px; margin-bottom:22px; }
.logo-slot{ height:40px; display:flex; align-items:center; }
.logo-slot img{ max-height:40px; max-width:140px; width:auto; height:auto; object-fit:contain; display:block; }

/* Navigation zwischen den Seiten */
nav{ display:flex; gap:18px; margin:0 0 28px; font-family:var(--mono); font-size:12px;
  letter-spacing:0.08em; text-transform:uppercase; }
nav a{ color:var(--text-dim); text-decoration:none; padding-bottom:4px; border-bottom:2px solid transparent; }
nav a:hover{ color:var(--text); }
nav a.active{ color:var(--amber); border-color:var(--amber); }

/* Leerzustand-Hinweise ("noch nichts hochgeladen") */
.empty-state{ padding:60px 20px; text-align:center; color:var(--text-dim); font-family:var(--serif);
  font-size:16px; line-height:1.7; }
.empty-state code{ font-family:var(--mono); background:var(--panel); border:1px solid var(--edge);
  padding:2px 6px; border-radius:3px; color:var(--amber); font-size:13px; }
.empty-state a{ color:var(--amber); }

/* Fußzeile */
footer{ margin-top:50px; padding-top:16px; border-top:1px solid var(--edge); font-family:var(--mono);
  font-size:11px; color:var(--text-dim); letter-spacing:0.04em; display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; }
footer a{ color:var(--text-dim); }
footer a:hover{ color:var(--amber); }