/* Weltraum 0.1.8: gemeinsame visuelle Sprache. Spielzustand und Rechte bleiben
   in den bisherigen Modulen; diese Datei verändert nur die Darstellung. */
html[data-design="weltraum"] {
  --panel:#100d19;
  --panel-2:#191322;
  --bg-2:#0b0912;
  --stroke:#68304970;
  --stroke-2:#c83e797d;
  --r:12px;
  --muted:#a69bb1;
  --pink:#ff1488;
  --welle-eigene:#ff328c;
  --welle-eigene-live:#ff8dc6;
}
html[data-design="weltraum"] body {
  background:#09070f;
  background-attachment:scroll;
}
html[data-design="weltraum"] body::before {
  background:radial-gradient(ellipse at 55% 0,#4c103126,transparent 60%),#09070f;
}
html[data-design="weltraum"] body::after {
  opacity:.8;
  background:url('/weltraum-kulisse.svg') center top / cover no-repeat;
}
html[data-design="weltraum"] :is(h1,h2,h3,h4) {
  letter-spacing:-.025em;
}
html[data-design="weltraum"] h2 {
  color:var(--text);
  text-transform:none;
}
html[data-design="weltraum"] :is(.panel,.term-fenster,.melde-karte,.studio-dialog,.pause-karte,.chat-fenster,.speicher-dialog) {
  background:linear-gradient(135deg,#181120ed,#0b0a13f2 75%);
  border:1px solid var(--stroke);
  border-radius:16px;
  box-shadow:0 14px 40px #0003,inset 0 1px #ffffff05;
}
html[data-design="weltraum"] :is(.bar,.term-leiste,.spieler-streifen) {
  background:#110d1ae8;
  border-color:var(--stroke);
}
html[data-design="weltraum"] .btn {
  border-radius:10px;
  transition:background-color .18s,border-color .18s,box-shadow .18s;
}
html[data-design="weltraum"] .btn:not(:disabled):hover {
  border-color:var(--pink);
  background-color:#381127;
  box-shadow:0 0 18px #fb188216;
}
html[data-design="weltraum"] .btn-primary {
  background:linear-gradient(110deg,#ff238e,#f60078);
  box-shadow:0 5px 22px #fa007822;
  color:#170410;
  border-color:#ff298e;
}
html[data-design="weltraum"] .btn-primary:not(:disabled):hover {
  background:linear-gradient(110deg,#ff4ba4,#ff1488);
  box-shadow:0 5px 28px #ff148839;
}
html[data-design="weltraum"] :is(input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea) {
  border-radius:9px;
  background-color:#0b0912;
  color:var(--text);
  border-color:#68546f70;
}
html[data-design="weltraum"] :is(input,select,textarea):focus-visible {
  outline:2px solid #ff379d;
  outline-offset:3px;
}
html[data-design="weltraum"] :is(input[type=range]) {
  accent-color:var(--pink);
}
html[data-design="weltraum"] :is(.toggle,.field) {
  line-height:1.6;
}
html[data-design="weltraum"] .view {
  border-radius:16px;
  background:linear-gradient(135deg,#141020e8,#0d0b16ed);
  box-shadow:none;
}
html[data-design="weltraum"] .view > header.bar:first-child {
  background:linear-gradient(100deg,#201026a0,#100d19);
}
html[data-design="weltraum"] .view > header.bar:first-child h2 {
  font-size:clamp(22px,2vw,32px);
}
html[data-design="weltraum"] .view > header.bar:first-child::before {
  box-shadow:none;
  background:none;
}
html[data-design="weltraum"] .view:not(#view-screening) > header.bar:first-child {
  padding-left:24px;
}
html[data-design="weltraum"] .bar-bottom {
  background:#100c1af5;
  border-color:var(--stroke);
  border-radius:12px;
}
html[data-design="weltraum"] :is(.hint,.hinweis,.profil-hinweis) {
  line-height:1.65;
}
html[data-design="weltraum"] :is(.klapp,.clip-frame,.wave-wrap,.score,.pack-detail,.platz-kasten) {
  border-radius:12px;
}
html[data-design="weltraum"] .klapp > summary {
  letter-spacing:.03em;
}
html[data-design="weltraum"] .klapp[open] > summary {
  background:#21112970;
}
html[data-design="weltraum"] .empty {
  padding:24px;
  border:1px dashed var(--stroke);
  border-radius:12px;
}
html[data-design="weltraum"] .ui-seitenmarke {
  display:flex;
  /* Abstand, Hoehe und Innenrand absichtlich dieselben Werte wie .home-nav:
     die Kopfleiste soll auf jeder Seite an genau derselben Stelle stehen,
     nicht nur ungefaehr. ACHTUNG: massgeblich sind die Weltraum-Werte weiter
     unten in dieser Datei, nicht die aus hauptmenue.css -- die werden hier
     ueberschrieben. */
  gap:clamp(16px,2vw,40px);
  align-items:center;
  min-height:68px;
  padding:10px clamp(20px,3.7vw,72px);
  border-bottom:1px solid var(--stroke);
  background:#08060ddb;
}
html[data-design="weltraum"] .ui-seitenmarke a {
  display:inline-flex;
  align-items:center;
  /* Werte wie .home-marke -- sonst ist das Logo hier breiter und das Menue
     dahinter faengt weiter rechts an als auf der Hauptseite. */
  gap:11px;
  text-decoration:none;
  color:var(--pink);
  font-size:19px;
  font-weight:800;
  white-space:nowrap;
}
html[data-design="weltraum"] .ui-seitenmarke img {
  width:32px;
  height:32px;
}
html[data-design="weltraum"] .ui-seitenmarke span {
  margin-left:20px;
  color:var(--muted);
  font-size:12px;
}
html[data-design="weltraum"] .ui-icon {
  width:24px;
  height:24px;
  flex:none;
  stroke:currentColor;
  fill:none;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
html[data-design="weltraum"] .ui-titel-icon {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:48px;
  height:48px;
  flex:none;
  color:var(--pink);
  border:1px solid #c8327560;
  border-radius:12px;
  background:linear-gradient(135deg,#65143450,#210f2540);
}
html[data-design="weltraum"] :is(.home-nav nav a,.home-nav nav button) {
  padding:10px 8px;
  font-size:12px;
}
html[data-design="weltraum"] .home-nav {
  gap:clamp(16px,2vw,40px);
}
html[data-design="weltraum"] .home-nav nav {
  gap:clamp(8px,1.5vw,26px);
  flex-wrap:wrap;
}
html[data-design="weltraum"] .home-nav nav a {
  text-decoration:none;
  color:var(--muted);
  border-bottom:2px solid transparent;
}
html[data-design="weltraum"] .home-nav nav a:hover {
  color:var(--pink);
  border-color:var(--pink);
}
html[data-design="weltraum"] #view-join.home {
  background:transparent;
}
html[data-design="weltraum"] .home-content {
  width:calc(100% - clamp(32px,16vw,280px));
  max-width:1800px;
}
html[data-design="weltraum"] .home-planet {
  opacity:.75;
}
html[data-design="weltraum"] .home-seitentitel h1 {
  font-size:clamp(28px,3vw,44px);
}
html[data-design="weltraum"] .home-raeume {
  grid-template-columns:minmax(280px,.7fr) minmax(0,1.3fr);
  align-items:start;
}
html[data-design="weltraum"] .home-panel {
  border-radius:14px;
  padding:26px;
  background:#100c17da;
}
html[data-design="weltraum"] .home .raum-liste {
  max-height:65dvh;
}
html[data-design="weltraum"] .home .raum {
  padding:18px;
  margin:10px 0;
  background:linear-gradient(120deg,#23112570,#0e0b15);
  border:1px solid var(--stroke);
  border-radius:12px;
}
html[data-design="weltraum"] .home[data-seite=freunde] .home-freunde {
  background:transparent;
  border:0;
  padding:0;
}
html[data-design="weltraum"] .home[data-seite=freunde] .freunde-kopf {
  padding:18px 22px;
  background:#140f1ddd;
  border:1px solid var(--stroke);
  border-radius:12px;
}
html[data-design="weltraum"] .home[data-seite=freunde] .start-freunde-liste {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(255px,1fr));
  gap:16px;
}
html[data-design="weltraum"] .home[data-seite=freunde] .freund-karte {
  padding:20px;
  gap:14px;
  border:1px solid var(--stroke);
  border-radius:12px;
  background:linear-gradient(120deg,#211227a0,#0d0a14ef);
  flex-wrap:wrap;
  align-content:start;
}
html[data-design="weltraum"] .home[data-seite=freunde] .freund-avatar .spieler-bild {
  width:58px!important;
  height:58px!important;
}
html[data-design="weltraum"] .home[data-seite=freunde] .profil-zeile-knoepfe {
  flex-basis:100%;
  padding-top:12px;
  border-top:1px solid #ffffff09;
}
html[data-design="weltraum"] .home[data-seite=freunde] .freund-info strong {
  font-size:15px;
}

/* Studio: beide Hauptbereiche gleichwertig, Platz für alle Verwaltungsoptionen. */
html[data-design="weltraum"] :is(#view-lobby,.studio-lobby) {
  padding:20px clamp(14px,2.3vw,42px) 36px;
  border:0;
  background:transparent;
}
html[data-design="weltraum"] :is(#view-lobby,.studio-lobby) > header.bar {
  margin:0 0 8px;
  padding:14px;
  border:1px solid var(--stroke);
  border-radius:12px;
}
html[data-design="weltraum"] #lobby-inhalt {
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:22px;
  align-items:start;
}
html[data-design="weltraum"] #lobby-inhalt .panel {
  padding:20px;
}
html[data-design="weltraum"] #lobby-inhalt h2 {
  font-size:21px;
  color:var(--text);
  text-transform:none;
  letter-spacing:0;
}
html[data-design="weltraum"] #lobby-pack-panel > h2 {
  margin:0 0 20px;
  padding-bottom:18px;
  border-bottom:1px solid var(--stroke);
}
html[data-design="weltraum"] :is(#lobby-players,#players) {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(135px,1fr));
  gap:12px;
}
html[data-design="weltraum"] :is(#lobby-players,#players) .studio-person {
  width:auto;
  min-width:0;
  min-height:235px;
  padding:22px 10px 16px;
  border-radius:13px;
}
html[data-design="weltraum"] .studio-avatar {
  width:90px;
  height:90px;
}
html[data-design="weltraum"] :is(#lobby-players,#players) .pname {
  background:#120d1cbd;
  font-size:14px;
}
html[data-design="weltraum"] :is(#lobby-players,#players) .studio-marken {
  margin-top:auto;
}
html[data-design="weltraum"] .studio-startzeile {
  margin-top:20px;
  padding:16px 0 0;
  gap:18px;
  border-top:1px solid var(--stroke);
}
html[data-design="weltraum"] .studio-startzeile .studio-einstellungen {
  border:0;
  margin:0;
  padding:0;
}
html[data-design="weltraum"] .studio-bereitschaft .btn {
  min-width:145px;
}
html[data-design="weltraum"] .pack-schnellfilter {
  gap:10px;
}
html[data-design="weltraum"] .pack-schnellfilter .toggle {
  padding:8px 10px;
  border:1px solid var(--stroke);
  border-radius:9px;
  background:#100a17;
  font-size:11px;
}
html[data-design="weltraum"] .pack-schnellfilter .toggle:has(:checked) {
  border-color:var(--pink);
  background:#f6087e16;
}
html[data-design="weltraum"] #pack-picker {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  max-height:72dvh;
  gap:12px;
}
html[data-design="weltraum"] #pack-picker .pack-gruppe {
  grid-column:1/-1;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
html[data-design="weltraum"] #pack-picker .pack-gruppe-titel {
  grid-column:1/-1;
}
html[data-design="weltraum"] #pack-picker .pack-reihe {
  border-radius:13px;
  background:#130d1bee;
  overflow:hidden;
  gap:0 6px;
  grid-template-rows:auto 52px auto;
}
html[data-design="weltraum"] #pack-picker .pack {
  display:flex;
  flex-direction:column;
  align-items:stretch;
  padding:0;
  width:100%;
  min-width:0;
  border-radius:12px 12px 0 0;
}
html[data-design="weltraum"] #pack-picker .pack-cover {
  width:100%;
  height:clamp(90px,9vw,156px);
  object-fit:cover;
  border-radius:0;
  margin:0;
  flex:none;
}
html[data-design="weltraum"] #pack-picker .pack-cover-leer {
  display:grid;
  place-items:center;
  color:#dc50c8;
  background:radial-gradient(ellipse at 70% 80%,#6a185d55,transparent),linear-gradient(130deg,#1b1b36,#211026);
  font-size:30px;
}
html[data-design="weltraum"] #pack-picker .pack-text {
  padding:12px 12px 14px;
  grid-template-rows:40px 32px 16px 72px;
  gap:5px;
}
html[data-design="weltraum"] #pack-picker .pack-name {
  font-size:14px;
  line-height:20px;
}
html[data-design="weltraum"] #pack-picker :is(.pack-meta,.pack-autor,.pack-sprachen) {
  font-size:12px;
  line-height:16px;
}
html[data-design="weltraum"] #pack-picker .pack-sprachen {
  padding-top:7px;
  border-top:1px solid var(--stroke);
}
html[data-design="weltraum"] #pack-picker .reinhoeren {
  margin-left:10px;
  padding:8px;
  font-size:11px;
}
html[data-design="weltraum"] #pack-picker .pack-bewerten {
  margin-right:10px;
  padding:8px 12px;
  height:40px;
}
html[data-design="weltraum"] #pack-picker .pack-sterne summary {
  min-height:60px;
  padding:12px;
}
html[data-design="weltraum"] #pack-picker .pack-reihe:has(.pack.chosen) {
  border-color:var(--pink);
  box-shadow:inset 0 0 0 1px var(--pink),0 0 16px #ff158522;
}
html[data-design="weltraum"] #pack-picker .pack.chosen {
  background:#ff178514;
}
html[data-design="weltraum"] .pack-detail {
  background:linear-gradient(120deg,#29132c66,#0b0a12);
  padding:20px;
}

/* Rollenwahl: bestehende Mehrfachwahl und gemeinsame Geräte beibehalten. */
html[data-design="weltraum"] .casting-layout {
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:22px;
}
html[data-design="weltraum"] .casting-spalte {
  padding:22px;
  border:1px solid var(--stroke);
  border-radius:14px;
  background:#100c18cc;
  min-width:0;
}
html[data-design="weltraum"] .casting-kopf {
  font-size:20px;
  padding-bottom:16px;
  border-bottom:1px solid var(--stroke);
}
html[data-design="weltraum"] .casting-boxes {
  display:grid;
  grid-template-columns:1fr;
  gap:9px;
}
html[data-design="weltraum"] .char-check {
  width:100%;
  border-radius:10px;
  padding:12px 14px;
  background:#171122;
}
html[data-design="weltraum"] .roster > div {
  border-radius:10px;
  padding:18px;
  background:#160f20;
}

/* Aufnahme und Vorführung behalten feste Medien-/Textflächen und alle Hilfen. */
html[data-design="weltraum"] #view-recording {
  background:#100d19ed;
}
html[data-design="weltraum"] .rec-layout {
  gap:20px;
}
html[data-design="weltraum"] .rec-seite {
  padding:16px;
  border:1px solid var(--stroke);
  border-radius:14px;
  background:#0e0b17d9;
}
html[data-design="weltraum"] .rec-seite > .btn {
  width:100%;
  text-align:left;
  padding:14px;
}
html[data-design="weltraum"] .rec-seite .meine-liste li {
  border:1px solid var(--stroke);
  border-radius:10px;
  margin-bottom:8px;
}
html[data-design="weltraum"] .wave-wrap {
  background:linear-gradient(120deg,#100c19,#0b0912);
  border:1px solid var(--stroke);
}
html[data-design="weltraum"] #rec-frame {
  background:#09070f;
}
html[data-design="weltraum"] :is(#btn-record,#record) {
  background:linear-gradient(135deg,#ff359a,#f30078);
  color:#fff;
  border-color:#ff49a3;
  border-radius:40px;
  box-shadow:0 0 0 4px #140b20,0 0 0 6px #ff1f8880,0 0 22px #ff008833;
}
html[data-design="weltraum"] .rec-warte-karten {
  background:radial-gradient(ellipse at 50% 60%,#8d145730,transparent 60%),#100c1b;
}
html[data-design="weltraum"] .rec-warte-karten h3 {
  font-size:clamp(21px,2.5vw,34px);
}
html[data-design="weltraum"] .warte-sprecher {
  gap:30px;
}
html[data-design="weltraum"] .warte-sprecher-karte {
  padding:22px;
  min-width:160px;
  border:1px solid #ffd23e70;
  border-radius:18px;
  background:#1e142780;
}
html[data-design="weltraum"] .warte-sprecher-karte > span:last-child {
  padding:8px 16px;
  background:#ffc83d16;
  color:var(--gold);
  border-radius:30px;
}
html[data-design="weltraum"] #screen-frame {
  border-radius:14px;
  background:#09070f;
}
html[data-design="weltraum"] #screen-mixer {
  padding:10px 12px;
  border-bottom:1px solid var(--stroke);
}
html[data-design="weltraum"] #screen-bedienfeld {
  background:linear-gradient(120deg,#1a1020fa,#0e0b17fa);
  border:1px solid var(--stroke);
  border-radius:14px 14px 0 0;
}
html[data-design="weltraum"] #screen-aktionen {
  gap:10px;
}
html[data-design="weltraum"] #screen-aktionen .btn {
  padding:12px 16px;
}
html[data-design="weltraum"] .screen-versatz {
  background:#23132a77;
  border:1px solid var(--stroke);
  padding:12px;
  border-radius:10px;
}
html[data-design="weltraum"] #view-voting {
  min-height:70dvh;
}
html[data-design="weltraum"] #vote-buttons {
  justify-content:center;
  gap:26px;
  padding:30px 0;
}
html[data-design="weltraum"] #vote-buttons .vote {
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:22px;
  width:230px;
  min-height:250px;
  background:linear-gradient(130deg,#29152e,#100c19);
  border:1px solid var(--stroke);
  font-size:20px;
}
html[data-design="weltraum"] #vote-buttons .vote::before {
  content:none;
}
html[data-design="weltraum"] #vote-buttons .vote.chosen {
  border-color:var(--pink);
  box-shadow:0 0 22px #fb208330;
}
html[data-design="weltraum"] #vote-status {
  text-align:center;
}
html[data-design="weltraum"] #results-list {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:16px;
}
html[data-design="weltraum"] #results-list li {
  padding:24px;
  border:1px solid var(--stroke);
  border-radius:14px;
  background:linear-gradient(120deg,#38241b77,#170f1f);
}
html[data-design="weltraum"] #ergebnis-film {
  width:100%;
  max-width:none;
  padding:22px;
  background:#100b18bd;
  border:1px solid var(--stroke);
  border-radius:14px;
}
html[data-design="weltraum"] #ergebnis-film > .rec-buttons {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:18px;
}
html[data-design="weltraum"] #ergebnis-film > .rec-buttons .btn {
  min-height:112px;
  padding:20px;
  font-size:15px;
  white-space:normal;
}

