/* All text assets use ASCII for legacy CMS compatibility. */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: #111827; background: #fff; font: 1rem/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; }
button, summary, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; color: inherit; cursor: pointer; }
a { color: #174ea6; text-underline-offset: .15em; }
a:focus-visible, button:focus-visible, summary:focus-visible, [tabindex]:focus-visible { outline: 3px solid #174ea6; outline-offset: 3px; }
header { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .5rem 1rem; padding: .65rem 1rem; border-bottom: 1px solid #d1d5db; }
h1 { margin: 0; font-size: 1.25rem; }
header a { display: inline-flex; min-height: 44px; align-items: center; }
.map-help { margin: .5rem 1rem; color: #374151; font-size: .875rem; }
.map-frame { position: relative; }
.map-viewport { position: relative; width: 100%; height: 78vh; height: 78svh; min-height: 300px; overflow: hidden; background: #fff; cursor: grab; }
.js .map-viewport { touch-action: none; }
.map-viewport.dragging { cursor: grabbing; }
.map-viewport:focus-visible { outline-offset: -4px; }
.map-canvas { position: absolute; transform-origin: 0 0; user-select: none; -webkit-user-select: none; }
.floor-image { display: block; max-width: none; pointer-events: none; }
.hotspot, .decoration { position: absolute; transform: translate(-50%,-50%); display: flex; align-items: center; justify-content: center; }
.hotspot { padding: 0; border: 2px solid transparent; border-radius: 6px; background: transparent; min-width: calc(28px / var(--zoom,1)); min-height: calc(28px / var(--zoom,1)); }
.hotspot img, .decoration img { width: 100%; height: 100%; object-fit: contain; pointer-events: none; }
.hotspot:hover, .hotspot:focus-visible { box-shadow: 0 0 0 calc(3px / var(--zoom,1)) #2563eb; z-index: 2; }
.hotspot:focus-visible { outline: none; }
.decoration { pointer-events: none; }
.tooltip { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%) scale(calc(1 / var(--zoom,1))); transform-origin: bottom center; padding: .3rem .6rem; margin-bottom: .5rem; border-radius: 4px; background: #1f2937; color: white; white-space: nowrap; font-size: .875rem; pointer-events: none; visibility: hidden; }
.hotspot:hover .tooltip, .hotspot:focus-visible .tooltip, .hotspot.highlighted .tooltip { visibility: visible; }
.hotspot.highlighted { box-shadow: 0 0 0 calc(4px / var(--zoom,1)) #2563eb; z-index: 3; }
.map-controls { position: absolute; bottom: .75rem; left: .75rem; display: flex; flex-wrap: wrap; align-items: center; gap: .3rem; max-width: calc(100% - 1.5rem); padding: .4rem; background: #fff; border: 1px solid #d1d5db; border-radius: 6px; box-shadow: 0 2px 8px #0002; }
.map-controls button, .show-on-map { min-width: 44px; min-height: 44px; padding: .4rem .65rem; background: white; border: 1px solid #9ca3af; border-radius: 4px; }
.map-controls button:hover, .show-on-map:hover { background: #eff6ff; }
.map-controls output { min-width: 3rem; text-align: center; font-size: .875rem; }
#raumliste { max-width: 76rem; margin: 0 auto; padding: 1rem; scroll-margin-top: 1rem; }
#raumliste h2 { margin: 0 0 .5rem; }
details { border-bottom: 1px solid #d1d5db; }
summary { padding: .85rem .5rem; min-height: 48px; cursor: pointer; font-weight: 600; }
details[open] { padding-bottom: 1rem; }
details > .room-text, details > .room-media, details > .show-on-map { margin: .5rem; }
.room-text { overflow-wrap: anywhere; }
.room-text h2 { font-size: 1.2rem; }
.room-text p, .room-text ul { margin: .5rem 0 1rem; }
.room-text li { margin: .25rem 0; }
.room-media:empty, .room-text:empty { display: none; }
.room-media img { display: block; max-width: 100%; width: auto; height: auto; margin: auto; }
details .room-media img { max-height: 75vh; }
.room-media iframe { display: block; width: 100%; aspect-ratio: 16 / 9; min-height: 200px; border: 0; }
dialog { padding: 0; border: 0; border-radius: 8px; width: 95vw; max-width: 1600px; height: 90vh; height: 90dvh; max-height: calc(100dvh - 1rem); color: #111827; background: white; overflow: hidden; }
dialog::backdrop { background: #000c; }
dialog[open] { display: flex; flex-direction: column; }
body:has(dialog[open]) { overflow: hidden; }
.dialog-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .65rem 1rem; border-bottom: 1px solid #d1d5db; }
.dialog-header h2 { margin: 0; font-size: 1.1rem; overflow-wrap: anywhere; }
#closeDialog { flex-shrink: 0; font-size: 1.5rem; width: 44px; height: 44px; background: #f3f4f6; border: 1px solid #9ca3af; border-radius: 5px; }
.dialog-body { display: flex; flex: 1; min-height: 0; overflow: hidden; }
#dialogText { width: 28%; min-width: 240px; max-width: 390px; padding: 1rem; overflow-y: auto; }
#dialogMedia { flex: 1; min-width: 0; min-height: 0; padding: 1rem; background: #111827; display: flex; align-items: center; justify-content: center; }
#dialogMedia img { max-width: 100%; max-height: 100%; object-fit: contain; }
#dialogMedia iframe { height: 100%; }
#dialogText:empty, #dialogMedia:empty { display: none; }
#dialogText:only-child { width: 100%; max-width: none; }
.media-error { color: #fff; padding: 1rem; }
.media-error a { color: #fff; }
.sr-only, .skip-link { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip-link:focus { position: fixed; top: 1rem; left: 1rem; z-index: 10; width: auto; height: auto; clip-path: none; padding: .75rem; background: white; }
.notice { padding: 1rem; }
[hidden] { display: none !important; }
@media (max-width: 700px) {
 .map-viewport { height: 67vh; height: 67svh; }
 .dialog-body { flex-direction: column; overflow-y: auto; }
 #dialogText { width: 100%; min-width: 0; max-width: none; flex: 0 0 auto; overflow: visible; }
 #dialogMedia { flex: 0 0 auto; min-height: 220px; }
 #dialogMedia img { max-height: 65dvh; }
 #dialogMedia iframe { height: auto; }
 dialog { width: calc(100vw - 1rem); height: calc(100dvh - 1rem); }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
@media print { .map-controls, .map-help, dialog, .show-on-map { display: none !important; } .map-viewport { height: 80vh; } details { break-inside: avoid; } }
html:not(.js) .map-canvas { position: relative; width: 100% !important; height: auto !important; }
html:not(.js) .floor-image { width: 100%; height: auto; }
html:not(.js) .hotspot, html:not(.js) .decoration, html:not(.js) .map-controls { display: none; }
html:not(.js) .map-viewport { height: auto; }
.media-error { background: #111827; }