:root{font-family:Inter,system-ui,Arial,sans-serif;color:#eaf6ff;background:#071729}*{box-sizing:border-box}body{margin:0;min-height:100vh}.app{position:relative;min-height:100vh;padding:24px;overflow:hidden}.app{--bg-speed: 1;--bg-intensity: 1;--bg-color-1: #2a9df4;--bg-color-2: #0059ff;--bg-color-3: #00d4ff}.animated-bg{position:fixed;top:-30%;right:-30%;bottom:-30%;left:-30%;z-index:0;pointer-events:none}.bg-css .animated-bg{background:linear-gradient(135deg,color-mix(in srgb,var(--bg-color-1) 45%,#041222),color-mix(in srgb,var(--bg-color-2) 35%,#031528),color-mix(in srgb,var(--bg-color-3) 40%,#041222));background-size:200% 200%;animation:gradientShift calc(18s / var(--bg-speed)) ease infinite}.bg-aurora .animated-bg{background:radial-gradient(circle at 20% 20%,color-mix(in srgb,var(--bg-color-1) 55%,transparent),transparent 42%),radial-gradient(circle at 80% 30%,color-mix(in srgb,var(--bg-color-2) 45%,transparent),transparent 32%),radial-gradient(circle at 40% 82%,color-mix(in srgb,var(--bg-color-3) 45%,transparent),transparent 36%);filter:blur(calc(20px * var(--bg-intensity)));animation:move calc(12s / var(--bg-speed)) ease-in-out infinite alternate}.bg-gradient .animated-bg{background:radial-gradient(circle at 15% 20%,color-mix(in srgb,var(--bg-color-1) 42%,transparent),transparent 35%),radial-gradient(circle at 85% 20%,color-mix(in srgb,var(--bg-color-2) 42%,transparent),transparent 32%),radial-gradient(circle at 55% 85%,color-mix(in srgb,var(--bg-color-3) 45%,transparent),transparent 38%);filter:blur(calc(18px * var(--bg-intensity)));animation:move calc(14s / var(--bg-speed)) ease-in-out infinite alternate}.bg-boxes .animated-bg{background-image:linear-gradient(color-mix(in srgb,var(--bg-color-1) 30%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--bg-color-2) 30%,transparent) 1px,transparent 1px);background-size:42px 42px;animation:gridMove calc(20s / var(--bg-speed)) linear infinite;opacity:calc(.7 * var(--bg-intensity))}.bg-grid .animated-bg{background-image:linear-gradient(color-mix(in srgb,var(--bg-color-1) 24%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--bg-color-3) 24%,transparent) 1px,transparent 1px);background-size:28px 28px;opacity:calc(.6 * var(--bg-intensity))}.bg-dots .animated-bg{background:radial-gradient(circle,color-mix(in srgb,var(--bg-color-3) 45%,transparent) 1px,transparent 1px);background-size:22px 22px;opacity:calc(.7 * var(--bg-intensity))}.bg-spotlight .animated-bg{background:radial-gradient(circle at 15% 15%,color-mix(in srgb,var(--bg-color-1) 48%,transparent),transparent 35%);animation:spotlight calc(16s / var(--bg-speed)) ease-in-out infinite alternate;filter:blur(calc(10px * var(--bg-intensity)))}.bg-meteors .animated-bg{background:linear-gradient(180deg,#020910,#081a2e)}.bg-orb{position:fixed;border-radius:999px;filter:blur(12px);z-index:1;opacity:calc(.45 * var(--bg-intensity));animation:drift calc(16s / var(--bg-speed)) ease-in-out infinite alternate;pointer-events:none}.orb-1{width:160px;height:160px;background:color-mix(in srgb,var(--bg-color-1) 40%,transparent);left:8%;top:16%}.orb-2{width:120px;height:120px;background:color-mix(in srgb,var(--bg-color-2) 36%,transparent);left:74%;top:8%;animation-duration:calc(20s / var(--bg-speed))}.orb-3{width:180px;height:180px;background:color-mix(in srgb,var(--bg-color-3) 30%,transparent);left:65%;top:68%;animation-duration:calc(18s / var(--bg-speed))}.orb-4{width:130px;height:130px;background:color-mix(in srgb,var(--bg-color-2) 24%,transparent);left:18%;top:70%;animation-duration:calc(22s / var(--bg-speed))}.orb-5{width:90px;height:90px;background:color-mix(in srgb,var(--bg-color-3) 38%,transparent);left:48%;top:12%;animation-duration:calc(14s / var(--bg-speed))}.orb-6{width:140px;height:140px;background:color-mix(in srgb,var(--bg-color-2) 22%,transparent);left:38%;top:78%;animation-duration:calc(24s / var(--bg-speed))}.orb-7{width:100px;height:100px;background:color-mix(in srgb,var(--bg-color-3) 28%,transparent);left:85%;top:44%;animation-duration:calc(17s / var(--bg-speed))}.orb-8{width:110px;height:110px;background:color-mix(in srgb,var(--bg-color-1) 26%,transparent);left:2%;top:44%;animation-duration:calc(19s / var(--bg-speed))}.meteor{position:fixed;width:2px;height:100px;background:linear-gradient(to bottom,color-mix(in srgb,var(--bg-color-1) 80%,white),transparent);z-index:1;opacity:.8;transform:rotate(35deg);animation:meteorFall calc(7s / var(--bg-speed)) linear infinite;pointer-events:none}.meteor-1{left:12%;top:-10%;animation-delay:0s}.meteor-2{left:28%;top:-20%;animation-delay:1s}.meteor-3{left:46%;top:-15%;animation-delay:2.5s}.meteor-4{left:63%;top:-18%;animation-delay:1.6s}.meteor-5{left:79%;top:-12%;animation-delay:3.1s}.meteor-6{left:90%;top:-25%;animation-delay:4.2s}header,nav,main,.id-box{position:relative;z-index:2}header{text-align:center;margin-bottom:16px}.id-box{display:flex;gap:8px;margin:0 auto 10px;max-width:560px}.tabs{display:flex;gap:8px;justify-content:center;margin-bottom:18px;flex-wrap:wrap}button{border:1px solid #3aa9ff66;background:#0a2f4c;color:#d9f3ff;border-radius:12px;padding:10px 14px;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}button:disabled{opacity:.55;cursor:not-allowed}button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 20px #2a9df433}button.active{background:#135891}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}.categories-grid{margin-bottom:12px}.card{background:#0b2640cc;border:1px solid #51bdff33;border-radius:16px;padding:16px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.category-tile{cursor:pointer}.category-tile.selected{border-color:#6dd5ff;box-shadow:0 0 0 1px #6dd5ff66 inset}.category-image{width:100%;height:110px;object-fit:cover;border-radius:10px;margin-bottom:8px}.price{font-size:22px;font-weight:700;color:#6dd5ff}.status{text-align:center;margin-bottom:12px;color:#9ae1ff}.actions{display:flex;flex-wrap:wrap;gap:10px}.admin-wrap{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}input{width:100%;background:#031a2c;border:1px solid #4cbcff66;border-radius:10px;color:#ecf9ff;padding:10px;margin-bottom:10px}.float-in{animation:floatIn .6s ease}.pulse{animation:pulse 2.2s infinite}@keyframes move{0%{transform:translate(-2%,-2%) scale(1)}to{transform:translate(3%,4%) scale(1.08)}}@keyframes drift{0%{transform:translate(0) scale(1)}to{transform:translate(24px,-18px) scale(1.15)}}@keyframes gradientShift{0%{background-position:0% 50%}to{background-position:100% 50%}}@keyframes gridMove{0%{background-position:0 0,0 0}to{background-position:80px 80px,80px 80px}}@keyframes spotlight{0%{background-position:0% 0%;transform:translate(-5%)}to{background-position:100% 100%;transform:translate(8%)}}@keyframes meteorFall{0%{transform:translateY(-40px) translate(0) rotate(35deg);opacity:.85}to{transform:translateY(120vh) translate(190px) rotate(35deg);opacity:0}}@keyframes floatIn{0%{transform:translateY(12px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes pulse{0%,to{box-shadow:0 0 #2a9df400}50%{box-shadow:0 0 30px #2a9df444}}select{width:100%;background:#031a2c;border:1px solid #4cbcff66;border-radius:10px;color:#ecf9ff;padding:10px;margin-bottom:10px}.table-wrap{max-height:260px;overflow:auto}.profile-head{display:flex;align-items:center;gap:12px;margin-bottom:10px}.avatar{width:54px;height:54px;border-radius:50%;object-fit:cover;border:1px solid #4cbcff66}.avatar.placeholder{background:#0a2f4c}.muted{opacity:.75;font-size:13px}.topup-box{width:100%;border:1px solid #4cbcff44;border-radius:12px;padding:12px;background:#06233a99}.topup-box h4{margin-top:0;margin-bottom:10px}.quick-amounts{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}.quick-amounts button{padding:8px 12px;border-radius:10px}.support-link{color:#9fe7ff;font-weight:700;text-decoration:none}.faq-item{border-top:1px solid #4cbcff33;padding-top:8px;margin-top:8px}.qr-btn{padding:0;background:transparent;border:0}.qr-modal{position:fixed;top:0;right:0;bottom:0;left:0;background:#03101fcc;z-index:20;display:flex;align-items:center;justify-content:center;padding:20px}.qr-modal-content{display:flex;flex-direction:column;gap:12px;align-items:center;background:#06233a;border:1px solid #4cbcff55;border-radius:16px;padding:18px}.category-admin-list{margin-top:10px;display:grid;gap:8px}.category-admin-row{display:flex;justify-content:space-between;align-items:center;gap:8px;padding-top:8px;border-top:1px solid #4cbcff33}.category-admin-row button{padding:6px 10px}@media (max-width: 768px){.app{padding:14px}.tabs{gap:6px}button{padding:9px 11px;border-radius:10px}.grid{grid-template-columns:1fr}.card{padding:12px}.price{font-size:20px}}
