/* Approved moonlit-forest reference: real controls above a continuous 3D scene. */
:root{--text:#fff7ff;--muted:#c2a1e2;--line:#9371b4;--card:#251c34}
body{background:#090713}.app-shell{max-width:480px;background:linear-gradient(180deg,#10091d30 0%,#160e2520 57%,#140d2388 78%,#120c2088 100%),var(--crystal-background,url('/assets/moonlit-forest.webp')) center top/100% 100dvh no-repeat #100a1c;border-color:#473253}
.header{height:70px}.brand{font-family:Nunito,sans-serif;font-size:32px;font-weight:950;letter-spacing:-1.1px;text-shadow:0 2px 8px #130622,0 0 15px #b994e333;gap:8px}.brand-mark,.brand-mark img{width:31px;height:40px;object-fit:contain}.brand-mark{filter:drop-shadow(0 0 7px #bd6bff66)}.brand-dot{color:#dda0ff;font-size:19px;margin-top:-19px}.header-actions{gap:16px}.icon-button{color:#d7baf0;filter:drop-shadow(0 1px 2px #180b2b)}.icon-button svg{width:24px;height:24px;stroke-width:1.7}.avatar{background:linear-gradient(140deg,#9467af,#42204e);border:1px solid #c69eea;font-size:18px;width:38px;height:38px;box-shadow:inset 0 1px 8px #dbb8ed33}.avatar span{background:#44e89f;border-color:#392147}
.balance{background:linear-gradient(120deg,#2a1c38e6,#302a47bd 55%,#251d33dd);border:1px solid #b98bdf;border-radius:16px;box-shadow:inset 0 1px 0 #e3bbff3a,0 0 14px #b26ce316;backdrop-filter:blur(7px)}.balance-label{font-weight:450;color:#dbc4f2}.balance-number{font-size:26px;color:white;font-weight:750;gap:9px}.balance-gram{color:#d6b8f5}.balance-gram b{color:#dfc3fc}.coin{background:url('/assets/coin.webp') center/contain no-repeat;border:0;border-radius:0;color:transparent!important;width:26px;height:26px;filter:drop-shadow(0 1px 4px #d1852733);font-size:0}.small-arrow{color:#e6c2ff}
.asset-icon{display:inline-block;width:27px;height:27px;object-fit:contain;flex-shrink:0;filter:drop-shadow(0 2px 3px #16092766)}.hero-heading h2{font-family:Nunito;font-size:21px;font-weight:900;letter-spacing:-.3px;text-shadow:0 2px 8px #0c051c}.tag{border:1px solid #bc88d5;border-radius:10px;background:#291832b0;color:#e2bffa;padding:4px 9px;box-shadow:inset 0 1px 2px #e4bcff1c}
.is-home{padding-left:22px;padding-right:22px}.app-shell.is-home{padding-bottom:calc(78px + env(safe-area-inset-bottom,0px))}.is-home .header{height:62px;flex-basis:62px}.is-home #content{gap:8px;padding-bottom:8px}.is-home .brand{font-size:31px}.is-home .balance{padding:10px 13px;min-height:63px;border-radius:15px}.is-home .balance-label{font-size:10px;margin-bottom:4px}.is-home .balance-number{font-size:24px}.is-home .balance-number .coin{width:25px;height:25px}.is-home .balance-gram{font-size:11px}.is-home .balance-gram b{font-size:12px;margin-bottom:7px;font-weight:550}.is-home .hero-heading{margin:2px 0 0}.is-home .hero-heading h2{font-size:20px}.is-home .tag{font-size:10px}.is-home .crystal-view{margin:0 -22px}.is-home .crystal-view:before{inset:28% 8% 0;background:radial-gradient(ellipse at 50% 73%,#c06df538,#8042a710 48%,transparent 70%);filter:blur(9px)}.is-home .orbit-label{bottom:2px;left:22px;font-size:11px;color:#e3c9f7;text-shadow:0 2px 5px #130820;gap:7px}.is-home .orbit-label svg{width:15px;height:15px}
.is-home .growth-line{margin-bottom:7px;font-size:12px;color:#dfc3fa}.is-home .growth-line span{color:#d8b6ed;font-weight:550}.is-home .growth-line strong{font-size:13px;font-weight:700;color:white}.is-home .progress-track{height:7px;background:#3c254f;border:1px solid #ae7bd577;box-shadow:0 0 8px #b16fff28}.progress-fill{background:linear-gradient(90deg,#9949f6,#c97aff 60%,#f0c0fd);box-shadow:0 0 9px #d796ff66,inset 0 1px 0 #ffe4ff99}.is-home .growth-detail{margin-top:6px;font-size:10px;color:#c4a4e4}
.primary{background:url('/assets/crystal-button.webp') center/100% 100% no-repeat;background-color:transparent;border-radius:16px;box-shadow:0 0 16px #b26bf43a;color:white;text-shadow:0 2px 3px #67239488;font-weight:800;font-family:Nunito;font-size:16px;min-height:49px;gap:10px}.primary .asset-icon{width:27px;height:27px}.is-home .ad-button{min-height:48px;padding:10px 12px;font-size:17px;margin:0}.is-home .button-note{font-size:9px;line-height:13px;color:#c4a6e2;text-shadow:0 1px 4px #0c0518}
.home-adsgram{background:linear-gradient(110deg,#2b1c37e6,#292135e8);border:1px solid #aa7bcb;border-radius:15px;min-height:59px;padding:9px 11px;backdrop-filter:blur(8px);box-shadow:inset 0 1px 0 #dfb7f327}.adsgram-logo{height:37px;width:37px;flex-basis:37px;border-radius:12px;background:linear-gradient(140deg,#4fe4ff,#08a4d7 85%);border:1px solid #99f5ff66;box-shadow:inset 0 2px 4px #a4efff66,0 0 8px #0aa7f018}.adsgram-logo svg{width:25px;height:25px;stroke-width:1.5;filter:drop-shadow(0 1px 2px #087db2)}.adsgram-copy strong{font-weight:700;font-size:12px}.adsgram-copy small{font-size:10px;color:#b99acd;margin-top:4px}.adsgram-reward{gap:6px}.adsgram-reward strong{font-size:13px;gap:4px;font-weight:650}.adsgram-reward .coin{width:23px;height:23px}.adsgram-reward small{font-size:10px;color:#ceb1e8}.adsgram-chevron{color:#d9b6f5}
.bottom-nav{background:linear-gradient(180deg,#1a1122e8,#180f21ce),var(--crystal-background,url('/assets/moonlit-forest.webp')) center bottom/100% auto;border-top:1px solid #8e66ad;backdrop-filter:blur(10px);padding:10px 9px max(10px,env(safe-area-inset-bottom))}.is-home .bottom-nav{min-height:72px;padding-top:10px;padding-bottom:max(10px,env(safe-area-inset-bottom))}.nav-link{font-size:11px;gap:5px;color:#c7a7e6;text-shadow:0 2px 3px #13091d}.nav-link .asset-icon{width:30px;height:31px;filter:drop-shadow(0 2px 5px #15061d);opacity:.85}.nav-link.active{color:#fff1ff;font-weight:650}.nav-link.active .asset-icon{opacity:1;filter:drop-shadow(0 0 7px #c774ff99)}.nav-link.active:before,.is-home .nav-link.active:before{top:-11px;height:2px;width:27px;background:#f0b7ff;box-shadow:0 0 8px #d783ff}
.card,.task-row,.metric,.catalog-card{background:linear-gradient(125deg,#2d1d3bec,#24182fdb);border-color:#8a609f;backdrop-filter:blur(10px);box-shadow:inset 0 1px 0 #cda4de22}.page-head h1{font-weight:950;text-shadow:0 2px 8px #14091e}.page-sub{color:#d1b6e3;text-shadow:0 1px 3px #14091e}.section-head h2{color:#f9efff}.ref-sigil img{height:110px;object-fit:contain;filter:drop-shadow(0 0 16px #bf78f666)}.task-art{background:#5f386377}.task-art .asset-icon{width:34px;height:34px}.wallet-total{background:linear-gradient(115deg,#30223eea,#4b2d51b8)}dialog{background:linear-gradient(135deg,#362341,#23152e);border-color:#a16bc1}.secondary{background:#4b285ee8;border-color:#9763b3}
@media(max-height:680px){.is-home .header{height:53px;flex-basis:53px}.is-home #content{gap:6px}.is-home .brand{font-size:29px}.is-home .balance{min-height:57px;padding:8px 12px}.is-home .balance-label{font-size:9px}.is-home .balance-number{font-size:23px}.is-home .hero-heading h2{font-size:18px}.is-home .ad-button{min-height:44px;font-size:15px}.home-adsgram{min-height:54px;padding:7px 10px}.adsgram-logo{height:33px;width:33px;flex-basis:33px}.is-home .orbit-label{font-size:10px}.is-home .nav-link{font-size:10px}.nav-link .asset-icon{width:28px;height:29px}}
@media(max-width:360px){.is-home{padding-left:16px;padding-right:16px}.is-home .crystal-view{margin:0 -16px}.is-home .orbit-label{left:16px}.is-home .header-actions{gap:12px}.adsgram-copy strong{font-size:11px}.adsgram-copy small{font-size:9px}.adsgram-reward .coin{width:21px;height:21px}.adsgram-reward small{font-size:9px}.adsgram-reward{gap:4px}.nav-link{font-size:10px}}

/* Ten-level crystal palette and balance progress. */
.is-home #content{grid-template-rows:auto auto minmax(0,1fr) auto auto auto}
.balance{gap:14px}.balance>div{flex:0 0 auto}.level-panel{width:155px;max-width:55%;padding:0;background:none;text-align:left;color:#ecd9ff;align-self:center;cursor:pointer}.level-label{display:flex;align-items:baseline;gap:5px;font-family:Nunito,sans-serif;font-size:11px;font-weight:700}.level-label b{font-size:15px;color:white}.level-label small{font-size:10px;color:#bda0d7}.level-meter{display:flex;align-items:center;height:23px;gap:6px}.level-track{height:6px;border-radius:10px;flex:1;background:#22132fcc;border:1px solid #916aab88;overflow:hidden;box-shadow:inset 0 1px 3px #0b0618}.level-track>span{height:100%;display:block;border-radius:inherit;box-shadow:0 0 6px #c898ff77;transition:width 3.8s ease}.level-gem{width:20px;height:27px;stroke:#ead0ff;stroke-width:.8;filter:drop-shadow(0 0 4px #b685ea77);flex-shrink:0}.level-next{display:block;color:#bda4d6;font-size:8px;line-height:12px}.growth-detail,.is-home .growth-detail{font-family:Nunito,sans-serif;font-weight:800;font-size:11px;letter-spacing:.15px;color:#dfc9f5;font-variant-numeric:tabular-nums;text-shadow:0 1px 4px #110719}.is-home .hero-heading h2{font-size:clamp(16px,4.8vw,20px)}.level-gallery{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.level-choice{padding:9px 3px;background:#24162fc7;border:1px solid #704389;border-radius:12px;display:flex;flex-direction:column;align-items:center;gap:4px}.level-choice.selected{border-color:#e0b8ff;background:#653c7855}.level-choice .gallery-gem{width:29px;height:40px}.level-choice b{font-family:Nunito;font-size:13px}.level-choice span{font-size:8px;line-height:11px;color:#c9aedc;min-height:22px}.level-gallery+.dialog-text{font-size:10px}
@media(max-width:360px){.level-panel{width:137px}.growth-detail,.is-home .growth-detail{font-size:10px}.level-gallery{gap:5px}.is-home .hero-heading h2{font-size:17px}}

.magic-transfer{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:50}.nav-link.received-crystal .asset-icon{animation:crystal-arrival 1.4s ease-out}@keyframes crystal-arrival{0%,100%{transform:scale(1)}30%{transform:scale(1.4);filter:drop-shadow(0 0 16px #e7adff)}}

.live-shop-crystal{position:relative;overflow:hidden}.live-shop-crystal canvas{width:100%;height:100%;display:block}.live-shop-crystal .fallback-crystal{position:absolute;inset:0}
.settings-level{margin:20px 0 24px;font-family:Onest,sans-serif}.settings-level>span{font-size:12px;color:#cfb5df}.level-stepper{display:flex;gap:14px;align-items:center;justify-content:space-between;margin:15px 0}.level-stepper>button{width:44px;height:44px;flex-shrink:0;border:1px solid #bd95d666;border-radius:13px;background:#65437e;color:white;font-size:26px;line-height:1}.level-stepper>div{text-align:center;min-width:0}.level-stepper strong{font-size:30px;font-weight:650;font-variant-numeric:tabular-nums}.level-stepper small{font-size:14px;color:#ba9acf;font-weight:450}.level-stepper span{display:block;font-size:12px;color:#e4cdef;margin-top:5px}.settings-level p{font-size:11px;line-height:1.6;color:#b99aca}
.level-next{font-family:Onest,sans-serif;font-size:10px;font-weight:500;line-height:15px;color:#d1bddf;letter-spacing:0}
.shop-heading{display:flex;align-items:center;justify-content:space-between;margin:8px 0 20px;gap:15px}.shop-heading h1{font-family:Onest,sans-serif;font-size:28px;font-weight:750;letter-spacing:-.8px}.shop-heading p{font-size:12px;color:#d1bedf;line-height:1.5}.shop-heading>.asset-icon{width:72px;height:72px;filter:drop-shadow(0 0 16px #ae63f44a)}
.shop-summary{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:17px;border:1px solid #9a72b080;border-radius:18px;background:linear-gradient(115deg,#342443e8,#24182ee8);backdrop-filter:blur(12px);margin-bottom:24px}.shop-summary>div+div{border-left:1px solid #a779be33;padding-left:16px}.shop-summary span{font-size:10px;color:#c9b1dc}.shop-summary strong{display:flex;align-items:center;gap:6px;font-size:25px;font-weight:700;margin-top:7px;font-variant-numeric:tabular-nums}.shop-summary small{font-size:11px;font-weight:500}.shop-summary .coin{width:23px;height:23px}
.shop-inventory h2,.shop-collection h2{font-family:Onest,sans-serif;font-size:17px;font-weight:650;margin-bottom:13px;letter-spacing:-.3px}.shop-item{display:flex;align-items:center;gap:12px;padding:12px;margin-bottom:10px;border:1px solid #a978c46b;border-radius:18px;background:linear-gradient(120deg,#342442eb,#21162de8);backdrop-filter:blur(12px)}.shop-art{width:75px;height:91px;flex-shrink:0;display:grid;place-items:center;border-radius:13px;background:radial-gradient(ellipse,color-mix(in srgb,var(--gem-color) 25%,transparent),transparent 72%)}.level-gem.shop-gem{height:75px;width:53px;stroke-width:.5;filter:drop-shadow(0 5px 11px color-mix(in srgb,var(--gem-color) 45%,transparent))}.shop-item-copy{flex:1;min-width:0}.shop-item-copy>span{font-size:10px;color:#c5add7}.shop-item-copy h3{font-family:Onest,sans-serif;font-size:13px;line-height:1.45;font-weight:600;margin:5px 0 8px}.shop-item-copy strong{font-size:15px;display:flex;align-items:center;gap:5px}.shop-item-copy .coin{width:20px;height:20px}.shop-sell{padding:10px 12px;border:1px solid #c299eb80;border-radius:10px;background:linear-gradient(135deg,#9563c8,#684096);font-family:Onest,sans-serif;font-size:11px;font-weight:600;box-shadow:inset 0 1px 0 #e6c8ff33}.shop-sell:active{transform:scale(.97)}
.shop-empty{padding:23px 20px;text-align:center;border:1px solid #a978c46b;border-radius:18px;background:#25182fe8}.shop-empty>.asset-icon{width:70px;height:70px;filter:drop-shadow(0 0 15px #bd73f655)}.shop-empty h3{font-size:15px;font-weight:600;margin:12px 0 7px}.shop-empty p{font-size:12px;line-height:1.6;color:#c6add7}.shop-empty a{display:inline-flex;align-items:center;gap:9px;margin-top:17px;color:#ead2ff;font-size:12px;font-weight:600}.shop-empty a svg{width:17px;height:17px}
.shop-collection{margin-top:26px}.shop-collection .section-head h2{margin:0}.shop-catalog{display:grid;grid-template-columns:1fr 1fr;gap:12px}.shop-collect-card{position:relative;overflow:hidden;padding:13px;border:1px solid #9d72b258;border-radius:18px;background:linear-gradient(160deg,#372448ee,#20152be8);backdrop-filter:blur(12px)}.collection-level{font-size:10px;color:#cbb2dd}.collection-art{height:102px;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 60%,color-mix(in srgb,var(--gem-color) 22%,transparent),transparent 70%)}.level-gem.collection-gem{width:53px;height:79px;stroke-width:.5;filter:drop-shadow(0 5px 13px color-mix(in srgb,var(--gem-color) 45%,transparent));transform:rotate(-8deg)}.shop-collect-card:nth-child(even) .collection-gem{transform:rotate(8deg)}.shop-collect-card h3{font-family:Onest,sans-serif;font-size:12px;line-height:1.45;font-weight:600;min-height:35px}.shop-collect-card p{font-size:9px;line-height:1.5;color:#bda2ce;margin-top:5px}.shop-collect-card.is-locked{border-color:#78568b66}.shop-collect-card.is-locked .collection-gem{opacity:.72}
@media(max-width:360px){.shop-item{gap:8px;padding:10px}.shop-art{width:58px;height:82px}.shop-item-copy h3{font-size:12px}.shop-sell{padding:9px}.shop-catalog{gap:9px}.shop-summary{padding:13px}.shop-summary strong{font-size:23px}}