*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 20% 0,#17345a 0,#091523 36%,#050b13 100%);color:#f5f8ff;font-family:Arial,Tahoma,sans-serif;min-height:100vh}#app{min-height:100vh;display:flex;flex-direction:column}header{padding:18px 5vw;display:flex;justify-content:space-between;gap:12px;align-items:center;border-bottom:1px solid #20364d;background:#07111fcc;backdrop-filter:blur(12px)}.brand{font-size:clamp(22px,5vw,34px);font-weight:900}.sub{color:#86d8ff;margin-top:4px;font-weight:700}.stats{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.stats span{background:#12283d;border:1px solid #2c5878;border-radius:16px;padding:9px 12px;font-weight:900}main{width:min(920px,92vw);margin:auto;padding:22px 0}.progress{height:11px;background:#142538;border-radius:99px;overflow:hidden}.progress div{height:100%;width:0;background:linear-gradient(90deg,#3be3a1,#61c8ff,#d991ff);transition:.4s}.round{text-align:center;color:#a7b9cb;font-weight:800;margin:12px}.card{background:linear-gradient(145deg,#0d1b2c,#0a1522);border:1px solid #25405c;border-radius:28px;padding:clamp(20px,5vw,38px);box-shadow:0 25px 60px #0008;min-height:430px;text-align:center}.answer{background:#aee8ff;color:#06243a;border-radius:20px;padding:20px;font-size:clamp(22px,5vw,36px);font-weight:900;margin:20px 0;line-height:1.45}.answer .remove{background:#56e69c;color:#062a1d;border-radius:8px;padding:2px 5px;transition:.4s}.step{display:inline-block;background:#152c45;color:#7dd8ff;border:1px solid #2f6288;border-radius:999px;padding:8px 14px;font-weight:900;margin-bottom:10px}.prompt{font-size:clamp(22px,5vw,32px);font-weight:900;margin:15px 0}.hint{color:#aab9c9;margin:8px auto 20px}.choices{display:grid;grid-template-columns:repeat(2,1fr);gap:13px;margin:22px auto;max-width:620px}.choice,.btn{border:0;border-radius:18px;padding:16px;font-size:20px;font-weight:900;cursor:pointer;transition:.15s}.choice{background:#173454;color:#fff;border:1px solid #2d668e}.choice:active,.btn:active{transform:scale(.97)}.choice.wrong{background:#7d2232;animation:shake .3s}.choice.correct{background:#16845c}.btn{background:linear-gradient(90deg,#58d8ff,#7a9cff);color:#06101c;min-width:180px}.inputWrap{max-width:650px;margin:20px auto}.build{font-size:clamp(19px,4vw,29px);font-weight:900;line-height:1.8}.piece{display:inline-block;padding:5px 9px;border-radius:10px;margin:3px;background:#183653}.field{width:100%;margin-top:18px;background:#07111f;color:#fff;border:2px solid #3d789f;border-radius:18px;padding:17px;font-size:24px;text-align:center;outline:none;font-weight:900}.field:focus{border-color:#6fe0ff;box-shadow:0 0 0 4px #59d5ff1c}.final{background:linear-gradient(135deg,#ffe176,#ffb84d);color:#352000;padding:24px;border-radius:22px;font-size:clamp(23px,5vw,38px);font-weight:1000;margin:22px 0}.scoreBig{font-size:52px;font-weight:1000;color:#77f0bd}.toast{position:fixed;top:95px;left:50%;transform:translate(-50%,-30px);opacity:0;background:#1b8d62;color:#fff;border-radius:18px;padding:13px 22px;font-size:20px;font-weight:900;z-index:10;transition:.25s;box-shadow:0 15px 35px #0007}.toast.show{transform:translate(-50%,0);opacity:1}.toast.bad{background:#a92e42}footer{display:flex;justify-content:center;gap:20px;flex-wrap:wrap;padding:17px;background:#050b13;border-top:1px solid #1d3449;color:#9edfff}#confetti i{position:fixed;top:-20px;width:9px;height:15px;background:#fff;animation:fall 1.7s linear forwards;z-index:20}@keyframes fall{to{transform:translateY(110vh) rotate(720deg)}}@keyframes shake{25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}@media(max-width:600px){header{align-items:flex-start;flex-direction:column}.stats{justify-content:flex-start}.choices{grid-template-columns:1fr}.card{min-height:480px}}

