/* MABUHAY Lageplan - interaktive Karte (Website + Festival App), dunkles Register.
   Hotspots als SVG-Polygone ueber der Illustration, Chip-Legende, Bottom-Sheet,
   Pinch-Zoom/Pan, Vollbild. Sheet/Scrim/Vollbild haengen am body (lp-sheet, lp-scrim, lp-full). */
.lp{--lp-gold:#e0af4c;--lp-ink:#0e2140;--lp-text:#faf3e8;position:relative;font-family:var(--font-body,system-ui,sans-serif)}
.lp__stage{position:relative;overflow:hidden;border-radius:12px;background:#ece5d6;aspect-ratio:3040/1974;touch-action:pan-y;user-select:none;-webkit-user-select:none;box-shadow:0 18px 50px rgba(0,0,0,.35);outline:none}
.lageplan .lp__stage{border-radius:var(--radius,14px)}
.lp__canvas{position:absolute;left:0;top:0;transform-origin:0 0;will-change:transform}
.lp__canvas.is-anim{transition:transform 420ms cubic-bezier(.23,1,.32,1)}
.lp__canvas img{width:100%;height:100%;display:block;border-radius:0;box-shadow:none;pointer-events:none;-webkit-user-drag:none;background:#ece5d6}
.lp__svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.lp__hit{fill:rgba(255,255,255,0);stroke:rgba(255,255,255,0);stroke-width:6;stroke-linejoin:round;pointer-events:all;cursor:pointer;transition:fill 180ms,stroke 180ms;outline:none}
.lp__hit:focus-visible{stroke:var(--lp-gold);stroke-dasharray:14 10;filter:drop-shadow(0 0 3px #0e2140) drop-shadow(0 0 2px #0e2140)}
@media(hover:hover){.lp__hit:hover{fill:rgba(224,175,76,.14);stroke:rgba(224,175,76,.65)}}
.lp__hit.is-active{fill:rgba(224,175,76,.22);stroke:#c8202a;stroke-width:6;filter:drop-shadow(0 0 8px rgba(200,32,42,.45))}
.lp.lp--focus .lp__hit:not(.is-active){fill:rgba(14,33,64,.28)}
.lp__ctrl{position:absolute;right:.6rem;top:.6rem;display:flex;flex-direction:column;gap:.35rem;z-index:3}
.lp__ctrl button,.lp-full__close{width:40px;height:40px;border-radius:12px;border:1px solid rgba(255,255,255,.28);background:rgba(10,26,51,.74);color:#faf3e8;display:grid;place-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);cursor:pointer;padding:0;transition:transform 120ms,background 160ms,opacity 160ms}
.lp__ctrl button:active,.lp-full__close:active{transform:scale(.94)}
.lp__ctrl button:disabled{opacity:.4;cursor:default}
.lp__ctrl button[hidden]{display:none}
.lp__ctrl svg,.lp-full__close svg,.lp-sheet__close svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.lp__hint{position:absolute;left:.7rem;bottom:.6rem;margin:0;padding:.32rem .7rem;border-radius:999px;background:rgba(10,26,51,.72);color:rgba(250,243,232,.88);font-size:.74rem;letter-spacing:.02em;z-index:3;pointer-events:none;transition:opacity 300ms}
.lp.is-zoomed .lp__hint,.lp.is-touched .lp__hint{opacity:0}
.lp__chips{display:flex;gap:.45rem;overflow-x:auto;padding:.9rem 0 .3rem;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.lp__chips::-webkit-scrollbar{display:none}
.lp__chip{flex:0 0 auto;display:inline-flex;align-items:center;gap:.45rem;min-height:40px;padding:.45rem .9rem;border-radius:999px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#faf3e8;font:600 .84rem/1 var(--font-body,system-ui,sans-serif);cursor:pointer;transition:background 160ms,border-color 160ms,transform 120ms;white-space:nowrap}
.lp__chip i{width:10px;height:10px;border-radius:50%;background:var(--c,#e0af4c);box-shadow:0 0 0 2px rgba(0,0,0,.25);flex:none}
.lp__chip:active{transform:scale(.96)}
.lp__chip.is-active{background:var(--lp-gold);border-color:var(--lp-gold);color:#12213f}
.lp__chip.is-active i{box-shadow:0 0 0 2px rgba(18,33,63,.35)}
.lp__chip--poi{opacity:.92}
.lp__sep{flex:none;width:1px;background:rgba(255,255,255,.22);margin:.4rem .2rem}

/* Website: die Karte steht auf Creme, dort waere die helle Chip-Leiste unsichtbar.
   Im Vollbild haengen die Chips ausserhalb von .lageplan und bleiben hell. */
.lageplan .lp__chip{background:rgba(23,49,88,.06);border-color:rgba(23,49,88,.55);color:var(--ink,#173158)}
.lageplan .lp__chip i{box-shadow:0 0 0 1px rgba(23,49,88,.55)}
.lageplan .lp__chip.is-active{background:var(--lp-gold);border-color:#b8892f;color:#12213f}
.lageplan .lp__chip.is-active i{box-shadow:0 0 0 2px rgba(18,33,63,.35)}
.lageplan .lp__sep{background:rgba(23,49,88,.2)}

/* Bottom-Sheet (am body, nicht modal) */
.lp-sheet{position:fixed;left:50%;bottom:0;transform:translate(-50%,105%);width:min(100%,560px);max-height:min(58vh,640px);overflow-y:auto;overscroll-behavior:contain;z-index:950;background:#122a52;color:#faf3e8;border-radius:22px 22px 0 0;box-shadow:0 -12px 40px rgba(0,0,0,.45);padding:.5rem 1.15rem calc(1.2rem + env(safe-area-inset-bottom));transition:transform 260ms cubic-bezier(.23,1,.32,1);font-family:var(--font-body,system-ui,sans-serif)}
.lp-sheet.is-open{transform:translate(-50%,0)}
.lp-sheet.is-drag{transition:none}
.lp-sheet[hidden]{display:none}
.lp-sheet__grab{width:44px;height:5px;border-radius:3px;background:rgba(250,243,232,.35);margin:.35rem auto .9rem;touch-action:none}
.lp-sheet__head{display:grid;grid-template-columns:auto 1fr;gap:.9rem;align-items:center;padding-right:2.6rem;touch-action:none}
.lp-sheet__close{position:absolute;top:.85rem;right:.85rem;width:36px;height:36px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);color:#faf3e8;display:grid;place-items:center;cursor:pointer;padding:0}
.lp-sheet__thumb{width:64px;height:64px;border-radius:16px;object-fit:cover;border:1px solid rgba(255,255,255,.2)}
.lp-sheet__swatch{width:64px;height:64px;border-radius:16px;display:grid;place-items:center;background:var(--c,#e0af4c);color:#12213f}
.lp-sheet__logo{width:64px;height:64px;object-fit:contain;border-radius:12px;background:transparent}
.lp-sheet__swatch--nr{font-family:var(--font-display,system-ui,sans-serif);font-weight:800;font-size:1.15rem;letter-spacing:.02em;color:#12213f}
.lp-sheet__list{list-style:none;margin:.9rem 0 0;padding:0;display:grid;grid-template-columns:1fr;gap:.35rem}
.lp-sheet__list button{width:100%;display:flex;align-items:center;gap:.75rem;min-height:44px;padding:.5rem .8rem;border-radius:12px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:#faf3e8;font:600 .95rem/1.25 var(--font-body,system-ui,sans-serif);text-align:left;cursor:pointer}
.lp-sheet__list button:active{transform:scale(.99)}
.lp-sheet__list b{flex:none;min-width:2.6rem;font-family:var(--font-display,system-ui,sans-serif);font-weight:800;color:#e0af4c}
.lp-sheet__list b:empty{display:none}
@media(min-width:560px){.lp-sheet__list{grid-template-columns:1fr 1fr}}
.lp-sheet__swatch svg{width:28px;height:28px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.lp-sheet__kicker{display:block;font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#e0af4c;margin-bottom:.2rem}
.lp-sheet h3{margin:0;font-family:var(--font-display,system-ui,sans-serif);font-weight:800;font-size:1.2rem;line-height:1.15;color:#faf3e8;text-wrap:balance}
.lp-sheet__desc{margin:.9rem 0 0;color:rgba(250,243,232,.86);line-height:1.5;font-size:.98rem}
.lp-sheet__actions{display:flex;gap:.6rem;margin-top:1.1rem;flex-wrap:wrap}
.lp-sheet__btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:.6rem 1.15rem;border-radius:999px;font-weight:700;font-size:.92rem;text-decoration:none;cursor:pointer;border:1px solid transparent;font-family:inherit;transition:transform 120ms}
.lp-sheet__btn:active{transform:scale(.97)}
.lp-sheet__btn--primary{background:#e0af4c;color:#12213f}
.lp-sheet__btn--ghost{background:transparent;color:#faf3e8;border-color:rgba(255,255,255,.25)}

/* Vollbild (am body) */
.lp-full{position:fixed;inset:0;z-index:900;background:#0a1a33;display:flex;flex-direction:column;padding:calc(.6rem + env(safe-area-inset-top)) 0 0;color:#faf3e8;font-family:var(--font-body,system-ui,sans-serif)}
.lp-full__bar{display:flex;align-items:center;justify-content:space-between;padding:0 .9rem .5rem;font-family:var(--font-display,system-ui,sans-serif);font-weight:800;font-size:1.05rem}
.lp-full__body{flex:1;min-height:0;position:relative;margin:0 .5rem}
.lp-full .lp__stage{position:absolute;inset:0;aspect-ratio:auto;border-radius:12px;box-shadow:none}
.lp-full .lp__chips{padding:.7rem .9rem calc(.7rem + env(safe-area-inset-bottom))}
body.lp-lock{overflow:hidden}
@media (prefers-reduced-motion:reduce){.lp__canvas.is-anim,.lp-sheet,.lp__hit{transition:none}}

/* Vollbildmodus (Festival App, opts.immersive): die Karte fuellt ihren Container,
   die Filter-Chips liegen unten auf der Karte. */
.lp--immersive{position:absolute;inset:0}
.lp--immersive .lp__stage{position:absolute;inset:0;aspect-ratio:auto;border-radius:0;box-shadow:none}
.lp--immersive .lp__hint{top:.7rem;bottom:auto;left:.75rem}
.lp--immersive .lp__chips{position:absolute;left:0;right:0;bottom:0;z-index:4;padding:1.6rem .75rem .75rem;background:linear-gradient(to top,rgba(10,26,51,.9) 35%,rgba(10,26,51,0));pointer-events:none}
.lp--immersive .lp__chip{pointer-events:auto;background:rgba(10,26,51,.82);border-color:rgba(255,255,255,.28);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.lp--immersive .lp__chip.is-active{background:var(--lp-gold);border-color:var(--lp-gold);color:#12213f}
.lp--immersive .lp__sep{pointer-events:none}
.lp__chip--alle{padding-inline:1.1rem}
.lp__liste{position:absolute;right:.75rem;bottom:4.9rem;z-index:5;display:inline-flex;align-items:center;gap:.5rem;min-height:44px;padding:.55rem 1rem;border-radius:999px;border:1px solid #b8892f;background:var(--lp-gold);color:#12213f;font:700 .9rem/1 var(--font-body,system-ui,sans-serif);box-shadow:0 8px 24px rgba(10,26,51,.35);cursor:pointer}
.lp__liste[hidden]{display:none}
.lp__liste svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round}
.lp__liste:active{transform:scale(.97)}
/* Ansage fuer Screenreader (Filter gesetzt/aufgehoben), unsichtbar */
.lp__live{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* iPhone quer: Notch und Rundungen seitlich freihalten */
.lp--immersive .lp__chips{padding-left:max(.75rem,env(safe-area-inset-left));padding-right:max(.75rem,env(safe-area-inset-right))}
.lp--immersive .lp__ctrl{right:calc(.6rem + env(safe-area-inset-right))}
.lp--immersive .lp__hint{left:calc(.75rem + env(safe-area-inset-left))}
.lp--immersive .lp__liste{right:calc(.75rem + env(safe-area-inset-right))}
