/* =============================================
   RAN Online Sacred Gate — Main CSS
   ============================================= */
:root {
  --gold: #f3f3f2;
  --gold-bright: #f0c96a;
  --gold-dark: #8a6f2e;
  --red: #c0392b;
  --red-bright: #e74c3c;
  --dark: #0b1220;
  --dark2: #0e1628;
  --dark3: #111e32;
  --panel: rgba(14,22,40,0.92);
  --border: rgba(200,168,75,0.25);
  --border-bright: rgba(200,168,75,0.7);
  --text: #c8d8f0;
  --text-dim: #f3f3f2;
  --online: #2ecc71;
  --blue: #3498db;
  --purple: #9b59b6;
}

*{margin:0;padding:0;box-sizing:border-box;}

html { font-size: 16px; } /* base size — naikkan di sini untuk semua halaman */
body{
  font-family:'Rajdhani',sans-serif;
  background:var(--dark);
  color:var(--text);
  font-size:1rem;
  min-height:100vh;
  overflow-x:hidden;
}
/* Semua panel & card pakai backdrop-filter agar bg tembus */
.card,.adm-card,.ma-card,.ran-panel,.hc-box,.rm-card {
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
}

/* ══ BACKGROUND IMAGE SUPPORT ══
   Letakkan assets/images/bg-main.jpg untuk background global
   Jika tidak ada, fallback ke gradient gelap
   ══════════════════════════════ */
.bg-canvas{
  position:fixed;inset:0;z-index:0;
  background-color: #0b1220;
  background-size: cover;
  background-position: center top;
  background-attachment: fixed;
  background-repeat: no-repeat;
}
/* Overlay gelap di atas background image */
.bg-canvas::after{
  content:'';
  position:absolute;inset:0;
  background:
    linear-gradient(180deg,
      rgba(5,5,8,.80) 0%,
      rgba(5,5,8,.65) 40%,
      rgba(5,5,8,.84) 100%),
    radial-gradient(ellipse 80% 60% at 50% -10%,rgba(200,168,75,.07) 0%,transparent 60%),
    radial-gradient(ellipse 60% 40% at 20% 80%,rgba(192,57,43,.04) 0%,transparent 50%);
  pointer-events:none;
}

.particles{position:fixed;inset:0;z-index:1;overflow:hidden;pointer-events:none;}
.particle{
  position:absolute;width:2px;height:2px;background:var(--gold);
  border-radius:50%;opacity:0;animation:float-particle linear infinite;
}
@keyframes float-particle{
  0%{transform:translateY(100vh) translateX(0);opacity:0;}
  10%{opacity:.6;}90%{opacity:.3;}
  100%{transform:translateY(-10vh) translateX(calc(var(--drift,0)*1px));opacity:0;}
}

/* NAV */
nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  height:64px;
  background:linear-gradient(180deg,#005a8b 0%,#00456b 50%,#00394a 100%);
  border-bottom:1px solid rgba(150,30,30,.5);
  display:flex;align-items:center;justify-content:space-between;
  padding:0 32px;
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  box-shadow:0 2px 24px rgba(120,0,0,.5);
}

.nav-logo{display:flex;align-items:center;gap:12px;text-decoration:none;}
.logo-icon{
  width:38px;height:38px;
  background:transparent;
  clip-path:none;border:none;box-shadow:none;
  display:flex;align-items:center;justify-content:center;
  font-size:18px;font-weight:900;color:var(--gold);
  font-family:'Orbitron',sans-serif;
}
@keyframes logo-pulse{
  0%,100%{opacity:1;}
  50%{opacity:.85;}
}
.logo-text{
  font-family:'Cinzel',serif;font-size:22px;font-weight:900;
  background:linear-gradient(135deg,var(--gold-bright),var(--gold),var(--gold-dark));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:3px;
}
.logo-sub{font-size:10px;letter-spacing:4px;color:var(--gold-dark);text-transform:uppercase;display:block;margin-top:-4px;}

