:root{--deep:#006eac;--cyan:#08c6e8;--lime:#62d932;--yellow:#ffd34e;--ink:#174d68}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Cairo,Tahoma,sans-serif}button{font:inherit;cursor:pointer}.game{position:relative;min-height:100vh;overflow:hidden;color:var(--ink);background:linear-gradient(#5ee8ee 0,#08cce7 22%,#079bcf 100%)}.game:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 15% 25%,#d8ffff88 0 1%,transparent 9%),radial-gradient(ellipse at 85% 48%,#8ff7f099 0 1%,transparent 8%),repeating-radial-gradient(ellipse at 50% 0,#fff2 0 2px,transparent 3px 31px)}.game:after{content:"";position:absolute;inset:auto 0 0;height:170px;pointer-events:none;background:radial-gradient(ellipse at 12% 100%,#ff826b 0 5%,transparent 6%),radial-gradient(ellipse at 90% 100%,#b662dc 0 7%,transparent 8%),linear-gradient(9deg,#ffca61 0 11%,transparent 12%)}.hud{position:relative;z-index:8;max-width:1020px;margin:auto;padding:22px 20px 0;display:grid;grid-template-columns:1fr 1.25fr 1fr;gap:24px;align-items:start}.glass{background:linear-gradient(145deg,#efffffed,#aeeaffd9);border:3px solid #fff;border-radius:24px;box-shadow:0 7px 0 #087dac66,0 14px 35px #0066964d}.player{display:grid;grid-template-columns:64px 1fr;gap:9px;padding:12px;direction:rtl}.avatar{grid-row:1/3;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;font-size:38px;background:linear-gradient(#7be7fa,#1db5dc);border:4px solid white}.player small,.player strong,.player span{display:block}.player strong{font-size:20px}.player span{font-size:12px}.wallet{grid-column:1/3;display:flex;justify-content:space-around;align-items:center;padding:6px 12px;border-radius:14px;background:#eaffffcc;border:1px solid #b2e8f8;box-shadow:inset 0 1px 3px rgba(0,0,0,0.05)}.wallet b{display:inline-flex;align-items:center;gap:5px;font-size:15px;font-weight:900;color:#0b566f}.hud h1{text-align:center;margin:0;color:#fff;font-size:24px;line-height:1.15;text-shadow:0 4px 0 #087daf,0 6px 8px #005b7d}.hud h1 span{display:block;color:var(--yellow);font-size:35px;text-shadow:0 3px 0 #a96412,0 5px 5px #087daf}.rewards{padding:11px 14px;text-align:center}.rewards>div{display:flex;justify-content:center;gap:12px;margin-top:4px}.rewards span{position:relative;display:inline-flex;font-size:32px}.rewards small{position:absolute;right:-7px;bottom:-5px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:#147696;color:#ffffff;font-size:12px;font-weight:900;display:inline-flex;align-items:center;justify-content:center;border:1.5px solid #ffffff;box-shadow:0 2px 4px rgba(0,0,0,0.25);line-height:1}
.map{position:relative;z-index:2;width:min(760px,100%);height:1060px;margin:0 auto 100px}.sun-rays{position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,#fff2 35% 37%,transparent 37% 55%,#fff2 55% 57%,transparent 57%);pointer-events:none}.route{position:absolute;z-index:0;inset:35px 135px;background:no-repeat center/100% 100% url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 500 1000'%3E%3Cpath d='M250 40 C430 100 420 230 250 245 S70 390 250 440 S430 585 250 635 S70 790 250 965' fill='none' stroke='%23fff' stroke-opacity='.8' stroke-width='8' stroke-dasharray='12 18' stroke-linecap='round'/%3E%3C/svg%3E")}.island{position:absolute;z-index:3;width:190px;min-height:152px;padding:16px 8px 8px;border:0;color:white;text-shadow:0 2px 2px #005b6f;background:radial-gradient(ellipse at 50% 54%,#65d730 0 27%,#e8c35b 28% 42%,#b8862e 43% 45%,transparent 46%);filter:drop-shadow(0 12px 7px #00637c88);transition:transform .22s,filter .22s}.island:before{content:"";position:absolute;inset:25% 18% 18%;z-index:-1;border-radius:50%;box-shadow:0 0 30px #9dffdf}.island:hover,.island.selected{transform:scale(1.13);filter:drop-shadow(0 0 13px #fff) drop-shadow(0 13px 8px #00637caa)}.island i{display:block;font-style:normal;font-size:59px;line-height:.95}.island .level,.island b,.island em{display:block}.island .level{font-size:12px}.island b{font-size:14px}.island em{width:max-content;margin:4px auto 0;padding:2px 12px;border-radius:18px;background:#46c52b;color:#fff;font-size:11px;font-style:normal;border:1px solid #fff8}.island.current em{background:#f5a915}.island.locked{filter:grayscale(.35) drop-shadow(0 10px 6px #00637c77)}.i1{left:5%;top:45px}.i2{right:4%;top:230px}.i3{left:8%;top:420px}.i4{right:6%;top:620px}.i5{left:11%;top:820px}.mission[hidden]{display:none!important}.mission{position:absolute;z-index:5;right:2%;top:825px;width:245px;padding:18px 14px;text-align:center;color:#63380f;background:linear-gradient(#ffe6a9,#ce8835);border:6px solid #754319;border-radius:12px;box-shadow:0 8px 0 #5a321a;transform:rotate(-1deg)}.mission:before,.mission:after{content:"";position:absolute;top:-15px;width:17px;height:calc(100% + 30px);border-radius:8px;background:#8a4d21}.mission:before{left:-12px}.mission:after{right:-12px}.mission span,.mission strong,.mission small{display:block}.mission span{font-size:12px}.mission strong{font-size:17px}.mission button{position:relative;z-index:2;margin-top:10px;padding:9px 20px;border:3px solid #fff;border-radius:30px;background:linear-gradient(#91ee42,#36b91d);color:white;font-weight:900;box-shadow:0 4px 0 #237c18}.sea-life{position:absolute;z-index:1;font-size:52px;filter:drop-shadow(0 5px 4px #006f8c88)}.fish-a{right:-35px;top:380px}.dolphin{left:-55px;top:650px}.turtle{right:-30px;top:760px}
.bottom-nav{position:fixed;z-index:10;left:50%;bottom:14px;transform:translateX(-50%);width:min(700px,calc(100% - 24px));height:82px;padding:8px 18px;display:flex;justify-content:space-around;align-items:center;border:3px solid #fff;border-radius:28px;background:#eafffff0;box-shadow:0 7px 0 #087dac66}.bottom-nav button{border:0;background:none;color:#24617d;font-size:11px;font-weight:800}.bottom-nav span{display:block;font-size:24px}.bottom-nav .active{color:#098dca}.bottom-nav .start{transform:translateY(-19px);width:105px;height:67px;border-radius:35px;background:linear-gradient(#8bea45,#32b81d);color:white;border:4px solid white;box-shadow:0 5px 0 #218216}.quiz{position:fixed;z-index:20;inset:50% auto auto 50%;transform:translate(-50%,-50%);width:min(570px,calc(100% - 30px));padding:25px;text-align:center}.quiz[hidden]{display:none}.close{position:absolute;left:13px;top:10px;border:0;background:none;color:#24708c;font-size:29px}.quiz-tag{color:#1689b2;font-size:13px}.quiz h2{margin:6px 0 18px}.answers{display:grid;grid-template-columns:1fr 1fr;gap:10px}.answers button,.quiz-footer button{padding:11px;border:2px solid #77cde5;border-radius:14px;background:white;color:#16546f;font-weight:800}.answers button.correct{background:#68db4b;color:white}.answers button.wrong{background:#ff7676;color:white}.quiz p{min-height:28px}.success{color:#188d29}.error{color:#c93434}.quiz-footer{display:flex;gap:16px;align-items:center;justify-content:space-between}.quiz-footer button{background:#42c932;color:white}.quiz-footer button:disabled{opacity:.45}
@media(max-width:700px){.hud{grid-template-columns:1fr 1fr;padding:12px;gap:10px}.hud h1{grid-column:1/3;grid-row:1;font-size:17px}.hud h1 span{font-size:25px}.player,.rewards{grid-row:2}.map{height:1000px}.route{inset:30px 85px}.island{width:155px;min-height:140px}.island i{font-size:50px}.i1{left:2%}.i2{right:1%;top:220px}.i3{left:3%;top:400px}.i4{right:1%;top:585px}.i5{left:3%;top:770px}.mission{right:2%;top:805px;width:190px;padding:13px 8px}.mission strong{font-size:14px}.sea-life{display:none}.bottom-nav{padding:8px 4px}.bottom-nav button{font-size:9px}.bottom-nav .start{width:82px}.answers{grid-template-columns:1fr}.quiz-footer{flex-wrap:wrap}.wallet{font-size:11px}.avatar{width:50px;height:50px;font-size:30px}.player{grid-template-columns:52px 1fr}}@media(max-width:420px){.rewards span{font-size:26px}.island{width:142px}.bottom-nav button:nth-child(2),.bottom-nav button:nth-child(4){display:none}.mission{width:175px}}