/* Admin: Kacheln, Tabellen (am Handy Karten), Lampen, Tor mit QR. Gleiche Kopfzeile wie überall. */
@layer seiten {
  body.admin main { max-width: 72rem; }
  .kacheln { display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); gap: .8rem; margin: 1rem 0 1.5rem; }
  .kachel { padding: .8rem 1rem; }
  .kachel strong { display: block; font-size: 1.8rem; }
  .kachel small { display: block; opacity: .6; }
  .tabelle { width: 100%; border-collapse: collapse; font-size: .92rem; background: var(--flaeche); border: 1px solid var(--rand); border-radius: var(--rundung); overflow: hidden; }
  .tabelle th { text-align: left; font-size: var(--winzig); text-transform: uppercase; opacity: .55; padding: .5rem .6rem; }
  .tabelle td { padding: .5rem .6rem; border-top: 1px solid var(--ton-2); vertical-align: top; }
  .tabelle td.text { max-width: 30rem; }
  .tabelle .aktionen { white-space: nowrap; display: flex; gap: .3rem; flex-wrap: wrap; align-items: center; }
  .tabelle .aktionen form { display: inline-flex; gap: .3rem; }
  .tabelle .aktionen a { color: inherit; font-size: .85rem; }
  .tabelle tr.gedimmt { opacity: .5; }
  .sperren input[type=text] { width: 8rem; padding: .25rem .5rem; font-size: .85rem; }
  .lampen { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: .8rem; margin: 1rem 0 1.5rem; }
  .lampe { display: flex; gap: .8rem; align-items: flex-start; padding: .8rem 1rem; border-radius: var(--rundung); }
  .lampe strong { display: block; }
  .lampe-zeile { display: block; font-size: .95rem; }
  .lampe small { display: block; opacity: .65; margin-top: .25rem; }
  .lampe-punkt { flex: none; width: .9rem; height: .9rem; border-radius: 50%; margin-top: .3rem; background: var(--grau); }
  .lampe-gruen .lampe-punkt { background: var(--gut); box-shadow: 0 0 8px var(--gut); }
  .lampe-gelb .lampe-punkt { background: var(--warnung); box-shadow: 0 0 8px var(--warnung); }
  .lampe-rot .lampe-punkt { background: var(--gefahr); box-shadow: 0 0 10px var(--gefahr); animation: blinken 1.2s ease-in-out infinite; }
  .betrieb-knoepfe { display: flex; gap: .6rem; flex-wrap: wrap; align-items: center; }
  .tor-link { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
  .qr svg { width: 9rem; height: 9rem; display: block; margin-top: .4rem; border-radius: var(--rundung-klein); }
  .limit-form { display: inline-flex; gap: .3rem; align-items: center; }
  .limit-form input[type=number] { width: 4rem; padding: .3rem .4rem; flex: none; }
}
@layer handy {
  @media (max-width: 48rem) {
    .tabelle, .tabelle tbody, .tabelle tr, .tabelle td { display: block; }
    .tabelle { background: transparent; border: 0; }
    .tabelle thead, .tabelle th { display: none; }
    .tabelle tr { background: var(--flaeche); border: 1px solid var(--rand); border-radius: var(--rundung); padding: .5rem .7rem; margin-bottom: .6rem; }
    .tabelle td { border: 0; padding: .15rem 0; }
    .tabelle td.text { max-width: none; margin: .3rem 0; }
    .tabelle .aktionen { margin-top: .4rem; }
    .tabelle td:empty { display: none; }
    .kacheln { grid-template-columns: repeat(2, 1fr); }
  }
}