/* Profil: oben Aussehen, dann alle bisherigen Konto-, Erfolgs- und Freundesbereiche. */
html[data-design="weltraum"] .profil-karte {
  width:min(1160px,calc(100vw - 40px));
  max-width:1160px;
  padding:26px;
  gap:18px;
}
html[data-design="weltraum"] .profil-karte .profil-kopf {
  order:-5;
}
html[data-design="weltraum"] .profil-karte .profil-abschnitt:has(#profil-rahmen-liste) {
  order:-4;
  grid-column:auto;
}
html[data-design="weltraum"] .profil-karte .profil-kartenstile {
  order:-3;
  grid-column:auto;
}
html[data-design="weltraum"] .profil-karte .profil-abschnitt {
  padding:22px;
  background:#100c17b8;
}
html[data-design="weltraum"] .profil-abschnitt h4 {
  font-size:16px;
  color:var(--text);
  text-transform:none;
  letter-spacing:0;
}
html[data-design="weltraum"] .profil-karte .profil-rahmen-reihe {
  grid-template-columns:repeat(auto-fit,minmax(95px,1fr));
  gap:10px;
}
html[data-design="weltraum"] .profil-karte .profil-rahmen-wahl {
  min-height:106px;
  background:#1b122373;
}
html[data-design="weltraum"] .profil-karte .profil-rahmen-muster {
  width:42px;
  height:42px;
}
html[data-design="weltraum"] .profil-kartenstil-liste {
  grid-template-columns:repeat(auto-fit,minmax(110px,1fr));
  gap:10px;
  margin-top:12px;
}
html[data-design="weltraum"] .profil-kartenstil-wahl {
  padding:10px;
}
html[data-design="weltraum"] .kartenstil-vorschau {
  min-height:102px;
}
html[data-design="weltraum"] #profil-freunde-liste {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:12px;
}
html[data-design="weltraum"] #profil-freunde-liste .freund-karte {
  padding:16px;
  border:1px solid var(--stroke);
  border-radius:12px;
  flex-wrap:wrap;
}
html[data-design="weltraum"] .spieler-karte {
  width:min(880px,calc(100vw - 32px));
}
html[data-design="weltraum"] .abzeichen-raster {
  gap:12px;
}
html[data-design="weltraum"] .abzeichen {
  border-radius:12px;
}
html[data-design="weltraum"] .suche-karte {
  position:relative;
  width:min(1200px,calc(100vw - 40px));
  max-height:90dvh;
  padding:28px;
  display:grid;
  grid-template-columns:minmax(0,1.7fr) minmax(220px,.9fr);
  gap:16px 24px;
  overflow-y:auto;
}
html[data-design="weltraum"] .suche-kopf {
  grid-column:1/-1;
  padding-right:40px;
}
html[data-design="weltraum"] .suche-kopf h3 {
  font-size:clamp(25px,3vw,38px);
  color:var(--pink);
  margin:0 0 8px;
}
html[data-design="weltraum"] .suche-kopf .profil-schliessen {
  top:24px;
  right:24px;
}
html[data-design="weltraum"] #spieler-suche {
  grid-column:1/-1;
  padding:16px 20px;
  border-color:var(--pink);
}
html[data-design="weltraum"] #rangliste-reiter {
  grid-column:1/-1;
}
html[data-design="weltraum"] #spieler-liste {
  grid-column:1;
  grid-row:4;
  max-height:60dvh;
  border:1px solid var(--stroke);
  border-radius:12px;
  padding:10px;
  gap:3px;
  background:#100c17a8;
}
html[data-design="weltraum"] #rangliste-ich {
  grid-column:2;
  grid-row:4;
  align-self:start;
  padding:26px;
  border:1px solid var(--stroke);
  border-radius:12px;
  background:linear-gradient(120deg,#45142d44,#100c17);
  font-size:16px;
  line-height:2;
}
html[data-design="weltraum"] #rangliste-ich::before {
  content:'Deine Platzierung';
  display:block;
  color:var(--text);
  font-size:20px;
  font-weight:700;
  margin-bottom:12px;
}
html[data-design="weltraum"] .spieler-zeile {
  padding:10px;
  border-color:transparent;
  background:transparent;
  border-radius:9px;
}
html[data-design="weltraum"] .spieler-zeile:has(.platz-1) {
  border-color:#ffc83d8a;
  background:#ffc83d0d;
}
html[data-design="weltraum"] .spieler-zeile.ist-ich {
  border-color:var(--pink);
  background:#ff148814;
}
html[data-design="weltraum"] .spieler-liste .freund-info {
  min-width:0;
}

