/* ═══════════════════════════════════════════════════════════════════════
   AUFENTHALTSRAUM — Zusatz-Schicht für legal-smati-master.html
   Korabs Entwurf 18.08.2026. Baut NICHTS um: im Ruhezustand ist diese
   Datei wirkungslos. Erst body.raum-* schaltet die Bewegung frei.
   Rückbau = die zwei Zeilen vor </body> entfernen.
   ═══════════════════════════════════════════════════════════════════════ */

/* ---------- 1. Das Rad wandert nach links und dreht weiter ---------- */
/* Das Rad ist SVG mit viewBox — Größe ändern skaliert den Inhalt uniform.
   Keine Kachel wird neu berechnet, das Patent bleibt unberührt. */
#rad-stage {
  transition: left .75s cubic-bezier(.4,0,.2,1),
              width .75s cubic-bezier(.4,0,.2,1),
              height .75s cubic-bezier(.4,0,.2,1),
              opacity .45s ease;
}
/* Korab 18.08.: "erscheint das app rad ohne den hintergrund ... auf der linken
   seite, das nur etwas weiter runter wie es jetzt steht, am ende der weltkarte,
   so dass die weltkarte nicht verdeckt wird".
   Die Weltkarte sitzt bei left 7,5vw / top 28vh, 27,7vw breit, 27vh hoch — sie
   endet also bei 55vh. Das Rad setzt sich darunter ab, auf derselben senkrechten
   Achse (7,5 + 27,7/2 = 21,35vw), von unten her verankert. */
/* Korab 19.08.: "wenn der kreis der apps eine app-auswahl ist und die
   kreissteuerung zur seite unten links in derselben groesse verschiebt". */
body.raum-arbeit #rad-stage,
body.raum-cowork #rad-stage {
  left: 25vw !important;
  top: auto !important;
  bottom: 104px !important;
  transform: translateX(-50%) !important;
  width:  min(560px, 42vw, calc(74vh - 90px)) !important;
  height: min(560px, 42vw, calc(74vh - 90px)) !important;
}
/* Die Karte bleibt jetzt unangetastet — das Rad liegt darunter, nicht darauf. */
/* "ohne den Hintergrund": Felgenmantel, Mittel-Glow und Pfeilspitze treten
   zurueck — nur die Programme auf ihrer Kreisbahn bleiben stehen. */
body.raum-arbeit #rad-svg .rad-mantel,
body.raum-arbeit #rad-svg .dms-bg-glow,
body.raum-arbeit #rad-svg .rad-top-pointer { opacity: 0 !important; transition: opacity .5s ease; }
body.raum-arbeit .center-label { opacity: 0 !important; }
/* Titel über dem Rad wandert mit — er ist an die Rad-Geometrie gekoppelt */
.breadcrumb { transition: left .75s cubic-bezier(.4,0,.2,1), top .75s cubic-bezier(.4,0,.2,1); }
body.raum-arbeit .breadcrumb {
  left: 25vw !important;
  top: auto !important;
  bottom: calc(104px + min(560px, 42vw, calc(74vh - 90px)) + 16px) !important;
}
/* Rotation drosseln, solange eine App läuft (sonst frisst sie Bildrate) */
body.raum-arbeit.rad-mechanical-on[data-rad-idx="0"] #cases-group { animation-duration: 420s !important; }

/* ---------- 2. Das Rad tritt zurück, wenn Cowork kommt ---------- */
/* !important, weil der Master das Rad an mehreren Stellen mit !important sichtbar haelt */
body.raum-cowork #rad-stage,
body.raum-cowork .breadcrumb,
body.raum-vollbild #rad-stage,
body.raum-vollbild .breadcrumb { opacity: 0 !important; pointer-events: none !important; }

/* Fokus-Akte weicht der App-Fläche */
#answer-panel { transition: opacity .4s ease; }
body.raum-arbeit #answer-panel,
body.raum-cowork #answer-panel,
body.raum-vollbild #answer-panel { opacity: 0 !important; pointer-events: none !important; }
/* Weltkarte gehört dem Ruhezustand */
body.raum-arbeit .worldmap,
body.raum-cowork .worldmap { opacity: 0 !important; transition: opacity .4s ease; }

