  :root{
    --bg:#FAF2E6; --panel2:#F3EADF; --line:#E6DBCF;
    --text:#1A1A1A; --muted:#6E655D; --accent:#8A1F1F;
    --good:#3F7D3A; --warn:#9A6C14; --bad:#B23B30;
    --overlay:rgba(250,242,230,.75); --searchline:#D8CDBF;
    --paratext-font:"Marie",Georgia,"Times New Roman",serif;   /* Paratext (Meta/Beschreibung/Kinozeile/Trefferkarten-Details) Standard: Marie */
  }
  /* Admin-Umschalter: Paratext zurück auf Ingeborg (geerbt). Nur Admin kann das setzen (Segment ist admin-only). */
  :root.font-ingeborg{ --paratext-font:inherit; }
  /* Alternatives, kühleres Naturweiß (per Umschalter in den Einstellungen) */
  :root.theme-cool{
    --bg:#F6F4EF; --panel2:#EFECE5; --line:#E3DDD4;
    --overlay:rgba(246,244,239,.78); --searchline:#D9D4CB;
  }
  /* Dunkler Modus – warmes Near-Black, helleres Oxblood-Rot für Kontrast */
  :root.theme-dark{
    --bg:#1B1815; --panel2:#252019; --line:#37302A;
    --text:#ECE5DA; --muted:#9E9488; --accent:#D8584C;
    --good:#74B96E; --warn:#D2A24A; --bad:#E86F62;
    --overlay:rgba(18,16,13,.8); --searchline:#3C352D;
  }
  /* Web-Fonts gebündelt (fürs Deploy – alle Nutzer:innen, nicht nur mit lokal installierter Schrift).
     „Ingeborg Osf" = Ingeborg + onum-Feature (Old-Style-Figures, per font-feature-settings in den Regeln). */
  @font-face{ font-family:"Ingeborg Osf"; src:url("fonts/Ingeborg-Regular.woff2") format("woff2"); font-weight:normal; font-style:normal; font-display:swap; }
  @font-face{ font-family:"Ingeborg Osf"; src:url("fonts/Ingeborg-Italic.woff2") format("woff2"); font-weight:normal; font-style:italic; font-display:swap; }
  @font-face{ font-family:"Ingeborg Osf"; src:url("fonts/Ingeborg-Bold.woff2") format("woff2"); font-weight:700; font-style:normal; font-display:swap; }
  @font-face{ font-family:"Ingeborg Osf"; src:url("fonts/Ingeborg-BoldItalic.woff2") format("woff2"); font-weight:700; font-style:italic; font-display:swap; }
  @font-face{ font-family:"Ingeborg Block"; src:url("fonts/Ingeborg-Block.woff2") format("woff2"); font-weight:normal; font-style:normal; font-display:swap; }
  @font-face{ font-family:"Marie"; src:url("fonts/Marie-Regular.woff2") format("woff2"); font-weight:normal; font-style:normal; font-display:swap; }
  @font-face{ font-family:"Marie"; src:url("fonts/Marie-RegularItalic.woff2") format("woff2"); font-weight:normal; font-style:italic; font-display:swap; }
  *{box-sizing:border-box}
  body{
    margin:0; font-family:"Ingeborg Osf",Georgia,"Times New Roman",serif;
    background:var(--bg); color:var(--text); line-height:1.5; font-size:17.6px;
    -webkit-font-smoothing:antialiased; font-feature-settings:"onum" 1;
  }
  /* Paratext-Schrift (umschaltbar Ingeborg ⇄ Marie) */
  .item .cinema, .book-meta, .book-desc, .fpv-where, .fr-crew, .focus-extras, .pr-count{ font-family:var(--paratext-font); }
  /* App-Layout: fixe Icon-Leiste links + Hauptbereich */
  .app{max-width:1240px; margin:0 auto; padding:0 24px; display:flex; gap:30px; align-items:flex-start}
  .rail{flex:none; width:62px; position:sticky; top:30px; margin-top:101px; display:flex; flex-direction:column; gap:16px; z-index:40}
  @media(max-width:760px){.rail{margin-top:0}}
  .railbtn{background:none; border:1px solid transparent; border-radius:13px; padding:10px; cursor:pointer; color:var(--muted); display:flex; align-items:center; justify-content:center; transition:color .15s, background .15s, border-color .15s; text-decoration:none}
  .railbtn:hover{color:var(--text); background:var(--panel2)}
  .railbtn.active{color:var(--accent); border-color:var(--line)}
  .railbtn svg{display:block; width:36px; height:36px}
  .main{flex:1; min-width:0}
  @media(max-width:760px){ .app{flex-direction:column; gap:6px; padding:0 16px} .rail{flex-direction:row; position:static; width:auto} }
  header{padding:30px 0 8px; display:flex; align-items:baseline; gap:16px; flex-wrap:wrap}
  header h1{
    font-family:"Ingeborg Block","Ingeborg Osf",Georgia,serif;
    font-size:58.3px; margin:0; line-height:1.0; letter-spacing:.04em;
    font-style:normal; font-weight:normal; color:var(--text);
    font-feature-settings:"onum" 1; max-width:100%; overflow-wrap:anywhere;
  }
  @media(max-width:760px){ header h1{font-size:35.2px} }
  @media(max-width:430px){ header h1{font-size:26.4px} }
  .mast-striped{font-feature-settings:"ss01" 1}   /* GEPARKT (aktuell NICHT angewandt): gestreifter Masthead via Ingeborg-Block-Stylistic-Set 1. Reaktivieren: Klasse an #appTitle setzen (index.html) + ss01 in .pv-login-brand ergänzen. */
  header .sub{color:var(--muted); font-size:16px; font-style:italic}
  .wrap{padding:20px 0 90px}
  .view{display:none}
  .view.active{display:block}
  /* Saison-Atlas – grafische Relevanz-Karte */
  .atlas-view{max-width:none; padding-left:14px; position:relative}
  /* Such-Equalizer: sitzt OHNE Kasten direkt auf dem Hintergrund, unten – rechts bündig mit der Titelkarte, links fast an den Rand */
  .atlas-eq{position:absolute; right:0; width:400px; bottom:18px; padding:0; background:none; border:none; z-index:6}   /* rechte Spalte, bündig mit der Titelkarte – NICHT über die Cover */
  .atlas-eq-head{display:flex; align-items:center; justify-content:space-between; margin:0 4px 4px 26px}
  .atlas-eq-bereich{display:flex; gap:10px}
  .eq-chip{font-family:var(--paratext-font); font-size:15px; font-weight:400; line-height:1; color:var(--muted); background:var(--panel2); border:1px solid var(--line); border-radius:999px; padding:6px 14px; cursor:pointer; text-decoration:none; opacity:.5; transition:color .12s, border-color .12s, opacity .12s}
  .eq-chip.on{color:var(--accent); border-color:var(--accent); opacity:1}
  .eq-chip:hover{color:var(--accent); border-color:var(--accent); opacity:1}
  .eq-reset{background:none; border:none; color:var(--muted); cursor:pointer; padding:2px; display:inline-flex; align-items:center; text-decoration:none}
  .eq-reset:hover{color:var(--text)}
  .eq-svg{width:100%; height:auto; display:block; touch-action:none; font-family:inherit; text-decoration:none}
  .atlas-top{display:flex; align-items:center; gap:14px; min-height:80px; margin-bottom:6px; padding-right:430px}   /* 80px-Zeile wie .fav-top → Suche sitzt exakt wie auf Vorschauen/Favoriten; rechte Zone für die Titelkarte */
  .atlas-top .atlas-search{flex:1; max-width:none}   /* höhere Spezifität als .vorschau-search → Suchlinie läuft lang */
  /* Suchzeile: getippte Wörter + angegraute Geisterbegriffe auf EINER LANGEN Linie (Strich läuft durchgehend unter allem), gleiche Schrift – nur grauer */
  .atlas-line{flex:1; display:block; white-space:nowrap; overflow:hidden; line-height:34px; border-bottom:1.5px solid var(--searchline)}
  .atlas-search:focus-within .atlas-line{border-bottom-color:var(--accent)}
  .atlas-search #atlasSearch{border:none; width:auto; min-width:8ch; display:inline; padding:5px 0; vertical-align:baseline}
  .atlas-ghosts{display:inline}
  .atlas-ghost{display:inline; font-family:"Ingeborg Osf",Georgia,serif; font-size:20.5px; color:var(--text); opacity:.4; background:none; border:none; text-decoration:none; padding:0 0 0 .42em; cursor:pointer; font-feature-settings:"onum" 1}
  .atlas-ghost:hover{opacity:.7; text-decoration:none}
  .ghost-x{font-size:.6em; margin-left:.22em; vertical-align:.12em; opacity:.65; font-feature-settings:normal}
  .atlas-ghost:hover .ghost-x{opacity:1}
  /* Detail-Karte oben rechts: PLAIN auf die Seite (kein Kasten/Schatten), Text bündig OHNE Cover (Cover ist groß zentral) */
  .atlas-detail{position:absolute; top:-10px; right:0; width:400px; z-index:8; pointer-events:none; background:none; border:none; box-shadow:none; padding:0}   /* einen Tick höher, mehr Luft zum Equalizer */
  .atlas-detail .book-pubgroup{margin:0}
  .atlas-detail .book-pubhead{margin:0 0 2px}
  .atlas-detail .book-daygroup{margin:0}
  .atlas-detail .bookitem{margin:0; padding:8px 0 0; border:none; flex-direction:column; align-items:flex-start; pointer-events:auto}   /* Spalte → Aktionsleiste landet UNTER dem Text; hoverbar für die Einblendung */
  .atlas-detail .book-cover-slot{display:none}   /* kein zweites Cover – Text bündig */
  .atlas-detail .bookitem .book-tags, .atlas-detail .bookitem .tags-caret, .atlas-detail .bookitem .tagadd, .atlas-detail .bookitem .book-fav{display:none}
  /* Beschreibung in der kompakten Kartenansicht begrenzen, damit ein sehr langer Klappentext nicht in den Equalizer läuft (Volltext steht in der Liste) */
  .atlas-detail .book-desc{display:-webkit-box; -webkit-line-clamp:7; -webkit-box-orient:vertical; overflow:hidden}
  /* Aktionsleiste (Favorisieren, Teilen, Termin, Things, NetGalley, Verlagsseite, Löschen): standardmäßig AUSgeblendet, erst beim Hover über die Karte einblenden – so läuft sie nie in die Bereich-Chips */
  .atlas-detail .bookitem .acts{opacity:0; pointer-events:auto; align-self:flex-start; margin-top:14px; gap:6px; transition:opacity .15s}
  .atlas-detail .bookitem:hover .acts{opacity:1}
  .atlas-stage{position:relative; width:100%; height:calc(100vh - 234px); min-height:440px; overflow:hidden}
  .atlas-empty{position:absolute; top:6%; left:2%; max-width:440px; text-align:left; color:var(--muted); font-family:var(--paratext-font); font-style:italic; font-size:16px; line-height:1.5}
  .atlas-ring{position:absolute; border-radius:50%; border:1px solid var(--muted); opacity:.18; pointer-events:none}
  .atlas-zone{position:absolute; top:14px; color:var(--muted); font-family:var(--paratext-font); font-style:italic; font-size:14px; opacity:.6; pointer-events:none; letter-spacing:.02em}
  .atlas-zone.zone-bel{left:22px}
  .atlas-zone.zone-sach{right:22px}
  /* langsame, fließende Bewegung (kein Ruckeln) */
  .atlas-node{position:absolute; padding:0; margin:0; border:none; background:none; cursor:pointer;
    transition:left 1.05s cubic-bezier(.32,.18,.16,1), top 1.05s cubic-bezier(.32,.18,.16,1), width 1.05s cubic-bezier(.32,.18,.16,1), height 1.05s cubic-bezier(.32,.18,.16,1)}
  /* Cover stehen für sich: kein Rahmen, kein Schatten-Kasten – nur sanfte Tiefe, Hover hebt leicht an */
  .atlas-tile{position:absolute; inset:0; overflow:hidden; background:transparent; filter:drop-shadow(0 3px 7px rgba(0,0,0,.18)); transition:transform .4s ease}
  .atlas-node:hover{z-index:6}
  .atlas-node:hover .atlas-tile{transform:translateY(-3px) scale(1.03)}
  .atlas-cover{position:absolute; inset:0; width:100%; height:100%; object-fit:contain; z-index:2}   /* Cover VOLLSTÄNDIG zeigen (nicht beschneiden); Formate dürfen variieren */
  .atlas-fallback{position:absolute; inset:0; z-index:1; display:flex; align-items:center; justify-content:center; text-align:center; padding:8px;
    background:var(--panel2); font-family:var(--paratext-font); font-size:13px; line-height:1.28; color:var(--muted)}
  /* Grundansicht (alle Verlage): Überschrift wie Verlagsköpfe + Monatsansicht-Toggle wie die Panel-Tabs */
  .grund-toggle{display:flex; align-items:center; gap:14px; margin:0 0 18px; min-height:80px}
  .grund-toggle-lbl{flex:1; min-width:0; color:var(--text); font-size:30.8px; font-weight:700; line-height:1.08; font-feature-settings:"swsh" 1,"calt" 1,"onum" 1}
  .grund-seg{font-family:inherit; font-size:25.3px; font-variant-caps:small-caps; letter-spacing:1px; font-weight:600; color:var(--muted); background:none; border:none; cursor:pointer; padding:0; text-decoration:none}
  .grund-seg:hover{color:var(--accent)}
  .grund-seg.active{color:var(--text)}
  /* Monatsüberschriften analog den Tages-Überschriften der Verlagsansicht (.book-dayhead) */
  .grund-month{display:flex; align-items:center; gap:9px; width:100%; text-align:left; background:none; border:none; cursor:pointer; color:var(--accent); font-family:inherit; font-size:23.1px; font-style:italic; font-weight:700; font-feature-settings:"swsh" 1,"calt" 1,"onum" 1; line-height:1.1; margin:24px 0 4px; padding:2px 0; text-decoration:none}
  .grund-toggle + .grund-month{margin-top:0; padding-top:0}   /* erste Monatsüberschrift VERTIKAL exakt wie die erste Datums-Überschrift (.book-dayhead) der Relevanzansicht → kein Sprung beim Umschalten */
  .grund-month:hover{opacity:.82}
  .grund-month .disc{width:17px; height:17px; margin:0 0 0 -26px; flex:none; color:var(--accent); opacity:.6}   /* Disc-Icon hängt in den linken Rand → Label fluchtet HORIZONTAL exakt mit den Datums-Überschriften (kein Einrücken durch das Icon) */
  .grund-month .disc-open{display:none}                 /* eingeklappt (Default): „zu"-Pfeil */
  .grund-month .disc-closed{display:inline-block}
  .grund-month.open .disc-open{display:inline-block}    /* aufgeklappt: „offen"-Pfeil */
  .grund-month.open .disc-closed{display:none}
  .grund-month .grund-month-lbl{flex:0 1 auto}
  .grund-month .grund-month-cnt{font-style:normal; font-weight:400; font-size:15px; color:var(--muted); font-variant-numeric:tabular-nums}
  /* Titel-Dossier (KI-Orientierung) – ruhiges Overlay, lesefreundlich */
  .dossier-overlay{position:fixed; inset:0; z-index:60; display:none; align-items:flex-start; justify-content:center; overflow-y:auto;
    background:rgba(30,24,18,.34); backdrop-filter:blur(2px); padding:48px 20px}
  .dossier-overlay.on{display:flex}
  .dossier-box{position:relative; width:100%; max-width:916px; background:var(--bg); border:1px solid var(--line); border-radius:10px;
    box-shadow:0 18px 60px rgba(0,0,0,.28); padding:150px 172px 60px}   /* viel Weißraum links/rechts + großzügig oben */
  .dossier-close{position:absolute; top:16px; right:20px; background:none; border:none; font-size:26px; line-height:1; color:var(--muted); cursor:pointer; padding:4px}
  .dossier-close:hover{color:var(--text)}
  /* Dossier-Schrift fest auf Ingeborg (NICHT umschaltbar mit dem globalen Marie-Toggle) */
  .dossier-title{font-family:"Ingeborg Osf",Georgia,"Times New Roman",serif; font-size:28px; color:var(--accent); margin:0 24px 24px 0; line-height:1.28}
  .dossier-loading{font-family:"Ingeborg Osf",Georgia,serif; font-style:italic; font-size:20px; color:var(--muted); padding:14px 0}
  .dossier-prose p{font-family:"Ingeborg Osf",Georgia,"Times New Roman",serif; font-size:21px; line-height:1.65; color:var(--text); margin:0 0 16px}
  /* „Verwandte Titel" im üblichen Look (.related-head-title): Ingeborg, rot, kursiv, mit Schwüngen */
  .dossier-rel-label{font-family:"Ingeborg Osf",Georgia,serif; font-size:23.1px; font-style:italic; font-weight:700; font-feature-settings:"swsh" 1,"calt" 1,"onum" 1; line-height:1.1; color:var(--accent); margin:34px 0 18px}
  .dossier-rel-row{display:grid; grid-template-columns:repeat(4,1fr); gap:24px 22px}   /* 4 pro Reihe, bündig mit dem Text */
  .dossier-rel{width:100%; padding:0; border:none; background:none; cursor:pointer}
  .dossier-rel img{width:100%; height:auto; border-radius:3px; box-shadow:0 2px 9px rgba(0,0,0,.22); transition:transform .15s}
  .dossier-rel:hover img{transform:translateY(-2px) scale(1.04)}
  .dossier-rel-fallback{display:block; font-family:"Ingeborg Osf",Georgia,serif; font-size:13px; line-height:1.25; color:var(--muted); padding:8px 6px}
  /* Vorschau / Verlagsvorschauen */
  .vorschau-view{max-width:none; padding-left:14px}   /* identisch zur Favoritenansicht */
  .vorschau-layout{display:grid; grid-template-columns:minmax(0,1fr) minmax(240px,310px); gap:62px; align-items:start}
  .vorschau-main{min-width:0}
  .vorschau-side{min-width:0}
  /* Markieren/Kopieren bewusst freigeschaltet (Arbeitsphase). Zum Sperren wieder auf user-select:none stellen. */
  #previewTitleList, #favoritesList, #previewPublisherPanel, #previewBereichPanel{-webkit-user-select:text; user-select:text}
  .vorschau-tools{display:flex; gap:12px; align-items:flex-end; justify-content:space-between; margin:16px 0 24px; flex-wrap:wrap}   /* mehr Luft: über der Suche (zum Masthead) und darunter (zu „Alle Verlage") – hebt die Suche subtil hervor */
  .vorschau-actions{display:flex; align-items:center; gap:18px; flex:1; justify-content:space-between; width:100%}
  .iconbtn.import-ic{width:80px; height:80px; color:var(--muted); flex:none}
  .iconbtn.import-ic svg{width:66px; height:66px; stroke-width:0.75}   /* Wolke etwas größer (sie ist vertikal gestaucht); Strich abgeschwächt → leichter, nicht dunkler als die Leiste */
  .iconbtn.map-ic, .iconbtn.layout-ic{width:80px; height:80px; color:var(--muted); flex:none}   /* Button exakt so groß wie die Wolke (Symmetrie, statische Position) */
  .iconbtn.map-ic svg{width:58px; height:58px; stroke-width:0.85}
  .iconbtn.layout-ic svg{width:58px; height:58px; stroke-width:0.85}   /* Strich abgeschwächt (CSS überschreibt SVG-Attribut) → Anmutung wie die Leiste links */
  .iconbtn.layout-ic[hidden]{display:none}
  /* Kalender- + Liste/Cover-Icon leben in der „Alle Verlage"-Kopfzeile (grund-toggle) – exakt auf deren Linie, in Wolkengröße */
  .grund-tools{flex:none; display:flex; align-items:center; gap:14px}
  .grund-tools .iconbtn.month-ic, .grund-tools .iconbtn.layout-ic{width:80px; height:80px; color:var(--muted); flex:none}
  .grund-tools .iconbtn.month-ic svg{width:56px; height:56px; stroke-width:0.9}
  .grund-tools .iconbtn.layout-ic svg{width:58px; height:58px; stroke-width:0.85}
  .grund-tools .iconbtn.month-ic.active{color:var(--text)}
  .import-ic.dragover{color:var(--accent); background:var(--panel2)}
  .import-ic.processing{opacity:.5; cursor:wait}
  .import-wrap{flex:none; display:flex; flex-direction:column; align-items:center; gap:7px}
  .import-progress{display:flex; flex-direction:column; align-items:center; gap:4px; width:80px}
  .import-progress[hidden]{display:none}
  .import-bar{position:relative; height:3px; width:100%; background:var(--line); border-radius:2px; overflow:hidden}
  .import-bar::after{content:''; position:absolute; top:0; left:0; height:100%; width:0; background:var(--accent); border-radius:2px; animation:import-grow 1.5s ease-in-out infinite}
  @keyframes import-grow{0%{width:0; opacity:1} 80%{width:100%; opacity:1} 100%{width:100%; opacity:.3}}
  .import-label{font-family:var(--paratext-font); font-size:13px; color:var(--muted); font-style:italic; white-space:nowrap}
  .vorschau-search{display:flex; align-items:center; gap:9px; color:var(--muted); flex:1; min-width:180px; max-width:460px; position:relative}
  .vorschau-actions .vorschau-search{min-height:80px}   /* Zeile mittig in 80px halten (wie die Favoriten) → Suchzeile sitzt an derselben Stelle, auch wenn online die Wolke ausgeblendet ist */
  .vorschau-search:focus-within{color:var(--accent)}
  /* Inline-Autovervollständigung: grauer Ghost-Text hinter der Eingabe (getippter Teil unsichtbar, Rest grau) */
  .search-ghost{position:absolute; pointer-events:none; white-space:pre; overflow:hidden; z-index:0;
    font-family:"Ingeborg Osf",Georgia,serif; font-size:20.5px; font-feature-settings:"onum" 1;
    color:var(--muted); opacity:.6; line-height:normal;
    box-sizing:border-box; padding:5px 2px 5px 0; border-bottom:1.5px solid transparent}   /* Box-Modell + Textfluss exakt wie #previewSearch (kein Flex-Zentrieren → identische Sub-Pixel-Rundung auf jeder Zoomstufe) */
  .search-ghost .ac-typed{visibility:hidden}
  .vorschau-search input{position:relative; z-index:1; background:transparent}
  #previewSearch, #favSearch, #atlasSearch{
    font-family:"Ingeborg Osf",Georgia,serif; font-size:20.5px; color:var(--text);
    background:transparent; border:none; border-bottom:1.5px solid var(--searchline);
    padding:5px 2px 5px 0; width:100%; outline:none; font-feature-settings:"onum" 1;
  }
  #previewSearch::placeholder, #favSearch::placeholder, #atlasSearch::placeholder{color:var(--muted); font-style:italic; opacity:.9}
  #previewSearch:focus, #favSearch:focus, #atlasSearch:focus{border-bottom-color:var(--accent)}
  /* Nativer Such-Clear-Button (×) nimmt sonst die macOS-System-Akzentfarbe (blau) an → grau umstylen, Klick-zum-Leeren bleibt */
  #previewSearch::-webkit-search-cancel-button, #favSearch::-webkit-search-cancel-button, #atlasSearch::-webkit-search-cancel-button{
    -webkit-appearance:none; appearance:none; width:15px; height:15px; margin-left:6px; cursor:pointer; opacity:.5;
    background:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2016%2016'%3E%3Cpath%20d='M4%204l8%208M12%204l-8%208'%20stroke='%236e655d'%20stroke-width='1.6'%20stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;
  }
  #previewSearch::-webkit-search-cancel-button:hover, #favSearch::-webkit-search-cancel-button:hover, #atlasSearch::-webkit-search-cancel-button:hover{opacity:.85}
  /* Klickbares Saison-Label in der Kopfzeile (Saison ⇄ Alle Saisons) – optisch unverändert, nur klickbar */
  .scope-link{cursor:pointer}
  /* Umschalter Verlage ⇄ Themen über dem rechten Panel – gesperrte Kapitälchen, kein Unterstrich */
  .panel-toggle{display:flex; gap:16px; margin:0 0 16px; align-items:center; min-height:35px; position:relative}
  .panel-tab{font-family:inherit; font-size:25.3px; font-variant-caps:small-caps; letter-spacing:1px; font-weight:600; color:var(--muted); background:none; border:none; cursor:pointer; padding:0; text-decoration:none}
  .panel-tab.active{color:var(--text)}
  .panel-tab:hover{color:var(--accent)}
  /* Themen-Sortierung: zwei Icons (alphabetisch / Häufigkeit) rechts neben „Themen", nur im Themen-Modus */
  .tagsort{display:flex; gap:8px; align-items:center; margin-left:4px}
  .tagsort[hidden]{display:none}
  .tagsort-btn{background:none; border:none; cursor:pointer; padding:3px; line-height:0; color:var(--muted); opacity:.5; text-decoration:none; border-radius:8px}
  .tagsort-btn.active{color:var(--accent); opacity:1}
  .tagsort-btn:hover{opacity:1; background:var(--panel2)}
  .tagsort-btn svg{display:block; width:29px; height:29px}
  /* Verlage-Panel rechts (Dokumentation + Filter) */
  .pubbox{border-top:none; padding-top:0}
  #previewPublisherPanel, #favPublisherPanel{--pr-gutter:92px}   /* einheitlicher rechter Gutter (●+Auge+Löschen) → Zahlen fluchten in Verlage UND Themen */
  .puprow{display:flex; align-items:center; border-radius:9px}   /* kein gap – Abstand regelt der .pr-controls-Gutter bzw. padding-right */
  /* „Gesichtet"-Punkt: links, winzig; Indikator UND Umschalter in einem */
  .pubseen-toggle{flex:none; width:13px; background:none; border:none; padding:0; cursor:pointer; font-size:8.5px; line-height:1; color:transparent; text-decoration:none; transition:color .12s}
  .puprow:hover .pubseen-toggle{color:var(--line)}          /* unmarkiert: zarte Andeutung beim Hovern */
  .puprow.seen-pub .pubseen-toggle{color:var(--muted)}      /* gesichtet & aktuell: gedämpfter Punkt */
  .puprow.seen-updated .pubseen-toggle{color:var(--accent)} /* gesichtet, aber neue Titel seither */
  .puprow.seen-pub:not(.active) .pr-filter{color:var(--muted)}   /* gesichtete Verlage treten zurück (abgeblendet) */
  .pr-filter{flex:1; min-width:0; display:flex; align-items:baseline; justify-content:space-between; gap:10px; background:none; border:none; text-align:left; font-family:inherit; font-size:20.4px; font-weight:400; color:var(--text); text-decoration:none; cursor:pointer; padding:9px 0; border-radius:9px}
  .pr-controls{flex:none; width:var(--pr-gutter); display:flex; align-items:center; justify-content:flex-end; gap:6px}   /* rechter Steuer-Cluster: ● gesichtet · Auge · Löschen */
  .pr-filter:hover{opacity:1; background:var(--panel2)}
  .puprow.active .pr-filter{color:var(--accent); font-weight:700}
  .pr-name{overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
  .pr-count{flex:none; color:var(--muted); font-size:15.4px; font-variant-numeric:tabular-nums; text-align:right}
  .puprow.tagrow, .puprow.favpub{padding-right:var(--pr-gutter)}   /* kein Steuer-Cluster → gleicher rechter Gutter wie die Verlagszeilen, Zahl exakt bündig dazu */
  .puprow.active .pr-count{color:inherit}
  .pubrow-remove{display:inline-flex; align-items:center; justify-content:center; background:none; border:none; color:var(--muted); cursor:pointer; line-height:1; padding:6px; text-decoration:none; flex:none; opacity:0; transition:opacity .12s}
  .pubrow-remove svg{display:block; width:17px; height:17px}
  .puprow:hover .pubrow-remove{opacity:.7}
  .pubrow-remove:hover{color:var(--bad); opacity:1}
  /* Verlag ausblenden (Auge) – wie der Löschen-Button erst beim Hovern; im ausgeblendeten Zustand dauerhaft sichtbar */
  .pubhide-toggle{display:inline-flex; align-items:center; justify-content:center; background:none; border:none; color:var(--muted); cursor:pointer; line-height:1; padding:6px; text-decoration:none; flex:none; opacity:0; transition:opacity .12s, color .12s}
  .pubhide-toggle svg{display:block; width:17px; height:17px}
  .puprow:hover .pubhide-toggle{opacity:.7}
  .pubhide-toggle:hover{color:var(--accent); opacity:1}
  .puprow.hidden-pub .pr-filter{color:var(--muted); opacity:.5}        /* ausgeblendeter Verlag: abgeblendet */
  .puprow.hidden-pub .pr-name{font-style:italic}
  .puprow.hidden-pub .pubhide-toggle{opacity:1; color:var(--accent)}   /* Auge-aus bleibt sichtbar → jederzeit wieder einblendbar */
  .pr-contact{padding:0 9px 7px 9px; margin-top:-3px; color:var(--muted); font-size:13.8px; line-height:1.35}
  .ghost.sm.pubreset{font-size:20.4px; padding:6px 9px; margin-bottom:2px}
  /* Bereiche – eingerückt unter dem gewählten Verlag, in der Paratext-Schrift (Marie umschaltbar) */
  .bereich-sub{display:flex; flex-direction:column; gap:2px; margin:2px var(--pr-gutter) 4px 22px}
  .bereich-filter{display:flex; align-items:baseline; justify-content:space-between; gap:10px; width:100%; background:none; border:none; cursor:pointer; text-align:left; color:var(--muted); font-family:var(--paratext-font); font-size:17.5px; font-weight:400; text-decoration:none; padding:5px 0; border-radius:8px}
  .bereich-filter .pr-name, .bereich-filter .pr-count{font-weight:400; text-decoration:none}
  .bereich-filter:hover{background:var(--panel2)}
  .bereich-filter.active{color:var(--accent)}
  .bereich-filter.active, .bereich-filter.active .pr-name, .bereich-filter.active .pr-count{font-weight:700}
  .bereich-filter.active .pr-count{color:inherit}
  /* Imprint-Aufschlüsselung im Verlagspanel: Imprint wie ein kleiner Verlag (Ingeborg, gleiche Größe), nur eingerückt */
  .imprint-sub{display:flex; flex-direction:column; gap:1px; margin:8px var(--pr-gutter) 4px 0}   /* rechter Gutter wie die Hauptzeilen → Zahlen fluchten */
  .imprint-pubrow{margin-left:18px}
  .imprint-genres{display:flex; flex-direction:column; gap:2px; margin:1px 0 5px 40px}
  .pr-contact a{color:var(--muted); text-decoration:underline; text-underline-offset:2px}
  .pr-contact a:hover{color:var(--accent)}
  /* Hinweis: keine Vorschauen-Datei verknüpft */
  .vfs-reminder{display:none; align-items:center; gap:12px; flex-wrap:wrap; background:var(--panel2); border:1px solid var(--line); border-left:3px solid var(--warn); border-radius:10px; padding:10px 14px; margin-bottom:20px; color:var(--muted); font-size:15.4px}
  .vfs-reminder.show{display:flex}
  .vfs-reminder b{color:var(--text); font-weight:600}
  .vfs-reminder .vfs-link-btn{margin-left:auto}
  /* Favoriten-Seite */
  .favorites-view{max-width:none; padding-left:14px}   /* gleiche Einrückung wie die Termine-Spalte */
  .favorites-layout{display:grid; grid-template-columns:minmax(0,1fr) minmax(240px,310px); gap:62px; align-items:start}
  .favorites-main{min-width:0}
  .favorites-side{min-width:0}
  .favorites-side .pubbox{border-top:none; padding-top:0}
  .fav-search{margin:0; max-width:460px; min-height:80px}   /* Zeilenhöhe wie .vorschau-tools (Import-Button) → Feld auf gleicher Linie */
  .fav-top{display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; margin:16px 0 24px}   /* Abstände pixelgenau wie .vorschau-tools der Hauptseite (Masthead ↑ / Inhalt ↓) */
  .fav-top .fav-search{flex:1}
  button.iconbtn.fav-request{flex:none; width:80px; height:80px; color:var(--muted)}   /* analog zur Import-Wolke */
  button.iconbtn.fav-request svg{width:58px; height:58px; stroke-width:0.85}   /* Strichstärke wie Wolke/Karte/Liste-Icons (58px → gleiche optische Linienstärke) */
  .fav-tools{display:flex; justify-content:space-between; align-items:flex-end; gap:16px; margin-bottom:6px}
  .preview-count{color:var(--muted); font-size:15.4px; font-style:italic; margin:0 0 12px}
  .preview-import-status{color:var(--muted); font-size:14.9px; font-style:italic; min-height:22px; margin-top:8px}
  .book-pubgroup{margin-bottom:44px}
  .book-pubhead{color:var(--text); font-size:30.8px; font-weight:700; line-height:1.08; margin:0 0 16px; font-feature-settings:"swsh" 1,"calt" 1,"onum" 1}
  .book-pubhead.toggle{display:flex; align-items:baseline; gap:13px; cursor:pointer; margin-bottom:16px; border-radius:9px; transition:color .12s; scroll-margin-top:24px}
  .book-pubhead.toggle:hover{color:var(--accent)}
  .book-pubhead.toggle.collapsed{margin-bottom:10px}
  .pubhead-caret{flex:none; font-weight:400; font-size:0.74em; color:var(--muted); transform:rotate(90deg); transform-origin:center; transition:transform .15s}
  .book-pubhead.toggle.collapsed .pubhead-caret{transform:rotate(0deg)}
  .pubhead-name{flex:1; min-width:0}
  .pubhead-count{flex:none; font-family:var(--paratext-font); font-weight:400; font-size:16px; color:var(--muted); font-variant-numeric:tabular-nums}
  .book-daygroup{margin-bottom:26px}
  .book-dayhead{color:var(--accent); font-size:23.1px; font-style:italic; font-weight:700; font-feature-settings:"swsh" 1,"calt" 1,"onum" 1; line-height:1.1; margin-bottom:4px}
  .semhint{color:var(--muted); font-style:italic; font-size:15px; margin:2px 0 12px}
  .semhint.sem-expand{margin-top:20px; padding-top:14px; border-top:1px solid var(--line)}
  .linkish{background:none; border:none; color:var(--accent); cursor:pointer; font:inherit; font-style:normal; padding:0; text-decoration:underline}
  /* „Ähnliche Titel"-Modus: ausgewählter Titel oben (volle Karte ohne Tags), dann „Verwandte Titel" + Linie */
  .similar-sel{margin-bottom:28px}
  .related-head{margin:0 0 16px; padding-bottom:12px; border-bottom:1px solid var(--line)}
  /* „Verwandte Titel" im Look der Datums-Überschriften (.book-dayhead): Ingeborg, rot, kursiv, etwas größer, mit Schwüngen */
  .related-head-title{color:var(--accent); font-size:23.1px; font-style:italic; font-weight:700; font-feature-settings:"swsh" 1,"calt" 1,"onum" 1; line-height:1.1}
  .similar-head-title{color:var(--accent); font-size:23.1px; font-style:italic; font-weight:700; font-feature-settings:"swsh" 1,"calt" 1,"onum" 1; line-height:1.1}  /* Fallback-Label */
  /* Stil-Profil unter „In der Art von [Autor]" – die Stichworte, die die Suche treiben */
  .style-profile{display:block; margin-top:5px; color:var(--muted); font-family:var(--paratext-font); font-style:italic; font-size:14.5px; line-height:1.4}
  .similar-back{font-family:var(--paratext-font); font-size:15px; white-space:nowrap}
  .bookitem{display:flex; align-items:baseline; gap:16px; padding:13px 0 13px 18px}
  .book-cover-slot{flex:none; align-self:flex-start; width:52px}   /* Cover-Platz immer reservieren – auch ohne Cover, für bündigen Einzug */
  .book-cover{display:block; width:100%; height:auto; max-height:80px; object-fit:contain; border-radius:3px; box-shadow:0 1px 5px rgba(0,0,0,.18); background:var(--panel2); cursor:zoom-in}
  .cover-zoom{position:fixed; inset:0; z-index:9999; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,0); transition:background .28s ease; cursor:zoom-out}
  .cover-zoom.shown{background:rgba(0,0,0,.78)}
  .cover-zoom img{max-width:90vw; max-height:90vh; border-radius:6px; box-shadow:0 12px 48px rgba(0,0,0,.55); will-change:transform; transform-origin:top left}
  .bookitem.interesting .book-title{color:var(--accent)}
  .favorites-view .bookitem.interesting .book-title{color:var(--text)}
  .book-date{flex:none; width:96px; color:var(--accent); font-style:italic; font-weight:700; font-size:18.2px; line-height:1.2; font-feature-settings:"onum" 1}
  .book-main{flex:1; min-width:0}
  .book-title{display:block; font-weight:700; font-size:20px; line-height:1.26}
  .book-title-name{font-style:italic}
  .book-title-link{cursor:pointer}
  .book-title-link:hover{color:var(--accent)}   /* Autor-Titel-Zeile klickbar → Titelkarte */
  .book-subtitle{display:block; color:var(--muted); font-size:18.7px; font-style:italic; margin-top:2px; line-height:1.3}
  .book-meta{display:block; color:var(--muted); font-size:18.7px; margin-top:4px; line-height:1.32}
  .book-desc{display:block; color:var(--text); font-size:18.7px; margin-top:6px; line-height:1.42}
  .book-tags{display:flex; flex-wrap:wrap; gap:6px; margin-top:9px}
  .tagpill{font-family:var(--paratext-font); font-size:14px; font-weight:400; text-decoration:none; line-height:1; color:var(--muted); background:var(--panel2); border:1px solid var(--line); border-radius:999px; padding:5px 11px; cursor:pointer; transition:color .12s, border-color .12s}
  .tagpill:hover{color:var(--accent); border-color:var(--accent); text-decoration:none}
  /* Spitzentitel – Oval exakt wie ein normales Tag, NUR der Text etwas kräftiger */
  .tagpill.lead{font-weight:600}
  /* Hype / Vorlauf-Buzz – kräftiger Text + aufsteigender Pfeil (gerade gehandelte Titel sichtbar machen) */
  .tagpill.hype{font-weight:600}
  .tagpill.hype::before{content:"↗"; margin-right:5px; opacity:.75}
  /* Autor-Statur – ruhige Info (kein Filter-Button): kursiv, dezenter Pfeil, kein Hover-Akzent */
  .tagpill.standing{cursor:default; font-style:italic}
  .tagpill.standing::before{content:"❯"; margin-right:4px; opacity:.5}
  .tagpill.standing:hover{color:var(--muted); border-color:var(--line)}
  /* DNB-Schlagwörter – eigene gedämpfte Ebene (gepunkteter Rand, blasser) gegenüber dem kuratierten Vokabular */
  .tagpill.dnb{border-style:dotted; opacity:.78}
  .tagpill.dnb::before{content:"›"; margin-right:4px; opacity:.55}
  /* Herkunftsland – Oval wie ein normales Tag, dezent mit kleinem Globus-Präfix abgesetzt */
  .tagpill.origin::before{content:"◍"; display:inline-block; margin-right:5px; opacity:.6; font-size:.92em; vertical-align:middle; position:relative; top:-0.13em}
  /* Geschlecht der Autor:in – sehr dezent, nur das Symbol (♀/♂), gedämpft */
  .tagpill.gender{padding-left:8px; padding-right:8px; opacity:.7; font-size:.95em}
  .tagpill.gender:hover{opacity:1}
  /* Preis-Konflikt (DNB ≠ Verlagsseite) – dezenter Warnhinweis an der Preis-Zeile */
  .price-warn{color:var(--accent,#b45309); cursor:help; font-weight:700; opacity:.8}
  /* „Weitere anzeigen" der gedeckelten Grundansicht – dezent, zentriert */
  .grund-more{display:block; margin:18px auto 8px; padding:9px 18px; background:none; border:1px solid var(--line); border-radius:9px; color:var(--muted); font-family:var(--paratext-font); font-size:16px; cursor:pointer}
  .grund-more:hover{color:var(--accent); border-color:var(--accent)}
  /* ===== Cover-Galerie (alternative Grundansicht) ===== */
  /* WICHTIG: Grid-Spalten NICHT ändern (sonst springen Suche/Icons) – Layout bleibt exakt wie in der Liste/Favoriten.
     Verlage/Themen stehen an FIXER Position; das Cover-Raster läuft beim Einklappen per negativem margin-right über die
     Verlagsspalte hinweg (Überschriften liegen dann oben drüber). */
  .vorschau-side{position:relative; z-index:3}                  /* Überschriften liegen über den (vollbreiten) Covern */
  /* Eingeklappte Cover-Ansicht (Cover laufen vollbreit UNTER die Verlagsspalte): die Spalte sonst klick-DURCHLÄSSIG machen,
     sonst sind die Cover der rechten Spalte nicht klickbar. Nur die echten Bedienelemente (Verlage/Themen-Tabs, Caret) bleiben klickbar. */
  .vorschau-layout.cover-mode:not(.cover-panel-open) .vorschau-side{pointer-events:none}
  .vorschau-layout.cover-mode:not(.cover-panel-open) .vorschau-side .panel-tab,
  .vorschau-layout.cover-mode:not(.cover-panel-open) .vorschau-side .panel-collapse{pointer-events:auto}
  #previewPublisherPanel{transition:opacity .26s ease}          /* sanftes Ein-/Ausblenden beim Verlage-Panel-Ausklappen (statt hartem display-Pop) */
  .pubbox.list-collapsed #previewPublisherPanel{opacity:0; pointer-events:none}   /* nur die Liste blendet weg, die Überschriften bleiben; pointer-events:none → Klicks gehen an die Cover darunter */
  .vorschau-layout.cover-mode .panel-toggle{background:color-mix(in srgb, var(--bg, #f6f1e7) 86%, transparent); border-radius:9px}   /* dezenter Hintergrund → Überschriften über Covern lesbar */
  .panel-collapse{position:absolute; left:-34px; top:50%; transform:translateY(-50%); background:none; border:none; padding:4px; cursor:pointer; color:var(--muted); display:inline-flex; align-items:center; line-height:0}   /* links im Spalt, ohne die Überschriften zu verschieben (bleiben fix) */
  .panel-collapse[hidden]{display:none}   /* hidden-Attribut MUSS greifen (sonst überstimmt display:inline-flex es → Caret bleibt in Liste/Titelkarte sichtbar + klickbar = Bug) */
  .panel-collapse:hover{color:var(--accent)}
  .panel-collapse svg{width:22px; height:22px}
  .panel-collapse .disc-open{display:none}
  .panel-collapse.open .disc-closed{display:none}
  .panel-collapse.open .disc-open{display:inline}
  /* Durchgehend scrollbares Cover-Raster (Flow → Seite scrollt). Eingeklappt voll-bleed über die Verlagsspalte via NEGATIVEM
     margin-right (bläht die Spalte NICHT auf → Header/Icons statisch); margin-right animiert beim Ein-/Ausklappen. */
  .cover-grid{display:flex; flex-wrap:wrap; align-items:flex-end; align-content:flex-start; transition:margin-right .42s cubic-bezier(.4,0,.2,1)}
  .cover-grid .cover-month-head{flex-basis:100%; width:100%; margin:2px 0 0; align-self:flex-start; cursor:pointer}   /* Monats-Überschrift erzwingt Zeilenumbruch → Cover des Monats darunter; klickbar zum Ein-/Ausklappen. Abstand = Flex-Gap (22px)+2px ≈ Listenansicht (24px) */
  .cover-grid .cover-month-head:first-child{margin-top:0; padding-top:0}   /* wie die erste Listen-Überschrift (.grund-toggle+.grund-month nullt auch padding-top) → Text-Oberkante exakt gleich, sonst säße der Cover-Monat 2px tiefer */
  .cover-grid.with-head{margin-top:31px}   /* Cover-Oberkante 31px unter dem Header – exakt wie die Cover-Oberkante der ersten Karte in der Liste (kollabiert mit dem 18px-Toggle-Abstand) */
  .cover-grid.with-head.cover-months{margin-top:18px}   /* Monatsansicht: erster Monatskopf exakt auf gleicher Höhe wie in der Liste. Die Liste sitzt real 18px unter dem Toggle (.grund-toggle margin-bottom:18px + .grund-toggle+.grund-month margin-top:0) → hier auch 18px, NICHT 24px */
  /* FESTE HÖHE, native Breite → alle Cover gleiche Grundlinie, echtes Seitenverhältnis, nie beschnitten; Breiten dürfen variieren */
  .cover-cell{flex:none; padding:0; border:none; background:none; cursor:pointer; display:block; height:var(--cover-h,210px); min-width:calc(var(--cover-h,210px) * 0.6)}   /* flex:none → native Breite, nie gestaucht; min-width reserviert Platz, bis das Bild geladen ist (kein Zusammenfallen) */
  .cover-cell img{height:100%; width:auto; border-radius:3px; box-shadow:0 2px 9px rgba(0,0,0,.22); transition:transform .15s; display:block}   /* native Darstellung – keine Ränder, kein Beschnitt */
  .cover-cell:hover img{transform:translateY(-2px) scale(1.04)}
  /* „Im Ranking verortet": die GALERIE ruht auf dem gesuchten Titel. Alle anderen Cover treten zurück (ausgemilcht),
     der Treffer bleibt voll präsent + tritt mit Schatten/leichter Vergrößerung hervor (Spotlight statt nur Rähmchen). */
  .cover-grid.has-located .cover-cell{opacity:.28; filter:saturate(.55); transition:opacity .4s ease, filter .4s ease}
  .cover-grid.has-located .cover-cell.cover-located{opacity:1; filter:none}   /* KEIN transform/scale → das Zurücknehmen des Spotlights verschiebt nichts (Jan: „wenige Millimeter"-Sprung weg) */
  .cover-cell.cover-located img{box-shadow:0 0 0 2px var(--accent), 0 12px 30px rgba(0,0,0,.34)}
  .cover-cell.cover-located.no-cover{border-color:var(--accent); box-shadow:0 0 0 2px var(--accent), 0 12px 30px rgba(0,0,0,.34)}
  .cover-cell-fallback{display:none}
  .cover-cell.no-cover{height:var(--cover-h,210px); aspect-ratio:2/3; display:flex; align-items:center; justify-content:center; border:1px solid var(--line); border-radius:3px}   /* Platzhalter: gleiche Höhe, 2:3-Breite */
  .cover-cell.no-cover img{display:none}
  .cover-cell.no-cover .cover-cell-fallback{display:block; font-family:"Ingeborg Osf",Georgia,serif; font-size:13px; line-height:1.25; color:var(--muted); padding:8px 6px; text-align:center}
  /* Eigene Tags (frei vergeben) – gestrichelt abgesetzt, mit kleinem × zum Entfernen; „+" zum Hinzufügen */
  .tagpill.custom{display:inline-flex; align-items:center; padding:0}
  .tagpill.custom .tagpill-text{font:inherit; color:inherit; background:none; border:none; cursor:pointer; padding:5px 3px 5px 11px; line-height:1; text-decoration:none}
  .tagpill.custom .tagpill-x{font:inherit; color:var(--muted); background:none; border:none; cursor:pointer; padding:5px 9px 5px 3px; line-height:1; opacity:.55; text-decoration:none}
  .tagpill.custom:hover .tagpill-x{opacity:.8}
  .tagpill.custom .tagpill-x:hover{color:var(--bad); opacity:1}
  .tagadd{font-family:var(--paratext-font); font-size:14px; line-height:1; color:var(--muted); background:none; border:1px solid var(--line); border-radius:999px; padding:4px 10px; cursor:pointer; opacity:.55; text-decoration:none; transition:color .12s, border-color .12s, opacity .12s}
  .tagadd:hover{opacity:1; color:var(--accent); border-color:var(--accent)}
  .tagadd-input{font-family:var(--paratext-font); font-size:14px; line-height:1; border:1px solid var(--accent); border-radius:999px; padding:4px 11px; outline:none; width:140px; background:var(--panel); color:var(--text)}
  /* Notiz je Titel (Pro-Nutzer, nur Favoriten): Tag-Pille wie die anderen – gleiche Größe/Schrift, NICHT kursiv – einziger Unterschied ein ganz sanft roter Rahmen + Stift. */
  .tagpill.note{border-color:color-mix(in srgb, var(--accent) 42%, var(--line)); background:color-mix(in srgb, var(--accent) 6%, transparent); max-width:340px}
  .tagpill.note::before{content:"✎"; margin-right:5px; opacity:.6}
  .tagpill.note.note-empty::before{margin-right:0}
  .tagpill.note:hover{color:var(--accent); border-color:var(--accent)}
  .tagpill.note .note-txt{display:inline-block; max-width:290px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; vertical-align:bottom}
  .book-note-edit{display:block; width:100%; max-width:520px; margin-top:8px; font-family:var(--paratext-font); font-size:15px; line-height:1.4; color:var(--text); background:var(--panel); border:1px solid var(--accent); border-radius:9px; padding:8px 11px; outline:none; resize:vertical}
  /* Klappbare Schlagworte: kleines Klapp-Icon (wie Film-Ecke, nur kleiner) am Anfang jeder Tag-Gruppe; ein Klick wirkt global */
  .tags-caret{display:inline-flex; align-items:center; align-self:center; background:none; border:none; padding:0 1px; margin:0; cursor:pointer; color:var(--muted); opacity:.5; transition:opacity .12s, color .12s}
  .tags-caret:hover{opacity:1; color:var(--accent)}
  .tags-caret .disc{width:15px; height:15px; margin:0; vertical-align:middle}
  .tags-caret .disc-closed{display:none}            /* aufgeklappt → „offen"-Icon */
  .tags-caret .disc-open{display:inline-block}
  :root.tags-collapsed .tags-caret .disc-open{display:none}          /* eingeklappt → „zu"-Icon */
  :root.tags-collapsed .tags-caret .disc-closed{display:inline-block}
  :root.tags-collapsed .book-tags > :not(.tags-caret){display:none}  /* Pills und „+" verstecken, nur das Icon bleibt */
  .book-missing{color:var(--muted); font-style:italic}
  .bookitem .acts{display:flex; gap:4px; align-items:center; align-self:center; opacity:0; transition:opacity .12s}
  .bookitem:hover .acts{opacity:1}
  .bookstar.active{color:var(--accent)}
  .bookstar svg{width:18px; height:18px}
  @media(max-width:980px){.vorschau-layout,.favorites-layout{grid-template-columns:1fr; gap:34px} .vorschau-side,.favorites-side{max-width:720px}}
  @media(max-width:620px){.bookitem{padding-left:0; gap:11px} .book-date{width:78px; font-size:16.5px} .book-title{font-size:18.7px} .book-desc{font-size:17.1px}}
  .grid{display:grid; grid-template-columns:1fr 1fr; gap:76px}
  .col-list{order:1; padding-left:14px}     /* Termine links, etwas eingerückt */
  .col-input{order:2}                        /* Einladung + Kinostarts rechts */
  @media(max-width:860px){.grid{grid-template-columns:1fr; gap:28px} .col-list{padding-left:0} .col-list,.col-input{order:0}}
  h2{font-size:25.3px; font-variant-caps:small-caps; letter-spacing:1px; color:var(--text); margin:0 0 16px; font-weight:600}
  textarea{
    width:100%; min-height:230px; resize:vertical; background:var(--panel2); color:var(--text);
    border:none; border-radius:8px; padding:15px 16px; font-size:17.1px;
    font-family:inherit; line-height:1.6;
  }
  textarea:focus{outline:none; box-shadow:0 0 0 2px var(--line)}
  .row{display:flex; gap:8px; align-items:center; flex-wrap:wrap}
  .row.mt{margin-top:14px}
  button{
    background:none; color:var(--accent); border:none; padding:9px 3px;
    font-size:17.1px; font-weight:700; cursor:pointer; font-family:inherit;
    text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:4px;
    transition:opacity .12s;
  }
  button:hover{opacity:.6}
  button.ghost{background:none; color:var(--muted); padding:9px 6px; font-weight:400; text-decoration:none}
  button.ghost:hover{opacity:1; color:var(--text)}
  /* Ansicht-Umschalter Liste⇄Karte (von der Suche aus, keine eigene Nav-Seite) */
  .view-toggle{font:inherit; font-size:.84rem; color:var(--muted); background:none; border:1px solid var(--line); border-radius:7px; padding:4px 12px; cursor:pointer; white-space:nowrap; align-self:center; flex:0 0 auto}
  .view-toggle:hover{color:var(--text); border-color:var(--muted)}
  button.danger{background:none; color:var(--muted); font-weight:400; padding:9px 6px; text-decoration:none}
  button.danger:hover{color:var(--bad)}
  button.sm{padding:3px 5px; font-size:14.3px}
  .hint{color:var(--muted); font-size:14.9px; margin-top:10px; font-style:italic}
  .card{background:none; border:none; padding:0}
  .preview{margin-top:20px; display:none}
  .preview.show{display:block}
  .field{display:grid; grid-template-columns:84px 1fr; gap:10px; align-items:center; margin-bottom:8px}
  .field label{color:var(--muted); font-size:16px}
  .field input{
    background:var(--panel2); border:none; color:var(--text);
    border-radius:6px; padding:9px 12px; font-size:17.1px; width:100%; font-family:inherit;
  }
  .field input:focus{outline:none; box-shadow:0 0 0 2px var(--line)}
  .field textarea{background:var(--panel2); border:none; color:var(--text); border-radius:6px; padding:9px 12px; font-size:17.1px; width:100%; font-family:inherit; resize:vertical; line-height:1.4}
  .field textarea:focus{outline:none; box-shadow:0 0 0 2px var(--line)}
  .settings-hint{font-size:13.8px; color:var(--muted); line-height:1.4; margin:2px 0 4px}
  /* Einstellungen zweispaltig + Kontaktverwaltung */
  .settingscard.settings-wide{width:min(920px,100%)}
  .settings-cols{display:flex; gap:36px; align-items:flex-start}
  .settings-col{flex:1; min-width:0}
  .settings-col > .settings-title:first-child{margin-top:0}
  .settings-col .field{grid-template-columns:104px 1fr}                 /* Platz für „Lieferadresse" */
  .settings-col .field textarea{min-height:0}                          /* globalen textarea{min-height:230px} hier aufheben → folgt rows */
  @media(max-width:760px){ .settings-cols{flex-direction:column; gap:0} }
  .contacts-list{display:flex; flex-direction:column; gap:8px; margin:4px 0 6px; max-height:34vh; overflow:auto}
  .contact-row{display:grid; grid-template-columns:1fr 1fr 26px; gap:6px; border:1px solid var(--line); border-radius:8px; padding:8px}
  .contact-row .c-pub{grid-column:1/3; grid-row:1}
  .contact-row .c-del{grid-column:3; grid-row:1; align-self:start; justify-self:end; background:none; border:none; color:var(--muted); cursor:pointer; font-size:18px; line-height:1; padding:2px 4px; border-radius:6px}
  .contact-row .c-del:hover{color:var(--bad)}
  .contact-row .c-name{grid-column:1/2; grid-row:2}
  .contact-row .c-email{grid-column:2/4; grid-row:2}
  .contact-row .c-anrede{grid-column:1/4; grid-row:3}
  .contacts-list input{background:var(--panel2); border:none; border-radius:6px; padding:7px 9px; font-size:14.5px; width:100%; font-family:inherit; color:var(--text)}
  .contacts-list input:focus{outline:none; box-shadow:0 0 0 2px var(--line)}
  /* Anfrage-Kompose-Fenster (zweispaltig) */
  .settingscard.mailcard{width:min(940px,100%)}
  .mail-cols{display:flex; gap:30px; align-items:stretch}
  .mail-col-left{flex:0 0 320px; min-width:0; display:flex; flex-direction:column}
  .mail-col-right{flex:1; min-width:0; display:flex; flex-direction:column}
  .mail-col-right .mail-field-body{flex:1; display:flex; flex-direction:column}
  .mail-col-right .mail-field-body textarea{flex:1}
  @media(max-width:780px){ .mail-cols{flex-direction:column; gap:0} .mail-col-left{flex:1 1 auto} }
  .mail-picklist{max-height:42vh; overflow:auto; display:flex; flex-direction:column; gap:2px; margin:4px 0 14px; padding:2px 0}
  .mail-pickrow{display:flex; gap:9px; align-items:flex-start; padding:4px 2px; cursor:pointer}
  .mail-pickrow .mp-title{flex:1; min-width:0}
  .mail-pickrow .mp-meta{color:var(--muted); font-size:13.8px}
  .mail-field{margin:0 0 10px}
  .mail-field > label{display:block; color:var(--muted); font-size:14.5px; margin:0 0 5px}
  .mail-field > input, .mail-field > textarea{background:var(--panel2); border:none; color:var(--text); border-radius:8px; padding:10px 12px; font-size:16px; width:100%; font-family:inherit; line-height:1.45}
  .mail-field > textarea{resize:vertical; min-height:200px}
  .mail-field > input:focus, .mail-field > textarea:focus{outline:none; box-shadow:0 0 0 2px var(--line)}
  .mail-pickrow input[type=checkbox]{flex:none; width:16px; height:16px; margin:3px 0 0}
  .mailcard .settings-title{text-transform:none; font-variant-caps:small-caps; letter-spacing:.08em; font-size:22px; color:var(--text); font-weight:500}
  .mailcard #mailSend{font-weight:500; text-decoration:none; color:var(--text); border:1px solid var(--accent); border-radius:999px; padding:7px 20px}
  .mailcard #mailSend:hover{opacity:1; background:var(--accent); color:#fff}
  .mail-addrtoggle{display:flex; align-items:center; gap:8px; color:var(--muted); font-size:14.5px; margin:0 0 10px; cursor:pointer}
  .mail-addrtoggle input{flex:none; width:16px; height:16px; margin:0}
  .mail-pubsel{display:flex; align-items:center; gap:10px; margin:0 0 12px; flex-wrap:wrap}
  .mail-pubsel label{color:var(--muted); font-size:14.5px}
  .mail-pubsel select{background:var(--panel2); border:none; color:var(--text); border-radius:8px; padding:8px 12px; font-size:16px; font-family:inherit}
  .flag{display:inline-block; font-size:12.7px; color:var(--muted); margin-left:8px; font-style:italic; font-variant-caps:normal; letter-spacing:0}
  .berlinwarn{color:var(--warn); font-size:14.9px; font-style:italic}
  .berlinwarn:not(:empty){margin:0 0 12px}
  .flag.warn{color:var(--warn)}
  .flag.good{color:var(--good)}
  /* List */
  .daygroup{margin-bottom:34px}
  .dayhead{
    color:var(--accent); margin-bottom:10px; min-height:28px;
    display:flex; justify-content:space-between; align-items:baseline; gap:12px;
  }
  .dayhead .date{font-size:23.1px; font-style:italic; font-weight:700; font-feature-settings:"swsh" 1,"calt" 1,"onum" 1; line-height:1.1}
  .dayhead .cnt{color:var(--muted); font-weight:400; font-size:15.4px; font-style:italic; white-space:nowrap}
  .archivebox{margin-top:38px}
  .archivehead{cursor:pointer; color:var(--accent); font-size:14.3px; text-transform:uppercase; letter-spacing:1.3px; font-weight:600; margin-bottom:14px}
  .archivehead:hover{opacity:.8}
  .archivebox .daygroup{opacity:.6}
  .archive-clear{margin-top:12px; font-size:14.9px}
  .item{display:flex; align-items:baseline; gap:16px; padding:10px 0 10px 18px; min-height:58px}
  .item .time{font-weight:600; min-width:72px; color:var(--muted); font-size:20px}
  .item .meta{flex:1; min-width:0; display:flex; flex-direction:column; justify-content:center}
  .item .title{font-weight:600; font-size:20px; line-height:1.3; cursor:pointer; display:inline-block; position:relative; top:1px}
  .item .title:hover{opacity:.65}
  .item .cinema{color:var(--muted); font-size:18.7px; margin-top:5px; line-height:1.5}
  .item .cinema .rev{color:var(--accent); font-weight:600}
  .item .cinema .emb{color:var(--warn); font-style:italic}
  .item.justfound{animation:pvflash 1.6s ease; border-radius:8px}
  @media(max-width:760px){ .item{gap:10px; padding-left:0} .item .time{min-width:56px} }
  @keyframes pvflash{0%{background:rgba(138,31,31,.13)}100%{background:transparent}}
  .conflict-flag{color:var(--bad); font-size:13.8px; font-style:italic; margin-left:9px; white-space:nowrap}
  .conflict-flag::before{content:"△ "}
  .item .acts{display:flex; gap:4px; align-items:center; align-self:center; opacity:0; transition:opacity .12s}
  .item:hover .acts{opacity:1}
  .empty{color:var(--muted); text-align:center; padding:40px 0; font-size:15.4px; font-style:italic}
  .preview-empty{font-family:var(--paratext-font); font-size:23px; text-align:left; padding:18px 0}
  .preview-empty-ex{display:block; margin-top:12px; font-size:16px; font-style:normal; opacity:.7; line-height:1.5}
  /* Fehlersuche-Leiste */
  .problem-bar{margin:4px 0 18px; padding:14px 16px; background:var(--panel2); border:1px solid var(--line); border-radius:12px}
  .problem-head{display:flex; align-items:baseline; justify-content:space-between; gap:12px; font-family:var(--paratext-font); font-size:18px}
  .problem-exit{background:none; border:none; color:var(--accent); cursor:pointer; font-family:var(--paratext-font); font-size:15px}
  .problem-exit:hover{text-decoration:underline}
  .problem-chips{display:flex; flex-wrap:wrap; gap:8px; margin-top:11px}
  .problem-fix{font-family:var(--paratext-font); font-size:15px; color:var(--text); background:var(--panel); border:1px solid var(--line); border-radius:999px; padding:6px 13px; cursor:pointer}
  .problem-fix:hover{border-color:var(--accent); color:var(--accent)}
  .problem-fix.paid{border-style:dashed}
  .problem-hint{margin-top:10px; font-family:var(--paratext-font); font-size:13px; color:var(--muted); opacity:.8}
  .book-problem{display:block; margin-top:6px; font-family:var(--paratext-font); font-size:13.5px; color:var(--muted)}
  .problem-solve{font-family:var(--paratext-font); font-size:13.5px; color:var(--accent); background:none; border:none; cursor:pointer; text-decoration:underline; padding:0 0 0 4px}
  .problem-solve:hover{opacity:.8}
  .toolbar{display:flex; gap:6px; align-items:baseline; margin-bottom:14px; flex-wrap:wrap}
  .toolbar button{line-height:1.4}
  .count{color:var(--muted); font-size:16.5px; font-style:italic; display:block; margin:0 0 14px}
  .filestatus{font-size:15.4px; color:var(--muted); margin:6px 0 0; display:none; gap:8px; align-items:center; flex-wrap:wrap}
  .settings-status{font-size:15.4px; color:var(--muted); margin:6px 0 0; min-height:20px; font-style:italic}
  .filestatus.show{display:flex}
  /* Kalender */
  .calendar-view{padding-top:2px}
  .calendar-top{display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:20px}
  .calendar-title{font-size:37.4px; line-height:1.05; font-style:italic; font-weight:700; color:var(--accent); font-feature-settings:"swsh" 1,"calt" 1,"onum" 1}
  .calendar-actions{display:flex; align-items:center; gap:8px; flex-wrap:wrap; justify-content:flex-end}
  .calendar-actions button{line-height:1.2}
  button.iconbtn{width:34px; height:34px; padding:0; display:inline-flex; align-items:center; justify-content:center; text-decoration:none; border-radius:50%; position:relative; overflow:visible}
  button.iconbtn:hover{background:var(--panel2); color:var(--text); opacity:1}
  button.iconbtn svg{width:18px; height:18px}
  button.iconbtn.sm{width:28px; height:28px; padding:0}
  .iconbtn[data-tip]:hover::after,
  .iconbtn[data-tip]:focus-visible::after{opacity:1; transform:translate(-50%,0)}
  .iconbtn[data-tip]::after{
    content:attr(data-tip); position:absolute; left:50%; bottom:calc(100% + 5px);
    opacity:0; pointer-events:none; transform:translate(-50%,2px);
    transition:opacity .08s ease, transform .08s ease; z-index:90;
    color:var(--muted); font-size:13.8px; line-height:1.1; font-weight:600;
    font-style:italic; white-space:nowrap; text-shadow:0 1px 0 var(--bg);
  }
  /* Kalender: nur Buttons, keine Hover-Tooltips (kollidieren in der schmalen Spalte) */
  .calendar-view .iconbtn[data-tip]::after{content:none}
  .vorschau-view .iconbtn[data-tip]::after{content:none}
  .calicon{display:block; width:18px; height:18px}
  .railbtn .calicon{width:36px; height:36px}
  .icontext{display:inline-flex; align-items:center; gap:6px; text-decoration:inherit}
  .icontext .calicon{width:16px; height:16px}
  .calendar-layout{display:grid; grid-template-columns:minmax(0,1fr) minmax(250px,310px); gap:34px; align-items:start}
  .calendar-board{border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
  .calendar-weekdays{display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); color:var(--muted); font-size:13.2px; letter-spacing:1.1px; text-transform:uppercase; font-weight:600; border-bottom:1px solid var(--line)}
  .calendar-weekdays span{padding:9px 8px 8px}
  .calendar-grid{display:grid; grid-template-columns:repeat(5,minmax(0,1fr))}
  .calendar-day{min-height:118px; padding:9px 8px 10px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); cursor:pointer; outline:none; transition:background .14s, color .14s}
  .calendar-day:nth-child(5n){border-right:none}
  .calendar-day:nth-last-child(-n+5){border-bottom:none}
  .calendar-day:hover,.calendar-day:focus{background:var(--panel2)}
  .calendar-day.out{color:var(--muted); opacity:.55}
  .calendar-day.past .cal-num{color:var(--muted); font-weight:600}
  .calendar-day.past .cal-event{opacity:.5}
  .calendar-day.selected{background:rgba(138,31,31,.07); box-shadow:inset 0 0 0 1px var(--accent)}
  .calendar-day.today .cal-num{color:var(--accent)}
  .calendar-day.today .cal-num::after{content:""; display:inline-block; width:5px; height:5px; border-radius:50%; background:var(--accent); margin-left:6px; vertical-align:middle}
  .cal-head{display:flex; justify-content:space-between; gap:8px; align-items:baseline; min-height:23px}
  .cal-num{font-size:17.1px; font-weight:700; font-feature-settings:"onum" 1}
  .cal-count{color:var(--muted); font-size:13.2px; font-style:italic; white-space:nowrap}
  .cal-event{display:flex; align-items:baseline; gap:5px; margin-top:8px; color:var(--text); font-size:16px; font-weight:700; line-height:1.25; white-space:nowrap; overflow:hidden; text-decoration:none; pointer-events:none}
  .cal-event .cal-time{color:var(--accent); font-weight:700; flex:none; font-feature-settings:"onum" 1}
  .cal-event .cal-title{min-width:0; overflow:hidden; text-overflow:ellipsis}
  .cal-event.past{color:var(--text)}
  .cal-more{display:block; margin-top:6px; color:var(--muted); font-size:13.8px; font-style:italic}
  .cal-mobile-count{display:none}
  .calendar-details{border-top:1px solid var(--line)}
  .cal-detail-date{padding:12px 0 10px; color:var(--accent); font-size:23.1px; font-style:italic; font-weight:700; line-height:1.2; font-feature-settings:"swsh" 1,"calt" 1,"onum" 1}
  .cal-detail-item{padding:12px 0; border-top:1px solid var(--line)}
  .cal-detail-time{display:block; color:var(--muted); font-weight:700; font-size:16.5px; margin-bottom:2px; font-feature-settings:"onum" 1}
  .cal-detail-title{font-size:19.8px; font-weight:700; cursor:pointer; line-height:1.25}
  .cal-detail-title:hover{color:var(--accent)}
  .cal-detail-meta{color:var(--muted); font-size:16px; margin-top:4px}
  .cal-detail-actions{display:flex; gap:8px; margin-top:4px}
  .cal-empty{color:var(--muted); font-style:italic; font-size:15.4px; padding:18px 0; border-top:1px solid var(--line)}
  @media(max-width:920px){.calendar-layout{grid-template-columns:1fr; gap:24px} .calendar-details{max-width:620px}}
  @media(max-width:760px){.calendar-top{align-items:flex-start; flex-direction:column} .calendar-title{font-size:30.8px} .calendar-actions{justify-content:flex-start}}
  @media(max-width:560px){.calendar-weekdays span{padding:8px 3px; text-align:center} .calendar-day{min-height:62px; padding:7px 4px} .cal-head{justify-content:center; min-height:18px} .cal-count{display:none} .cal-event{display:none} .cal-more{display:none} .cal-mobile-count{display:block; text-align:center; color:var(--accent); font-size:12.7px; font-style:italic; margin-top:5px}}
  /* Einstellungs-Panel (Datei-Block) */
  .settingslayer{position:fixed; inset:0; z-index:70; display:flex; justify-content:center; align-items:flex-start; padding:6vh 24px 6vh; overflow-y:auto; background:var(--overlay); backdrop-filter:blur(6px) saturate(1.04); -webkit-backdrop-filter:blur(6px) saturate(1.04); opacity:0; pointer-events:none; transition:opacity .3s ease}
  .settingslayer.show{opacity:1; pointer-events:auto}
  .settingscard{width:min(460px,100%); max-height:88vh; overflow-y:auto; background:var(--bg); border:1px solid var(--line); border-radius:16px; box-shadow:0 24px 60px -22px rgba(0,0,0,.3),0 4px 14px -6px rgba(0,0,0,.12); padding:28px 32px 30px; font-family:"Marie TRIAL","Marie",Georgia,"Times New Roman",serif; transform:translateY(20px); opacity:0; transition:transform .32s cubic-bezier(.22,.61,.36,1), opacity .3s ease}
  .settingslayer.show .settingscard{transform:none; opacity:1}
  .settings-title{font-size:16px; font-weight:500; letter-spacing:.07em; font-variant-caps:small-caps; text-transform:none; color:var(--text); margin:26px 0 9px}
  .settings-subtitle{font-size:12.7px; font-variant-caps:small-caps; letter-spacing:.06em; color:var(--muted); margin:13px 0 2px}
  .settingscard > .settings-title:first-child{margin-top:0}
  .isbncard{width:min(620px,100%)}
  .isbn-hint{color:var(--muted); font-size:14px; margin:-6px 0 10px}
  .isbnlist{max-height:56vh; overflow:auto; display:flex; flex-direction:column; gap:3px; margin-bottom:14px}
  .isbnrow{display:flex; align-items:center; gap:12px; padding:8px 6px; border-radius:9px; cursor:pointer}
  .isbnrow:hover{background:var(--panel2)}
  .isbnrow input{flex:none; margin:0}
  .isbnrow-cover{flex:none; width:34px; height:50px; object-fit:contain; border-radius:2px; box-shadow:0 1px 3px rgba(0,0,0,.2); background:var(--panel2)}
  .isbnrow-main{display:flex; flex-direction:column; gap:2px; min-width:0}
  .isbnrow-title{color:var(--text); font-size:16px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
  .isbnrow-meta{color:var(--muted); font-size:13px; font-variant-numeric:tabular-nums; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
  .isbnrow-flag{font-size:11px; color:var(--bad); border:1px solid var(--bad); border-radius:6px; padding:1px 5px; margin-left:6px; vertical-align:1px}
  .snapshot-list{display:flex; flex-direction:column; gap:2px; margin:4px 0 2px}
  .snaprow{display:flex; align-items:baseline; gap:10px; padding:3px 0; font-size:14.5px; color:var(--text)}
  .snaprow .snap-main{flex:1; min-width:0; color:var(--muted)}
  .snaprow .snap-count{font-variant-numeric:tabular-nums}
  .snaprow button{padding:2px 0; font-size:14.5px; font-weight:400; text-decoration:none; color:var(--text)}
  .snaprow button:hover{opacity:1; color:var(--accent)}
  .isbn-actions{flex-direction:row; gap:8px}
  .settingscard .toolbar{flex-direction:row; flex-wrap:wrap; align-items:baseline; gap:6px 20px; margin-bottom:2px}
  .settingscard .toolbar button, .settingscard .toolbar button.ghost{padding:2px 0; font-size:18.5px; line-height:1.35; text-decoration:none; font-weight:400; color:var(--text)}
  .settingscard .toolbar button:hover{opacity:1; color:var(--accent)}
  .settingscard .settings-status{font-size:15.4px; color:var(--muted); margin:5px 0 0; min-height:0}
  .settingscard .filestatus{font-size:15.4px; margin:5px 0 0}
  /* Themenwahl (Warm · Kühl · Dunkel) */
  .seg{display:inline-flex; border:1px solid var(--line); border-radius:11px; overflow:hidden; margin-top:4px}
  .seg-btn{background:none; border:none; border-right:1px solid var(--line); padding:8px 18px; font-family:inherit; font-size:16.5px; font-weight:400; color:var(--muted); cursor:pointer; text-decoration:none; transition:color .12s, background .12s}
  .seg-btn:last-child{border-right:none}
  .seg-btn:hover{opacity:1; color:var(--text)}
  .seg-btn.active{background:var(--panel2); color:var(--accent)}
  .filestatus .dot{width:7px; height:7px; border-radius:50%; background:var(--good); flex:none}
  .filestatus .dot.warn{background:var(--warn)}
  .filestatus .fname{color:var(--text); font-weight:600}
  .filestatus a{color:var(--muted); cursor:pointer; text-decoration:underline; text-underline-offset:2px}
  .filestatus a:hover{color:var(--text)}
  .toast{
    position:fixed; bottom:24px; left:50%; transform:translateX(-50%) translateY(20px);
    background:var(--text); color:var(--bg); padding:11px 20px; border-radius:6px; font-weight:600;
    opacity:0; transition:all .25s; pointer-events:none; font-size:15.4px;
  }
  .toast.show{opacity:1; transform:translateX(-50%) translateY(0)}
  .editrow input{
    background:var(--panel2); border:none; color:var(--text);
    border-radius:5px; padding:6px 9px; font-size:14.9px; font-family:inherit;
  }
  .editrow input:focus{outline:none; box-shadow:0 0 0 2px var(--line)}
  .mrow{padding:5px 0; align-items:center}
  .mrow .m_chk{width:16px; height:16px; accent-color:var(--accent); flex:none; cursor:pointer}
  #multiList .mrow:not(:last-child){border-bottom:1px solid var(--line)}
  .tipps-toggle[aria-expanded="true"]{color:var(--text)}
  .help-body{margin:4px 0 6px; color:var(--muted); font-size:15.4px}
  .help-body[hidden]{display:none}
  .help-body ul{margin:0; padding-left:18px}
  .help-body li{margin-bottom:4px}
  /* Kinostarts-Panel (klappbar) */
  .startsbox{margin-top:36px}
  .starts-summary{cursor:pointer; color:var(--text); font-size:25.3px; font-variant-caps:small-caps; letter-spacing:1px; font-weight:600}
  .starts-summary:hover{opacity:.8}
  /* Auf-/Zuklapp-Icon (Kinostarts, Wochen & Archiv) statt Standard-Dreieck */
  .starts-summary, .archivehead, .startweek-summary{list-style:none}
  .starts-summary::-webkit-details-marker, .archivehead::-webkit-details-marker, .startweek-summary::-webkit-details-marker{display:none}
  .disc{width:1em; height:1em; flex:none; color:var(--muted); vertical-align:-0.16em; margin-right:9px}
  .disc-open{display:none}
  details[open] > summary .disc-closed{display:none}
  details[open] > summary .disc-open{display:inline-block}
  #startsList{margin-top:0}
  .starts-stand{font-weight:400; font-style:italic; text-transform:none; font-variant-caps:normal; letter-spacing:0; color:var(--muted); font-size:13.8px; margin-left:8px}
  .starts-date{margin:16px 0 10px; font-size:23.1px; font-style:italic; font-weight:700; color:var(--accent); font-feature-settings:"swsh" 1,"calt" 1,"onum" 1; cursor:pointer; line-height:1.1}
  .starts-date:hover{opacity:.7}
  .weekfocus{display:flex; flex-direction:column; gap:13px}
  .wf-item{display:flex; gap:14px; align-items:baseline}
  .wf-date{flex:none; min-width:64px; font-weight:600; color:var(--accent); font-size:16.5px; font-feature-settings:"onum" 1}
  .wf-main{min-width:0}
  .wf-main a{font-weight:600; font-size:18.2px; color:var(--text); text-decoration:none}
  .wf-main a:hover{text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px}
  .wf-crew{display:block; color:var(--muted); font-size:15.4px; margin-top:1px}
  .starts-date.wk{margin-top:26px}
  .start-item{padding:6px 0 6px 18px; min-height:40px; display:flex; align-items:baseline; cursor:pointer}
  .start-item, .start-item *{text-decoration:none !important}
  .start-title{display:block; position:relative; top:1px; font-weight:600; font-size:20px; line-height:1.28}
  .start-item:hover{opacity:.7}
  .starts-empty{color:var(--muted); font-style:italic; font-size:15.4px; margin-top:10px}
  /* Einzeln klappbare Wochen */
  .startweek{margin-top:14px}
  .startweek-summary{cursor:pointer; display:flex; align-items:center; color:var(--accent); font-size:23.1px; font-style:italic; font-weight:700; font-feature-settings:"swsh" 1,"calt" 1,"onum" 1; line-height:1.1}
  .startweek-summary:hover{opacity:.85}
  .startweek-cnt{color:var(--muted); font-weight:400; font-style:normal; font-size:14.3px; margin-left:10px}
  .startweek-body{margin-top:4px; margin-bottom:6px}
  .start-day{flex:none; min-width:70px; color:var(--muted); font-size:15.4px; font-feature-settings:"onum" 1}
  .start-item.inlist .start-title{color:var(--accent)}
  /* Suche */
  .search{display:flex; align-items:center; gap:7px; margin-left:auto; align-self:flex-end; margin-bottom:10px; position:relative; color:var(--muted)}
  .search:focus-within{color:var(--accent)}
  .search-ic{flex:none; opacity:.85; width:18px; height:18px}   /* Lupe etwas größer – betont die herausgehobene Suche */
  #searchInput{
    font-family:"Ingeborg Osf",Georgia,serif; font-size:20.5px; color:var(--text);
    background:transparent; border:none; border-bottom:1.5px solid var(--searchline);
    padding:5px 2px 5px 0; min-width:200px; outline:none; font-feature-settings:"onum" 1;
  }
  #searchInput::placeholder{color:var(--muted); font-style:italic; opacity:.9}
  #searchInput:focus{border-bottom-color:var(--accent)}
  .suggest{
    position:absolute; top:100%; right:0; left:auto; margin-top:8px;
    min-width:min(440px,84vw); background:var(--bg); border:1px solid var(--line);
    border-radius:11px; box-shadow:0 16px 38px -16px rgba(0,0,0,.24); padding:5px;
    z-index:55; display:none; max-height:320px; overflow:auto; color:var(--text);
  }
  .suggest.show{display:block}
  .suggest-item{padding:8px 11px; border-radius:7px; cursor:pointer; display:flex; justify-content:space-between; align-items:baseline; gap:12px}
  .suggest-item:hover, .suggest-item.active{background:var(--panel2)}
  .suggest-item .si-title{font-size:17.6px; font-weight:600}
  .suggest-item .si-tag{font-size:12.7px; color:var(--muted); font-style:italic; white-space:nowrap; flex:none}
  .suggest-empty{padding:9px 11px; color:var(--muted); font-style:italic; font-size:15.4px}
  /* Fokus-Ansicht (milchiger Hintergrund + aufsteigende Trefferkarte) */
  .focuslayer{
    position:fixed; inset:0; z-index:60; display:flex; justify-content:center; align-items:flex-start;
    padding:7vh 24px 28px; background:var(--overlay);
    backdrop-filter:blur(6px) saturate(1.04); -webkit-backdrop-filter:blur(6px) saturate(1.04);
    opacity:0; pointer-events:none; transition:opacity .4s cubic-bezier(.22,.61,.36,1);
  }
  .focuslayer.show{opacity:1; pointer-events:auto}
  .focuscard{
    width:min(680px,100%); background:var(--bg); border:1px solid var(--line); border-radius:14px;
    box-shadow:0 26px 64px -22px rgba(0,0,0,.3), 0 4px 14px -6px rgba(0,0,0,.12);
    padding:30px 34px 30px; transform:translateY(36px) scale(.985); opacity:0;
    transition:transform .46s cubic-bezier(.22,.61,.36,1), opacity .4s ease;
  }
  .focuslayer.show .focuscard{transform:translateY(0) scale(1); opacity:1}
  .focus-title{font-size:33px; font-style:italic; font-weight:700; line-height:1.16; margin:0 0 8px; font-feature-settings:"swsh" 1,"calt" 1,"onum" 1}
  .focus-links{margin:0 0 20px; font-size:15.4px}
  .focus-links a{color:var(--accent); text-decoration:none; font-weight:600}
  .focus-links a:hover{text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px}
  .focus-cols{display:grid; grid-template-columns:1fr 1fr; gap:28px}
  @media(max-width:560px){.focus-cols{grid-template-columns:1fr; gap:20px}}
  .focus-label{font-size:13.2px; text-transform:uppercase; letter-spacing:1.1px; color:var(--accent); font-weight:600; margin-bottom:9px}
  .focus-pv{margin-bottom:13px}
  .fpv-when, .fr-date{display:block; font-weight:600; font-size:18.7px; font-feature-settings:"onum" 1}
  .fpv-where{display:block; color:var(--muted); font-size:17.1px; margin-top:2px}
  .fpv-where .rev{color:var(--accent); font-weight:600}
  .fpv-where .emb{color:var(--warn); font-style:italic}
  .fr-crew{display:block; color:var(--muted); font-size:16px; margin-top:3px}
  .focus-none{color:var(--muted); font-style:italic; font-size:16px}
  .focus-extras{margin-top:18px; font-size:16.5px}
  .focus-extras .fx-label{color:var(--accent); font-weight:600; margin-right:5px}
  .focus-extras .fx-sep{color:var(--muted); margin:0 6px}
  .focus-hint{margin-top:24px; font-size:13.8px; color:var(--muted); font-style:italic}
  @media(max-width:560px){.search{width:100%; margin:10px 0 0; align-self:auto}}

/* === Login-Screen – schwebende Karte auf durchgehendem Hintergrund === */
#pvLoginOverlay{position:fixed; inset:0; z-index:10000; display:flex; align-items:center; justify-content:center; padding:32px; overflow:auto;
  background:radial-gradient(1100px 720px at 27% 16%, #FBF4EA 0%, #F1E3D3 52%, #ECDAC8 100%)}
#pvLoginOverlay .pv-login-split{display:flex; gap:26px; width:100%; max-width:1060px; min-height:min(600px,82vh); max-height:92vh;
  background:#fff; border-radius:28px; box-shadow:0 28px 70px rgba(120,70,40,.20); padding:18px; overflow:hidden}
#pvLoginOverlay .pv-login-art{position:relative; flex:0 0 44%; border-radius:18px; overflow:hidden; background:#EAD4C9}
#pvLoginOverlay .pv-login-covers{position:absolute; inset:0; display:grid; grid-template-columns:repeat(3,1fr); grid-template-rows:repeat(4,1fr)}
#pvLoginOverlay .pv-login-covers img{width:100%; height:100%; object-fit:cover; display:block}
#pvLoginOverlay .pv-login-panel{position:relative; flex:1 1 56%; display:flex; align-items:center; justify-content:center; padding:24px 44px}
#pvLoginOverlay .pv-login-col{display:flex; flex-direction:column; align-items:flex-start}
#pvLoginOverlay .pv-login-mast{text-align:left; margin:0 0 30px}
#pvLoginOverlay .pv-login-brand{display:table; font-family:"Ingeborg Block","Ingeborg Osf",Georgia,serif; font-size:70px; line-height:.92; letter-spacing:.04em; font-feature-settings:"onum" 1; color:var(--text,#1A1A1A); margin:0; white-space:nowrap}
#pvLoginOverlay .pv-login-claim{display:table; font-family:"Ingeborg Osf",Georgia,serif; font-style:italic; font-size:22px; line-height:1.2; color:var(--accent,#8A1F1F); margin:8px 0 0; white-space:nowrap}
#pvLoginOverlay .pv-login-inner{position:relative; width:370px; max-width:100%}
#pvLoginOverlay .pv-login-x{position:absolute; top:-14px; right:-8px; width:36px; height:36px; border:none; background:none; font-size:26px; line-height:1; color:var(--muted,#6E655D); cursor:pointer; border-radius:8px}
#pvLoginOverlay .pv-login-x:hover{background:rgba(0,0,0,.05); color:var(--text,#1A1A1A)}
#pvLoginOverlay .pv-login-h{font-family:"Ingeborg Osf",Georgia,serif; font-size:27px; line-height:1.05; color:var(--accent,#8A1F1F); margin:0 0 26px}
#pvLoginOverlay .pv-login-sub{color:var(--muted,#6E655D); font-size:17px; line-height:1.5; margin:0 0 28px}
#pvLoginOverlay .pv-login-label{display:block; font-size:17px; font-weight:600; color:var(--text,#1A1A1A); margin:0 0 8px; letter-spacing:.2px}
#pvLoginOverlay .pv-login-field{display:flex; align-items:center; gap:9px; background:#fff; border:1px solid var(--line,#E6DBCF); border-radius:11px; padding:0 13px; transition:border-color .15s,box-shadow .15s}
#pvLoginOverlay .pv-login-field:focus-within{border-color:var(--accent,#8A1F1F); box-shadow:0 0 0 3px rgba(138,31,31,.10)}
#pvLoginOverlay .pv-login-field svg{width:20px; height:20px; color:var(--muted,#6E655D); flex:0 0 auto}
#pvLoginOverlay .pv-login-field input{flex:1; border:none; outline:none; background:none; padding:14px 0; font-size:16.5px; color:var(--text,#1A1A1A); font-family:inherit}
#pvLoginOverlay .pv-login-btn{width:100%; margin-top:18px; padding:15px; border:none; border-radius:11px; background:var(--accent,#8A1F1F); color:#fff; font-size:18px; font-weight:600; text-decoration:none; cursor:pointer; transition:opacity .15s,transform .05s; font-family:inherit}
#pvLoginOverlay .pv-login-btn:hover{opacity:.92}
#pvLoginOverlay .pv-login-btn:active{transform:translateY(1px)}
#pvLoginOverlay .pv-login-btn:disabled{opacity:.55; cursor:default}
#pvLoginOverlay .pv-login-status{margin-top:16px; font-size:14.5px; line-height:1.45; min-height:20px; color:var(--muted,#6E655D)}
#pvLoginOverlay .pv-login-status.ok{color:#2f6b3a}
#pvLoginOverlay .pv-login-status.err{color:var(--accent,#8A1F1F)}
#pvLoginOverlay .pv-login-field + .pv-login-label{margin-top:16px}   /* Abstand E-Mail-Feld → Passwort-Label */
#pvLoginOverlay .pv-login-forgot{text-align:right; margin-top:11px}
#pvLoginOverlay .pv-login-forgot button{background:none; border:none; padding:2px 0; color:var(--accent,#8A1F1F); font-size:14.5px; text-decoration:underline; text-underline-offset:2px; cursor:pointer; font-family:inherit}
#pvLoginOverlay .pv-login-forgot button:hover{opacity:.75}
@media (max-width:720px){
  #pvLoginOverlay{padding:14px}
  #pvLoginOverlay .pv-login-split{flex-direction:column; gap:16px; min-height:0; max-height:none; border-radius:22px; padding:14px}
  #pvLoginOverlay .pv-login-art{flex:0 0 190px}
  #pvLoginOverlay .pv-login-panel{padding:12px 14px 20px; flex-direction:column; align-items:stretch; justify-content:flex-start}
  #pvLoginOverlay .pv-login-col{width:100%; align-items:stretch}
  #pvLoginOverlay .pv-login-mast{margin:4px 0 20px}
  #pvLoginOverlay .pv-login-brand{font-size:46px}
  #pvLoginOverlay .pv-login-inner{margin:0 auto}
}

/* === Nicht-Admin (Web-Nutzer): Film, Import, Datei-Verknüpfung, Admin-Werkzeuge ausblenden (UI-Ebene; Absicherung = Daemon-Token-Gate).
   Klasse liegt (frühes <head>-Script) auf <html> → greift VOR dem ersten Paint, kein Aufblitzen. Daher .pv-user statt body.pv-user. === */
.pv-user #navPV,
.pv-user #navCalendar,
.pv-user #pvView,
.pv-user header #search,
.pv-user .vfs-reminder,
.pv-user .import-wrap,
.pv-user #previewImportStatus,
.pv-user #previewPdfStatus,
.pv-user .settingslayer .admin-only{ display:none !important; }
/* #pvView (Film) ist im HTML default-active → für Web-Nutzer generell aus, sonst blitzt der leere Filmteil vor dem Umschalten auf den Buchteil kurz auf. */
/* Einstellungen bleiben für User erreichbar (Darstellung, Schrift, Absender, Abmelden) – nur der Admin-Block darin ist weg. */

/* Sicherung: Web-User bekommen IMMER Marie als Paratext – egal was in ihrem Browser (font-ingeborg) steht.
   body ist näher als :root, überstimmt daher :root.font-ingeborg für alles im Sichtbereich. */
body.pv-user{ --paratext-font:"Marie",Georgia,"Times New Roman",serif; }

/* Konto/Abmelden nur zeigen, wenn tatsächlich eingeloggt (Magic-Link-Session aktiv). */
.auth-only{ display:none; }
body.pv-authed .auth-only{ display:block; }
body.pv-authed .toolbar.auth-only{ display:flex; }