/* Einstellungen und Dialoge */
html[data-design="weltraum"] :is(.melde-huelle,.pause-schirm) {
  background:#030207c7;
}
html[data-design="weltraum"] dialog::backdrop {
  background:#030207c7;
}
html[data-design="weltraum"] .einstellungen-dialog {
  width:min(1160px,calc(100vw - 40px));
  height:min(780px,calc(100dvh - 40px));
  background:linear-gradient(125deg,#1b1024,#0d0b16 65%);
}
html[data-design="weltraum"] .einstellungen-kopf {
  padding:24px 30px;
  background:radial-gradient(ellipse at 100% 0,#bc216444,transparent 45%);
}
html[data-design="weltraum"] .einstellungen-kopf h2 {
  font-size:28px;
}
html[data-design="weltraum"] .einstellungen-layout {
  grid-template-columns:245px minmax(0,1fr);
}
html[data-design="weltraum"] .einstellungen-layout nav {
  padding:20px 14px;
  gap:10px;
}
html[data-design="weltraum"] .einstellungen-layout nav button {
  padding:17px 14px;
  display:flex;
  align-items:center;
  gap:14px;
}
html[data-design="weltraum"] .einstellungen-inhalt {
  padding:28px 34px;
}
html[data-design="weltraum"] .einstellungen-inhalt .regler {
  background:#1b12246e;
  border:1px solid var(--stroke);
  border-radius:12px;
  padding:18px;
}
html[data-design="weltraum"] .einstellungen-inhalt .toggle {
  border:1px solid var(--stroke);
  padding:14px;
  border-radius:10px;
  background:#150f1a;
}
html[data-design="weltraum"] .einstellungen-fuss {
  background:#0b0913;
}

/* Verwaltung und Nebenseiten nutzen dieselben Flächen ohne neue Kennzahlen. */
html[data-design="weltraum"] .admin-app {
  max-width:none;
  padding:0 24px 30px;
}
html[data-design="weltraum"] .admin-app > .admin-kopf {
  padding:18px 10px;
}
html[data-design="weltraum"] .admin-layout {
  grid-template-columns:225px minmax(0,1fr);
  gap:28px;
}
html[data-design="weltraum"] .admin-navigation {
  padding:14px 16px 30px 0;
  border-right:1px solid var(--stroke);
  min-height:70dvh;
}
html[data-design="weltraum"] .admin-navigation a {
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 12px;
}
html[data-design="weltraum"] .admin-arbeitsbereich {
  padding:8px 8px 0 0;
}
html[data-design="weltraum"] .admin-arbeitsbereich h2 {
  font-size:clamp(24px,2.5vw,34px);
}
html[data-design="weltraum"] .admin-statistik {
  gap:18px;
}
html[data-design="weltraum"] .admin-statistik a {
  padding:24px;
  min-height:150px;
  background:linear-gradient(130deg,#25142c88,#110c18);
}
html[data-design="weltraum"] .admin-statistik strong {
  font-size:40px;
}
html[data-design="weltraum"] .admin-statistik a:nth-child(2) strong {
  color:var(--green);
}
html[data-design="weltraum"] .admin-statistik a:nth-child(3) strong {
  color:var(--gold);
}
html[data-design="weltraum"] .admin-panel-block {
  padding:24px;
  margin:20px 0;
  border:1px solid var(--stroke);
  border-radius:14px;
  background:#140d1bd9;
}
html[data-design="weltraum"] .admin-panel-block:has(#wartung-umschalten) {
  background:radial-gradient(ellipse at 100% 100%,#bb176342,transparent 55%),#140d1bd9;
  border-color:#d726765e;
}
html[data-design="weltraum"] .admin-panel-block h3 {
  margin:0 0 8px;
  font-size:20px;
}
html[data-design="weltraum"] .admin-schnellzugriff .btn {
  padding:18px 24px;
}
html[data-design="weltraum"] body[data-ansicht=support] .admin-view {
  max-width:none;
  width:calc(100% - clamp(32px,13vw,240px));
  padding:32px 0 60px;
}
html[data-design="weltraum"] body[data-ansicht=support] .term-fenster {
  background:transparent;
  border:0;
  box-shadow:none;
}
html[data-design="weltraum"] body[data-ansicht=support] .term-leiste {
  display:none;
}
html[data-design="weltraum"] body[data-ansicht=support] .term-inhalt {
  padding:0;
}
html[data-design="weltraum"] body[data-ansicht=support] .admin-kopf {
  margin:0 0 26px;
  padding:0 0 20px;
  background:none;
}
html[data-design="weltraum"] body[data-ansicht=support] .admin-kopf h2 {
  font-size:36px;
}
html[data-design="weltraum"] body[data-ansicht=support] #admin-suche {
  max-width:700px;
  padding:16px;
}
html[data-design="weltraum"] body[data-ansicht=support] .filter-reihe {
  gap:12px;
  margin:18px 0;
}
html[data-design="weltraum"] body[data-ansicht=support] .filter-reihe .btn {
  padding:12px 20px;
}
html[data-design="weltraum"] #ticket-liste {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  align-items:start;
}
html[data-design="weltraum"] .ticket-karte {
  padding:22px;
  gap:12px;
  background:linear-gradient(130deg,#231126b8,#100d18);
  border-radius:14px;
  min-width:0;
  margin:0;
}
html[data-design="weltraum"] .ticket-karte:has([data-status=offen]) {
  border-left:3px solid var(--pink);
}
html[data-design="weltraum"] .ticket-karte:has([data-status=in_bearbeitung]) {
  border-left:3px solid var(--violet);
}
html[data-design="weltraum"] .ticket-karte:has([data-status=erledigt]) {
  border-left:3px solid var(--green);
}
html[data-design="weltraum"] .ticket-text {
  overflow-wrap:anywhere;
}
html[data-design="weltraum"] .ticket-formular textarea {
  min-width:0;
  width:100%;
  flex-basis:100%;
}
html[data-design="weltraum"] .debug-view {
  max-width:none;
  width:calc(100% - clamp(32px,10vw,200px));
  padding:30px 0;
}
html[data-design="weltraum"] .debug-view > .term-fenster {
  background:#110c18d9;
}
html[data-design="weltraum"] #pack-wahl-suche {
  width:100%;
  max-width:none!important;
  margin:12px 0 22px;
}
html[data-design="weltraum"] .pack-wahl-liste {
  max-width:none;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
html[data-design="weltraum"] .pack-wahl {
  padding:22px;
  min-height:84px;
  border:1px solid var(--stroke);
  border-radius:12px;
  background:linear-gradient(130deg,#25112a80,#110c18);
  gap:18px;
}
html[data-design="weltraum"] .pack-wahl strong {
  min-width:0;
  overflow-wrap:anywhere;
}
html[data-design="weltraum"] .pack-wahl::before {
  content:'▷';
  color:var(--pink);
  font-size:24px;
}
html[data-design="weltraum"] .pack-wahl:hover {
  border-color:var(--pink);
}
html[data-design="weltraum"] .debug-kopf {
  background:transparent;
}
html[data-design="weltraum"] .debug-kopf h2 {
  font-size:32px;
}
html[data-design="weltraum"] .debug-arbeit > div {
  min-width:0;
}
html[data-design="weltraum"] .zeile-reihe {
  border-color:var(--stroke);
  margin-bottom:6px;
  padding:10px;
}
html[data-design="weltraum"] .legal-wrap {
  background:#110c18dc;
  border:1px solid var(--stroke);
  border-radius:16px;
}
html[data-design="weltraum"] body[data-ansicht=unterstuetzer] .legal-wrap {
  max-width:1440px;
  width:calc(100% - clamp(32px,14vw,250px));
  margin:32px auto;
  padding:28px;
  background:transparent;
  border:0;
}
html[data-design="weltraum"] body[data-ansicht=unterstuetzer] h1 {
  font-size:clamp(30px,3.3vw,46px);
}
html[data-design="weltraum"] .unterstuetzer-grid {
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:18px;
  margin:32px 0;
}
html[data-design="weltraum"] .unterstuetzer-karte {
  border-radius:14px;
  padding:24px;
  gap:20px;
  min-height:116px;
  background:linear-gradient(110deg,#58123445,#120d1a);
}
html[data-design="weltraum"] .unterstuetzer-karte :is(img,.platzhalter) {
  width:64px;
  height:64px;
  border:2px solid #c9934055;
}
html[data-design="weltraum"] .unterstuetzer-karte span.name {
  font-size:18px;
}
html[data-design="weltraum"] .ui-danke {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  border-bottom:1px solid var(--stroke);
  padding-bottom:30px;
}
html[data-design="weltraum"] .ui-danke-herz {
  font-size:clamp(60px,9vw,150px);
  color:var(--pink);
  text-shadow:0 0 40px #fd0a8260;
  padding:0 40px;
}
html[data-design="weltraum"] .ui-danke-text {
  max-width:70ch;
  color:var(--muted);
}
html[data-design="weltraum"] .ui-danke-karten {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px;
  margin:32px 0;
}
html[data-design="weltraum"] .ui-danke-karten section {
  padding:24px;
  border:1px solid var(--stroke);
  border-radius:14px;
  background:#1a1120b3;
}
html[data-design="weltraum"] .ui-danke-karten h2 {
  font-size:18px;
}
html[data-design="weltraum"] .ui-danke-karten p {
  color:var(--muted);
  font-size:13px;
}

/* Eine kurze Überblendung für alle Wechsel; keine Eingabe wird verzögert. */
@keyframes kosmos-ein {
  from {
    opacity:0;
    transform:translateY(8px) scale(.99);
  }
  to {
    opacity:1;
    transform:none;
  }
}
html[data-design="weltraum"] :is(.melde-huelle:not([hidden]) > .melde-karte,dialog[open],.pause-schirm:not([hidden]) > .pause-karte,[data-einst-panel]:not([hidden]),[data-admin-bereich]:not([hidden]),#arbeits-bereich:not([hidden])) {
  animation:kosmos-ein .24s cubic-bezier(.2,.8,.2,1);
}
html[data-design="weltraum"]::view-transition-old(root) {
  animation:vt-alt .18s ease-out forwards;
}
html[data-design="weltraum"]::view-transition-new(root) {
  animation:kosmos-ein .28s cubic-bezier(.2,.8,.2,1);
}
html[data-design="weltraum"]::view-transition-group(*) {
  animation-duration:.32s;
}
html[data-design="weltraum"] .view {
  animation-duration:.28s;
}
@media (min-width:1600px) {
  html[data-design="weltraum"] #pack-picker, html[data-design="weltraum"] #pack-picker .pack-gruppe {
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}
@media (max-width:1100px) {
  html[data-design="weltraum"] .home-content {
    width:calc(100% - 36px);
  }
  html[data-design="weltraum"] #lobby-inhalt {
    grid-template-columns:1fr;
  }
  html[data-design="weltraum"] .casting-layout {
    grid-template-columns:1fr;
  }
  html[data-design="weltraum"] #pack-picker, html[data-design="weltraum"] #pack-picker .pack-gruppe {
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  html[data-design="weltraum"] .suche-karte {
    grid-template-columns:1fr;
  }
  html[data-design="weltraum"] #spieler-liste {
    grid-column:1;
    grid-row:auto;
  }
  html[data-design="weltraum"] #rangliste-ich {
    grid-column:1;
    grid-row:4;
    padding:16px;
  }
  html[data-design="weltraum"] .einstellungen-layout {
    grid-template-columns:200px minmax(0,1fr);
  }
}
@media (max-width:850px) {
  html[data-design="weltraum"] .home-raeume {
    grid-template-columns:1fr;
  }
  html[data-design="weltraum"] #ticket-liste {
    grid-template-columns:1fr;
  }
  html[data-design="weltraum"] .admin-layout {
    grid-template-columns:1fr;
  }
  html[data-design="weltraum"] .admin-navigation {
    display:flex;
    min-height:0;
    border:0;
    padding:0;
  }
  html[data-design="weltraum"] .admin-navigation a {
    padding:10px;
  }
  html[data-design="weltraum"] .admin-navigation .ui-icon {
    width:18px;
    height:18px;
  }
  html[data-design="weltraum"] .ui-danke-karten {
    grid-template-columns:1fr;
  }
  html[data-design="weltraum"] .ui-danke-herz {
    padding:0;
  }
  html[data-design="weltraum"] .profil-karte .profil-abschnitt:has(#profil-rahmen-liste), html[data-design="weltraum"] .profil-karte .profil-kartenstile {
    grid-column:1/-1;
  }
  html[data-design="weltraum"] .pack-wahl-liste {
    grid-template-columns:1fr;
  }
}
@media (max-width:640px) {
  html[data-design="weltraum"] #pack-picker, html[data-design="weltraum"] #pack-picker .pack-gruppe {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  html[data-design="weltraum"] #pack-picker .pack-text {
    padding:10px;
    grid-template-rows:40px 48px 16px 88px;
  }
  html[data-design="weltraum"] #pack-picker .pack-cover {
    height:110px;
  }
  html[data-design="weltraum"] #pack-picker .pack-reihe {
    gap:0;
  }
  html[data-design="weltraum"] #pack-picker .reinhoeren {
    padding:6px;
    margin-left:6px;
    font-size:9px;
  }
  html[data-design="weltraum"] #pack-picker .pack-bewerten {
    padding:6px 9px;
    margin-right:6px;
  }
  html[data-design="weltraum"] .profil-karte {
    padding:16px;
    width:calc(100vw - 24px);
  }
  html[data-design="weltraum"] .profil-karte .profil-abschnitt {
    padding:16px;
  }
  html[data-design="weltraum"] .suche-karte {
    width:calc(100vw - 20px);
    padding:18px;
  }
  html[data-design="weltraum"] .einstellungen-dialog {
    width:calc(100vw - 20px);
    height:calc(100dvh - 20px);
  }
  html[data-design="weltraum"] .einstellungen-layout {
    grid-template-columns:1fr;
  }
  html[data-design="weltraum"] .einstellungen-layout nav {
    flex-direction:row;
    padding:8px;
    gap:4px;
    border-bottom:1px solid var(--stroke);
  }
  html[data-design="weltraum"] .einstellungen-layout nav button {
    flex:none;
    padding:10px;
    font-size:12px;
  }
  html[data-design="weltraum"] .einstellungen-layout nav .ui-icon {
    display:none;
  }
  html[data-design="weltraum"] .einstellungen-inhalt {
    padding:18px;
  }
  html[data-design="weltraum"] .einstellungen-kopf {
    padding:18px;
  }
  html[data-design="weltraum"] .einstellungen-kopf h2 {
    font-size:22px;
  }
  html[data-design="weltraum"] .casting-spalte {
    padding:14px;
  }
  html[data-design="weltraum"] #vote-buttons .vote {
    width:160px;
    min-height:180px;
    font-size:16px;
  }
  html[data-design="weltraum"] .ui-seitenmarke span {
    display:none;
  }
  html[data-design="weltraum"] .admin-app {
    padding:0 12px 24px;
  }
  html[data-design="weltraum"] .ui-danke {
    display:block;
  }
  html[data-design="weltraum"] .ui-danke-herz {
    display:none;
  }
}
@media (max-width:440px) {
  html[data-design="weltraum"] #pack-picker, html[data-design="weltraum"] #pack-picker .pack-gruppe {
    grid-template-columns:1fr;
  }
  html[data-design="weltraum"] #pack-picker .pack-text {
    grid-template-rows:40px 32px 16px 64px;
  }
  html[data-design="weltraum"] #pack-picker .pack-cover {
    height:140px;
  }
  html[data-design="weltraum"] .home[data-seite=freunde] .start-freunde-liste {
    grid-template-columns:1fr;
  }
}
html[data-design="weltraum"].mobil-sparsam body::after {
  position:absolute;
  height:100dvh;
  opacity:.35;
}
html[data-design="weltraum"].mobil-sparsam :is(.home-planet,.home-universum) {
  opacity:.35;
}
html[data-design="weltraum"].mobil-sparsam :is(.view,.melde-karte,dialog,[data-einst-panel],[data-admin-bereich]) {
  animation:none!important;
}
@media (prefers-reduced-motion:reduce) {
  html[data-design="weltraum"] *, html[data-design="weltraum"] *::before, html[data-design="weltraum"] *::after {
    animation:none!important;
    transition:none!important;
  }
  html[data-design="weltraum"]::view-transition-group(*), html[data-design="weltraum"]::view-transition-old(*), html[data-design="weltraum"]::view-transition-new(*) {
    animation:none!important;
  }
}
html[data-design="weltraum"] .ui-nur-weltraum {
  display:block;
}
html[data-design="weltraum"] .ui-danke-bild {
  width:clamp(170px,24vw,330px);
  height:auto;
  flex:none;
}
html[data-design="weltraum"] .ui-danke-karten {
  display:grid;
}
html[data-design="weltraum"] #unterstuetzen-popup-huelle .melde-karte {
  width:min(980px,calc(100vw - 32px));
  padding:clamp(22px,4vw,44px);
  text-align:center;
}
html[data-design="weltraum"] .ui-spenden-herz {
  color:var(--pink);
  font-size:66px;
  line-height:1.3;
  text-shadow:0 0 26px #ff148866;
}
html[data-design="weltraum"] #unterstuetzen-popup-huelle h3 {
  font-size:clamp(24px,3vw,36px);
  margin:12px 0;
}
html[data-design="weltraum"] #unterstuetzen-popup-huelle .unterstuetzen-knoepfe {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:20px;
  margin:22px 0;
}
html[data-design="weltraum"] .ui-spenden-karte {
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:12px;
  padding:26px;
  border:1px solid var(--stroke);
  border-radius:18px;
  background:#1b10207d;
  text-align:left;
}
html[data-design="weltraum"] .ui-spenden-karte h4 {
  font-size:20px;
  margin:0;
}
html[data-design="weltraum"] .ui-spenden-karte p {
  font-size:12px;
  color:var(--muted);
}
html[data-design="weltraum"] .ui-spenden-karte .btn {
  margin-top:auto;
  padding:16px;
  text-align:center;
  white-space:normal;
}
html[data-design="weltraum"] .ui-spenden-monat {
  border-color:var(--pink);
  background:linear-gradient(135deg,#6a113a25,#170e20);
}
html[data-design="weltraum"] .ui-preis {
  font-size:32px;
  color:var(--gold);
  margin:12px 0 24px;
}
html[data-design="weltraum"] .ui-preis s, html[data-design="weltraum"] .ui-preis small {
  font-size:18px;
  color:var(--muted);
}
html[data-design="weltraum"] #btn-popup-spaeter {
  width:100%;
  padding:16px;
}
@media (max-width:640px) {
  html[data-design="weltraum"] #unterstuetzen-popup-huelle .unterstuetzen-knoepfe {
    grid-template-columns:1fr;
  }
  html[data-design="weltraum"] .ui-spenden-karte {
    padding:18px;
  }
  html[data-design="weltraum"] .ui-danke-bild {
    display:none;
  }
}
html[data-design="weltraum"] .profil-karte .profil-abschnitt:has(#profil-rahmen-liste), html[data-design="weltraum"] .profil-karte .profil-kartenstile {
  grid-column:1/-1;
}
html[data-design="weltraum"] .profil-karte .profil-kartenstil-liste {
  grid-template-columns:repeat(5,minmax(0,1fr));
}
@media (max-width:640px) {
  html[data-design="weltraum"] .profil-karte {
    grid-template-columns:minmax(0,1fr);
  }
  html[data-design="weltraum"] .profil-karte .profil-kopf {
    grid-template-columns:84px minmax(0,1fr);
    gap:14px;
    padding-left:0;
  }
  html[data-design="weltraum"] .profil-karte .profil-bild-rahmen {
    width:84px;
    height:84px;
  }
  html[data-design="weltraum"] .profil-karte .profil-kartenstil-liste {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  html[data-design="weltraum"] #profil-freunde-liste {
    grid-template-columns:minmax(0,1fr);
  }
  html[data-design="weltraum"] .admin-statistik {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }
  html[data-design="weltraum"] .admin-statistik a {
    min-width:0;
    padding:16px;
  }
  html[data-design="weltraum"] .admin-app > .admin-kopf {
    flex-direction:column;
    align-items:flex-start;
  }
}

