/* heyFinley – Grund-Stylesheet (Prototyp) */
/* DSGVO: keine externen Requests, Schriften später self-hosted. */

:root{
  --bg:#f3f5f0;
  --card:#ffffff;
  --border:#e7eae3;
  --ink:#242a25;
  --muted:#8a918a;
  --green:#4f9068;          /* Akzent / Buttons / Logo */
  --green-strong:#3f7d59;
  --green-ink:#2f7a57;      /* Titel der Treffer */
  --green-soft:#e9f1ea;     /* Chips / Badges */
  --green-softer:#eef4ee;
  --radius:16px;
  --radius-lg:26px;
  --shadow:0 1px 2px rgba(30,40,32,.04), 0 8px 30px rgba(30,40,32,.05);
  font-synthesis:none;
}

*{box-sizing:border-box}
html,body{margin:0;overflow-x:hidden;max-width:100%}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  padding-bottom:120px;           /* Platz für Bottom-Bar */
}

/* Kopfzeile */
.topbar{
  display:flex;align-items:center;justify-content:space-between;
  padding:22px 34px;
}
.brand{display:flex;align-items:center;gap:12px;font-weight:800;font-size:20px;letter-spacing:-.01em}
.brand .logo{
  width:38px;height:38px;border-radius:11px;background:var(--accent,var(--green));
  color:#fff;display:grid;place-items:center;font-weight:800;font-size:18px;
}
.brand .lo{color:var(--ink)} .brand .hi{color:var(--accent,var(--green-strong))}
.topbar-center{flex:1;display:flex;justify-content:center;min-width:0}
.topbar-right{display:flex;align-items:center;gap:12px}
.userchip{
  background:rgba(0,0,0,.05);color:var(--accent,var(--green-strong));font-weight:700;font-size:14px;
  padding:9px 16px;border-radius:999px;white-space:nowrap;
}
.btn{
  border:0;cursor:pointer;font:inherit;font-weight:700;
  background:var(--accent,var(--green));color:#fff;border-radius:999px;padding:11px 22px;text-decoration:none;
}
.btn.ghost{background:var(--accent,var(--green));}

/* Header-Mitte: seiten-eigene Suche (z. B. PlaudR) */
.hsearch{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--border);
  border-radius:999px;padding:7px 8px 7px 16px;width:min(440px,100%);box-shadow:var(--shadow)}
.hsearch .ico{color:var(--muted);font-size:16px}
.hsearch input{border:0;outline:0;font:inherit;font-size:15px;background:transparent;flex:1;color:var(--ink)}
.hsearch input::placeholder{color:#aeb4ad}

/* Zentrale Spalte */
.wrap{max-width:820px;margin:0 auto;padding:0 24px}

.hero{text-align:center;padding:26px 0 4px}
.netzbadge{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--green-soft);color:var(--green-strong);
  padding:7px 15px;border-radius:999px;font-size:13px;font-weight:600;margin-bottom:22px;
}
.hero h1{
  font-size:56px;line-height:1.04;letter-spacing:-.025em;margin:0 0 16px;font-weight:800;color:var(--ink);
}
.hero p.sub{color:var(--muted);max-width:520px;margin:0 auto;font-size:17px}

