:root{--purple:#6b50e6;--ink:#253053;--muted:#6f7895;--cream:#fbf8f0;--white:#fff;--shadow:0 14px 38px rgba(45,42,89,.12)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:Nunito,sans-serif;padding-bottom:86px;overflow-x:hidden}button,input{font:inherit}button{cursor:pointer}.topbar{height:72px;max-width:1180px;margin:auto;padding:0 20px;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:5}.brand{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;font-family:"Baloo 2";font-size:22px;font-weight:800}.brand-mark{width:42px;height:42px;border-radius:15px 15px 18px 18px;background:var(--purple);color:#fff;display:grid;place-items:center;transform:rotate(-5deg);box-shadow:0 6px 0 #5037c1}.top-actions{display:flex;gap:10px;align-items:center}.pill,.avatar-btn{border:0;background:#fff;box-shadow:0 4px 16px #403e6814}.pill{padding:9px 14px;border-radius:99px;color:var(--ink)}.avatar-btn{width:44px;height:44px;border-radius:50%;font-size:20px;border:3px solid #fff;background:#dff5ff}main{max-width:1180px;margin:auto;padding:0 18px}.hero{min-height:350px;border-radius:34px;background:linear-gradient(125deg,#765be9 0%,#7563e9 52%,#9f86f5 100%);display:grid;grid-template-columns:1.05fr .95fr;overflow:hidden;position:relative;color:#fff;padding:46px 54px;box-shadow:0 18px 50px #6550c52b}.hero:before{content:"";position:absolute;inset:0;background-image:radial-gradient(#ffffff31 1.5px,transparent 1.5px);background-size:22px 22px;mask-image:linear-gradient(90deg,#000,transparent)}.hero-copy{z-index:2;align-self:center}.eyebrow{display:block;font-size:12px;font-weight:900;letter-spacing:1.6px;opacity:.78}.hero h1{font-family:"Baloo 2";font-size:42px;line-height:1;margin:9px 0 12px}.hero p{font-size:16px;line-height:1.6;max-width:500px;margin:0 0 22px;color:#f0edff}.daily-card{display:flex;align-items:center;gap:12px;background:#ffffff19;border:1px solid #ffffff35;padding:12px 14px;border-radius:18px;max-width:360px;backdrop-filter:blur(8px)}.daily-icon{width:44px;height:44px;border-radius:14px;background:#fff;color:#222;display:grid;place-items:center;font-size:23px}.daily-card div:nth-child(2){display:flex;flex-direction:column;flex:1}.daily-card small{font-size:9px;font-weight:900;letter-spacing:1px}.daily-card strong{font-size:15px}.progress-ring{width:46px;height:46px;border-radius:50%;border:5px solid #ffffff48;border-top-color:#ffd85c;display:grid;place-items:center;font-size:10px;font-weight:900}.hero-world{position:relative}.sun{position:absolute;right:15%;top:2%;font-size:50px;color:#ffd84f;filter:drop-shadow(0 0 20px #fff28a)}.cloud{position:absolute;width:90px;height:27px;border-radius:50px;background:#ffffffa8}.cloud:before,.cloud:after{content:"";position:absolute;background:inherit;border-radius:50%;width:38px;height:38px;top:-17px;left:15px}.cloud:after{width:49px;height:49px;left:39px;top:-26px}.cloud-a{top:30%;left:4%;transform:scale(.6)}.cloud-b{right:0;top:19%;transform:scale(.45)}.island{width:310px;height:100px;background:#64bd67;border-radius:50%;position:absolute;right:3%;bottom:30px;box-shadow:inset 0 -25px #5a974c,0 27px 0 -8px #956d48,0 38px 0 -12px #73543d;transform:rotate(-2deg)}.island span{position:absolute;font-size:65px;filter:drop-shadow(0 8px 6px #34476842)}.tree{left:22px;top:-53px}.house{right:56px;top:-50px}.character{left:135px;top:-30px;font-size:53px!important}.learning-section{padding:45px 4px}.section-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:18px}.section-heading h2,.reward-banner h2,.modal h2{font-family:"Baloo 2";font-size:30px;line-height:1;margin:5px 0}.section-heading .eyebrow{color:var(--purple)}.text-btn{border:0;background:transparent;color:var(--purple);font-weight:900}.game-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.game-card{border:1px solid #ece8df;background:#fff;border-radius:23px;padding:18px;display:grid;grid-template-columns:62px 1fr auto;grid-template-rows:auto auto;gap:3px 14px;text-align:left;position:relative;min-height:120px;box-shadow:0 5px 16px rgba(43,46,75,.05);transition:.2s}.game-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:color-mix(in srgb,var(--accent),white 68%)}.game-icon{grid-row:1/3;width:62px;height:62px;border-radius:19px;background:color-mix(in srgb,var(--accent),white 82%);color:var(--accent);display:grid;place-items:center;font-family:"Baloo 2";font-size:22px;font-weight:900}.game-info{display:flex;flex-direction:column;align-self:center}.game-info strong{font-family:"Baloo 2";font-size:18px;line-height:1.1}.game-info small{color:var(--muted);font-size:11px;margin-top:4px}.card-stars{color:#ffc53d;font-size:14px;letter-spacing:1px}.play-arrow{grid-column:3;grid-row:1/3;align-self:center;width:30px;height:30px;border-radius:50%;background:#f5f3f0;display:grid;place-items:center;font-size:25px;color:var(--accent)}.level-number{position:absolute;right:12px;top:9px;font-size:9px;font-weight:900;color:#a2a5b3}.reward-banner{display:grid;grid-template-columns:130px 1fr 230px;align-items:center;gap:25px;border-radius:28px;background:#fff1ca;padding:26px 40px;margin:0 4px 40px;overflow:hidden}.reward-art{font-size:76px;text-align:center;filter:drop-shadow(0 9px 8px #b8732840)}.reward-banner .eyebrow{color:#a46d00}.reward-banner p{margin:0;color:#826c43}.reward-progress strong{display:block;text-align:right;color:#ad7401}.reward-progress div{height:12px;background:#e9d9a9;border-radius:20px;overflow:hidden;margin-top:7px}.reward-progress i{display:block;width:0;height:100%;background:linear-gradient(90deg,#ffbc2c,#ff8a31);border-radius:inherit;transition:.4s}.mobile-nav{position:fixed;z-index:20;bottom:0;left:0;right:0;height:74px;background:#fff;border-top:1px solid #eee9df;display:none;justify-content:space-around;padding-bottom:env(safe-area-inset-bottom)}.mobile-nav button{border:0;background:none;color:#9297aa;font-size:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}.mobile-nav span{font-size:9px;font-weight:800}.mobile-nav .active{color:var(--purple)}.modal{position:fixed;inset:0;z-index:50;background:#24203d9c;display:none;place-items:center;padding:14px;backdrop-filter:blur(5px)}.modal.open{display:grid}.modal-card{background:#fff;border-radius:28px;width:min(94vw,680px);max-height:92vh;overflow:auto;padding:32px;position:relative;box-shadow:0 30px 80px #19162d66}.close-btn{position:absolute;right:16px;top:14px;border:0;background:#f1eff6;color:#6d7180;width:35px;height:35px;border-radius:50%;font-size:24px}.game-modal-card{width:min(95vw,820px);min-height:500px}.gate-card{text-align:center;max-width:420px}.big-icon{display:block;font-size:45px}.gate-card p{color:var(--muted)}.gate-question{display:flex;align-items:center;justify-content:center;gap:15px;margin:22px}.gate-question strong{font-size:24px}.gate-question input{width:85px;border:2px solid #ded9ee;border-radius:13px;padding:10px;text-align:center;font-size:20px;outline:0}.primary-btn{border:0;border-radius:14px;background:var(--purple);color:#fff;padding:13px 28px;font-weight:900}.error{display:block;color:#e74a5c;height:18px;margin-top:8px}.profile-row{display:flex;gap:14px;align-items:center;background:#f7f5fc;border-radius:18px;padding:15px;margin:22px 0}.avatar-large{font-size:34px}.profile-row div:nth-child(2){display:flex;flex:1;flex-direction:column}.profile-row input{font-size:19px;font-weight:900;background:transparent;border:0;border-bottom:1px solid #d7d1e6;color:var(--ink);width:160px}.profile-row small{color:var(--muted)}.profile-row button{border:0;background:#e8e2ff;color:var(--purple);border-radius:10px;padding:9px;font-weight:800}.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.stat-grid article{padding:16px 8px;border:1px solid #eeeaf4;border-radius:16px;display:flex;flex-direction:column;text-align:center}.stat-grid article span{font-size:23px}.stat-grid strong{font-size:24px}.stat-grid small{color:var(--muted)}.parent-card h3{font-family:"Baloo 2";margin-top:25px}.skill-row{display:grid;grid-template-columns:130px 1fr 40px;gap:10px;align-items:center;margin:12px 0;font-size:13px;font-weight:800}.skill-track{height:9px;background:#eeeaf5;border-radius:10px;overflow:hidden}.skill-track i{display:block;height:100%;background:var(--c);border-radius:inherit}.danger-link{border:0;background:transparent;color:#dc5265;margin-top:20px}.game-header{text-align:center}.game-header .game-emoji{font-size:50px}.game-header h2{margin:5px}.game-header p{color:var(--muted);margin:5px}.question-box{margin:25px auto;max-width:590px;text-align:center;background:#f8f6fc;border-radius:22px;padding:28px}.question-main{font-family:"Baloo 2";font-size:46px;font-weight:800;margin:10px}.answers{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:20px}.answer-btn{border:2px solid #eae6f2;background:#fff;border-radius:17px;padding:16px;font-size:22px;font-weight:900;color:var(--ink);transition:.15s}.answer-btn:hover{border-color:var(--purple);transform:scale(1.03)}.answer-btn.correct{background:#d9f8e3;border-color:#35b864}.answer-btn.wrong{background:#ffe0e3;border-color:#e85c6d}.game-meta{display:flex;justify-content:space-between;color:var(--muted);font-weight:800;font-size:13px}.memory-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;max-width:480px;margin:25px auto}.memory-card{aspect-ratio:1;border:0;border-radius:15px;background:var(--purple);font-size:0;box-shadow:inset 0 -5px #4e36c4}.memory-card.flipped,.memory-card.matched{font-size:34px;background:#f5f0ff;box-shadow:none}.canvas-tools{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin:16px}.color-dot{width:34px;height:34px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 1px #ccc;background:var(--c)}.color-dot.active{box-shadow:0 0 0 3px var(--purple)}#drawCanvas{width:100%;height:330px;border:2px dashed #dad5e5;border-radius:18px;touch-action:none;background:#fff}.toast{position:fixed;z-index:100;left:50%;bottom:90px;transform:translate(-50%,20px);background:#28243e;color:#fff;border-radius:99px;padding:12px 20px;opacity:0;pointer-events:none;transition:.25s;font-weight:800}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:850px){.game-grid{grid-template-columns:repeat(2,1fr)}.hero{grid-template-columns:1fr;padding:38px}.hero-copy{max-width:560px}.hero-world{position:absolute;right:-50px;bottom:0;width:380px;height:220px;opacity:.45}.reward-banner{grid-template-columns:90px 1fr}.reward-progress{grid-column:1/3}}
@media(max-width:580px){body{padding-bottom:80px}.topbar{height:64px;padding:0 16px}.brand{font-size:19px}.brand-mark{width:37px;height:37px}.coin-pill{padding:8px 10px}.hero{min-height:390px;padding:30px 23px;border-radius:25px}.hero h1{font-size:34px}.hero p{font-size:14px}.hero-world{opacity:.28;right:-110px}.learning-section{padding-top:35px}.section-heading h2{font-size:26px}.game-grid{grid-template-columns:1fr}.game-card{min-height:105px;padding:15px}.reward-banner{grid-template-columns:65px 1fr;padding:22px 17px}.reward-art{font-size:52px}.reward-banner h2{font-size:23px}.mobile-nav{display:flex}.modal-card{padding:26px 18px;border-radius:23px}.game-modal-card{min-height:480px}.answers{gap:7px}.answer-btn{padding:13px 5px}.question-main{font-size:38px}.stat-grid strong{font-size:20px}.stat-grid small{font-size:10px}.skill-row{grid-template-columns:95px 1fr 34px}.profile-row{flex-wrap:wrap}.profile-row button{width:100%}}

/* Ömürlük nişan sistemi */
.reward-banner{cursor:pointer;position:relative;isolation:isolate;background:linear-gradient(125deg,#fff4c8,#ffe0a8 58%,#ffd3c2);border:1px solid #f5cf7a;box-shadow:0 14px 38px #9e6a1520;transition:transform .22s,box-shadow .22s}.reward-banner:before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 8% 18%,#fff 0 3px,transparent 4px),radial-gradient(circle at 83% 25%,#fff9 0 4px,transparent 5px);background-size:80px 70px}.reward-banner:hover,.reward-banner:focus-visible{transform:translateY(-4px);box-shadow:0 20px 48px #9e6a1533;outline:3px solid #ffb62e;outline-offset:3px}.reward-copy{min-width:0}.reward-mini-shelf{display:flex;align-items:center;gap:7px;margin-top:11px;min-height:31px}.reward-mini-shelf span{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;background:#fff9;border:1px solid #eecb79;box-shadow:0 3px 8px #a96f1522;font-size:17px}.reward-mini-shelf .empty-medal{filter:grayscale(1);opacity:.7}.reward-mini-shelf small{color:#856e42}.reward-progress small{display:block;text-align:right;color:#8a713f;font-size:10px;margin-top:6px}.reward-progress i{background:linear-gradient(90deg,#ffb51f,#ff6d55,#9b6aef)}.badge-cabinet-card{width:min(95vw,980px);max-height:94vh;background:linear-gradient(#fff,#fffaf0)}.badge-cabinet-card>.eyebrow{color:#8a60d5}.badge-intro{color:var(--muted);margin-top:4px}.badge-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:20px 0}.badge-summary div{border:1px solid #eee8f7;background:#fff;border-radius:17px;padding:12px;display:grid;grid-template-columns:auto 1fr;column-gap:8px;align-items:center}.badge-summary span{font-size:27px;grid-row:1/3}.badge-summary strong{font-size:20px}.badge-summary small{color:var(--muted);font-size:10px}.badge-filters{display:flex;gap:7px;overflow:auto;padding:2px 2px 10px;scrollbar-width:none}.badge-filters::-webkit-scrollbar{display:none}.badge-filters button{white-space:nowrap;border:1px solid #e5deef;background:#fff;color:#6d6678;border-radius:99px;padding:8px 12px;font-size:11px;font-weight:900}.badge-filters button.active{background:var(--purple);border-color:var(--purple);color:#fff}.badge-filters span{opacity:.65;margin-left:4px}.badge-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:11px;margin-top:8px}.badge-card{min-height:210px;border:1px solid #ece6f3;background:#fff;border-radius:20px;padding:15px 12px;display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;overflow:hidden}.badge-card.unlocked{border-color:#e8c65d;background:linear-gradient(160deg,#fffdf6,#fff2c8);box-shadow:inset 0 0 0 1px #fff,0 7px 18px #a9781720}.badge-card.locked{filter:saturate(.55)}.badge-medal{position:relative;width:70px;height:70px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#f2edf8,#ddd4e9);box-shadow:inset 0 -6px #c9bed8;margin-bottom:9px}.unlocked .badge-medal{background:linear-gradient(145deg,#fff7b8,#ffc640);box-shadow:inset 0 -7px #e8a91d,0 6px 12px #bb7d2333}.badge-medal span{font-size:35px}.badge-medal i{position:absolute;right:-3px;bottom:0;background:#fff;border:2px solid #dac87f;border-radius:99px;min-width:24px;padding:2px 4px;font-style:normal;font-size:8px;font-weight:900}.badge-card strong{font-family:"Baloo 2";font-size:14px;line-height:1.1}.badge-card small{color:var(--muted);font-size:9px;line-height:1.35;margin:5px 0 auto}.badge-card-progress{width:100%;height:6px;background:#eae5ee;border-radius:8px;overflow:hidden;margin-top:10px}.badge-card-progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#8062e6,#ee6b95)}.badge-card em{font-style:normal;font-size:8px;color:#8e849a;margin-top:5px}.badge-award-modal{z-index:80}.badge-award-card{max-width:560px;text-align:center;overflow:hidden;background:linear-gradient(150deg,#fffdf4,#fff0bd);border:2px solid #ffd55c}.award-rays{position:absolute;inset:-50%;z-index:0;background:repeating-conic-gradient(#ffd95d30 0 12deg,transparent 12deg 24deg);animation:awardSpin 18s linear infinite}.badge-award-card>*:not(.award-rays){position:relative;z-index:1}.new-badge-awards{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:20px 0}.new-badge-awards article{width:140px;border-radius:18px;padding:13px 9px;background:#fff;border:1px solid #f1d77b;box-shadow:0 8px 20px #9b6a1e20;display:flex;flex-direction:column;align-items:center}.new-badge-awards article span{font-size:48px}.new-badge-awards article strong{font-family:"Baloo 2";font-size:14px}.new-badge-awards article small{font-size:9px;color:var(--muted)}.new-badge-awards p{width:100%;font-weight:900;color:#8f6815}.parent-badge-shelf{display:flex;flex-wrap:wrap;gap:7px;padding:12px;background:#faf7ff;border-radius:16px;min-height:54px}.parent-badge-shelf span{width:37px;height:37px;border-radius:50%;display:grid;place-items:center;background:#fff1b9;border:1px solid #e8ca63;font-size:21px}.parent-badge-shelf small{color:var(--muted);align-self:center}.stat-grid{grid-template-columns:repeat(4,1fr)}@keyframes awardSpin{to{transform:rotate(360deg)}}
@media(max-width:850px){.badge-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:580px){.reward-banner{grid-template-columns:58px 1fr;gap:13px}.reward-progress{grid-column:1/3}.reward-mini-shelf{gap:4px}.reward-mini-shelf span{width:27px;height:27px;font-size:15px}.badge-cabinet-card{padding:25px 12px}.badge-summary{grid-template-columns:repeat(2,1fr)}.badge-grid{grid-template-columns:repeat(2,1fr);gap:8px}.badge-card{min-height:195px;padding:12px 8px}.badge-medal{width:60px;height:60px}.badge-medal span{font-size:30px}.stat-grid{grid-template-columns:repeat(2,1fr)}}
.backup-note{color:var(--muted);font-size:11px;line-height:1.45;margin-top:-7px}.backup-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px}.backup-btn{border:1px solid #dcd3ee;background:#f9f6ff;color:#6047bf;border-radius:13px;padding:11px;text-align:center;font-size:11px;font-weight:900;cursor:pointer}.backup-btn:hover{background:#eee8ff;border-color:#8a70e3}

/* Bütün modal pəncərələr üçün mobil-safe bağlama düyməsi */
.modal-card{isolation:isolate;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.close-btn{position:sticky;float:right;top:max(8px,env(safe-area-inset-top));right:auto;z-index:10000!important;width:48px;height:48px;min-width:48px;min-height:48px;margin:-18px -18px 2px 10px;padding:0;border:3px solid #fff;background:#f1eff6;box-shadow:0 5px 18px #2923412b;display:grid;place-items:center;line-height:1;font-size:30px;pointer-events:auto!important;touch-action:manipulation;-webkit-tap-highlight-color:transparent;user-select:none}.close-btn:active{transform:scale(.92);background:#e7e0f5}.close-btn:focus-visible{outline:3px solid var(--purple);outline-offset:2px}@media(max-width:580px){.close-btn{top:max(6px,env(safe-area-inset-top));margin:-13px -8px 2px 8px}}
