@font-face{font-family:Salon;src:url("assets/Abcursiva.ttf") format("truetype");font-display:swap}*{box-sizing:border-box}body{margin:0;background:#f7f3e9;color:#173d40;font-family:system-ui,sans-serif;min-height:100svh;padding:22px 14px}main{max-width:760px;margin:auto;text-align:center;background:#fffefa;border:1px solid #e7e2d4;border-radius:28px;padding:28px;box-shadow:0 15px 45px #284d4310}header{display:flex;justify-content:space-between;align-items:center;gap:10px}.badge{font-size:12px;font-weight:800;letter-spacing:2px;color:#226d68}h1{font-size:clamp(30px,6vw,44px);margin:20px 0 8px;letter-spacing:-1.5px}h2{font-size:25px}.intro{margin:0 auto 22px;max-width:440px;line-height:1.5}button{font:inherit;cursor:pointer;border:0;touch-action:manipulation}button:focus-visible{outline:4px solid #d08b21;outline-offset:4px}.small{background:#e8f2ef;border-radius:30px;padding:11px 17px;color:#174e4b;font-weight:650}.primary{background:#226d68;color:white;border-radius:16px;padding:16px 30px;font-weight:750;min-width:180px}.welcome-art{font-size:80px;color:#e4a849;margin:20px}#welcome,#finish{padding:20px 0 35px}#welcome p,#finish p{line-height:1.6}.progress-row{display:flex;justify-content:space-between;font-size:14px;font-weight:650}#stars{color:#ae7214}progress{width:100%;height:9px;accent-color:#226d68;margin:12px 0 8px}#picture{width:min(270px,67vw);aspect-ratio:1;margin:8px auto 12px;background-size:contain;background-repeat:no-repeat;border-radius:20px}#choices{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:24px 0 0}.choice,.cursive{font-family:Salon,cursive}.choice{font-size:clamp(35px,6.5vw,49px);background:white;border:2px solid #c9dcd5;border-radius:18px;padding:13px 8px 17px;color:#173d40;min-height:90px}.choice:hover:not(:disabled){background:#eef6f1;border-color:#226d68}.choice.correct{background:#e0f3d8;border-color:#549640;color:#235923}.choice.wrong{background:#fff0e9;border-color:#bd765f;animation:shake .25s}.choice:disabled{cursor:default}.cursive{font-size:55px}#feedback{min-height:25px;font-weight:650;margin:18px 0}footer{margin-top:28px;color:#637b76;font-size:12px}#confetti{position:fixed;inset:0;pointer-events:none;overflow:hidden}#confetti i{position:absolute;top:-20px;width:10px;height:16px;animation:fall 1.7s ease-in forwards}@keyframes fall{to{transform:translateY(105vh) rotate(650deg)}}@keyframes shake{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}[hidden]{display:none!important}@media(max-width:480px){body{padding:10px}main{padding:20px 14px;border-radius:22px}.badge{font-size:10px;letter-spacing:1px}.small{font-size:13px;padding:10px 12px}#choices{gap:7px}.choice{padding:13px 3px;font-size:37px}#picture{width:220px}h1{margin-top:18px}.intro{font-size:15px}}@media(prefers-reduced-motion:reduce){*{animation:none!important}}
@media(max-width:480px){.choice.long{font-size:29px}}