:root{
  --bg:#040a0f;
  --panel:#07131d;
  --panel2:#0b1d29;
  --lime:#bfff00;
  --lime2:#d7ff37;
  --teal:#00b8ad;
  --cyan:#16f1ff;
  --white:#fff;
  --muted:#c7d0d8;
  --line:rgba(255,255,255,.18);
  --shadow:0 22px 80px rgba(0,0,0,.48);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Arial, Helvetica, sans-serif;background:#050b10;color:var(--white);overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 8% 18%, rgba(0,184,173,.22), transparent 22%),radial-gradient(circle at 92% 15%, rgba(191,255,0,.12), transparent 24%),radial-gradient(circle at 60% 92%, rgba(0,184,173,.18), transparent 30%),linear-gradient(135deg,#03070b,#07131d 48%,#020609);z-index:-3}
body:after{content:"";position:fixed;inset:0;pointer-events:none;opacity:.14;background-image:radial-gradient(rgba(255,255,255,.6) 1px, transparent 1px);background-size:18px 18px;mask-image:linear-gradient(to bottom, black, transparent 75%);z-index:-2}
a{color:inherit}
.topbar{height:92px;display:flex;align-items:center;justify-content:space-between;padding:0 54px;background:rgba(2,8,13,.92);border-bottom:1px solid rgba(255,255,255,.08);position:sticky;top:0;z-index:50;backdrop-filter:blur(16px)}
.logo{display:flex;gap:14px;align-items:center;text-decoration:none;font-weight:1000;letter-spacing:-.04em;font-size:30px;line-height:.8;transform:rotate(-2deg)}
.logo span{display:block;color:var(--lime)}
.logo-icon{width:46px;height:46px;border:3px solid white;border-radius:50%;position:relative}
.logo-icon:after{content:"";position:absolute;width:26px;height:7px;border-radius:999px;background:white;right:-17px;bottom:2px;transform:rotate(35deg)}
.nav{display:flex;gap:34px;align-items:center;font-weight:900;text-transform:uppercase;font-size:15px}
.nav a{text-decoration:none;color:white;opacity:.94;position:relative}
.nav a.active:after,.nav a:hover:after{content:"";position:absolute;left:0;right:0;bottom:-12px;height:4px;background:var(--lime);border-radius:999px}
.brush-btn{border:0;text-decoration:none;color:#061018;background:var(--lime);padding:16px 30px;font-weight:1000;text-transform:uppercase;display:inline-flex;align-items:center;gap:10px;clip-path:polygon(3% 6%, 100% 0, 96% 100%, 0 92%);box-shadow:0 14px 38px rgba(191,255,0,.22);cursor:pointer;font-size:17px}
.brush-btn.dark{background:rgba(255,255,255,.05);color:white;border:1px solid rgba(255,255,255,.3);clip-path:none;border-radius:8px}
.hero{position:relative;min-height:630px;overflow:hidden;background:linear-gradient(90deg, rgba(2,7,12,.98) 0%, rgba(2,7,12,.82) 34%, rgba(2,7,12,.42) 68%, rgba(2,7,12,.65) 100%),url('hero.jpg');background-size:cover;background-position:center}
.hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 72% 38%, rgba(191,255,0,.2), transparent 20%),linear-gradient(to bottom, transparent 0%, rgba(5,11,16,.92) 100%)}
.hero-inner{position:relative;z-index:2;max-width:1250px;margin:auto;padding:58px 34px 42px}
.crown{font-size:58px;color:var(--lime);transform:rotate(-14deg);display:inline-block;margin-left:10px}
.hero h1{margin:0;font-size:clamp(76px,10vw,142px);line-height:.78;text-transform:uppercase;letter-spacing:-.075em;font-weight:1000;text-shadow:0 7px 0 rgba(0,0,0,.35);transform:rotate(-2deg)}
.hero h1 span{color:var(--lime);display:block}
.subbrush{display:inline-block;margin-top:22px;padding:10px 26px;background:var(--teal);color:white;font-size:28px;font-weight:1000;text-transform:uppercase;transform:rotate(-2deg);clip-path:polygon(0 15%,100% 0,96% 100%,3% 85%)}
.tagline{font-size:26px;margin:22px 0 30px;font-weight:800;font-style:italic;text-shadow:0 3px 0 rgba(0,0,0,.35)}
.hero-actions{display:flex;gap:18px;flex-wrap:wrap}
.location-card{position:absolute;right:58px;bottom:36px;z-index:3;background:rgba(5,12,18,.78);border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(12px);border-radius:18px;padding:22px 28px;width:360px;box-shadow:var(--shadow);display:flex;gap:18px;align-items:center}
.pin{width:54px;height:54px;border-radius:50% 50% 50% 0;background:var(--lime);transform:rotate(-45deg);flex:0 0 auto;position:relative}
.pin:after{content:"";position:absolute;width:18px;height:18px;border-radius:50%;background:#061018;left:18px;top:18px}
.location-card strong{display:block;font-size:23px;text-transform:uppercase;font-style:italic}
.location-card a{color:var(--cyan);text-decoration:none;font-weight:1000;text-transform:uppercase}
.ball{position:absolute;width:74px;height:74px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#d5d5d5 68%,#aaa);right:34%;top:88px;z-index:4;box-shadow:0 0 38px rgba(255,255,255,.35)}
.ball:before{content:"";position:absolute;left:-170px;top:22px;width:160px;height:4px;background:white;box-shadow:0 20px 0 white,0 -20px 0 white;opacity:.8;transform:rotate(-24deg)}
.main{max-width:1250px;margin:-28px auto 0;padding:0 24px 42px;position:relative;z-index:5}
.grid-top{display:grid;grid-template-columns:1.25fr .95fr;gap:30px}
.panel{background:rgba(5,14,21,.86);border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);overflow:hidden}
.features{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.feature{text-align:center;padding:30px 18px;border-right:1px solid rgba(255,255,255,.16)}
.feature:last-child{border-right:0}
.feature .ico{width:70px;height:70px;border-radius:24px;display:grid;place-items:center;margin:0 auto 14px;font-size:38px;background:rgba(0,184,173,.18);color:var(--lime)}
.feature h3{margin:0 0 8px;font-size:18px;text-transform:uppercase;font-style:italic}
.feature p{margin:0;color:white;line-height:1.35}
.live-panel{padding:28px 30px;background:linear-gradient(145deg,rgba(5,14,21,.92),rgba(5,14,21,.76)),radial-gradient(circle at top right,rgba(0,184,173,.25),transparent 30%)}
.title-row{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:18px}
.title-row h2{margin:0;font-size:28px;font-style:italic;text-transform:uppercase}
.title-row h2 span{color:var(--lime)}
.count-badge{width:78px;height:78px;border-radius:50%;background:linear-gradient(145deg,var(--teal),#0b6d68);display:grid;place-items:center;font-weight:1000;text-align:center;line-height:1;box-shadow:0 0 30px rgba(0,184,173,.28)}
.count-badge b{font-size:30px}
.players{display:grid;grid-template-columns:1fr 1fr;gap:10px 22px}
.player{display:flex;align-items:center;gap:10px;font-size:18px}
.dot{width:12px;height:12px;border-radius:50%;background:var(--lime);box-shadow:0 0 15px rgba(191,255,0,.7)}
.live-cta{margin-top:24px;color:white;font-weight:1000;text-transform:uppercase;font-style:italic}
.live-cta span{color:var(--cyan)}
.stats{margin-top:18px;display:grid;grid-template-columns:repeat(3,1fr);background:linear-gradient(90deg,#00746e,#06323a);border-radius:20px;overflow:hidden;border:1px solid rgba(255,255,255,.16)}
.stat{padding:22px 26px;display:flex;align-items:center;gap:16px;border-right:1px solid rgba(255,255,255,.16)}
.stat:last-child{border-right:0}
.stat .num{font-size:38px;color:white;font-weight:1000;line-height:1}
.stat .label{font-weight:1000;font-style:italic;text-transform:uppercase;line-height:1.05}
.grid-mid{margin-top:22px;display:grid;grid-template-columns:1.05fr 1.15fr;gap:30px}
.next,.calendar-box{padding:28px}
.next h2,.how h2,.community h2,.calendar-box h2{margin:0 0 18px;font-size:30px;text-transform:uppercase;font-style:italic}
.time{font-size:76px;color:var(--lime);font-weight:1000;line-height:.9}
.eventdate{font-size:24px;color:var(--cyan);font-weight:1000;margin:8px 0 16px}
.how{padding:28px 32px}
.step{display:grid;grid-template-columns:44px 1fr;gap:16px;margin:18px 0}
.step-no{width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.3);display:grid;place-items:center;color:var(--lime);font-weight:1000}
.step strong{color:var(--lime);text-transform:uppercase}
.calendar{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}
.cal-head,.cal-day{min-height:52px;border-radius:13px;padding:8px;text-align:center;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08)}
.cal-head{min-height:auto;color:var(--lime);font-weight:1000;text-transform:uppercase;font-size:12px}
.cal-day.empty{opacity:.18}
.cal-day.has-event{background:rgba(191,255,0,.12);border-color:rgba(191,255,0,.45)}
.cal-day a{text-decoration:none;display:block}
.cal-num{font-weight:1000;font-size:18px}
.cal-time{font-size:12px;color:var(--lime);margin-top:4px}
.cal-count{font-size:12px;color:var(--cyan);margin-top:3px}
.community{margin-top:22px;padding:26px}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.mini-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:16px;overflow:hidden}
.mini-img{height:118px;background:url('hero.jpg') center/cover}
.mini-card:nth-child(2) .mini-img{filter:hue-rotate(20deg) saturate(1.2)}
.mini-card:nth-child(3) .mini-img{filter:sepia(.4) saturate(1.4)}
.mini-card:nth-child(4) .mini-img{background:linear-gradient(145deg,#0b1d29,#050b10)}
.mini-card p{margin:0;padding:12px 14px 16px;color:white;line-height:1.35}
.bottom{margin-top:26px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:22px;align-items:center}
.claim{font-size:34px;font-weight:1000;text-transform:uppercase;font-style:italic}
.claim span{color:var(--lime);display:block}
.checks{color:white;line-height:1.9}
.checks b{color:var(--lime)}
.footer{padding:26px 54px;background:rgba(2,8,13,.92);border-top:1px solid rgba(255,255,255,.12);display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap}
.form-page{min-height:calc(100vh - 92px);display:grid;place-items:center;padding:34px}
.form-card{width:min(660px,100%);padding:36px}
.form-card h1{margin:0 0 12px;font-size:54px;line-height:.9;text-transform:uppercase}
.form-card h1 span{color:var(--lime)}
input,select{width:100%;margin:9px 0 16px;padding:17px 18px;border-radius:14px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.07);color:white;font-size:18px;outline:none}
select option{background:#07131d;color:white}
input:focus,select:focus{border-color:var(--lime);box-shadow:0 0 0 4px rgba(191,255,0,.12)}
label{color:var(--lime);font-weight:1000;text-transform:uppercase;font-size:14px}
.msg,.err{padding:16px 18px;border-radius:16px;margin:18px 0;font-weight:800;line-height:1.5}
.msg{background:rgba(191,255,0,.13);border:1px solid rgba(191,255,0,.34)}
.err{background:rgba(255,70,70,.13);border:1px solid rgba(255,70,70,.34);color:#ffd2d2}
.form-note{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);padding:15px;border-radius:16px;margin:14px 0;color:var(--muted);line-height:1.5}
@media(max-width:980px){
  .topbar{height:auto;padding:18px 22px;align-items:flex-start}.nav{display:none}.hero{min-height:620px}.hero-inner{padding-top:36px}.hero h1{font-size:74px}.location-card{position:relative;right:auto;bottom:auto;margin:20px 24px 0;width:auto}.ball{display:none}.grid-top,.grid-mid,.bottom{grid-template-columns:1fr}.features,.cards{grid-template-columns:1fr 1fr}.stats{grid-template-columns:1fr}.stat{border-right:0;border-bottom:1px solid rgba(255,255,255,.16)}.players{grid-template-columns:1fr}.calendar{gap:5px}.cal-day{min-height:48px;padding:6px}
}
@media(max-width:560px){
  .topbar .brush-btn{display:none}.logo{font-size:24px}.hero h1{font-size:58px}.subbrush{font-size:18px}.tagline{font-size:20px}.features,.cards{grid-template-columns:1fr}.main{padding:0 14px 34px}.footer{padding:22px}.calendar{font-size:12px}
}


.cal-nav{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:14px 0 18px}
.cal-nav a{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;text-decoration:none;border:1px solid rgba(255,255,255,.20);background:rgba(255,255,255,.05);font-weight:1000}
.cal-nav a.disabled{opacity:.25;pointer-events:none}
.cal-month-title{text-align:center;font-weight:1000;text-transform:uppercase;font-size:20px}
.cal-day.blocked{background:rgba(255,80,80,.13);border-color:rgba(255,80,80,.45);opacity:.75}
.cal-day.blocked .cal-time{color:#ffb0b0}
.block-note{font-size:11px;color:#ffb0b0;margin-top:3px}
.admin-table{width:100%;border-collapse:collapse;margin-top:18px}
.admin-table th,.admin-table td{padding:12px;border-bottom:1px solid rgba(255,255,255,.12);text-align:left;vertical-align:top}
.admin-table th{color:var(--lime);text-transform:uppercase;font-size:13px}
.admin-actions{display:flex;gap:8px;flex-wrap:wrap}
.small-btn{border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.07);color:white;border-radius:12px;padding:9px 12px;text-decoration:none;font-weight:900;cursor:pointer}
.small-btn.warn{background:rgba(255,80,80,.15);border-color:rgba(255,80,80,.4)}
.small-btn.ok{background:rgba(191,255,0,.13);border-color:rgba(191,255,0,.4);color:var(--lime)}
.inline-form{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.inline-form input{width:260px;margin:0;padding:10px 12px;font-size:14px}
.admin-link{color:var(--cyan);font-weight:1000;text-decoration:none}

textarea{
  width:100%;
  min-height:160px;
  margin:9px 0 16px;
  padding:17px 18px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.07);
  color:white;
  font-size:18px;
  outline:none;
  font-family:Arial, Helvetica, sans-serif;
  resize:vertical;
}
textarea:focus{
  border-color:var(--lime);
  box-shadow:0 0 0 4px rgba(191,255,0,.12);
}


/* Ping Pong Ball Animation */
.tt-ball{
  position:absolute;
  width:34px;
  height:34px;
  border-radius:50%;
  background:
    radial-gradient(circle at 30% 30%, #ffffff 0%, #f2f2f2 55%, #cfcfcf 100%);
  right:18%;
  bottom:170px;
  z-index:8;
  animation:pingpong 3.2s ease-in-out infinite;
  box-shadow:
    0 0 14px rgba(255,255,255,.45),
    0 6px 16px rgba(0,0,0,.35);
}

.tt-ball-shadow{
  position:absolute;
  width:30px;
  height:10px;
  border-radius:50%;
  background:rgba(0,0,0,.35);
  right:18.2%;
  bottom:132px;
  filter:blur(4px);
  z-index:4;
  animation:shadowbounce 3.2s ease-in-out infinite;
}

@keyframes pingpong{
  0%{ transform:translate(0,0) scale(1); }
  15%{ transform:translate(-70px,-90px) scale(1.03); }
  30%{ transform:translate(-140px,0) scale(.96); }
  45%{ transform:translate(-220px,-70px) scale(1.02); }
  60%{ transform:translate(-300px,0) scale(.96); }
  75%{ transform:translate(-370px,-55px) scale(1.01); }
  100%{ transform:translate(-450px,0) scale(.95); }
}

@keyframes shadowbounce{
  0%,30%,60%,100%{
    transform:scale(1);
    opacity:.35;
  }

  15%,45%,75%{
    transform:scale(.6);
    opacity:.18;
  }
}

@media(max-width:700px){
  .tt-ball,
  .tt-ball-shadow{
    transform:scale(.72);
  }
}


/* ===== Ultimate Features ===== */

100%{transform:translateX(40%)}
}

/* Countdown */
.countdown-box{
  margin-top:22px;
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}

.cd-item{
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  padding:14px 18px;
  min-width:92px;
  text-align:center;
  backdrop-filter:blur(10px);
}

.cd-item strong{
  display:block;
  font-size:34px;
  color:var(--lime);
  line-height:1;
}

.cd-item span{
  font-size:12px;
  text-transform:uppercase;
  color:var(--muted);
  letter-spacing:.08em;
}

/* Weather */
.weather-box{
  margin-top:18px;
  background:linear-gradient(145deg,rgba(0,184,173,.16),rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.12);
  border-radius:20px;
  padding:18px 22px;
  display:flex;
  align-items:center;
  gap:18px;
}

.weather-temp{
  font-size:52px;
  font-weight:1000;
  line-height:1;
}

.weather-info strong{
  display:block;
  font-size:18px;
}

/* Map */
.map-box{
  margin-top:22px;
  border-radius:24px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  position:relative;
  min-height:260px;
  background:
    linear-gradient(rgba(0,0,0,.2),rgba(0,0,0,.2)),
    url('hero.jpg') center/cover;
}

.map-overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(5,14,21,.92) 0%, rgba(5,14,21,.55) 45%, transparent 100%);
  padding:28px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
}

.map-overlay h3{
  margin:0 0 10px;
  font-size:34px;
  text-transform:uppercase;
}

.map-overlay p{
  margin:0 0 18px;
  max-width:340px;
}

/* Neon glow */
.panel{
  box-shadow:
    0 0 0 1px rgba(255,255,255,.04),
    0 0 30px rgba(0,255,255,.05),
    0 22px 80px rgba(0,0,0,.48);
}

.logo{
  text-shadow:0 0 18px rgba(191,255,0,.18);
}

.live-indicator{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-top:12px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.05em;
}

.live-dot{
  width:12px;
  height:12px;
  border-radius:50%;
  background:#ff4040;
  animation:pulseLive 1.4s infinite;
  box-shadow:0 0 14px rgba(255,64,64,.9);
}

@keyframes pulseLive{
  0%,100%{transform:scale(1);opacity:1}
  50%{transform:scale(1.5);opacity:.45}
}

@media(max-width:700px){
  .weather-box{
    flex-direction:column;
    align-items:flex-start;
  }

  .cd-item{
    min-width:72px;
  }
}


/* Wetter oben im Menü */
.menu-weather{
  display:flex;
  align-items:center;
  gap:8px;
  padding:9px 13px;
  border-radius:999px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.14);
  color:white;
  font-weight:900;
  white-space:nowrap;
}

.menu-weather .weather-icon{
  font-size:21px;
  line-height:1;
}

.menu-weather .weather-temp-small{
  color:var(--lime);
  font-weight:1000;
}

.menu-weather .weather-city{
  color:var(--muted);
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.05em;
}

.map-box{
  display:none !important;
}

@media(max-width:900px){
  .menu-weather{
    font-size:14px;
  }
}


/* Wackelnde TT-Kellen direkt über der Platte */
.tt-table-paddles{
  position:absolute;
  right:19%;
  top:38%;
  width:270px;
  height:210px;
  z-index:9;
  pointer-events:none;
}

.tt-table-paddle{
  position:absolute;
  width:92px;
  height:120px;
  transform-origin:50% 78%;
  filter:drop-shadow(0 18px 24px rgba(0,0,0,.45));
}

.tt-table-paddle .face{
  position:absolute;
  left:7px;
  top:0;
  width:82px;
  height:82px;
  border-radius:50%;
  border:3px solid rgba(255,255,255,.2);
}

.tt-table-paddle .handle{
  position:absolute;
  left:38px;
  top:72px;
  width:18px;
  height:64px;
  border-radius:0 0 12px 12px;
  background:linear-gradient(180deg,#d9a15a,#7b4a1d);
}

.tt-table-paddle.red{
  left:18px;
  top:8px;
  animation:paddleWiggleRed 2.8s ease-in-out infinite;
}

.tt-table-paddle.red .face{
  background:radial-gradient(circle at 30% 25%,#ff6969,#c50012 68%,#6e0008);
}

.tt-table-paddle.black{
  right:24px;
  top:56px;
  animation:paddleWiggleBlack 3.1s ease-in-out infinite;
}

.tt-table-paddle.black .face{
  background:radial-gradient(circle at 30% 25%,#555,#111 68%,#000);
}

.tt-table-paddle.red::before,
.tt-table-paddle.black::before{
  content:"";
  position:absolute;
  left:-16px;
  top:18px;
  width:12px;
  height:34px;
  border-left:3px solid rgba(255,255,255,.8);
  border-radius:50%;
  opacity:.7;
}

.tt-table-paddle.black::before{
  left:auto;
  right:-14px;
  transform:scaleX(-1);
}

@keyframes paddleWiggleRed{
  0%,100%{transform:rotate(-11deg) translateY(0)}
  50%{transform:rotate(-3deg) translateY(-12px)}
}

@keyframes paddleWiggleBlack{
  0%,100%{transform:rotate(16deg) translateY(0)}
  50%{transform:rotate(7deg) translateY(-10px)}
}

@media(max-width:900px){
  .tt-table-paddles{
    right:4%;
    top:44%;
    transform:scale(.72);
  }
}

@media(max-width:560px){
  .tt-table-paddles{
    display:none;
  }
}


.dynamic-greeting{margin-top:14px;font-size:28px;font-weight:900;color:#fff}
.ball-counter{margin-top:16px;display:inline-flex;align-items:center;gap:12px;padding:12px 18px;border-radius:16px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12)}
.ball-counter strong{color:var(--lime);font-size:24px}

.sunset-mode{position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at bottom right, rgba(255,120,0,.10), transparent 35%),linear-gradient(180deg, transparent 0%, rgba(255,140,0,.05) 100%);mix-blend-mode:screen;z-index:1;opacity:.85}

to{background-position:-120px 280px}
}

.heatmap{margin-top:22px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.heat{padding:16px;border-radius:18px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);text-align:center}
.heat b{display:block;margin-top:8px;font-size:22px}

.polaroids{margin-top:24px;display:flex;gap:18px;flex-wrap:wrap}
.polaroid{width:210px;background:#fff;color:#111;padding:12px 12px 20px;border-radius:8px;transform:rotate(-2deg);box-shadow:0 20px 30px rgba(0,0,0,.35)}
.polaroid:nth-child(2){transform:rotate(3deg)}
.polaroid img{width:100%;border-radius:4px;display:block}
.polaroid p{margin:12px 4px 0;font-weight:700}

.footer-qr{margin-top:28px;display:flex;align-items:center;gap:18px;padding:18px;border-radius:22px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12)}

.fake-qr{width:110px;height:110px;border-radius:10px;background:
linear-gradient(90deg,#000 10%,#fff 10% 20%,#000 20% 30%,#fff 30% 40%,#000 40% 50%,#fff 50% 60%,#000 60% 70%,#fff 70% 80%,#000 80% 90%,#fff 90%),
linear-gradient(#000 10%,#fff 10% 20%,#000 20% 30%,#fff 30% 40%,#000 40% 50%,#fff 50% 60%,#000 60% 70%,#fff 70% 80%,#000 80% 90%,#fff 90%);
background-size:22px 22px}

@media(max-width:700px){
.heatmap{grid-template-columns:1fr}
}


.ball-counter,
.footer-qr{
  display:none !important;
}


/* Community-Bilder gezielt */
.mini-card.community-kellen .mini-img{
  background:url('community_kellen.svg') center/cover !important;
  filter:none !important;
}

.mini-card.community-siegertplatz .mini-img{
  background:url('community_siegertplatz.jpg') center/cover !important;
  filter:none !important;
}

.forum-list{
  display:grid;
  gap:14px;
  margin-top:18px;
}

.forum-post{
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  padding:18px;
}

.forum-head{
  display:flex;
  justify-content:space-between;
  gap:12px;
  color:var(--lime);
  margin-bottom:10px;
}

.forum-head span{
  color:var(--muted);
  font-size:13px;
}

.forum-post p{
  margin:0;
  line-height:1.55;
}


.community-cards{
  display:flex;
  gap:18px;
  flex-wrap:wrap;
  margin-top:22px;
}

.community-card{
  width:260px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);
  border-radius:22px;
  overflow:hidden;
  box-shadow:0 18px 40px rgba(0,0,0,.28);
}

.community-image{
  height:170px;
  background-size:cover;
  background-position:center;
}

.community-image.kellen{
  background-image:url('community_kellen.svg');
}

.community-image.siegertplatz{
  background-image:url('hero.jpg');
}

.community-text{
  padding:16px;
}

.community-text strong{
  display:block;
  margin-bottom:6px;
  color:#bfff00;
}


/* ===== MEGA FEATURES ===== */

.live-players{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
}

.live-player{
  padding:10px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
  font-weight:800;
}

.match-card-wrap{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  margin-top:20px;
}

.match-card{
  border-radius:22px;
  padding:24px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);
}

.match-vs{
  font-size:34px;
  font-weight:1000;
  margin-top:10px;
}

.activity-box{
  margin-top:20px;
  display:flex;
  gap:14px;
  flex-wrap:wrap;
}

.activity-pill{
  padding:12px 18px;
  border-radius:999px;
  background:rgba(191,255,0,.12);
  border:1px solid rgba(191,255,0,.2);
  font-weight:900;
}

.upload-box{
  margin-top:24px;
  padding:24px;
  border-radius:22px;
  border:2px dashed rgba(255,255,255,.18);
  background:rgba(255,255,255,.03);
}

.upload-box input{
  margin-top:14px;
}

.sound-btn{
  position:fixed;
  right:24px;
  bottom:24px;
  width:62px;
  height:62px;
  border-radius:50%;
  border:none;
  background:linear-gradient(145deg,#bfff00,#00b8ad);
  font-size:28px;
  cursor:pointer;
  box-shadow:0 14px 40px rgba(0,0,0,.35);
  z-index:99;
}

.weather-warning{
  margin-top:18px;
  padding:14px 18px;
  border-radius:18px;
  background:rgba(255,140,0,.12);
  border:1px solid rgba(255,140,0,.25);
  font-weight:800;
  display:none;
}

.weather-warning.active{
  display:block;
}

body{
  
}

.hero{
  
}

.termine-cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin-top:22px;
}

.termin-card{
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);
  border-radius:22px;
  padding:22px;
}

.termin-card strong{
  display:block;
  margin-top:8px;
  color:#bfff00;
}

.pwa-note{
  margin-top:18px;
  color:var(--muted);
  font-size:14px;
}

@media(max-width:800px){
  .match-card-wrap,
  .termine-cards{
    grid-template-columns:1fr;
  }
}

.gallery-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:18px;
  margin-top:20px;
}
.gallery-item{
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.12);
  border-radius:20px;
  overflow:hidden;
}
.gallery-item img{
  width:100%;
  height:190px;
  object-fit:cover;
  display:block;
}
.gallery-item div{
  padding:14px 16px;
}
.upload-preview{
  font-size:14px;
  color:var(--muted);
  margin-top:-6px;
  margin-bottom:14px;
}
.pwa-install{
  margin-top:16px;
  padding:14px 18px;
  border-radius:16px;
  background:rgba(191,255,0,.10);
  border:1px solid rgba(191,255,0,.20);
  color:var(--muted);
}


/* Final Cleanup */
.sound-btn{
  display:none !important;
}

/* Mehr Luft in Textboxen/Karten */
.panel,
.live-panel,
.community,
.form-card,
.calendar-box,
.next,
.how{
  padding:34px !important;
}

.feature{
  padding:34px 22px !important;
}

.mini-card p,
.community-text,
.gallery-item div,
.forum-post,
.termin-card,
.match-card,
.activity-pill,
.form-note{
  padding:18px 20px !important;
  line-height:1.6 !important;
}

/* Bilder sauber in Frame einpassen */
.gallery-item img,
.polaroid img,
.mini-img,
.community-image{
  width:100%;
  height:clamp(170px, 26vw, 260px);
  object-fit:cover;
  object-position:center;
}

.gallery-grid{
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
}

.community-card{
  flex:1 1 260px;
  min-width:240px;
}

.community-image{
  background-size:cover !important;
  background-position:center !important;
}

@media(max-width:700px){
  .panel,
  .live-panel,
  .community,
  .form-card,
  .calendar-box,
  .next,
  .how{
    padding:24px !important;
  }
}

.cookie-box{
  position:fixed;
  left:20px;
  right:20px;
  bottom:20px;
  z-index:9999;
  display:flex;
  gap:18px;
  align-items:center;
  justify-content:space-between;
  padding:18px 20px;
  border-radius:18px;
  background:rgba(5,14,21,.96);
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 18px 60px rgba(0,0,0,.45);
  color:white;
  line-height:1.5;
}
.cookie-box button{
  border:0;
  background:var(--lime);
  color:#061018;
  padding:12px 18px;
  border-radius:12px;
  font-weight:900;
  cursor:pointer;
  white-space:nowrap;
}
.cookie-box a{
  color:var(--lime);
  font-weight:900;
}
.legal-text h1,
.legal-text h2{
  color:var(--lime);
}
.legal-text p{
  line-height:1.75;
}
.footer a{
  color:var(--muted);
  text-decoration:none;
}
.footer a:hover{
  color:var(--lime);
}
@media(max-width:700px){
  .cookie-box{
    flex-direction:column;
    align-items:flex-start;
  }
}


/* Countdown nebeneinander */
.countdown,
.timer,
.hero-timer,
.countdown-box{
  display:flex !important;
  gap:18px;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
}

.countdown .unit,
.timer .unit,
.hero-timer .unit,
.countdown-box .unit,
.countdown-item{
  min-width:90px;
  text-align:center;
}


/* Finale Entfernung diagonaler Linien / Effekte */
.rain-overlay,
.hero::after,
.hero-lines,
.neon-lines,
.line-overlay,
.bg-lines{
  display:none !important;
  opacity:0 !important;
  background:none !important;
  animation:none !important;
}