/* Fair Designed Games: Nachtviolett wie das Spiel, Rechtstexte auf hellem Papier */
@font-face{font-family:"Alegreya SC";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/alegreya-sc-700-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Alegreya SC";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/alegreya-sc-700-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Noto Sans";font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/noto-sans-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Noto Sans";font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/noto-sans-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
:root{--night:#0F0A26;--text:#F2EFFF;--soft:#B9B0E8;--body:#D6CFF7;--gp:#5B3FE0;--gp2:#7A5CFF;--gold:#E8C46A;
  --edge:rgba(176,160,255,.30);--paper:#F7F5FF;--ink:#1D1640;--ink2:#3A2A99;--ink-h:#2A1E7A;--rule:#D9D2F5;
  --disp:"Alegreya SC",Georgia,serif;--sans:"Noto Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color-scheme:dark}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;
  background:linear-gradient(180deg,#160E3A 0%,var(--night) 50%,#0B0820 100%);color:var(--text);font-family:var(--sans);font-size:16px;line-height:1.6}
a{color:inherit}
a:focus-visible,button:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
img{max-width:100%;height:auto}
.L-en .de,.L-de .en{display:none}
.top{background:
  radial-gradient(1.2px 1.2px at 12% 18%,rgba(255,255,255,.8),transparent 60%),
  radial-gradient(1px 1px at 38% 62%,rgba(255,255,255,.6),transparent 60%),
  radial-gradient(1.4px 1.4px at 74% 28%,rgba(255,255,255,.75),transparent 60%),
  radial-gradient(1px 1px at 88% 74%,rgba(255,255,255,.5),transparent 60%),
  radial-gradient(1px 1px at 56% 12%,rgba(255,255,255,.55),transparent 60%),
  radial-gradient(900px 520px at 75% 0%,#2E1E78 0%,transparent 65%)}
.start .top{flex:1;display:flex;flex-direction:column}
.hd{display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding:max(14px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) 14px max(20px,env(safe-area-inset-left))}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--disp);font-weight:700;font-size:18px;color:#E9E4FF;text-decoration:none;letter-spacing:.02em}
.brand img{width:30px;height:30px;border-radius:50%;box-shadow:0 0 14px rgba(122,92,255,.75)}
.lsw{display:none;border:1px solid var(--edge);border-radius:999px;padding:1px 4px;color:#E9E4FF}
.js .lsw{display:inline-flex;gap:2px}
.lsw button{font:inherit;font-size:12px;background:none;border:0;padding:4px 6px;cursor:pointer;color:inherit;opacity:.55}
.L-de .lsw [data-l="de"],.L-en .lsw [data-l="en"]{opacity:1;text-decoration:underline;text-underline-offset:3px}
.hero{flex:1;display:grid;gap:28px;align-items:center;width:100%;max-width:1180px;margin:0 auto;
  padding:18px max(20px,env(safe-area-inset-right)) 48px max(20px,env(safe-area-inset-left))}
.eyebrow{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--soft);margin:0}
h1{font-family:var(--disp);font-weight:700;font-size:46px;line-height:1.02;margin:8px 0 6px;color:#F7F3FF;text-shadow:0 0 26px rgba(122,92,255,.6);text-wrap:balance}
.ios{color:var(--gold);font-size:14px;margin:0}
.lead{font-size:18px;color:var(--body);max-width:32ch;margin:14px 0 0}
.stores{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.store{display:flex;flex-direction:column;line-height:1.15;padding:9px 20px 10px;border-radius:999px;
  background:linear-gradient(180deg,var(--gp2),var(--gp));color:#FFFFFF;text-decoration:none;border:1px solid rgba(255,255,255,.22);box-shadow:0 6px 20px rgba(91,63,224,.45)}
.store small{font-size:11px;opacity:.85}
.store b{font-size:16px}
.store.alt{background:transparent;border-color:var(--edge);box-shadow:none}
.phone{justify-self:center;width:min(260px,76%);border-radius:28px;border:1px solid rgba(255,255,255,.18);
  box-shadow:0 0 0 6px rgba(255,255,255,.04),0 0 60px rgba(91,63,224,.5);animation:glow 4.5s ease-in-out infinite}
@keyframes glow{50%{box-shadow:0 0 0 6px rgba(255,255,255,.04),0 0 96px rgba(122,92,255,.8)}}
.ft{border-top:1px solid var(--edge);display:flex;flex-wrap:wrap;gap:10px 20px;justify-content:center;font-size:14px;color:var(--soft);
  padding:22px max(20px,env(safe-area-inset-right)) max(28px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left))}
.ft a{color:#E9E4FF}
.top.slim{border-bottom:1px solid var(--edge)}
.paper{flex:1;background:var(--paper);color:var(--ink);color-scheme:light}
.legal{max-width:680px;margin:0 auto;padding:28px max(20px,env(safe-area-inset-right)) 52px max(20px,env(safe-area-inset-left));line-height:1.65}
.legal h1{font-size:28px;line-height:1.1;color:var(--ink-h);text-shadow:none;margin:22px 0 10px;overflow-wrap:break-word}
.legal h2{font-family:var(--disp);font-weight:700;font-size:21px;letter-spacing:.02em;color:var(--ink2);margin:30px 0 6px}
.legal a{color:var(--gp);word-break:break-word}
.legal hr{border:0;border-top:1px solid var(--rule);margin:40px 0}
.legal .thin{font-weight:700;opacity:.65}
.jump{display:flex;flex-wrap:wrap;gap:8px}
.jump a{background:#E9E4FF;color:var(--ink2);border-radius:999px;padding:4px 12px;text-decoration:none;font-size:14px}
@media (min-width:760px){
  .hd{padding-left:48px;padding-right:48px}
  .hero{grid-template-columns:1.15fr .85fr;padding:40px 48px 72px}
  h1{font-size:68px}
  .legal h1{font-size:40px}
}
@media (prefers-reduced-motion:reduce){.phone{animation:none}}
