*{box-sizing:border-box}html{background:#020609;color:#f4f6fb;font-family:Arial,Helvetica,sans-serif}body{margin:0}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:2px solid #38d9ff;outline-offset:5px}svg{fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;width:100%;height:100%}.app{width:100%;max-width:600px;margin:auto;container-type:inline-size;position:relative;overflow:hidden;background:#010609 url('assets/starfield.webp') center top/100% 100%;min-height:100svh}header{height:19cqw;display:flex;align-items:center;padding:0 5.9cqw 0 7.4cqw;gap:3cqw}.brand{display:flex;align-items:center;gap:3cqw;width:38cqw;flex-shrink:0}.brand-icon{width:7.4cqw;height:7cqw;filter:drop-shadow(0 0 1.3cqw #6db9fa)}.brand strong{display:block;letter-spacing:1.25cqw;font-size:3.5cqw;font-weight:600}.brand small{font-size:1.35cqw;letter-spacing:.27cqw;display:block;margin-top:1cqw;white-space:nowrap;color:#b5c3d6}.balances{display:flex;align-items:center;border:1px solid #344653;border-radius:2.3cqw;background:#040a0dbd;height:8.8cqw;padding:1cqw 1.5cqw;gap:2cqw}.balance{display:flex;align-items:center;gap:2cqw;font-size:2.8cqw;white-space:nowrap}.balance small{display:block;font-size:1.8cqw;letter-spacing:.3cqw;color:#aebacf;margin-top:.5cqw}.coin{width:5cqw;height:5cqw;display:grid;place-items:center;border:2px solid #f4c16a;border-radius:50%;font-size:4cqw;color:#ffc36b;background:linear-gradient(130deg,#321909,#ffd688 42%,#945009 53%,#e8b35d 73%,#4a2509);text-shadow:1px 1px #573207;box-shadow:0 0 1cqw #ffae3538}.ton{border-left:1px solid #647586;padding-left:2cqw}.ton-icon{background:#079aff;border-radius:1cqw;box-shadow:0 0 2cqw #008cff;color:white;line-height:1.1;font-size:4cqw}.bell{position:relative;border:0;background:none;width:5.8cqw;height:6cqw;padding:0;color:#aab6cd;flex-shrink:0}.bell i{position:absolute;width:1.6cqw;height:1.6cqw;background:#ff0736;border-radius:50%;right:-.5cqw;top:-.6cqw;box-shadow:0 0 2cqw #ff0736}.planet-section{height:62cqw;position:relative}.earth{position:absolute;width:59cqw;height:59cqw;left:20.5cqw;top:2.5cqw;border-radius:50%;background:#05182c;box-shadow:0 0 .8cqw .3cqw #b8efff,0 0 2cqw .9cqw #058dfc,0 0 5cqw 1.5cqw #0267bba8;overflow:hidden}.earth:after{content:'';position:absolute;inset:0;border-radius:50%;box-shadow:inset 0 0 1cqw .5cqw #61c7ff;pointer-events:none}canvas{width:100%;height:100%;display:block}.side-planet{position:absolute;top:19cqw;width:36cqw;height:36cqw;border-radius:50%;background:url('assets/earth-texture.webp') center/cover;box-shadow:0 0 2cqw #a68b70;filter:sepia(1) saturate(2)}.mars{left:-29cqw;background-color:#a34c2b;background-blend-mode:luminosity}.moon{right:-29cqw;filter:grayscale(1);box-shadow:0 0 1cqw #d3dde1}.arrow{position:absolute;top:32cqw;border:1px solid #7d8c9b;border-radius:50%;width:9.3cqw;height:9.3cqw;background:#0610188c;display:grid;place-items:center;padding:2.6cqw 3cqw}.previous{left:9cqw;transform:rotate(180deg)}.next{right:9cqw}.planet-copy{text-align:center;padding-top:1.2cqw}.counter{font-size:3.3cqw;color:#a6b5cf;letter-spacing:.35cqw}h1{font-size:6.8cqw;letter-spacing:4.5cqw;padding-left:4.5cqw;margin:1.8cqw 0 1cqw;text-shadow:0 0 2cqw #91caff5e}h2{font-weight:500;font-size:2.7cqw;letter-spacing:1.25cqw;margin:0 0 1.9cqw;padding-left:1.25cqw}p{font-size:3.15cqw;line-height:1.3;color:#aab9d1;margin:0}.resources{margin:4.5cqw 4.5cqw 0;border:1px solid #546e82;border-radius:3.8cqw;padding:2.8cqw 2.5cqw 2.4cqw;background:linear-gradient(120deg,#0a172077,#02080bbf)}.resource-heading{display:flex;align-items:center;justify-content:space-between;margin:0 1cqw 2.6cqw}h3{font-size:2.7cqw;letter-spacing:.6cqw;font-weight:500;margin:0}.resource-heading>span{font-size:2.1cqw;color:#afbed6;letter-spacing:.16cqw;display:flex;gap:1.8cqw;align-items:center}.info{border:1px solid #aabbd0;border-radius:50%;width:3.4cqw;height:3.4cqw;line-height:1;padding:0;background:none;font-family:Georgia,serif;font-weight:bold;font-size:2.7cqw}.resource-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.25cqw}.resource{border:1px solid #324d61;border-radius:2.7cqw;padding:1.4cqw 1.2cqw 1.1cqw;background:linear-gradient(130deg,#101c25b8,#050c10c9);min-width:0}.gem{height:15cqw;width:100%;background-image:none;background-size:400% 100%;background-repeat:no-repeat;mix-blend-mode:screen}.gem-water{background-position:0% center}.gem-iron{background-position:33.333% center}.gem-copper{background-position:66.667% center}.gem-silicon{background-position:100% center}h4{font-size:2.9cqw;font-weight:400;text-align:center;margin:.5cqw 0 1.1cqw}.yield{height:6.8cqw;border:1px solid #4d6273;border-radius:2.5cqw;display:flex;align-items:center;justify-content:center;gap:1.2cqw;background:#050b0e80}.yield svg{width:4.6cqw;height:4.8cqw;stroke-width:1.3}.yield b{font-size:4cqw;font-weight:500}.water .yield{color:#4cccff;border-color:#1d5b7c}.copper .yield{color:#ff8961;border-color:#774534}.copper .yield svg{filter:sepia(1) saturate(4)}.expedition{margin:3.5cqw 5.7cqw 0;width:88.6cqw;height:15.3cqw;border:1px solid white;border-radius:5.3cqw;background:linear-gradient(115deg,#edf3ff,#d9e2f1 68%,#f0f4fc);color:#030a12;box-shadow:0 0 3cqw #b5d8ff38,inset 0 0 3cqw white;display:flex;align-items:center;padding:3.6cqw 4.2cqw;gap:4.6cqw;text-align:left}.rocket{width:7.6cqw;height:7.6cqw;margin-left:7.8cqw;flex-shrink:0}.expedition-text{border-left:1px solid #8398b5;padding-left:4.6cqw;white-space:nowrap}.expedition strong{font-size:3.55cqw;letter-spacing:.35cqw;display:block;font-weight:600}.expedition small{display:block;font-size:2.65cqw;color:#586e90;margin-top:1cqw}.expedition-arrow{width:2.5cqw;height:4cqw;margin-left:auto;flex-shrink:0}.pagination{display:flex;justify-content:center;gap:3cqw;margin:4.6cqw 0 8cqw}.pagination button{background:#1e2e3c;border:0;width:1.8cqw;height:1.8cqw;border-radius:50%;padding:0}.pagination .active{background:#f4f9ff;box-shadow:0 0 1.5cqw #8bbaff66}nav{border:1px solid #3e5568;border-bottom:0;border-radius:7.5cqw 7.5cqw 0 0;background:linear-gradient(#050d12dc,#050d12f5);height:28.5cqw;display:grid;grid-template-columns:repeat(5,1fr);padding:0 2cqw}nav button{border:0;background:none;color:#aab7cf;position:relative;display:flex;align-items:center;flex-direction:column;gap:2cqw;padding:4.3cqw 0 0;height:17cqw}nav svg{height:5.8cqw;width:6cqw}nav span{font-size:2.4cqw;letter-spacing:.12cqw}nav .active{color:#eff6ff;text-shadow:0 0 1cqw #3e9dff}nav .active:before{content:'';height:.3cqw;background:#00d8ff;box-shadow:0 0 2cqw #00aaff;position:absolute;top:-1px;left:22%;right:0}nav .active svg{filter:drop-shadow(0 0 1.8cqw #008bff)}.svg-defs{position:absolute;width:0;height:0;overflow:hidden}dialog{background:#091622;color:#edf5ff;border:1px solid #47748e;border-radius:20px;max-width:340px;width:85%;padding:30px;box-shadow:0 0 50px #008cff20}dialog::backdrop{background:#000b;backdrop-filter:blur(6px)}dialog h3{font-size:18px;letter-spacing:2px;margin:8px 0 20px}dialog p{font-size:16px}dialog button{background:#dce9fa;color:#06101a;border:0;border-radius:10px;padding:10px 25px;margin-top:24px}.close{position:absolute;right:10px;top:0!important;background:none!important;color:white!important;margin:0!important;font-size:24px;padding:8px!important}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}
/* Keep the generated background restrained, as in the reference. */
.app{background-image:linear-gradient(#0005,#0005),url('assets/starfield.webp')}.gem{background-size:400% auto}.mars{background-image:url('assets/mars.webp');background-size:cover;filter:none;background-blend-mode:normal;box-shadow:0 0 2cqw #c5764f66}.moon{background-image:url('assets/moon.webp');background-size:cover;filter:none}.copper .yield svg{filter:sepia(.7) saturate(3) hue-rotate(335deg)}