:root{--color-primary: #002fff;--color-shade: #6d5277;--color-text: #374151;--color-success: #98e337;--color-success-stroke: #718a3ae7;--color-fail: #f1755c;--color-fail-stroke: #8a3a3ad0;--color-paper: #fedaad;--color-warn: #ffe480;--color-warn-stroke: #e1af53;--font-primary: "Nunito", sans-serif;--font-secondary: "Lilita One", sans-serif}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(to bottom,#e9f4ff,#fff8e6);color:var(--color-text);font-size:1.5rem;font-weight:600}#root{min-height:100vh;min-height:100dvh;display:flex;justify-content:center;align-items:center}.app-container{border:1px solid #33333319;border-radius:1rem;position:relative;flex:1;width:100%;overflow:auto;max-width:400px;margin:0 auto;height:800px;max-height:100vh;max-height:100dvh;background:linear-gradient(to bottom,#e9f4ff,#fff8e6)}button{align-items:center;background-color:var(--color-primary);border-radius:9999px;border:3px solid white;box-shadow:0 4px 8px #0003;text-shadow:0 1px 2px rgba(0,0,0,.4);color:#fff;cursor:pointer;display:flex;font-family:inherit;font-size:1rem;font-weight:900;gap:.4rem;justify-content:center;padding:.45rem 1rem;text-align:center;transform:scale(1);transition:all .4s;width:100%;position:relative}button.secondary{background-color:#fff;color:var(--color-primary);border-color:var(--color-primary);font-size:.8rem}button:before{content:"";position:absolute;top:0;left:0;right:0;height:60%;background:radial-gradient(ellipse 80% 100% at 50% 0%,rgba(255,255,255,.2) 90%,transparent 100%);border-radius:9999px 9999px 0 0;pointer-events:none}button:hover{background:linear-gradient(135deg,#5a67d8,#6b46c1);transform:scale(1.05);box-shadow:0 6px 12px #00000040}button.secondary:hover{background:#fff9d4}button:active{background:linear-gradient(135deg,#4c51bf,#5b21b6);transform:scale(.98);box-shadow:0 2px 4px #0000004d;transition:all .1s ease}.stack{display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;gap:1rem}.stack.horizontal{flex-direction:row}.shaded{box-shadow:2px 2px 0 var(--color-shade)}.shaded.big{box-shadow:6px 6px 0 var(--color-shade)}a.shaded.big:active{transform:translate(6px,6px)}a.shaded.big:hover{box-shadow:10px 10px 0 var(--color-shade);translate:-4px -4px}a.shaded.big:active{box-shadow:4px 4px 0 var(--color-primary)}.screen{height:100%;padding:3rem 1.5rem}h1{font-size:1.6rem;font-weight:900}h2{font-size:1.7rem;font-weight:900}h3{font-size:1.25rem}.score-box{background:#fff;border-radius:15px;padding:1rem 1.5rem;margin-bottom:2rem;display:flex;justify-content:space-between;align-items:center}@media screen and (max-width: 768px){.app-container{height:100vh;height:100dvh;max-height:none;border-radius:0;border:none}body{font-size:1.25rem}.screen{padding-top:2rem;padding-bottom:2rem}}.app-promotion-container{display:flex;padding:0;flex-direction:column;height:100%;overflow:hidden}.promotion-header{flex:1;position:relative;display:flex;flex-direction:column;align-items:center}.promo-image{width:100%;height:100%;object-fit:cover}.gradient-overlay{position:absolute;bottom:0;left:0;right:0;height:160px;background:linear-gradient(to top,white 0%,transparent 100%);pointer-events:none}.promotion-content{background:#fff;padding:2rem 1.5rem;display:flex;flex-direction:column;gap:1rem;font-size:1rem;text-align:center}.promotion-buttons{display:flex;flex-direction:column;gap:1rem;margin-top:1rem}@media (max-width: 480px){.promotion-content{padding:1.5rem 1rem}}.game-complete-container{background:linear-gradient(135deg,#f8fafc,#f1f5f9);display:flex;flex-direction:column;align-items:center;justify-content:center;background-size:cover;background-position:50%;background-repeat:no-repeat}.game-complete-tag-line{font-weight:900;padding:1rem 1.5rem;border-radius:2rem;margin-bottom:2rem}.fade-out{animation:fadeOut .8s ease-in-out forwards}.fade-in{animation:fadeIn .8s ease-in-out forwards}@keyframes fadeOut{0%{opacity:1;transform:scale(1) rotate(-15deg)}50%{opacity:.5;transform:scale(.95) rotate(-15deg)}to{opacity:0;transform:scale(.9) rotate(-15deg)}}@keyframes fadeIn{0%{opacity:0;transform:scale(.9) rotate(-15deg)}50%{opacity:.5;transform:scale(.95) rotate(-15deg)}to{opacity:1;transform:scale(1) rotate(-15deg)}}.correct-stamp{z-index:11}.hidden{display:none}.stamp-item{text-align:center;position:relative}.stamp-item.static{pointer-events:none}.stamp-button{background-color:transparent;color:#fff;font-weight:900;width:4rem;height:4rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1rem;margin-bottom:.5rem;border-width:3px;border-style:solid;cursor:pointer;transition:all .2s;position:relative}.stamp-button:hover{transform:scale(1.05)}.stamp-button:disabled{opacity:.5;cursor:not-allowed;transform:scale(1)}.stamp-button:disabled:hover{transform:scale(1)}.keyboard-hint{position:absolute;top:-.5rem;right:-.5rem;background-color:#000c;color:#fff;font-size:.75rem;font-weight:700;padding:.25rem .5rem;border-radius:.5rem;opacity:0;transform:scale(.8);transition:all .2s ease;pointer-events:none;z-index:10}@media (hover: hover) and (pointer: fine){.stamp-button:hover .keyboard-hint{opacity:1;transform:scale(1)}}.stamp-der{color:#3b82f6}.stamp-der:hover{color:#2563eb}.stamp-die{color:#8b5cf6}.stamp-die:hover{color:#7c3aed}.stamp-das{color:#eab308}.stamp-das:hover{color:#ca8a04}.stamp-text{font-size:1.25rem}.level-indicator{text-align:center;font-size:1.2rem;font-weight:900;margin-bottom:1rem}.lives{display:flex;gap:.5rem;align-items:center;overflow:visible}.life{display:flex;align-items:center;justify-content:center;transition:all .3s ease}.life-active{opacity:1;transform:scale(1)}.life-inactive{opacity:0;transform:scale(.8)}.losing-heart{animation:heartLoss .6s ease-out forwards}@keyframes heartLoss{0%{transform:scale(1);opacity:1}50%{transform:scale(1.2) rotate(10deg);opacity:.8}to{transform:scale(.8) rotate(-10deg);opacity:0}}.stamps-container{display:flex;justify-content:center;gap:1rem}.feedback-wrapper{position:fixed;top:0;left:0;width:100vw;height:100vh;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:1000}.feedback-container{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;transform-origin:center;transition:transform .3s ease-out;pointer-events:none}.feedback-enter{animation:feedbackScaleIn .3s ease-out forwards}.feedback-exit{animation:feedbackScaleOut .3s ease-out forwards}@keyframes feedbackScaleIn{0%{transform:scale(0);opacity:0}50%{transform:scale(1.1);opacity:.8}to{transform:scale(1);opacity:1}}@keyframes feedbackScaleOut{0%{transform:scale(1);opacity:1}50%{transform:scale(1.1);opacity:.5}to{transform:scale(0);opacity:0}}.feedback-message{--stroke-width: 2px;--stroke-width-negative: calc(var(--stroke-width) * -1);font-size:3rem;font-weight:200;font-family:var(--font-secondary);text-shadow:var(--stroke-width-negative) var(--stroke-width-negative) 0 var(--stroke-color),var(--stroke-width-negative) var(--stroke-width) 0 var(--stroke-color),var(--stroke-width) var(--stroke-width-negative) 0 var(--stroke-color),var(--stroke-width) var(--stroke-width) 0 var(--stroke-color);margin-bottom:.5rem;text-transform:uppercase}.feedback-icon{font-size:2.25rem}.feedback-correct{--stroke-color: var(--color-success-stroke);color:var(--color-success)}.feedback-incorrect{--stroke-color: var(--color-fail-stroke)}.feedback-incorrect .feedback-message{background-color:var(--color-fail);color:var(--color-paper);padding:.5rem 1rem;border-radius:1.6rem;border:5px solid var(--stroke-color)}.card-container{position:relative}.card{width:200px;height:250px}.card-stack{position:absolute;width:100%;height:100%;transform:rotate(5deg);transform-origin:bottom right;background-color:#000;border-radius:1.5rem}.card-stack .card-image{opacity:.95;margin-top:-1px;margin-left:1px}.main-card{position:relative;border-radius:2rem;box-shadow:0 10px 15px -3px #0000001a;text-align:center}.card-content{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;padding:2rem;align-items:center;justify-content:center;flex-direction:column}.card-image{width:200px;object-fit:contain}.article-stamp-spacer{height:100px}.noun-text{font-size:2.6rem;font-weight:800;color:#1f2937;margin-bottom:1rem;max-width:calc(100% + 2rem);margin-left:-1rem;margin-right:-1rem}.noun-text.long{font-size:1.6rem}.translation{font-size:1.125rem;color:#6b7280}.article-stamp{position:absolute;top:1rem;left:1rem;width:6rem;height:6rem}.article-stamp-image{width:6rem;height:6rem;object-fit:contain;position:absolute;top:0;left:0;z-index:10;transform:scale(1) rotate(-15deg);transition:all .6s}.article-stamp-image.stamp-animation{transition:all .6s;animation:stampPress .6s}@keyframes stampPress{0%{transform:scale(1.5) rotate(-20deg);opacity:.8}50%{transform:scale(.8);opacity:1}to{transform:scale(1) rotate(-15deg);opacity:1}}.shockwave{position:absolute;top:50%;left:50%;width:3rem;height:3rem;border-radius:9999px;border:4px solid rgba(148,138,80,.748);transform:translate(-50%,-50%) scale(.1);opacity:0;pointer-events:none;z-index:5}.is-stamping .shockwave-1{animation:shockwave .4s ease-out .1s both}.is-stamping .shockwave-2{animation:shockwave .4s ease-out 4s00ms both}@keyframes shockwave{0%{opacity:.8;transform:translate(-50%,-50%) scale(.1)}50%{opacity:.4}to{opacity:0;transform:translate(-50%,-50%) scale(3)}}.game-container{height:100%;display:flex;flex-direction:column;padding-left:1rem;padding-right:1rem;padding-top:1rem}.top-bar{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem}.progress-text{font-size:1.5rem;font-weight:900;color:#374151;margin-left:-30px}.progress-bar{width:6rem;height:1rem;background-color:#d1d5db;border-radius:9999px;overflow:hidden;border:2px solid white;box-shadow:4px 3px 1px #000000b3}.progress-fill{height:100%;background-color:#22c55e;transition:all .3s}.game-area{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center}.stamps-container{margin-bottom:3rem;justify-content:space-around}.instructions-container{position:absolute;inset:0;min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:space-between;background-color:#000c;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);color:#fff}.instructions-card{max-width:28rem;width:100%;display:flex;flex-direction:column;align-items:center}.instructions-title{font-size:1.5rem;font-weight:700;text-align:center;margin-bottom:1.5rem;color:#fff}.stamps-example{display:flex;margin-top:1.5rem;margin-bottom:1.5rem}.stamp-item{text-align:center}.stamp-button{border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:.875rem;margin-top:1rem;border:none}.instructions-text{text-align:center;color:#fff;margin-bottom:2rem;font-weight:700;max-width:260px}.mistake-review-container{position:absolute;inset:0;min-height:100%;display:flex;align-items:center;justify-content:center;background-color:#000c;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:1000}.mistake-review-overlay{height:100%;padding:1rem;justify-content:space-between}.redo-icon{display:flex;flex-grow:2;align-items:center;justify-content:center}.redo-arrow{color:#38b2ac;font-size:4rem;font-weight:300;z-index:1;top:-4px;position:relative}.redo-button{max-width:70%}.mistake-review-question{flex-grow:1;color:#fff;text-align:center;margin:0;justify-content:center}.mistake-review-buttons{display:flex;flex-direction:column;gap:1rem;width:100%}.intro-container{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;position:relative;overflow:hidden;background-image:url(/images/intro-bg.png);background-size:cover;background-position:center;background-repeat:no-repeat}.karl-description{text-align:justify;font-weight:800;max-width:28rem;margin-bottom:2rem}.play-button{position:relative;z-index:10}.confetti-container{position:fixed;top:0;left:0;width:100vw;height:100vh;pointer-events:none;z-index:1;overflow:hidden}.confetti{position:absolute;width:8px;height:8px;animation:confettiFall 4s linear infinite}.confetti-0{background:#f97316;left:10%;animation-delay:0s}.confetti-1{background:#10b981;left:40%;animation-delay:.5s}.confetti-2{background:#ef4444;left:60%;animation-delay:1s}.confetti-3{background:#fbbf24;left:90%;animation-delay:1.5s}@keyframes confettiFall{0%{transform:translateY(-100px) rotate(0);opacity:1}to{transform:translateY(100vh) rotate(720deg);opacity:0}}.help-button{position:absolute;top:1rem;right:1rem;z-index:1000;text-decoration:none;color:var(--color-primary);font-size:.9rem;font-weight:900;background-color:#ffffffba;border-radius:100px;border:2px solid var(--color-primary);width:20px;height:20px;text-align:center;line-height:1rem;transition:all .3s}.help-button:hover{background-color:#ffffffe6}#help-button{font-size:.8rem;padding-left:.8rem;padding-right:.8rem;color:var(--color-text);background-color:#fff;opacity:1;border-radius:.5rem;box-shadow:0 0 10px #0000004d;z-index:9000}#help-button a{color:var(--color-text)}.score-box{background:#fff;border-radius:15px;padding:1.5rem;margin-bottom:2rem;display:flex;justify-content:space-between;align-items:center}.score-label{font-size:1.5rem;font-weight:700}.score-value{font-size:1.5rem;font-weight:1000}.level-complete-container{display:flex;flex-direction:column;align-items:center;justify-content:center}.level-complete-content{padding-left:2rem;padding-right:2rem;padding-bottom:2rem;text-align:center;max-width:400px;width:90%;position:relative;z-index:10;height:100%}.buttons{margin-left:-2rem;margin-right:-2rem;width:calc(100% + 4rem)}.level-complete-feedback{color:var(--color-warn);max-width:80%;margin-bottom:-1.5rem}.collectible-section{margin-bottom:2.5rem;color:var(--color-shade)}.collectible-name{font-size:3rem;font-weight:900;margin-bottom:1.5rem;text-shadow:0 2px 4px rgba(0,0,0,.1);line-height:1.2;margin-left:-2rem;margin-right:-2rem}.collectible-image-container{position:relative;display:flex;justify-content:center;align-items:center}.collectible-image{max-width:80%;animation:float 3s ease-in-out infinite;filter:drop-shadow(0 4px 8px rgba(0,0,0,.2))}.sparkle{position:absolute;font-size:1.5rem;animation:sparkle 2s ease-in-out infinite}.sparkle-1{top:-10px;right:20px;animation-delay:0s}.sparkle-2{bottom:-10px;left:20px;animation-delay:.7s}.sparkle-3{top:50%;right:-15px;animation-delay:1.4s}.collectible-description{font-weight:700}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes sparkle{0%,to{opacity:.3;transform:scale(.8)}50%{opacity:1;transform:scale(1.2)}}.level-selection-container{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:2rem 1.5rem;height:100%;overflow-y:auto}.karl-avatar{width:100px;height:100px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:1rem}.karl-placeholder{font-size:2rem}.level-subtitle{font-size:1.1rem;color:#666;text-align:center;margin-bottom:2.5rem;line-height:1.4}.level-options{display:flex;flex-direction:column;gap:1rem;width:100%;max-width:400px}.level-option{display:flex;align-items:center;gap:1rem;padding:.5rem 1rem;background:#fff;border:2px solid var(--color-shade);border-radius:16px;cursor:pointer;transition:all .2s ease;text-align:left;width:100%}.level-option:hover{border-color:#667eea;transform:translateY(-2px)}.level-option:active{transform:translateY(0)}.level-emoji{font-size:2rem;flex-shrink:0}.level-content{display:flex;flex-direction:column;flex:1}.level-label{font-weight:800;line-height:1;color:#1a1a1a}.level-description{font-size:.95rem;color:#666}@media (max-width: 480px){.level-selection-container{padding:1.5rem 1rem}.karl-avatar{width:100px;height:100px}.karl-placeholder{font-size:3rem}.level-question{font-size:1.75rem}.level-subtitle{font-size:1rem}.level-option{padding:1rem 1.25rem}.level-emoji{font-size:1.75rem}}.mistake-review-game-container{display:flex;flex-direction:column;background:linear-gradient(135deg,#667eea,#764ba2);gap:1rem}.mistake-review-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 0}.mistake-review-title{color:#fff;text-align:center;width:100%}.mistake-review-progress{color:#fff;font-size:1.125rem;font-weight:600;background:#fff3;padding:.5rem 1rem;border-radius:20px}.mistake-review-game-area{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem}.mistake-review-game-area .feedback-wrapper{background:transparent;bottom:0}@media (max-width: 480px){.mistake-review-game-container{padding:.75rem}.mistake-review-title{font-size:1.25rem}.mistake-review-progress{font-size:1rem;padding:.375rem .75rem}}.reward-collected-container{background:linear-gradient(135deg,#f8fafc,#f1f5f9);display:flex;flex-direction:column;align-items:center;justify-content:center;background-size:cover;background-position:50%;background-repeat:no-repeat}.reward-collected-content{display:flex;flex-direction:column;justify-content:space-between;text-align:center;width:90%;height:100%;z-index:10}.rewarded-image{max-width:100%}.reward-text{font-weight:800;background-color:#fee79f;padding:1rem 1.5rem;border-radius:2rem;margin-bottom:2rem}.try-again-container{text-align:center;justify-content:space-between}.try-again-header{width:100%}.try-again-feedback{color:var(--color-fail);max-width:60%;margin-bottom:-1.5rem}.karl-image{max-width:100%}.encouragement-text{max-width:28rem;margin-bottom:2rem;font-weight:900}.hint{max-width:28rem;margin-bottom:2rem;font-weight:400;font-size:.875rem}
