/*
Theme Name: Obergenie
Description: Die Obergenie-Spielwelt mit Klickspiel, Karte und Händen.
Version: 1.4.1
Author: Sparrow Games
Text Domain: obergenie
Requires at least: 6.6
Requires PHP: 8.0
*/
@font-face{font-family:Playpen;src:url('assets/fonts/PlaypenSans-Medium.ttf') format('truetype');font-style:normal;font-weight:500;font-display:swap}
@font-face{font-family:Playpen;src:url('assets/fonts/PlaypenSans-Bold.ttf') format('truetype');font-style:normal;font-weight:700;font-display:swap}
:root{color-scheme:light;--ink:#241529;--purple:#bd47f3;--lime:#c4ff76;--paper:#fff1ce;--focus:#ffef00}
*{box-sizing:border-box}
html{min-width:300px;height:100%;overflow:hidden;background:#b7349a}
body{margin:0;color:var(--ink);font-family:Playpen,system-ui,sans-serif;font-weight:500;background:linear-gradient(180deg,#ee0c6a 0%,#b7349a 100%);height:100vh;height:100dvh;overflow:hidden}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit;color:inherit}
button,a{touch-action:manipulation}
a{color:inherit;text-underline-offset:.2em}
button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:4px solid var(--focus);outline-offset:5px}
button{cursor:pointer}
img{max-width:100%;height:auto}
[hidden]{display:none!important}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;top:10px;left:10px;transform:translateY(-200%);background:var(--paper);padding:12px 20px;z-index:100}
.skip-link:focus{transform:translateY(0)}
.site-header{position:fixed;inset:0 0 auto;height:0;z-index:30;pointer-events:none}
.brand{position:fixed;top:0;left:0;display:block;width:clamp(80px,10vw,160px);aspect-ratio:955/883;transform:translate3d(24px,24px,0);will-change:transform;pointer-events:none;user-select:none}
.brand img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 5px 0 #35243c24)}
.site-navigation{position:fixed;z-index:2;top:max(8px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));text-align:center;width:200px;pointer-events:auto}
.menu-toggle{position:relative;width:200px;height:113px;border:0;background:none;padding:0;display:grid;place-items:center}
.menu-toggle img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}
.menu-toggle .menu-hover{opacity:0}
.menu-toggle:hover .menu-hover,.menu-toggle[aria-expanded=true] .menu-hover{opacity:1}
.menu-toggle:hover .menu-normal,.menu-toggle[aria-expanded=true] .menu-normal{opacity:0}
.menu-toggle span{position:relative;z-index:1;font-weight:700;font-size:25px;transform:translate(4px,5px) rotate(-2deg)}
.menu-panel{position:absolute;top:104px;right:5px;width:270px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 145px);overflow-y:auto;padding:13px;background:var(--paper);border:3px solid var(--ink);border-radius:8px 19px 13px 6px;box-shadow:7px 8px 0 #241529;display:grid;gap:4px;text-align:left}
.menu-panel a{display:block;padding:10px 16px;border-radius:7px;text-decoration:none;font-size:17px;transition:background .12s}
.menu-panel a:hover,.menu-panel a:focus-visible{background:var(--lime)}
.menu-panel a[aria-current=page]{background:#dfa0ff;font-weight:700}
.motion-toggle{margin-top:8px;border:0;border-top:2px solid #24152930;background:transparent;text-align:left;padding:12px 16px 5px;font-size:13px;border-radius:3px}
.motion-toggle:hover{background:var(--lime)}
.map-board{position:fixed;inset:0;isolation:isolate;width:100%;height:100vh;height:100dvh;margin:0;filter:drop-shadow(0 8px 5px #35251b35)}
.map-surface{position:absolute;inset:0;z-index:0;background:var(--paper);mask-image:url('assets/images/map-mask.png');mask-size:100% 100%;mask-repeat:no-repeat;-webkit-mask-image:url('assets/images/map-mask.png');-webkit-mask-size:100% 100%;-webkit-mask-repeat:no-repeat}
.home-surface{background:#329bf3 url('assets/images/water-island.png') center/100% 100% no-repeat}
.map-frame,.map-hands{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;user-select:none}
.map-frame{z-index:4;object-fit:fill}
.map-hands{z-index:8;object-fit:fill}
.cookie-counter{position:absolute;top:24%;left:50.6%;transform:translateX(-50%) rotate(-2deg);width:32%;aspect-ratio:776/248;display:flex;align-items:center;justify-content:center;z-index:2;background:url('assets/images/counter.png') center/contain no-repeat;font-weight:700;white-space:nowrap}
.counter-label{position:absolute;top:-25px;font-size:clamp(12px,1.3vw,18px);line-height:1.1}
.counter-value{position:absolute;top:2%;height:49%;width:56%;display:flex;align-items:center;justify-content:center;font-size:clamp(23px,2.7vw,40px);line-height:1;max-width:100%;font-variant-numeric:tabular-nums}
.cookie-invitation{position:absolute;top:40%;left:20%;width:60%;text-align:center;font-size:clamp(14px,1.7vw,23px);font-weight:700;margin:0;transform:rotate(-2deg);text-shadow:0 1px #ffffff80}
.cookie-button{position:absolute;left:44.5%;bottom:20%;transform:translateX(-50%);width:min(20vw,32dvh);aspect-ratio:1;border:0;background:transparent;padding:0;z-index:5;filter:drop-shadow(0 8px 3px #5e237251)}
.cookie-art{display:block;position:relative;width:100%;height:100%;transition:transform .1s}
.cookie-art img,.cookie-art svg{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none}
.cookie-button[data-bite-prefix="popo-biss-"] .cookie-art img{transform:scale(1.08)}
.cookie-button:hover .cookie-art{transform:rotate(-4deg) scale(1.05)}
.cookie-button:active .cookie-art{transform:scale(.93) rotate(3deg)}
.cookie-button.bitten .cookie-art{animation:bite .19s ease-out}
.cookie-button.renewed .cookie-art{animation:renew .32s ease-out}
.click-pop{position:absolute;left:60%;top:-5%;color:#fff5b6;font-size:clamp(22px,3vw,44px);font-weight:700;text-shadow:2px 2px var(--ink);opacity:0;pointer-events:none}
.bitten .click-pop,.renewed .click-pop{animation:pop .45s ease-out}
.island-building{position:absolute;z-index:5;left:63%;bottom:20%;transform:translateX(-50%);width:min(12vw,22dvh);aspect-ratio:1}
.build-sign{display:block;position:relative;width:72%;height:100%;margin:0 auto;padding:0;border:0;background:none}
.sign-art,.sign-art svg{display:block;width:100%;height:100%;pointer-events:none;user-select:none}
.build-sign:disabled{cursor:inherit}
.build-sign.is-ready .sign-art{animation:sign-hop .95s ease-in-out infinite;transform-origin:50% 100%;filter:drop-shadow(0 0 7px #f6ff80)}
.building-cost{position:absolute;top:calc(100% + 5px);left:50%;transform:translateX(-50%);font-size:clamp(11px,1.1vw,16px);font-weight:700;white-space:nowrap;padding:3px 9px;background:var(--paper);border:2px solid var(--ink);border-radius:6px 3px;box-shadow:2px 2px 0 #24152945}
.island-building.is-ready .building-cost{background:var(--lime)}
.island-house{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none;filter:drop-shadow(0 5px 2px #5e237251)}
.island-building.just-built .island-house{animation:house-arrive .4s ease-out}
.island-building[data-tv-unlocked=true]{width:min(16vw,27dvh);aspect-ratio:984/1025}
.island-tv{position:absolute;inset:0;display:block;aspect-ratio:984/1025;text-decoration:none;filter:drop-shadow(0 5px 2px #5e237251)}
.tv-art{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;user-select:none}
.tv-screen{position:absolute;left:5.1%;top:25.7%;width:77.2%;height:56.3%;display:flex;align-items:center;justify-content:center;background:#160c25;overflow:hidden;clip-path:polygon(0 1%,100% 0,99% 100%,0 99%);pointer-events:none}
.tv-screen iframe{position:absolute;left:50%;top:50%;width:480px;height:270px;max-width:none;border:0;transform:translate(-50%,-50%) scale(var(--tv-scale,.2));pointer-events:none}
.island-tv:focus-visible{outline-offset:7px}
.island-building.tv-arrived .island-tv{animation:house-arrive .4s ease-out}
.counter-note{position:absolute;left:24%;bottom:10%;width:52%;text-align:center;font-size:clamp(10px,1vw,13px);margin:0;color:#172a4b;background:#bae5ffbd;border-radius:8px;padding:5px 9px}
.map-content{position:absolute;z-index:3;top:15%;left:18.5%;right:18.5%;bottom:11%;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#9c59ae transparent;padding:10px 16px 20px}
.map-content h1{font-size:clamp(26px,3.5vw,45px);line-height:1.15;margin:0 0 22px;font-weight:700;text-align:center}
.map-content h2{font-size:clamp(19px,2vw,26px);margin:1.2em 0 .35em;line-height:1.35}
.map-content p{font-size:clamp(15px,1.25vw,18px);line-height:1.6;margin:0 0 1em}
.map-content a{overflow-wrap:anywhere}
.team-content{left:19%;right:19%;top:15%;padding:8px 0 16px;display:flex;flex-direction:column;align-items:center}
.team-content h1{margin-bottom:15px;flex:0 0 auto}
.team-collage{display:block;width:100%;height:100%;min-height:0;min-width:0;flex:1 1 auto;object-fit:contain;border-radius:4px}
.team-caption{display:flex;justify-content:space-between;gap:20px;margin-top:15px;padding:0 8px;width:100%;flex:0 0 auto}
.team-caption p{font-size:14px;line-height:1.5;margin:0}
.team-caption strong{display:block;font-size:17px}
.linktree-content{padding-top:0}
.linktree-title{display:flex;justify-content:center;align-items:center;gap:15px;margin-bottom:12px}
.linktree-title img{width:67px;height:76px;object-fit:contain}
.linktree-title h1{margin:0}
.link-list{display:grid;gap:8px;max-width:620px;margin:0 auto}
.link-card{display:flex;align-items:center;gap:18px;min-height:82px;padding:8px 20px 8px 10px;background:#e6beff;border:2px solid var(--ink);border-radius:15px 6px 12px 7px;box-shadow:4px 4px 0 var(--ink);text-decoration:none;transition:transform .14s,background .14s}
.link-card:nth-child(even){background:#c9f78c}
.link-card:hover{transform:translate(-2px,-2px) rotate(-.5deg);background:#fff387}
.link-card img{width:66px;height:66px;object-fit:contain;flex:0 0 66px}
.link-card strong{font-size:clamp(16px,2vw,23px);line-height:1.3}
.link-card small{display:block;font-size:12px;margin-top:4px}
.link-arrow{margin-left:auto;font-size:27px}
.video-content{left:17%;right:17%;top:15%;padding-top:0}
.video-content h1{margin-bottom:16px}
.video-frame{aspect-ratio:16/9;width:100%;max-width:calc((74dvh - 150px) * 1.777778);margin-inline:auto;position:relative;background:#693b84;border:3px solid var(--ink);border-radius:10px 5px 9px 4px;overflow:hidden;box-shadow:5px 6px 0 #24152928}
.video-frame iframe{width:100%;height:100%;border:0;display:block}
.video-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;gap:25px;background:radial-gradient(ellipse at center,#aa65d3,#5a3678)}
.video-placeholder img{height:76%;width:30%;object-fit:contain;transform:rotate(-6deg)}
.video-load{border:3px solid var(--ink);background:var(--lime);padding:15px 22px;border-radius:12px 5px;font-weight:700;font-size:clamp(16px,2vw,24px);box-shadow:4px 4px 0 var(--ink)}
.video-load:hover{background:#ffed78;transform:rotate(-2deg)}
.video-info{display:flex;justify-content:space-between;align-items:start;gap:20px;margin-top:16px}
.video-info p,.video-info a{font-size:12px;line-height:1.6}
.video-info p{max-width:70%;margin:0}
.video-info a{white-space:nowrap}
.legal-content{left:21%;right:21%}
.legal-content h1{text-align:left}
.legal-content .draft-notice{border-left:4px solid #8f3caf;background:#eacbf9;padding:12px 16px;font-size:14px}
.site-footer{position:fixed;z-index:25;bottom:max(12px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;gap:16px;max-width:70%;font-size:11px;color:var(--ink)}
.site-footer>span{padding:4px 8px;background:#fff1cecc;border-radius:4px;white-space:nowrap}
.imprint-link{display:inline-block;background:var(--paper);color:var(--ink);border:2px solid var(--ink);border-radius:8px 3px 7px;padding:8px 20px;box-shadow:3px 3px 0 #241529;text-decoration:none;font-size:14px;font-weight:700;transform:rotate(1deg)}
.imprint-link:hover{background:var(--lime)}
.no-script{position:absolute;top:44%;width:60%;left:20%;text-align:center;font-size:13px}
@keyframes bite{0%{transform:scale(.91) rotate(4deg)}100%{transform:scale(1)}}
@keyframes renew{0%{transform:scale(.35) rotate(-15deg)}80%{transform:scale(1.1) rotate(2deg)}100%{transform:scale(1)}}
@keyframes pop{0%{opacity:1;transform:translateY(0) rotate(-12deg)}100%{opacity:0;transform:translateY(-45px) rotate(8deg)}}
@keyframes sign-hop{0%,35%,100%{transform:translateY(0) rotate(0)}55%{transform:translateY(-15px) rotate(-5deg)}75%{transform:translateY(0) rotate(3deg)}}
@keyframes house-arrive{0%{transform:scale(.65) translateY(-15px);opacity:.2}75%{transform:scale(1.05)}100%{transform:scale(1);opacity:1}}
@media(pointer:fine){body,a,button{cursor:url('assets/images/cursor.svg') 19 5,auto}}
@media(max-width:700px){
 .brand{width:86px}.site-navigation{width:134px;right:max(8px,env(safe-area-inset-right));top:max(5px,env(safe-area-inset-top))}.menu-toggle{width:134px;height:76px}.menu-toggle span{font-size:20px}.menu-panel{top:75px;width:250px;max-height:calc(100dvh - 105px)}
 .map-frame{height:100%;object-fit:fill}.map-hands{top:auto;bottom:0;height:auto;aspect-ratio:1920/1080}
 .map-surface{mask-image:none;-webkit-mask-image:none;clip-path:polygon(20% 5%,87% 5%,88.5% 100%,11.8% 100%,12.5% 18%)}.home-surface{background-size:auto 100%}
 .cookie-counter{top:25%;width:64%}.counter-label{font-size:14px;top:-24px}.counter-value{font-size:27px}
 .cookie-invitation{top:41%;left:17%;width:66%;font-size:16px}.cookie-button{width:min(36vw,26dvh);left:34%;bottom:20%}.island-building{left:68%;width:min(27vw,22dvh)}.building-cost{font-size:11px;padding:2px 6px}.counter-note{font-size:10px;left:23%;width:54%;bottom:9%}
 .island-building[data-tv-unlocked=true]{width:min(30vw,24dvh);left:68%}
 .map-content{top:max(100px,15%);bottom:12%;left:17%;right:17%;padding:10px 4px 20px}.map-content h1{font-size:27px;margin-bottom:18px}.map-content p{font-size:15px}
 .team-content{left:15%;right:15%;}.team-collage{height:auto;flex:0 1 auto}.team-caption{flex-direction:column;gap:16px;margin-top:24px;padding:0 8px}.team-caption p{font-size:14px}.team-caption strong{font-size:17px}
 .linktree-content{padding-top:0}.linktree-title{gap:8px;margin-bottom:20px}.linktree-title img{width:42px;height:50px}.linktree-title h1{margin:0;font-size:26px}
 .link-list{gap:10px;padding-right:5px}.link-card{gap:9px;padding:8px 8px;min-height:78px;box-shadow:3px 3px 0 var(--ink)}.link-card img{width:49px;height:54px;flex-basis:49px}.link-card strong{font-size:15px}.link-card small{font-size:10px}.link-arrow{font-size:20px}
 .video-content{left:16%;right:16%}.video-content h1{font-size:24px}.video-frame{aspect-ratio:4/3}.video-placeholder{flex-direction:column;gap:8px;padding:12px}.video-placeholder img{height:48%;width:50%}.video-load{font-size:15px;padding:8px 12px;border-width:2px;box-shadow:3px 3px 0 var(--ink)}.video-info{display:block}.video-info p{max-width:none;font-size:11px;margin-bottom:16px}.video-info a{font-size:12px}
 .legal-content{left:18%;right:18%}.legal-content h2{font-size:18px}.legal-content .draft-notice{font-size:12px;padding:10px}.legal-content p{font-size:14px}
 .site-footer{flex-direction:column-reverse;gap:4px;font-size:9px;bottom:max(8px,env(safe-area-inset-bottom))}.site-footer>span{padding:2px 5px}.imprint-link{font-size:12px;padding:6px 15px}
}
@media(max-height:500px) and (min-width:701px){
 .brand{width:84px}.site-navigation{width:134px}.menu-toggle{width:134px;height:76px}.menu-toggle span{font-size:20px}.menu-panel{top:75px;max-height:calc(100dvh - 100px)}
 .map-content{top:14%;bottom:15%;padding-bottom:6px}.map-content h1{font-size:25px;margin-bottom:10px}.team-caption{margin-top:8px}.team-caption p{font-size:11px}.team-caption strong{font-size:13px}
 .cookie-counter{top:22%;width:25%}.counter-label{font-size:12px;top:-18px}.counter-value{font-size:25px}.cookie-invitation{font-size:15px;top:42%}.counter-note{display:none}.site-footer{bottom:7px;font-size:9px}.imprint-link{font-size:11px;padding:5px 12px}
}
.admin-bar .site-navigation{top:40px}
@media(max-width:782px){.admin-bar .site-navigation{top:51px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