.nav-links{display:flex;align-items:center;gap:4px;list-style:none;}
.nav-links a{
  display:flex;align-items:center;gap:6px;padding:8px 14px;
  text-decoration:none;color:var(--text-dim);
  font-size:13px;font-weight:600;letter-spacing:1px;text-transform:uppercase;
  border-radius:4px;transition:all .2s;border:1px solid transparent;
}
.nav-links a{color:rgba(255,220,200,.8);}
.nav-links a:hover,.nav-links a.active{color:#fff;border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.12);}

.nav-actions{display:flex;gap:10px;align-items:center;}

.online-badge{
  display:flex;align-items:center;gap:6px;padding:5px 12px;
  background:rgba(46,204,113,.1);border:1px solid rgba(46,204,113,.25);
  border-radius:4px;font-size:13px;font-weight:600;color:#2ecc71;letter-spacing:1px;
}
.online-dot{width:6px;height:6px;background:var(--online);border-radius:50%;animation:blink 1.5s ease-in-out infinite;}
@keyframes blink{0%,100%{opacity:1;box-shadow:0 0 4px var(--online);}50%{opacity:.3;box-shadow:none;}}

.user-badge{display:flex;align-items:center;gap:8px;}
.user-coin{font-family:'Orbitron',sans-serif;font-size:13px;font-weight:700;color:var(--gold);}
.user-name{font-size:15px;font-weight:600;}
.user-profile-link{
  font-size:15px;font-weight:600;color:#fff;
  text-decoration:none;cursor:pointer;
  padding:4px 8px;border-radius:4px;
  transition:color .2s,background .2s;
  position:relative;z-index:200;
}
.user-profile-link:hover{color:var(--gold);background:rgba(200,168,75,.08);}

/* BUTTONS */
.btn{
  display:inline-flex;align-items:center;gap:8px;padding:9px 20px;
  border-radius:4px;font-family:'Rajdhani',sans-serif;
  font-size:15px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;
  cursor:pointer;transition:all .2s;border:none;text-decoration:none;
}
.btn-gold{background:linear-gradient(135deg,var(--gold),var(--gold-dark));color:var(--dark);box-shadow:0 2px 15px rgba(200,168,75,.3);}
.btn-gold:hover{background:linear-gradient(135deg,var(--gold-bright),var(--gold));box-shadow:0 4px 25px rgba(200,168,75,.5);transform:translateY(-1px);}
.btn-outline{background:transparent;color:var(--gold);border:1px solid var(--border-bright);}
.btn-outline:hover{background:rgba(200,168,75,.1);border-color:var(--gold);}
.btn-red{background:linear-gradient(135deg,var(--red),#922b21);color:#fff;box-shadow:0 2px 15px rgba(192,57,43,.3);}
.btn-red:hover{box-shadow:0 4px 25px rgba(192,57,43,.5);transform:translateY(-1px);}
.btn-blue{background:linear-gradient(135deg,var(--blue),#1a6ea8);color:#fff;}
.btn-sm{padding:6px 14px;font-size:12px;}
.btn-full{width:100%;justify-content:center;}

/* MAIN */
#app{position:relative;z-index:10;padding-top:64px;}
.container{max-width:1200px;margin:0 auto;padding:0 24px;}
.page-wrap{padding:40px 0;}

/* PAGE HEADER */
.page-header{text-align:center;margin-bottom:40px;position:relative;}
.page-title{
  font-family:'Cinzel',serif;font-size:40px;font-weight:900;
  background:linear-gradient(135deg,var(--gold-bright),var(--gold));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  letter-spacing:4px;margin-bottom:8px;
}
.page-sub{font-size:15px;letter-spacing:3px;color:var(--text-dim);text-transform:uppercase;}
.divider{width:120px;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);margin:12px auto;}

/* PANEL */
.panel{
  background:rgba(10,18,34,.88);border:1px solid rgba(200,168,75,.2);
  border-radius:8px;overflow:hidden;
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  position:relative;margin-bottom:20px;
  box-shadow:0 4px 24px rgba(0,0,0,.3);
}
.panel::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);}
.panel-header{
  padding:16px 24px;border-bottom:1px solid var(--border);
  display:flex;align-items:center;justify-content:space-between;
  background:rgba(200,168,75,.03);
}
.panel-title{font-family:'Orbitron',sans-serif;font-size:15px;font-weight:700;color:var(--gold);letter-spacing:2px;text-transform:uppercase;}
.panel-body{padding:24px;}

/* FORMS */
.form-group{margin-bottom:18px;}
.form-label{display:block;font-size:12px;letter-spacing:2px;color:var(--text-dim);text-transform:uppercase;margin-bottom:8px;font-weight:600;}
.form-input{
  width:100%;background:rgba(10,10,20,.8);border:1px solid var(--border);
  border-radius:4px;padding:12px 16px;color:var(--text);
  font-family:'Rajdhani',sans-serif;font-size:16px;transition:all .2s;outline:none;
}
.form-input:focus{border-color:var(--gold);background:rgba(200,168,75,.03);box-shadow:0 0 0 3px rgba(200,168,75,.08);}
.form-input::placeholder{color:var(--text-dim);}
select.form-input option{background:var(--dark2);}
textarea.form-input{resize:vertical;}
.form-error{color:var(--red-bright);font-size:13px;margin-top:4px;}
.form-hint{color:var(--text-dim);font-size:13px;margin-top:4px;}

/* TABLES */
.data-table{width:100%;border-collapse:collapse;}
.data-table th{padding:12px 16px;text-align:left;font-size:11px;letter-spacing:2px;color:var(--text-dim);text-transform:uppercase;border-bottom:1px solid var(--border);background:rgba(200,168,75,.03);}
.data-table td{padding:14px 16px;font-size:16px;border-bottom:1px solid rgba(200,168,75,.06);}
.data-table tr:hover td{background:rgba(200,168,75,.04);}
.data-table tr:last-child td{border-bottom:none;}

/* TAGS */
.tag{display:inline-block;padding:3px 10px;border-radius:3px;font-size:12px;letter-spacing:1px;font-weight:700;text-transform:uppercase;}
.tag-gold{background:rgba(200,168,75,.15);color:var(--gold);border:1px solid var(--border);}
.tag-green{background:rgba(46,204,113,.1);color:var(--online);border:1px solid rgba(46,204,113,.2);}
.tag-red{background:rgba(192,57,43,.15);color:var(--red-bright);border:1px solid rgba(192,57,43,.3);}
.tag-blue{background:rgba(52,152,219,.1);color:var(--blue);border:1px solid rgba(52,152,219,.2);}
.tag-purple{background:rgba(155,89,182,.1);color:var(--purple);border:1px solid rgba(155,89,182,.2);}

/* POWER BAR */
.power-bar-wrap{display:flex;align-items:center;gap:10px;}
.power-bar{flex:1;height:4px;background:rgba(255,255,255,.06);border-radius:2px;overflow:hidden;}
.power-fill{height:100%;background:linear-gradient(90deg,var(--gold-dark),var(--gold));border-radius:2px;}
.power-val{font-family:'Orbitron',sans-serif;font-size:12px;color:var(--gold);min-width:50px;text-align:right;}

/* GRIDS */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}

/* PROGRESS */
.progress-bar{width:100%;height:8px;background:rgba(255,255,255,.06);border-radius:4px;overflow:hidden;}
.progress-fill{height:100%;border-radius:4px;background:linear-gradient(90deg,var(--gold-dark),var(--gold-bright));transition:width .5s ease;}

/* NOTIFICATION */
.notif{
  position:fixed;bottom:24px;right:24px;z-index:9999;min-width:300px;
  background:rgba(10,10,20,.95);border:1px solid var(--border);
  border-left:3px solid var(--gold);border-radius:6px;padding:16px 20px;
  display:flex;align-items:center;gap:12px;
  box-shadow:0 8px 30px rgba(0,0,0,.5);
  transform:translateX(400px);transition:transform .4s cubic-bezier(.34,1.56,.64,1);
  backdrop-filter:blur(10px);
}
.notif.show{transform:translateX(0);}
.notif.success{border-left-color:var(--online);}
.notif.error{border-left-color:var(--red-bright);}
.notif-icon{font-size:22px;}
.notif-text{font-size:16px;font-weight:600;}

/* RANK MEDALS */
.rank-1{color:#ffd700;}.rank-2{color:#c0c0c0;}.rank-3{color:#cd7f32;}
.rank-medal{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;font-size:16px;}
.rank-medal.gold{background:rgba(255,215,0,.15);border:1px solid gold;}
.rank-medal.silver{background:rgba(192,192,192,.15);border:1px solid silver;}
.rank-medal.bronze{background:rgba(205,127,50,.15);border:1px solid #cd7f32;}

/* TICKER */
.event-ticker{background:rgba(200,168,75,.05);border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:10px 0;overflow:hidden;}
.ticker-inner{display:flex;gap:80px;animation:ticker 30s linear infinite;white-space:nowrap;}
@keyframes ticker{0%{transform:translateX(100vw);}100%{transform:translateX(-100%);}}
.ticker-item{display:flex;align-items:center;gap:8px;font-size:13px;letter-spacing:1px;color:var(--gold);flex-shrink:0;}

/* HERO */
.hero{min-height:calc(100vh - 104px);display:flex;align-items:center;position:relative;}
.hero-content{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;width:100%;}
.hero-badge{display:inline-flex;align-items:center;gap:8px;padding:6px 16px;background:rgba(200,168,75,.08);border:1px solid var(--border);border-radius:20px;font-size:12px;letter-spacing:3px;color:var(--gold);text-transform:uppercase;margin-bottom:20px;font-family:'Orbitron',sans-serif;}
.hero-title{font-family:'Cinzel',serif;font-size:58px;font-weight:900;line-height:1.05;margin-bottom:20px;}
.hero-title .t1{color:var(--text);display:block;}
.hero-title .t2{background:linear-gradient(135deg,var(--gold-bright),var(--gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;display:block;}
.hero-title .t3{color:var(--red-bright);display:block;font-size:36px;}
.hero-desc{font-size:17px;line-height:1.7;color:var(--text-dim);margin-bottom:32px;}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;}
.hero-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border-radius:8px;overflow:hidden;border:1px solid var(--border);margin-top:32px;}
.stat-cell{background:var(--panel);padding:20px;text-align:center;}
.stat-val{font-family:'Orbitron',sans-serif;font-size:27px;font-weight:900;color:var(--gold);display:block;}
.stat-label{font-size:11px;letter-spacing:2px;color:var(--text-dim);text-transform:uppercase;margin-top:4px;display:block;}

/* SERVER CARD */
.server-card{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:32px;position:relative;overflow:hidden;}
.server-row{display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid rgba(200,168,75,.08);}
.server-row:last-child{border-bottom:none;}
.sr-label{font-size:13px;letter-spacing:1px;color:var(--text-dim);text-transform:uppercase;}
.sr-val{font-family:'Orbitron',sans-serif;font-size:15px;font-weight:700;}
.sr-val.green{color:var(--online);}.sr-val.gold{color:var(--gold);}

/* AUTH */
.auth-wrap{display:grid;grid-template-columns:1fr 1fr;min-height:calc(100vh - 64px);}
.auth-left{background:linear-gradient(135deg,rgba(5,5,8,.95),rgba(15,15,24,.95));border-right:1px solid var(--border);display:flex;align-items:center;justify-content:center;padding:60px;position:relative;overflow:hidden;}
.auth-right{background:rgba(5,5,8,.5);display:flex;align-items:center;justify-content:center;padding:60px;}
.auth-box{width:100%;max-width:400px;}
.auth-tabs{display:flex;margin-bottom:32px;border:1px solid var(--border);border-radius:6px;overflow:hidden;}
.auth-tab{flex:1;padding:12px;text-align:center;font-family:'Rajdhani',sans-serif;font-size:15px;font-weight:700;letter-spacing:2px;text-transform:uppercase;cursor:pointer;transition:all .2s;color:var(--text-dim);background:transparent;border:none;}
.auth-tab.active{background:linear-gradient(135deg,var(--gold),var(--gold-dark));color:var(--dark);}

/* ITEM MALL */
.item-card{background:var(--panel);border:1px solid var(--border);border-radius:8px;overflow:hidden;transition:all .25s;cursor:pointer;}
.item-card:hover{border-color:var(--gold-bright);transform:translateY(-4px);box-shadow:0 12px 30px rgba(0,0,0,.5),0 0 20px rgba(200,168,75,.1);}
.item-img{height:140px;display:flex;align-items:center;justify-content:center;font-size:67px;background:linear-gradient(135deg,rgba(10,10,20,.9),rgba(15,15,24,.9));position:relative;}
.item-rarity{position:absolute;top:8px;right:8px;font-size:11px;letter-spacing:1px;padding:2px 8px;border-radius:3px;text-transform:uppercase;font-weight:700;}
.rarity-legendary{background:rgba(255,165,0,.2);color:#ffa500;border:1px solid rgba(255,165,0,.4);}
.rarity-epic{background:rgba(155,89,182,.2);color:#9b59b6;border:1px solid rgba(155,89,182,.4);}
.rarity-rare{background:rgba(52,152,219,.2);color:#3498db;border:1px solid rgba(52,152,219,.2);}
.rarity-common{background:rgba(200,168,75,.15);color:var(--gold);border:1px solid var(--border);}
.item-info{padding:14px;}
.item-name{font-weight:700;font-size:16px;color:var(--text);margin-bottom:4px;}
.item-desc{font-size:13px;color:var(--text-dim);line-height:1.4;margin-bottom:12px;}
.item-price{display:flex;align-items:center;justify-content:space-between;}
.price-val{font-family:'Orbitron',sans-serif;font-size:16px;font-weight:700;color:var(--gold);}
.price-currency{font-size:11px;letter-spacing:1px;color:var(--text-dim);text-transform:uppercase;display:block;}

/* TOPUP */
.pkg-card{background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:20px;text-align:center;cursor:pointer;transition:all .2s;position:relative;}
.pkg-card:hover,.pkg-card.selected{border-color:var(--gold);background:rgba(200,168,75,.05);}
.pkg-card.selected::after{content:'✓';position:absolute;top:8px;right:10px;color:var(--gold);font-size:16px;}
.pkg-popular{position:absolute;top:-10px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,var(--red),#922b21);color:#fff;font-size:10px;letter-spacing:2px;padding:3px 12px;border-radius:10px;text-transform:uppercase;font-weight:700;}
.pkg-coins{font-family:'Orbitron',sans-serif;font-size:25px;font-weight:900;color:var(--gold);margin-bottom:4px;}
.pkg-bonus{font-size:12px;color:var(--online);margin-bottom:8px;}
.pkg-price{font-weight:700;font-size:16px;color:var(--text);}
.payment-methods{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0;}
.pm-btn{background:rgba(10,10,20,.8);border:1px solid var(--border);border-radius:6px;padding:12px 8px;text-align:center;cursor:pointer;transition:all .2s;font-family:'Rajdhani',sans-serif;font-size:12px;font-weight:600;letter-spacing:1px;color:var(--text-dim);}
.pm-btn:hover,.pm-btn.active{border-color:var(--gold);color:var(--gold);background:rgba(200,168,75,.05);}
.pm-icon{font-size:22px;display:block;margin-bottom:4px;}

/* DAILY */
.daily-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:10px;}
.daily-day{background:var(--panel);border:1px solid var(--border);border-radius:6px;padding:14px 8px;text-align:center;position:relative;transition:all .2s;}
.daily-day.claimed{border-color:var(--gold-dark);background:rgba(200,168,75,.08);}
.daily-day.claimed::after{content:'✓';position:absolute;top:6px;right:8px;color:var(--online);font-size:13px;}
.daily-day.today{border-color:var(--gold);box-shadow:0 0 15px rgba(200,168,75,.2);}
.daily-day.locked{opacity:.4;}
.day-num{font-size:11px;letter-spacing:1px;color:var(--text-dim);text-transform:uppercase;margin-bottom:8px;display:block;}
.day-icon{font-size:31px;display:block;margin-bottom:6px;}
.day-reward{font-size:11px;color:var(--gold);font-weight:600;line-height:1.2;}

/* EVENT */
.event-card{background:var(--panel);border:1px solid var(--border);border-radius:8px;overflow:hidden;}
.event-banner{height:80px;display:flex;align-items:center;justify-content:center;font-size:45px;position:relative;}
.event-info{padding:16px;}
.event-name{font-family:'Cinzel',serif;font-size:18px;font-weight:700;color:var(--text);margin-bottom:6px;}
.cd-wrap{display:flex;gap:8px;margin:12px 0;}
.cd-unit{text-align:center;background:rgba(10,10,20,.8);border:1px solid var(--border);border-radius:4px;padding:8px 12px;min-width:50px;}
.cd-val{font-family:'Orbitron',sans-serif;font-size:22px;font-weight:900;color:var(--gold);display:block;}
.cd-label{font-size:10px;letter-spacing:1px;color:var(--text-dim);text-transform:uppercase;}

/* PLAYER CARDS */
.player-card{background:var(--panel);border:1px solid var(--border);border-radius:6px;padding:16px;transition:all .2s;position:relative;overflow:hidden;}
.player-card:hover{border-color:var(--gold);transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.4);}
.pc-avatar{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--gold-dark),var(--dark3));border:2px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:22px;margin-bottom:12px;}
.pc-name{font-weight:700;font-size:16px;color:var(--text);margin-bottom:4px;}
.pc-class{font-size:12px;letter-spacing:1px;color:var(--text-dim);text-transform:uppercase;}
.pc-level{position:absolute;top:12px;right:12px;font-family:'Orbitron',sans-serif;font-size:11px;font-weight:700;color:var(--gold);background:rgba(200,168,75,.1);border:1px solid var(--border);padding:2px 8px;border-radius:10px;}

/* TIER */
.tier-track{display:flex;gap:0;margin:32px 0;position:relative;}
.tier-track::before{content:'';position:absolute;top:30px;left:10%;right:10%;height:2px;background:linear-gradient(90deg,var(--gold-dark),var(--gold),var(--gold-dark));z-index:0;}
.tier-node{flex:1;text-align:center;position:relative;z-index:1;}
.tier-icon{width:60px;height:60px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:27px;margin:0 auto 12px;border:2px solid var(--border);background:var(--dark2);transition:all .3s;}
.tier-node.unlocked .tier-icon{border-color:var(--gold);background:rgba(200,168,75,.1);box-shadow:0 0 20px rgba(200,168,75,.3);}
.tier-name{font-family:'Cinzel',serif;font-size:13px;font-weight:700;color:var(--text-dim);margin-bottom:4px;}
.tier-node.unlocked .tier-name{color:var(--gold);}
.tier-req{font-size:12px;color:var(--text-dim);font-family:'Orbitron',sans-serif;}
.tier-node.unlocked .tier-req{color:var(--online);}

/* CLAIM BOX */
.claim-box{background:linear-gradient(135deg,rgba(200,168,75,.08),rgba(200,168,75,.03));border:1px solid var(--border);border-radius:12px;padding:32px;text-align:center;}
.claim-icon{font-size:72px;margin-bottom:16px;display:block;}
.claim-title{font-family:'Cinzel',serif;font-size:25px;font-weight:700;color:var(--gold);margin-bottom:8px;}
.claim-items{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:20px 0;}
.claim-item-tag{display:flex;align-items:center;gap:8px;padding:8px 16px;background:rgba(10,10,20,.8);border:1px solid var(--border);border-radius:4px;font-size:15px;}

/* ADMIN */
.admin-layout{display:flex;gap:24px;align-items:flex-start;}
.admin-sidebar{width:220px;flex-shrink:0;}
.admin-content{flex:1;}
.admin-nav-item{display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:4px;cursor:pointer;transition:all .2s;color:var(--text-dim);font-size:15px;font-weight:600;letter-spacing:1px;margin-bottom:2px;text-decoration:none;border-left:2px solid transparent;}
.admin-nav-item:hover,.admin-nav-item.active{background:rgba(200,168,75,.08);color:var(--gold);border-left-color:var(--gold);}
.astat{background:var(--panel);border:1px solid var(--border);border-radius:6px;padding:16px;}
.astat-val{font-family:'Orbitron',sans-serif;font-size:25px;font-weight:900;margin-bottom:4px;}
.astat-label{font-size:12px;letter-spacing:1px;color:var(--text-dim);text-transform:uppercase;}

/* UTILS */
.text-gold{color:var(--gold);}.text-dim{color:var(--text-dim);}.text-online{color:var(--online);}.text-red{color:var(--red-bright);}.text-blue{color:var(--blue);}
.fw-700{font-weight:700;}.text-center{text-align:center;}.mt-8{margin-top:8px;}.mt-16{margin-top:16px;}.mt-24{margin-top:24px;}.mb-16{margin-bottom:16px;}.mb-24{margin-bottom:24px;}
.orbitron{font-family:'Orbitron',sans-serif;}.cinzel{font-family:'Cinzel',serif;}

@keyframes fadeIn{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:translateY(0);}}
.fade-in{animation:fadeIn .4s ease forwards;}

/* FOOTER */
.footer{
  border-top:1px solid rgba(200,168,75,.15);
  padding:24px 32px;text-align:center;
  font-size:13px;color:var(--text-dim);
  letter-spacing:1px;margin-top:40px;
  background:rgba(3,3,8,.88);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}

/* SCROLLBAR */
::-webkit-scrollbar{width:6px;height:6px;}
::-webkit-scrollbar-track{background:var(--dark2);}
::-webkit-scrollbar-thumb{background:var(--gold-dark);border-radius:3px;}
::-webkit-scrollbar-thumb:hover{background:var(--gold);}

/* RESPONSIVE */
@media(max-width:900px){
  .hero-content,.auth-wrap,.grid-2,.grid-3,.grid-4{grid-template-columns:1fr;}
  nav{padding:0 16px;} .nav-links{display:none;}
  .admin-layout{flex-direction:column;} .admin-sidebar{width:100%;}
}