:root{--teal-500:#00a896;--teal-400:#00d9bf;--teal-verlauf:linear-gradient(120deg, var(--teal-400), var(--teal-500));--karte-verlauf:linear-gradient(180deg, #0b8f7f 0%, #087163 55%, #065a4f 100%);--gelb:#f5b700;--grund:#fbfefd;--grund-alt:#effaf8;--flaeche:#fff;--flaeche-2:#effaf8;--text:#0b1f1d;--text-mittel:#37504c;--text-leise:#5c7a76;--linie:#dceeea;--fehler:#c2412d;--radius:20px;--schatten:0 8px 24px #0b1f1d14;--tabs:68px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--grund);min-height:100dvh;color:var(--text);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;margin:0;font:16px/1.55 Segoe UI,Roboto,system-ui,-apple-system,Helvetica,Arial,sans-serif}#app{max-width:920px;padding:0 16px calc(var(--tabs) + 28px + env(safe-area-inset-bottom));margin:0 auto}a{color:inherit}h1,h2{margin:0;line-height:1.2}:focus-visible{outline:3px solid var(--teal-400);outline-offset:2px}.kopf{padding:calc(16px + env(safe-area-inset-top)) 0 14px;justify-content:space-between;align-items:center;gap:12px;display:flex}.marke{align-items:center;gap:10px;min-width:0;text-decoration:none;display:flex}.marke__logo{border-radius:12px;flex-shrink:0;width:44px;height:44px;box-shadow:0 6px 18px #00a8964d}.marke h1{font-size:22px;font-weight:600}.marke p{color:var(--text-leise);margin:0;font-size:14px;line-height:1.3}.kopf__rechts{flex-shrink:0;align-items:center;gap:10px;display:flex}.zaehler{white-space:nowrap;align-items:center;gap:6px;font-size:17px;font-weight:700;display:inline-flex}.zaehler__stern{color:var(--gelb)}.zaehler small{color:var(--text-leise);font-size:14px;font-weight:600}.sprache{background:var(--flaeche-2);border:1px solid var(--linie);border-radius:999px;padding:3px;display:inline-flex}.sprache button{font:inherit;letter-spacing:.04em;cursor:pointer;color:var(--text-leise);background:0 0;border:0;border-radius:999px;padding:4px 10px;font-size:12px;font-weight:700}.sprache button[aria-pressed=true]{background:var(--teal-verlauf);color:#fff}.knopf,.code button{font:inherit;cursor:pointer;text-align:center;background:var(--teal-verlauf);color:#fff;border:0;border-radius:999px;padding:12px 22px;font-size:15px;font-weight:600;text-decoration:none;transition:transform .15s,box-shadow .15s;display:inline-block;box-shadow:0 6px 18px #00a89659}.knopf:hover,.code button:hover{transform:translateY(-1px)}.knopf:active,.code button:active{transform:translateY(1px)}.code{background:var(--grund-alt);border:1px solid var(--linie);border-radius:var(--radius);margin:2px 0 6px;padding:14px 16px 10px}.code label{color:var(--teal-500);text-transform:uppercase;letter-spacing:.04em;margin-bottom:8px;font-size:13px;font-weight:700;display:block}.code__zeile{gap:8px;display:flex}.code input{min-width:0;font:inherit;letter-spacing:.06em;text-transform:uppercase;background:var(--flaeche);color:var(--text);border:1px solid var(--linie);border-radius:999px;flex:1;padding:10px 16px;font-weight:700}.code input:focus{border-color:var(--teal-400);outline:none;box-shadow:0 0 0 3px #00d9bf33}.code input::placeholder{text-transform:none;letter-spacing:normal;color:#8aa5a1;font-weight:500}.code__antwort{min-height:1.4em;margin:6px 0 0;font-size:14px}.code__antwort[data-art=fehler]{color:var(--fehler)}.code__antwort[data-art=info]{color:var(--text-leise)}.wackeln{animation:.4s wackeln}@keyframes wackeln{20%,60%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}.augenbraue{color:var(--teal-500);letter-spacing:.04em;text-transform:uppercase;margin-bottom:4px;font-size:13px;font-weight:700;display:block}.gattung{margin-top:28px}.gattung h2{align-items:baseline;gap:8px;margin-bottom:14px;font-size:19px;display:flex}.gattung h2 small{color:var(--text-leise);font-size:14px;font-weight:700}.gattung h2 small b{color:var(--gelb)}.gattung__rest{color:var(--text-leise);margin:12px 0 0;font-size:14px}.gattung--leer h2{color:var(--text-leise)}.gattung--leer .gattung__rest{margin-top:0}.raster{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;display:grid}@media (width<=460px){.raster{grid-template-columns:repeat(3,1fr);gap:10px}}@media (width<=360px){.raster{grid-template-columns:repeat(2,1fr)}}.karte{color:var(--text);background:var(--flaeche);border:1px solid var(--linie);border-radius:var(--radius);flex-direction:column;align-items:center;gap:10px;padding:16px 8px 14px;text-decoration:none;transition:transform .15s,border-color .15s,box-shadow .15s;display:flex;position:relative}.karte:hover{border-color:var(--teal-400);box-shadow:var(--schatten);transform:translateY(-2px)}.ring{aspect-ratio:1;border:3px solid var(--teal-400);border-radius:50%;width:min(100%,112px);padding:6px;position:relative}.ring__bild{width:100%;height:100%;box-shadow:inset 0 0 0 1px var(--linie);background:#fff;border-radius:50%;place-items:center;display:grid;overflow:hidden}.ring__bild img{object-fit:contain;width:82%;height:82%}.pille{background:var(--text);color:#fff;white-space:nowrap;border-radius:999px;padding:2px 8px;font-size:11px;font-weight:700;position:absolute;bottom:-4px;right:-6px}.karte__name{text-align:center;font-size:15px;font-weight:600;line-height:1.25}.karte--zu .ring{border:3px dashed #b9d6d1}.karte--zu .ring__bild{background:var(--flaeche-2);position:relative}.karte--zu .ring__bild img{filter:grayscale()blur(8px);opacity:.35}.karte--zu .ring__bild:after{content:"?";color:var(--teal-500);font-size:40px;font-weight:800;position:absolute}.karte--zu .karte__name{color:var(--text-leise)}.seitenkopf{padding:calc(20px + env(safe-area-inset-top)) 0 6px}.seitenkopf h1{font-size:28px}.seitenkopf p{color:var(--text-leise);margin:6px 0 0}.spiele{margin-top:18px}.spielkachel .ring__bild{background:var(--flaeche-2)}.spielkachel .ring__bild img{object-fit:cover;width:100%;height:100%}.spielkachel__schloss{color:var(--teal-500)}.spielkachel__schloss svg{width:40%;height:40%}.spielkachel small{color:var(--text-leise);text-align:center;font-size:12px;line-height:1.3}.karte--zu.spielkachel .ring__bild:after{content:none}.detail{max-width:560px;padding-top:calc(12px + env(safe-area-inset-top));margin:0 auto}.detail__leiste{justify-content:space-between;align-items:center;padding-bottom:12px;display:flex}.zurueck{color:var(--text-leise);padding:6px 0;font-weight:600;text-decoration:none;display:inline-block}.lernkarte{background:var(--karte-verlauf);color:#fff;border-radius:28px;overflow:hidden;box-shadow:0 18px 40px #0b1f1d2e}.lernkarte__kopf{border-bottom:1px solid #ffffff1f;align-items:center;gap:14px;padding:16px 18px;display:flex}.lernkarte__kopf img{object-fit:contain;background:#fff;border-radius:50%;width:52px;height:52px;padding:4px}.lernkarte__kopf strong{font-size:19px;display:block}.lernkarte__kopf span{color:#ffffffb3;font-size:14px}.lernkarte__inhalt{padding:20px 20px 24px}.detail__bild{aspect-ratio:4/3;background:#fff;border-radius:20px;place-items:center;padding:16px;display:grid}.detail__bild img{object-fit:contain;max-width:100%;max-height:100%}.detail--zu .detail__bild{background:#ffffff26}.detail--zu .detail__bild img{filter:grayscale()blur(14px);opacity:.5}.detail h1{text-align:center;margin:20px 0 10px;font-size:28px}.detail__text{color:#ffffffd1;text-align:center;margin:0;font-size:17px}.detail__text--leer{font-style:italic}.detail h2{color:#9ff3e6;text-transform:uppercase;letter-spacing:.06em;margin:22px 0 8px;font-size:13px}.faehig{gap:8px;margin:0;padding:0;list-style:none;display:grid}.faehig li{color:#ffffffd9;background:#0000002e;border-radius:14px;padding:10px 14px}.faehig strong{color:#ffd60a;display:block}.knopf--spiel{width:100%;color:var(--teal-500);background:#fff;margin-top:22px;padding:15px;font-size:18px;box-shadow:0 6px 18px #00000026}.detail__jubel{text-align:center;color:var(--gelb);margin:0 0 12px;font-size:20px;font-weight:800;animation:.7s cubic-bezier(.2,1.6,.4,1) jubel}.detail--neu .lernkarte{animation:.8s cubic-bezier(.2,1.4,.4,1) auftauchen}@keyframes jubel{0%{opacity:0;transform:scale(.4)}}@keyframes auftauchen{0%{opacity:0;transform:scale(.7)rotate(-4deg)}}.detail--zu h1{margin-top:18px}.detail--zu p{text-align:center;color:#ffffffd9}.fuss{text-align:center;color:var(--text-leise);margin-top:40px;font-size:14px}.fuss p{margin:0 0 10px}.rechtlich-links a{color:var(--text-leise)}.rechtliches h1{margin:4px 0 14px;font-size:28px}.rechtliches h2{color:var(--teal-500);text-transform:uppercase;letter-spacing:.05em;margin:24px 0 6px;font-size:13px}.rechtliches p{color:var(--text-mittel);margin:0 0 10px}.rechtliches a{color:var(--teal-500)}.rechtliches .kurz{background:var(--flaeche);border:1px solid var(--linie);border-radius:16px;padding:12px 14px}.rechtliches .stand{color:var(--text-leise);margin-top:24px;font-size:14px}mark.fehlt{background:var(--fehler);color:#fff;border-radius:4px;padding:0 4px}.tabs{z-index:20;height:calc(var(--tabs) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);border-top:1px solid var(--linie);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#fbfefdf0;justify-content:center;gap:8px;display:flex;position:fixed;bottom:0;left:0;right:0}.tabs a{color:var(--text-leise);flex-direction:column;flex:0 160px;justify-content:center;align-items:center;gap:4px;font-size:14px;text-decoration:none;display:flex}.tabs a svg{width:26px;height:26px}.tabs a[aria-current=page]{color:var(--teal-500);font-weight:600}body[data-seite=spiel] .tabs{display:none}body[data-seite=spiel] #app{max-width:none;padding:0}.spielflaeche{background:var(--grund-alt);touch-action:none;-webkit-user-select:none;user-select:none;position:fixed;inset:0}.spielflaeche canvas{display:block}.laedt{color:var(--text-leise);place-items:center;margin:0;display:grid;position:absolute;inset:0}.spiel-leiste{top:calc(10px + env(safe-area-inset-top));pointer-events:none;z-index:2;justify-content:space-between;display:flex;position:absolute;left:10px;right:10px}.spiel-leiste__rechts{pointer-events:none;gap:8px;display:flex}.spiel-leiste .sprache{pointer-events:auto;background:#ffffffe6}.spiel-leiste>a,.spiel-leiste__rechts>button{pointer-events:auto;font:inherit;color:var(--text);border:1px solid var(--linie);cursor:pointer;background:#ffffffe6;border-radius:999px;padding:6px 14px;font-size:14px;font-weight:600;text-decoration:none}.recht-mini{left:50%;bottom:calc(8px + env(safe-area-inset-bottom));z-index:3;color:var(--text-leise);background:#fffc;border-radius:999px;padding:3px 12px;font-size:12px;transition:opacity .3s;position:fixed;transform:translate(-50%)}.recht-mini a{color:inherit}body[data-spielzustand=laeuft] .recht-mini{opacity:0;pointer-events:none}.recht-ebene{z-index:10;background:var(--grund);padding:0 16px 40px;position:fixed;inset:0;overflow-y:auto}.recht-ebene[hidden]{display:none}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}
