@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Outfit:wght@300;400;500;600;700;800&family=Sarabun:wght@300;400;500;600;700;800&display=swap";:root{--bg-dark:#0a0a0c;--bg-card:#121216b3;--border-color:#ffffff14;--primary:#6c5ce7;--primary-glow:#6c5ce766;--accent-cyan:#00ecff;--accent-pink:#ff007f;--bronze-grad:linear-gradient(135deg, #4d2310 0%, #a05a35 50%, #4d2310 100%);--bronze-border:#a05a3566;--silver-grad:linear-gradient(135deg, #2d3436 0%, #dfe6e9 50%, #2d3436 100%);--silver-border:#dfe6e966;--gold-grad:linear-gradient(135deg, #785a00 0%, #ffeaa7 50%, #d4af37 70%, #785a00 100%);--gold-border:#feca5766;--platinum-grad:linear-gradient(135deg, #1e1330 0%, #a29bfe 50%, #e0d4f7 80%, #1e1330 100%);--platinum-border:#a29bfe66;--diamond-grad:linear-gradient(135deg, #0f171e 0%, #00ecff 40%, #fff 60%, #0a3d62 80%, #0f171e 100%);--diamond-border:#00ecff80;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:Outfit,Sarabun,Inter,system-ui,sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}body{background-color:var(--bg-dark);color:#f1f2f6;background-image:radial-gradient(circle at 10% 20%,#6c5ce726 0%,#0000 40%),radial-gradient(circle at 90% 80%,#00ecff1a 0%,#0000 40%);background-attachment:fixed;min-height:100vh;font-size:15px;line-height:1.5;overflow-x:hidden}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:#0003}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#fff3}.app-container{border-left:1px solid var(--border-color);border-right:1px solid var(--border-color);background-color:#060608d9;max-width:480px;min-height:100vh;margin:0 auto;padding-bottom:90px;position:relative}.glass-panel{background:var(--bg-card);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border-color);border-radius:20px;margin-bottom:16px;padding:20px;transition:transform .3s cubic-bezier(.175,.885,.32,1.275),border-color .3s;box-shadow:0 8px 32px #0000005e}.glass-panel:active{transform:scale(.98)}.rank-card{border:1.5px solid #ffffff1a;border-radius:24px;flex-direction:column;justify-content:space-between;height:200px;padding:24px;transition:all .5s cubic-bezier(.15,.83,.66,1);display:flex;position:relative;overflow:hidden;box-shadow:0 15px 35px #00000080}.rank-card:before{content:"";opacity:.03;z-index:1;background-image:linear-gradient(45deg,#ffffff26 25%,#0000 25% 50%,#ffffff26 50% 75%,#0000 75%,#0000);background-size:100px 100px;position:absolute;inset:0}.rank-card:after{content:"";pointer-events:none;z-index:2;opacity:.8;background:linear-gradient(#fff0 0%,#ffffff0d 30%,#fff3 50%,#ffffff0d 70%,#fff0 100%);width:200%;height:200%;transition:all .8s;position:absolute;top:-50%;left:-50%;transform:rotate(30deg)}.rank-card:hover:after{transform:translate(30%,30%)rotate(30deg)}.rank-bronze{background:var(--bronze-grad);border-color:var(--bronze-border);box-shadow:0 10px 30px #a05a354d}.rank-silver{background:var(--silver-grad);border-color:var(--silver-border);color:#2d3436;box-shadow:0 10px 30px #dfe6e933}.rank-silver .card-title,.rank-silver .card-label,.rank-silver .card-value{color:#0f141d!important;text-shadow:none!important}.rank-gold{background:var(--gold-grad);border-color:var(--gold-border);color:#2c1a04;box-shadow:0 10px 30px #feca5740}.rank-gold .card-title,.rank-gold .card-label,.rank-gold .card-value{color:#3b2203!important;text-shadow:none!important}.rank-platinum{background:var(--platinum-grad);border-color:var(--platinum-border);box-shadow:0 10px 30px #a29bfe59}.rank-diamond{background:var(--diamond-grad);border-color:var(--diamond-border);box-shadow:0 10px 30px #00ecff4d}.rank-diamond:before{content:"";pointer-events:none;border-radius:22px;animation:2s infinite alternate pulse-border;position:absolute;inset:0;box-shadow:inset 0 0 40px #00ecff66}@keyframes pulse-border{0%{box-shadow:inset 0 0 20px #00ecff4d}to{box-shadow:inset 0 0 45px #00ecffb3}}.card-shine{text-shadow:0 2px 4px #0006}.bottom-nav{-webkit-backdrop-filter:blur(20px);border:1.5px solid var(--border-color);z-index:1000;background:#0e0e12d9;border-radius:32px;justify-content:space-around;align-items:center;width:calc(100% - 32px);max-width:448px;height:64px;padding:0 10px;display:flex;position:fixed;bottom:16px;left:50%;transform:translate(-50%);box-shadow:0 15px 35px #0009}.nav-item{color:#747d8c;cursor:pointer;border-radius:50%;flex-direction:column;align-items:center;padding:8px;font-size:11px;font-weight:500;text-decoration:none;transition:all .3s cubic-bezier(.175,.885,.32,1.275);display:flex}.nav-item.active{color:var(--accent-cyan);transform:translateY(-4px)}.nav-item-icon{width:22px;height:22px;margin-bottom:2px;transition:transform .3s}.nav-item.active .nav-item-icon{filter:drop-shadow(0 0 6px var(--accent-cyan));transform:scale(1.1)}.progress-ring-circle{transform-origin:50%;transition:stroke-dashoffset .35s;transform:rotate(-90deg)}.btn-primary{background:linear-gradient(135deg, var(--primary) 0%, #4834d4 100%);color:#fff;cursor:pointer;border:none;border-radius:14px;justify-content:center;align-items:center;gap:10px;width:100%;padding:14px 20px;font-size:15px;font-weight:700;transition:all .3s;display:flex;box-shadow:0 6px 20px #6c5ce759}.btn-primary:active{transform:scale(.97);box-shadow:0 3px 10px #6c5ce733}.btn-accent{background:linear-gradient(135deg, var(--accent-cyan) 0%, #0984e3 100%);color:#000;cursor:pointer;border:none;border-radius:14px;justify-content:center;align-items:center;gap:10px;width:100%;padding:14px 20px;font-size:15px;font-weight:700;transition:all .3s;display:flex;box-shadow:0 6px 20px #00ecff4d}.btn-accent:active{transform:scale(.97)}.btn-disabled{color:#ffffff40;cursor:not-allowed;background:#ffffff0d;border:1px solid #ffffff0d;border-radius:14px;justify-content:center;align-items:center;width:100%;padding:14px 20px;font-size:15px;font-weight:600;display:flex}.form-input{color:#fff;background:#ffffff08;border:1.5px solid #ffffff14;border-radius:14px;outline:none;width:100%;padding:14px;font-size:15px;transition:all .3s}.form-input:focus{border-color:var(--primary);box-shadow:0 0 15px var(--primary-glow);background:#ffffff0f}.admin-layout{color:#f1f2f6;background-color:#070709;min-height:100vh;padding:24px}@media (width>=768px){.admin-layout{border-left:1px solid var(--border-color);border-right:1px solid var(--border-color);max-width:1200px;margin:0 auto}}.table-container{border:1px solid var(--border-color);border-radius:16px;overflow-x:auto}.admin-table{border-collapse:collapse;text-align:left;background-color:var(--bg-card);width:100%;font-size:14px}.admin-table th{border-bottom:1.5px solid var(--border-color);color:#a29bfe;background-color:#ffffff08;padding:16px;font-weight:600}.admin-table td{border-bottom:1px solid var(--border-color);padding:16px}.admin-table tr:last-child td{border-bottom:none}.badge{text-transform:uppercase;border-radius:8px;padding:4px 8px;font-size:11px;font-weight:700}.badge-pending{color:#ff9f43;background-color:#ff9f4326}.badge-paid{color:#2ed573;background-color:#2ed57326}.badge-overdue{color:#ff4757;background-color:#ff475726}