:root {
  --accent: #e0244f;
  --accent-strong: #ff3b6b;
  --accent-hover: #f7b2c3;
  --text: #f3e6ea;
  --muted: #a58a94;
  --line: #3a1424;
  --bg: #070306;
  --card: #140810;
  --card-2: #1e0b17;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font: 16px/1.5 Arial, Helvetica, sans-serif;
}
a { color: var(--accent); }
a:hover, a:focus { color: var(--accent-hover); }
img { max-width: 100%; height: auto; }

.wrap { max-width: 960px; margin: 0 auto; padding: 0 16px; }


.site-header { background: var(--accent); color: #fff; }
.site-header .wrap { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 24px; padding-top: 12px; padding-bottom: 12px; }
.logo { color: #fff; font-weight: bold; font-size: 1.15rem; text-decoration: none; }
.logo:hover { color: #fff; text-decoration: underline; }
.mainnav { display: flex; gap: 16px; flex-wrap: wrap; }
.mainnav a { color: #fff; text-decoration: none; padding: 6px 0; }
.mainnav a:hover { text-decoration: underline; color: #fff; }

h1 { font-size: 1.75rem; line-height: 1.25; margin: 28px 0 12px; color: var(--accent); }
.intro { background: var(--card); border: 1px solid var(--line); border-radius: 6px; padding: 4px 20px; margin-bottom: 20px; }
.intro h2 { font-size: 1.2rem; }


.pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 16px 0; }
.pagination:empty { display: none; }
.pagination a, .pagination strong {
  display: inline-block; min-width: 40px; padding: 8px 10px; text-align: center;
  border: 1px solid var(--line); border-radius: 4px; background: var(--card); text-decoration: none;
}
.pagination strong { background: #990000; border-color: #b30000; color: #fff; }


.toplist { width: 100%; border-collapse: separate; border-spacing: 0 8px; }
.toplist th { font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); font-weight: normal; padding: 0 12px; text-align: left; }
.toplist th.rank, .toplist th.hits { text-align: center; }
.toplist th.rank { font-size: .8rem; font-weight: normal; color: var(--muted); }
.toplist td { background: var(--card); padding: 12px; vertical-align: top; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.toplist td:first-child { border-left: 3px solid var(--accent-strong); border-radius: 6px 0 0 6px; }
.toplist td:last-child { border-right: 1px solid var(--line); border-radius: 0 6px 6px 0; }
.toplist .rank { width: 56px; text-align: center; font-size: 1.35rem; font-weight: bold; color: var(--accent); vertical-align: middle; }
.toplist .hits { width: 72px; text-align: center; vertical-align: middle; font-weight: bold; }
.toplist .hits small { display: block; font-weight: normal; color: var(--muted); font-size: .8rem; }
.sitetitle { font-weight: bold; font-size: 1.05rem; }
.new { color: var(--accent-strong); font-weight: bold; font-size: .8rem; text-transform: uppercase; margin-left: 6px; }
.banner { display: block; margin: 8px 0 4px; border: 0; }
.description { margin: 6px 0 0; color: var(--text); font-size: .95rem; overflow-wrap: anywhere; }


.stats ul { list-style: none; padding: 0; margin: 24px 0; display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.stats li { background: var(--card); border: 1px solid var(--line); border-radius: 4px; padding: 6px 10px; font-size: .85rem; color: var(--muted); }
.stats strong { color: var(--text); }


.site-footer { border-top: 1px solid var(--line); margin-top: 24px; padding: 16px 0 32px; text-align: center; font-size: .9rem; color: var(--muted); }
.license a { font-size: inherit; }


@media (max-width: 640px) {
  h1 { font-size: 1.4rem; }
  .toplist, .toplist tbody, .toplist tr, .toplist td { display: block; width: 100%; }
  .toplist .list-head { display: none; }
  .toplist tr.entry {
    display: grid; grid-template-columns: 48px 1fr 1fr; margin-bottom: 10px;
    background: var(--card); border: 1px solid var(--line); border-left: 3px solid var(--accent-strong); border-radius: 6px;
  }
  .toplist td, .toplist td:first-child, .toplist td:last-child { border: 0; border-radius: 0; background: transparent; padding: 10px; }
  .toplist .rank { width: auto; grid-row: span 2; }
  .toplist .site { grid-column: 2 / 4; padding-left: 0; }
  .toplist td.hits { width: auto; grid-column: auto; border-top: 1px solid var(--line); font-size: .9rem; padding: 6px; }
  .toplist .hits::before { content: attr(data-label) " "; font-weight: normal; color: var(--muted); }
  .toplist .hits small { display: inline; margin-left: 4px; }
}


.form-card { background: var(--card); border: 1px solid var(--line); border-radius: 6px; padding: 8px 20px 20px; margin-bottom: 20px; }
.form-row { display: grid; grid-template-columns: 180px 1fr; gap: 6px 16px; padding: 10px 0; border-bottom: 1px solid var(--line); align-items: start; }
.form-row label, .form-row .label { font-weight: bold; padding-top: 8px; }
.form-row input[type=text], .form-row input[type=email], .form-row input[type=url], .form-row input[type=password], .form-row textarea {
  width: 100%; padding: 9px 10px; font: inherit; border: 1px solid var(--line); border-radius: 4px; background: #1f1616; color: var(--text);
}
.form-row textarea { min-height: 90px; }
.form-row .error { grid-column: 2; color: var(--accent-strong); font-size: .9rem; }
.form-row .error:empty { display: none; }
.form-row.rules { background: var(--card-2); padding: 12px; border-radius: 4px; border: 0; }
.form-row.rules input { width: auto; margin-right: 8px; }
.form-actions { padding-top: 16px; display: flex; gap: 10px; }
.btn { background: #990000; color: #fff; border: 0; border-radius: 4px; padding: 10px 22px; font: inherit; cursor: pointer; }
.btn:hover { background: var(--accent-strong); }
.btn.secondary { background: var(--card-2); color: var(--text); }
.message, .updatemessage, .updateerrormessage { color: var(--accent-strong); font-weight: bold; }
.rules-text { font-size: .95rem; }
.captcha img { display: block; margin-bottom: 6px; }
.codebox textarea { width: 100%; min-height: 100px; font-family: monospace; font-size: .85rem; }
.stats-table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.stats-table td { padding: 6px 8px; border-bottom: 1px solid var(--line); }
@media (max-width: 640px) {
  .form-row { grid-template-columns: 1fr; }
  .form-row .error { grid-column: 1; }
  .form-row label, .form-row .label { padding-top: 0; }
}

.seotext { background: var(--card); border: 1px solid var(--line); border-radius: 6px; padding: 4px 20px 12px; margin: 24px 0; }
.seotext h2 { font-size: 1.3rem; color: var(--accent); }
.seotext h3 { font-size: 1.05rem; margin-top: 1.4em; }

.ad {
  background: var(--card); border: 1px solid var(--line); border-radius: 6px;
  padding: 8px 12px 12px; margin: 20px 0; text-align: center;
}
.ad-label { display: block; font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); margin-bottom: 6px; text-align: left; }
.ad a { display: block; }
.ad img { display: block; margin: 0 auto; max-width: 100%; height: auto; border-radius: 4px; }

.site-logo { text-align: center; padding: 28px 0 8px; }
.site-logo img { display: inline-block; max-width: 100%; max-height: 160px; width: auto; height: auto; }
main > h1 { text-align: center; margin-top: 12px; }

/* Dunkler Hintergrund: Elemente direkt auf dem Hintergrund aufhellen */
main > h1 { color: #ffffff; }
.toplist th, .toplist th.rank { color: #d8c8c8; }
.site-footer { color: #b8a8a8; border-top-color: #3a2a2a; }
.site-footer a { color: #ffffff; }
.site-footer a:hover { color: #ff9900; }
main > .updatemessage, main > .message { color: #ff8080; }

.btn:hover { background: #b30000; }
.stats strong { color: #ffffff; }
.toplist td:first-child { border-left-color: #b30000; }







/* ================= Design "privat" (Smartphone & Chat: Story-Ringe, Sprechblasen, Nachtmodus) ================= */
:root {
  --accent: #ff4fa3;
  --accent-strong: #ff6fb5;
  --accent-hover: #ffb3d8;
  --violet: #9b5cff;
  --online: #3ddc84;
  --text: #ece8f4;
  --muted: #9a93ad;
  --line: #262236;
  --bg: #07060c;
  --card: #13111d;
  --card-2: #1b1828;
  --ring: conic-gradient(from 210deg, #ff4fa3, #9b5cff, #ff9a5a, #ff4fa3);
}
body {
  background:
    radial-gradient(520px 380px at 12% 8%, rgba(155,92,255,.16), transparent 70%),
    radial-gradient(560px 420px at 92% 30%, rgba(255,79,163,.12), transparent 70%),
    radial-gradient(600px 460px at 30% 100%, rgba(255,154,90,.07), transparent 70%),
    var(--bg);
  background-attachment: fixed;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* Logo wie ein Profilbild-Banner mit Story-Ring */
.site-logo {
  width: fit-content; max-width: 100%; margin: 40px auto 6px; padding: 3px; border-radius: 22px;
  background: var(--ring);
  box-shadow: 0 10px 34px rgba(255,79,163,.18);
}
.site-logo > a, .site-logo > img { display: block; }
.site-logo img { display: block; border-radius: 19px; background: var(--bg); }

/* Hauptüberschrift mit "schreibt gerade"-Blase */
main > h1 { color: #fff; font-weight: 800; font-size: 2rem; letter-spacing: -.01em; margin-top: 22px; }
main > h1::before {
  content: ""; display: block; width: 58px; height: 30px; margin: 0 auto 14px; border-radius: 16px 16px 16px 4px;
  background:
    radial-gradient(circle, #fff 0 3.5px, transparent 4.5px) 13px 50% / 9px 9px no-repeat,
    radial-gradient(circle, #fff 0 3.5px, transparent 4.5px) 24.5px 50% / 9px 9px no-repeat,
    radial-gradient(circle, #fff 0 3.5px, transparent 4.5px) 36px 50% / 9px 9px no-repeat,
    linear-gradient(135deg, #ff4fa3, #9b5cff);
  box-shadow: 0 6px 18px rgba(255,79,163,.35);
  animation: privat-typing 1.2s ease-in-out infinite;
}
@keyframes privat-typing { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }
@media (prefers-reduced-motion: reduce) { main > h1::before { animation: none; } }
main > h1::after {
  content: ""; display: block; width: 64px; height: 4px; margin: 14px auto 0; border-radius: 4px;
  background: linear-gradient(90deg, #ff4fa3, #9b5cff);
}

/* Boxen als Chat-Nachrichten */
.intro, .seotext, .form-card {
  position: relative; background: var(--card-2); border: 1px solid var(--line);
  border-radius: 22px 22px 22px 6px; padding: 14px 26px 18px; margin: 26px 0;
  box-shadow: 0 10px 26px rgba(0,0,0,.45);
}
.intro h2, .seotext h2, .form-card h2 { color: #fff; font-weight: 800; font-size: 1.3rem; }
.intro h2::before, .seotext h2::before {
  content: ""; display: inline-block; width: 24px; height: 24px; margin-right: 10px; vertical-align: -5px;
  background: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23ff4fa3%22 stroke-width=%222%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M4 5 H20 A1.5 1.5 0 0 1 21.5 6.5 V15.5 A1.5 1.5 0 0 1 20 17 H10 L5 21 V17 H4 A1.5 1.5 0 0 1 2.5 15.5 V6.5 A1.5 1.5 0 0 1 4 5Z%22/%3E%3Ccircle cx=%228%22 cy=%2211%22 r=%221.2%22 fill=%22%23ff4fa3%22 stroke=%22none%22/%3E%3Ccircle cx=%2212%22 cy=%2211%22 r=%221.2%22 fill=%22%23ff4fa3%22 stroke=%22none%22/%3E%3Ccircle cx=%2216%22 cy=%2211%22 r=%221.2%22 fill=%22%23ff4fa3%22 stroke=%22none%22/%3E%3C/svg%3E") center / contain no-repeat;
}
.seotext h3 { color: var(--accent-hover); font-size: 1.05rem; }
.intro a, .seotext a { color: var(--accent-strong); }
.ad { background: var(--card); border: 1px solid var(--line); border-radius: 18px; padding: 10px 14px 14px; margin: 24px 0; }
.ad-label { color: var(--muted); letter-spacing: .14em; }
.ad img { border-radius: 12px; }

/* Topliste wie eine Chat-Liste */
.toplist { border-spacing: 0 10px; }
.toplist th, .toplist th.rank { color: var(--muted); letter-spacing: .1em; font-size: .72rem; }
.toplist td { background: var(--card); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.toplist td:first-child { border-left: 1px solid var(--line); border-radius: 18px 0 0 18px; }
.toplist td:last-child { border-right: 1px solid var(--line); border-radius: 0 18px 18px 0; }
.toplist .rank { width: 74px; }
.badge {
  position: relative; display: inline-flex; align-items: center; justify-content: center;
  width: 48px; height: 48px; border-radius: 50%; padding: 2px;
  background: #3a3550; color: #fff; font-weight: 800; font-size: 1.05rem;
}
.badge::before {
  content: ""; position: absolute; inset: 2px; border-radius: 50%; background: #1b1828; z-index: 0;
}
.badge { isolation: isolate; }
.badge::before { z-index: -1; }
.top1 .badge, .top2 .badge, .top3 .badge { width: 52px; height: 52px; background: var(--ring); padding: 3px; }
.top1 .badge::before, .top2 .badge::before, .top3 .badge::before { inset: 3px; background: radial-gradient(circle at 35% 30%, #2c2440, #15121f); box-shadow: 0 0 0 2px var(--bg) inset; }
.top1 .badge, .top2 .badge, .top3 .badge { box-shadow: 0 4px 16px rgba(255,79,163,.35); }
.top1 .badge::after {
  content: ""; position: absolute; right: -4px; bottom: -2px; width: 20px; height: 18px; z-index: 1;
  background: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 22%22%3E%3Cpath d=%22M12 21 C5 15.5 1 12 1 7 C1 3.5 3.6 1 6.7 1 C9 1 10.9 2.4 12 4.3 C13.1 2.4 15 1 17.3 1 C20.4 1 23 3.5 23 7 C23 12 19 15.5 12 21Z%22 fill=%22%23ff4fa3%22/%3E%3C/svg%3E") center / contain no-repeat; filter: drop-shadow(0 1px 2px rgba(0,0,0,.6));
}
.toplist tr.top1 td, .toplist tr.top2 td, .toplist tr.top3 td { background: linear-gradient(180deg, #1a1626, #14111e); border-color: rgba(255,79,163,.35); }
.toplist tr.entry:hover td { background: var(--card-2); }
.sitetitle { color: #fff; font-weight: 800; font-size: 1.08rem; text-decoration: none; }
.sitetitle:hover, .sitetitle:focus { color: var(--accent-hover); }
.new {
  display: inline-flex; align-items: center; gap: 5px; margin-left: 8px; padding: 2px 9px 2px 7px; border-radius: 999px;
  background: rgba(61,220,132,.12); border: 1px solid rgba(61,220,132,.45); color: var(--online);
  font-size: .64rem; letter-spacing: .08em;
}
.new::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--online); box-shadow: 0 0 6px var(--online); }
.description { color: #cfc9dc; }
.toplist .hits { color: #fff; white-space: nowrap; }
.toplist .hit-now {
  display: inline-block; min-width: 2.2em; padding: 3px 9px; border-radius: 999px;
  background: linear-gradient(135deg, #ff4fa3, #c03fd8); color: #fff;
  font-size: .98rem; font-weight: 800; line-height: 1.25; box-shadow: 0 3px 10px rgba(255,79,163,.3);
}
.toplist .hits small.hit-total { display: block; margin-top: 5px; font-size: .74rem; color: var(--muted); }

/* Seitennavigation */
.pagination a, .pagination strong { border-radius: 999px; background: var(--card); border: 1px solid var(--line); color: var(--text); }
.pagination a:hover { border-color: var(--accent); color: #fff; }
.pagination strong { background: linear-gradient(135deg, #ff4fa3, #9b5cff); border-color: transparent; color: #fff; }

/* Formulare & Buttons */
.btn { background: linear-gradient(135deg, #ff4fa3, #9b5cff); color: #fff; border-radius: 999px; font-weight: 800; }
.btn:hover { background: linear-gradient(135deg, #ff6fb5, #ad78ff); }
.btn.secondary { background: transparent; border: 1px solid #3a3550; color: var(--text); }
.form-row { border-bottom-color: var(--line); }
.form-row input[type=text], .form-row input[type=email], .form-row input[type=url], .form-row input[type=password], .form-row textarea {
  background: #0d0b14; border: 1px solid #2e2a40; border-radius: 14px;
}
.form-row input:focus, .form-row textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(255,79,163,.2); }
.form-row.rules { background: var(--card); border-radius: 14px; }
.form-row .error, .message, .updatemessage, .updateerrormessage, main > .updatemessage, main > .message { color: #ff7ab8; }

/* Statistik & Footer */
.stats li { border-radius: 999px; background: var(--card); border: 1px solid var(--line); color: var(--muted); }
.stats strong { color: var(--accent-strong); }
.site-footer { border-top: 1px solid var(--line); color: var(--muted); }
.site-footer a { color: var(--accent-hover); }
.site-footer a:hover { color: #fff; }

@media (max-width: 640px) {
  .site-logo { margin-top: 28px; }
  main > h1 { font-size: 1.5rem; }
  .intro, .seotext, .form-card { padding: 12px 20px 16px; }
  .toplist tr.entry { grid-template-columns: 66px 1fr 1fr; border-radius: 18px; border: 1px solid var(--line); background: var(--card); }
  .toplist tr.top1, .toplist tr.top2, .toplist tr.top3 { background: linear-gradient(180deg, #1a1626, #14111e); border-color: rgba(255,79,163,.35); }
  .toplist tr.entry td, .toplist tr.entry:hover td { background: transparent; }
  .toplist .rank { width: auto; }
  .badge { width: 42px; height: 42px; font-size: .95rem; }
  .top1 .badge, .top2 .badge, .top3 .badge { width: 46px; height: 46px; }
  .toplist .site { padding-left: 4px; }
  .toplist .hit-now { padding: 1px 8px; font-size: .92rem; }
  .toplist .hits small.hit-total { display: inline; margin: 0 0 0 4px; }
}

/* Verruchte Details: Kussmünder, Flammen, Teufelshörner, 18+ */
body {
  background:
    url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22150%22 height=%22150%22 viewBox=%220 0 150 150%22%3E%3Cg fill=%22%23ff4fa3%22 opacity=%22.05%22%3E%3Cpath transform=%22translate(14 18) scale(.34) rotate(-12 50 30)%22 d=%22M4 30 C18 10 36 6 50 18 C64 6 82 10 96 30 C80 33 64 35 50 33 C36 35 20 33 4 30 Z M4 31 C24 35 76 35 96 31 C84 50 64 58 50 58 C36 58 16 50 4 31 Z%22/%3E%3Cpath transform=%22translate(92 92) scale(.3) rotate(14 50 30)%22 d=%22M4 30 C18 10 36 6 50 18 C64 6 82 10 96 30 C80 33 64 35 50 33 C36 35 20 33 4 30 Z M4 31 C24 35 76 35 96 31 C84 50 64 58 50 58 C36 58 16 50 4 31 Z%22/%3E%3Cpath transform=%22translate(104 22) scale(.7)%22 d=%22M12 21 C5 15.5 1 12 1 7 C1 3.5 3.6 1 6.7 1 C9 1 10.9 2.4 12 4.3 C13.1 2.4 15 1 17.3 1 C20.4 1 23 3.5 23 7 C23 12 19 15.5 12 21Z%22/%3E%3Cpath transform=%22translate(30 100) scale(.55)%22 d=%22M12 21 C5 15.5 1 12 1 7 C1 3.5 3.6 1 6.7 1 C9 1 10.9 2.4 12 4.3 C13.1 2.4 15 1 17.3 1 C20.4 1 23 3.5 23 7 C23 12 19 15.5 12 21Z%22/%3E%3C/g%3E%3C/svg%3E") 0 0 / 150px 150px,
    radial-gradient(520px 380px at 12% 8%, rgba(155,92,255,.16), transparent 70%),
    radial-gradient(560px 420px at 92% 30%, rgba(255,79,163,.12), transparent 70%),
    radial-gradient(600px 460px at 30% 100%, rgba(255,154,90,.07), transparent 70%),
    var(--bg);
  background-attachment: fixed;
}
.site-logo { position: relative; }
.site-logo::after {
  content: "18+"; position: absolute; right: -12px; bottom: -10px; z-index: 2;
  padding: 3px 8px; border-radius: 999px; background: #e0174f; color: #fff; border: 2px solid var(--bg);
  font: 800 .72rem/1 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; letter-spacing: .04em;
  box-shadow: 0 4px 12px rgba(224,23,79,.45); transform: rotate(8deg);
}
main > h1::after {
  width: 62px; height: 36px; margin-top: 12px; border-radius: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 120 70%22%3E %3Cdefs%3E %3ClinearGradient id=%22u%22 x1=%220%22 y1=%220%22 x2=%220%22 y2=%221%22%3E%3Cstop offset=%220%22 stop-color=%22%236a0a21%22/%3E%3Cstop offset=%22.35%22 stop-color=%22%239c1131%22/%3E%3Cstop offset=%22.8%22 stop-color=%22%23c8183f%22/%3E%3Cstop offset=%221%22 stop-color=%22%23b3143a%22/%3E%3C/linearGradient%3E %3CradialGradient id=%22l%22 cx=%22.5%22 cy=%22.3%22 r=%22.8%22%3E%3Cstop offset=%220%22 stop-color=%22%23d92a50%22/%3E%3Cstop offset=%22.5%22 stop-color=%22%23b5153b%22/%3E%3Cstop offset=%221%22 stop-color=%22%236e0a22%22/%3E%3C/radialGradient%3E %3CradialGradient id=%22h%22 cx=%22.5%22 cy=%22.5%22 r=%22.5%22%3E%3Cstop offset=%220%22 stop-color=%22%23ffd9e2%22 stop-opacity=%22.55%22/%3E%3Cstop offset=%221%22 stop-color=%22%23ffd9e2%22 stop-opacity=%220%22/%3E%3C/radialGradient%3E %3Cfilter id=%22s%22 x=%22-5%25%22 y=%22-5%25%22 width=%22110%25%22 height=%22110%25%22%3E%3CfeGaussianBlur stdDeviation=%22.45%22/%3E%3C/filter%3E %3Cfilter id=%22b%22 x=%22-50%25%22 y=%22-50%25%22 width=%22200%25%22 height=%22200%25%22%3E%3CfeGaussianBlur stdDeviation=%222.2%22/%3E%3C/filter%3E %3C/defs%3E %3Cg filter=%22url(%23s)%22%3E %3Cpath d=%22M3 37 C10 34 18 27 28 21 C36 16.5 42 13.5 48 13.5 C53 13.5 56.5 17 60 20.5 C63.5 17 67 13.5 72 13.5 C78 13.5 84 16.5 92 21 C102 27 110 34 117 37 C104 37.5 90 36.2 78 35.4 C70 34.9 65 36.4 60 36.8 C55 36.4 50 34.9 42 35.4 C30 36.2 16 37.5 3 37Z%22 fill=%22url(%23u)%22/%3E %3Cpath d=%22M3 37 C18 40 32 40.6 44 40 C51 39.7 56 40.6 60 40.6 C64 40.6 69 39.7 76 40 C88 40.6 102 40 117 37 C110 50 95 64 60 65.5 C25 64 10 50 3 37Z%22 fill=%22url(%23l)%22/%3E %3Cpath d=%22M28 43 C30 49 33 55 37 59 M36 42 C37 49 39 56 42 61.5 M44 42 C44.5 49 46 57 47.5 63.5 M52 42 C52 50 52.8 57 53.5 64.5 M60 42 C60 50 60 57 60 65 M68 42 C68 50 67.2 57 66.5 64.5 M76 42 C75.5 49 74 57 72.5 63.5 M84 42 C83 49 81 56 78 61.5 M92 43 C90 49 87 55 83 59%22 fill=%22none%22 stroke=%22%234a0414%22 stroke-opacity=%22.14%22 stroke-width=%22.9%22 stroke-linecap=%22round%22/%3E %3Cpath d=%22M24 32 C26 28 28 25 31 22 M33 33 C34 28 36 22 38 18 M42 34 C42 29 43 22 45 16 M51 34 C51 29 52 23 54 18 M69 34 C69 29 68 23 66 18 M78 34 C78 29 77 22 75 16 M87 33 C86 28 84 22 82 18 M96 32 C94 28 92 25 89 22%22 fill=%22none%22 stroke=%22%234a0414%22 stroke-opacity=%22.14%22 stroke-width=%22.8%22 stroke-linecap=%22round%22/%3E %3Cpath d=%22M6 37.4 C20 39.6 38 38.6 50 38.8 C55 38.9 57.5 39.6 60 39.6 C62.5 39.6 65 38.9 70 38.8 C82 38.6 100 39.6 114 37.4%22 fill=%22none%22 stroke=%22%232e030c%22 stroke-width=%221.8%22 stroke-linecap=%22round%22/%3E %3Cpath d=%22M44 45 C52 47 68 47 76 45%22 fill=%22none%22 stroke=%22%23ff9db5%22 stroke-opacity=%22.18%22 stroke-width=%223%22 stroke-linecap=%22round%22/%3E %3C/g%3E %3Cellipse cx=%2252%22 cy=%2250%22 rx=%2211%22 ry=%222.6%22 fill=%22url(%23h)%22 filter=%22url(%23b)%22 transform=%22rotate(-5 52 50)%22/%3E %3Cellipse cx=%2271%22 cy=%2251%22 rx=%226%22 ry=%221.8%22 fill=%22url(%23h)%22 filter=%22url(%23b)%22 opacity=%22.6%22 transform=%22rotate(6 71 51)%22/%3E %3Cellipse cx=%2247%22 cy=%2222%22 rx=%225%22 ry=%221.4%22 fill=%22url(%23h)%22 filter=%22url(%23b)%22 opacity=%22.5%22 transform=%22rotate(-16 47 22)%22/%3E %3C/svg%3E") center / contain no-repeat;
  filter: drop-shadow(0 3px 8px rgba(0,0,0,.5));
}
.intro::after, .seotext::after {
  content: ""; position: absolute; width: 74px; height: 44px; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 120 70%22%3E %3Cdefs%3E %3Cfilter id=%22k%22 x=%22-10%25%22 y=%22-10%25%22 width=%22120%25%22 height=%22120%25%22%3E %3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%22.75 .07%22 numOctaves=%223%22 seed=%224%22 result=%22t%22/%3E %3CfeColorMatrix in=%22t%22 type=%22matrix%22 values=%220 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 -4.2 2.95%22 result=%22m%22/%3E %3CfeComposite in=%22SourceGraphic%22 in2=%22m%22 operator=%22in%22 result=%22c%22/%3E %3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%22.18%22 numOctaves=%222%22 seed=%229%22 result=%22d%22/%3E %3CfeDisplacementMap in=%22c%22 in2=%22d%22 scale=%222.4%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22/%3E %3C/filter%3E %3Cmask id=%22m%22%3E%3Crect width=%22120%22 height=%2270%22 fill=%22%23fff%22/%3E %3Cpath d=%22M28 43 C30 49 33 55 37 59 M36 42 C37 49 39 56 42 61.5 M44 42 C44.5 49 46 57 47.5 63.5 M52 42 C52 50 52.8 57 53.5 64.5 M60 42 C60 50 60 57 60 65 M68 42 C68 50 67.2 57 66.5 64.5 M76 42 C75.5 49 74 57 72.5 63.5 M84 42 C83 49 81 56 78 61.5 M92 43 C90 49 87 55 83 59%22 fill=%22none%22 stroke=%22%23000%22 stroke-opacity=%22.55%22 stroke-width=%22.5%22 stroke-linecap=%22round%22/%3E %3Cpath d=%22M24 32 C26 28 28 25 31 22 M33 33 C34 28 36 22 38 18 M42 34 C42 29 43 22 45 16 M51 34 C51 29 52 23 54 18 M69 34 C69 29 68 23 66 18 M78 34 C78 29 77 22 75 16 M87 33 C86 28 84 22 82 18 M96 32 C94 28 92 25 89 22%22 fill=%22none%22 stroke=%22%23000%22 stroke-opacity=%22.55%22 stroke-width=%22.45%22 stroke-linecap=%22round%22/%3E %3Cpath d=%22M34 50 C44 52.5 76 52.5 86 50%22 fill=%22none%22 stroke=%22%23000%22 stroke-opacity=%22.35%22 stroke-width=%222.4%22 stroke-linecap=%22round%22/%3E %3C/mask%3E %3CradialGradient id=%22kc%22 cx=%22.5%22 cy=%22.5%22 r=%22.6%22%3E%3Cstop offset=%220%22 stop-color=%22%23d5164a%22/%3E%3Cstop offset=%221%22 stop-color=%22%23a80f37%22/%3E%3C/radialGradient%3E %3C/defs%3E %3Cg filter=%22url(%23k)%22 fill=%22url(%23kc)%22 mask=%22url(%23m)%22 opacity=%22.92%22%3E %3Cpath d=%22M3 37 C10 34 18 27 28 21 C36 16.5 42 13.5 48 13.5 C53 13.5 56.5 17 60 20.5 C63.5 17 67 13.5 72 13.5 C78 13.5 84 16.5 92 21 C102 27 110 34 117 37 C104 37.5 90 36.2 78 35.4 C70 34.9 65 36.4 60 36.8 C55 36.4 50 34.9 42 35.4 C30 36.2 16 37.5 3 37Z%22 transform=%22translate(0 -.5)%22/%3E %3Cpath d=%22M3 37 C18 40 32 40.6 44 40 C51 39.7 56 40.6 60 40.6 C64 40.6 69 39.7 76 40 C88 40.6 102 40 117 37 C110 50 95 64 60 65.5 C25 64 10 50 3 37Z%22 transform=%22translate(0 .9)%22/%3E %3C/g%3E %3C/svg%3E") center / contain no-repeat;
}
.intro::after { top: -16px; right: 18px; transform: rotate(16deg); }
.seotext::after { bottom: -14px; right: 26px; transform: rotate(-12deg); width: 62px; height: 37px; opacity: .9; }
.seotext h2::before { background-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 30%22%3E%3Cdefs%3E%3ClinearGradient id=%22f%22 x1=%220%22 y1=%221%22 x2=%220%22 y2=%220%22%3E%3Cstop offset=%220%22 stop-color=%22%23ff2d55%22/%3E%3Cstop offset=%22.55%22 stop-color=%22%23ff7a2f%22/%3E%3Cstop offset=%221%22 stop-color=%22%23ffd25a%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d=%22M12 29 C5 29 1.5 24.5 1.5 19 C1.5 13 6 10 7 4 C10 7 10.5 10 10 13 C12.5 11 14 7.5 13.5 1 C19 5 22.5 11.5 22.5 18.5 C22.5 24.5 18.5 29 12 29Z%22 fill=%22url(%23f)%22/%3E%3Cpath d=%22M12 28 C9 28 7 26 7 23 C7 20 9.5 18.5 10 15.5 C12 17 12.5 19 12 21 C13.5 20 14.5 18.5 14.5 16.5 C16.5 18.5 17 21 17 23 C17 26 15 28 12 28Z%22 fill=%22%23ffe08a%22 opacity=%22.85%22/%3E%3C/svg%3E"); width: 20px; height: 25px; vertical-align: -4px; }
.top1 .badge::after {
  right: auto; bottom: auto; left: 50%; top: -11px; width: 44px; height: 14px; margin-left: -22px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 60 18%22%3E%3Cdefs%3E%3ClinearGradient id=%22h%22 x1=%220%22 y1=%221%22 x2=%220%22 y2=%220%22%3E%3Cstop offset=%220%22 stop-color=%22%23b0123f%22/%3E%3Cstop offset=%221%22 stop-color=%22%23ff4f7b%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d=%22M8 18 C6 10 3 6 1 1 C8 4 14 9 17 16 Z%22 fill=%22url(%23h)%22/%3E%3Cpath d=%22M52 18 C54 10 57 6 59 1 C52 4 46 9 43 16 Z%22 fill=%22url(%23h)%22/%3E%3C/svg%3E"); transform: none; z-index: -2;
}
.top2 .badge::after, .top3 .badge::after {
  content: ""; position: absolute; right: -6px; bottom: -4px; width: 17px; height: 21px; z-index: 1;
  background: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 30%22%3E%3Cdefs%3E%3ClinearGradient id=%22f%22 x1=%220%22 y1=%221%22 x2=%220%22 y2=%220%22%3E%3Cstop offset=%220%22 stop-color=%22%23ff2d55%22/%3E%3Cstop offset=%22.55%22 stop-color=%22%23ff7a2f%22/%3E%3Cstop offset=%221%22 stop-color=%22%23ffd25a%22/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d=%22M12 29 C5 29 1.5 24.5 1.5 19 C1.5 13 6 10 7 4 C10 7 10.5 10 10 13 C12.5 11 14 7.5 13.5 1 C19 5 22.5 11.5 22.5 18.5 C22.5 24.5 18.5 29 12 29Z%22 fill=%22url(%23f)%22/%3E%3Cpath d=%22M12 28 C9 28 7 26 7 23 C7 20 9.5 18.5 10 15.5 C12 17 12.5 19 12 21 C13.5 20 14.5 18.5 14.5 16.5 C16.5 18.5 17 21 17 23 C17 26 15 28 12 28Z%22 fill=%22%23ffe08a%22 opacity=%22.85%22/%3E%3C/svg%3E") center / contain no-repeat; filter: drop-shadow(0 1px 3px rgba(0,0,0,.7));
}
.top1 .badge { background: conic-gradient(from 200deg, #ff2d55, #b0123f, #ff4fa3, #ff2d55); }
.toplist tr.top1 .sitetitle::after {
  content: ""; display: inline-block; width: 26px; height: 16px; margin-left: 8px; vertical-align: -1px;
  background: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 120 70%22%3E %3Cdefs%3E %3Cfilter id=%22k%22 x=%22-10%25%22 y=%22-10%25%22 width=%22120%25%22 height=%22120%25%22%3E %3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%22.75 .07%22 numOctaves=%223%22 seed=%224%22 result=%22t%22/%3E %3CfeColorMatrix in=%22t%22 type=%22matrix%22 values=%220 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 -4.2 2.95%22 result=%22m%22/%3E %3CfeComposite in=%22SourceGraphic%22 in2=%22m%22 operator=%22in%22 result=%22c%22/%3E %3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%22.18%22 numOctaves=%222%22 seed=%229%22 result=%22d%22/%3E %3CfeDisplacementMap in=%22c%22 in2=%22d%22 scale=%222.4%22 xChannelSelector=%22R%22 yChannelSelector=%22G%22/%3E %3C/filter%3E %3Cmask id=%22m%22%3E%3Crect width=%22120%22 height=%2270%22 fill=%22%23fff%22/%3E %3Cpath d=%22M28 43 C30 49 33 55 37 59 M36 42 C37 49 39 56 42 61.5 M44 42 C44.5 49 46 57 47.5 63.5 M52 42 C52 50 52.8 57 53.5 64.5 M60 42 C60 50 60 57 60 65 M68 42 C68 50 67.2 57 66.5 64.5 M76 42 C75.5 49 74 57 72.5 63.5 M84 42 C83 49 81 56 78 61.5 M92 43 C90 49 87 55 83 59%22 fill=%22none%22 stroke=%22%23000%22 stroke-opacity=%22.55%22 stroke-width=%22.5%22 stroke-linecap=%22round%22/%3E %3Cpath d=%22M24 32 C26 28 28 25 31 22 M33 33 C34 28 36 22 38 18 M42 34 C42 29 43 22 45 16 M51 34 C51 29 52 23 54 18 M69 34 C69 29 68 23 66 18 M78 34 C78 29 77 22 75 16 M87 33 C86 28 84 22 82 18 M96 32 C94 28 92 25 89 22%22 fill=%22none%22 stroke=%22%23000%22 stroke-opacity=%22.55%22 stroke-width=%22.45%22 stroke-linecap=%22round%22/%3E %3Cpath d=%22M34 50 C44 52.5 76 52.5 86 50%22 fill=%22none%22 stroke=%22%23000%22 stroke-opacity=%22.35%22 stroke-width=%222.4%22 stroke-linecap=%22round%22/%3E %3C/mask%3E %3CradialGradient id=%22kc%22 cx=%22.5%22 cy=%22.5%22 r=%22.6%22%3E%3Cstop offset=%220%22 stop-color=%22%23d5164a%22/%3E%3Cstop offset=%221%22 stop-color=%22%23a80f37%22/%3E%3C/radialGradient%3E %3C/defs%3E %3Cg filter=%22url(%23k)%22 fill=%22url(%23kc)%22 mask=%22url(%23m)%22 opacity=%22.92%22%3E %3Cpath d=%22M3 37 C10 34 18 27 28 21 C36 16.5 42 13.5 48 13.5 C53 13.5 56.5 17 60 20.5 C63.5 17 67 13.5 72 13.5 C78 13.5 84 16.5 92 21 C102 27 110 34 117 37 C104 37.5 90 36.2 78 35.4 C70 34.9 65 36.4 60 36.8 C55 36.4 50 34.9 42 35.4 C30 36.2 16 37.5 3 37Z%22 transform=%22translate(0 -.5)%22/%3E %3Cpath d=%22M3 37 C18 40 32 40.6 44 40 C51 39.7 56 40.6 60 40.6 C64 40.6 69 39.7 76 40 C88 40.6 102 40 117 37 C110 50 95 64 60 65.5 C25 64 10 50 3 37Z%22 transform=%22translate(0 .9)%22/%3E %3C/g%3E %3C/svg%3E") center / contain no-repeat; transform: rotate(-10deg);
}
.pagination strong { box-shadow: 0 0 14px rgba(255,79,163,.45); }
.ad-label::before { content: "♥ "; color: var(--accent); }
@media (max-width: 640px) {
  .intro::after { width: 58px; height: 35px; top: -14px; right: 12px; }
  .seotext::after { width: 50px; height: 30px; }
  .site-logo::after { right: -6px; }
  .toplist tr.top1 td.rank { padding-top: 20px; }
}

/* Fehlerseite 404 */
.notfound .intro { text-align: center; }
.notfound .actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin: 20px 0 8px; }
.notfound .btn { display: inline-block; text-decoration: none; }
.notfound .actions a.btn, .notfound .actions a.btn:hover { color: #fff; }
.notfound .actions a.btn.secondary { color: var(--text); }