/* Crystal City Premium Home — isolated overrides, loaded last. */

:root {
    --premium-line: rgba(151, 199, 255, .16);
    --premium-panel: rgba(13, 18, 38, .76);
    --premium-cyan: #8deaff;
    --premium-violet: #aa8cff;
    --premium-mint: #65f3bd;
    --premium-gold: #ffd56a;
}

/* v16 — Rune Words & Crystal Blocks premium playfields */
.rw-game,.cb-game{position:relative;overflow:hidden;margin:12px 0;padding:24px 18px;border:1px solid rgba(105,255,210,.2);border-radius:28px;background:radial-gradient(circle at 85% 5%,rgba(132,91,255,.2),transparent 34%),linear-gradient(145deg,rgba(11,74,59,.92),rgba(5,25,27,.98));box-shadow:inset 0 1px rgba(255,255,255,.14),0 24px 54px rgba(0,0,0,.35)}
.rw-game:before,.cb-game:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 25%,rgba(255,255,255,.055) 48%,transparent 70%);transform:translateX(-100%);animation:premiumSweep 7s infinite}
.rw-kicker,.cb-kicker{color:#ffcf70;font-size:11px;font-weight:900;letter-spacing:.22em;text-transform:uppercase}.rw-game h2,.cb-game h2{margin:7px 0 8px;font-size:27px;color:#fff}.rw-clue,.cb-game>p{min-height:42px;margin:0 0 18px;color:#aab9ba;line-height:1.5}
.rw-aura{position:absolute;right:20px;top:18px;width:58px;height:58px;display:grid;place-items:center;border-radius:50%;color:#6fffd5;font-size:30px;background:radial-gradient(circle,rgba(91,255,207,.26),transparent 68%);filter:drop-shadow(0 0 12px #48e7bd);animation:float 3s ease-in-out infinite}
.rw-slots,.rw-letters{display:flex;justify-content:center;flex-wrap:wrap;gap:7px}.rw-slots{min-height:55px;margin:18px 0}.rw-slots button{width:39px;height:51px;border:0;border-bottom:2px solid rgba(109,255,215,.55);border-radius:10px 10px 5px 5px;background:rgba(2,18,20,.5);color:#fff;font-size:22px;font-weight:900}.rw-slots button.filled{background:linear-gradient(145deg,#1b8a6e,#10453f);box-shadow:0 9px 20px rgba(0,0,0,.25),inset 0 1px rgba(255,255,255,.2)}
.rw-letters{padding:14px 8px;border-radius:22px;background:rgba(1,13,16,.32)}.rw-letter{width:43px;height:48px;border:1px solid rgba(255,255,255,.18);border-radius:13px;color:#08251f;background:linear-gradient(145deg,#f9db82,#60efcf);font-size:20px;font-weight:950;box-shadow:0 8px 0 #17483e,0 12px 18px rgba(0,0,0,.28);transition:.16s}.rw-letter:active{transform:translateY(6px);box-shadow:0 2px 0 #17483e}.rw-letter:disabled{opacity:.15;transform:scale(.86)}
.rw-feedback{height:25px;text-align:center;font-weight:900;letter-spacing:.08em}.rw-feedback.good{color:#69f7c7}.rw-feedback.bad{color:#ff8291}.rw-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:18px}.rw-actions button{min-height:49px;border-radius:15px;font-weight:900}.rw-tool{border:1px solid rgba(255,255,255,.12);color:#c2d2d0;background:rgba(255,255,255,.06)}.rw-submit{grid-column:1/-1;border:0;color:#062b22;background:linear-gradient(100deg,#ffce72,#63f2cd);box-shadow:0 10px 25px rgba(63,221,176,.2)}.rw-submit b{float:right;font-size:20px}
.cb-board{display:grid;grid-template-columns:repeat(8,1fr);gap:4px;aspect-ratio:1;padding:8px;border-radius:22px;background:rgba(0,12,17,.6);border:1px solid rgba(255,255,255,.09);box-shadow:inset 0 10px 30px rgba(0,0,0,.4)}.cb-cell{border:1px solid rgba(100,225,190,.1);border-radius:5px;background:rgba(109,255,213,.045);transition:.18s}.cb-cell.filled{border-color:#d5ff9c;background:linear-gradient(145deg,#8affd6,#198469);box-shadow:inset 2px 2px rgba(255,255,255,.45),inset -3px -3px rgba(0,45,38,.45),0 0 9px rgba(88,255,204,.35);animation:blockLand .24s ease}.cb-board.invalid{animation:shake .22s ease}.cb-dock{display:flex;justify-content:space-between;align-items:center;min-height:82px;margin-top:14px;padding:12px 17px;border-radius:19px;background:linear-gradient(135deg,rgba(255,255,255,.08),rgba(62,255,197,.06));border:1px solid rgba(255,255,255,.1)}.cb-dock small{display:block;margin-bottom:7px;color:#91a8a5;text-transform:uppercase;letter-spacing:.15em}.cb-preview{display:grid;gap:3px;min-height:18px;color:#68f3cc;font-weight:900}.cb-preview i{width:18px;height:18px;border-radius:4px;background:rgba(255,255,255,.05)}.cb-preview i.on{background:linear-gradient(145deg,#ffd56e,#4bffd0);box-shadow:0 0 8px rgba(81,255,204,.4)}#cb-bonus{opacity:0;color:#ffd36e;letter-spacing:.12em;transform:scale(.8);transition:.25s}#cb-bonus.show{opacity:1;transform:scale(1)}
@keyframes blockLand{from{transform:scale(.4) rotate(12deg)}to{transform:scale(1)}}
@media(max-width:370px){.rw-slots,.rw-letters{gap:5px}.rw-slots button{width:34px}.rw-letter{width:38px}.rw-game,.cb-game{padding:20px 13px}}

/* v17 — falling Crystal Blocks arcade */
.cb-falling{padding:18px 15px}.cb-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.cb-title-row h2{font-size:23px}.cb-next{min-width:62px;padding:8px 10px;border:1px solid rgba(255,255,255,.12);border-radius:13px;background:rgba(0,14,16,.4);text-align:center}.cb-next small{display:block;margin-bottom:5px;color:#8ea7a3;font-size:8px;letter-spacing:.12em;text-transform:uppercase}.cb-next>div{display:grid;justify-content:center;gap:2px;min-height:18px}.cb-next i{width:8px;height:8px;border-radius:2px;background:transparent}.cb-next i.on{background:#6affd3;box-shadow:0 0 6px rgba(83,255,204,.6)}
.cb-board.falling{position:relative;grid-template-columns:repeat(10,1fr);gap:2px;width:min(100%,294px);aspect-ratio:10/16;margin:8px auto 13px;padding:7px;border-radius:17px;background:linear-gradient(rgba(68,255,204,.025),rgba(0,0,0,.18)),repeating-linear-gradient(0deg,transparent 0 17px,rgba(255,255,255,.018) 18px);border-color:rgba(95,255,208,.23);box-shadow:inset 0 0 35px rgba(0,0,0,.64),0 16px 30px rgba(0,0,0,.28)}.cb-board.falling .cb-cell{min-width:0;border-radius:3px;border-color:rgba(85,226,186,.08)}.cb-board.falling .cb-cell.active{background:linear-gradient(145deg,#fff0a1,#5dffd2);box-shadow:inset 1px 1px rgba(255,255,255,.75),inset -2px -2px rgba(0,60,48,.35),0 0 9px rgba(83,255,204,.55)}.cb-board.falling .cb-cell.ghost{border:1px dashed rgba(255,223,128,.55);background:rgba(255,220,115,.06)}.cb-board.falling .cb-cell.color-2,.cb-board.falling .cb-cell.color-5{background:linear-gradient(145deg,#b793ff,#5e38b3)}.cb-board.falling .cb-cell.color-3{background:linear-gradient(145deg,#ffe277,#d78520)}.cb-board.falling .cb-cell.color-4{background:linear-gradient(145deg,#75ddff,#187a9c)}.cb-board.falling .cb-cell.color-6{background:linear-gradient(145deg,#ff8c9f,#a42d53)}.cb-board.falling .cb-cell.clearing{animation:lineBurst .28s ease both}
.cb-controls{display:grid;grid-template-columns:1fr 1fr 1fr;gap:9px}.cb-controls button{height:49px;border:1px solid rgba(255,255,255,.13);border-radius:15px;color:#d7fff3;background:linear-gradient(145deg,rgba(44,116,94,.72),rgba(10,52,47,.92));font-size:19px;font-weight:950;box-shadow:inset 0 1px rgba(255,255,255,.12),0 7px 15px rgba(0,0,0,.22);touch-action:none}.cb-controls button:active{transform:translateY(2px);filter:brightness(1.25)}.cb-controls .rotate{color:#08271f;background:linear-gradient(145deg,#ffd46f,#63f4ce)}.cb-controls .drop{grid-column:1/-1;height:45px;color:#06271f;background:linear-gradient(100deg,#69ffd3,#d2ff8b);font-size:14px;letter-spacing:.08em}.cb-flash{position:absolute;z-index:3;left:50%;top:49%;opacity:0;padding:9px 18px;border-radius:50px;color:#06261e;background:#ffdc75;font-size:13px;font-weight:950;letter-spacing:.13em;transform:translate(-50%,-50%) scale(.5);pointer-events:none}.cb-flash.show{animation:clearFlash .5s ease}
@keyframes lineBurst{50%{background:#fff;transform:scale(1.14);box-shadow:0 0 15px #ffdd75}to{opacity:0;transform:scale(.2)}}@keyframes clearFlash{40%{opacity:1;transform:translate(-50%,-50%) scale(1.05)}to{opacity:0;transform:translate(-50%,-70%) scale(1)}}

/* v18 — original platform adventure & neon racer */
.runner-game,.racer-game{position:relative;overflow:hidden;margin:12px 0;padding:16px;border:1px solid rgba(99,255,210,.22);border-radius:27px;background:radial-gradient(circle at 90% 0,rgba(91,255,201,.17),transparent 34%),linear-gradient(150deg,#0b493d,#041b20 68%,#07121b);box-shadow:inset 0 1px rgba(255,255,255,.13),0 22px 48px rgba(0,0,0,.35)}.runner-head,.racer-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}.runner-head span,.racer-head span{color:#ffd36e;font-size:10px;font-weight:950;letter-spacing:.18em;text-transform:uppercase}.runner-head h2,.racer-head h2{margin:5px 0 0;color:#fff;font-size:23px}.runner-head b,.racer-head b{padding:7px 9px;border:1px solid rgba(255,255,255,.12);border-radius:11px;color:#69f4ce;background:rgba(0,0,0,.18);font-size:10px;letter-spacing:.1em}
#runner-canvas,#racer-canvas{display:block;width:100%;height:330px;border:1px solid rgba(96,255,213,.17);border-radius:19px;background:#061b1e;box-shadow:inset 0 0 34px rgba(0,0,0,.55)}.runner-controls,.racer-controls{display:grid;grid-template-columns:1fr 1.35fr 1fr;gap:9px;margin-top:12px}.runner-controls button,.racer-controls button{height:54px;border:1px solid rgba(255,255,255,.13);border-radius:17px;color:#d8fff4;background:linear-gradient(145deg,rgba(50,130,103,.76),rgba(7,51,46,.94));font-size:20px;font-weight:950;box-shadow:inset 0 1px rgba(255,255,255,.14),0 8px 16px rgba(0,0,0,.25);touch-action:none}.runner-controls button:active,.racer-controls button:active{transform:translateY(2px);filter:brightness(1.25)}.runner-controls .jump,.racer-controls .boost{color:#06271f;background:linear-gradient(145deg,#ffda76,#62f5cd)}.runner-controls .jump span{display:block;font-size:8px;letter-spacing:.12em;text-transform:uppercase}.racer-game{background:radial-gradient(circle at 50% 0,rgba(95,76,255,.22),transparent 37%),linear-gradient(160deg,#11163c,#081d26 58%,#04131a)}.racer-game.crashed{animation:raceCrash .32s ease}.racer-game.boosting #racer-canvas{filter:saturate(1.5) brightness(1.15);box-shadow:inset 0 0 35px rgba(0,0,0,.5),0 0 22px rgba(85,255,211,.25)}.racer-controls .boost{font-size:13px;letter-spacing:.08em}@keyframes raceCrash{25%{transform:translateX(-5px);filter:hue-rotate(70deg)}50%{transform:translateX(6px)}75%{transform:translateX(-3px)}}
@media(max-width:380px){#runner-canvas,#racer-canvas{height:300px}.runner-game,.racer-game{padding:13px}.runner-controls button,.racer-controls button{height:50px}}

body {
    background:
        radial-gradient(700px 460px at 50% -80px, rgba(87, 145, 255, .18), transparent 62%),
        radial-gradient(560px 520px at 108% 28%, rgba(136, 91, 255, .12), transparent 68%),
        linear-gradient(180deg, #060915 0%, #050713 52%, #04050c 100%);
}

/* Compact account rail. It scrolls away instead of covering content. */
.topbar {
    position: relative;
    top: auto;
    z-index: 30;
    padding: 9px 12px 10px;
    gap: 8px;
    border-radius: 0 0 22px 22px;
    background:
        radial-gradient(250px 90px at 12% 0%, rgba(96, 181, 255, .20), transparent 75%),
        linear-gradient(180deg, rgba(32, 42, 70, .94), rgba(16, 22, 45, .96));
    border-bottom-color: rgba(156, 203, 255, .16);
    box-shadow: 0 14px 36px rgba(0, 0, 0, .30), inset 0 1px rgba(255,255,255,.12);
}
.topbar-left { gap: 9px; }
.topbar-avatar {
    width: 38px;
    height: 38px;
    overflow: hidden;
    border: 2px solid rgba(144, 231, 255, .66);
    background: linear-gradient(135deg, var(--premium-violet), var(--premium-cyan));
    box-shadow: 0 0 0 3px rgba(124,231,255,.08), 0 0 18px rgba(124,231,255,.30);
}
.topbar-avatar img, .profile-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: inherit;
}
.topbar-name { max-width: 108px; font-size: 13px; }
.topbar-tier { color: rgba(190, 207, 238, .56); font-size: 9px; }
.topbar-right { gap: 5px; }
.pill {
    min-width: 0;
    padding: 5px 8px;
    gap: 4px;
    font-size: 11px;
    background: linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.055));
    border-color: rgba(255,255,255,.13);
    box-shadow: inset 0 1px rgba(255,255,255,.10);
}
.pill-icon-img { display: block !important; width: 16px !important; height: 16px !important; flex: 0 0 16px; object-fit: contain; }
.pill-token { display: none; }
.icon-btn { width: 34px; height: 34px; border-radius: 12px; }

.page-root { padding: 15px 14px calc(78px + var(--safe-bottom)); }
.page { gap: 20px; }

/* Hero */
.hero-card {
    min-height: 250px;
    padding: 19px 17px 17px;
    border-radius: 27px;
    background:
        linear-gradient(145deg, rgba(50, 72, 116, .40), rgba(31, 27, 82, .34) 58%, rgba(14, 18, 39, .70)),
        rgba(14, 19, 41, .80);
    border: 1px solid rgba(158, 207, 255, .18);
    box-shadow: 0 20px 55px rgba(0,0,0,.34), inset 0 1px rgba(255,255,255,.13);
    isolation: isolate;
}
.hero-card::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(115deg, rgba(255,255,255,.09), transparent 25%, transparent 70%, rgba(124,231,255,.05));
    pointer-events: none;
}
.hero-card::after { opacity: .65; }
.hero-aurora { position: absolute; z-index: -1; border-radius: 50%; filter: blur(34px); pointer-events: none; }
.hero-aurora-one { width: 180px; height: 150px; right: -35px; top: -35px; background: rgba(99, 214, 255, .30); animation: aurora-drift 7s ease-in-out infinite alternate; }
.hero-aurora-two { width: 180px; height: 150px; left: 28%; bottom: -90px; background: rgba(157, 105, 255, .28); animation: aurora-drift 9s ease-in-out -2s infinite alternate-reverse; }
.hero-head { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0,1fr) 76px; align-items: center; gap: 8px; }
.hero-title { color: rgba(197, 216, 244, .56); font-size: 9px; letter-spacing: .18em; }
.hero-greeting { margin-top: 6px; font-size: clamp(20px, 5.6vw, 25px); line-height: 1.15; letter-spacing: -.025em; }
.hero-subtitle { margin-top: 5px; color: var(--text-2); font-size: 10px; }
.hero-emblem { width: 76px; height: 76px; display: grid; place-items: center; animation: crystal-float 4.6s ease-in-out infinite; }
.hero-emblem img { width: 74px; height: 74px; object-fit: contain; filter: drop-shadow(0 10px 16px rgba(0,0,0,.38)) drop-shadow(0 0 14px rgba(99,240,190,.16)); }
.hero-stats { position: relative; z-index: 2; margin-top: 16px; gap: 7px; }
.hero-stat {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 9px 8px;
    background: rgba(5, 9, 24, .46);
    border-color: rgba(255,255,255,.09);
    box-shadow: inset 0 1px rgba(255,255,255,.055);
}
.hero-stat > img { width: 25px; height: 25px; flex: 0 0 25px; object-fit: contain; }
.hero-stat-label { font-size: 8px; letter-spacing: .12em; }
.hero-stat-value { margin-top: 2px; font-size: 14px; }
.level-track { margin-top: 13px; }
.level-track-header { font-size: 10px; }
.level-track-header .level-tag { padding: 4px 9px; font-size: 9px; box-shadow: 0 0 16px rgba(124,231,255,.18); }
.level-track .progress { height: 7px; background: rgba(4,7,18,.55); }
.level-track .progress-bar { position: relative; box-shadow: 0 0 12px rgba(98,240,176,.30); }
.level-track .progress-bar::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, rgba(255,255,255,.48), transparent); transform: translateX(-110%); animation: progress-shine 3.4s ease-in-out infinite; }

/* Section titles */
.premium-section-title { margin-bottom: 10px; }
.premium-section-title > div:first-child { display: flex; flex-direction: column; gap: 3px; }
.premium-section-title span { color: rgba(141,234,255,.62); font-size: 8px; font-weight: 700; letter-spacing: .18em; }
.premium-section-title h2 { font-size: 17px; letter-spacing: -.025em; }
.section-orb { width: 8px; height: 8px; border-radius: 50%; background: var(--premium-violet); box-shadow: 0 0 15px var(--premium-violet); }
.section-orb.mint { background: var(--premium-mint); box-shadow: 0 0 15px var(--premium-mint); }

/* Games */
.game-grid { gap: 10px; }
.game-card {
    min-width: 0;
    padding: 12px 10px 10px;
    border-radius: 21px;
    text-align: center;
    isolation: isolate;
    background:
        linear-gradient(155deg, rgba(255,255,255,.11), rgba(255,255,255,.025) 48%),
        rgba(11, 15, 33, .82);
    border-color: rgba(181, 210, 255, .14);
    box-shadow: 0 14px 34px rgba(0,0,0,.28), inset 0 1px rgba(255,255,255,.10);
    animation: card-rise .52s var(--ease-out) both;
}
.game-card:nth-child(2) { animation-delay: 70ms; }
.game-card:nth-child(3) { animation-delay: 140ms; }
.game-card:nth-child(4) { animation-delay: 210ms; }
.game-card::after { content: ''; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(120deg, transparent 22%, rgba(255,255,255,.075) 42%, transparent 62%); transform: translateX(-120%); transition: transform .7s var(--ease-out); pointer-events: none; }
.game-card:active::after { transform: translateX(120%); }
.game-card-glow { z-index: -1; opacity: .42; }
.game-card-icon { width: 66px !important; height: 66px !important; margin: 0 auto; border: 0; border-radius: 20px; background: radial-gradient(circle, rgba(255,255,255,.15), rgba(255,255,255,.025) 68%, transparent 70%); }
.game-card-icon img { display: block !important; width: 62px !important; height: 62px !important; max-width: 62px !important; object-fit: contain; filter: drop-shadow(0 8px 11px rgba(0,0,0,.42)); animation: icon-breathe 4s ease-in-out infinite; }
.game-card-title { margin-top: 6px; font-size: 13px; line-height: 1.25; }
.game-card-desc { min-height: 31px; margin-top: 4px; color: rgba(220,229,255,.65); font-size: 10px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.game-card-meta { margin-top: 8px; justify-content: center; gap: 5px; }
.game-card-meta .chip { width: auto !important; height: 26px !important; min-width: 0 !important; padding: 3px 8px !important; border-radius: 999px !important; font-size: 9px; white-space: nowrap; background: rgba(255,255,255,.065); }
.game-card-meta .chip-icon { display: block !important; width: 15px !important; height: 15px !important; max-width: 15px !important; flex: 0 0 15px; object-fit: contain; }
.game-play-cue { display: inline-flex; align-items: center; gap: 4px; margin-top: 8px; color: var(--premium-cyan); font-size: 8px; font-weight: 800; letter-spacing: .15em; }
.game-play-cue b { font-size: 14px; line-height: 0; transition: transform .2s ease; }
.game-card:active .game-play-cue b { transform: translateX(3px); }

/* Missions */
.mission-list { gap: 10px; }
.mission-item {
    display: block;
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(145deg, rgba(255,255,255,.08), rgba(255,255,255,.025)), rgba(10,14,30,.78);
    border-color: rgba(174,205,255,.13);
    box-shadow: 0 12px 28px rgba(0,0,0,.22), inset 0 1px rgba(255,255,255,.07);
}
.mission-item-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.mission-item-title { font-size: 12px; }
.mission-item-desc { margin-top: 3px; color: rgba(220,229,255,.56); font-size: 10px; }
.mission-count { flex: 0 0 auto; padding: 4px 7px; border-radius: 999px; color: var(--premium-cyan); background: rgba(124,231,255,.08); border: 1px solid rgba(124,231,255,.14); font: 700 9px/1 var(--font-mono); }
.mission-item-progress { margin-top: 10px; }
.mission-item-progress .progress { height: 6px; }
.mission-item-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 9px; }
.mission-item-reward { flex-direction: row; align-items: center; gap: 5px; }
.mission-item-reward .chip { height: 25px; padding: 3px 7px; font-size: 9px; }
.mission-item-reward img { display: block !important; width: 15px !important; height: 15px !important; max-width: 15px !important; object-fit: contain; }
.mission-item-claim { min-width: 72px; height: 28px; padding: 0 9px; border-radius: 10px; font-size: 9px; }
.mission-item-claim:not(:disabled) { box-shadow: 0 7px 18px rgba(124,231,255,.20); animation: claim-pulse 2.2s ease-in-out infinite; }

/* Premium dock with Telegram profile image. */
.bottom-nav {
    width: min(336px, calc(100% - 32px));
    height: 61px;
    bottom: calc(8px + var(--safe-bottom));
    padding: 6px;
    border: 1px solid rgba(173, 211, 255, .18);
    background: linear-gradient(180deg, rgba(38,48,74,.82), rgba(19,24,43,.88));
    box-shadow: 0 20px 50px rgba(0,0,0,.42), inset 0 1px rgba(255,255,255,.16);
}
.nav-liquid-indicator { top: 5px; left: 5px; height: calc(100% - 10px); background: linear-gradient(145deg, rgba(124,231,255,.28), rgba(168,128,255,.20)); box-shadow: 0 0 24px rgba(124,231,255,.24), inset 0 1px rgba(255,255,255,.28); }
.nav-item svg { width: 21px; height: 21px; }
.nav-profile-avatar { width: 29px; height: 29px; display: grid; place-items: center; overflow: hidden; border-radius: 50%; color: #08101e; font-size: 10px; font-weight: 800; background: linear-gradient(135deg, var(--premium-violet), var(--premium-cyan)); border: 2px solid rgba(255,255,255,.34); transition: transform var(--dur) var(--ease-spring), box-shadow var(--dur) ease; }
.nav-profile-avatar img { width: 100%; height: 100%; object-fit: cover; }
.nav-item.is-active .nav-profile-avatar { transform: scale(1.10); box-shadow: 0 0 0 3px rgba(124,231,255,.10), 0 0 16px rgba(124,231,255,.38); }

@keyframes aurora-drift { to { transform: translate3d(-20px, 16px, 0) scale(1.12); } }
@keyframes crystal-float { 0%,100% { transform: translateY(1px) rotate(-1deg); } 50% { transform: translateY(-6px) rotate(1deg); } }
@keyframes icon-breathe { 0%,100% { transform: scale(1); } 50% { transform: scale(1.045); } }
@keyframes progress-shine { 0%,45% { transform: translateX(-120%); } 72%,100% { transform: translateX(120%); } }
@keyframes card-rise { from { opacity: 0; transform: translateY(12px) scale(.985); } to { opacity: 1; transform: none; } }
@keyframes claim-pulse { 50% { box-shadow: 0 8px 24px rgba(124,231,255,.34); } }

@media (max-width: 370px) {
    .topbar-name { max-width: 76px; }
    .pill { padding-inline: 6px; }
    .hero-head { grid-template-columns: minmax(0,1fr) 62px; }
    .hero-emblem, .hero-emblem img { width: 62px; height: 62px; }
    .hero-stat > img { display: none; }
    .game-card { padding-inline: 8px; }
}

@media (prefers-reduced-motion: reduce) {
    .hero-aurora, .hero-emblem, .game-card, .game-card-icon img, .level-track .progress-bar::after, .mission-item-claim:not(:disabled) { animation: none !important; }
}

/* Emerald Atelier v7 — unified premium theme */
:root {
    --premium-line: rgba(116, 240, 198, .18);
    --premium-panel: rgba(8, 52, 41, .78);
    --premium-cyan: #78f3d2;
    --premium-violet: #a7f5da;
    --premium-mint: #45e2b3;
    --premium-gold: #f4ca67;
}
body {
    background:
        radial-gradient(620px 480px at 95% 8%, rgba(39, 166, 126, .18), transparent 68%),
        radial-gradient(540px 500px at -12% 48%, rgba(21, 114, 88, .18), transparent 70%),
        linear-gradient(180deg, #06291f 0%, #031b15 46%, #02130f 100%);
}
body::before { content:''; position:fixed; inset:0; pointer-events:none; opacity:.15; background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px); background-size:24px 24px; }
.topbar { background:radial-gradient(260px 100px at 20% 0%,rgba(71,225,180,.17),transparent 72%),linear-gradient(180deg,rgba(16,74,59,.96),rgba(7,45,36,.98)); border-bottom-color:rgba(106,233,190,.18); }
.topbar-avatar { width:44px; height:44px; border-color:rgba(115,245,203,.74); background:linear-gradient(135deg,#1d7e63,#6cf0c4); box-shadow:0 0 0 4px rgba(87,231,185,.08),0 0 24px rgba(67,225,177,.28); }
.pill { padding:7px 9px; background:linear-gradient(180deg,rgba(255,255,255,.15),rgba(255,255,255,.055)); border-color:rgba(183,255,230,.15); }
.pill-icon-img { width:20px !important; height:20px !important; flex-basis:20px; filter:drop-shadow(0 3px 5px rgba(0,0,0,.35)); }
.page-root { padding:16px 14px calc(86px + var(--safe-bottom)); }
.hero-card,.page-banner { background:radial-gradient(230px 170px at 82% 16%,rgba(78,231,184,.22),transparent 70%),linear-gradient(145deg,rgba(32,100,79,.73),rgba(8,61,48,.86) 56%,rgba(4,35,28,.94)); border-color:rgba(132,243,204,.22); box-shadow:0 24px 60px rgba(0,9,7,.42),inset 0 1px rgba(255,255,255,.14); }
.hero-card { min-height:390px; padding:23px 20px 19px; }
.hero-head { grid-template-columns:minmax(0,1fr) 118px; min-height:116px; }
.hero-title,.page-eyebrow,.premium-section-heading>span { color:var(--premium-gold); font-size:10px; font-weight:800; letter-spacing:.19em; }
.hero-greeting { font-size:clamp(28px,8vw,38px); line-height:1.05; }
.hero-subtitle { max-width:220px; color:rgba(215,239,230,.67); font-size:12px; line-height:1.55; }
.hero-emblem { width:118px; height:118px; }
.hero-emblem img { width:112px; height:112px; filter:drop-shadow(0 18px 20px rgba(0,0,0,.4)) drop-shadow(0 0 22px rgba(62,229,174,.35)); }
.hero-aurora-one { background:rgba(50,222,168,.28); }
.hero-aurora-two { background:rgba(226,189,81,.12); }
.hero-stats { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:18px; }
.hero-stat { min-height:73px; padding:11px 12px; gap:11px; border-radius:20px; background:linear-gradient(145deg,rgba(255,255,255,.095),rgba(2,31,24,.58)); border:1px solid rgba(163,245,216,.15); }
.hero-stat>img { width:43px; height:43px; flex-basis:43px; filter:drop-shadow(0 6px 8px rgba(0,0,0,.4)); }
.hero-stat-label { color:rgba(203,232,221,.58); font-size:9px; }
.hero-stat-value { font-size:20px; font-weight:800; }
.text-token,.text-energy,.text-accent { color:#66efbd !important; }
.text-coin { color:var(--premium-gold) !important; }
.level-track { margin-top:16px; }
.level-track-header .level-tag { color:#06251d; background:linear-gradient(90deg,#54e4b5,#a2f5d9); }
.progress-bar { background:linear-gradient(90deg,#3ee4a9,#82efd1 72%,#f1c861); }
.premium-section-title>div:first-child>span { color:var(--premium-gold); }
.section-orb { background:linear-gradient(135deg,#54e4b5,#f0ca68); box-shadow:0 0 18px rgba(76,226,176,.36); }
.game-card { min-height:250px; background:radial-gradient(150px 100px at 75% 0%,rgba(69,224,175,.15),transparent 75%),linear-gradient(155deg,rgba(21,78,61,.78),rgba(5,38,30,.92)); border-color:rgba(138,239,204,.17); }
.game-card:nth-child(2n) { background:radial-gradient(150px 100px at 75% 0%,rgba(240,199,96,.11),transparent 75%),linear-gradient(155deg,rgba(19,73,57,.82),rgba(5,38,30,.92)); }
.game-card-icon { width:72px; height:72px; background:linear-gradient(145deg,rgba(255,255,255,.13),rgba(83,217,173,.06)); border-color:rgba(179,255,228,.18); }
.game-card-icon img { width:74px; height:74px; object-fit:contain; filter:drop-shadow(0 10px 10px rgba(0,0,0,.42)); }
.game-play-cue { color:#73efc5; }
.chip { border-color:rgba(160,242,214,.16); background:rgba(255,255,255,.07); }
.mission-item,.settings-card,.ledger-card { background:linear-gradient(145deg,rgba(19,67,53,.82),rgba(4,35,28,.91)); border-color:rgba(134,229,197,.16); }
.mission-item-claim:not(:disabled),.btn-primary { color:#06251d; background:linear-gradient(135deg,#58e5b7,#b5f7df); box-shadow:0 8px 24px rgba(63,218,168,.22); }
.bottom-nav { background:radial-gradient(180px 90px at 15% 50%,rgba(76,228,179,.19),transparent 72%),linear-gradient(180deg,rgba(27,79,64,.93),rgba(7,39,31,.97)); border-color:rgba(168,246,218,.23); box-shadow:0 18px 48px rgba(0,0,0,.48),inset 0 1px rgba(255,255,255,.14); }
.nav-item.active { color:#eafff8; background:radial-gradient(circle,rgba(116,241,202,.24),rgba(255,255,255,.06) 65%); box-shadow:0 0 24px rgba(67,224,174,.19); }
.nav-profile-avatar { border-color:rgba(126,239,201,.34); }

/* Shared interior pages */
.premium-page { gap:17px; }
.page-banner { position:relative; overflow:hidden; min-height:142px; padding:22px 20px; border:1px solid rgba(132,243,204,.2); border-radius:27px; display:flex; align-items:center; justify-content:space-between; }
.page-banner::after { content:''; position:absolute; inset:0; background:linear-gradient(110deg,rgba(255,255,255,.08),transparent 30%,transparent 75%,rgba(91,232,185,.08)); pointer-events:none; }
.page-banner>div { position:relative; z-index:1; max-width:68%; }
.page-banner h1 { margin:7px 0 5px; font-size:28px; letter-spacing:-.03em; }
.page-banner p { margin:0; color:rgba(213,238,229,.63); font-size:11px; line-height:1.5; }
.page-banner>img { position:relative; z-index:1; width:92px; height:92px; object-fit:contain; filter:drop-shadow(0 15px 14px rgba(0,0,0,.4)) drop-shadow(0 0 17px rgba(68,225,176,.25)); animation:crystal-float 4.6s ease-in-out infinite; }
.games-library-grid { margin-top:0; }
.games-library-grid .game-card { min-height:280px; }
.games-library-grid .game-card-meta { flex-wrap:wrap; }

.inventory-grid,.workshop-list { display:grid; gap:12px; }
.inventory-card,.workshop-card { position:relative; display:grid; align-items:center; border-radius:23px; border:1px solid rgba(134,229,197,.16); background:linear-gradient(145deg,rgba(21,76,59,.84),rgba(4,34,27,.94)); box-shadow:0 15px 32px rgba(0,9,7,.24),inset 0 1px rgba(255,255,255,.09); }
.inventory-card { grid-template-columns:78px minmax(0,1fr) auto; gap:13px; min-height:112px; padding:14px; }
.inventory-visual,.workshop-visual { display:grid; place-items:center; border-radius:20px; background:linear-gradient(145deg,rgba(255,255,255,.12),rgba(67,215,166,.05)); border:1px solid rgba(180,250,226,.16); }
.inventory-visual { width:74px; height:74px; }
.inventory-visual img { width:68px; height:68px; object-fit:contain; filter:drop-shadow(0 9px 8px rgba(0,0,0,.42)); }
.inventory-content,.workshop-content { min-width:0; }
.item-category { display:block; margin-bottom:5px; color:var(--premium-gold); font-size:8px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.item-quantity { min-width:45px; padding:9px 10px; border-radius:15px; color:#071f19; background:linear-gradient(135deg,#5ce6ba,#d2faec); font-weight:900; text-align:center; }
.premium-empty { grid-column:1/-1; min-height:210px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; border:1px dashed rgba(132,236,201,.22); border-radius:25px; color:rgba(220,242,234,.7); }
.premium-empty img { width:90px; height:90px; object-fit:contain; }
.premium-empty span { font-size:11px; color:rgba(202,230,219,.5); }
.premium-empty.compact { min-height:100px; }

.balance-banner { display:flex; align-items:center; gap:12px; padding:13px 16px; border:1px solid rgba(239,200,103,.27); border-radius:21px; background:linear-gradient(135deg,rgba(113,91,34,.25),rgba(12,62,48,.88)); }
.balance-banner img { width:48px; height:48px; object-fit:contain; }
.balance-banner span { display:block; color:rgba(232,239,226,.55); font-size:8px; letter-spacing:.15em; }
.balance-banner b { display:block; margin-top:2px; color:var(--premium-gold); font-size:21px; }
.workshop-card { grid-template-columns:88px minmax(0,1fr); gap:14px; padding:15px; }
.workshop-visual { width:86px; height:95px; }
.workshop-visual img { width:84px; height:84px; object-fit:contain; filter:drop-shadow(0 10px 10px rgba(0,0,0,.4)); }
.workshop-meta { display:flex; gap:6px; margin-top:8px; }
.workshop-meta span { padding:4px 7px; border-radius:999px; background:rgba(255,255,255,.06); color:rgba(216,239,230,.58); font-size:9px; }
.workshop-action { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; padding-top:11px; border-top:1px solid rgba(255,255,255,.08); }
.box-price { display:flex; align-items:center; gap:6px; color:var(--premium-gold); font-weight:800; }
.box-price img { width:25px; height:25px; }

.profile-main { padding:18px; border-radius:25px; background:linear-gradient(145deg,rgba(22,80,62,.86),rgba(4,35,28,.94)); }
.profile-identity { display:flex; align-items:center; gap:14px; }
.profile-photo { width:76px; height:76px; flex:0 0 76px; font-size:25px; }
.profile-kicker { color:var(--premium-gold); font-size:8px; font-weight:800; letter-spacing:.14em; }
.profile-name { margin-top:3px; font-size:19px; font-weight:800; }
.profile-handle { margin-top:3px; color:rgba(211,237,227,.55); font-size:10px; }
.premium-section-heading { display:flex; flex-direction:column; gap:3px; margin-top:3px; }
.premium-section-heading h2 { margin:0; font-size:20px; }
.profile-assets { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.asset-card { min-height:92px; padding:12px; display:flex; align-items:center; gap:10px; border-radius:21px; background:linear-gradient(145deg,rgba(21,74,58,.84),rgba(4,34,27,.94)); }
.asset-icon { width:47px; height:47px; flex:0 0 47px; display:grid; place-items:center; border-radius:16px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.1); }
.asset-icon img { width:42px; height:42px; object-fit:contain; }
.asset-card span:not(.asset-icon) { display:block; color:rgba(209,235,225,.57); font-size:9px; }
.asset-card b { display:block; margin-top:4px; font-size:18px; }
.asset-card.gold b { color:var(--premium-gold); }.asset-card.mint b,.asset-card.emerald b { color:#66edbe; }
.wallet-launch { margin-top:0; min-height:52px; display:flex; align-items:center; justify-content:center; gap:9px; border-radius:18px; font-weight:800; }
.wallet-launch img { width:28px; height:28px; }.wallet-launch span { margin-left:auto; font-size:22px; }
.settings-card,.ledger-card { padding:14px; border-radius:22px; }
.language-row { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.language-actions { display:flex; gap:6px; }
.language-actions .btn { padding:8px 9px; font-size:9px; }
.ledger-row { display:flex; align-items:center; justify-content:space-between; padding:11px 2px; border-bottom:1px solid rgba(255,255,255,.075); }
.ledger-row:last-child { border-bottom:0; }.ledger-row b { display:block; font-size:11px; }.ledger-row small { display:block; margin-top:2px; color:rgba(210,235,226,.45); font-size:9px; }.ledger-row strong { font-size:12px; }

@media (max-width:370px) {
    .hero-card { padding-inline:15px; }.hero-head { grid-template-columns:minmax(0,1fr) 92px; }.hero-emblem,.hero-emblem img { width:92px; height:92px; }
    .hero-stat { padding:9px; }.hero-stat>img { width:36px; height:36px; flex-basis:36px; }.hero-stat-value { font-size:17px; }
    .page-banner>img { width:76px; height:76px; }.page-banner h1 { font-size:24px; }
    .inventory-card { grid-template-columns:62px minmax(0,1fr) auto; }.inventory-visual { width:60px; height:60px; }.inventory-visual img { width:57px; height:57px; }
}

/* v12 — centered premium game result */
.modal-root.is-centered:not(:empty) {
    place-items:center;
    padding:18px;
    background:radial-gradient(circle at 50% 43%,rgba(37,149,111,.18),rgba(1,14,10,.84) 58%);
    backdrop-filter:blur(13px) saturate(1.18);
    -webkit-backdrop-filter:blur(13px) saturate(1.18);
}
.result-modal {
    width:min(390px,100%);
    max-height:calc(100dvh - 36px);
    overflow:auto;
    border:1px solid transparent;
    border-radius:29px;
    background:
        radial-gradient(230px 180px at 50% 0%,rgba(79,226,176,.16),transparent 72%) padding-box,
        linear-gradient(165deg,rgba(12,57,44,.98),rgba(5,25,21,.99)) padding-box,
        linear-gradient(130deg,rgba(239,201,101,.62),rgba(102,241,193,.55),rgba(255,255,255,.14)) border-box;
    box-shadow:inset 0 1px rgba(255,255,255,.15),inset 0 -24px 55px rgba(0,16,11,.24),0 10px 0 rgba(0,27,18,.66),0 35px 85px rgba(0,0,0,.6),0 0 45px rgba(58,219,166,.1);
    animation:result-modal-in .42s cubic-bezier(.2,.9,.24,1.15);
}
.result-hero { padding:23px 22px 14px; }
.result-celebration { position:relative; width:88px; height:88px; margin:0 auto 10px; display:grid; place-items:center; }
.result-celebration>span { position:absolute; inset:3px; border-radius:50%; border:1px solid rgba(239,200,99,.38); box-shadow:0 0 0 7px rgba(84,230,181,.045),0 0 35px rgba(71,229,175,.23); animation:result-ring 3s ease-in-out infinite; }
.result-hero .result-icon { position:relative; width:68px; height:68px; margin:0; background:radial-gradient(circle at 32% 24%,#ecfff8,#7cefc9 38%,#30bd8d 100%); color:#063626; border:1px solid rgba(255,255,255,.64); box-shadow:inset 0 2px rgba(255,255,255,.8),inset 0 -8px 18px rgba(0,83,56,.17),0 8px 0 rgba(8,80,57,.62),0 15px 30px rgba(47,220,164,.3); font-size:29px; }
.result-hero.lost .result-icon { background:radial-gradient(circle at 32% 24%,#ffe8ed,#ff879f 40%,#bd3756); color:#4b0a19; }
.result-kicker { margin-top:3px; color:var(--premium-gold); font-size:8px; font-weight:900; letter-spacing:.2em; text-transform:uppercase; }
.result-hero h2 { margin:5px 0 7px; font-size:25px; letter-spacing:-.025em; }
.result-score { width:max-content; margin:0 auto; padding:5px 11px; display:flex; align-items:center; gap:7px; border:1px solid rgba(154,239,209,.14); border-radius:999px; background:rgba(0,24,17,.35); color:rgba(207,236,225,.55); font-size:9px; text-transform:uppercase; letter-spacing:.1em; }
.result-score strong { color:#fff; font:800 13px/1 var(--font-mono); }
.result-rewards { gap:8px; margin-top:13px; }
.result-reward-chip { min-height:39px; padding:7px 12px 7px 8px; display:flex; align-items:center; gap:6px; border-radius:13px; background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(0,24,17,.5)); box-shadow:inset 0 1px rgba(255,255,255,.09),0 4px 0 rgba(0,25,17,.55),0 10px 18px rgba(0,0,0,.2); font-size:12px; }
.result-reward-chip img { width:27px; height:27px; object-fit:contain; filter:drop-shadow(0 4px 5px rgba(0,0,0,.35)); }
.result-reward-chip small { color:rgba(214,235,227,.42); font:700 7px/1 var(--font-sans); text-transform:uppercase; }
.result-ad-status { max-width:290px; margin:14px auto 0; color:rgba(209,235,225,.58); font-size:10px; line-height:1.5; }
.result-actions { display:flex; flex-direction:column; gap:10px; padding:7px 20px 21px; }
.result-ad-button { position:relative; width:100%; min-height:58px; padding:7px 10px; display:grid; grid-template-columns:42px minmax(0,1fr) 28px; align-items:center; gap:9px; overflow:hidden; border:1px solid transparent; border-radius:18px; color:#06271d; background:linear-gradient(105deg,#ecc55f,#7decc8 47%,#47d9a8) padding-box,linear-gradient(135deg,#fff1b6,#a9ffe2) border-box; box-shadow:inset 0 2px rgba(255,255,255,.55),inset 0 -9px 18px rgba(12,116,78,.13),0 6px 0 #167554,0 14px 28px rgba(30,197,139,.25); text-align:left; }
.result-ad-button::after { content:''; position:absolute; inset:0; background:linear-gradient(110deg,transparent 20%,rgba(255,255,255,.48) 44%,transparent 65%); transform:translateX(-120%); animation:result-button-shine 2.8s ease-in-out infinite; }
.result-ad-button-icon { position:relative; z-index:1; width:39px; height:39px; display:grid; place-items:center; border-radius:13px; color:#ecfff8; background:rgba(4,55,39,.86); box-shadow:inset 0 1px rgba(255,255,255,.2),0 5px 12px rgba(0,42,28,.28); font-size:12px; }
.result-ad-button>span:nth-child(2) { position:relative; z-index:1; display:flex; flex-direction:column; gap:2px; }
.result-ad-button small { color:rgba(5,56,40,.57); font-size:6px; font-weight:900; letter-spacing:.18em; }
.result-ad-button strong { font-size:11px; font-weight:900; letter-spacing:.02em; }
.result-ad-button i { position:relative; z-index:1; font-size:24px; font-style:normal; font-weight:800; }
.result-ad-button:disabled { opacity:.84; filter:saturate(.7); }
.result-secondary-actions { display:grid; grid-template-columns:1fr 1.15fr; gap:9px; }
.result-secondary-actions .btn { min-height:46px; border-radius:15px; font-size:11px; font-weight:800; }
.result-back-button { color:rgba(222,242,234,.76); background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(3,30,22,.42)); border:1px solid rgba(168,236,212,.14); box-shadow:inset 0 1px rgba(255,255,255,.08),0 4px 0 rgba(0,22,15,.65); }
.result-replay-button { color:#ddfff3; background:linear-gradient(145deg,rgba(37,139,103,.8),rgba(13,84,61,.88)); border:1px solid rgba(126,238,199,.25); box-shadow:inset 0 1px rgba(255,255,255,.13),0 4px 0 rgba(3,53,37,.8),0 10px 20px rgba(0,26,18,.2); }
.result-secondary-actions .btn:active,.result-ad-button:active { transform:translateY(3px) scale(.99); }

@keyframes result-modal-in { from { opacity:0; transform:translateY(24px) scale(.92); } to { opacity:1; transform:none; } }
@keyframes result-ring { 50% { transform:scale(1.08); opacity:.58; } }
@keyframes result-button-shine { 0%,58% { transform:translateX(-120%); } 80%,100% { transform:translateX(120%); } }

@media (max-height:650px) {
    .result-modal { transform:scale(.92); }.result-hero { padding-top:15px; }.result-celebration { width:72px; height:72px; }.result-hero .result-icon { width:56px; height:56px; }.result-actions { padding-bottom:15px; }
}

/* v13 — Obsidian Emerald + Champagne Gold premium controls */
:root {
    --lux-obsidian:#031711;
    --lux-emerald:#0c6f50;
    --lux-mint:#69efc1;
    --lux-mint-soft:#b8f9e1;
    --lux-gold:#e9be59;
    --lux-gold-soft:#ffe4a0;
    --lux-line:rgba(149,242,208,.22);
}
body { background:radial-gradient(720px 470px at 50% -100px,rgba(22,130,94,.23),transparent 67%),radial-gradient(500px 530px at 110% 42%,rgba(210,169,70,.06),transparent 70%),linear-gradient(180deg,#05261c 0%,#021711 54%,#010d09 100%); }
.topbar { background:radial-gradient(250px 100px at 18% 0%,rgba(109,236,193,.18),transparent 72%),linear-gradient(180deg,rgba(13,84,62,.97),rgba(4,47,34,.98)); border-bottom-color:rgba(236,197,96,.2); box-shadow:inset 0 1px rgba(255,255,255,.14),0 8px 0 rgba(1,32,22,.64),0 18px 36px rgba(0,12,8,.32); }
.bottom-nav { background:radial-gradient(190px 90px at 14% 50%,rgba(97,236,190,.2),transparent 72%),linear-gradient(180deg,rgba(17,82,61,.97),rgba(3,39,28,.98)); border-color:rgba(235,197,97,.24); box-shadow:inset 0 1px rgba(255,255,255,.16),0 6px 0 rgba(0,28,19,.72),0 22px 48px rgba(0,0,0,.52); }
.nav-liquid-indicator { background:radial-gradient(circle at 38% 25%,rgba(255,235,174,.24),transparent 30%),linear-gradient(145deg,rgba(91,236,187,.34),rgba(20,113,81,.28)); border:1px solid rgba(246,213,128,.22); box-shadow:inset 0 1px rgba(255,255,255,.24),0 5px 0 rgba(0,46,32,.55),0 0 25px rgba(72,224,174,.22); }

.btn,.mission-item-claim,.game-back,.icon-btn,.et-tap-btn {
    position:relative;
    isolation:isolate;
    overflow:hidden;
    color:#dff9ef;
    border:1px solid var(--lux-line);
    background:linear-gradient(145deg,rgba(19,76,58,.96),rgba(5,42,30,.98));
    box-shadow:inset 0 1px rgba(255,255,255,.13),inset 0 -8px 16px rgba(0,20,13,.15),0 4px 0 rgba(0,28,19,.82),0 10px 20px rgba(0,12,8,.25);
    text-shadow:0 1px 1px rgba(0,0,0,.28);
}
.btn::before,.mission-item-claim::before,.game-back::before,.icon-btn::before,.et-tap-btn::before { content:''; position:absolute; z-index:-1; inset:0; background:linear-gradient(115deg,transparent 18%,rgba(255,255,255,.14) 43%,transparent 66%); transform:translateX(-125%); transition:transform .55s ease; }
.btn:not(:disabled):active::before,.mission-item-claim:not(:disabled):active::before,.game-back:active::before,.icon-btn:active::before,.et-tap-btn:active::before { transform:translateX(125%); }
.btn:not(:disabled):active,.mission-item-claim:not(:disabled):active,.game-back:active,.icon-btn:active,.et-tap-btn:active { transform:translateY(3px) scale(.99); box-shadow:inset 0 1px rgba(255,255,255,.11),0 1px 0 rgba(0,27,18,.9),0 5px 10px rgba(0,12,8,.2); }
.btn-primary,.wallet-launch {
    color:#03251a;
    border:1px solid rgba(255,241,196,.68);
    background:linear-gradient(120deg,var(--lux-gold) 0%,var(--lux-gold-soft) 24%,var(--lux-mint-soft) 55%,var(--lux-mint) 100%);
    box-shadow:inset 0 2px rgba(255,255,255,.67),inset 0 -9px 17px rgba(14,123,83,.11),0 5px 0 #147352,0 13px 27px rgba(30,198,140,.24),0 0 22px rgba(232,190,90,.09);
    font-weight:900;
    text-shadow:0 1px rgba(255,255,255,.35);
}
.btn-primary:not(:disabled):active,.wallet-launch:not(:disabled):active { box-shadow:inset 0 1px rgba(255,255,255,.5),0 2px 0 #116346,0 7px 14px rgba(26,171,120,.2); }
.btn-ghost,.result-back-button { color:rgba(221,244,235,.72); border-color:rgba(168,234,210,.14); background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(2,28,20,.55)); }
.btn:disabled,.mission-item-claim:disabled { opacity:.54; color:rgba(204,228,219,.54); border-color:rgba(151,204,185,.09); background:linear-gradient(145deg,rgba(42,68,59,.72),rgba(13,40,31,.8)); box-shadow:inset 0 1px rgba(255,255,255,.06),0 2px 0 rgba(0,24,16,.6); filter:saturate(.45); }

/* Claim and workshop actions use the gold tier */
.mission-item-claim:not(:disabled) { color:#352500; border-color:rgba(255,233,165,.7); background:linear-gradient(135deg,#ffe39a,#e8b949 52%,#c88f20); box-shadow:inset 0 2px rgba(255,255,255,.62),0 4px 0 #84580f,0 10px 20px rgba(187,132,30,.2); font-weight:900; }
.box-price { padding:5px 10px 5px 7px; border:1px solid rgba(237,197,92,.24); border-radius:999px; background:rgba(71,52,13,.2); }

/* Wallet: each financial action has an intentional visual role */
[data-testid="topup-qris"] { color:#352500; background:linear-gradient(130deg,#ffe59d,#e8bb50); border-color:#fff0bd; box-shadow:inset 0 2px rgba(255,255,255,.66),0 5px 0 #8d6517,0 13px 24px rgba(181,128,28,.2); }
[data-testid="topup-usdt"] { color:#03251a; background:linear-gradient(130deg,#bffbe5,#59e5b4); border-color:#dcfff2; box-shadow:inset 0 2px rgba(255,255,255,.64),0 5px 0 #157a57,0 13px 24px rgba(37,196,140,.21); }
[data-testid="withdraw-open"] { color:#e9fff7; border-color:rgba(233,193,89,.3); background:linear-gradient(135deg,rgba(100,74,18,.34),rgba(7,59,43,.95)); }
[data-testid="ad-energy"],[data-testid="ad-coin"] { min-height:50px; color:#dffff3; background:linear-gradient(145deg,rgba(21,103,75,.92),rgba(6,52,38,.98)); border-color:rgba(103,239,191,.27); }

/* Language switch and utility buttons */
.language-actions .btn { color:rgba(214,239,230,.61); }
.language-actions .btn.is-selected { color:#322300; border-color:rgba(255,234,165,.72); background:linear-gradient(135deg,#ffe39a,#dbae3f); box-shadow:inset 0 1px rgba(255,255,255,.66),0 3px 0 #80550d,0 8px 15px rgba(176,124,24,.18); }
.icon-btn { border-radius:13px; background:linear-gradient(145deg,rgba(255,255,255,.13),rgba(5,48,35,.8)); }
.game-back { width:38px; height:38px; display:grid; place-items:center; border-radius:13px; color:var(--lux-gold-soft); font-size:19px; }

/* Game controls */
.et-tap-btn { color:#03271b; border:2px solid rgba(255,239,190,.72); background:radial-gradient(circle at 34% 25%,#fff3c5,#e6b94d 36%,#62e5b6 74%,#22966d); box-shadow:inset 0 3px rgba(255,255,255,.68),inset 0 -15px 28px rgba(5,92,62,.18),0 8px 0 #126649,0 20px 38px rgba(33,198,140,.25); }
.sc-option { color:#e7fff6; background:linear-gradient(145deg,rgba(20,91,67,.95),rgba(4,46,33,.98)); border-color:rgba(113,236,193,.25); }
.sc-option.correct { color:#04291c; background:linear-gradient(145deg,#bffbe4,#57e3b2); }.sc-option.wrong { color:#fff0f2; background:linear-gradient(145deg,#a83b54,#631b2d); border-color:rgba(255,126,151,.45); }

/* Preserve the special result CTA above generic button rules */
.result-ad-button { color:#06271d; background:linear-gradient(105deg,#ecc55f,#7decc8 47%,#47d9a8) padding-box,linear-gradient(135deg,#fff1b6,#a9ffe2) border-box; box-shadow:inset 0 2px rgba(255,255,255,.55),inset 0 -9px 18px rgba(12,116,78,.13),0 6px 0 #167554,0 14px 28px rgba(30,197,139,.25); }
.result-replay-button { color:#03251a; border-color:rgba(235,255,247,.54); background:linear-gradient(135deg,#aef7db,#50dfa9); box-shadow:inset 0 2px rgba(255,255,255,.5),0 4px 0 #147251,0 10px 20px rgba(30,190,134,.2); text-shadow:none; }

@media (prefers-reduced-motion:reduce) { .btn::before,.mission-item-claim::before,.game-back::before,.icon-btn::before,.et-tap-btn::before { display:none; } }

/* v14 — Crystal Trap */
.ct-status { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:5px; padding:9px; }
.ct-status .stat { min-width:0; padding:7px 3px; border:1px solid rgba(143,235,203,.12); border-radius:13px; background:linear-gradient(145deg,rgba(255,255,255,.065),rgba(1,30,21,.3)); }
.ct-status .stat span { font-size:7px; letter-spacing:.08em; }.ct-status .stat strong { font-size:13px; white-space:nowrap; }
.ct-status .stat:first-child strong { color:#ff8ba3; letter-spacing:2px; }.ct-danger { color:#ff718e !important; animation:ct-danger-pulse .7s ease-in-out infinite alternate; }
.ct-game { position:relative; padding:15px; overflow:hidden; border:1px solid rgba(145,240,206,.23); border-radius:25px; background:radial-gradient(250px 180px at 50% 0%,rgba(73,225,174,.17),transparent 72%),linear-gradient(150deg,rgba(17,75,56,.95),rgba(3,36,27,.99)); box-shadow:inset 0 1px rgba(255,255,255,.13),inset 0 -20px 42px rgba(0,20,13,.16),0 7px 0 rgba(0,30,20,.75),0 20px 38px rgba(0,11,7,.35); }
.ct-game::before { content:''; position:absolute; inset:0; pointer-events:none; background:linear-gradient(115deg,rgba(255,255,255,.07),transparent 27%,transparent 72%,rgba(232,190,84,.035)); }
.ct-intro { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.ct-intro>div:first-child>span { color:var(--lux-gold); font-size:7px; font-weight:900; letter-spacing:.16em; text-transform:uppercase; }
.ct-intro h2 { margin:4px 0 0; font-size:18px; letter-spacing:-.02em; }
.ct-combo { min-width:62px; padding:7px 9px; border:1px solid rgba(238,198,92,.24); border-radius:14px; background:linear-gradient(145deg,rgba(107,77,15,.23),rgba(3,39,28,.45)); text-align:center; box-shadow:inset 0 1px rgba(255,255,255,.09),0 3px 0 rgba(0,27,18,.64); }
.ct-combo small { display:block; color:rgba(237,213,151,.6); font-size:6px; letter-spacing:.14em; }.ct-combo b { display:block; margin-top:2px; color:var(--lux-gold-soft); font:900 17px/1 var(--font-mono); }
.ct-help { position:relative; z-index:1; margin:10px 0 13px; color:rgba(209,235,225,.53); font-size:9px; line-height:1.45; }
.ct-board { position:relative; z-index:1; display:grid; gap:8px; padding:10px; border:1px solid rgba(151,238,207,.15); border-radius:22px; background:linear-gradient(145deg,rgba(0,20,14,.46),rgba(6,49,36,.34)); box-shadow:inset 0 2px 12px rgba(0,13,9,.35),0 4px 0 rgba(0,26,17,.62); }
.ct-tile { position:relative; aspect-ratio:1; display:grid; place-items:center; overflow:hidden; border:1px solid rgba(168,243,216,.2); border-radius:17px; color:#9df4d5; background:radial-gradient(circle at 32% 23%,rgba(255,255,255,.15),transparent 31%),linear-gradient(145deg,#176f52,#084631 68%,#043124); box-shadow:inset 0 2px rgba(255,255,255,.13),inset 0 -9px 16px rgba(0,24,15,.2),0 5px 0 #022a1c,0 10px 18px rgba(0,10,6,.27); transition:transform .22s ease,box-shadow .22s ease,background .3s ease; }
.ct-tile::before { content:''; position:absolute; inset:8px; border:1px solid rgba(234,198,105,.15); border-radius:12px; transform:rotate(45deg) scale(.7); }
.ct-tile-seal { position:relative; z-index:1; font-size:20px; color:var(--lux-gold-soft); text-shadow:0 0 13px rgba(234,190,80,.4); }
.ct-tile:not(.is-open):active { transform:translateY(4px) scale(.97); box-shadow:inset 0 1px rgba(255,255,255,.1),0 1px 0 #022419,0 4px 8px rgba(0,10,6,.2); }
.ct-tile.is-checking { animation:ct-check .55s ease-in-out infinite alternate; }
.ct-tile.is-open { box-shadow:inset 0 2px rgba(255,255,255,.18),inset 0 -8px 16px rgba(0,0,0,.1),0 2px 0 rgba(0,29,20,.6),0 7px 14px rgba(0,0,0,.2); transform:translateY(3px); }
.ct-tile.is-open::before { display:none; }
.ct-tile.is-safe { border-color:rgba(138,255,216,.55); background:radial-gradient(circle at 50% 45%,rgba(160,255,222,.22),transparent 58%),linear-gradient(145deg,#138d64,#07583e); }
.ct-tile.is-trap { border-color:rgba(255,127,151,.5); background:radial-gradient(circle at 50% 40%,rgba(255,122,147,.22),transparent 56%),linear-gradient(145deg,#8b2941,#471323); animation:ct-trap-shake .36s ease; }
.ct-safe-crystal { color:#c9ffec; font-size:27px; transform:scaleX(.72); text-shadow:0 0 16px rgba(97,255,199,.85); animation:ct-reveal .38s cubic-bezier(.2,.9,.25,1.3); }
.ct-trap-mark { color:#ffe5a0; font-size:25px; text-shadow:0 0 15px rgba(255,105,130,.75); animation:ct-reveal .38s cubic-bezier(.2,.9,.25,1.3); }
.ct-tile small { position:absolute; bottom:5px; font-size:5px; font-weight:900; letter-spacing:.13em; opacity:.6; }
.ct-game.safe-flash { box-shadow:inset 0 1px rgba(255,255,255,.13),0 7px 0 rgba(0,30,20,.75),0 20px 38px rgba(0,11,7,.35),0 0 28px rgba(60,232,174,.16); }
.ct-game.trap-flash { box-shadow:inset 0 1px rgba(255,255,255,.13),0 7px 0 rgba(0,30,20,.75),0 20px 38px rgba(0,11,7,.35),0 0 30px rgba(255,73,110,.17); }
@keyframes ct-check { to { filter:brightness(1.3); transform:translateY(-2px); } }
@keyframes ct-reveal { from { opacity:0; transform:scale(.25) rotate(-20deg); } }
@keyframes ct-trap-shake { 25% { transform:translate(3px,3px); } 50% { transform:translate(-3px,3px); } 75% { transform:translate(2px,3px); } }
@keyframes ct-danger-pulse { to { opacity:.45; transform:scale(.94); } }
@media (max-width:370px) { .ct-game { padding:12px; }.ct-board { gap:6px; padding:8px; }.ct-tile { border-radius:14px; }.ct-intro h2 { font-size:16px; } }

/* v15 — Crystal Defender */
.cd-status { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:5px; padding:9px; }
.cd-status .stat { min-width:0; padding:7px 2px; border:1px solid rgba(145,235,204,.12); border-radius:12px; background:linear-gradient(145deg,rgba(255,255,255,.06),rgba(1,29,20,.32)); }
.cd-status .stat span { font-size:6px; letter-spacing:.07em; }.cd-status .stat strong { font-size:12px; white-space:nowrap; }.cd-status .stat:first-child strong { color:#ff859e; font-size:10px; letter-spacing:1px; }
.cd-game { padding:14px; overflow:hidden; border:1px solid rgba(144,241,206,.23); border-radius:25px; background:radial-gradient(300px 190px at 50% 0%,rgba(74,224,175,.17),transparent 70%),linear-gradient(150deg,rgba(17,74,56,.96),rgba(3,34,26,.99)); box-shadow:inset 0 1px rgba(255,255,255,.13),inset 0 -22px 45px rgba(0,19,12,.18),0 7px 0 rgba(0,29,19,.76),0 20px 40px rgba(0,10,6,.36); }
.cd-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.cd-heading>div span { color:var(--lux-gold); font-size:7px; font-weight:900; letter-spacing:.15em; text-transform:uppercase; }.cd-heading h2 { margin:4px 0 0; font-size:18px; }
.cd-heading>b { padding:7px 9px; border:1px solid rgba(105,239,193,.22); border-radius:12px; color:#82f1ca; background:rgba(6,57,41,.52); font-size:6px; letter-spacing:.12em; text-align:center; box-shadow:inset 0 1px rgba(255,255,255,.08),0 3px 0 rgba(0,26,17,.55); }
.cd-help { margin:9px 0 12px; color:rgba(208,234,224,.52); font-size:9px; line-height:1.45; }
.cd-arena { position:relative; height:310px; display:grid; grid-template-columns:repeat(3,1fr); gap:7px; overflow:hidden; border:1px solid rgba(145,236,204,.16); border-radius:23px; background:radial-gradient(circle at 50% 88%,rgba(75,231,178,.2),transparent 25%),linear-gradient(180deg,rgba(0,18,13,.7),rgba(5,52,38,.48)); box-shadow:inset 0 3px 18px rgba(0,13,8,.4),0 4px 0 rgba(0,25,17,.66); }
.cd-arena::before { content:''; position:absolute; inset:0; background:linear-gradient(90deg,transparent 33%,rgba(141,238,204,.08) 33.2%,transparent 33.7%,transparent 66%,rgba(141,238,204,.08) 66.2%,transparent 66.7%),repeating-linear-gradient(0deg,transparent 0 48px,rgba(142,235,202,.035) 49px 50px); pointer-events:none; }
.cd-lane { position:relative; min-width:0; }.cd-lane::after { content:''; position:absolute; left:50%; top:12px; bottom:65px; width:1px; background:linear-gradient(rgba(233,195,91,.16),rgba(94,231,183,.05)); }
.cd-core-ring { position:absolute; z-index:3; left:50%; bottom:14px; width:94px; height:94px; transform:translateX(-50%); display:grid; place-items:center; border:1px solid rgba(234,194,91,.28); border-radius:50%; box-shadow:0 0 0 8px rgba(75,230,177,.04),0 0 35px rgba(67,227,171,.2); animation:cd-core-pulse 2.6s ease-in-out infinite; }
.cd-core { width:68px; height:68px; display:grid; place-items:center; border:1px solid rgba(255,235,171,.6); border-radius:23px 23px 28px 28px; background:radial-gradient(circle at 34% 22%,#e6fff6,#55e2ae 38%,#0b7954 72%,#06412d); box-shadow:inset 0 2px rgba(255,255,255,.64),inset 0 -12px 20px rgba(0,59,38,.18),0 7px 0 #03432e,0 15px 28px rgba(28,204,143,.25); transform:rotate(45deg); }
.cd-core span { color:#f5fffb; font-size:28px; transform:rotate(-45deg) scaleX(.72); text-shadow:0 0 16px rgba(193,255,232,.8); }
.cd-enemy { position:absolute; z-index:4; top:8px; left:50%; width:62px; height:62px; transform:translateX(-50%); display:grid; place-items:center; border:1px solid rgba(255,225,149,.3); border-radius:20px; color:#ffe8a4; background:radial-gradient(circle at 34% 22%,rgba(255,255,255,.2),transparent 30%),linear-gradient(145deg,#365346,#132c23); box-shadow:inset 0 2px rgba(255,255,255,.14),inset 0 -9px 17px rgba(0,0,0,.24),0 5px 0 #071d15,0 12px 22px rgba(0,0,0,.35); animation:cd-advance var(--enemy-duration) linear forwards; }
.cd-enemy span { font-size:25px; filter:drop-shadow(0 0 10px currentColor); }.cd-enemy small { position:absolute; bottom:5px; font-size:5px; font-weight:900; letter-spacing:.1em; opacity:.6; text-transform:uppercase; }.cd-enemy i { position:absolute; inset:-7px; border:1px solid rgba(255,221,137,.12); border-radius:24px; }
.cd-enemy.type-scout { color:#8ff2cf; border-color:rgba(110,241,195,.38); background:linear-gradient(145deg,#167657,#073f2d); }.cd-enemy.type-brute { width:68px; height:68px; color:#ffe29a; background:linear-gradient(145deg,#765927,#33230c); }.cd-enemy.type-shadow { color:#e2a9ff; border-color:rgba(218,151,255,.35); background:linear-gradient(145deg,#533261,#25142d); }
.cd-enemy.is-struck { animation:cd-destroy .36s ease forwards; }.cd-enemy.is-breached { animation:cd-breach .36s ease forwards; }
.cd-arena.core-damaged .cd-core-ring { animation:cd-core-damage .38s ease; }.cd-arena.core-damaged { box-shadow:inset 0 0 30px rgba(255,66,102,.18),0 4px 0 rgba(0,25,17,.66); }
.cd-impact { position:absolute; z-index:8; left:50%; top:48%; transform:translate(-50%,-50%); opacity:0; pointer-events:none; font:900 22px/1 var(--font-mono); }.cd-impact.is-hit { color:#8bffd5; }.cd-impact.is-damage { color:#ff7692; }.cd-impact.animate { animation:cd-impact .7s ease; }
@keyframes cd-advance { from { transform:translate(-50%,0) scale(.82); } to { transform:translate(-50%,205px) scale(1.08); } }
@keyframes cd-destroy { to { opacity:0; transform:translate(-50%,90px) scale(1.5) rotate(28deg); filter:brightness(2); } }
@keyframes cd-breach { to { opacity:0; transform:translate(-50%,215px) scale(.45); } }
@keyframes cd-impact { 0% { opacity:0; transform:translate(-50%,-20%) scale(.6); } 28% { opacity:1; } 100% { opacity:0; transform:translate(-50%,-100%) scale(1.18); } }
@keyframes cd-core-pulse { 50% { transform:translateX(-50%) scale(1.05); box-shadow:0 0 0 11px rgba(75,230,177,.035),0 0 42px rgba(67,227,171,.28); } }
@keyframes cd-core-damage { 25% { transform:translateX(-50%) translateX(5px); } 50% { transform:translateX(-50%) translateX(-5px); } 75% { transform:translateX(-50%) translateX(3px); } }
@media (max-width:370px) { .cd-game { padding:11px; }.cd-arena { height:285px; }.cd-enemy { width:55px;height:55px; }.cd-enemy.type-brute { width:60px;height:60px; } @keyframes cd-advance { from { transform:translate(-50%,0) scale(.82); } to { transform:translate(-50%,180px) scale(1.06); } } }

/* v10: bilingual ultra-premium game CTA */
.game-library-play {
    min-height:58px;
    padding:8px 9px 8px 17px;
    border:1px solid transparent;
    background:
        linear-gradient(110deg,rgba(9,63,48,.96),rgba(20,91,69,.94)) padding-box,
        linear-gradient(115deg,rgba(243,204,103,.72),rgba(104,243,195,.76),rgba(255,255,255,.24)) border-box;
    box-shadow:inset 0 1px rgba(255,255,255,.13),inset 0 -10px 24px rgba(0,28,19,.15),0 12px 28px rgba(0,17,11,.3),0 0 20px rgba(73,226,176,.08);
}
.game-library-play::after { content:''; position:absolute; left:16px; right:58px; bottom:7px; height:1px; background:linear-gradient(90deg,rgba(241,202,99,.7),rgba(102,239,193,.42),transparent); opacity:.55; }
.game-library-play small { color:rgba(237,211,140,.78); font-size:7px; letter-spacing:.16em; }
.game-library-play strong { color:#eafff7; font-size:11px; letter-spacing:.12em; text-shadow:0 0 15px rgba(110,242,198,.35); }
.game-library-play b { width:42px; height:42px; flex:0 0 42px; border:1px solid rgba(255,255,255,.58); background:radial-gradient(circle at 32% 25%,#effff9 0%,#9af5d5 34%,#4be0ad 100%); box-shadow:0 7px 18px rgba(47,220,164,.38),inset 0 2px 2px rgba(255,255,255,.85); }
.game-library-play b span { transform:translateX(1px); font-size:13px; filter:drop-shadow(0 1px rgba(255,255,255,.4)); }
.game-library-card:hover .game-library-play,.game-library-card:focus-visible .game-library-play { transform:translateY(-1px); box-shadow:inset 0 1px rgba(255,255,255,.16),0 15px 34px rgba(0,17,11,.38),0 0 25px rgba(73,226,176,.14); }
.game-library-card:active .game-library-play { transform:scale(.985); }
.game-library-card:active .game-library-play b { transform:translateX(3px) scale(.96); }
.game-library-play,.game-library-play b { transition:transform .22s ease,box-shadow .22s ease; }

/* v11 — compact 3D card system shared by every menu */
:root { --card-3d-line:rgba(142,246,208,.25); --card-3d-top:rgba(255,255,255,.13); --card-3d-deep:rgba(0,22,15,.46); }
.hero-card,.game-card,.game-library-card,.mission-item,.inventory-card,.workshop-card,.profile-main,.asset-card,.settings-card,.ledger-card,#wallet-summary,#referral-card,#wallet-history,.game-header,.game-status,.page-banner {
    position:relative;
    isolation:isolate;
    overflow:hidden;
    border:1px solid var(--card-3d-line) !important;
    box-shadow:inset 0 1px 0 var(--card-3d-top),inset 0 -12px 30px rgba(0,24,17,.16),0 7px 0 rgba(1,31,22,.75),0 18px 34px var(--card-3d-deep) !important;
    transform:translateZ(0);
}
.hero-card::before,.game-card::before,.game-library-card::before,.mission-item::before,.inventory-card::before,.workshop-card::before,.profile-main::before,.asset-card::before,.settings-card::before,.ledger-card::before,#wallet-summary::before,#referral-card::before,#wallet-history::before,.game-header::before,.game-status::before,.page-banner::before {
    content:'';
    position:absolute;
    z-index:-1;
    inset:1px 1px auto;
    height:42%;
    border-radius:inherit;
    background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.015) 55%,transparent);
    pointer-events:none;
}
.game-card,.game-library-card,.inventory-card,.workshop-card,.asset-card,.mission-item,.btn { transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease; }
.game-card:active,.game-library-card:active,.inventory-card:active,.workshop-card:active,.asset-card:active { transform:translateY(4px) scale(.992); box-shadow:inset 0 1px rgba(255,255,255,.1),inset 0 -8px 20px rgba(0,20,14,.12),0 3px 0 rgba(1,28,20,.8),0 9px 19px rgba(0,17,11,.4) !important; }

/* Home hero: compact instead of almost one full screen */
.hero-card { min-height:0; padding:17px 18px 15px; border-radius:25px; }
.hero-head { grid-template-columns:minmax(0,1fr) 105px; min-height:88px; }
.hero-greeting { font-size:clamp(25px,7vw,32px); }
.hero-subtitle { margin-top:3px; font-size:10px; line-height:1.4; }
.hero-emblem,.hero-emblem img { width:104px; height:104px; }
.hero-stats { margin-top:12px; gap:8px; }
.hero-stat { min-height:66px; padding:8px 11px; gap:9px; border-radius:17px; border:1px solid rgba(145,236,204,.17); box-shadow:inset 0 1px rgba(255,255,255,.1),0 4px 0 rgba(0,34,23,.56),0 10px 18px rgba(0,20,14,.22); }
.hero-stat>img { width:45px !important; height:45px !important; max-width:45px !important; flex-basis:45px; }
.hero-stat-label { font-size:8px; }.hero-stat-value { font-size:18px; }
.level-track { margin-top:12px; }.level-track-header { font-size:9px; }

/* Home game and mission cards */
.game-grid { gap:12px; }
.page:not(.premium-page) .game-card { min-height:210px; padding:14px 10px 12px; border-radius:23px; }
.page:not(.premium-page) .game-card-icon { height:70px !important; margin-bottom:2px; }
.page:not(.premium-page) .game-card-icon img { width:72px !important; height:72px !important; max-width:72px !important; }
.page:not(.premium-page) .game-card-title { font-size:12px; }.page:not(.premium-page) .game-card-desc { font-size:9px; }
.mission-item { min-height:0; padding:13px 14px; border-radius:20px; }

/* Smaller 3D banners and game library cards */
.page-banner { min-height:124px; padding:17px 18px; border-radius:24px; }
.page-banner h1 { font-size:25px; }.page-banner>img { width:82px; height:82px; }
.games-banner { min-height:132px; }.games-banner>img { width:90px; height:90px; }
.games-library-grid { gap:12px; }
.games-library-grid .game-library-card { min-height:148px; grid-template-columns:88px minmax(0,1fr); padding:12px 13px; gap:0 12px; border-radius:23px; }
.game-library-icon { width:88px; height:105px; }.game-library-icon img { width:94px; height:94px; }
.games-library-grid .game-card-title { font-size:16px; }.games-library-grid .game-card-desc { font-size:9px; }
.games-library-grid .game-card-meta { margin-top:6px; gap:4px; }.games-library-grid .game-card-meta .chip { height:21px !important; padding-inline:6px !important; font-size:7px; }
.game-library-play { min-height:43px; margin-top:7px; padding:5px 6px 5px 12px; border-radius:14px; }
.game-library-play b { width:32px; height:32px; flex-basis:32px; }.game-library-play strong { font-size:9px; }.game-library-play small { font-size:6px; }
.game-number { font-size:29px; opacity:.7; }

/* Inventory, Workshop and Profile */
.inventory-grid,.workshop-list { gap:11px; }
.inventory-card { min-height:92px; grid-template-columns:64px minmax(0,1fr) auto; padding:11px 12px; border-radius:21px; }
.inventory-visual { width:60px; height:60px; background:transparent; border:0; }.inventory-visual img { width:61px; height:61px; }
.workshop-card { grid-template-columns:70px minmax(0,1fr); padding:12px; gap:11px; border-radius:22px; }
.workshop-visual { width:68px; height:75px; background:transparent; border:0; }.workshop-visual img { width:70px; height:70px; }
.workshop-action { padding-top:8px; }.workshop-meta { margin-top:6px; }
.profile-main { padding:14px; border-radius:22px; }.profile-photo { width:64px; height:64px; flex-basis:64px; }
.profile-assets { gap:9px; }.asset-card { min-height:76px; padding:9px; border-radius:18px; }.asset-icon { width:41px; height:41px; flex-basis:41px; }.asset-icon img { width:37px; height:37px; }.asset-card b { font-size:15px; }
.settings-card,.ledger-card { padding:11px 13px; border-radius:19px; }

/* Wallet and gameplay panels inherit the same depth */
#wallet-summary,#referral-card,#wallet-history,.game-header,.game-status { border-radius:21px; background:linear-gradient(145deg,rgba(20,78,59,.9),rgba(3,35,27,.97)); }
#wallet-summary { padding:12px; } #wallet-summary .hero-stat { min-height:61px; }
.game-header { min-height:54px; padding:8px 11px; }.game-status { padding:10px 12px; }
.cm-board,.sc-prompt,.sc-option,.et-meter,.mg-card-inner { border-color:rgba(145,240,206,.22) !important; box-shadow:inset 0 1px rgba(255,255,255,.12),0 5px 0 rgba(0,31,21,.7),0 13px 25px rgba(0,18,12,.3) !important; }
.cm-cell,.sc-option,.et-tap-btn { box-shadow:inset 0 2px rgba(255,255,255,.22),inset 0 -8px rgba(0,0,0,.12),0 4px 0 rgba(0,25,18,.65),0 9px 16px rgba(0,0,0,.24); }
.cm-cell:active,.sc-option:active,.et-tap-btn:active { transform:translateY(3px) scale(.97); box-shadow:inset 0 1px rgba(255,255,255,.16),0 1px 0 rgba(0,20,14,.7),0 4px 9px rgba(0,0,0,.22); }

@media (max-width:370px) {
    .hero-head { grid-template-columns:minmax(0,1fr) 82px; }.hero-emblem,.hero-emblem img { width:82px; height:82px; }
    .hero-stat { min-height:60px; padding:7px; }.hero-stat>img { width:38px !important; height:38px !important; max-width:38px !important; flex-basis:38px; }.hero-stat-value { font-size:16px; }
    .games-library-grid .game-library-card { grid-template-columns:75px minmax(0,1fr); gap:0 8px; }.game-library-icon { width:75px; }.game-library-icon img { width:82px; height:82px; }
}

/* v9: clean floating artwork and a single premium play action */
.game-card-icon,
.game-library-icon {
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    border-radius:0 !important;
}
.game-card-icon::before,
.game-library-icon::before { display:none !important; }
.game-card-icon img {
    width:82px !important;
    height:82px !important;
    max-width:82px !important;
    filter:drop-shadow(0 14px 12px rgba(0,0,0,.5)) drop-shadow(0 0 12px rgba(72,235,180,.17));
}
.game-library-icon img {
    width:124px;
    height:124px;
    filter:drop-shadow(0 16px 13px rgba(0,0,0,.53)) drop-shadow(0 0 15px rgba(72,235,180,.18));
}
.games-library-grid .game-library-card { grid-template-rows:1fr auto; padding-bottom:14px; }
.game-library-play {
    position:relative;
    min-height:50px;
    margin-top:12px;
    padding:7px 8px 7px 15px;
    border:1px solid rgba(164,255,221,.25);
    border-radius:17px;
    background:linear-gradient(105deg,rgba(76,229,178,.16),rgba(255,255,255,.055));
    box-shadow:inset 0 1px rgba(255,255,255,.12),0 9px 22px rgba(0,17,12,.24);
    overflow:hidden;
}
.game-library-play::before { content:''; position:absolute; inset:0; border-radius:inherit; background:linear-gradient(110deg,transparent 20%,rgba(255,255,255,.13) 45%,transparent 70%); transform:translateX(-120%); transition:transform .6s ease; }
.game-library-card:active .game-library-play::before { transform:translateX(120%); }
.game-library-play>span { display:flex; flex-direction:column; gap:2px; position:relative; z-index:1; }
.game-library-play small { color:rgba(207,240,228,.5); font-size:7px; font-weight:700; letter-spacing:.12em; }
.game-library-play strong { color:#9af6d7; font-size:10px; font-weight:900; letter-spacing:.1em; }
.game-library-play b { position:relative; z-index:1; width:36px; height:36px; background:linear-gradient(135deg,#74f0c7,#c9fbea); box-shadow:0 5px 14px rgba(70,230,176,.3),inset 0 1px rgba(255,255,255,.7); }
.game-play-cue {
    width:calc(100% - 4px);
    min-height:34px;
    margin:10px auto 0;
    padding:7px 8px 7px 13px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    border:1px solid rgba(160,249,217,.2);
    border-radius:13px;
    background:linear-gradient(110deg,rgba(74,225,175,.15),rgba(255,255,255,.045));
    color:#8cf3d0;
    font-size:8px;
    letter-spacing:.13em;
}
.game-play-cue b { width:23px; height:23px; display:grid; place-items:center; border-radius:50%; color:#06251c; background:linear-gradient(135deg,#69eabb,#c9fae8); font-size:15px; }

@media (max-width:370px) {
    .game-card-icon img { width:72px !important; height:72px !important; max-width:72px !important; }
    .game-library-icon img { width:105px; height:105px; }
    .game-library-play { padding-left:11px; }.game-library-play strong { font-size:9px; }
}

/* v8 refinements: larger economy icons, spacious dock and premium Games menu */
.pill { min-height:43px; padding-inline:12px; gap:8px; }
.pill-icon-img { width:27px !important; height:27px !important; max-width:27px !important; flex-basis:27px; }
.hero-head { grid-template-columns:minmax(0,1fr) 150px; }
.hero-emblem,.hero-emblem img { width:148px; height:148px; }
.hero-emblem img { filter:drop-shadow(0 19px 22px rgba(0,0,0,.46)) drop-shadow(0 0 27px rgba(58,235,176,.38)); }
.hero-stat { min-height:88px; padding:12px 15px; gap:14px; }
.hero-stat>img { display:block !important; width:59px !important; height:59px !important; max-width:59px !important; flex:0 0 59px; }
.hero-stat-label { font-size:10px; }
.hero-stat-value { font-size:23px; }

.bottom-nav {
    width:min(354px,calc(100% - 48px));
    height:68px;
    bottom:calc(16px + var(--safe-bottom));
    padding:7px 11px;
    gap:10px;
}
.nav-item { min-width:0; margin-inline:2px; }
.nav-item svg { width:23px; height:23px; }
.nav-profile-avatar { width:34px; height:34px; }

.games-banner { min-height:170px; }
.games-banner>img { width:118px; height:118px; }
.games-section-head { display:flex; align-items:flex-end; justify-content:space-between; padding:2px 3px 0; }
.games-section-head span { color:var(--premium-gold); font-size:9px; font-weight:800; letter-spacing:.16em; }
.games-section-head h2 { margin:4px 0 0; font-size:22px; }
.games-online { display:flex; align-items:center; gap:5px; color:rgba(205,238,226,.58); font-size:9px; }
.games-online i { width:7px; height:7px; border-radius:50%; background:#52e7b3; box-shadow:0 0 10px rgba(82,231,179,.75); }
.games-library-grid { display:grid; grid-template-columns:1fr !important; gap:14px; }
.games-library-grid .game-library-card {
    min-height:178px;
    display:grid;
    grid-template-columns:112px minmax(0,1fr);
    grid-template-rows:1fr auto;
    gap:0 15px;
    padding:16px;
    text-align:left;
    overflow:hidden;
    border-radius:27px;
    background:radial-gradient(210px 145px at 8% 32%,rgba(62,232,175,.20),transparent 72%),linear-gradient(140deg,rgba(22,84,64,.92),rgba(3,36,28,.97));
}
.games-library-grid .game-library-card:nth-child(2n) { background:radial-gradient(210px 145px at 8% 32%,rgba(239,197,91,.13),transparent 72%),linear-gradient(140deg,rgba(22,78,60,.92),rgba(3,34,27,.97)); }
.game-number { position:absolute; top:12px; right:16px; color:rgba(207,242,229,.12); font:900 36px/1 var(--font-mono); }
.game-library-icon { grid-row:1/3; align-self:center; width:112px; height:125px; display:grid; place-items:center; border-radius:25px; background:linear-gradient(145deg,rgba(255,255,255,.13),rgba(54,216,164,.045)); border:1px solid rgba(167,246,219,.17); box-shadow:inset 0 1px rgba(255,255,255,.11),0 12px 28px rgba(0,12,8,.25); }
.game-library-icon img { width:106px; height:106px; object-fit:contain; filter:drop-shadow(0 13px 12px rgba(0,0,0,.46)); animation:icon-breathe 4s ease-in-out infinite; }
.game-library-content { align-self:center; min-width:0; position:relative; z-index:1; }
.game-category { display:block; color:var(--premium-gold); font-size:8px; font-weight:900; letter-spacing:.15em; }
.games-library-grid .game-card-title { margin-top:5px; font-size:19px; text-align:left; }
.games-library-grid .game-card-desc { min-height:0; margin-top:5px; font-size:10px; line-height:1.45; text-align:left; -webkit-line-clamp:2; }
.games-library-grid .game-card-meta { justify-content:flex-start; flex-wrap:wrap; margin-top:9px; }
.games-library-grid .game-card-meta .chip { height:24px !important; padding-inline:7px !important; font-size:8px; }
.game-library-play { grid-column:2; align-self:end; display:flex; align-items:center; justify-content:space-between; width:100%; margin-top:10px; padding-top:9px; border-top:1px solid rgba(255,255,255,.09); color:#78f2ca; font-size:9px; font-weight:900; letter-spacing:.14em; }
.game-library-play b { width:25px; height:25px; display:grid; place-items:center; border-radius:50%; color:#06261d; background:linear-gradient(135deg,#5fe8bc,#c9f9e8); font-size:17px; }

@media (max-width:370px) {
    .hero-head { grid-template-columns:minmax(0,1fr) 108px; }
    .hero-emblem,.hero-emblem img { width:108px; height:108px; }
    .hero-stat { min-height:76px; padding:9px; gap:8px; }
    .hero-stat>img { width:45px !important; height:45px !important; max-width:45px !important; flex-basis:45px; }
    .hero-stat-value { font-size:18px; }
    .pill { padding-inline:8px; gap:5px; }.pill-icon-img { width:23px !important; height:23px !important; max-width:23px !important; flex-basis:23px; }
    .games-library-grid .game-library-card { grid-template-columns:92px minmax(0,1fr); gap:0 11px; padding:13px; }
    .game-library-icon { width:92px; height:112px; }.game-library-icon img { width:91px; height:91px; }
    .games-library-grid .game-card-title { font-size:16px; }
}
