:root{color-scheme:dark;--bg:#101323;--panel:#191d32;--panel2:#222842;--ink:#f7f7ff;--muted:#b9bfd5;--cyan:#5de3d0;--pink:#ff6e9d;--gold:#ffd166;--good:#68e6a4;--bad:#ff7284;--line:#343b59;--radius:24px}*{box-sizing:border-box}html{min-height:100%;background:var(--bg)}body{margin:0;min-height:100vh;color:var(--ink);font-family:system-ui,vazirmatn,Tahoma,sans-serif;background:radial-gradient(ellipse at 14% 0%,#27345b 0,transparent 43%),radial-gradient(ellipse at 100% 55%,#392346 0,transparent 38%),var(--bg)}button{font:inherit;color:inherit}button:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.shell{width:min(100%,760px);margin:auto;padding:clamp(14px,4vw,32px);min-height:100vh;display:flex;flex-direction:column}.topline{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}.brand{display:flex;align-items:center;gap:10px;font-weight:900;letter-spacing:-.03em}.brand-mark{width:42px;height:42px;display:grid;place-items:center;border-radius:14px;background:linear-gradient(145deg,var(--cyan),#47a9ff);font-size:24px;box-shadow:0 8px 28px #5de3d044}.icon-btn,.quiet-btn{border:1px solid var(--line);background:#ffffff0a;border-radius:14px;padding:10px 13px;cursor:pointer;transition:.2s}.icon-btn:hover,.quiet-btn:hover{background:#ffffff18;transform:translateY(-1px)}.hero{position:relative;overflow:hidden;border-radius:28px;padding:26px;background:linear-gradient(120deg,#252b49ed,#1b2039ed),url(assets/cover.webp)50% 45%/cover;border:1px solid #ffffff17;box-shadow:0 18px 50px #05071170}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#171a2bea 0%,#171a2bc9 55%,#171a2b55)}.hero-content{position:relative;max-width:490px}.eyebrow{color:var(--cyan);font-size:.88rem;font-weight:800;margin:0 0 8px}.hero h1{font-size:clamp(1.9rem,7vw,3.2rem);line-height:1.2;margin:0 0 10px;letter-spacing:-.04em}.hero p{color:#d6dbef;line-height:1.9;margin:0 0 19px}.primary{border:0;border-radius:15px;padding:13px 22px;background:linear-gradient(110deg,#57e0cc,#65a9ff);color:#11172b;font-weight:900;cursor:pointer;box-shadow:0 10px 25px #48cbbb35;transition:.2s}.primary:hover{transform:translateY(-2px);filter:brightness(1.08)}.section-title{margin:23px 2px 12px;font-size:1.06rem}.modes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.mode-card{min-height:92px;text-align:right;border:1px solid var(--line);background:linear-gradient(145deg,#202640,#191d32);padding:14px;border-radius:18px;cursor:pointer;transition:.2s}.mode-card:hover{border-color:var(--cyan);transform:translateY(-2px);background:#252c48}.mode-card strong{display:block;font-size:1rem;margin-bottom:4px}.mode-card span{color:var(--muted);font-size:.83rem}.mode-emoji{font-size:1.4rem;float:left}.tip{color:var(--muted);font-size:.84rem;line-height:1.8;margin:16px 3px}.game-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:3px 0 13px}.progress-wrap{flex:1}.progress-label{display:flex;justify-content:space-between;color:var(--muted);font-size:.84rem;margin-bottom:7px}.progress{height:9px;border-radius:99px;background:#ffffff14;overflow:hidden}.progress>span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--cyan),#66a6ff);border-radius:inherit;transition:width .35s}.score-pill{white-space:nowrap;border:1px solid #ffd16650;color:var(--gold);background:#ffd16612;border-radius:14px;padding:9px 12px;font-weight:800}.quiz-card{flex:1;min-height:430px;display:flex;flex-direction:column;align-items:center;text-align:center;border:1px solid #ffffff16;border-radius:27px;background:linear-gradient(145deg,#1c2138ed,#171b2fed);padding:clamp(17px,4vw,28px);box-shadow:0 16px 45px #07091470}.prompt{font-size:1.05rem;font-weight:800;margin:1px 0 12px}.animal-frame{width:min(100%,300px);aspect-ratio:1;display:grid;place-items:center;border-radius:24px;background:radial-gradient(circle,#2f3856,#20263d 70%);border:1px solid #ffffff17;overflow:hidden}.animal-canvas{width:100%;height:100%;display:block}.choices{width:100%;max-width:520px;margin-top:17px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.choice{min-height:54px;padding:10px 8px;border:1px solid #ffffff1b;border-radius:15px;background:#ffffff08;font-weight:750;cursor:pointer;transition:transform .17s,background .17s,border-color .17s}.choice:hover:not(:disabled){transform:translateY(-2px);border-color:#5de3d099;background:#5de3d014}.choice.correct{background:#68e6a425;border-color:var(--good);color:#a7ffd0}.choice.wrong{background:#ff728425;border-color:var(--bad);color:#ffb3bd}.choice:disabled{cursor:default}.feedback{height:27px;margin:12px 0 0;font-weight:800}.feedback.good{color:var(--good)}.feedback.bad{color:var(--bad)}.bottom-actions{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:12px}.overlay{position:fixed;inset:0;z-index:5;display:grid;place-items:center;background:#080a14c9;padding:20px;backdrop-filter:blur(8px)}.dialog{width:min(100%,430px);text-align:center;border:1px solid #ffffff24;border-radius:26px;background:#1c2138;padding:27px;box-shadow:0 24px 80px #0009}.dialog .big{font-size:3.4rem}.dialog h2{margin:4px 0 9px}.dialog p{color:var(--muted);line-height:1.8}.dialog-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.result-score{font-size:2.1rem;font-weight:950;color:var(--gold);margin:10px}.loading{color:var(--muted);padding:30px;text-align:center}.hidden{display:none!important}@media(min-width:640px){.hero{padding:34px}.quiz-card{min-height:510px}.animal-frame{width:min(100%,340px)}}@media(max-width:360px){.shell{padding:12px}.mode-card{padding:11px}.choice{font-size:.9rem}.score-pill{padding:8px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}