:root{
  --bg:#030514;
  --bg2:#090724;
  --panel:#090d22;
  --panel2:#0f1631;
  --glass:rgba(10,14,38,.82);
  --glass2:rgba(20,18,55,.74);
  --text:#f4f7ff;
  --muted:#a9b2d6;
  --soft:#6f7ba8;
  --accent:#b026ff;
  --accent2:#236bff;
  --accent3:#ff2ecb;
  --cyan:#25d7ff;
  --green:#22e58a;
  --danger:#ff4d6d;
  --warning:#ffd166;
  --border:rgba(117,88,255,.38);
  --border2:rgba(37,215,255,.22);
  --line:rgba(255,255,255,.08);
  --shadow:0 28px 80px rgba(0,0,0,.42);
  --glow:0 0 22px rgba(176,38,255,.42),0 0 44px rgba(35,107,255,.18);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,Arial,Helvetica,sans-serif;
  color:var(--text);
  min-height:100vh;
  background:
    radial-gradient(circle at 8% 10%,rgba(255,46,203,.30),transparent 28%),
    radial-gradient(circle at 86% 8%,rgba(35,107,255,.35),transparent 30%),
    radial-gradient(circle at 60% 90%,rgba(176,38,255,.22),transparent 28%),
    linear-gradient(145deg,#030514 0%,#071029 45%,#040617 100%);
  overflow-x:hidden;
}
body:before{
  content:"";
  position:fixed;inset:0;pointer-events:none;z-index:-1;
  background:
    linear-gradient(120deg,transparent 0 42%,rgba(255,46,203,.12) 43%,transparent 47%),
    linear-gradient(65deg,transparent 0 53%,rgba(37,215,255,.10) 54%,transparent 58%),
    radial-gradient(circle at 20% 98%,rgba(255,46,203,.20),transparent 18%);
  filter:blur(.2px);
}
body:after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;opacity:.22;
  background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:44px 44px;
  mask-image:linear-gradient(to bottom,transparent,black 12%,black 72%,transparent);
}
.wrap{max-width:1240px;margin:0 auto;padding:28px}
.card{
  background:linear-gradient(180deg,rgba(15,22,49,.88),rgba(6,10,27,.88));
  border:1px solid var(--border);
  border-radius:28px;
  padding:24px;
  box-shadow:var(--shadow),inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter:blur(18px);
  position:relative;
  overflow:hidden;
}
.card:before{content:"";position:absolute;inset:0;border-radius:28px;pointer-events:none;background:linear-gradient(135deg,rgba(255,46,203,.08),transparent 34%,rgba(35,107,255,.08));}
.card>*{position:relative}
.grid{display:grid;gap:20px}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.topbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;gap:14px}
.brand{font-size:28px;font-weight:950;letter-spacing:-.7px;display:flex;align-items:center;text-shadow:0 0 24px rgba(176,38,255,.32)}
.brand:before{content:'♫';display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;margin-right:12px;border-radius:14px;background:linear-gradient(135deg,var(--accent3),var(--accent2));box-shadow:0 0 22px rgba(255,46,203,.5),0 0 34px rgba(35,107,255,.32)}
h1,h2,h3{letter-spacing:-.5px}h2{margin-top:0}.muted{color:var(--muted)}.small{font-size:13px;color:var(--muted);line-height:1.45}
label{display:block;font-weight:850;margin-top:10px;color:#e9edff}
input,select,textarea{
  width:100%;padding:15px 16px;border-radius:16px;border:1px solid rgba(117,88,255,.28);
  background:rgba(5,9,26,.82);color:var(--text);margin:8px 0 14px;outline:none;transition:.2s;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
textarea{min-height:94px;resize:vertical}
input:focus,select:focus,textarea:focus{border-color:var(--accent3);box-shadow:0 0 0 4px rgba(255,46,203,.16),0 0 24px rgba(35,107,255,.12)}
.btn{
  border:0;border-radius:16px;padding:12px 16px;background:linear-gradient(135deg,var(--accent3),var(--accent),var(--accent2));
  color:white;font-weight:950;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  box-shadow:0 14px 34px rgba(176,38,255,.28),0 0 18px rgba(35,107,255,.15);transition:.18s;
}
.btn:hover{transform:translateY(-1px);filter:brightness(1.12);box-shadow:0 18px 38px rgba(176,38,255,.34),0 0 28px rgba(37,215,255,.18)}
.btn.green{background:linear-gradient(135deg,#16e68a,#16b86f);box-shadow:0 14px 34px rgba(34,229,138,.22)}
.btn.red{background:linear-gradient(135deg,#ff4d6d,#9f1239)}
.btn.gray{background:linear-gradient(135deg,#263457,#141b34);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.nav-actions,.qr-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.qr-actions{margin-top:14px}
.stat{background:linear-gradient(180deg,rgba(20,29,61,.84),rgba(10,15,34,.92));border:1px solid rgba(117,88,255,.32);border-radius:22px;padding:18px;box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
.stat strong{font-size:32px;display:block;margin-top:6px;color:#fff;text-shadow:0 0 24px rgba(37,215,255,.22)}
.request{display:flex;justify-content:space-between;gap:16px;align-items:center;border:1px solid var(--border);border-radius:20px;padding:18px;margin:12px 0;background:linear-gradient(135deg,rgba(12,17,42,.94),rgba(17,21,54,.9))}.amount{font-size:28px;font-weight:1000;color:var(--warning)}.song{font-size:19px;font-weight:900;margin:4px 0}
.profile,.profile-sm{border-radius:999px;object-fit:cover;border:2px solid rgba(255,255,255,.18);box-shadow:0 0 0 4px rgba(176,38,255,.18),0 10px 28px rgba(0,0,0,.34)}
.profile{width:62px;height:62px}.profile-sm{width:42px;height:42px;vertical-align:middle;margin-right:9px}.big-profile{width:92px;height:92px}
.profile-placeholder{width:58px;height:58px;border-radius:999px;background:linear-gradient(135deg,var(--accent3),var(--accent2));display:inline-flex;align-items:center;justify-content:center;font-weight:900}
.qrbox{background:#fff;padding:10px;border-radius:24px;display:inline-block;box-shadow:0 0 0 5px rgba(255,46,203,.25),0 0 34px rgba(37,215,255,.30)}
.qr-fat{position:relative;padding:0;border:0!important;background:#fff}.qr-fat>img{display:block;image-rendering:crisp-edges;border-radius:0}.qr-logo{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:76px;height:76px;border-radius:999px;background:transparent!important;border:0!important;display:flex;align-items:center;justify-content:center;box-shadow:none!important;overflow:hidden}.qr-logo img{width:100%;height:100%;object-fit:cover;border-radius:999px;display:block}
.notice{padding:14px;border-radius:17px;background:linear-gradient(135deg,rgba(25,35,73,.9),rgba(12,20,48,.9));border:1px solid rgba(37,215,255,.24);margin:14px 0}.notice.success{background:#0f2f20;border-color:#1f7a48}.notice.danger{background:#35161b;border-color:#7f1d1d}.soft-hr{border:0;border-top:1px solid var(--border);margin:20px 0}
.tip-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:8px 0 14px}.tip-option{display:block;padding:14px;border:1px solid rgba(117,88,255,.3);border-radius:16px;background:rgba(11,16,40,.85);font-weight:900;cursor:pointer;transition:.18s}.tip-option input{width:auto;margin:0 8px 0 0}.tip-option:has(input:checked){border-color:var(--accent3);background:rgba(176,38,255,.14);box-shadow:0 0 0 4px rgba(255,46,203,.12),0 0 20px rgba(35,107,255,.18)}
.table-wrap{overflow:auto}.table{width:100%;border-collapse:separate;border-spacing:0;min-width:860px}.table th,.table td{padding:14px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}.table th{color:var(--muted);font-size:13px;text-transform:uppercase;letter-spacing:.04em}.badge{display:inline-block;padding:6px 10px;border-radius:999px;background:#25304d;color:#dbeafe;font-size:12px;font-weight:900}.badge.paid{background:#064e3b;color:#bbf7d0}.badge.pending{background:#78350f;color:#fde68a}.badge.reject{background:#7f1d1d;color:#fecaca}
.admin-tabs{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}.admin-tabs a{color:white;text-decoration:none;padding:10px 14px;border-radius:14px;background:#1f2937;font-weight:800}.auth-card{max-width:480px;margin:40px auto}.hero-title{font-size:38px;margin:0 0 8px}.footer-note{margin-top:16px;text-align:center;color:var(--muted)}
.request-table{width:100%;border-collapse:separate!important;border-spacing:0 11px!important}.request-table th{text-align:left;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.06em;padding:6px 10px}.request-table td{background:linear-gradient(90deg,rgba(11,18,45,.92),rgba(14,19,45,.86));border-top:1px solid rgba(117,88,255,.30);border-bottom:1px solid rgba(117,88,255,.24);padding:13px 12px!important;vertical-align:middle}.request-table td:first-child{border-left:1px solid rgba(117,88,255,.30);border-radius:16px 0 0 16px;font-weight:950}.request-table td:last-child{border-right:1px solid rgba(117,88,255,.30);border-radius:0 16px 16px 0}.tabs{display:flex;gap:8px;flex-wrap:wrap}.tabbtn{background:linear-gradient(135deg,#263457,#151b34)}.tabbtn.active{background:linear-gradient(135deg,var(--accent3),var(--accent2));box-shadow:0 0 26px rgba(176,38,255,.35)}.section-title{margin:18px 0 8px}.value{font-weight:1000;color:var(--green);text-shadow:0 0 18px rgba(34,229,138,.26)}
@media(max-width:760px){.wrap{padding:18px}.grid-2{grid-template-columns:1fr}.request{display:block}.request .actions{margin-top:12px}.topbar{display:block}.nav-actions{justify-content:flex-start;margin-top:12px}.qr-fat>img{width:240px;height:240px}.qr-logo{width:66px;height:66px}.stat strong{font-size:26px}.hero-title{font-size:30px}}
@media(max-width:520px){.tip-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.btn{width:100%;margin-top:6px}.qr-actions .btn{width:100%;margin-top:8px}}