/* Ergänzungen bleiben auch auf dem Handy bedienbar. */
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid var(--akzent); outline-offset: 3px; }
button:disabled { opacity: .55; cursor: wait; }
.kontolink { color: var(--tinte); text-decoration: none; padding: .45rem; border-radius: 8px; }
.kontolink:hover { background: var(--spur); }
.wer { flex-wrap: wrap; }
.login label.merken-wahl { display: flex; gap: .65rem; align-items: center; text-align: left; }
.merken-wahl input[type=checkbox] { width: 1.2rem; height: 1.2rem; margin: 0; flex-shrink: 0; accent-color: var(--akzent); }
.merken-hinweis { margin-top: -.5rem; font-size: .85rem; text-align: left; }
.konto-karte { margin: 1.2rem 0; padding: 1.4rem; }
.konto-karte h2 { margin-top: 0; }
.konto-form { display: grid; gap: 1rem; max-width: 32rem; }
.konto-form label { display: grid; gap: .35rem; }
.konto-form input { width: 100%; min-width: 0; }
.konto-form button { justify-self: start; }
.geraeteliste { list-style: none; padding: 0; }
.geraeteliste.karte { padding: .4rem 1.4rem; }
.geraeteliste li { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; padding: 1.1rem 0; border-bottom: 1px solid var(--linie); }
.geraeteliste li:last-child { border-bottom: 0; }
.geraeteliste li > div { min-width: 0; overflow-wrap: anywhere; }
.geraeteliste .hinweis { margin: .45rem 0 0; }
.status-marke { display: inline-block; padding: .2rem .55rem; border-radius: 6px; background: var(--spur); font-size: .8rem; }
.dateisuche { display: flex; align-items: center; gap: .75rem; margin: 1rem 0; color: var(--leise); font-size: .9rem; flex-wrap: wrap; }
.dateisuche input { min-width: 0; flex: 1; max-width: 28rem; }
.kachel-aktionen { display: flex; justify-content: space-around; align-items: center; border-top: 1px solid var(--linie); padding: .15rem; }
.kachel .kachel-aktionen a, .kachel .kachel-aktionen button { position: static; display: inline-flex; align-items: center; justify-content: center; width: 2.5rem; height: 2.5rem; padding: 0; opacity: 1; border-radius: 10px; background: transparent; color: var(--leise); text-decoration: none; font-size: 1.05rem; }
.kachel .kachel-aktionen a:hover, .kachel .kachel-aktionen button:hover { background: var(--grau); color: var(--tinte); }
@media (max-width: 600px) {
  header { gap: .5rem; padding: .6rem .7rem; }
  .logo { flex: 1; }
  .segmente { order: 3; flex: 1 0 100%; justify-content: center; }
  .wer { order: 4; width: 100%; justify-content: center; font-size: .8rem; gap: .1rem; }
  .wer button { font-size: .8rem; padding: .45rem .6rem; }
  .konto-karte { padding: 1rem; }
  .geraeteliste .aktionen { width: 100%; flex-wrap: wrap; }
  .login-buehne { padding-top: .5rem; }
  .dateisuche { display: block; }
  .dateisuche input { display: block; width: 100%; margin-top: .4rem; }
}