/* Zusaetzliche Regeln der Seite: Startseite */

body{margin:0}
@keyframes ticker{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
@keyframes ticker-figure-walk{0%,100%{transform:translateY(0) rotate(0deg)}25%{transform:translateY(-3px) rotate(-6deg)}75%{transform:translateY(-3px) rotate(6deg)}}
.ticker-figure{animation:ticker-figure-walk 0.6s ease-in-out infinite}
.ticker-figure:nth-of-type(2){animation-delay:0.15s}
.ticker-figure:nth-of-type(3){animation-delay:0.3s}
@keyframes seal-spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}
.eye-follow{transition:left .15s ease, top .15s ease}
@media (max-width: 640px){ [style*="position:fixed;bottom:24px;right:24px"],[style*="position: fixed;bottom:24px;right:24px"]{display:none} }
@media (max-width: 900px){ .thread-line{display:none !important} }
@media (max-width: 1000px){
.bento{grid-template-columns:1fr 1fr !important}
.bento > .bento-wide{grid-column:span 2 !important}
.bento > .bento-full{grid-column:span 2 !important}
}
@media (max-width: 820px){
.bento > .bento-wide{grid-template-columns:1fr !important}
}
@media (max-width: 760px){
.shotgrid{grid-template-columns:1fr !important}
}
@media (max-width: 700px){
.bento{grid-template-columns:1fr !important}
.bento > .bento-wide, .bento > .bento-full{grid-column:span 1 !important}
}
.imx-card{transition:transform .25s ease, box-shadow .25s ease}
.imx-card:hover{transform:translateY(-4px);box-shadow:0 16px 40px oklch(20% 0.01 30 / 0.12)}
input[type=range]{accent-color:oklch(46% 0.18 350)}
.dual-range{position:relative;height:36px;margin-top:4px}
.dual-range .track{position:absolute;top:16px;left:0;right:0;height:4px;background:oklch(88% 0.01 30);border-radius:2px}
.dual-range .track-fill{position:absolute;top:16px;height:4px;background:oklch(46% 0.18 350);border-radius:2px}
.dual-range input[type=range]{position:absolute;top:8px;left:0;width:100%;margin:0;pointer-events:none;-webkit-appearance:none;appearance:none;background:transparent}
.dual-range input[type=range]::-webkit-slider-runnable-track{background:transparent}
.dual-range input[type=range]::-webkit-slider-thumb{pointer-events:auto;-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:oklch(46% 0.18 350);cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,.35);margin-top:0}
.dual-range input[type=range]::-moz-range-thumb{pointer-events:auto;width:18px;height:18px;border-radius:50%;background:oklch(46% 0.18 350);cursor:pointer;border:none}
.dual-range input[type=range]::-moz-range-track{background:transparent}
@media (max-width: 900px) {
[style*="padding:0 56px"],[style*="padding: 0 56px"]{padding:0 20px !important}
[style*="padding:0 56px 110px"],[style*="padding: 0 56px 110px"]{padding:0 20px 56px !important}
[style*="padding:96px 56px"],[style*="padding: 96px 56px"]{padding:56px 20px !important}
[style*="padding:100px 56px"],[style*="padding: 100px 56px"]{padding:56px 20px !important}
[style*="padding:110px 56px"],[style*="padding: 110px 56px"]{padding:56px 20px !important}
[style*="padding:88px 56px"],[style*="padding: 88px 56px"]{padding:48px 20px !important}
[style*="padding:80px 56px"],[style*="padding: 80px 56px"]{padding:48px 20px !important}
[style*="padding:72px 56px"],[style*="padding: 72px 56px"]{padding:40px 20px !important}
[style*="padding:56px;"],[style*="padding: 56px;"]{padding:32px 20px !important}
[style*="grid-template-columns:repeat(4,1fr)"],[style*="grid-template-columns: repeat(4,1fr)"]{grid-template-columns:repeat(2,1fr) !important}
[style*="grid-template-columns:repeat(3,1fr)"],[style*="grid-template-columns: repeat(3,1fr)"]{grid-template-columns:1fr !important}
[style*="grid-template-columns:repeat(6,1fr)"],[style*="grid-template-columns: repeat(6,1fr)"]{grid-template-columns:repeat(2,1fr) !important}
[style*="grid-template-columns:1fr 280px"],[style*="grid-template-columns: 1fr 280px"]{grid-template-columns:1fr !important}
[style*="grid-template-columns:1fr 1fr"],[style*="grid-template-columns: 1fr 1fr"]{grid-template-columns:1fr !important}
[style*="grid-template-columns:1.05fr 0.95fr"],[style*="grid-template-columns: 1.05fr 0.95fr"]{grid-template-columns:1fr !important}
[style*="grid-template-columns:1.6fr 1fr"],[style*="grid-template-columns: 1.6fr 1fr"]{grid-template-columns:1fr !important}
[style*="grid-template-columns:1.4fr 1fr 1fr 1fr 1fr"],[style*="grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr"]{grid-template-columns:1fr 1fr !important}
[style*="font-size:68px"],[style*="font-size: 68px"]{font-size:38px !important}
[style*="font-size:66px"],[style*="font-size: 66px"]{font-size:36px !important}
[style*="font-size:64px"],[style*="font-size: 64px"]{font-size:36px !important}
[style*="font-size:56px"],[style*="font-size: 56px"]{font-size:34px !important}
[style*="font-size:52px"],[style*="font-size: 52px"]{font-size:32px !important}
[style*="font-size:48px"],[style*="font-size: 48px"]{font-size:30px !important}
[style*="font-size:44px"],[style*="font-size: 44px"]{font-size:30px !important}
[style*="font-size:42px"],[style*="font-size: 42px"]{font-size:28px !important}
[style*="font-size:40px"],[style*="font-size: 40px"]{font-size:28px !important}
[style*="font-size:38px"],[style*="font-size: 38px"]{font-size:26px !important}
[style*="font-size:36px"],[style*="font-size: 36px"]{font-size:24px !important}
.site-nav{padding:14px 20px !important}
.site-nav .nav-links{overflow-x:auto;-webkit-overflow-scrolling:touch;gap:14px !important;scrollbar-width:none}
.site-nav .nav-links::-webkit-scrollbar{display:none}
.alt-block{grid-template-columns:1fr !important}
.alt-block .alt-img{order:-1}
}
@media (max-width: 480px){
[style*="grid-template-columns:1.4fr 1fr 1fr 1fr 1fr"],[style*="grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr"]{grid-template-columns:1fr !important}
}
@media (max-width: 1100px){
.site-nav{padding:18px 24px !important;gap:16px !important}
.site-nav .nav-links{gap:16px !important;font-size:13.5px !important}
}

