/* Anpassungen für den Einbau in WordPress: Vollbild statt fester Höhe, Anmeldeseite. */
html, body.shg-body { margin:0; padding:0; background:#07070b; color-scheme:dark; }
body.shg-body { min-height:100vh; min-height:100svh; }
body.admin-bar.shg-body #schlichtholz-geheimgang .sh-scene { min-height:calc(100svh - 32px); }
#schlichtholz-geheimgang.shg-full .sh-scene,
#schlichtholz-geheimgang.shg-full .sh-scene { height:auto; min-height:100vh; min-height:100svh; }
@media(max-width:580px) { #schlichtholz-geheimgang.shg-full .sh-scene { height:auto; min-height:100svh; } }
@media(orientation:landscape) and (max-height:470px) { #schlichtholz-geheimgang.shg-full .sh-scene { height:auto; min-height:100svh; } }

/* Anmeldeseite */
#schlichtholz-geheimgang.shg-login .sh-entry { position:absolute; animation:sh-arrive .7s ease both; }
#schlichtholz-geheimgang .shg-card { position:relative; width:min(100%,340px); display:grid; text-align:center; }
#schlichtholz-geheimgang input:focus-visible { outline:2px solid #f6d79e; outline-offset:2px; }
#schlichtholz-geheimgang .shg-remember { display:flex; align-items:center; gap:8px; margin:0 0 10px; font-size:13px; cursor:pointer; }
#schlichtholz-geheimgang .shg-remember input { min-height:0; width:16px; height:16px; margin:0; padding:0; accent-color:#c49660; }
#schlichtholz-geheimgang .shg-button { display:grid; place-items:center; text-decoration:none; }
#schlichtholz-geheimgang .shg-link { display:grid; place-items:center; text-decoration:none; }
#schlichtholz-geheimgang .shg-link:hover { text-decoration:underline; }
#schlichtholz-geheimgang .shg-text { margin:0 0 16px; color:#e9dac5; }
#schlichtholz-geheimgang .shg-error { margin:0 0 14px; padding:9px 12px; color:#ffd9d9; background:#3a1220; border:1px solid #a8475f; border-radius:3px; font-size:13px; text-align:center; }
#schlichtholz-geheimgang .shg-note { margin:0 0 14px; color:#c2ad97; font-size:13px; text-align:center; }

/* Die Halle */
#schlichtholz-geheimgang.shg-hall .sh-scene { overflow:visible; }
#schlichtholz-geheimgang .shg-hall-inner { position:relative; max-width:880px; margin:0 auto; padding:clamp(28px,6vh,64px) 18px 40px; animation:sh-arrive .8s ease both; }
#schlichtholz-geheimgang.shg-hall .sh-scene::before { content:""; position:absolute; inset:14px; border:1px solid #b18a5140; pointer-events:none; }
#schlichtholz-geheimgang .shg-hall-head { text-align:center; margin-bottom:clamp(24px,5vh,44px); }
#schlichtholz-geheimgang .shg-hall-head img { width:72px; height:auto; filter:drop-shadow(0 0 18px #d594362e); }
#schlichtholz-geheimgang .shg-hall-head .sh-subtitle { margin-top:12px; }
#schlichtholz-geheimgang .shg-hall-title { margin:10px 0 0; color:#ffe3b5; font:400 clamp(26px,4.6vw,42px)/1.15 Georgia,serif; letter-spacing:.02em; text-transform:none; text-indent:0; }
#schlichtholz-geheimgang .shg-tiles { display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(12px,2vw,20px); }
@media(max-width:640px) { #schlichtholz-geheimgang .shg-tiles { grid-template-columns:repeat(2,1fr); } }
#schlichtholz-geheimgang .shg-tile { position:relative; display:grid; justify-items:center; align-content:center; gap:6px; min-height:150px; padding:20px 12px; text-align:center; text-decoration:none; color:#f6e3c2; font:inherit; cursor:pointer; border:1px solid #8a6d4c80; border-radius:4px; background:radial-gradient(ellipse at 50% 0%,#2b1a3380,transparent 70%),linear-gradient(160deg,#151019,#0c0a10); box-shadow:inset 0 0 0 5px #0c0a10,inset 0 0 0 6px #6f553a55,0 10px 24px #0008; transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease; }
#schlichtholz-geheimgang .shg-tile:hover,#schlichtholz-geheimgang .shg-tile:focus-visible { transform:translateY(-3px); border-color:#d3a86c; box-shadow:inset 0 0 0 5px #0c0a10,inset 0 0 0 6px #b98d5899,0 0 26px #9a36d055,0 12px 26px #000a; outline:none; }
#schlichtholz-geheimgang .shg-tile-icon { display:grid; place-items:center; width:62px; height:62px; color:#e8c27f; border:1px solid #a7804f; border-radius:50%; background:radial-gradient(circle,#1d1424,#0b080e 70%); box-shadow:0 0 16px #9a36d040; }
#schlichtholz-geheimgang .shg-tile-icon svg { width:32px; height:32px; }
#schlichtholz-geheimgang .shg-tile-name { margin-top:6px; color:#ffe4af; font:400 17px/1.25 Georgia,serif; }
#schlichtholz-geheimgang .shg-tile-info { color:#b9a68f; font-size:11px; letter-spacing:.2em; text-transform:uppercase; }
#schlichtholz-geheimgang .shg-hint { min-height:1.5em; margin:18px 0 0; text-align:center; color:#d9c6ab; font-size:14px; }
#schlichtholz-geheimgang .shg-hall-foot { margin-top:28px; text-align:center; }
#schlichtholz-geheimgang .shg-hall-foot a { color:#c9a874; font-size:13px; letter-spacing:.08em; }

/* Lebendige Anzeigen */
#schlichtholz-geheimgang .shg-panels { display:grid; gap:clamp(12px,2vw,20px); margin-bottom:clamp(16px,3vw,24px); }
#schlichtholz-geheimgang .shg-panel { position:relative; padding:18px 20px 14px; border:1px solid #8a6d4c80; border-radius:4px; background:radial-gradient(ellipse at 15% 0%,#3a214a66,transparent 60%),linear-gradient(160deg,#151019,#0c0a10); box-shadow:inset 0 0 0 5px #0c0a10,inset 0 0 0 6px #6f553a55,0 10px 24px #0008; }
#schlichtholz-geheimgang .shg-panel-label { margin:0 0 10px; color:#c0ad97; font-size:11px; letter-spacing:.24em; text-transform:uppercase; }
#schlichtholz-geheimgang .shg-panel-empty { margin:0; color:#d9c6ab; }
#schlichtholz-geheimgang .shg-weather-main { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
#schlichtholz-geheimgang .shg-weather-icon { display:grid; place-items:center; width:58px; height:58px; color:#e8c27f; border:1px solid #a7804f; border-radius:50%; background:radial-gradient(circle,#1d1424,#0b080e 70%); box-shadow:0 0 16px #9a36d040; }
#schlichtholz-geheimgang .shg-weather-icon svg { width:30px; height:30px; }
#schlichtholz-geheimgang .shg-weather-temp { color:#ffe4af; font:400 clamp(36px,6vw,48px)/1 Georgia,serif; }
#schlichtholz-geheimgang .shg-weather-text { color:#f6e3c2; font-size:16px; line-height:1.3; }
#schlichtholz-geheimgang .shg-weather-text small { color:#b9a68f; font-size:13px; }
#schlichtholz-geheimgang .shg-weather-facts { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin:16px 0 0; padding-top:14px; border-top:1px solid #8a6d4c40; }
@media(max-width:520px) { #schlichtholz-geheimgang .shg-weather-facts { grid-template-columns:repeat(2,1fr); } }
#schlichtholz-geheimgang .shg-weather-facts dt { color:#b9a68f; font-size:11px; letter-spacing:.16em; text-transform:uppercase; }
#schlichtholz-geheimgang .shg-weather-facts dd { margin:2px 0 0; color:#ffe4af; font:400 17px Georgia,serif; }
#schlichtholz-geheimgang .shg-panel-source { margin:12px 0 0; color:#8f7f6d; font-size:11px; }
#schlichtholz-geheimgang .shg-panel-source a { color:#b9a68f; }

/* Schloss blendet beim Loslassen wieder aus */
#schlichtholz-geheimgang .sh-lock[data-leave] { animation:shg-leave .32s ease forwards; pointer-events:none; }
@keyframes shg-leave { to { opacity:0; transform:translate(-50%,-50%) scale(.6) rotate(18deg); } }

/* Das Tor */
#schlichtholz-geheimgang .sh-gate { position:fixed; inset:0; z-index:100; pointer-events:none; visibility:hidden; overflow:hidden; perspective:1400px; }
#schlichtholz-geheimgang .sh-scene:is([data-phase="gate"],[data-phase="open"]) .sh-gate { visibility:visible; }
#schlichtholz-geheimgang .sh-glow { position:absolute; inset:-20%; opacity:0; background:radial-gradient(circle at 50% 50%,#fff6e6 0%,#f3c9ff 9%,#9a36d0 24%,#2a1238 48%,#07070b 72%); transform:scale(.6); transition:opacity .6s ease,transform 1.3s cubic-bezier(.2,.7,.2,1); }
#schlichtholz-geheimgang .sh-door { position:absolute; top:0; bottom:0; width:50.5%; overflow:hidden; background:linear-gradient(90deg,#0a080d,#1a1320 60%,#241a2b); box-shadow:inset 0 0 120px #000c; transition:transform .55s cubic-bezier(.7,0,.3,1); will-change:transform; }
#schlichtholz-geheimgang .sh-door::before { content:""; position:absolute; inset:0; background:repeating-linear-gradient(90deg,#c9a0660a 0 1px,transparent 1px 6px); }
#schlichtholz-geheimgang .sh-door-l { left:0; transform:translateX(-102%); border-right:1px solid #e9c48a; }
#schlichtholz-geheimgang .sh-door-r { right:0; transform:translateX(102%); border-left:1px solid #e9c48a; background:linear-gradient(270deg,#0a080d,#1a1320 60%,#241a2b); }
#schlichtholz-geheimgang .sh-door-r svg { transform:scaleX(-1); }
#schlichtholz-geheimgang .sh-door svg { position:absolute; inset:0; width:100%; height:100%; fill:none; stroke-linecap:round; stroke-linejoin:round; }
#schlichtholz-geheimgang .g-frame { stroke:#9b7a52; stroke-width:1.2; opacity:.55; }
#schlichtholz-geheimgang .g-traces path { stroke:#ffd98f; stroke-width:3; stroke-dasharray:1; stroke-dashoffset:1; filter:drop-shadow(0 0 6px #ffcf7a) drop-shadow(0 0 14px #b15cff); }
#schlichtholz-geheimgang .g-pads circle { stroke:#e8c27f; stroke-width:3; opacity:.25; }
#schlichtholz-geheimgang .g-ring { stroke:#d9b27a; stroke-width:2; opacity:.7; }
#schlichtholz-geheimgang .g-ring2 { stroke:#9a36d0; stroke-width:1; opacity:.6; stroke-dasharray:4 10; }
#schlichtholz-geheimgang .sh-seal { position:absolute; left:50%; top:50%; width:96px; height:96px; display:grid; place-items:center; border-radius:50%; transform:translate(-50%,-50%) scale(.4); opacity:0; background:radial-gradient(circle,#2b1837,#0b080e 70%); border:1px solid #e3bb7f; box-shadow:0 0 0 6px #bb8f5522,0 0 40px #9a36d0aa; transition:transform .5s cubic-bezier(.2,.9,.3,1.3) .35s,opacity .3s ease .35s; }
#schlichtholz-geheimgang .sh-seal img { width:46px; height:46px; filter:drop-shadow(0 0 10px #ffd27a); }
#schlichtholz-geheimgang .sh-beam { position:absolute; left:50%; top:0; bottom:0; width:2px; margin-left:-1px; opacity:0; background:linear-gradient(transparent,#fff3dc 30%,#fff 50%,#fff3dc 70%,transparent); box-shadow:0 0 18px 4px #f0c7ff,0 0 60px 14px #9a36d0; }

/* Phase 1: Tor schließt sich, Leiterbahnen laden sich auf */
#schlichtholz-geheimgang .sh-scene:is([data-phase="gate"],[data-phase="open"]) .sh-door { transform:translateX(0); }
#schlichtholz-geheimgang .sh-scene:is([data-phase="gate"],[data-phase="open"]) .sh-seal { opacity:1; transform:translate(-50%,-50%) scale(1); }
#schlichtholz-geheimgang .sh-scene[data-phase="gate"] .g-traces path { animation:shg-charge .8s cubic-bezier(.5,0,.2,1) .5s forwards; }
#schlichtholz-geheimgang .sh-scene[data-phase="gate"] .g-pads circle { animation:shg-pad .3s ease 1.15s forwards; }
#schlichtholz-geheimgang .sh-scene[data-phase="gate"] .g-ring2 { animation:shg-spin 6s linear infinite; transform-origin:500px 500px; }
@keyframes shg-charge { to { stroke-dashoffset:0; } }
@keyframes shg-pad { to { opacity:1; fill:#ffd98f55; } }
@keyframes shg-spin { to { transform:rotate(360deg); } }

/* Phase 2: Siegel bricht auf, Licht, Flügel gleiten auseinander */
#schlichtholz-geheimgang .sh-scene[data-phase="open"] .g-traces path { stroke-dashoffset:0; }
#schlichtholz-geheimgang .sh-scene[data-phase="open"] .g-pads circle { opacity:1; }
#schlichtholz-geheimgang .sh-scene[data-phase="open"] .sh-beam { animation:shg-beam 1.1s ease forwards; }
#schlichtholz-geheimgang .sh-scene[data-phase="open"] .sh-seal { transition:transform .5s ease,opacity .35s ease .15s; transform:translate(-50%,-50%) scale(1.8); opacity:0; }
#schlichtholz-geheimgang .sh-scene[data-phase="open"] .sh-door { transition:transform 1.05s cubic-bezier(.65,0,.25,1) .18s; }
#schlichtholz-geheimgang .sh-scene[data-phase="open"] .sh-door-l { transform:translateX(-104%) rotateY(14deg); }
#schlichtholz-geheimgang .sh-scene[data-phase="open"] .sh-door-r { transform:translateX(104%) rotateY(-14deg); }
#schlichtholz-geheimgang .sh-scene[data-phase="open"] .sh-glow { opacity:1; transform:scale(1.25); }
@keyframes shg-beam { 0% { opacity:0; } 15% { opacity:1; } 60% { opacity:1; width:2px; } 100% { opacity:0; width:60vw; margin-left:-30vw; } }

@media(prefers-reduced-motion:reduce) {
  #schlichtholz-geheimgang .sh-gate * { animation:none!important; transition:none!important; }
}

/* Weicher Übergang: Anmeldeseite und Halle tauchen aus dem Torlicht auf */
#schlichtholz-geheimgang:is(.shg-login,.shg-hall)::after { content:""; position:fixed; inset:0; z-index:50; pointer-events:none; background:radial-gradient(circle at 50% 50%,#fff6e6 0%,#f3c9ff 9%,#9a36d0 24%,#2a1238 48%,#07070b 72%); transform:scale(1.25); animation:shg-fadeout .9s ease forwards; }
@keyframes shg-fadeout { to { opacity:0; visibility:hidden; } }
@media(prefers-reduced-motion:reduce) { #schlichtholz-geheimgang:is(.shg-login,.shg-hall)::after { display:none; } }