/* Vouxat Giveaway — Frontend CSS v1.0.0
 * Dark mode driven by Miracle App Shell / Miracle Template.
 * Activated by: body.dark-mode | html[data-theme="dark"]
 */
.vg-page,.vg-shell{
  --vg-bg:#f3f4f6;--vg-card:#fff;--vg-elevated:#f8fafc;
  --vg-border:#e5e7eb;--vg-border-soft:#eadfc2;
  --vg-text:#111827;--vg-sub:#5f6b7a;--vg-sub2:#6b7280;
  --vg-navy:#1a2744;--vg-gold:#D4AF37;
}
body.dark-mode .vg-page,body.dark-mode .vg-shell,
html[data-theme="dark"] .vg-page,html[data-theme="dark"] .vg-shell{
  --vg-bg: var(--c-bg, #18191a);
  --vg-card: var(--c-card, #242526);
  --vg-elevated: var(--c-elevated, #3a3b3c);
  --vg-border: var(--c-border, #3e4042);
  --vg-border-soft: var(--c-border, #3e4042);
  --vg-text: var(--c-text, #e4e6eb);
  --vg-sub: var(--c-text2, #b0b3b8);
  --vg-sub2: var(--c-text2, #b0b3b8);
}

.vg-page{max-width:820px;margin:0 auto;padding:20px;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Plus Jakarta Sans",sans-serif}
.vg-shell{display:grid;gap:18px;color:var(--vg-text)}
.vg-card{background:var(--vg-card);border:1px solid var(--vg-border-soft);border-radius:24px;padding:22px;box-shadow:0 18px 45px rgba(17,24,39,.08);transition:background .2s ease,border-color .2s ease}
body.dark-mode .vg-card,html[data-theme="dark"] .vg-card{box-shadow:0 18px 45px rgba(0,0,0,.4)}

/* Tabs */
.vg-tabs{display:flex;gap:24px;border-bottom:1px solid var(--vg-border-soft);margin-bottom:4px}
.vg-tab{background:none;border:0;padding:10px 2px 14px;font-size:16px;font-weight:700;color:var(--vg-sub);cursor:pointer;position:relative;border-bottom:2px solid transparent}
.vg-tab.is-active{color:var(--vg-navy)}
body.dark-mode .vg-tab.is-active,html[data-theme="dark"] .vg-tab.is-active{color:var(--vg-gold)}
.vg-tab.is-active::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;border-radius:3px;background:var(--vg-gold)}
.vg-tabpanel[hidden]{display:none}

/* Hero / referral box */
.vg-hero{background:linear-gradient(135deg,#1a1440,#241a5e);color:#fff;border-color:rgba(255,255,255,.08)}
.vg-kicker{font-size:12px;letter-spacing:.18em;text-transform:uppercase;opacity:.75;margin-bottom:8px}
.vg-title{margin:0 0 18px;font-size:26px;line-height:1.25;max-width:34ch}
.vg-linkrow{margin-bottom:12px}
.vg-link{width:100%;padding:14px 16px;border-radius:16px;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.08);color:#fff;font-size:14px}
.vg-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px}
.vg-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:14px 16px;border-radius:999px;background:var(--vg-gold);color:#1a1440;text-decoration:none;border:0;cursor:pointer;font-weight:700;font-size:14px;transition:opacity .15s ease,transform .15s ease}
.vg-btn:hover{opacity:.92}
.vg-btn--dark{background:#6c4bff;color:#fff}
.vg-btn--ghost{background:#fff;color:#241a5e}
.vg-share-icon{font-size:15px}
.vg-channel-row{display:flex;flex-wrap:wrap;gap:8px}
.vg-chan{display:inline-flex;align-items:center;padding:8px 14px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#fff;font-size:13px;text-decoration:none;cursor:pointer}
.vg-chan.is-copied{background:#3ecf8e;border-color:#3ecf8e;color:#06281c}

/* Rewards / stats */
.vg-grid{display:grid;grid-template-columns:1fr;gap:18px}
.vg-reward-list,.vg-stats{display:grid;gap:10px}
.vg-reward,.vg-stats > div{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;background:var(--vg-elevated);border:1px solid var(--vg-border);border-radius:16px;color:var(--vg-text)}
.vg-stats{grid-template-columns:repeat(4,1fr)}
.vg-stats > div{flex-direction:column;align-items:flex-start;gap:4px}
.vg-stats strong{font-size:20px}
.vg-stats span{font-size:12px;color:var(--vg-sub2)}
.vg-help{opacity:.85;margin:12px 0 0;color:var(--vg-sub);font-size:13px;line-height:1.6}

/* Wallet */
.vg-walletrow{display:flex;align-items:center;gap:10px;font-size:15px}
.vg-wallet-icon{font-size:18px;color:var(--vg-gold)}
.vg-walletrow strong{margin-left:auto;font-size:17px}
.vg-earn-total{font-size:34px;font-weight:800;margin:6px 0 16px;color:var(--vg-navy)}
body.dark-mode .vg-earn-total,html[data-theme="dark"] .vg-earn-total{color:var(--vg-gold)}

/* Table */
.vg-table{width:100%;border-collapse:collapse;color:var(--vg-text);margin-top:8px}
.vg-table th,.vg-table td{border-bottom:1px solid var(--vg-border-soft);padding:10px 8px;text-align:left;font-size:13px}

h3{margin:0 0 10px;font-size:16px}

@media (max-width: 560px){
	.vg-title{font-size:22px}
	.vg-actions{grid-template-columns:1fr}
	.vg-stats{grid-template-columns:repeat(2,1fr)}
}