/* ---------- 3. Die Bühne: App auf der Fläche, die dem Rad gehörte ---------- */
/* Korab 18.08.: "soll dieses dashboard das fenster ersetzen, das du ueber dem
   legal dashboard unschoen vorsteht". Kein aufgesetztes Fenster mehr, das an den
   Rand stoesst — ein eingefasster Bereich MIT Abstand und Rand auf allen vier
   Seiten. Er nimmt die rechte Haelfte samt dem Platz, wo die Fall-Uebersicht
   stand. Schatten nach unten statt seitlich: liegt IM Dashboard, nicht darauf. */
#raum-buehne {
  position: fixed;
  top: 74px; right: 20px; bottom: 20px; left: 50%;
  z-index: 9600;
  display: none;
  /* Korab 22.08.2026: "die Raender sollen transparent und in den Hintergrund des
     Dashboards eingebettet sein" — hoechste Ebene der Einigkeit. Vorher lagen ZWEI
     Flaechen uebereinander: diese Platte (eigener Grund + 12px Polster + Schatten)
     und darin die App mit eigenem Grund. Das Polster war der sichtbare Ring dazwischen.
     Jetzt traegt die Buehne keine eigene Flaeche mehr — sie ist nur noch der Ort. */
  background: transparent;
  border: 0;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: none;
  padding: 0;
}
/* Korab 02.09.2026: "richte auch cowork das es ueber die gesamte webseite sprich
   auch ueber die rechte seite erscheint also so das man darin gut arbeiten kann".
   Befund davor: im Cowork-Zustand lief KEINE App auf der Buehne. Die rechte
   Haelfte war ein leerer Kasten und hat Cowork die halbe Arbeitsflaeche
   weggenommen. Der Cowork-Zustand traegt die Sichtbar-Regel daher nicht mehr;
   die danach folgende Einrueck-Zeile fuer diesen Zustand ist dadurch tot und
   faellt mit weg. Arbeit und Vollbild bleiben unveraendert. */
body.raum-arbeit #raum-buehne,
body.raum-vollbild #raum-buehne { display: block; }
body.raum-vollbild #raum-buehne {
  top: 0; bottom: 0; left: 0; z-index: 9700;
  border: 0; border-radius: 0;
}
/* Der Rahmen traegt die Flaeche, das Fenster fuellt ihn. !important, weil der
   Master eigene iframe-Regeln mitbringt (Browser-Panel) und sonst die Hoehe frisst. */
#raum-rahmen {
  position: absolute !important;
  top: 34px !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
}
/* Korab 18.08.: "es gibt immer noch ein fenster ... hierdrin muessen die apps
   erscheinen, nicht oberhalb der app".
   Der Fensterkopf mit Titel, Minus und Pfeil ist weg. Die App fuellt den
   Bereich vollstaendig — kein aufgesetztes Fenster mehr, nur der Bereich und
   was darin laeuft. Die Funktionen des Kopfes gibt es weiterhin, nur an ihrem
   natuerlichen Ort: welche App offen ist steht im Tab unten rechts, weglegen
   ist das Kreuz am Tab, zurueck fuehrt die Mitte des Rades. */
.raum-kopf { display: none !important; }
#raum-rahmen { top: 0 !important; }
.raum-hinweis { top: 0 !important; }
#raum-foto { top: 0 !important; height: 100% !important; }

#raum-rahmen, .raum-hinweis, #raum-foto {
  border-radius: 10px; overflow: hidden;
  top: 12px !important; left: 12px !important; right: 12px !important; bottom: 12px !important;
  height: auto !important; width: auto !important;
}
/* Korab 02.09.2026: "das fenster ich nicht mehr eingebettet". Ursache gemessen:
   rad-mode.js:62-74 faengt JEDES section>div ein - #raum-buehne ist eine <section>
   (raum.js:79), #raum-rahmen das <div> darin (raum.js:87). Der Rahmen bekam so
   Kartengrund, Rand, Radius und Weichzeichner, allein wegen seiner Form.
   rad-mode.js ist fremdes Revier; die ID (1,0,0) schlaegt den dortigen Selektor
   (0,1,2) bei gleichem !important - keine Aenderung dort noetig.
   BEWUSST OHNE weichen Kanten-Auslauf: ein solcher Verlauf hat am 02.09. 11,4%
   der Breite und 10% der Hoehe des FREMDEN App-Inhalts verschluckt, samt dessen
   eigener Knoepfe und Abzeichen am Rand. Vorbild ist die gepunktete Weltkarte
   .rad-mindmap-bg: schlicht randlos. Die Kante verschwindet, weil keine Karte da
   ist - nicht weil Inhalt aufgeloest wird. Deckkraft bleibt unangetastet. */
