:host { display: block; }
    .app-kopfzeile {
      background: var(--farbe-primaer);
      color: #fff;
      padding: 1.5rem 2rem 0;
    }
    .app-kopf-innen { display:flex; align-items:center; justify-content:space-between; gap:1rem; }
    .app-titel {
      font-family: var(--schrift-anzeige);
      font-size: 1.75rem;
      letter-spacing: .02em;
      margin-bottom: 1.25rem;
    }
    .reiter {
      display: flex;
      gap: .25rem;
      align-items: flex-end;
      flex-wrap: wrap;
    }
    .reiter-btn {
      font-family: var(--schrift-text);
      font-size: .9rem;
      font-weight: 500;
      background: rgba(255,255,255,.08);
      color: rgba(255,255,255,.65);
      border: none;
      padding: .7rem 1.5rem;
      border-radius: var(--radius) var(--radius) 0 0;
      cursor: pointer;
      transition: var(--uebergang);
    }
    .reiter-btn:hover { background: rgba(255,255,255,.14); color: #fff; }
    .reiter-btn[aria-selected="true"] {
      background: var(--farbe-hg);
      color: var(--farbe-primaer);
      font-weight: 600;
    }
    .nav-gruppe { position: relative; }
    .nav-gruppe > summary { list-style: none; }
    .nav-gruppe > summary::-webkit-details-marker { display:none; }
    .nav-dropdown { position:absolute; z-index:20; top:100%; right:0; min-width:220px; padding:.4rem; background:#fff; box-shadow:var(--schatten-md); border-radius:0 0 var(--radius) var(--radius); }
    .nav-dropdown .reiter-btn { display:block; width:100%; text-align:left; color:var(--farbe-primaer); background:#fff; border-radius:var(--radius); }
    .nav-dropdown .reiter-btn:hover, .nav-dropdown .reiter-btn[aria-selected="true"] { background:var(--farbe-hg); color:var(--farbe-primaer); }
    .konto-menue { position:relative; align-self:flex-start; }
    .konto-trigger { width:2.7rem; height:2.7rem; margin:0; padding:0; border:2px solid rgba(255,255,255,.8); border-radius:50%; background:#fff; color:var(--farbe-primaer); font-weight:800; cursor:pointer; }
    .konto-dropdown { position:absolute; z-index:40; top:calc(100% + .55rem); right:0; width:min(20rem,calc(100vw - 2rem)); padding:.8rem; background:#fff; color:var(--farbe-text); border-radius:var(--radius); box-shadow:var(--schatten-md); }
    .konto-dropdown[hidden] { display:none; }
    .konto-dropdown-kopf { padding:.2rem .2rem .75rem; border-bottom:1px solid var(--farbe-rahmen); }
    .konto-dropdown h3 { margin:.1rem 0 .2rem; color:var(--farbe-primaer); }
    .konto-dropdown small { display:block; color:var(--farbe-text-ged); overflow-wrap:anywhere; }
    .konto-dropdown-aktionen { display:grid; gap:.55rem; margin-top:.75rem; }
    .konto-dropdown .btn { width:100%; margin:0; text-align:center; padding:.65rem .9rem; border:1px solid transparent; border-radius:var(--radius); font:inherit; font-weight:700; cursor:pointer; }
    .konto-dropdown .btn-primaer { background:var(--farbe-primaer); color:#fff; }
    .konto-dropdown .btn-primaer:hover, .konto-dropdown .btn-primaer:focus-visible { background:#164f72; }
    .konto-dropdown .btn-gefahr { background:#8b1e1e; color:#fff; }
    .konto-dropdown .btn-gefahr:hover, .konto-dropdown .btn-gefahr:focus-visible { background:#6d1717; }
    .profil-seite { width:min(100%,900px); margin:0 auto; padding:clamp(1.25rem,3vw,2rem); background:var(--farbe-flaeche); border-radius:var(--radius); box-shadow:var(--schatten-md); animation:profil-einblenden .35s ease-out; }
    @keyframes profil-einblenden { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
    .profil-seite h1, .profil-seite h2 { color:var(--farbe-primaer); font-family:var(--schrift-anzeige); }
    .profil-seite h1 { font-size:1.35rem; margin-bottom:.35rem; }
    .profil-seite h2 { font-size:1.1rem; margin-bottom:.35rem; }
    .profil-seite p { color:var(--farbe-text-ged); margin-bottom:1rem; }
    .profil-seite .untertitel { font-size:.88rem; margin-bottom:1.75rem; }
    .profil-abschnitt + .profil-abschnitt { margin-top:2rem; padding-top:1.5rem; border-top:1px solid var(--farbe-rahmen); }
    .profil-seite form, .profil-totp-aktionen { display:grid; gap:.7rem; }
    .profil-seite .form-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1rem; align-items:start; }
    .profil-seite .feld { min-width:0; margin-bottom:0; }
    .profil-passwortbereich { margin:1.25rem 0 0; padding:1rem; border:1px solid var(--farbe-rahmen); border-radius:var(--radius); }
    .profil-passwortbereich legend { padding:0 .35rem; color:var(--farbe-primaer); font-weight:700; }
    .profil-hinweis { font-size:.88rem; margin-bottom:.8rem !important; }
    .profil-seite .form-actions { display:flex; flex-wrap:wrap; gap:.65rem; align-items:center; margin-top:.45rem; }
    .profil-seite .form-actions button { margin:0; }
    .profil-seite label { display:block; color:var(--farbe-text-ged); font-size:.8rem; font-weight:600; letter-spacing:.05em; text-transform:uppercase; }
    .profil-seite input { width:100%; min-height:44px; margin-top:.35rem; padding:.7rem .85rem; border:1.5px solid var(--farbe-rahmen); border-radius:var(--radius); background:var(--farbe-hg); font:inherit; outline:none; transition:var(--uebergang); }
    .profil-seite input:focus { border-color:var(--farbe-akzent); box-shadow:0 0 0 3px rgba(255,237,0,.2); }
    .profil-seite input[readonly] { color:var(--farbe-text-ged); }
    .profil-seite button { width:max-content; margin:0; font:600 .9rem var(--schrift-text); padding:.65rem 1.5rem; border-radius:var(--radius); border:0; cursor:pointer; transition:var(--uebergang); }
    .profil-seite .btn-primaer { background:var(--farbe-primaer); color:#fff; }
    .profil-seite .btn-primaer:hover { background:var(--farbe-primaer-h); }
    .profil-seite .btn-sekundaer { background:transparent; color:var(--farbe-primaer); border:1.5px solid var(--farbe-rahmen); }
    .profil-seite .btn-sekundaer:hover { border-color:var(--farbe-primaer); }
    .profil-seite .btn-gefahr { background:var(--farbe-gefahr); color:#fff; }
    .profil-meldung { padding:.7rem; border-radius:var(--radius); background:var(--farbe-hg); }
    .profil-meldung.fehler { color:var(--farbe-gefahr); }
    .profil-meldung.erfolg { color:var(--farbe-erfolg); }
    .profil-secret { display:block; overflow-wrap:anywhere; padding:.7rem; border:1px solid var(--farbe-rahmen); border-radius:var(--radius); background:var(--farbe-hg); font:600 .82rem/1.35 ui-monospace,SFMono-Regular,Menlo,monospace; }
    .profil-totp-setup { display:grid; grid-template-columns:180px minmax(0,1fr); gap:.9rem; align-items:start; }
    .profil-totp-qr { display:block; width:180px; height:180px; padding:.35rem; background:#fff; border:1px solid var(--farbe-rahmen); border-radius:var(--radius); image-rendering:pixelated; }
    @media(max-width:520px){.profil-totp-setup{grid-template-columns:1fr}.profil-totp-qr{margin:auto}}
    @media (max-width: 620px) { .app-kopfzeile { padding-left:1rem; padding-right:1rem; } .reiter-btn { padding:.65rem .8rem; } .nav-dropdown { left:0; right:auto; } }
    .app-koerper {
      width: min(100% - 2rem, 1480px);
      max-width: 1480px;
      margin: 0 auto;
      padding: clamp(1.25rem, 3vw, 2.5rem) 0 4rem;
    }
    .platzhalter {
      text-align: center;
      padding: 4rem 2rem;
      color: var(--farbe-text-ged);
      font-size: 1.05rem;
    }
    @media (max-width: 700px) { .app-koerper { width: min(100% - 1rem, 1480px); } }
    @media print {
      .app-kopfzeile { display: none !important; }
      .app-koerper { padding: 0; max-width: 100%; }
    }