/* Lange Dialoge bleiben auch im Hochformat vollständig erreichbar. */
html[data-design="weltraum"] #unterstuetzen-popup-huelle .melde-karte {
  max-height:calc(100dvh - 32px);
  overflow-y:auto;
  flex-shrink:0;
}
html[data-design="weltraum"] #unterstuetzen-popup-huelle .melde-karte > * {
  flex-shrink:0;
}
html[data-design="weltraum"] .ui-danke > div {
  min-width:0;
}
html[data-design="weltraum"] body[data-ansicht=unterstuetzer] h1 {
  overflow-wrap:anywhere;
}
@media (max-width:640px) {
  html[data-design="weltraum"] body[data-ansicht=unterstuetzer] .legal-wrap {
    width:100%;
    padding:20px;
    margin:12px auto;
  }
  html[data-design="weltraum"] .unterstuetzer-grid {
    grid-template-columns:minmax(0,1fr);
  }
  html[data-design="weltraum"] .unterstuetzer-karte {
    min-width:0;
    padding:18px;
  }
}
html[data-design="weltraum"] :is(#btn-record,#record).recording {
  background:linear-gradient(135deg,#ed315d,#bb123d);
  border-color:#ff7191;
}

/* Kleine Querformate geben dem Film Platz; Regler und Untertitel bleiben bedienbar. */
@media (max-height:500px) {
  html[data-design="weltraum"] #view-screening > header.bar:first-child h2 {
    font-size:18px;
  }
  html[data-design="weltraum"] #view-screening > header.bar {
    padding-top:4px;
    padding-bottom:4px;
  }
  html[data-design="weltraum"] #screen-mixer {
    padding:2px 8px;
    gap:6px 14px;
  }
}
html[data-design="weltraum"] .legal-wrap:has(.legal-footer .speicher-link) > .speicher-link {
  display:none;
}
html[data-design="weltraum"] .ui-spenden-karte .btn {
  font-size:15px;
  min-height:54px;
}
html[data-design="weltraum"] .ui-spenden-karte:not(.ui-spenden-monat) .btn-primary {
  background:#1d1022;
  color:var(--text);
  box-shadow:none;
  border-color:var(--stroke-2);
}
html[data-design="weltraum"] .ui-spenden-monat .btn {
  background:linear-gradient(110deg,#ff238e,#f60078);
  color:#170410;
  border-color:#ff298e;
  box-shadow:0 5px 22px #fa007822;
}
html[data-design="weltraum"] .ui-spenden-monat .btn .preis-angebot {
  color:inherit;
}