#raum-rahmen {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
/* sonst bliebe unter dem randlosen Rahmen eine harte Ecke sichtbar */
#raum-buehne iframe { border-radius: 0 !important; }
#raum-buehne iframe {
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
  width: 100% !important; height: 100% !important;
  min-height: 0 !important; max-height: none !important;
  border: 0 !important; background: transparent; border-radius: 14px; display: none;
}
#raum-buehne iframe.raum-an { display: block !important; }

.raum-kopf {
  position: absolute; top: 0; left: 0; right: 0; height: 34px; z-index: 3;
  display: flex; align-items: center; gap: 8px; padding: 0 10px;
  font-size: 11.5px; letter-spacing: .4px; color: #8a95b2;
  background: transparent; border-bottom: 0;   /* Korab 22.08.: keine Kante mehr */
}
.raum-kopf .raum-titel { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.raum-kopf button {
  background: none; border: 0; color: #8a95b2; cursor: pointer;
  font-size: 15px; line-height: 1; padding: 3px 8px; border-radius: 5px;
}
.raum-kopf button:hover { color: #38d1ff; background: rgba(56,209,255,.12); }

/* Der Raum sagt die Wahrheit, wenn ein Fenster nicht aufgeht */
.raum-hinweis {
  position: absolute; top: 34px; left: 0; right: 0; bottom: 0; z-index: 2;
  display: none; flex-direction: column; align-items: center; justify-content: center;
  gap: 13px; padding: 32px; text-align: center; background: #0c1230;
}
.raum-hinweis.raum-an { display: flex; }
.raum-hinweis h3 { font-size: 14.5px; font-weight: 600; color: #e6ecf5; margin: 0; }
.raum-hinweis p  { font-size: 12.5px; line-height: 1.62; color: #8a95b2; max-width: 420px; margin: 0; }
.raum-hinweis a {
  color: #38d1ff; text-decoration: none; border: 1px solid #38d1ff;
  padding: 7px 14px; border-radius: 8px; font-size: 12px;
}
.raum-hinweis a:hover { background: rgba(56,209,255,.12); }

/* ---------- 4. Cowork links — der Raum zwingt es aus dem Vollbild ---------- */
/* 19.08., Korabs Fund: "cowork hat noch das alte cowork fenster, das im
   vordergrund gestanden ist".
   Er hat recht — hier standen die alten Fenster-Werte: left 0 (klebt am
   Bildschirmrand), Radius nur rechts, harter Schatten SEITLICH 18px.
   Ich hatte die Panel-Werte nur auf die App-Flaeche angewandt und Cowork
   vergessen. Eine Verbesserung an einer von zwei Flaechen ist keine.
   Jetzt traegt Cowork dieselben Werte wie die App-Flaeche: eingerueckt,
   35% deckend, randlos, Radius rundum, weicher Schatten. */
body.raum-cowork #cowork-overlay.visible,
body.raum-cowork liri-cowork {
  position: fixed !important;
  top: 74px !important; left: 20px !important;
  /* 02.09.2026: hier stand die halbe Seite (50 Prozent minus 30 Pixel). Jetzt die
     volle Flaeche, rechts derselbe Abstand wie links (20px). DERSELBE Wert steht
     in raum.js/coworkPlatzieren als inline-!important und schlaegt jede Regel
     aus diesem Stylesheet - beide muessen zusammen wandern, sonst bleibt die
     Aenderung unsichtbar. */
  width: calc(100% - 40px) !important; right: auto !important; bottom: 20px !important;
  background: rgba(15,22,50,.35) !important;
  border: 0 !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  box-shadow: 0 4px 32px rgba(0,0,0,.2) !important;
  z-index: 9600 !important;
}

/* ---------- 5. Tab-Leiste: minimieren statt schließen ---------- */
/* 18.08.: Die Reiter lagen ueber dem App-Inhalt und verdeckten ihn — selbst
   gemessen, nicht gemeldet bekommen. Sie sitzen jetzt UNTER der Flaeche, im
   Streifen zwischen ihr und der Eingabezeile. */
#raum-tabs {
  /* 19.08.: Sie lagen ueber dem App-Inhalt. Jetzt sitzen sie INNEN am unteren
     Rand der Flaeche — als deren Streifen, nicht als Fremdkoerper darauf. */
  position: absolute; right: 12px; bottom: 10px; z-index: 3;
  display: flex; gap: 7px; max-width: 42vw; overflow-x: auto; padding: 2px;
}
#raum-tabs:empty { display: none; }
/* ---------- Die Reiter ueberleben den Einstieg SICHTBAR (03.09.2026) ----------
   Befund am Bildschirmfoto, nicht am Quelltext: Seit der Einstieg nicht mehr
   verdeckt startet, lagen die 9 wiederhergestellten Reiter zwar im Dokument
   (querySelectorAll zaehlte 9), aber INNERHALB von #raum-buehne — und die ist
   auf der Hauptseite display:none. Fuer den Menschen waren sie damit weg:
   Puppeteer traf sie nur per DOM-Klick, mit der Maus nicht. "Die Reiter
   bleiben erhalten" waere eine Behauptung ohne Deckung gewesen.
   Loesung ohne zweite Leiste: raum.js haengt dieselbe Leiste um — in die
   Buehne, solange eine App laeuft, sonst an den Seitenrand. Ein Ort, ein
   Element, zwei Plaetze. Die Buehne bleibt auf der Hauptseite display:none
   und faengt damit keinen einzigen Klick der Hauptseite ab. */
body > #raum-tabs {
  /* bottom 66, nicht 20: darunter sitzt der Browser-Knopf. Gemessen
     03.09.2026 mit bottom:20 — die Leiste lag bei 1587 px auf
     #browser-corner-btn (Leiste x 900..1567 / Knopf x 1108..1211, beide
     y ~845..878), bei 746 px ebenso. Was neu dazukommt, darf nichts
     Vorhandenes zudecken. */
  position: fixed; right: 20px; bottom: 66px; z-index: 9650;
  max-width: 42vw;
}
@media (max-width: 760px) { body > #raum-tabs { right: 12px; bottom: 66px; max-width: 60vw; } }
.raum-tab {
  display: flex; align-items: center; gap: 7px; white-space: nowrap; cursor: pointer;
  background: rgba(22,29,58,.92); border: 1px solid rgba(120,140,200,.25);
  border-radius: 9px; padding: 6px 10px; font-size: 11.5px; color: #8a95b2;
  transition: color .2s, border-color .2s;
}
.raum-tab:hover { color: #e6ecf5; border-color: #38d1ff; }
.raum-tab.raum-aktiv { color: #38d1ff; border-color: #38d1ff; background: rgba(56,209,255,.1); }
.raum-tab.raum-kalt { opacity: .55; }
/* 03.09.2026: Der zuletzt benutzte Reiter wird nur noch MARKIERT, nicht mehr
   ungefragt aufgerissen (raum.js: merkeLetzte statt oeffnen). Gedaempfter als
   der aktive Reiter — ein Hinweis, wo man war, kein Anspruch auf die Flaeche. */
.raum-tab.raum-zuletzt { border-color: rgba(56,209,255,.45); color: #b9c4dd; opacity: 1; }
.raum-tab .raum-zu { opacity: .55; font-size: 13px; }

/* ---------- 6. Knöpfe: Vollbild unten links, Apps unten rechts ---------- */
.raum-knopf {
  position: fixed; z-index: 9650; cursor: pointer; white-space: nowrap;
  background: rgba(22,29,58,.92); border: 1px solid rgba(120,140,200,.25);
  color: #8a95b2; border-radius: 9px; padding: 8px 13px;
  font-size: 11px; letter-spacing: 1.1px; transition: color .2s, border-color .2s;
}
.raum-knopf:hover { color: #38d1ff; border-color: #38d1ff; }
.raum-knopf.raum-an { color: #38d1ff; border-color: #38d1ff; background: rgba(56,209,255,.1); }
#raum-vollbild-btn { left: 18px; bottom: 74px; display: none; }
body.raum-arbeit #raum-vollbild-btn,
body.raum-cowork #raum-vollbild-btn,
body.raum-vollbild #raum-vollbild-btn { display: block; }
/* ---------- Der Weg zurueck, sichtbar (03.09.2026) ----------
   Steht unter VOLLBILD in derselben Leiste, gleiche Form, gleiche Farbe.
   Zwei bewusste Abweichungen von .raum-knopf, beide gemessen begruendet:
   * z-index 9750 statt 9650 -- die Buehne liegt bei 9600, im Vollbild bei
     9700. Mit 9650 waere der Knopf im Vollbild HINTER der App und damit
     kein Rueckweg, sondern eine Behauptung. 9750 bleibt unter dem
     Browser-Panel (9800), greift also niemandem ins Revier.
   * In der Akzentfarbe statt gedaempft: er ist kein Nebenschalter, er ist
     die Tuer nach Hause. Wer sich in einer App verloren hat, soll ihn
     finden, ohne ihn zu suchen. */
#raum-heim {
  /* 118px, nicht 26px: darunter liegt die TRESOR-Leiste. Am Bildschirmfoto
     gemessen (746 und 1587 px, 03.09.2026) lag der Knopf bei bottom:26px
     genau auf "TRESOR - OHNE SPERRE" und verdeckte das Schloss-Symbol. Der
     Tresor sagt, ob die Akten offen sind — er wird nicht ueberdeckt.
     Reihenfolge von unten: TRESOR-Leiste, VOLLBILD (74), HAUPTSEITE (118). */
  left: 18px; bottom: 118px; display: none; z-index: 9750;
  color: #38d1ff; border-color: rgba(56,209,255,.55);
}
#raum-heim:hover { background: rgba(56,209,255,.14); border-color: #38d1ff; }
body.raum-arbeit #raum-heim,
body.raum-vollbild #raum-heim { display: block; }
#raum-apps-btn { right: 20px; bottom: 24px; }
/* 02.09.2026 VORSICHTSMASSNAHME - ohne Browser NICHT nachgemessen: bei voller
   Cowork-Breite laege dieser Knopf (right 20px, bottom 24px) auf der
   Cowork-Eingabezeile. Zweitens gibt es im Cowork-Zustand keine sichtbare
   Buehne mehr - eine von hier aus geoeffnete App wuerde unsichtbar laden
   (raum.js:270 wechselt aus dem Cowork NICHT nach 'arbeit'). Beides faellt
   weg, wenn Knopf und Waehler im Cowork ruhen. Der Vollbild-Knopf links
   unten bleibt unveraendert - er lag auch vorher schon ueber Cowork. */
body.raum-cowork #raum-apps-btn,
body.raum-cowork #raum-waehler { display: none !important; }

/* App-Wähler — nur auf Klick, im Ruhezustand unsichtbar */
#raum-waehler {
  position: fixed; right: 20px; bottom: 66px; z-index: 9660;
  display: none; flex-wrap: wrap; gap: 8px; width: min(430px, 62vw);
  padding: 13px; border-radius: 12px;
  background: rgba(16,22,48,.97); border: 1px solid rgba(120,140,200,.25);
  box-shadow: 0 14px 40px rgba(0,0,0,.5);
}
#raum-waehler.raum-an { display: flex; }
.raum-app {
  display: flex; align-items: center; gap: 8px; cursor: pointer;
  padding: 8px 11px; border-radius: 9px; font-size: 12px; color: #8a95b2;
  background: rgba(78,104,168,.2); border: 1px solid rgba(140,165,225,.22);
  transition: color .18s, border-color .18s, background .18s;
}
.raum-app:hover { color: #e6ecf5; border-color: #38d1ff; background: rgba(56,209,255,.16); }
.raum-app .raum-auth { opacity: .5; font-size: 10px; }

/* ---------- 7. Schmal: Rad ODER App, nie beides ---------- */
@media (max-width: 760px) {
  body.raum-arbeit #rad-stage,
  body.raum-arbeit .breadcrumb { opacity: 0; pointer-events: none; }
  #raum-buehne { left: 0 !important; top: 56px; bottom: 62px; border-radius: 0; }
  body.raum-cowork #cowork-overlay.visible,
  body.raum-cowork liri-cowork { width: 100% !important; }
  #raum-tabs { max-width: 60vw; right: 12px; }
}

/* ═══════════════════════════════════════════════════════════════════════
   PLUS · FOTO-VORSCHAU · ÜBERSICHT   (Korabs Zusatz, 18.08.2026)
   ═══════════════════════════════════════════════════════════════════════ */

/* ---------- Das Plus an der Kachel ----------
   Die Plus-Sprache des Hauses (vom Kalender übernommen): im Ruhezustand fast
   unsichtbar, erscheint beim Überfahren der Kachel, leuchtet beim Berühren. */
/* Leise sichtbar statt unsichtbar: Wer es nicht braucht, sieht es kaum.
   Wer es sucht, findet es sofort — auch ohne Maus, auch beim ersten Mal.
   Vorher war es opacity 0 und damit auf Touch unerreichbar und sonst unauffindbar. */
.raum-plus { opacity: .26; transition: opacity .18s ease; cursor: pointer; }
.case-icon:hover .raum-plus { opacity: .95; }
.raum-plus:hover { opacity: 1 !important; }
.raum-plus:hover circle { fill-opacity: .85; stroke-opacity: 1; }
.raum-plus:hover path { stroke-width: 2; }
/* Auf Touchgeräten gibt es kein Überfahren — dort steht es dauerhaft, gedämpft */
@media (hover: none) { .raum-plus { opacity: .6; } }

/* ---------- Foto-Vorschau: da, bevor die App da ist ---------- */
#raum-foto {
  position: absolute; top: 34px; left: 0; right: 0; bottom: 0;
  width: 100%; height: calc(100% - 34px);
  object-fit: cover; object-position: top center;
  z-index: 1; opacity: 0; pointer-events: none;
  transition: opacity .35s ease;
  filter: saturate(.9) brightness(.82);      /* erkennbar, aber nicht als "fertig" lesbar */
}
#raum-foto.raum-an { opacity: 1; }
/* ein ruhiger Puls sagt: es lädt noch, das hier ist ein Bild */
#raum-foto.raum-an { animation: raumAtem 2.4s ease-in-out infinite; }
@keyframes raumAtem { 0%,100% { filter: saturate(.9) brightness(.82); }
                      50%     { filter: saturate(.95) brightness(.92); } }

/* ---------- Übersicht: alle Apps als Bilder ---------- */
#raum-uebersicht {
  position: fixed; inset: 0; z-index: 9750;
  display: none; align-content: flex-start; flex-wrap: wrap;
  gap: 18px; padding: 82px 34px 34px;
  overflow-y: auto;
  background: rgba(10,14,39,.93); backdrop-filter: blur(14px);
}
#raum-uebersicht.raum-an { display: flex; animation: raumAuf .28s ease; }
@keyframes raumAuf { from { opacity: 0; transform: scale(1.03); } to { opacity: 1; transform: none; } }

.raum-ueb-app {
  width: clamp(190px, 22vw, 290px); cursor: pointer;
  border-radius: 12px; overflow: hidden;
  border: 1px solid rgba(120,140,200,.25); background: rgba(22,29,58,.85);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.raum-ueb-app:hover {
  transform: translateY(-4px); border-color: #38d1ff;
  box-shadow: 0 12px 32px rgba(0,0,0,.5), 0 0 20px rgba(56,209,255,.22);
}
.raum-ueb-app img { display: block; width: 100%; aspect-ratio: 16/10; object-fit: cover;
                    object-position: top center; background: #0c1230; }
.raum-ueb-name { display: block; padding: 9px 12px; font-size: 12px; color: #e6ecf5; }
.raum-ueb-app.raum-ueb-leer { min-height: 84px; display: flex; align-items: center; }
.raum-ueb-app.raum-ueb-leer .raum-ueb-name { color: #8a95b2; }

@media (max-width: 760px) {
  #raum-uebersicht { padding: 62px 16px 16px; gap: 12px; }
  .raum-ueb-app { width: calc(50% - 6px); }
}

/* ---------- Die offene App leuchtet in ihrer Kachel ----------
   Gleiche Sprache wie der Fokus-Glow des Masters, nur in der Akzentfarbe. */
#cases-group .case-icon.raum-offen {
  filter: drop-shadow(0 0 9px rgba(56,209,255,.75)) brightness(1.12);
}
#cases-group .case-icon.raum-offen .icon-bg {
  stroke: #38d1ff; stroke-width: 2; stroke-opacity: .9;
}

/* ---------- Die Mitte des Rades führt zurück ----------
   Ein Ring UM Korabs COWORK-Knopf herum, nie darüber. Nur da, wenn wirklich
   etwas offen ist — im Ruhezustand existiert er nicht. */
#raum-rueckweg {
  position: absolute; top: 50%; left: 50%;
  width: 118px; height: 118px; margin: -59px 0 0 -59px;
  border-radius: 50%; z-index: 6;
  display: none; align-items: flex-end; justify-content: center;
  padding-bottom: 9px;
  border: 1px dashed rgba(56,209,255,.32);
  color: rgba(56,209,255,.62); font-size: 15px;
  cursor: pointer; transition: border-color .2s ease, color .2s ease, background .2s ease;
}
body.raum-arbeit #raum-rueckweg { display: flex; }
#raum-rueckweg:hover {
  border-color: #38d1ff; color: #38d1ff;
  background: radial-gradient(circle, rgba(56,209,255,.10), transparent 68%);
}

/* ---------- Das Apps-Symbol in der Seitenleiste ----------
   Erbt Form und Verhalten der vorhandenen Symbole; nur der aktive Zustand
   ist eigen, damit man sieht, dass das Rad gerade die Programme zeigt. */
nav.sidebar a.raum-apps-icon { font-size: 17px; }
nav.sidebar a.raum-apps-icon.raum-an { color: #38d1ff; }

/* ---------- Die Essenz-Tafel ----------
   Legt sich neben die App, nicht darüber: Du sollst beides sehen können —
   was dort steht, und was daraus wesentlich ist. */
#raum-essenz {
  position: fixed; right: 20px; top: 96px; z-index: 9680;
  width: clamp(300px, 32vw, 460px); max-height: calc(100vh - 190px);
  display: none; flex-direction: column;
  border-radius: 12px; overflow: hidden;
  background: rgba(16,22,48,.97); border: 1px solid rgba(120,140,200,.3);
  box-shadow: 0 18px 46px rgba(0,0,0,.55);
}
#raum-essenz.raum-an { display: flex; animation: raumEssenzAuf .3s ease; }
@keyframes raumEssenzAuf { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }

.raum-essenz-kopf {
  display: flex; align-items: center; gap: 10px; padding: 10px 12px;
  border-bottom: 1px solid rgba(120,140,200,.25);
  font-size: 11.5px; letter-spacing: .3px; color: #8a95b2;
}
.raum-essenz-titel { flex: 1; color: #e6ecf5; }
.raum-essenz-zeit { font-variant-numeric: tabular-nums; opacity: .7; }
.raum-essenz-kopf button {
  background: none; border: 0; color: #8a95b2; font-size: 17px;
  line-height: 1; cursor: pointer; padding: 0 5px; border-radius: 5px;
}
.raum-essenz-kopf button:hover { color: #38d1ff; background: rgba(56,209,255,.12); }

.raum-essenz-leib {
  padding: 14px 16px; overflow-y: auto;
  font-size: 13px; line-height: 1.62; color: #e6ecf5;
  white-space: pre-wrap; word-break: break-word;
}
.raum-essenz-leib.raum-wartet { color: #8a95b2; font-style: italic; }
.raum-essenz-leib.raum-fehler { color: #ffb74d; }
.raum-essenz-warnung {
  margin-top: 12px; padding: 9px 11px; border-radius: 8px;
  background: rgba(229,57,53,.12); border: 1px solid rgba(229,57,53,.4);
  color: #ff8a80; font-size: 12px; font-style: normal; white-space: normal;
}
@media (max-width: 760px) {
  #raum-essenz { right: 10px; left: 10px; width: auto; top: 74px; max-height: 52vh; }
}

/* Die Mitte trägt APPS, sobald das Rad aktiv ist (Korabs Eingangstür) */
#liri-call-cowork.raum-mitte-apps::after { content: "APPS" !important; letter-spacing: 2px; }

/* ---------- Die Fall-Übersicht weicht dem Rad ----------
   Korab 18.08.: "kann weg, da es beim drehenden Radgebrauch nicht wirklich dem
   Nutzer nutzt" — und ihr Platz gehoert jetzt dem Dashboard-Bereich.
   Gebunden an das LAUFENDE Rad-System, nicht an die ganze Seite: ohne Rad steht
   die Uebersicht unveraendert da, wie immer.
   Umstellen: diesen einen Block entfernen. */
body.rad-mechanical-on #answer-panel {
  opacity: 0 !important; visibility: hidden !important; pointer-events: none !important;
}

/* Zeichen im Fensterkopf: kann ich hier handeln oder nur zusehen? */
#raum-bruecke-zeichen.raum-bruecke-an {
  color: #38d1ff; font-size: 10.5px; letter-spacing: .4px;
  padding: 2px 7px; border: 1px solid rgba(56,209,255,.45); border-radius: 6px;
}

/* ---------- Die Zeichen der Programme ----------
   Eine Linie, eine Farbe, runde Enden — dieselbe Sprache wie die Oberfläche.
   currentColor erbt die Farbe, damit sie im Fokus mitleuchten. */
#cases-group .raum-symbol { color: #cfe0f5; transition: color .2s ease; }
#cases-group .case-icon:hover .raum-symbol { color: #38d1ff; }
#cases-group .case-icon.raum-offen .raum-symbol { color: #38d1ff; }

/* ---------- Blättern, wenn mehr als 10 Programme da sind ----------
   Korab: "mach nicht mehr als 10 in einem rad". Leise Punkte unter dem Kreis. */
#raum-seiten {
  /* 19.08.: Sie lagen exakt auf der Eingabezeile (gemessen y610 vs y610).
     Jetzt im Streifen zwischen Rad-Unterkante und Zeile. */
  position: fixed; left: 25vw; transform: translateX(-50%);
  bottom: 74px; z-index: 9610;
  display: flex; gap: 7px;
}
body:not(.raum-arbeit):not(.raum-cowork) #raum-seiten { bottom: 24px; }
.raum-punkt {
  width: 7px; height: 7px; border-radius: 50%; cursor: pointer;
  background: rgba(140,165,225,.3); transition: background .2s, transform .2s;
}
.raum-punkt:hover { background: rgba(56,209,255,.6); transform: scale(1.25); }
.raum-punkt.raum-an { background: #38d1ff; }

/* ===== GLAS-TOKEN (Fenster-Strang, 22.08.2026) — eine Quelle der Wahrheit ===== */
:root{
  --glas-grund: rgba(10,16,40,0.55);
  --glas-blur: 22px;
  --glas-sat: 120%;
  --glas-radius: 14px;
  --glas-saum: 0 0 46px rgba(120,180,255,0.16), inset 0 0 0 1px rgba(150,190,255,0.10);
}
/* ===== GLAS gescopt auf Nachrichten (Verify-one-first, Weg B) =====
   Nur wenn die Nachrichten-App aktiv ist, webt die Buehne den Hintergrund ein.
   ::before liegt hinter dem transparenten iframe; App-Text bleibt scharf darueber.
   WERTE-TOR: --glas-grund dunkel genug fuer lesbaren hellen Text (WCAG AA). */
#raum-buehne[data-app="nachrichten"]::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background: var(--glas-grund);
  -webkit-backdrop-filter: blur(var(--glas-blur)) saturate(var(--glas-sat));
  backdrop-filter: blur(var(--glas-blur)) saturate(var(--glas-sat));
  border-radius: var(--glas-radius);
  box-shadow: var(--glas-saum);
}
#raum-buehne[data-app="nachrichten"] iframe{ position: relative; z-index: 1; background: transparent !important; }


/* ===== MEDIENRAUM-M7 (02.09.2026) — Korab, rot eingekreiste Leisten ==========
   "trisor bleibt · der liri chat eingabe leiste muss und darf nur ueber die
    linke seite sein · oben die beiden leisten dokumente durchsuchen mandat
    auch ausblenden".
   Gemessen vorher (1270 px, raum-arbeit): #search-row volle Breite 1270 mit
   BEIDEN Suchfeldern; #legacy-chat-bar x=163..1023 waehrend #raum-buehne bei
   x=635 beginnt -> die Eingabe schob sich 388 px unter die Buehne.
   Nur im Zustand raum-arbeit. Die Fall-Ansicht behaelt beides ueber die volle
   Breite. Ausgeblendet, nicht geloescht. Der Tresor wird NICHT angefasst --
   er zeigt an, ob die Akten offen sind; danach war gefragt, die Antwort war
   "trisor bleibt". */
body.raum-arbeit #search-row { display: none !important; }
body.raum-arbeit #legacy-chat-bar {
  right: calc(50% + 14px) !important;
  width: auto !important;
  max-width: none !important;
}
