/* Ausschließlich die Danke-Seite. Die verbindliche Vorlage trägt die gesamte
   sichtbare Gestaltung; HTML liegt nur auf den funktionalen Flächen. */
:root{color-scheme:light}
*{box-sizing:border-box}
html,body{margin:0;min-width:0;background:#f9e7ca}
.thanks-body{font-family:Georgia,"Times New Roman",serif;color:#401814}
.thanks-viewport{position:relative;width:100%;margin-inline:auto}
.thanks-canvas{position:relative;width:100%;aspect-ratio:3/2;background:url("Danke/Hintergrund%202.png") center top/100% 100% no-repeat;isolation:isolate;container-type:inline-size}
.back-home-link{position:absolute;z-index:3;left:31.25%;top:3.05%;padding-left:clamp(18px,1.8cqw,28px);border-left:1px solid #d99c5a;color:#6d2f1f;font-size:clamp(13px,1.42cqw,22px);font-weight:700;line-height:1.7;text-decoration:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.back-home-link:hover,.back-home-link:focus-visible{text-decoration:underline}.back-home-link:focus-visible{outline:2px solid #9f5b18;outline-offset:3px}

/* Sanfte Lichtimpulse liegen ausschließlich über den in der Vorlage bereits
   vorhandenen Laternen, Sternen und Glühpunkten. */
.thanks-canvas::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;mix-blend-mode:screen}
.thanks-canvas::before{background:radial-gradient(circle at 5.3% 19%,#fffde4 0 1.18%,#ffd05d91 2.15%,transparent 4.9%),radial-gradient(circle at 8.8% 71%,#fffde4 0 1.32%,#ffcf5c97 2.35%,transparent 5.25%),radial-gradient(circle at 15% 61%,#fffde1 0 .38%,#ffd35d72 .74%,transparent 1.55%),radial-gradient(circle at 22% 53%,#fffde1 0 .34%,#ffd35d6d .68%,transparent 1.42%),radial-gradient(circle at 85% 34%,#fffde1 0 .42%,#ffd35d76 .82%,transparent 1.65%),radial-gradient(circle at 91% 77%,#fffde1 0 .37%,#ffd35d70 .73%,transparent 1.55%),radial-gradient(circle at 13% 90%,#fffde1 0 .32%,#ffd35d6b .64%,transparent 1.35%);animation:thanks-lantern-glow 5.2s ease-in-out infinite alternate}
@keyframes thanks-lantern-glow{0%{opacity:.26;filter:blur(.15px)}55%{opacity:.63;filter:blur(.55px)}100%{opacity:.4;filter:blur(.25px)}}
.twinkle-star{position:absolute;z-index:1;width:clamp(8px,1cqw,16px);aspect-ratio:1;background:#fff8cf;clip-path:polygon(50% 0,58% 42%,100% 50%,58% 58%,50% 100%,42% 58%,0 50%,42% 42%);pointer-events:none;animation:thanks-pure-star 3.8s ease-in-out infinite alternate}
.star-one{left:91.15%;top:15.3%;animation-delay:-.4s}.star-two{left:94.65%;top:51.3%;animation-delay:-1.9s}.star-three{left:81.6%;top:66.3%;animation-delay:-.9s}.star-four{left:72.6%;top:12.3%;animation-delay:-2.7s}.star-five{left:68.6%;top:9.3%;animation-delay:-1.3s}.star-six{left:95.55%;top:5.3%;animation-delay:-3.2s}
@keyframes thanks-pure-star{0%{opacity:.3;transform:scale(.78)}55%{opacity:.8;transform:scale(1.06)}100%{opacity:.45;transform:scale(.88)}}

/* Die echte Liste ersetzt allein den statischen Listenausschnitt der Vorlage
   und bleibt bei späteren Einträgen in sich scrollbar. */
.credits-scroll{position:absolute;z-index:2;left:22.85%;top:59.3%;width:55.15%;height:20.1%;padding:4px 20px 4px 0;overflow-y:scroll;border-radius:20px;background:#fff9ed;scrollbar-width:thin;scrollbar-color:#c5872b #f7e5c7;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.credits-scroll::-webkit-scrollbar{width:14px}
.credits-scroll::-webkit-scrollbar-track{border:3px solid #fff7e7;border-radius:20px;background:#f7e5c7}
.credits-scroll::-webkit-scrollbar-thumb{border:3px solid #f7e5c7;border-radius:20px;background:#c5872b}
.idea-credits{display:grid;gap:clamp(3px,.42cqw,7px);min-height:125%;margin:0;padding:0;list-style:none}
.idea-credits li{position:relative;display:flex;align-items:center;min-height:calc((100% - 18px)/4);padding:clamp(6px,.68cqw,10px) clamp(8px,1.05cqw,16px) clamp(6px,.68cqw,10px) clamp(29px,3.15cqw,48px);border:1px solid #efcf9c;border-radius:18px;background:#fdf0d8;color:#482018;font-size:clamp(8px,1.06cqw,16px);line-height:1.18}
.idea-credits li>span{position:absolute;left:clamp(10px,1.12cqw,17px);top:50%;color:#d8952d;font-size:clamp(13px,1.48cqw,22px);transform:translateY(-50%)}.idea-credits strong{color:#482018}
.credits-controls{position:absolute;z-index:3;left:77.1%;top:59.75%;width:1.25%;height:19.2%;pointer-events:none}.credits-controls button{position:absolute;padding:0;border:0;background:transparent;color:#cb8d32;font:inherit;font-size:clamp(10px,1.1cqw,17px);line-height:.7;cursor:pointer;pointer-events:auto}.credits-up{top:0;left:50%;transform:translateX(-50%)}.credits-down{bottom:0;left:50%;transform:translateX(-50%)}.credits-track{position:absolute;top:12%;left:50%;width:2px;height:76%;border-radius:99px;background:#c5872b;transform:translateX(-50%)}.credits-grip{z-index:1;left:50%;top:50%;width:clamp(8px,1cqw,15px);min-height:clamp(14px,1.9cqw,28px);border:1px solid #e9bd76!important;border-radius:999px!important;background:linear-gradient(90deg,#ad6d1f,#d99a38,#ad6d1f)!important;box-shadow:0 1px 3px #77400f73,inset 0 1px #ffe6aa;touch-action:none;transform:translate(-50%,-50%)}

/* Der Kontaktbereich bleibt als echter mailto-Link funktionsfähig. */
.idea-contact{position:absolute;z-index:2;left:25.8%;top:85.35%;width:48.1%;min-height:9.35%;display:grid;grid-template-columns:clamp(28px,3.65cqw,54px) 1fr auto;align-items:center;gap:clamp(7px,.95cqw,14px);padding:clamp(6px,.7cqw,11px) clamp(10px,1.2cqw,18px);border:1px solid #edcf9c;border-radius:clamp(12px,1.3cqw,19px);background:#fff3dc;color:#482018;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.idea-contact::before{content:"♥";position:absolute;z-index:3;left:50%;top:0;display:grid;width:clamp(30px,2.45cqw,38px);height:clamp(24px,1.95cqw,30px);place-items:center;background:#fff3dc;color:#e1a145;font-family:Georgia,"Times New Roman",serif;font-size:clamp(18px,1.65cqw,25px);line-height:1;pointer-events:none;transform:translate(-50%,-54%)}
.mail-mark{color:#713519;font-size:clamp(20px,2.35cqw,35px);line-height:1}.idea-contact h2{margin:0 0 2px;font-size:clamp(9px,1.1cqw,16px);line-height:1.1}.idea-contact p{margin:0;color:#6b493e;font-size:clamp(7px,.82cqw,12px);line-height:1.2}
.idea-contact a{display:inline-flex;align-items:center;gap:clamp(8px,1.1cqw,16px);padding:clamp(7px,.8cqw,12px) clamp(11px,1.35cqw,20px);border-radius:999px;background:linear-gradient(135deg,#c57a1b,#a65c14);box-shadow:inset 0 1px #ffe4a7,0 3px 8px #9f5b182b;color:#fff9ea;font-size:clamp(8px,.96cqw,14px);text-decoration:none;white-space:nowrap}.idea-contact a:focus-visible,.credits-scroll:focus-visible{outline:2px solid #9f5b18;outline-offset:3px}.idea-contact a span{font-size:1.45em;line-height:.5}
@media(max-width:1535px){.thanks-viewport{width:var(--thanks-display-width);height:var(--thanks-display-height)}.thanks-canvas{width:1536px;height:1024px;aspect-ratio:auto;transform:scale(var(--thanks-scale));transform-origin:top left}}
@media(prefers-reduced-motion:reduce){.thanks-canvas::before,.twinkle-star{animation:none;opacity:.55;filter:none;transform:none}}
