/* Das Amt zum Durchlaufen (0.22): Gebäude-Querschnitt, hochkant fürs Handy */
.amt { display: grid; gap: 8px; max-width: 560px; margin: 0 auto; }
.amt-kopf { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.amt-kopf h1 { margin: 0; font-size: 1.35rem; }
.amt-raus { margin-left: auto; }
.amt-hinweis { margin: 0; }
.amt-bild svg { width: 100%; height: auto; display: block; border-radius: 16px; touch-action: manipulation; box-shadow: 0 4px 18px rgba(15, 23, 42, .12); }
.amt-raum { cursor: pointer; outline: none; }
.amt-raum:hover .amt-treffer, .amt-raum:focus-visible .amt-treffer { opacity: .14; }
.amt-raum:focus-visible .amt-treffer { stroke: #4f46e5; stroke-width: 2; opacity: .2; }
.amt-raum.zu { cursor: help; }
.amt-panel { padding: 12px; border-radius: var(--radius-k, 12px); background: var(--flaeche2, #f3f4f6); min-height: 80px; }
.amt-panel h2 { margin: 0 0 4px; font-size: 1.1rem; } .amt-panel h2:empty { display: none; }
.amt-aktionen { display: grid; gap: 8px; margin-top: 6px; }
.amt-akt { display: flex; gap: 10px; align-items: center; padding: 8px 10px; border-radius: 10px; background: var(--flaeche, #fff); }
.amt-akt > div { display: grid; gap: 2px; flex: 1; } .amt-akt .knopf { margin-left: auto; } .amt-akt.gesperrt { opacity: .6; }
/* „!“ am Raum, in dem jemand wartet */
.amt-ausruf { pointer-events: none; animation: amt-hupf 1.4s ease-in-out infinite; transform-box: fill-box; transform-origin: center bottom; }
@keyframes amt-hupf { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-4px); } }
/* Leben im Haus */
.amt-dampf { animation: amt-dampf 2.6s ease-in-out infinite; transform-box: fill-box; transform-origin: center bottom; }
@keyframes amt-dampf { 0% { opacity: 0; transform: translateY(2px); } 40% { opacity: .9; } 100% { opacity: 0; transform: translateY(-5px); } }
.amt-fahne { animation: amt-fahne 2.2s ease-in-out infinite alternate; transform-box: fill-box; transform-origin: left center; }
@keyframes amt-fahne { to { transform: scaleX(.86); } }
.amt-birne { animation: amt-birne 5s steps(1) infinite; }
@keyframes amt-birne { 0%, 86%, 92%, 100% { opacity: 1; } 88%, 94% { opacity: .35; } }
.amt-blase { animation: amt-blase 3s ease-in-out infinite; }
@keyframes amt-blase { 0%, 100% { opacity: .95; } 50% { opacity: .55; } }
/* Eigene Figur: Wippen beim Laufen */
#amt-figur { pointer-events: none; }
#amt-figur.laeuft .amt-fig-innen { animation: amt-wipp .34s ease-in-out infinite; transform-box: fill-box; }
@keyframes amt-wipp { 0%, 100% { transform: translateY(0) rotate(0); } 25% { transform: translateY(-1.6px) rotate(-2deg); } 75% { transform: translateY(-1.6px) rotate(2deg); } }
.amt-zu-deko, .amt-plakette, .amt-kollege { pointer-events: none; }
.amt-frage p { margin: 0; }
@media (prefers-reduced-motion: reduce) {
  .amt-ausruf, .amt-dampf, .amt-fahne, .amt-birne, .amt-blase, #amt-figur.laeuft .amt-fig-innen { animation: none; }
}