@font-face{font-family:'DM Sans';src:url('../fonts/dmsans-var-normal-latin-ext.woff2') format('woff2');font-weight:100 700;font-style:normal;font-display:swap;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:'DM Sans';src:url('../fonts/dmsans-var-normal-latin.woff2') format('woff2');font-weight:100 700;font-style:normal;font-display:swap;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:'Merriweather';src:url('../fonts/merriweather-var-latin-ext.woff2') format('woff2');font-weight:400 900;font-style:normal;font-display:swap;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:'Merriweather';src:url('../fonts/merriweather-var-latin.woff2') format('woff2');font-weight:400 900;font-style:normal;font-display:swap;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:'Oswald';src:url('../fonts/oswald-var-latin-ext.woff2') format('woff2');font-weight:200 700;font-style:normal;font-display:swap;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:'Oswald';src:url('../fonts/oswald-var-latin.woff2') format('woff2');font-weight:200 700;font-style:normal;font-display:swap;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;}*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}html,body{width:100%;height:100%;font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;font-size:17px;line-height:1.55;letter-spacing:-0.01em;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}body{display:flex;justify-content:center;align-items:center;overflow:hidden;}:root,body,body.theme-dark,body.theme-light,body.theme-contrast{--bg-primary:#f5f5f7;--bg-secondary:#ffffff;--bg-accent:#f0f1f4;--bg-canvas:#ffffff;--bg-glass:rgba(255,255,255,0.72);--bg-glass-strong:rgba(255,255,255,0.88);--text-primary:#1d1d1f;--text-secondary:#555e6e;--text-muted:#7a8595;--accent-primary:#4b698c;--accent-primary-2:#3a5a7c;--brand-blue:#1a3a6a;--accent-success:#10b981;--accent-warning:#f59e0b;--accent-error:#d32f2f;--accent-info:#5ac8fa;--cat-spiele:#e85d5d;--cat-spiele-soft:#fdebe9;--cat-musik:#10b981;--cat-musik-soft:#e6f7f0;--cat-kunst:#8b5cf6;--cat-kunst-soft:#f0eafe;--cat-lernen:#0ea5e9;--cat-lernen-soft:#e3f4fc;--cat-entspannung:#f59e0b;--cat-entspannung-soft:#fdf2d9;--cat-sozial:#4b698c;--cat-sozial-soft:#e8eef4;--app-accent:var(--cat-sozial);--app-accent-soft:var(--cat-sozial-soft);--accent-secondary:var(--app-accent);--game-red:#e85d5d;--game-blue:#4b698c;--game-green:#10b981;--game-yellow:#f59e0b;--game-orange:#ea7c30;--game-purple:#8b5cf6;--game-cyan:#5ac8fa;--game-pink:#e85d5d;--border-color:rgba(0,0,0,0.08);--border-color-strong:rgba(0,0,0,0.14);--border-glow:rgba(75,105,140,0.18);--shadow-sm:0 1px 2px rgba(0,0,0,0.04);--shadow-md:0 4px 12px rgba(0,0,0,0.08);--shadow-lg:0 12px 40px rgba(0,0,0,0.12);--shadow-xl:0 20px 60px rgba(0,0,0,0.16);--tts-word:#ffd60a;--tts-word-text:#1d1d1f;--tts-focus:#4b698c;--spacing-xs:4px;--spacing-sm:8px;--spacing-md:16px;--spacing-lg:24px;--spacing-xl:40px;--touch-target-sm:44px;--touch-target-md:72px;--touch-target-lg:88px;--touch-gap:12px;--radius-sm:10px;--radius-md:16px;--radius-lg:22px;--radius-xl:28px;--radius-pill:980px;--ease:cubic-bezier(0.25,1,0.5,1);--ease-spring:cubic-bezier(0.34,1.56,0.64,1);--duration:0.35s;--duration-slow:0.6s;background-color:var(--bg-primary);color:var(--text-primary);}h1,h2,h3,h4{color:var(--text-primary);line-height:1.15;letter-spacing:-0.022em;font-weight:700;}h1{font-family:'Merriweather',Georgia,serif;font-size:clamp(2rem,4.5vw,3rem);margin-bottom:var(--spacing-lg);}h2{font-family:'Oswald','DM Sans',sans-serif;font-size:clamp(1.4rem,2.8vw,1.9rem);font-weight:600;letter-spacing:0.01em;margin-bottom:var(--spacing-md);}h3{font-family:'Oswald','DM Sans',sans-serif;font-size:1.2rem;font-weight:600;margin-bottom:var(--spacing-sm);}h4{font-size:1.05rem;font-weight:700;}p{color:var(--text-secondary);margin-bottom:var(--spacing-md);max-width:68ch;}small{font-size:0.85rem;color:var(--text-muted);}strong{font-weight:600;color:var(--text-primary);}code,pre{font-family:ui-monospace,'SF Mono',Menlo,Consolas,monospace;font-size:0.92em;}.eyebrow{font-size:0.72rem;font-weight:600;text-transform:uppercase;letter-spacing:0.08em;color:var(--text-muted);}.game-container{width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:var(--spacing-md);background:var(--bg-primary);gap:var(--spacing-md);}canvas{display:block;background-color:var(--bg-canvas);border:0.5px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);}.status-bar{display:flex;justify-content:space-around;gap:var(--spacing-md);width:100%;max-width:720px;padding:var(--spacing-md) var(--spacing-lg);background:var(--bg-secondary);border:0.5px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);margin-bottom:var(--spacing-md);}.status-item{text-align:center;}.status-label{font-size:0.72rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:0.08em;font-weight:600;margin-bottom:2px;}.status-value{font-family:'Oswald','DM Sans',sans-serif;font-size:1.4rem;font-weight:600;color:var(--app-accent);letter-spacing:0.01em;}.panel{background:var(--bg-secondary);border:0.5px solid var(--border-color);border-radius:var(--radius-lg);padding:var(--spacing-lg);box-shadow:var(--shadow-sm);}.panel-label{font-size:0.72rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:0.08em;font-weight:600;text-align:center;margin-bottom:var(--spacing-sm);}.message-overlay{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);min-width:320px;padding:var(--spacing-xl);background:var(--bg-secondary);border:0.5px solid var(--border-color);border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);text-align:center;z-index:100;}.message-overlay h1,.message-overlay .overlay-title{font-family:'Merriweather',serif;font-size:2rem;color:var(--text-primary);margin-bottom:var(--spacing-md);}.message-overlay p,.message-overlay .overlay-score{font-size:1.1rem;color:var(--text-secondary);}.recording-indicator{position:absolute;top:20px;left:50%;transform:translateX(-50%);display:inline-flex;align-items:center;gap:8px;padding:6px 14px;background:var(--bg-secondary);border:0.5px solid var(--border-color);border-radius:var(--radius-pill);box-shadow:var(--shadow-sm);font-size:0.85rem;font-weight:600;color:var(--text-muted);z-index:50;transition:all var(--duration) var(--ease);}.recording-indicator::before{content:'';width:10px;height:10px;border-radius:50%;background:var(--text-muted);transition:all var(--duration) var(--ease);}.recording-indicator.recording{color:var(--accent-error);background:#fdebe9;}.recording-indicator.recording::before{background:var(--accent-error);box-shadow:0 0 0 4px rgba(211,47,47,0.18);animation:pulse-recording 1s infinite;}.recording-indicator.playing{color:#0a7a5a;background:var(--cat-musik-soft);}.recording-indicator.playing::before{background:var(--accent-success);}@keyframes pulse-recording{0%,100%{opacity:1;transform:scale(1);}50%{opacity:0.55;transform:scale(1.18);}}.options-container{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-md);max-width:720px;width:100%;}.option{min-height:var(--touch-target-lg);padding:var(--spacing-lg);background:var(--bg-secondary);border:0.5px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);font-family:'DM Sans',sans-serif;font-size:1.25rem;font-weight:500;color:var(--text-primary);text-align:center;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--duration) var(--ease);}.option:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--border-color-strong);}.option.selected{border-color:var(--app-accent);background:var(--app-accent-soft);box-shadow:0 0 0 2px var(--app-accent) inset;}.option.correct{border-color:var(--accent-success);background:var(--cat-musik-soft);color:#0a7a5a;box-shadow:0 0 0 2px var(--accent-success) inset;}.option.incorrect{border-color:var(--accent-error);background:#fdebe9;color:#8b2424;}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--touch-target-md);padding:12px 28px;background:var(--app-accent);color:#fff;font-family:'DM Sans',sans-serif;font-size:1rem;font-weight:600;letter-spacing:-0.005em;border:1.5px solid transparent;border-radius:var(--radius-pill);cursor:pointer;box-shadow:0 2px 10px rgba(75,105,140,0.18);transition:transform var(--duration) var(--ease),box-shadow var(--duration) var(--ease),background var(--duration) var(--ease);}.btn:hover{transform:translateY(-1px);background:var(--accent-primary-2);box-shadow:0 6px 18px rgba(75,105,140,0.28);}.btn:active{transform:translateY(0);}.btn-lg{min-height:var(--touch-target-lg);font-size:1.1rem;padding:16px 36px;}.btn-primary{background:var(--accent-primary);}.btn-success{background:var(--accent-success);box-shadow:0 2px 10px rgba(16,185,129,0.25);}.btn-danger{background:var(--accent-error);box-shadow:0 2px 10px rgba(211,47,47,0.25);}.btn-ghost{background:var(--bg-secondary);color:var(--text-primary);border-color:var(--border-color-strong);box-shadow:none;}.btn-ghost:hover{background:var(--bg-accent);}.btn-icon{width:var(--touch-target-md);min-height:var(--touch-target-md);padding:0;border-radius:50%;}.speak-btn{color:inherit;}.glass{background:var(--bg-glass);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:0.5px solid var(--border-color);}.glass-strong{background:var(--bg-glass-strong);backdrop-filter:blur(40px) saturate(180%);-webkit-backdrop-filter:blur(40px) saturate(180%);border:0.5px solid var(--border-color);}.hidden{display:none !important;}.invisible{visibility:hidden;}.flash{animation:flash 0.2s ease-out;}@keyframes flash{0%{opacity:1;}50%{opacity:0.5;}100%{opacity:1;}}.game-ready .status-value{color:var(--text-muted);}.game-playing .status-value{color:var(--accent-success);}.game-paused .status-value{color:var(--accent-warning);}.game-over .status-value{color:var(--accent-error);}.grid-2x2{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-md);}.grid-3x3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-md);}.grid-4x4{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--spacing-md);}:focus-visible{outline:3px solid var(--tts-focus);outline-offset:3px;z-index:10;border-radius:4px;}@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;}}.tts-active{background:var(--tts-word);color:var(--tts-word-text);box-shadow:0 0 0 2px var(--tts-word);border-radius:4px;}@keyframes slideUp{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}@keyframes scaleIn{from{opacity:0;transform:scale(0.95);}to{opacity:1;transform:scale(1);}}@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}.animate-slide-up{animation:slideUp 0.4s var(--ease) forwards;}.animate-scale-in{animation:scaleIn 0.3s var(--ease) forwards;}.animate-fade-in{animation:fadeIn 0.3s var(--ease) forwards;}@keyframes celebrate{0%,100%{transform:scale(1);}50%{transform:scale(1.08) rotate(2deg);}}.celebrate{animation:celebrate 0.5s var(--ease-spring);}.progress-bar{height:10px;background:var(--bg-accent);border-radius:var(--radius-pill);overflow:hidden;}.progress-fill{height:100%;background:linear-gradient(90deg,var(--app-accent),var(--accent-info));transition:width 0.3s var(--ease);}body[data-cat="spiele"]{--app-accent:var(--cat-spiele);--app-accent-soft:var(--cat-spiele-soft);}body[data-cat="musik"]{--app-accent:var(--cat-musik);--app-accent-soft:var(--cat-musik-soft);}body[data-cat="kunst"]{--app-accent:var(--cat-kunst);--app-accent-soft:var(--cat-kunst-soft);}body[data-cat="lernen"]{--app-accent:var(--cat-lernen);--app-accent-soft:var(--cat-lernen-soft);}body[data-cat="entspannung"]{--app-accent:var(--cat-entspannung);--app-accent-soft:var(--cat-entspannung-soft);}body[data-cat="sozial"]{--app-accent:var(--cat-sozial);--app-accent-soft:var(--cat-sozial-soft);}body[data-cat]{--accent-secondary:var(--app-accent);}body[data-cat="spiele"] .game-container{background:linear-gradient(180deg,var(--cat-spiele-soft) 0%,var(--bg-primary) 40%);}body[data-cat="musik"] .game-container{background:linear-gradient(180deg,var(--cat-musik-soft) 0%,var(--bg-primary) 40%);}body[data-cat="kunst"] .game-container{background:linear-gradient(180deg,var(--cat-kunst-soft) 0%,var(--bg-primary) 40%);}body[data-cat="lernen"] .game-container{background:linear-gradient(180deg,var(--cat-lernen-soft) 0%,var(--bg-primary) 40%);}body[data-cat="entspannung"] .game-container{background:linear-gradient(180deg,var(--cat-entspannung-soft) 0%,var(--bg-primary) 40%);}body[data-cat="sozial"] .game-container{background:linear-gradient(180deg,var(--cat-sozial-soft) 0%,var(--bg-primary) 40%);}@media (min-aspect-ratio:4/3) and (min-height:500px){.game-container{gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-lg);}.status-bar{padding:var(--spacing-sm) var(--spacing-md);margin-bottom:0;}.status-label{font-size:0.65rem;}.status-value{font-size:1.05rem;}}img.lb{width:1.15em;height:1.15em;object-fit:contain;vertical-align:middle;}#prompt img.lb,#word-emoji img.lb,#item-emoji img.lb,#picture img.lb,#word-display img.lb,#quiz-emoji img.lb,#letter-emoji img.lb,#word-picture img.lb,#picture-name img.lb,#vocab-display img.lb,.word-display img.lb,.picture img.lb,.prompt img.lb,.quiz-image img.lb,.word-emoji img.lb,.item-display img.lb,.display-emoji img.lb{width:auto;height:clamp(88px,16vmin,170px);max-width:92%;}.answer-btn img.lb,.choice-btn img.lb,.option img.lb,.answer img.lb,img.lb.answer-emoji,.answer-emoji img.lb{width:auto;height:clamp(40px,6vmin,72px);}