:root{--bg:#080b14;--panel:#111827;--panel2:#151f31;--line:#263349;--text:#f4f7ff;--muted:#9aa9bf;--cyan:#57e8ff;--violet:#9b8cff;--green:#4fe0a0;--red:#ff7188;--shadow:0 20px 60px #0006}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 10% -5%,#152e49 0,transparent 34%),radial-gradient(ellipse at 100% 0,#2c174d 0,transparent 30%),var(--bg);color:var(--text);font:15px/1.55 Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}a{color:var(--cyan);text-decoration:none}a:hover{color:#fff}.top{display:flex;align-items:center;justify-content:space-between;padding:19px clamp(18px,4vw,54px);border-bottom:1px solid #ffffff14;background:#070b13d9;position:sticky;top:0;z-index:5;backdrop-filter:blur(16px)}.brand{display:flex;gap:12px;align-items:center;font-weight:850;letter-spacing:.07em}.brandmark{width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,var(--cyan),var(--violet));display:grid;place-items:center;color:#08101a;font-weight:1000;box-shadow:0 0 24px #57e8ff3b}.nav{display:flex;gap:17px;align-items:center;flex-wrap:wrap}.nav a{font-size:13px;color:#c5d0e2}.nav a:hover{color:var(--cyan)}.container{width:min(1180px,calc(100% - 32px));margin:36px auto 70px}.hero{padding:28px 30px;border:1px solid #ffffff18;border-radius:24px;background:linear-gradient(120deg,#14283cdd,#1a1533dd);box-shadow:var(--shadow);position:relative;overflow:hidden}.hero:after{content:"";position:absolute;width:230px;height:230px;border-radius:50%;right:-60px;top:-100px;background:#57e8ff14;filter:blur(4px)}.eyebrow{color:var(--cyan);text-transform:uppercase;font-weight:800;letter-spacing:.16em;font-size:11px}.hero h1{margin:5px 0 9px;font-size:clamp(27px,4vw,42px);line-height:1.14;letter-spacing:-.035em}.hero p{max-width:750px;color:#bac7da;margin:0}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:18px 0}.card{background:linear-gradient(145deg,#151e2e,#0f1624);border:1px solid #ffffff13;border-radius:18px;padding:21px;box-shadow:0 12px 30px #0002}.card h2,.card h3{margin:0 0 9px}.card p{color:var(--muted);margin:0 0 13px}.metric{font-size:26px;font-weight:850;letter-spacing:-.04em}.muted{color:var(--muted)}.section-title{margin:28px 0 12px;font-size:19px}.form{display:grid;gap:12px}.field{display:grid;gap:6px}.field label{font-size:12px;color:#c3cee0;font-weight:750}.input,select,textarea{width:100%;border:1px solid #33415b;background:#0b1220;color:var(--text);border-radius:11px;padding:12px 13px;font:inherit;outline:none}.input:focus,select:focus,textarea:focus{border-color:var(--cyan);box-shadow:0 0 0 3px #57e8ff16}textarea{min-height:100px;resize:vertical}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:linear-gradient(100deg,var(--cyan),#a6a0ff);color:#07111b;border:0;border-radius:11px;padding:11px 16px;font-weight:850;cursor:pointer;font-size:13px}.btn:hover{filter:brightness(1.08);color:#07111b}.btn.secondary{background:#202c41;color:#e7eefc;border:1px solid #34425c}.btn.danger{background:#381b2a;color:#ffc1cb;border:1px solid #713044}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.table-wrap{overflow:auto;border:1px solid #ffffff15;border-radius:14px}table{width:100%;border-collapse:collapse;min-width:550px}th,td{text-align:left;padding:12px 14px;border-bottom:1px solid #ffffff10}th{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:#96a7bf;background:#111a2a}td{font-size:13px}tr:last-child td{border-bottom:0}.pill{display:inline-flex;border-radius:99px;padding:4px 9px;font-size:11px;font-weight:800;background:#1f3c36;color:#83f6bf}.pill.warn{background:#3a2e18;color:#ffe08b}.pill.bad{background:#3f202d;color:#ffafbf}.alert{padding:12px 14px;border-radius:12px;margin:0 0 16px;border:1px solid #ffffff1b;background:#142133}.alert.success{border-color:#2b745b;color:#98f6cb}.alert.error{border-color:#7e3546;color:#ffbdc7}.pre{white-space:pre-wrap;overflow:auto;max-height:480px;background:#050a12;border:1px solid #27344a;border-radius:13px;padding:16px;color:#bdefff;font:12px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace}.auth{width:min(480px,calc(100% - 28px));margin:7vh auto}.auth .hero{margin-bottom:16px}.small{font-size:12px}.footer{border-top:1px solid #ffffff12;text-align:center;color:#63728a;padding:25px 14px;font-size:12px}.inline{display:inline}.ticket{border:1px solid #ffffff14;border-radius:13px;padding:14px;margin:10px 0;background:#0e1522}.bubble{padding:12px;border-radius:12px;background:#151f30;margin:8px 0}.bubble.admin{border-left:3px solid var(--cyan)}.bubble.user{border-left:3px solid var(--violet)}.empty{padding:25px;text-align:center;color:var(--muted)}@media(max-width:820px){.grid{grid-template-columns:1fr}.top{align-items:flex-start;gap:13px;flex-direction:column}.nav{gap:12px}.container{margin-top:20px}.hero{padding:22px}.metric{font-size:23px}}@media(min-width:821px){.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}}
[hidden]{display:none!important}details{color:var(--muted);margin-top:8px}summary{cursor:pointer;color:var(--cyan);font-weight:750}button:disabled{opacity:.45;cursor:not-allowed;filter:saturate(.4)}.steps{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.step-chip{padding:6px 10px;border:1px solid #ffffff18;border-radius:999px;color:#c5d0e2;font-size:12px;background:#101827}

/* Luxury RGB upgrade — subtle animated accents, soft glass and touch-friendly controls. */
:root{--pink:#ff4fd8;--blue:#5ca8ff;--gold:#ffd37a;--glass:rgba(12,18,32,.78)}
html{scroll-behavior:smooth}body{isolation:isolate;overflow-x:hidden;background-attachment:fixed}
body:before{content:"";position:fixed;inset:-30%;z-index:-1;pointer-events:none;background:conic-gradient(from 45deg at 50% 50%,#36d9ff0b,#ac65ff0d,#ff4fd808,#39f4af08,#36d9ff0b);filter:blur(44px);animation:ambientShift 26s linear infinite}
@keyframes ambientShift{from{transform:rotate(0deg) scale(1)}to{transform:rotate(360deg) scale(1.08)}}
.top{box-shadow:0 10px 38px #0003}
.brandmark{position:relative;isolation:isolate;overflow:hidden}.brandmark:after{content:"";position:absolute;inset:-60%;z-index:-1;background:linear-gradient(120deg,transparent 35%,#ffffffa6 48%,transparent 60%);transform:translateX(-120%) rotate(15deg);animation:brandSweep 5s ease-in-out infinite}
@keyframes brandSweep{0%,60%{transform:translateX(-120%) rotate(15deg)}80%,100%{transform:translateX(120%) rotate(15deg)}}
.hero,.card{position:relative;isolation:isolate;animation:riseIn .55s cubic-bezier(.2,.75,.25,1) both}
.hero{border-color:#6fe9ff35;background:linear-gradient(125deg,rgba(18,43,62,.92),rgba(32,19,54,.91) 62%,rgba(17,28,47,.94));box-shadow:0 20px 70px #0004,0 0 34px #6fe9ff0a}
.hero:before,.card:before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(125deg,#53e6ff55,#ac74ff25,#ff55d51b,#48ffc21f);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;opacity:.7}
.card{transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;background:linear-gradient(145deg,rgba(21,30,46,.96),rgba(10,16,28,.96));}
.card:hover{transform:translateY(-3px);border-color:#61e8ff52;box-shadow:0 20px 48px #0004,0 0 20px #57e8ff0b}
.auth{animation:riseIn .55s ease both}.auth .hero{box-shadow:0 24px 80px #0005,0 0 40px #8a63ff12}.auth .card{border-color:#8b7cff2c}
.input,select,textarea{transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;background-color:#090f1b}
.input:focus,select:focus,textarea:focus{border-color:var(--cyan);box-shadow:0 0 0 3px #57e8ff17,0 0 20px #57e8ff0a;background-color:#0c1423}
.btn{position:relative;isolation:isolate;overflow:hidden;transform:translateZ(0);box-shadow:0 5px 18px #57e8ff0c;transition:transform .18s ease,filter .18s ease,box-shadow .18s ease}
.btn:before{content:"";position:absolute;inset:-80% auto -80% -40%;width:28%;background:linear-gradient(90deg,transparent,#ffffff8a,transparent);transform:translateX(-200%) rotate(15deg);z-index:-1;transition:transform .7s ease}
.btn:hover{transform:translateY(-1px);box-shadow:0 8px 24px #57e8ff20;filter:saturate(1.1) brightness(1.06)}.btn:hover:before{transform:translateX(620%) rotate(15deg)}.btn:active{transform:translateY(0) scale(.985)}
.btn-glow{background:linear-gradient(105deg,#54e6ff,#a69bff 50%,#f876d5);background-size:180% 180%;animation:buttonHue 7s ease infinite;color:#07111b;box-shadow:0 0 24px #70dfff21}
@keyframes buttonHue{0%,100%{background-position:0 50%}50%{background-position:100% 50%}}
.btn.secondary{box-shadow:inset 0 0 0 1px #ffffff05}.btn.danger{box-shadow:0 0 18px #ff71880a}
.pill{letter-spacing:.01em;border:1px solid #4fe0a025}.pill.warn{border-color:#ffdb7a2c}.pill.bad{border-color:#ff71882c}
.table-wrap{box-shadow:0 12px 30px #0002;background:#0b1120a8}tbody tr{transition:background .16s ease}tbody tr:hover{background:#ffffff07}
.payment-shell{width:min(760px,calc(100% - 28px));margin:5vh auto 70px}.payment-hero{margin-bottom:18px}.payment-card{border-color:#46e9ff40;background:linear-gradient(145deg,#121d2c,#0e1422)}.payment-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap}.payment-card-head h2{margin:4px 0 7px}.deposit-form{margin-top:18px}.input-amount{font-size:22px;font-weight:800;letter-spacing:-.03em}.payment-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:17px 0;padding:16px;border:1px solid #ffffff13;border-radius:14px;background:linear-gradient(110deg,#13273a88,#241b3988)}.payment-summary>div{display:grid;gap:5px}.payment-summary strong{font-size:17px}.payment-detail{display:flex;justify-content:space-between;gap:14px;border-bottom:1px solid #ffffff0e;padding:11px 0;color:var(--muted);font-size:13px}.payment-detail strong{color:var(--text);text-align:right}.payment-receipt{padding:clamp(20px,4vw,30px)}.footer-note{text-align:center;color:#7f8da2;font-size:12px;padding:18px}.payment-card .btn,.deposit-form .btn{width:100%;min-height:48px}.payment-card p{margin-top:8px}.payment-shell .alert{margin:16px 0}.steps{margin-bottom:3px}.section-title{letter-spacing:-.02em}
@keyframes riseIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:580px){.payment-summary{grid-template-columns:1fr}.payment-card-head{align-items:flex-start}.payment-detail{align-items:flex-start}.payment-detail strong{max-width:62%}.deposit-form .btn{width:100%}.top{padding:15px}.container{width:calc(100% - 22px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