#score{color:#ffd34e;font-size:32px;text-shadow:0 0 16px #ffca2855}.stats span:first-child{border-color:#d6a928;background:#30270d;color:#ffd34e}.field.typing{color:#79d9ff}.field.answerCorrect{color:#55e69d;border-color:#39c982;background:#09241c}.field.answerWrong{color:#ff6178;border-color:#ff6178;background:#2a0d14}.checkBtn{display:block;margin:16px auto 0;background:linear-gradient(90deg,#ffd65a,#ffb84d)}.checkBtn:disabled{opacity:.55;cursor:default}.wrongNote{color:#ff7185;font-weight:900;font-size:20px;margin-top:18px}.correctBox{margin:12px 0;padding:14px;border-radius:16px;background:#0c3025;color:#baf6d8;font-size:20px}.correctBox b{color:#58e6a0;font-size:24px}.explain{direction:rtl;text-align:right;background:#17263a;border:1px solid #38536e;border-radius:16px;padding:15px 18px;color:#e9f3ff;line-height:1.8;font-size:18px}.explain b{color:#ffd34e}.continueBtn{margin-top:14px}
.missionStat{color:#7ee8ff!important}.missionDone{font-size:clamp(30px,7vw,54px);font-weight:1000;color:#ffd34e;margin:18px 0}.missionScore{width:190px;height:190px;border-radius:50%;margin:24px auto;display:flex;align-items:center;justify-content:center;border:8px solid #ffd34e;background:#211b08;color:#ffd34e;font-size:38px;font-weight:1000;box-shadow:0 0 35px #ffd34e44}.totalTitle{font-size:clamp(48px,11vw,88px);font-weight:1000;color:#ff3b4f;text-shadow:0 4px 0 #7b0b16;margin:15px 0}.totalCircle{width:min(290px,72vw);aspect-ratio:1;border-radius:50%;margin:25px auto;display:flex;flex-direction:column;align-items:center;justify-content:center;border:10px solid #ffd34e;background:radial-gradient(circle,#3a2d08,#141005);color:#ffd34e;box-shadow:0 0 50px #ffd34e55}.totalCircle b{font-size:clamp(48px,12vw,78px)}.totalCircle span{font-size:20px;font-weight:900}.missionBadge{display:inline-block;background:#3a2e08;color:#ffd34e;border:1px solid #8d7120;padding:8px 16px;border-radius:999px;font-weight:900}.skipInfo{color:#8da4b9;font-size:15px;margin-top:10px}

/* Mission index / 75% gate */
.indexTitle{font-size:clamp(32px,7vw,52px);font-weight:1000;color:#ffd34e;margin:4px 0 8px}.indexHint{max-width:680px;margin:0 auto 24px;color:#c4d7e8;font-size:18px;line-height:1.8}.indexHint b{color:#71f0b5;font-size:22px}.missionGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:760px;margin:0 auto}.missionItem{display:flex;align-items:center;gap:12px;width:100%;min-height:86px;padding:14px 16px;border-radius:18px;text-align:right;border:1px solid #294864;background:#0b1827;color:#eaf5ff}.missionItem .missionIcon{font-size:27px;flex:0 0 34px}.missionItem .missionName{font-size:19px;font-weight:1000;flex:1}.missionItem .missionState{font-size:14px;font-weight:900;color:#90a6b9}.missionItem.active{cursor:pointer;background:linear-gradient(135deg,#123a35,#102c42);border:2px solid #55e6a0;box-shadow:0 0 24px #55e6a022}.missionItem.active .missionState{color:#6af0ae}.missionItem.passed{background:#0d291f;border-color:#2d785a}.missionItem.passed .missionState{color:#71dbae}.missionItem.locked{opacity:.55;filter:saturate(.55)}.missionItem:disabled{cursor:default}.retryTitle{font-size:clamp(38px,9vw,68px);font-weight:1000;color:#ff6379;margin:20px 0}.retryScore{border-color:#ff6379;background:#2a0d14;color:#ff8b9c;box-shadow:0 0 35px #ff637944}.retryBtn{background:linear-gradient(90deg,#ffcf55,#ff934d);margin:8px}.indexBtn{background:#172b40;color:#d9edff;border:1px solid #355875;margin:8px}.totalIndexBtn{margin-top:24px}@media(max-width:650px){.missionGrid{grid-template-columns:1fr}.missionItem{min-height:76px}.missionItem .missionName{font-size:18px}.indexHint{font-size:16px}}

/* 20-level game ladder: gray until completed, then vivid color */
.levelLadder{width:min(760px,96%);margin:22px auto 28px;display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:12px 4px}.levelBar{height:42px;display:flex;align-items:center;padding-left:20px;border-radius:9px 20px 20px 9px;font-size:20px;font-weight:1000;color:#fff;text-shadow:0 2px 4px #000;position:relative;overflow:hidden;transition:.35s;width:calc(34% + (var(--lv) * 3.1%));min-width:150px;box-shadow:inset 0 2px 5px #ffffff88,inset 0 -4px 7px #0007,0 2px 5px #0008;border:2px solid #b8c0c8}.levelBar:after{content:"";position:absolute;right:4%;top:0;width:20%;height:100%;background:linear-gradient(120deg,transparent,#fff5);transform:skewX(-22deg)}.levelGray{background:linear-gradient(#aeb5bc 0%,#4f5963 48%,#242b32 100%);filter:saturate(.15)}.levelDone{background:linear-gradient(100deg,hsl(calc(270 + (var(--lv) * 6)) 88% 43%),hsl(calc(190 + (var(--lv) * 8)) 95% 48%));border-color:#fff9;box-shadow:inset 0 2px 6px #fff9,inset 0 -4px 8px #0006,0 0 13px hsl(calc(190 + (var(--lv) * 8)) 95% 48%)}.levelBar span{position:relative;z-index:2}.missionScore{font-size:64px}.missionDone+.missionScore{margin-bottom:16px}@media(max-width:600px){.levelBar{height:34px;font-size:16px;padding-left:12px;min-width:115px}.levelLadder{gap:3px}.missionScore{font-size:54px}}

/* 20-level ladder */
.levelLadder{width:min(760px,96%);margin:22px auto 28px;display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:12px 4px}.levelBar{height:42px;display:flex;align-items:center;padding-left:20px;border-radius:9px 20px 20px 9px;font-size:20px;font-weight:1000;color:#fff;text-shadow:0 2px 4px #000;position:relative;overflow:hidden;transition:.35s;width:calc(34% + (var(--lv) * 3.1%));min-width:150px;box-shadow:inset 0 2px 5px #ffffff88,inset 0 -4px 7px #0007,0 2px 5px #0008;border:2px solid #b8c0c8}.levelBar:after{content:"";position:absolute;right:4%;top:0;width:20%;height:100%;background:linear-gradient(120deg,transparent,#fff5);transform:skewX(-22deg)}.levelGray{background:linear-gradient(#aeb5bc 0%,#4f5963 48%,#242b32 100%);filter:saturate(.15)}.levelDone{background:linear-gradient(100deg,hsl(calc(270 + (var(--lv) * 6)) 88% 43%),hsl(calc(190 + (var(--lv) * 8)) 95% 48%));border-color:#fff9;box-shadow:inset 0 2px 6px #fff9,inset 0 -4px 8px #0006,0 0 13px #47cfff66}.levelBar span{position:relative;z-index:2}.missionScore{font-size:64px}@media(max-width:600px){.levelBar{height:34px;font-size:16px;padding-left:12px;min-width:115px}.levelLadder{gap:3px}.missionScore{font-size:54px}}

/* FINAL LEVEL SELECTOR: replaces the old mission-card grid */
.missionGrid{display:none!important}
.levelLadder{width:min(760px,96%);margin:20px auto 30px;display:flex;flex-direction:column;align-items:flex-start;gap:5px;padding:10px 4px}
.levelBar{appearance:none;-webkit-appearance:none;height:48px;display:flex;align-items:center;justify-content:flex-start;padding:0 54px 0 22px;border-radius:8px 22px 22px 8px;font-size:21px;font-weight:1000;color:#fff;text-shadow:0 2px 5px #000;position:relative;overflow:hidden;transition:transform .18s,filter .25s,box-shadow .25s;width:calc(31% + (var(--lv) * 3.2%));min-width:155px;max-width:100%;border:2px solid #c8d0d8;box-shadow:inset 0 3px 6px #fff8,inset 0 -5px 9px #0008,0 3px 6px #0008;text-align:left}
.levelBar:before{content:"";position:absolute;inset:3px;border-radius:6px 19px 19px 6px;border-top:1px solid #fff9;pointer-events:none}
.levelBar:after{content:"";position:absolute;right:3%;top:-8%;width:23%;height:116%;background:linear-gradient(120deg,transparent 10%,#fff6 52%,transparent 55%);transform:skewX(-20deg);pointer-events:none}
.levelGray{background:linear-gradient(180deg,#c0c5ca 0%,#68717a 38%,#303840 70%,#59626a 100%);filter:grayscale(1) saturate(.15) brightness(.82)}
.levelActive{background:linear-gradient(180deg,#c0c5ca 0%,#68717a 38%,#303840 70%,#59626a 100%);filter:grayscale(1) saturate(.15);border-color:#ffe05e;box-shadow:inset 0 3px 6px #fff8,inset 0 -5px 9px #0008,0 0 18px #ffd34e99;cursor:pointer}
.levelDone{background:linear-gradient(180deg,hsl(var(--hue) 100% 62%) 0%,hsl(var(--hue) 95% 48%) 45%,hsl(var(--hue) 95% 34%) 75%,hsl(var(--hue) 100% 49%) 100%);border-color:hsl(var(--hue) 100% 78%);filter:none;box-shadow:inset 0 3px 7px #fff9,inset 0 -5px 9px #0007,0 0 14px hsl(var(--hue) 100% 55% / .55)}
.levelClickable:hover{transform:translateX(6px)}
.levelBar span{position:relative;z-index:2}.levelBar b{position:absolute;right:16px;z-index:3;font-size:18px}.levelPlay{color:#ffe05e}.levelCheck{color:#fff}.levelLock{font-size:14px!important;opacity:.75}
@media(max-width:600px){.levelBar{height:39px;font-size:17px;padding-left:13px;padding-right:42px;min-width:120px}.levelLadder{gap:4px}.levelBar b{right:10px}}

/* Rewards overlay — styled independently from the locked original game. */
#rewardOverlay[hidden] {display:none !important}
#rewardOverlay {position:fixed;inset:0;z-index:5000;display:flex;align-items:center;justify-content:center;overflow-y:auto;padding:18px 10px;background:rgba(1,7,18,.94);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.rewardDialog {width:min(580px,96vw);max-height:98dvh;overflow-y:auto;overscroll-behavior:contain;padding:18px 15px 22px;border-radius:25px;border:2px solid #edc45e;background:radial-gradient(circle at 50% 3%,#233d7b,#101632 55%,#0b1026);text-align:center;box-shadow:0 25px 80px #000b,0 0 35px #ffbd3655}
.rewardTitle {font-weight:1000;font-size:clamp(25px,6vw,39px);color:#ffe072;text-shadow:0 4px 15px #ffc10755;margin-bottom:8px}
.rewardHint {font-size:16px;line-height:1.6;color:#d8eaff;margin:0 auto 12px}
.wheelStage {position:relative;aspect-ratio:1;width:min(450px,75vh,90vw);margin:8px auto 12px;filter:drop-shadow(0 8px 14px #000a)}
.wheelStage canvas {width:100%;height:100%;cursor:pointer;touch-action:manipulation}
.wheelPointer {position:absolute;top:-5px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:19px solid transparent;border-right:19px solid transparent;border-top:39px solid #ff334d;z-index:4;filter:drop-shadow(0 3px 4px #000)}
.wheelHub {position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:14%;aspect-ratio:1;border:4px solid #ffe479;border-radius:50%;background:radial-gradient(circle,#ff5858,#aa0f2d);pointer-events:none;box-shadow:0 0 11px #7b1028;z-index:3}
.spinReward {background:linear-gradient(110deg,#ffcb32,#ff8b17);border:2px solid #ffe58d;color:#221600;font-weight:1000;font-size:clamp(17px,3vw,23px);margin:8px auto}
.spinReward:disabled {opacity:.65;cursor:default}
.wheelOutcome {font-size:clamp(22px,5vw,33px);font-weight:1000;color:#7ef5b6;min-height:38px;margin:9px}
.giftDialog {width:min(620px,96vw)}
.giftDialog .wow-gift-widget {margin:0 auto}
.giftDialog .wow-gift-toolbar .wow-gift-replay {display:none!important}
.giftMessage {font-weight:1000;color:#81f7b9;font-size:24px;margin:14px auto}
.scoreBreakdown {width:min(470px,98%);margin:18px auto;display:grid;gap:10px;direction:rtl;text-align:right}
.scoreBreakdown div {border:1px solid #325a75;background:#0e2235;border-radius:15px;padding:13px 17px;font-weight:800;font-size:clamp(15px,3.2vw,21px);display:flex;justify-content:space-between;gap:15px}
.scoreBreakdown b {color:#ffd65d;font-variant-numeric:tabular-nums}
.totalCircle b {font-size:clamp(35px,9vw,65px);overflow-wrap:anywhere}
.resetBtn {display:block;margin:22px auto 8px;background:transparent;border:1px solid #536b7f;font-size:15px;color:#d4e7f3;padding:12px 17px}
@media(max-height:750px){.wheelStage{width:min(350px,61vh,80vw)}.rewardDialog{padding:10px}.rewardTitle{margin-bottom:3px}}
@media(max-width:520px){.rewardDialog{padding:12px 9px}.rewardHint{font-size:14px}.wheelStage{width:min(365px,84vw,54vh)}}
