/* UC Diamonds — Neon Royal V1. Visual-only progressive enhancement.
   Existing IDs, forms, state, API and Telegram integrations remain untouched. */
:root {
 --bg:#080d24;--surface:#101a38;--surface-2:#19244a;
 --ink:#f6f8ff;--muted:#b5c2e7;--line:#8d77f13b;
 --violet:#8b39ff;--cyan:#20dcff;--gold:#ffd16d;
 --nav:#08132bf2;color-scheme:dark;
}
body {
 background:radial-gradient(ellipse 85% 35% at 12% 0%,#5623ac52,transparent 75%),
 radial-gradient(ellipse 70% 30% at 92% 35%,#008bcb24,transparent 78%),var(--bg);
 background-attachment:fixed;
}
.shell{max-width:620px;min-width:0}
.page,.panel,.hero,.wallet-card,.profile-card{min-width:0}
.app-header{padding:7px 0 12px;border-bottom:1px solid #8e83ff24}
.identity img{filter:drop-shadow(0 0 12px #17d7f4a6)}
.brand{font-size:20px;letter-spacing:.15px;text-shadow:0 0 18px #62b6ff66}
.avatar{background:linear-gradient(145deg,#28145d,#092d58);border:1px solid #b48aff8a;box-shadow:0 0 16px #6c3dff3b}
.connection{color:#b9c7ec}
.live-dot{box-shadow:0 0 9px #29d7a1}
h1,h2,h3{color:#fff}
.section-heading h1{font-size:clamp(23px,5.7vw,29px);line-height:1.45}
.section-heading h2{font-size:17px}
.eyebrow{color:#b3c3f4;letter-spacing:.5px}
.hero{
 min-height:246px;isolation:isolate;
 background:radial-gradient(circle at 75% 35%,#008fff6e,transparent 31%),
 radial-gradient(circle at 8% 95%,#aa27ff68,transparent 48%),
 linear-gradient(125deg,#131341,#080f33 65%,#071f48);
 border:1px solid #b37bff9e;
 box-shadow:0 16px 45px #03051a99,inset 0 1px #ffffff44,0 0 24px #6e30ff44;
}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(112deg,transparent 15%,#ffffff0c 45%,transparent 75%);transform:translateX(110%);animation:royal-sheen 9s ease-in-out infinite}
.hero .balance{color:#fff;text-shadow:0 0 18px #22bfff9e;font-size:clamp(37px,9vw,52px)}
.coin-art{filter:drop-shadow(0 0 19px #00cfff9c)}
.coin-face{
 border:2px solid #b7f7ff;
 border-radius:23px;
 background:linear-gradient(145deg,#c5ffff,#28baff 36%,#3151ef 70%,#bb56ff);
 color:#e9ffff;box-shadow:0 0 17px #3ccfff,0 0 36px #7d38ff88,inset 0 0 20px #ffffff69;
 animation:royal-float 4.8s ease-in-out infinite;
}
.coin-face .i{filter:drop-shadow(0 0 6px #fff)}
.orbit{border-color:#47d9ff88;box-shadow:0 0 15px #2ebeff44}
.hero-link{color:#8beeff}
.daily-card{
 border:1px solid #ffd16d88;
 background:radial-gradient(circle at 90% 20%,#ffa92835,transparent 40%),linear-gradient(120deg,#261940,#111a37);
 box-shadow:0 8px 28px #0005,inset 0 1px #ffffff20;
}
.daily-card .icon-box{box-shadow:0 0 17px #f6a91b44}
.gold-button{background:linear-gradient(110deg,#ffe98c,#ffad45);color:#2d1905;box-shadow:0 5px 18px #ffb33855}
button:not(:disabled):active{transform:scale(.97)}
.feature,.panel,.wallet-card,.profile-card,.store-intro,.reward-card,.challenge-panel{
 border-color:#8873ed55;
 box-shadow:0 8px 28px #02092075,inset 0 1px #ffffff14;
}
.game-feature,.memory-card{background:linear-gradient(150deg,#48219b80,#111b3b 75%)}
.ad-feature,.quiz-card{background:linear-gradient(150deg,#0078a63f,#101b3b 75%)}
.math-card{background:linear-gradient(150deg,#9e691c55,#101b3b 75%)}
.sequence-card{background:linear-gradient(150deg,#176f6950,#101b3b 75%)}
.feature-art>.i{filter:drop-shadow(0 0 10px currentColor)}
.game-card button:not(:disabled),.feature button:not(:disabled),#wallet-refresh:not(:disabled){
 background:linear-gradient(105deg,#187cff,#a22dff);
 box-shadow:0 4px 15px #6b32ff55;
}
.shop-banner,.referral-banner{
 border:1px solid #956fff75;
 box-shadow:0 7px 22px #04092466;
}
.shop-banner{background:linear-gradient(120deg,#b4771e4d,#451a8873,#0d2142)}
.store-intro{background:linear-gradient(120deg,#3c1b7e,#0d214a)}
.wallet-card{background:radial-gradient(circle at 10% 0%,#3d8bff66,transparent 55%),linear-gradient(145deg,#25115d,#0c2046)}
.wallet-total,.wallet-card .balance{color:#fff;text-shadow:0 0 19px #43c9ff8c}
.profile-card{background:radial-gradient(circle at 10% 0%,#8334ff55,transparent 50%),linear-gradient(145deg,#131a42,#0b1a36)}
.bottom-nav{background:#080f2cf2;border-color:#7b65e15c;box-shadow:0 -7px 30px #000a}
.bottom-nav [aria-current="page"]{background:linear-gradient(155deg,#8e37ff99,#222e7e77);color:#fff;box-shadow:0 0 17px #8537ff66}
.bottom-nav [aria-current="page"]::before{background:#51ddff;box-shadow:0 0 11px #20dcff}
button:focus-visible,a:focus-visible{outline-color:#52e8ff}

@keyframes royal-float{0%,100%{transform:translateY(0) rotate(-17deg)}50%{transform:translateY(-7px) rotate(-13deg)}}
@keyframes royal-sheen{0%,72%,100%{transform:translateX(110%)}84%{transform:translateX(-110%)}}
@media(max-width:380px){.shell{padding-inline:14px}.hero{padding:18px;min-height:210px}.coin-art{width:76px;transform:scale(.8);transform-origin:center}.daily-card{flex-wrap:wrap}.daily-action{margin-inline-start:auto}.game-grid,.feature-grid{gap:9px}.game-card{padding:13px 10px}}
@media(prefers-reduced-motion:reduce){.hero::before,.coin-face{animation:none!important}}
:root:has(#reduce-motion:checked) .hero::before,:root:has(#reduce-motion:checked) .coin-face{animation:none!important}


/* V1.1 — cinematic home stage, all artwork inline SVG and CSS; no remote assets */
.royal-showcase{position:relative;isolation:isolate;overflow:hidden;text-align:center;margin:14px 0 22px;padding:19px 16px 22px;border-radius:28px;border:1px solid #7956e47a;background:radial-gradient(ellipse 66% 55% at 50% 32%,#5933ff6e,transparent 75%),radial-gradient(ellipse 75% 30% at 50% 84%,#ff8b3c2b,transparent 78%),linear-gradient(180deg,#0a1435,#131344 65%,#0b183a);box-shadow:inset 0 1px #ffffff45,0 18px 35px #02051c9c,0 0 26px #642cff30}
.royal-showcase::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.6;background-image:radial-gradient(circle,#c2efff 1px,transparent 1.5px),radial-gradient(circle,#cda7ff 1px,transparent 1.5px);background-size:69px 83px,97px 113px;background-position:13px 22px,46px 65px;pointer-events:none}
.royal-showcase__eyebrow{font:700 10px system-ui,sans-serif;letter-spacing:2px;color:#9bdfff}
.royal-showcase__art{position:relative;height:240px;display:grid;place-items:center;margin:3px auto 2px}
.royal-showcase__halo{position:absolute;width:190px;height:110px;border-radius:50%;top:75px;z-index:0;background:#713eff8a;filter:blur(39px)}
.royal-showcase__gem{position:absolute;z-index:2;inset:auto 0 0 auto;width:94px;height:86px;filter:drop-shadow(0 0 12px #2cddff);animation:royal-gem-rise 5s ease-in-out infinite}
.royal-showcase__spark{position:absolute;z-index:3;color:#d8ffff;text-shadow:0 0 13px #4eeaff;font-size:29px}
.royal-showcase__spark--one{top:30px;right:16%}.royal-showcase__spark--two{bottom:32px;left:15%;font-size:22px}
.royal-showcase h2{font-size:clamp(20px,5.4vw,28px);line-height:1.45;margin:4px auto 5px;max-width:330px;color:#ffe4a0;text-shadow:0 2px 15px #ffc84e5e}
.royal-showcase h2 span{display:block;color:#fff}
.royal-showcase p{font-size:12px;color:#d3defd;margin:4px 0 15px}
.royal-showcase__cta{width:min(100%,320px);min-height:51px;background:linear-gradient(100deg,#087fff,#9b31ff 85%);border:1px solid #b7acffb0;box-shadow:0 0 20px #7d2dff80,inset 0 1px #ffffff63;font-size:14px}
.royal-showcase__cta .i{width:19px;height:19px}
@keyframes royal-gem-rise{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-9px) rotate(2deg)}}
@media(max-width:360px){.royal-showcase{padding-inline:12px}.royal-showcase__art{height:210px}.royal-showcase__gem{width:76px;height:70px}.royal-showcase h2{font-size:20px}}
@media(prefers-reduced-motion:reduce){.royal-showcase__gem{animation:none}}
:root:has(#reduce-motion:checked) .royal-showcase__gem{animation:none}

/* V1.2: shared visual polish across five core screens */
.game-card{border-color:#8d77ff70;box-shadow:inset 0 1px #ffffff20,0 10px 25px #02072088;transition:transform .2s,border-color .2s}
.game-card>.i{filter:drop-shadow(0 0 12px currentColor)}
.game-card h2{font-size:16px}
#rewards .store-intro{border-color:#e2ac6477;box-shadow:0 9px 30px #05092388}
.vault-art{filter:drop-shadow(0 0 13px #ffc04899)}
.reward-card{background:radial-gradient(circle at 50% 10%,#6039a866,transparent 55%),linear-gradient(160deg,#19244d,#0b1530);border:1px solid #8e7bff7a;box-shadow:inset 0 1px #ffffff28,0 10px 25px #01071b99}
.reward-art{background:radial-gradient(ellipse,#626cff66,transparent 70%)}
.reward-art .i{filter:drop-shadow(0 0 12px #ffbb40)}
.reward-card .reward-price{color:#ffe19c;text-shadow:0 0 10px #ffbc5555}
.reward-card button:not(:disabled){background:linear-gradient(100deg,#168aff,#a333ff);color:#fff}
.wallet-card{position:relative;overflow:hidden;border-color:#50d9ff99;box-shadow:0 15px 35px #020a20b0,0 0 22px #007bff38}
.wallet-card::before{content:"";position:absolute;inset-inline-end:-65px;top:-70px;width:175px;height:175px;border:1px solid #a5eaff44;border-radius:50%;box-shadow:0 0 0 25px #ffffff08,0 0 0 52px #ffffff05;pointer-events:none}
.wallet-total,.wallet-card .balance{overflow-wrap:anywhere}
.profile-card{position:relative;overflow:hidden;border-color:#976cff99;box-shadow:0 12px 32px #0208209c}
.profile-avatar{width:80px;height:80px;border-radius:50%;border:2px solid #a47dff;background:radial-gradient(circle at 30% 20%,#613dff,#102859);box-shadow:0 0 0 6px #8a40ff1e,0 0 26px #8c45ff99}
.bottom-nav [aria-current="page"] .i{filter:drop-shadow(0 0 8px #b283ff)}
@media(hover:hover) and (pointer:fine){.game-card:hover{transform:translateY(-3px);border-color:#b3a1ff}}
@media(max-width:330px){.game-grid,.reward-grid{grid-template-columns:1fr}}
:root[data-theme="light"]{color-scheme:light;--bg:#f1f3ff;--surface:#fff;--surface-2:#e8eaff;--ink:#182448;--muted:#526181;--line:#5941b42e;--nav:#fffffff2}
:root[data-theme="light"] body{background:radial-gradient(ellipse at 10% 0,#d7caff,transparent 60%),#f1f3ff}
:root[data-theme="light"] h1,:root[data-theme="light"] h2,:root[data-theme="light"] h3{color:#172449}
:root[data-theme="light"] .brand{color:#192653;text-shadow:none}
:root[data-theme="light"] .game-card,:root[data-theme="light"] .reward-card{background:linear-gradient(145deg,#fff,#eef0ff);color:#182448;box-shadow:0 7px 22px #333d7519}
:root[data-theme="light"] .reward-card .reward-price{color:#7441a9;text-shadow:none}
:root[data-theme="light"] .wallet-card{background:linear-gradient(145deg,#30277e,#11619b);color:#fff}
:root[data-theme="light"] .wallet-card .balance,:root[data-theme="light"] .wallet-card .wallet-total{color:#fff}
:root[data-theme="light"] .profile-card{background:linear-gradient(145deg,#fff,#f0eaff)}
:root[data-theme="light"] .bottom-nav [aria-current="page"]{color:#fff}
:root[data-theme="light"] .royal-showcase h2{color:#ffe4a0}
:root[data-theme="light"] .royal-showcase h2 span{color:#fff}
:root[data-theme="light"] .royal-showcase p{color:#d3defd}


.royal-tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:15px 0 22px}
.royal-tool{position:relative;min-width:0;min-height:140px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;text-align:start;gap:10px;padding:16px;border:1px solid #8c6cff91;border-radius:21px;color:#fff;background:radial-gradient(circle at 85% 8%,#9b32ff55,transparent 55%),linear-gradient(155deg,#22204c,#0d1b39);box-shadow:inset 0 1px #ffffff31,0 12px 26px #0509218a}
.royal-tool--images{border-color:#3bdfff8a;background:radial-gradient(circle at 80% 10%,#02aeea55,transparent 56%),linear-gradient(155deg,#132f55,#0e1938)}
.royal-tool__icon{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;font-size:30px;color:#cdb5ff;background:#7c3cff35;text-shadow:0 0 14px #b174ff;box-shadow:0 0 15px #873bff77}
.royal-tool--images .royal-tool__icon{color:#9af3ff;background:#00bcff2b;text-shadow:0 0 12px #15ddff}
.royal-tool strong{display:block;font-size:14px;line-height:1.5}
.royal-tool small{display:block;color:#c4d1f6;font-size:10px;line-height:1.7;margin-top:3px}
.royal-tool__arrow{position:absolute;inset-inline-end:13px;bottom:15px;color:#6fe7ff}
.creator-studio .creator-tabs button[aria-pressed="true"],.image-studio .image-presets button[aria-pressed="true"]{background:linear-gradient(110deg,#147eff,#923bff);color:#fff}
@media(max-width:345px){.royal-tools{gap:8px}.royal-tool{padding:12px}.royal-tool strong{font-size:12px}}


/* Neon Guardian illustration layered behind the diamond, no runtime dependencies */
.royal-showcase__guardian{position:absolute;inset:0;margin:auto;width:min(78%,225px);height:238px;object-fit:contain;z-index:1;filter:drop-shadow(0 0 15px #563eff88);animation:royal-guardian-float 6s ease-in-out infinite}
@keyframes royal-guardian-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@media(max-width:360px){.royal-showcase__guardian{height:208px;width:min(78%,205px)}}
@media(prefers-reduced-motion:reduce){.royal-showcase__guardian{animation:none}}
:root:has(#reduce-motion:checked) .royal-showcase__guardian{animation:none}


/* V1.4 — consistent Neon Royal creator studios and XO arena */
.creator-studio .creator-panel,.image-studio .image-controls,.image-studio .image-preview{border-color:#8d70ff8c;background:radial-gradient(circle at 90% 0%,#6738d935,transparent 50%),linear-gradient(145deg,#1b1b47,#0d1a38);box-shadow:0 12px 29px #0308208c,inset 0 1px #ffffff20}
.creator-studio .creator-result{background:linear-gradient(110deg,#18234a,#101a35);border-color:#846ee17a}
.creator-studio .creator-symbol-grid button{background:#1a2350;border-color:#8d73e677;color:#d9f5ff}
.creator-studio .creator-primary{background:linear-gradient(105deg,#1687ff,#a12fff);box-shadow:0 0 18px #7e39ff55}
.image-studio .image-presets button,.creator-studio .creator-tabs button{border-color:#8d74e18c}
.image-studio .image-presets [aria-pressed="true"],.creator-studio .creator-tabs [aria-pressed="true"]{background:linear-gradient(110deg,#1688ff,#a52cff);color:#fff;box-shadow:0 0 16px #783bff75}
.image-studio .image-preview canvas{box-shadow:0 0 0 1px #77dfff6b,0 0 20px #197aff3b}
.crystal-arena{background:radial-gradient(circle at 80% 0%,#7833e94d,transparent 50%),linear-gradient(155deg,#11183b,#070e26);border:1px solid #785afc55}
.crystal-arena .arena-glass{border-color:#ab79ff99;background:linear-gradient(145deg,#272157,#111d3d);box-shadow:inset 0 1px #ffffff38,0 12px 26px #02071d99}
.crystal-arena .arena-board{border-color:#7a5fffa6;background:linear-gradient(145deg,#1b2351,#0d1b37);box-shadow:0 0 22px #713aff48}
.crystal-arena .arena-board button{border-color:#6e81e4a8;box-shadow:inset 0 0 16px #3756ff22}
.crystal-arena .arena-primary{background:linear-gradient(100deg,#098cff,#ad2cff);box-shadow:0 0 18px #713cff77}
.crystal-arena .arena-turn{border-color:#49e3ff;box-shadow:0 0 15px #00c9ff3d}
:root[data-theme="light"] .creator-studio .creator-panel,:root[data-theme="light"] .image-studio .image-controls,:root[data-theme="light"] .image-studio .image-preview{background:linear-gradient(145deg,#fff,#eeecff);color:#19264c}
:root[data-theme="light"] .creator-studio .creator-result,:root[data-theme="light"] .creator-studio .creator-symbol-grid button{background:#f3f0ff;color:#19264c}
@media(prefers-reduced-motion:reduce){.crystal-arena .arena-primary{transition:none}}

/* Dark Neon surfaces keep readable foregrounds when Telegram selects light mode.
   Local tokens prevent the light page palette leaking into the arcade/cards. */
:root[data-theme="light"] :is(.hero,.feature,.shop-banner,.store-intro,.wallet-card,.crystal-arena){
 --ink:#f6f8ff;--muted:#d3defd;--cyan:#20dcff;--gold:#ffd16d;
 color:var(--ink);background-color:#101a38;
}
:root[data-theme="light"] :is(.feature,.store-intro,.crystal-arena) :is(h1,h2,h3){color:var(--ink)}
:root[data-theme="light"] .feature .feature-action{color:var(--cyan)}
:root[data-theme="light"] .connection{color:var(--muted)}
:root[data-theme="light"] .bottom-nav{--muted:#b5c2e7}
