:root{--sky:#72cfff;--blue:#168be0;--deep:#103b6d;--ink:#143052;--cream:#fffaf0;--gold:#ffc928;--gold2:#ff9f1a;--red:#ef5961;--green:#2ac57a;--card:#ffffff;--shadow:0 18px 50px rgba(18,73,126,.18)}
*{box-sizing:border-box}html{min-height:100%;background:#c8ecff}body{margin:0;min-height:100vh;font-family:ui-rounded,'SF Pro Rounded','Arial Rounded MT Bold','Trebuchet MS',sans-serif;color:var(--ink);background:linear-gradient(180deg,#67caff 0,#cceeff 48%,#ecf9ff 100%);overflow-x:hidden}.sky{position:fixed;inset:0;pointer-events:none;overflow:hidden}.sky span{position:absolute;width:130px;height:42px;background:rgba(255,255,255,.62);border-radius:50px;filter:blur(.3px);animation:drift 18s linear infinite}.sky span:before,.sky span:after{content:"";position:absolute;background:inherit;border-radius:50%}.sky span:before{width:56px;height:56px;left:23px;top:-26px}.sky span:after{width:70px;height:70px;right:18px;top:-35px}.sky span:nth-child(1){top:10%;left:-160px}.sky span:nth-child(2){top:36%;left:-260px;animation-delay:-7s;animation-duration:24s;transform:scale(.75)}.sky span:nth-child(3){top:65%;left:-190px;animation-delay:-13s;animation-duration:21s;transform:scale(1.15)}@keyframes drift{to{left:110vw}}
button,input{font:inherit}.app-shell{position:relative;z-index:1;max-width:1040px;margin:0 auto;padding:calc(12px + env(safe-area-inset-top)) 18px calc(32px + env(safe-area-inset-bottom))}.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.logo-button,.icon-button,.text-button{border:0;background:transparent;color:var(--deep);font-weight:900;cursor:pointer}.logo-button{display:flex;align-items:center;gap:9px;font-size:18px;padding:7px}.mini-coin{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:linear-gradient(145deg,#ffe772,#ffb309);border:3px solid #fff1a8;box-shadow:0 4px 0 #d88300;color:#8a5000}.top-actions{display:flex;gap:8px}.icon-button{width:46px;height:46px;background:rgba(255,255,255,.75);border-radius:15px;font-size:20px;box-shadow:0 6px 18px rgba(31,97,151,.13)}.icon-button:active,.level-card:active,.primary-button:active{transform:translateY(2px)}.balance-strip{display:grid;grid-template-columns:1fr 1fr;gap:10px;background:rgba(255,255,255,.86);border:2px solid rgba(255,255,255,.9);border-radius:20px;padding:11px 16px;box-shadow:0 10px 30px rgba(26,90,147,.12);backdrop-filter:blur(10px)}.balance-strip>div{display:flex;align-items:center;justify-content:space-between;gap:10px}.balance-strip>div+div{border-left:2px dashed #b6dff3;padding-left:16px}.label{font-size:12px;color:#527493}.balance-strip strong{font-size:18px;color:var(--deep)}
.screen{display:none}.screen.active{display:block}.hero-zone{position:relative;display:grid;grid-template-columns:220px 1fr;align-items:center;min-height:260px;margin:18px 0 8px;padding:8px 26px;background:linear-gradient(135deg,rgba(255,255,255,.62),rgba(255,255,255,.18));border:2px solid rgba(255,255,255,.65);border-radius:30px;overflow:hidden}.block-hero{width:185px;align-self:end;filter:drop-shadow(0 16px 15px rgba(20,65,105,.18));animation:heroBob 2.7s ease-in-out infinite;transform-origin:bottom}.welcome-copy{position:relative;z-index:2}.eyebrow{display:block;text-transform:uppercase;letter-spacing:.11em;font-size:11px;font-weight:900;color:#1477bf}.welcome-copy h1{font-size:clamp(32px,6vw,58px);line-height:.95;margin:7px 0 12px;color:var(--deep);text-wrap:balance}.welcome-copy p{max-width:510px;font-size:17px;line-height:1.45;margin:0;color:#365c80}.floating-cube{position:absolute;width:38px;height:38px;background:#38aaf0;border:7px solid #9ee1ff;box-shadow:8px 8px 0 #1472bd;transform:rotate(15deg);animation:cubeFloat 4s ease-in-out infinite}.cube-one{right:8%;top:16%}.cube-two{right:27%;bottom:9%;transform:scale(.6) rotate(34deg);animation-delay:-1.8s}@keyframes heroBob{50%{transform:translateY(-8px) rotate(-1deg)}}@keyframes cubeFloat{50%{translate:0 -14px;rotate:28deg}}
.level-map{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.level-card{position:relative;min-height:155px;text-align:left;border:0;border-radius:24px;padding:18px;background:linear-gradient(145deg,#fff,#edf9ff);box-shadow:var(--shadow);color:var(--ink);cursor:pointer;overflow:hidden;transition:.2s ease}.level-card:not(:disabled):hover{transform:translateY(-4px);box-shadow:0 23px 55px rgba(18,73,126,.24)}.level-card:disabled{cursor:not-allowed;filter:saturate(.45);opacity:.65}.level-card:before{content:"";position:absolute;width:94px;height:94px;border-radius:24px;right:-24px;bottom:-28px;background:var(--level-color,#7dd8ff);transform:rotate(18deg);opacity:.35}.level-number{display:grid;place-items:center;width:40px;height:40px;border-radius:13px;background:var(--level-color,#55baff);color:#fff;font-weight:900;box-shadow:0 5px 0 rgba(0,63,120,.45)}.level-lock{position:absolute;right:16px;top:17px}.level-name{display:block;font-size:17px;margin:14px 0 2px}.level-factors,.level-time{display:block;color:#527493;font-size:12px}.level-reward{display:inline-block;margin-top:10px;padding:5px 9px;border-radius:10px;background:#fff4b8;color:#925400}.level-card.completed{outline:3px solid #50d48f}.level-card.completed .level-lock:after{content:'✓';color:#159455;font-size:22px;font-weight:900}
.game-heading{display:flex;justify-content:space-between;align-items:center;margin:20px 0 12px}.game-heading>div{text-align:right}.game-heading strong{display:block}.text-button{padding:10px 0;font-size:15px}.game-grid{display:grid;grid-template-columns:1.06fr .94fr;gap:16px}.challenge-card,.treasure-stage{min-height:450px;border-radius:28px;box-shadow:var(--shadow)}.challenge-card{background:var(--card);padding:26px}.timer-row{display:flex;justify-content:space-between;font-weight:900;color:#537490}.timer-row strong{font-size:23px;color:var(--deep)}.timer-track{height:12px;margin:8px 0 24px;background:#dceef7;border-radius:10px;overflow:hidden}.timer-track>div{width:100%;height:100%;background:linear-gradient(90deg,#39ce8a,#ffd349,#f16469);border-radius:inherit;transform-origin:left;transition:transform .2s linear}.equation{text-align:center;font-size:clamp(54px,11vw,92px);font-weight:900;letter-spacing:-.05em;color:var(--deep);margin:30px 0}#answerForm label{display:block;font-size:13px;color:#527493;margin-bottom:6px}.answer-row{display:grid;grid-template-columns:1fr auto;gap:10px}.answer-row input{width:100%;min-width:0;border:3px solid #b9e3f7;border-radius:18px;padding:12px 16px;font-size:28px;font-weight:900;color:var(--deep);outline:0;background:#f8fdff}.answer-row input:focus{border-color:#168be0;box-shadow:0 0 0 5px rgba(22,139,224,.12)}.primary-button{border:0;border-radius:18px;padding:13px 22px;background:linear-gradient(180deg,#2aacf6,#147fd2);color:white;font-weight:900;box-shadow:0 6px 0 #0d609e;cursor:pointer;min-height:54px}.primary-button:disabled{opacity:.55;cursor:not-allowed}.feedback{text-align:center;min-height:28px;margin:17px 0 0;font-weight:900;color:#47708f}.feedback.correct{color:#159657}.feedback.wrong{color:#d83d4c}
.treasure-stage{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:28px 20px;background:radial-gradient(circle at 50% 30%,#2967a5,#123b6a 70%);overflow:hidden;border:5px solid rgba(255,255,255,.72)}.treasure-stage:before{content:"";position:absolute;inset:auto -20% -22% -20%;height:42%;background:linear-gradient(#43b968,#238850);border-radius:50% 50% 0 0}.ambient-stars{position:absolute;top:65px;color:#ffe46e;font-size:28px;letter-spacing:12px;animation:sparkle 1.8s ease-in-out infinite}.streak-badge{position:absolute;top:18px;left:18px;background:#fff;color:#174875;border-radius:14px;padding:8px 12px;font-weight:900}.chest{position:relative;width:200px;height:150px;z-index:3;filter:drop-shadow(0 18px 12px rgba(0,0,0,.28));animation:chestIdle 2.2s ease-in-out infinite}.chest-lid{position:absolute;left:5px;top:13px;width:190px;height:62px;border:9px solid #6d370e;border-radius:55px 55px 10px 10px;background:linear-gradient(#f1a727,#b76013);transform-origin:bottom;transform:rotateX(-22deg) translateY(-14px)}.chest-lid:after,.chest-body:after{content:"";position:absolute;left:82px;top:-9px;width:20px;height:100%;background:#ffd35a;border-left:4px solid #a76311;border-right:4px solid #a76311}.chest-body{position:absolute;left:0;bottom:0;width:200px;height:90px;border:9px solid #6d370e;border-radius:8px 8px 25px 25px;background:linear-gradient(135deg,#e38b19,#a95010);overflow:hidden}.chest-body b{position:absolute;z-index:2;left:78px;top:24px;width:42px;height:42px;display:grid;place-items:center;border-radius:9px;background:#ffd75b;border:4px solid #8d500d;color:#8d500d;font-size:23px}.stage-balance{position:relative;z-index:4;background:#fff;border-radius:16px;padding:8px 20px;margin-top:11px;text-align:center;box-shadow:0 8px 20px rgba(0,0,0,.18)}.stage-balance span{display:block;font-size:11px;color:#577591}.stage-balance strong{font-size:24px;color:#143c67}.coin-layer{position:absolute;inset:0;z-index:5;pointer-events:none}.flying-coin{position:absolute;left:calc(50% - 21px);top:22%;width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle at 35% 25%,#fff39a,#ffc21c 50%,#dc7e00 75%);border:4px solid #ffe579;box-shadow:0 0 18px #ffe16b;color:#8e5100;font-weight:900;font-size:22px}.flying-coin.drop{animation:coinDrop .85s cubic-bezier(.3,.8,.4,1) forwards}.flying-coin.fly{top:55%;animation:coinFly .85s cubic-bezier(.2,.8,.4,1) forwards}.chest.bump{animation:chestBump .55s ease}@keyframes chestIdle{50%{transform:translateY(-3px)}}@keyframes chestBump{40%{transform:scale(1.07) rotate(-2deg)}}@keyframes coinDrop{0%{transform:translateY(-120px) rotateY(0);opacity:0}20%{opacity:1}100%{transform:translateY(235px) rotateY(720deg) scale(.6);opacity:0}}@keyframes coinFly{0%{transform:translateY(0) rotate(0);opacity:1}100%{transform:translate(135px,-245px) rotate(740deg) scale(.7);opacity:0}}@keyframes sparkle{50%{opacity:.35;transform:scale(.86)}}
.modal-backdrop{position:fixed;z-index:30;inset:0;display:grid;place-items:center;padding:18px;background:rgba(7,32,59,.62);backdrop-filter:blur(7px)}.modal-backdrop.hidden{display:none}.modal{width:min(520px,100%);max-height:min(760px,90vh);overflow:auto;background:#fff;border-radius:28px;padding:26px;box-shadow:0 24px 80px rgba(0,0,0,.3)}.modal h2{font-size:28px;margin:0 0 8px;color:var(--deep)}.modal p{line-height:1.45;color:#4d6c88}.modal label{display:block;margin:15px 0 5px;font-size:13px;font-weight:900}.modal input{width:100%;border:2px solid #b9e3f7;border-radius:14px;padding:12px;font-size:18px}.modal-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}.secondary-button,.danger-button{border:0;border-radius:15px;padding:12px 16px;font-weight:900;cursor:pointer}.secondary-button{background:#e8f5fc;color:#145e99}.danger-button{background:#ffe5e7;color:#bb2936}.parent-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin:16px 0}.parent-stats>div{background:#eff8fd;border-radius:14px;padding:12px}.parent-stats span{display:block;font-size:11px;color:#607e99}.parent-stats strong{font-size:22px;color:var(--deep)}.history-list{padding:0;list-style:none}.history-list li{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid #e4eef3;font-size:13px}.level-result{font-size:52px;text-align:center;margin:8px 0}.firework-title{text-align:center;color:#116db0!important;font-size:38px!important}#fireworks{position:fixed;z-index:40;inset:0;width:100%;height:100%;pointer-events:none}
@media(max-width:700px){.app-shell{padding-left:12px;padding-right:12px}.balance-strip{grid-template-columns:1fr;padding:10px 13px}.balance-strip>div+div{border-left:0;border-top:1px dashed #b6dff3;padding:7px 0 0}.hero-zone{grid-template-columns:128px 1fr;min-height:210px;padding:10px 14px}.block-hero{width:125px}.welcome-copy h1{font-size:34px}.welcome-copy p{font-size:14px}.level-map{grid-template-columns:repeat(2,1fr);gap:10px}.level-card{min-height:145px;padding:14px}.game-grid{grid-template-columns:1fr}.challenge-card,.treasure-stage{min-height:auto}.treasure-stage{height:360px}.game-heading{margin-top:13px}.equation{margin:18px 0}.challenge-card{padding:20px}.answer-row{grid-template-columns:1fr}.primary-button{width:100%}.floating-cube{display:none}}
@media(max-width:390px){.logo-button span:last-child{font-size:15px}.hero-zone{grid-template-columns:108px 1fr}.block-hero{width:105px}.welcome-copy h1{font-size:29px}.level-card{min-height:138px}.level-name{font-size:15px}.equation{font-size:55px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}
