/* Kundenportal: Nachrichten (21.10.2026). Talentküste links mit rundem Foto, Kunde rechts in Blau. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.na-karte{padding:0;display:flex;flex-direction:column;overflow:hidden}
.na-verlauf{display:flex;flex-direction:column;gap:4px;padding:18px 18px 10px;max-height:min(62vh,640px);min-height:260px;overflow-y:auto;overscroll-behavior:contain;scroll-behavior:smooth}
.na-tag{display:flex;justify-content:center;margin:12px 0 6px}
.na-tag span{font-size:11.5px;font-weight:600;color:var(--muted);background:var(--bg);border:1px solid var(--line-soft);padding:2px 10px;border-radius:999px}
.na-z{display:flex;gap:10px;align-items:flex-end;max-width:min(78%,620px);margin-top:8px}
.na-z.folge{margin-top:2px}
.na-z.kunde{align-self:flex-end;flex-direction:row-reverse}
.na-av-platz{width:36px;flex:none}
.na-av{width:36px;height:36px;border-radius:50%;object-fit:cover;display:block;background:var(--surface-2);box-shadow:0 0 0 2px var(--surface),0 0 0 3px var(--line-soft)}
.na-ini{display:grid;place-items:center;font:600 12px "Schibsted Grotesk",system-ui,sans-serif;color:var(--muted)}
.na-inhalt{min-width:0;display:flex;flex-direction:column}
.na-z.kunde .na-inhalt{align-items:flex-end}
.na-wer{font-size:12.5px;font-weight:600;margin:0 4px 3px}
.na-wer span{font-weight:500;color:var(--muted);margin-left:4px}
.na-blase{padding:10px 14px;border-radius:16px;font-size:14.5px;line-height:1.5;overflow-wrap:anywhere;background:var(--surface-2);color:var(--text);border-bottom-left-radius:6px}
.na-z.kunde .na-blase{background:var(--blue);color:#0a1018;border-bottom-left-radius:16px;border-bottom-right-radius:6px}
.na-blase a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.na-meta{display:flex;gap:8px;font-size:11px;color:var(--muted);margin:3px 6px 0}
.na-gelesen{display:inline-flex;align-items:center;gap:3px}
.na-leer{margin:auto;display:grid;justify-items:center;gap:8px;text-align:center;padding:24px 12px;max-width:42ch}
.na-leer p{margin:0}
.na-team{display:flex;gap:18px;margin-bottom:6px}
.na-team-p{display:grid;justify-items:center;gap:6px;font-size:12.5px;font-weight:600}
.na-team-p .na-av{width:56px;height:56px}
.na-eingabe{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;padding:12px 14px;border-top:1px solid var(--line-soft);background:var(--surface)}
.na-eingabe textarea{flex:1;min-width:0;resize:none;min-height:44px;max-height:180px;padding:11px 14px;border-radius:14px;border:1px solid var(--line);background:var(--bg);color:var(--text);font:inherit;font-size:15px;line-height:1.45}
.na-eingabe textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 22%,transparent)}
.na-senden{min-height:44px;border-radius:14px}
.na-hinweis{flex-basis:100%;margin:0;font-size:12.5px;color:var(--muted);display:flex;gap:6px;align-items:center}
.na-fuss{margin:0;padding:0 16px 12px;font-size:12px}
@media (max-width:720px){
  /* Verlauf scrollt in sich, Eingabe bleibt unter dem Verlauf über der unteren Leiste sichtbar */
  .na-verlauf{max-height:calc(100dvh - 330px);min-height:240px;padding:14px 12px 8px}
  .na-z{max-width:88%}
  .na-eingabe{padding:10px}
  .na-eingabe textarea{font-size:16px}
  .na-fuss{display:none}
}
@media (prefers-reduced-motion:reduce){.na-verlauf{scroll-behavior:auto}}