.nav-dropdown{position:relative}
.nav-toggle{display:none}
.nav-burger{display:none;flex-direction:column;justify-content:center;gap:5px;width:42px;height:42px;border-radius:10px;border:1px solid oklch(88% 0.01 30);cursor:pointer;flex-shrink:0;align-items:center}
.nav-burger span{display:block;width:19px;height:2px;background:oklch(28% 0.01 30);border-radius:2px;transition:transform .2s ease, opacity .2s ease}
.nav-toggle:checked ~ .nav-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle:checked ~ .nav-burger span:nth-child(2){opacity:0}
.nav-toggle:checked ~ .nav-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media (max-width: 900px){
.nav-burger{display:flex}
.site-nav{flex-wrap:wrap;position:relative}
.site-nav .nav-links{display:none !important;order:3;width:100%;flex-direction:column !important;align-items:stretch !important;gap:2px !important;padding:14px 0 4px;margin-top:12px;border-top:1px solid oklch(90% 0.01 30);overflow:visible !important;white-space:normal !important;font-size:16px !important}
.nav-toggle:checked ~ .nav-links{display:flex !important}
.site-nav .nav-links > a{padding:13px 4px;border-bottom:1px solid oklch(94% 0.01 30)}
.site-nav .nav-links > a:last-child{border-bottom:none;margin-top:12px;text-align:center;padding:15px 22px !important}
.nav-dropdown{position:static}
.nav-dropdown > span{padding:13px 4px;border-bottom:1px solid oklch(94% 0.01 30);width:100%;justify-content:space-between}
.dropdown-panel{position:static !important;opacity:1 !important;visibility:visible !important;transform:none !important;box-shadow:none !important;border:none !important;background:oklch(97% 0.008 350) !important;border-radius:10px !important;padding:6px !important;min-width:0 !important;margin:6px 0 10px}
.dropdown-teaser{display:none}
}

.dropdown-panel{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(6px);background:white;border:1px solid oklch(88% 0.01 30);border-radius:12px;box-shadow:0 14px 32px oklch(20% 0.01 30 / 0.14);padding:14px;display:flex;flex-direction:column;gap:2px;min-width:220px;opacity:0;visibility:hidden;transition:opacity .18s ease, transform .18s ease;z-index:60}
.nav-dropdown:hover .dropdown-panel{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.dropdown-panel a{padding:9px 12px;border-radius:8px;color:oklch(30% 0.01 30);text-decoration:none;font-size:14px;white-space:nowrap}
.dropdown-panel a:hover{background:oklch(96% 0.02 350);color:oklch(38% 0.16 350)}
.dropdown-teaser{font-family:'Quicksand',sans-serif;font-size:12.5px;font-weight:700;color:oklch(38% 0.16 350);padding:2px 12px 10px;border-bottom:1px solid oklch(90% 0.01 30);margin-bottom:6px;white-space:nowrap}
.site-nav{transition:padding .2s ease}
.site-nav.nav-shrink{padding-top:11px !important;padding-bottom:11px !important}
@media (max-width: 700px){ .photoband{min-height:400px !important} .photoband > div{padding:28px 24px !important} }

/* --- Spielefilter -------------------------------------------------------- */

.gamefilter summary::-webkit-details-marker { display: none; }
.gamefilter .filter-close-label { display: none; }
.gamefilter[open] .filter-open-label { display: none; }
.gamefilter[open] .filter-close-label { display: inline; }

.filter-chip {
  display: inline-flex; align-items: center; gap: 8px;
  background: white; border: 1px solid oklch(88% 0.01 30);
  color: oklch(30% 0.01 30);
  padding: 10px 18px; border-radius: 999px;
  font-size: 13.5px; font-weight: 600; cursor: pointer;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
}
.filter-chip input { accent-color: oklch(46% 0.18 350); margin: 0; }
.filter-chip:has(input:checked) {
  background: oklch(93% 0.03 350);
  border-color: oklch(46% 0.18 350);
  color: oklch(38% 0.16 350);
}

/* --- Missionskarten ------------------------------------------------------ */

.mission-card .mission-toggle { position: absolute; opacity: 0; pointer-events: none; }
.mission-card .mission-toggle:checked + .mission-inner { transform: rotateY(180deg); }
.mission-card .mission-toggle:focus-visible + .mission-inner {
  outline: 2px solid oklch(46% 0.18 350); outline-offset: 4px; border-radius: 12px;
}

@media (max-width: 900px) { .misgrid { grid-template-columns: repeat(3, 1fr) !important; } }
@media (max-width: 560px) { .misgrid { grid-template-columns: repeat(2, 1fr) !important; } }
