/* LiveOS — Geöffnete Mail im iOS-26-Stil (Walat 02.11.2026). Gilt nur mit <html class="ios26"> + .lesen26 (lesen26.js).
   HIG: Tippziele ≥ 44 pt, Systemfarben (Hell/Dunkel über var(--text)/--hg), Safe Areas über --sa-oben/--sa-unten. */

/* Kopfleiste: durchsichtig, Inhalt läuft darunter; Pfeile ↑ ↓ in EINER Glas-Kapsel rechts */
.ios26 .lesen26 .navleiste,.ios26 .lesen26 .navleiste.material{background:linear-gradient(to bottom,var(--hg) 0%,var(--hg) 70%,transparent 100%);
  -webkit-backdrop-filter:none;backdrop-filter:none;border-bottom-color:transparent}
.ios26 .lesen26 .nav-mitte{font-size:15px;font-weight:600;color:var(--text2)}
.ios26 .lesen26 .nav-rechts.l26-pfeile{margin-right:16px;padding:0 4px;height:44px;border-radius:22px;display:flex;align-items:center;gap:0;flex:0 0 auto}
.ios26 .lesen26 .l26-pfeil{width:44px;height:44px;min-width:44px;display:flex;align-items:center;justify-content:center;color:var(--text);padding:0}
.ios26 .lesen26 .l26-pfeil svg{width:22px;height:22px}
.ios26 .lesen26 .l26-pfeil + .l26-pfeil{border-left:.5px solid var(--trenn)}

/* Platz unten für die schwebende Leiste */
.ios26 .lesen26 .scroller{padding-bottom:calc(48px + var(--sa-unten) + 28px)}

/* Absender-Kopf */
.ios26 .lesen26 .l26-nachricht{border-bottom:.5px solid var(--trenn);padding-bottom:12px;margin-bottom:4px}
.ios26 .lesen26 .l26-nachricht:last-child{border-bottom:0}
.ios26 .lesen26 .l26-kopf{display:flex;gap:12px;padding:12px 16px 4px;align-items:flex-start}
.ios26 .lesen26 .l26-kopf .av{flex:0 0 44px;width:44px;height:44px}
.ios26 .lesen26 .l26-wer{flex:1;min-width:0}
.ios26 .lesen26 .l26-z1{display:flex;align-items:baseline;gap:8px;min-height:22px}
.ios26 .lesen26 .l26-name{flex:1;min-width:0;font-size:17px;font-weight:600;line-height:22px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.41px}
.ios26 .lesen26 .l26-z1 time{flex:0 0 auto;font-size:15px;color:var(--text2);letter-spacing:-.24px}
.ios26 .lesen26 .l26-an{display:inline-flex;align-items:center;gap:3px;max-width:100%;min-height:30px;padding:2px 0;font-size:15px;color:var(--text2);text-align:left;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.24px}
.ios26 .lesen26 .l26-chev{display:inline-flex;flex:0 0 auto;opacity:.7;transition:transform .25s cubic-bezier(.32,.72,0,1)}
.ios26 .lesen26 .l26-chev svg{width:8px;height:13px}
.ios26 .lesen26 .l26-an.auf .l26-chev{transform:rotate(90deg)}
.ios26 .lesen26 .l26-details{margin:6px 0 4px;padding:10px 12px;border-radius:12px;background:var(--fuell);font-size:14px;line-height:1.35;display:flex;flex-direction:column;gap:5px;
  -webkit-user-select:text;user-select:text}
.ios26 .lesen26 .l26-details[hidden]{display:none}
.ios26 .lesen26 .l26-details div{display:flex;gap:8px;min-width:0}
.ios26 .lesen26 .l26-details span{flex:0 0 52px;color:var(--text2)}
.ios26 .lesen26 .l26-details small{font-size:14px;color:var(--text);overflow-wrap:anywhere}
.ios26 .lesen26 .l26-details b{font-weight:600}
.ios26 .lesen26 .l26-wert{display:flex;flex-direction:column;min-width:0;font-style:normal}
.ios26 .lesen26 .l26-details small{word-break:normal;overflow-wrap:anywhere}
.ios26 .lesen26 .nachricht.zu .l26-an,.ios26 .lesen26 .nachricht.zu .l26-details{display:none}

/* Betreff groß (Title 2) + Markierungs-Flagge */
.ios26 .lesen26 .l26-betreff{display:flex;align-items:flex-start;gap:8px;font-size:22px;line-height:28px;font-weight:700;letter-spacing:.35px;padding:6px 16px 12px;margin:0;
  -webkit-user-select:text;user-select:text;overflow-wrap:anywhere}
.ios26 .lesen26 .l26-betreff > span:first-child{flex:1;min-width:0}
.ios26 .lesen26 .l26-flagge{flex:0 0 auto;color:var(--orange);padding-top:5px}
.ios26 .lesen26 .l26-flagge[hidden]{display:none}
.ios26 .lesen26 .l26-blatt > .l26-betreff{padding-top:10px}

/* Inhalt: HTML-Mails behalten ihren weißen Grund (fremde Farben), mit runden Ecken wie eine Karte im Dunkelmodus */
.ios26 .lesen26 .html-huelle{margin:6px 0 0}
@media (prefers-color-scheme:dark){.ios26 .lesen26 .html-huelle{margin:8px 10px 0;border-radius:14px;overflow:hidden}}
.ios26 .lesen26 .ninhalt{padding:4px 16px 0}

/* Unten: schwebende Glas-Kapsel Löschen · Ordner · Antworten · Mehr + runder Verfassen-Knopf (Apple Mail iOS 26) */
.ios26 .lesen26 .werkzeugleiste{background:transparent!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border-top:0!important;
  height:calc(48px + max(var(--sa-unten) - 7px, 12px));padding:0 20px max(calc(var(--sa-unten) - 7px), 12px);gap:12px;align-items:flex-start;justify-content:space-between}
.ios26 .lesen26 .werkzeugleiste::before{content:"";position:absolute;left:0;right:0;top:-28px;bottom:0;z-index:-1;pointer-events:none;
  background:linear-gradient(to bottom,transparent 0%,var(--hg) 62%)}
.ios26 .lesen26 .l26-kapsel{flex:1;max-width:268px;height:48px;border-radius:24px;display:flex;align-items:center;justify-content:space-around;padding:0 6px}
.ios26 .lesen26 .l26-k{flex:1;height:48px;min-width:44px;color:var(--text)}
.ios26 .lesen26 .l26-k svg{width:24px;height:24px}
.ios26 .lesen26 .l26-k:active{opacity:.4}
.ios26 .lesen26 .l26-neu{width:48px;height:48px;min-width:48px;color:var(--text)}
.ios26 .lesen26 .l26-neu svg{width:24px;height:24px}