/* Suchleiste */
.searchbar{
  display:flex;align-items:center;gap:10px;background:var(--card);
  border:1px solid var(--border);box-shadow:var(--shadow);
  border-radius:999px;padding:9px 9px 9px 22px;margin:30px 0 10px;
}
.searchbar .ico{color:var(--muted);font-size:18px}
.searchbar input{
  flex:1;border:0;outline:0;font:inherit;font-size:17px;background:transparent;color:var(--ink);
}
.searchbar input::placeholder{color:#aeb4ad}
.searchbar button{
  border:0;cursor:pointer;font:inherit;font-weight:700;color:#fff;background:var(--green);
  border-radius:999px;padding:12px 26px;
}

.result-count{color:var(--muted);font-size:13px;margin:14px 4px 10px}

/* Trefferkarten */
.card{
  background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);
  box-shadow:var(--shadow);padding:22px 26px;margin-bottom:18px;text-decoration:none;color:inherit;display:block;
  transition:box-shadow .15s ease, transform .15s ease;
}
.card:hover{box-shadow:0 2px 6px rgba(30,40,32,.06),0 14px 40px rgba(30,40,32,.09);transform:translateY(-1px)}
.card .crumbrow{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13px;margin-bottom:8px}
.card .badge{
  width:26px;height:26px;border-radius:999px;background:var(--green-soft);color:var(--green-strong);
  display:grid;place-items:center;font-weight:800;font-size:13px;flex:0 0 auto;
}
.card h2{margin:0 0 8px;font-size:23px;color:var(--green-ink);letter-spacing:-.01em}
.card p{margin:0 0 14px;color:#454b46;font-size:15px}
.chip{
  display:inline-block;background:var(--green-softer);color:var(--green-strong);
  padding:5px 13px;border-radius:999px;font-size:12.5px;font-weight:600;
}

/* Globaler Footer – volle Breite, ganz unten, Höhe = Panel-Höhe */
.sitefooter{
  position:fixed;left:0;right:0;bottom:0;width:100%;z-index:100;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:10px 26px;
  background:rgba(243,245,240,.92);backdrop-filter:blur(8px);
  border-top:1px solid var(--border);
}
.sitefooter .foot-left{color:var(--muted);font-size:13px;white-space:nowrap;flex:1 1 0;min-width:0;overflow:hidden;text-overflow:ellipsis}
.sitefooter .foot-left .fl{color:var(--accent,var(--green-strong));font-weight:700}
.sitefooter .foot-right{color:var(--muted);font-size:13px;white-space:nowrap;flex:1 1 0;text-align:right}
.sitefooter .foot-center{flex:0 0 auto;display:flex;justify-content:center}

/* Panel (Werkzeugleiste) – bestimmt die Footer-Höhe */
.panel{
  display:flex;align-items:center;gap:10px;
  background:#fff;border:1px solid var(--border);box-shadow:0 6px 24px rgba(30,40,32,.10);
  border-radius:999px;padding:8px 10px;
}
.panel .pbrand{display:flex;align-items:center;gap:9px;font-weight:800;padding:6px 12px;text-decoration:none}
/* Panel = Such-Widget der Suchmaschine -> IMMER heyFinley-grün, unabhängig von --accent der Seite */
.panel .pbrand .logo{width:26px;height:26px;border-radius:8px;background:var(--green);color:#fff;display:grid;place-items:center;font-size:13px}
.panel .pbrand .lo{color:var(--ink)} .panel .pbrand .hi{color:var(--green-strong)}
.panel .tab{
  border:0;cursor:pointer;font-family:inherit;text-decoration:none;color:#3d443e;font-weight:600;font-size:14px;
  background:var(--green-softer);border-radius:999px;padding:9px 16px;display:flex;align-items:center;gap:8px;line-height:1;
}
.panel .tab:hover{background:var(--green-soft)}

/* ===== Slide-Outs (Panel-Fenster, fahren von unten nach oben aus) ===== */
.sheet-backdrop{position:fixed;inset:0;background:rgba(20,28,22,.30);opacity:0;pointer-events:none;
  transition:opacity .2s ease;z-index:80}
.sheet-backdrop.show{opacity:1;pointer-events:auto}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:90;display:flex;justify-content:center;
  transform:translateY(115%);transition:transform .30s cubic-bezier(.22,.61,.36,1);pointer-events:none}
.sheet.open{transform:translateY(0)}
.sheet-card{
  pointer-events:auto;  /* nur die Karte fängt Klicks – daneben (links/rechts/oben) schließt */
  width:min(700px,94vw);margin-bottom:88px;max-height:70vh;display:flex;flex-direction:column;overflow:hidden;
  background:#fff;border:1px solid var(--border);border-radius:22px;
  box-shadow:0 -8px 20px rgba(20,28,22,.06),0 22px 60px rgba(20,28,22,.20);
}
.sheet-head{display:flex;align-items:center;justify-content:space-between;padding:18px 22px 12px}
.sheet-head h3{margin:0;font-size:18px;color:var(--ink)}
.sheet-close{border:0;background:var(--green-softer);color:#3d443e;cursor:pointer;font-size:20px;line-height:1;
  width:34px;height:34px;border-radius:999px}
.sheet-close:hover{background:var(--green-soft)}
.sheet-body{padding:6px 22px 22px;overflow:auto}
.sheet-hint{color:var(--muted);font-size:14px;margin:0 0 12px}
.sheet .searchbar.sheet-search{margin:2px 0 14px}
.sheet-results{display:flex;flex-direction:column;gap:10px}
@keyframes sresIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
.sres{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit;
  border:1px solid var(--border);border-radius:16px;padding:12px 14px;
  animation:sresIn .28s ease both}
@media (prefers-reduced-motion: reduce){ .sres{animation:none} }
.sres:hover{background:var(--green-softer)}
.sres-badge{width:26px;height:26px;flex:0 0 auto;border-radius:999px;background:var(--green-soft);
  color:var(--green-strong);display:grid;place-items:center;font-weight:800;font-size:13px}
.sres-main{display:flex;flex-direction:column;min-width:0;flex:1}
.sres-crumb{color:var(--muted);font-size:12px}
.sres-title{color:var(--green-ink);font-weight:700;font-size:16px}
.sres-desc{color:#565c56;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.notizen{width:100%;min-height:220px;resize:vertical;border:1px solid var(--border);border-radius:14px;
  padding:14px;font:inherit;font-size:15px;color:var(--ink);outline:0;background:#fcfdfb}
.notizen:focus{border-color:var(--green)}
.sheet-foot{display:flex;justify-content:flex-end;margin-top:8px;min-height:18px}
.muted{color:var(--muted);font-size:13px}
.sheet-links{display:flex;gap:18px;margin-top:14px}
.sheet-links a{color:var(--green-strong);font-weight:700;text-decoration:none}
.kontakt{display:flex;align-items:center;gap:14px;border:1px solid var(--border);border-radius:16px;padding:14px}
.kontakt-badge{width:40px;height:40px;flex:0 0 auto;border-radius:12px;background:var(--green-soft);
  color:var(--green-strong);display:grid;place-items:center;font-weight:800;font-size:18px}
.kontakt-name{font-weight:700;color:var(--ink)}

/* ---- Abfragen: Menü im Panel-Sheet ---- */
.abf-menu{display:flex;flex-direction:column;gap:10px}
.abf-item{display:flex;align-items:center;gap:14px;width:100%;text-align:left;cursor:pointer;
  border:1px solid var(--border);border-radius:16px;padding:13px 14px;background:#fff;font:inherit;
  text-decoration:none;color:inherit;
  transition:background .15s ease,border-color .15s ease}
.abf-item:hover{background:var(--green-softer);border-color:var(--green-soft)}
.abf-item--polis .abf-ic{background:#1b2430;color:#fff}
.abf-item--polis{border-color:#cfd6dd}
.abf-ic{width:42px;height:42px;flex:0 0 auto;border-radius:12px;background:var(--green-soft);
  display:grid;place-items:center;font-size:20px}
.abf-tx{display:flex;flex-direction:column;min-width:0;flex:1}
.abf-t{font-weight:700;color:var(--ink);font-size:16px}
.abf-s{color:var(--muted);font-size:13px}
.abf-arr{color:var(--muted);font-size:24px;font-weight:700;line-height:1}

/* ---- Abfrage-Popups (zentriertes Modal) ---- */
.qpop-backdrop{position:fixed;inset:0;background:rgba(20,28,22,.45);opacity:0;pointer-events:none;
  transition:opacity .2s ease;z-index:110}
.qpop-backdrop.show{opacity:1;pointer-events:auto}
.qpop{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;
  padding:20px;opacity:0;pointer-events:none;transition:opacity .18s ease}
.qpop.open{opacity:1}
.qpop.open .qpop-card{pointer-events:auto;transform:translateY(0) scale(1)}
.qpop-card{width:min(460px,96vw);max-height:82vh;display:flex;flex-direction:column;overflow:hidden;
  background:#fff;border:1px solid var(--border);border-radius:20px;
  box-shadow:0 30px 70px rgba(20,28,22,.30);transform:translateY(10px) scale(.98);
  transition:transform .2s cubic-bezier(.22,.61,.36,1),width .28s cubic-bezier(.22,.61,.36,1),max-height .28s ease}
.qpop.akte .qpop-card{width:min(760px,96vw);max-height:88vh}
.qpop-head{display:flex;align-items:center;gap:10px;padding:15px 18px;background:#1b2430;color:#fff}
.qpop-title{font-weight:800;font-size:16px}
.qpop-sys{margin-left:auto;font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;opacity:.6}
.qpop-close{border:0;background:rgba(255,255,255,.14);color:#fff;cursor:pointer;font-size:20px;line-height:1;
  width:32px;height:32px;border-radius:999px}
.qpop-close:hover{background:rgba(255,255,255,.26)}
.qpop-body{padding:16px 18px 20px;overflow:auto}
.qpop-form{display:flex;gap:8px;margin-bottom:14px}
.qpop-in{flex:1;min-width:0;border:1px solid var(--border);border-radius:12px;padding:11px 14px;font:inherit;font-size:15px;outline:0;background:#fff}
.qpop-in:focus{border-color:var(--green)}
.qpop-go{border:0;background:#1b2430;color:#fff;border-radius:12px;padding:11px 18px;font:inherit;font-weight:700;cursor:pointer;white-space:nowrap}
.qpop-go:hover{background:#28323f}
.qpop-res{display:flex;flex-direction:column;gap:12px}
.qres-info{color:var(--muted);font-size:13px;line-height:1.5}
.qres{position:relative;border:1px dashed var(--border);border-radius:14px;padding:16px;background:#fafbfa}
.qres-badge{position:absolute;top:12px;right:12px;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  color:#9aa29a;border:1px solid var(--border);border-radius:6px;padding:2px 7px;background:#fff}
.qres-dl{margin:0;display:grid;grid-template-columns:120px 1fr;gap:7px 12px}
.qres-dl > div{display:contents}
.qres-dl dt{color:var(--muted);font-size:13px}
.qres-dl dd{margin:0;color:var(--ink);font-size:14px;font-weight:600}
.qres--dark{background:#111820;border-color:#2a3542}
.qres--dark .qres-badge{background:#1b2430;border-color:#2a3542;color:#8b97a5}
.qres--dark .qres-dl dt{color:#8b97a5}
.qres--dark .qres-dl dd{color:#e7ecf1}
.qres-note{margin:12px 0 0;color:#cf9350;font-size:13px;line-height:1.5}
.qres-tag{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  color:#9aa29a;border:1px solid var(--border);border-radius:6px;padding:1px 6px;margin-left:2px}

/* ---- Trefferkarte (Suchergebnis im Popup) ---- */
.qhit{display:flex;align-items:center;gap:12px;width:100%;text-align:left;cursor:pointer;font:inherit;
  border:1px solid var(--border);border-radius:14px;padding:10px 12px;background:#fff;
  transition:background .15s ease,border-color .15s ease;animation:sresIn .28s ease both}
.qhit:hover{background:var(--green-softer);border-color:var(--green-soft)}
.qhit-photo{width:44px;height:54px;flex:0 0 auto;border-radius:8px;overflow:hidden;border:1px solid var(--border);background:#eef1f4}
.qhit-photo--veh{width:60px;height:40px}
.qhit-photo svg{display:block;width:100%;height:100%}
.qhit-main{display:flex;flex-direction:column;min-width:0;flex:1}
.qhit-title{font-weight:800;color:var(--ink);font-size:15px}
.qhit-sub{color:var(--muted);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qhit-arr{color:var(--muted);font-size:22px;font-weight:700;line-height:1}

/* ---- Akte (vergrößerte Detailansicht) ---- */
.akte{animation:sresIn .25s ease both}
.akte-back{border:0;background:none;color:var(--green-strong);font:inherit;font-weight:700;cursor:pointer;padding:0 0 10px;display:inline-block}
.akte-top{display:flex;gap:16px;align-items:flex-start;padding:2px 0 14px;border-bottom:1px solid var(--border)}
.akte-photo{width:104px;height:130px;flex:0 0 auto;border-radius:10px;overflow:hidden;border:1px solid var(--border);
  position:relative;background:#eef1f4}
.akte-photo--veh{width:150px;height:96px}
.akte-photo svg{display:block;width:100%;height:100%}
.akte-photo-cap{position:absolute;left:0;right:0;bottom:0;background:rgba(20,28,34,.72);color:#fff;font-size:10px;
  text-align:center;padding:2px;letter-spacing:.06em;text-transform:uppercase}
.akte-ident{min-width:0;flex:1;padding-top:2px}
.akte-name{font-size:22px;font-weight:800;color:var(--ink);line-height:1.12}
.akte-name--plate{display:flex}
.akte-role{color:var(--muted);font-size:13px;margin-top:5px}
.akte-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:11px}
.akte-tags span{background:var(--green-softer);color:#3d443e;border-radius:999px;padding:3px 10px;font-size:12px;font-weight:600}
.akte-sec{font-size:11px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin:16px 0 8px}
.akte .qres-dl{grid-template-columns:150px 1fr;gap:8px 12px}
.akte-note{margin:0;color:var(--ink);font-size:14px;line-height:1.55;background:#fafbfa;
  border:1px dashed var(--border);border-radius:12px;padding:12px 14px}

/* Kennzeichen-Optik */
.plate{display:inline-flex;align-items:stretch;border:2px solid #14181c;border-radius:6px;overflow:hidden;background:#fff;line-height:1}
.plate-eu{background:#1b3fae;color:#fff;font-size:11px;font-weight:800;display:flex;align-items:flex-end;justify-content:center;padding:3px 5px}
.plate-txt{color:#14181c;font-weight:800;font-size:19px;letter-spacing:.06em;padding:5px 12px;
  font-family:"DejaVu Sans Mono",ui-monospace,Menlo,Consolas,monospace}

@media (max-width:640px){
  .qpop.akte .qpop-card{max-height:86vh}
  .akte .qres-dl{grid-template-columns:118px 1fr}
}

/* App-Platzhalter (Seite noch im Bau) */
.placeholder{max-width:640px;margin:60px auto;text-align:center;background:var(--card);
  border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:48px 40px}
.placeholder .badge{width:54px;height:54px;border-radius:16px;background:var(--green-soft);color:var(--green-strong);
  display:grid;place-items:center;font-weight:800;font-size:24px;margin:0 auto 18px}
.placeholder h1{margin:0 0 8px;color:var(--green-ink)}
.placeholder p{color:var(--muted);margin:0 0 22px}
.placeholder a{color:var(--green-strong);font-weight:700;text-decoration:none}

/* ===================== App: PlaudR (profil-zentriert, koral) ===================== */
.plaudr{--pl:#bf6a4d;--pl-ink:#a2543a;--pl-soft:#f6ece6;--pl-line:#eee3dc}
.pl-wrap{max-width:620px;margin:0 auto;padding:22px 18px 0}
.pl-card{background:#fff;border:1px solid var(--pl-line);border-radius:20px;box-shadow:var(--shadow);padding:20px 22px;margin-bottom:16px}

.pl-av{width:44px;height:44px;flex:0 0 auto;border-radius:999px;display:grid;place-items:center;color:#fff;font-weight:800;font-size:16px;text-decoration:none}
.pl-av.xl{width:74px;height:74px;font-size:27px}
.pl-name{font-weight:800;color:var(--ink);text-decoration:none}
.pl-sub{color:var(--muted);font-size:13px}
.pl-mention{color:var(--pl-ink);font-weight:600}
.pl-h2{font-size:14px;color:var(--muted);margin:2px 2px 12px;text-transform:uppercase;letter-spacing:.05em}
.pl-empty{color:var(--muted)}

/* Header-Extra: Adminansicht */
.pl-admin{background:var(--pl-soft);color:var(--pl-ink);font-weight:700;font-size:13px;padding:8px 14px;border-radius:999px;white-space:nowrap}

/* Profilkopf */
.pl-profile-head{display:flex;gap:18px;align-items:flex-start}
.pl-pinfo{min-width:0;flex:1}
.pl-pinfo h1{margin:0 0 2px;font-size:24px;color:var(--ink)}
.pl-bio{margin:12px 0 10px;color:#2b2f2c}
.pl-facts{display:flex;flex-wrap:wrap;gap:4px 14px;color:var(--muted);font-size:13.5px}
.pl-stats{display:flex;gap:26px;margin-top:14px;padding-top:14px;border-top:1px solid var(--pl-line);color:var(--muted);font-size:14px}
.pl-stats b{color:var(--ink)}

/* Tabs Beiträge | Nachrichten */
.pl-tabs{display:flex;background:#fff;border:1px solid var(--pl-line);border-radius:16px;box-shadow:var(--shadow);padding:6px;margin-bottom:16px}
.pl-tabs a{flex:1;text-align:center;text-decoration:none;color:#6b7280;font-weight:700;padding:12px;border-radius:12px}
.pl-tabs a.on{background:var(--pl-soft);color:var(--pl-ink)}

/* Beiträge */
.pl-post-head{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.pl-meta{display:flex;flex-direction:column;min-width:0}
.pl-text{margin:2px 0 12px;color:#2b2f2c;font-size:15.5px;line-height:1.55}
.pl-media{border-radius:14px;overflow:hidden;border:1px solid var(--pl-line);margin-bottom:12px}
.pl-media img{display:block;width:100%;height:auto;max-height:440px;object-fit:cover}
.pl-likes{color:var(--muted);font-size:14px;font-weight:600}

/* Profil-Suche (Ergebnisliste) */
.pl-personrow{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--pl-line);border-radius:16px;box-shadow:var(--shadow);padding:12px 16px;margin-bottom:10px;text-decoration:none}
.pl-personrow:hover{background:var(--pl-soft)}
.pl-personrow .pl-sub{display:block}

/* Nachrichten: Thread-Liste + Konversation */
.pl-thread{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit}
.pl-thmeta{display:flex;flex-direction:column;min-width:0;flex:1}
.pl-thlast{color:#4b5563;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pl-thdate{color:var(--muted);font-size:12.5px;white-space:nowrap}
.pl-conv{margin:-6px 2px 18px;display:flex;flex-direction:column;gap:6px}
.pl-msg{display:flex;flex-direction:column;max-width:78%}
.pl-msg.their{align-self:flex-start;align-items:flex-start}
.pl-msg.mine{align-self:flex-end;align-items:flex-end}
.pl-bubble2{padding:9px 14px;border-radius:16px;font-size:14.5px}
.pl-msg.their .pl-bubble2{background:#f1f0ee;color:#2b2f2c;border-bottom-left-radius:5px}
.pl-msg.mine .pl-bubble2{background:var(--pl);color:#fff;border-bottom-right-radius:5px}
.pl-mtime{color:var(--muted);font-size:11.5px;margin:2px 4px}

/* ===================== App: Dein Tagesblatt (Zeitung, navy/serif) ===================== */
.tb{--tb:#1f2d3d;--tb-soft:#eef1f4;--tb-line:#e5e8ec}
.tb-serif{font-family:Georgia,"Times New Roman",serif}
.tb-wrap{max-width:1080px;margin:0 auto;padding:20px 24px 0}
.tb-meta{display:flex;gap:12px;align-items:center;color:var(--muted);font-size:13px;padding:4px 0 22px}
.tb-meta .dot{opacity:.5}

/* Header-Navigation (Ressorts) */
.tb-nav{display:flex;gap:20px;flex-wrap:wrap;justify-content:center}
.tb-nav a{color:#3a4453;font-weight:600;font-size:14.5px;text-decoration:none}
.tb-nav a.on{color:var(--tb);font-weight:800}
.tb-nav a:hover{color:var(--tb)}
.tb-abo{font-size:14px;padding:10px 18px}

.tb-top{display:grid;grid-template-columns:1.7fr 1fr;gap:40px;padding-bottom:26px;border-bottom:1px solid var(--tb-line)}
.tb-lead-img{border-radius:6px;overflow:hidden;margin-bottom:18px;aspect-ratio:16/10}
.tb-lead-img img,.tb-thumb img,.tb-card-img img,.tb-art-img img{display:block;width:100%;height:100%;object-fit:cover;filter:grayscale(1)}
.tb-kickline{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.tb-kicker{color:var(--tb);font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:.08em}
.tb-min,.tb-time{color:var(--muted);font-size:12.5px}
.tb-plus{background:var(--tb);color:#fff;font-size:10px;font-weight:800;padding:2px 5px;border-radius:3px;vertical-align:middle;margin-left:6px}
.tb-lead h1{font-size:44px;line-height:1.06;margin:0 0 16px;letter-spacing:-.01em}
.tb-lead h1 a{color:var(--ink);text-decoration:none}
.tb-teaser{color:#33393f;font-size:17px;line-height:1.5;margin:0 0 16px}
.tb-byline{color:var(--muted);font-size:13.5px}

.tb-side{display:flex;flex-direction:column}
.tb-side-item{display:flex;gap:14px;text-decoration:none;color:inherit;padding:16px 0;border-bottom:1px solid var(--tb-line);align-items:flex-start}
.tb-side-item:first-child{padding-top:0}
.tb-side-text{flex:1;min-width:0}
.tb-side-item h3{font-size:19px;line-height:1.16;margin:6px 0 8px;color:var(--ink)}
.tb-thumb{width:92px;height:70px;flex:0 0 auto;border-radius:5px;overflow:hidden}
.tb-ml{margin-top:22px}
.tb-ml-head{color:var(--muted);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px}
.tb-ml-item{display:flex;gap:14px;text-decoration:none;color:var(--ink);padding:12px 0;border-top:1px solid var(--tb-line);align-items:baseline}
.tb-ml-num{color:#c3c8cf;font-size:22px;font-weight:800;font-family:Georgia,serif;min-width:20px}
.tb-ml-item .tb-serif{font-size:16px;line-height:1.2}

.tb-sec-head{display:flex;justify-content:space-between;align-items:baseline;margin:26px 0 16px}
.tb-sec-head span{color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.08em;font-size:13px}
.tb-sec-head a{color:var(--tb);font-weight:700;text-decoration:none;font-size:14px}
.tb-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;padding-bottom:40px}
.tb-card{text-decoration:none;color:inherit}
.tb-card-img{aspect-ratio:16/10;border-radius:6px;overflow:hidden;margin-bottom:12px}
.tb-card h3{font-size:20px;line-height:1.16;margin:8px 0 8px;color:var(--ink)}

.tb-ressort-title{font-size:34px;margin:6px 0 22px;color:var(--ink)}
.tb-article{max-width:720px;margin:0 auto;padding-bottom:40px}
.tb-back{color:var(--tb);font-weight:700;text-decoration:none;font-size:14px;display:inline-block;margin:0 0 14px}
.tb-art-title{font-size:40px;line-height:1.08;margin:10px 0 12px;color:var(--ink)}
.tb-art-img{border-radius:6px;overflow:hidden;margin:18px 0 22px;aspect-ratio:16/9}
.tb-lead-para{font-size:19px;line-height:1.55;color:#2b2f2c;font-weight:600;margin:0 0 16px}
.tb-para{font-size:17px;line-height:1.62;color:#2b2f2c;margin:0 0 16px}
.tb-paywall{background:var(--tb-soft);color:var(--tb);border-radius:10px;padding:14px 16px;font-weight:600;font-size:14px}
.tb-empty{color:var(--muted)}

/* ===================== Header dunkel (z. B. POLIS) ===================== */
.topbar--dark{background:var(--accent)}
.topbar--dark .brand .lo,.topbar--dark .brand .hi{color:#fff}
.topbar--dark .brand .logo{background:rgba(255,255,255,.16);color:#fff}
.po-htag{color:rgba(255,255,255,.55);font-weight:600;font-size:13px;margin-left:4px}
.topbar--dark .userchip{background:rgba(255,255,255,.14);color:#fff}
.topbar--dark .btn,.topbar--dark .btn.ghost{background:rgba(255,255,255,.16);color:#fff}

/* ===================== App: POLIS (Ermittlungsportal, navy) ===================== */
.polis{--po:#1b2430;--po-soft:#eef1f4;--po-line:#e4e7ec}
.po-wrap{max-width:1080px;margin:0 auto;padding:22px 24px 0}
.po-back{color:var(--po);font-weight:600;text-decoration:none;font-size:14px;display:inline-block;margin:0 0 14px}
.po-h1{font-size:28px;color:var(--ink);margin:4px 0 4px}
.po-lead{color:var(--muted);margin:0 0 20px}
.po-empty{color:var(--muted)}

.po-falllist{display:flex;flex-direction:column;gap:12px}
.po-fallrow{display:flex;justify-content:space-between;align-items:center;gap:16px;background:#fff;border:1px solid var(--po-line);border-radius:14px;box-shadow:var(--shadow);padding:18px 20px;text-decoration:none}
.po-fallrow:hover{border-color:var(--po)}
.po-fr-az{color:var(--po);font-weight:700;font-size:13px}
.po-fr-titel{color:var(--ink);font-size:19px;font-weight:700;margin:4px 0}
.po-fr-meta{color:var(--muted);font-size:13px}
.po-fr-status{background:var(--po-soft);color:var(--po);font-weight:700;font-size:12.5px;padding:6px 12px;border-radius:999px}

.po-casecard{background:#fff;border:1px solid var(--po-line);border-radius:16px;box-shadow:var(--shadow);padding:24px 26px;margin-bottom:20px}
.po-cc-top{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}
.po-cc-az{color:var(--po);font-weight:700;font-size:13px;letter-spacing:.02em}
.po-tag{background:var(--po-soft);color:var(--po);font-size:12px;font-weight:700;padding:2px 9px;border-radius:999px;margin-left:6px}
.po-cc-titel{font-size:30px;margin:8px 0 0;color:var(--ink);letter-spacing:-.01em}
.po-abschluss{background:var(--po);color:#fff;font-size:14px;padding:11px 18px;white-space:nowrap}
.po-cc-meta{display:flex;gap:40px;flex-wrap:wrap;margin-top:22px;padding-top:18px;border-top:1px solid var(--po-line)}
.po-cc-meta > div{display:flex;flex-direction:column;gap:3px}
.po-cc-meta span{color:var(--muted);font-size:12.5px}
.po-cc-meta b{color:var(--ink);font-size:15px}

.po-tabs{display:flex;gap:8px;background:#fff;border:1px solid var(--po-line);border-radius:14px;box-shadow:var(--shadow);padding:6px;margin-bottom:18px;max-width:360px;scroll-margin-top:14px}
.po-tabs a{flex:1;text-align:center;text-decoration:none;color:#5b6472;font-weight:700;padding:11px;border-radius:9px}
.po-tabs a.on{background:var(--po);color:#fff}
.po-count{padding:1px 8px;border-radius:999px;font-size:12px;margin-left:4px;background:var(--po-soft);color:var(--po)}
.po-tabs a.on .po-count{background:rgba(255,255,255,.22);color:#fff}

.po-card{background:#fff;border:1px solid var(--po-line);border-radius:16px;box-shadow:var(--shadow);padding:26px 30px}
.po-anweisung{max-width:820px}
.po-an-label{color:var(--muted);font-size:12.5px;margin-bottom:14px}
.po-audio{width:100%;margin-bottom:16px}
.po-an-titel{font-weight:700;color:var(--ink);margin:0 0 16px;font-size:16px}
.po-an-para{color:#2b2f2c;line-height:1.62;font-size:15.5px;margin:0 0 14px}
.po-an-sig{margin-top:20px;padding-top:16px;border-top:1px solid var(--po-line);color:var(--ink);font-size:14px}
.po-an-sub{color:var(--muted);font-size:12.5px}

.po-beweise{display:grid;grid-template-columns:300px 1fr;gap:20px}
.po-beweise > *{min-width:0}   /* Spalten dürfen unter Inhaltsbreite (840px) schrumpfen */
.po-search{width:100%;border:1px solid var(--po-line);border-radius:12px;padding:11px 14px;font:inherit;font-size:14px;outline:0;margin-bottom:12px;background:#fff}
.po-search:focus{border-color:var(--po)}
.po-bwitem{display:flex;flex-direction:column;gap:2px;text-decoration:none;border:1px solid var(--po-line);border-radius:12px;padding:12px 14px;margin-bottom:8px;background:#fff}
.po-bwitem:hover{background:var(--po-soft)}
.po-bwitem.on{background:var(--po);border-color:var(--po)}
.po-bwitem.on .po-bw-nr,.po-bwitem.on .po-bw-ti{color:#fff}
.po-bw-nr{color:var(--ink);font-weight:700;font-size:14px}
.po-bw-ti{color:var(--muted);font-size:13px}
.po-bwview{background:#eef0ec;border:1px solid var(--po-line);border-radius:16px;padding:14px;min-height:420px;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start}
.po-docwrap{position:relative;max-width:100%;align-self:flex-start}
.po-doc{width:840px;transform-origin:top left}   /* feste Blattbreite; wird als Ganzes von oben-links skaliert */
.po-photo{width:100%;max-width:720px;border-radius:8px;overflow:hidden;box-shadow:0 6px 24px rgba(20,28,40,.18);align-self:center;margin:auto}
.po-photo img{display:block;width:100%}
.po-photo-cap{color:var(--muted);font-size:13px;margin-top:14px}

/* ===================== Mobile ===================== */
@media (max-width: 640px){
  body{padding-bottom:96px}

  /* Header: kompakter, kleinere Schrift */
  .topbar{padding:12px 14px;gap:10px}
  .topbar-center{display:none}                 /* Seiten-Suche im Header auf Mobile ausblenden */
  .brand{font-size:0}                          /* Wortmarke ausblenden … */
  .brand > span:last-child{display:none}        /* … es bleibt nur das F-Quadrat */
  .brand .logo{width:34px;height:34px;font-size:16px}
  .btn{padding:9px 14px;font-size:14px}
  .userchip{padding:7px 10px;font-size:12.5px;max-width:38vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

  /* Hero / Suche kleiner */
  .hero h1{font-size:32px;line-height:1.08}
  .hero p.sub{font-size:14px}
  .netzbadge{font-size:12px}
  .searchbar{padding:7px 7px 7px 16px}
  .searchbar input{font-size:15px}
  .searchbar button{padding:10px 18px}
  .card h2{font-size:19px}
  .card p{font-size:14px}
  .wrap{padding:0 16px}
  .placeholder{max-width:100%;margin:36px 0;padding:34px 22px}
  /* Tagesblatt mobil: Spalten stapeln */
  .tb-wrap{padding:16px 16px 0}
  .tb-top{grid-template-columns:1fr;gap:24px}
  .tb-grid{grid-template-columns:1fr;gap:22px}
  .tb-lead h1{font-size:30px}
  .tb-art-title{font-size:27px}
  .tb-ressort-title{font-size:27px}
  /* POLIS mobil */
  .po-wrap{padding:16px 16px 0}
  .po-beweise{grid-template-columns:1fr}
  .po-cc-titel{font-size:23px}
  .po-cc-top{flex-direction:column;gap:14px}
  .po-cc-meta{gap:20px}
  .po-bwview{padding:12px}

  /* Beweisliste mobil: horizontal wischen statt stapeln (+ Rand-Verblendung als Hinweis) */
  #po-bwitems{display:flex;gap:10px;overflow-x:auto;padding-bottom:6px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  #po-bwitems::-webkit-scrollbar{display:none}
  #po-bwitems .po-bwitem{flex:0 0 auto;width:190px;margin-bottom:0;scroll-snap-align:start}
  #po-bwitems.fade-r{-webkit-mask-image:linear-gradient(90deg,#000 78%,transparent);mask-image:linear-gradient(90deg,#000 78%,transparent)}
  #po-bwitems.fade-l{-webkit-mask-image:linear-gradient(90deg,transparent,#000 22%);mask-image:linear-gradient(90deg,transparent,#000 22%)}
  #po-bwitems.fade-lr{-webkit-mask-image:linear-gradient(90deg,transparent,#000 16%,#000 84%,transparent);mask-image:linear-gradient(90deg,transparent,#000 16%,#000 84%,transparent)}

  /* Footer: Panel maximal breit, Seitentexte weg */
  .sitefooter{padding:8px 8px;gap:0;bottom:8px;left:8px;right:8px;width:auto;border-radius:999px}
  .sitefooter .foot-left,.sitefooter .foot-right{display:none}
  .sitefooter .foot-center{flex:1;width:100%}
  .panel{width:100%;justify-content:space-between;gap:6px;padding:6px 6px}
  .panel .pbrand{padding:6px 6px}
  .panel .pbrand > span:last-child{display:none}   /* Panel-Logo nur F */
  .panel .tab{padding:9px 6px;font-size:12.5px;font-weight:700;gap:0;justify-content:center;flex:1;white-space:nowrap}
  .panel .tab .ti{display:none}                     /* Icons fallen weg */
}