/* ══════════════════════════════════════════════════════════════
   NEXORA DASHBOARD — Design System v5
   Aligné sur la vitrine : palette oklch · Geist · violet profond
   ══════════════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Geist:wght@300;400;500;600;700;800;900&display=swap');

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

:root{
  /* ── Backgrounds (oklch — identiques à la vitrine) ── */
  --bg:      oklch(0.16 0.03 275);
  --bg1:     oklch(0.145 0.03 275);
  --bg2:     oklch(0.20 0.035 275);
  --bg3:     oklch(0.26 0.04 275);
  --bg4:     oklch(0.26 0.04 275 / 0.6);
  --bg-glass: oklch(0.20 0.035 275 / 0.7);

  /* ── Brand / Purple ── */
  --brand:   oklch(0.62 0.20 295);
  --brand-2: oklch(0.58 0.18 280);
  --brand-3: oklch(0.74 0.16 312);
  --brand-d: oklch(0.55 0.20 295);
  --brand-t: oklch(0.62 0.20 295 / 0.14);
  --brand-t2:oklch(0.62 0.20 295 / 0.06);

  /* ── Gradient ── */
  --grad-brand: linear-gradient(135deg, oklch(0.62 0.20 295), oklch(0.58 0.18 280));
  --grad-brand2:linear-gradient(135deg, oklch(0.66 0.18 300), oklch(0.58 0.18 280));
  --grad-gold:  linear-gradient(135deg, oklch(0.80 0.15 80), oklch(0.85 0.16 95));
  --grad-text:  linear-gradient(135deg, oklch(0.93 0.015 270), oklch(0.62 0.20 295));

  /* ── Gold / Premium ── */
  --gold:    oklch(0.80 0.15 80);
  --gold-d:  oklch(0.70 0.15 70);
  --gold-t:  oklch(0.80 0.15 80 / 0.12);

  /* ── Status ── */
  --success: oklch(0.75 0.16 145);
  --danger:  oklch(0.62 0.22 25);
  --warn:    oklch(0.80 0.15 80);
  --info:    oklch(0.70 0.13 230);

  /* ── Text ── */
  --text:    oklch(0.93 0.015 270);
  --text2:   oklch(0.66 0.03 270);
  --text3:   oklch(0.50 0.03 272);

  /* ── Borders ── */
  --border:  oklch(0.62 0.20 295 / 0.13);
  --border2: oklch(0.62 0.20 295 / 0.20);
  --border3: oklch(0.62 0.20 295 / 0.32);
  --border-w:oklch(1 0 0 / 0.06);

  /* ── Glow ── */
  --glow:    0 0 30px oklch(0.62 0.20 295 / 0.18);
  --glow2:   0 0 60px oklch(0.62 0.20 295 / 0.25);

  /* ── Sizing ── */
  --sidebar: 240px;
  --r:  14px;
  --r2:  10px;
  --r3:  7px;

  /* ── Alias rétro-compat (anciens noms encore référencés) ── */
  --accent:      oklch(0.66 0.18 300);
  --violet:      oklch(0.62 0.20 295);
  --teal:        oklch(0.62 0.20 295);
  --teal-light:  oklch(0.74 0.16 312);
  --chart-3:     oklch(0.72 0.15 320);
}

html,body{
  height:100%;
  background:var(--bg);
  color:var(--text);
  font-family:'Geist',-apple-system,BlinkMacSystemFont,sans-serif;
  font-size:14px;
  line-height:1.5;
  overflow:hidden;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
::-webkit-scrollbar{width:5px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(139,92,246,0.25);border-radius:9px;transition:background .2s}
::-webkit-scrollbar-thumb:hover{background:rgba(139,92,246,0.55)}

/* ── BACKGROUND AMBIANCE ─────────────────────────────────────── */
body::before{
  content:'';
  position:fixed;inset:0;
  background:
    radial-gradient(ellipse 900px 700px at -5% -10%, rgba(139,92,246,.12) 0%,transparent 65%),
    radial-gradient(ellipse 700px 600px at 105% 110%, rgba(99,102,241,.08) 0%,transparent 65%),
    radial-gradient(ellipse 500px 400px at 50% 50%, rgba(139,92,246,.03) 0%,transparent 60%);
  pointer-events:none;z-index:0;
}
body::after{
  content:'';
  position:fixed;
  top:-200px;left:-200px;
  width:600px;height:600px;
  background:radial-gradient(circle, rgba(139,92,246,.07) 0%, transparent 70%);
  pointer-events:none;z-index:0;
  animation:orb-float 12s ease-in-out infinite;
}
@keyframes orb-float{
  0%,100%{transform:translate(0,0)}
  33%{transform:translate(80px,40px)}
  66%{transform:translate(-40px,80px)}
}
.orbs,.orb{display:none}

/* ══ AUTH ════════════════════════════════════════════════════ */
#auth-screen{
  position:fixed;inset:0;z-index:100;
  display:flex;align-items:center;justify-content:center;
  background:var(--bg);
}
.auth-card{
  position:relative;z-index:1;
  background:rgba(13,16,32,0.8);
  border:1px solid var(--border2);
  border-radius:20px;
  padding:56px 60px;
  text-align:center;
  max-width:420px;width:92%;
  backdrop-filter:blur(24px);
  -webkit-backdrop-filter:blur(24px);
  box-shadow:0 0 0 1px var(--border), 0 40px 80px rgba(0,0,0,.7), var(--glow);
}
.auth-card::before{
  content:'';position:absolute;inset:0;border-radius:20px;
  background:linear-gradient(135deg,rgba(139,92,246,.06) 0%,transparent 60%);
  pointer-events:none;
}
.auth-logo{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:44px}
.logo-mark{
  width:42px;height:42px;
  background:var(--grad-brand);
  border-radius:11px;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
  box-shadow:0 0 28px rgba(139,92,246,.5),0 4px 12px rgba(0,0,0,.4);
}
.logo-mark svg{width:22px;height:22px;stroke:white;fill:none}
.logo-img{width:42px;height:42px;border-radius:11px;object-fit:cover;flex-shrink:0;box-shadow:0 0 22px oklch(0.62 0.20 295 / 0.45)}
.sidebar-logo .logo-img{width:30px;height:30px;border-radius:8px;box-shadow:0 0 16px oklch(0.62 0.20 295 / 0.4)}
.logo-text{font-size:22px;font-weight:800;letter-spacing:-0.5px}
.logo-text,
.logo-text em{
  background:var(--grad-text);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  font-style:normal;
}
.auth-card h2{
  font-size:20px;font-weight:700;margin-bottom:8px;letter-spacing:-.4px;
  color:var(--text);
}
.auth-card p{color:var(--text2);margin-bottom:36px;font-size:14px;line-height:1.6}
.btn-discord{
  display:inline-flex;align-items:center;gap:10px;
  background:#5865F2;color:white;
  font-size:14px;font-weight:600;
  padding:14px 32px;border-radius:10px;border:none;
  cursor:pointer;transition:all .2s;
  box-shadow:0 4px 20px rgba(88,101,242,.4);
}
.btn-discord:hover{
  background:#4A56E0;transform:translateY(-2px);
  box-shadow:0 8px 28px rgba(88,101,242,.5);
}
.btn-discord svg{width:20px;height:20px;fill:white}

/* ══ GUILD SCREEN ════════════════════════════════════════════ */
#guild-screen{
  position:fixed;inset:0;z-index:90;
  display:none;align-items:flex-start;justify-content:center;
  background:var(--bg);padding-top:80px;
}
.guild-card{
  position:relative;z-index:1;
  background:rgba(13,16,32,0.8);
  border:1px solid var(--border2);
  border-radius:18px;padding:40px 44px;
  max-width:600px;width:94%;
  backdrop-filter:blur(24px);
  -webkit-backdrop-filter:blur(24px);
  box-shadow:0 24px 64px rgba(0,0,0,.6), var(--glow);
}
.guild-card h2{
  font-size:19px;font-weight:700;margin-bottom:4px;letter-spacing:-.3px;
  background:var(--grad-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.guild-card p{color:var(--text2);margin-bottom:24px;font-size:13.5px}
.guild-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(135px,1fr));
  gap:10px;max-height:440px;overflow-y:auto;padding-right:4px;
}
.guild-item{
  background:rgba(22,25,48,0.6);
  border:1px solid var(--border);
  border-radius:var(--r);padding:20px 14px;
  display:flex;flex-direction:column;align-items:center;gap:10px;
  cursor:pointer;transition:all .2s;text-align:center;
  backdrop-filter:blur(8px);
}
.guild-item:hover{
  border-color:var(--brand);
  background:var(--brand-t);
  transform:translateY(-4px);
  box-shadow:0 10px 28px rgba(139,92,246,.25),0 0 0 1px rgba(139,92,246,.15);
}
.guild-item.no-bot{opacity:.4;filter:grayscale(.7)}
.guild-item.no-bot:hover{
  border-color:var(--brand-3);background:var(--brand-t);
  opacity:.9;filter:grayscale(0);transform:translateY(-3px);
}
.guild-item.no-bot .guild-invite-badge{
  font-size:10px;color:var(--brand-3);
  background:var(--brand-t);
  border:1px solid var(--border2);
  border-radius:5px;padding:2px 8px;
}
.guild-item img{width:48px;height:48px;border-radius:50%;object-fit:cover;border:2px solid var(--border2)}
.guild-avatar-placeholder{
  width:48px;height:48px;border-radius:50%;
  background:var(--grad-brand);
  display:flex;align-items:center;justify-content:center;
  font-size:18px;font-weight:700;color:white;
  box-shadow:0 0 16px rgba(139,92,246,.4);
}
.guild-item span{font-size:11.5px;font-weight:500;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}
.guild-loading{color:var(--text2);text-align:center;padding:48px;grid-column:1/-1;font-size:13px}

/* ══ APP LAYOUT ══════════════════════════════════════════════ */
#app{display:none;position:fixed;inset:0;z-index:10}
.layout{display:flex;height:100vh;position:relative;z-index:1}

/* ══ SIDEBAR ═════════════════════════════════════════════════ */
.sidebar{
  width:var(--sidebar);flex-shrink:0;
  background:rgba(8,11,20,0.95);
  border-right:1px solid var(--border);
  display:flex;flex-direction:column;
  padding:16px 0;overflow-y:auto;overflow-x:hidden;
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  position:relative;
}
.sidebar::after{
  content:'';
  position:absolute;top:0;right:0;bottom:0;width:1px;
  background:linear-gradient(to bottom,transparent,rgba(139,92,246,.3) 40%,rgba(139,92,246,.3) 60%,transparent);
  pointer-events:none;
}
.sidebar-logo{
  display:flex;align-items:center;gap:10px;
  padding:6px 18px 18px;
  border-bottom:1px solid var(--border);
  position:relative;
}
.sidebar-logo::after{
  content:'';position:absolute;bottom:0;left:18px;right:18px;height:1px;
  background:linear-gradient(90deg,var(--brand-t2),var(--brand-t) 50%,transparent);
}
.sidebar-logo .logo-mark{
  width:30px;height:30px;border-radius:8px;
  box-shadow:0 0 16px rgba(139,92,246,.4);
}
.sidebar-logo .logo-mark svg{width:16px;height:16px}
.sidebar-logo .logo-text{font-size:17px;font-weight:800;letter-spacing:-.5px}

/* Guild selector */
.guild-selector{
  margin:14px 10px;padding:10px 12px;
  background:rgba(22,25,48,0.6);
  border:1px solid var(--border);
  border-radius:10px;cursor:pointer;
  display:flex;align-items:center;gap:10px;
  transition:all .2s;
  backdrop-filter:blur(8px);
}
.guild-selector:hover{border-color:var(--border2);background:var(--brand-t)}
.guild-selector img{width:28px;height:28px;border-radius:50%;flex-shrink:0;object-fit:cover}
.gs-placeholder{
  width:28px;height:28px;border-radius:50%;flex-shrink:0;
  background:var(--grad-brand);
  display:flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:700;color:white;
}
.gs-info{flex:1;overflow:hidden}
.gs-name{font-size:11.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text)}
.gs-sub{font-size:10.5px;color:var(--text3)}
.gs-arrow{color:var(--text3);flex-shrink:0}

/* Nav sections */
.nav-section{padding:14px 18px 4px}
.nav-section-label{
  font-size:9.5px;font-weight:700;text-transform:uppercase;
  letter-spacing:1px;color:var(--text3);
}
.nav-item{
  display:flex;align-items:center;gap:10px;
  padding:9px 13px;margin:1px 8px;
  border-radius:10px;cursor:pointer;
  transition:all .15s;color:var(--text2);font-size:13px;font-weight:500;
  position:relative;text-decoration:none;
  border:1px solid transparent;
}
.nav-item:hover{
  background:rgba(139,92,246,.08);
  color:var(--text);
  border-color:rgba(139,92,246,.12);
}
.nav-item.active{
  background:linear-gradient(90deg,rgba(139,92,246,.18),rgba(139,92,246,.07));
  color:var(--text);
  border-color:rgba(139,92,246,.28);
  box-shadow:0 2px 16px rgba(139,92,246,.14),inset 0 0 0 1px rgba(139,92,246,.1);
}
.nav-item.active::before{
  content:'';position:absolute;left:-1px;top:20%;bottom:20%;
  width:3px;border-radius:0 3px 3px 0;
  background:var(--grad-brand);
}
.nav-icon{width:16px;height:16px;flex-shrink:0;stroke:currentColor;fill:none;opacity:.65}
.nav-item.active .nav-icon,.nav-item:hover .nav-icon{opacity:1}
.nav-badge{
  margin-left:auto;
  background:var(--grad-brand);
  color:white;
  font-size:9.5px;font-weight:700;padding:2px 7px;border-radius:99px;min-width:17px;text-align:center;
  box-shadow:0 2px 8px rgba(139,92,246,.4);
}
.nav-sep{height:1px;background:var(--border);margin:6px 12px}

/* Premium nav item */
.nav-premium{color:var(--gold) !important}
.nav-premium:hover{background:var(--gold-t) !important;color:var(--gold) !important;border-color:rgba(245,158,11,.15) !important}
.nav-premium.active{background:var(--gold-t) !important;border-color:rgba(245,158,11,.25) !important}
.nav-premium.active::before{background:var(--grad-gold) !important}
.nav-badge-premium{margin-left:auto;font-size:12px}

.sidebar-spacer{flex:1}
.sidebar-user{
  padding:10px 12px;margin:8px;
  background:rgba(22,25,48,0.6);
  border:1px solid var(--border);
  border-radius:10px;
  display:flex;align-items:center;gap:10px;
  backdrop-filter:blur(8px);
}
.sidebar-user img{width:28px;height:28px;border-radius:50%;flex-shrink:0;object-fit:cover}
.user-avatar-ph{
  width:28px;height:28px;border-radius:50%;flex-shrink:0;
  background:var(--grad-brand);
  display:flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:700;color:white;
}
.user-info{flex:1;overflow:hidden}
.user-name{font-size:12px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text)}
.user-disc{font-size:10.5px;color:var(--text3)}
.btn-logout{background:none;border:none;color:var(--text3);cursor:pointer;padding:4px;border-radius:5px;transition:color .15s;flex-shrink:0;display:flex;align-items:center}
.btn-logout:hover{color:var(--danger)}

/* ══ MAIN ════════════════════════════════════════════════════ */
.main{flex:1;overflow-y:auto;background:transparent;position:relative}

/* ── Pages ─────────────────────────────────────────────────── */
.page-enter{animation:fadeUp .28s cubic-bezier(.22,1,.36,1)}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px) scale(.99)}to{opacity:1;transform:translateY(0) scale(1)}}

.page-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:24px 32px 20px;
  border-bottom:1px solid var(--border);
  position:sticky;top:0;z-index:5;
  background:rgba(8,11,20,0.88);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  isolation:isolate;
}
.page-header::after{
  content:'';position:absolute;bottom:-1px;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--brand) 20%,var(--brand-3) 50%,var(--brand) 80%,transparent);
  opacity:.25;pointer-events:none;
}
.page-title{
  font-size:20px;font-weight:800;letter-spacing:-.5px;
  background:var(--grad-text);-webkit-background-clip:text;
  background-clip:text;-webkit-text-fill-color:transparent;
}
.page-sub{font-size:13px;color:var(--text2);margin-top:4px;-webkit-text-fill-color:initial}
.page-content{padding:26px 32px 60px}

/* ══ OVERVIEW BANNER ══════════════════════════════════════════ */
.overview-banner{position:relative;border-radius:var(--r);overflow:hidden;margin-bottom:18px;border:1px solid var(--border2);height:200px;box-shadow:var(--glow2)}
.overview-banner img{width:100%;height:100%;object-fit:cover;display:block}
.ob-overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:22px 26px;
  background:linear-gradient(to top, oklch(0.16 0.03 275 / 0.9), oklch(0.16 0.03 275 / 0.25) 55%, transparent)}
.ob-title{font-size:24px;font-weight:800;letter-spacing:-.02em;color:#fff}
.ob-sub{font-size:14px;color:var(--text2);margin-top:4px}
@media(max-width:768px){.overview-banner{height:130px}.ob-title{font-size:19px}}

/* ══ BUTTONS ═════════════════════════════════════════════════ */
.btn{
  display:inline-flex;align-items:center;gap:7px;
  padding:9px 17px;border-radius:9px;border:1px solid transparent;
  font-size:13px;font-weight:500;cursor:pointer;transition:all .18s;
  text-decoration:none;white-space:nowrap;font-family:inherit;
  position:relative;overflow:hidden;will-change:transform;
}
.btn:active:not(:disabled){transform:scale(0.96) !important;transition-duration:.07s}
.btn svg{flex-shrink:0}
.btn-teal,.btn-primary{
  background:var(--grad-brand);color:white;
  border-color:rgba(139,92,246,.4);
  box-shadow:0 4px 16px rgba(139,92,246,.3);
}
.btn-teal:hover,.btn-primary:hover{
  transform:translateY(-1px);
  box-shadow:0 6px 24px rgba(139,92,246,.45);
  filter:brightness(1.1);
}
.btn-ghost{
  background:rgba(22,25,48,0.7);color:var(--text2);
  border-color:var(--border2);
  backdrop-filter:blur(8px);
}
.btn-ghost:hover{background:var(--brand-t);color:var(--text);border-color:var(--border3)}
.btn-danger{background:transparent;color:var(--danger);border-color:rgba(244,63,94,.25)}
.btn-danger:hover{background:rgba(244,63,94,.08);border-color:var(--danger)}
.btn-gold{
  background:var(--grad-gold);color:#0C0D12;font-weight:700;
  box-shadow:0 4px 16px rgba(245,158,11,.3);
}
.btn-gold:hover{transform:translateY(-1px);box-shadow:0 6px 24px rgba(245,158,11,.4);filter:brightness(1.05)}
.btn-sm{padding:6px 12px;font-size:12px}
.btn:disabled{opacity:.35;cursor:not-allowed;pointer-events:none}

/* ══ PANELS ══════════════════════════════════════════════════ */
.panel{
  background:rgba(13,16,32,0.8);
  border:1px solid var(--border);
  border-radius:var(--r);overflow:hidden;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  transition:border-color .2s,box-shadow .2s;
}
.panel+.panel{margin-top:16px}
.panel:hover{border-color:var(--border2);box-shadow:0 4px 24px rgba(139,92,246,.07)}
.panel-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:15px 20px;border-bottom:1px solid var(--border);
  background:linear-gradient(90deg,rgba(139,92,246,.09) 0%,rgba(22,25,48,.25) 60%,transparent);
  position:relative;
}
.panel-header::before{
  content:'';position:absolute;top:0;left:0;width:3px;bottom:0;
  background:var(--grad-brand);border-radius:0 0 0 var(--r);
  pointer-events:none;opacity:.8;
}
.panel-title{font-size:13px;font-weight:700;color:var(--text);padding-left:6px}
.panel-body{padding:20px 22px}

/* ══ STAT CARDS ══════════════════════════════════════════════ */
.cards-row{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}
.stat-card{
  background:rgba(13,16,32,0.8);
  border:1px solid var(--border);
  border-radius:var(--r);padding:20px 22px;
  position:relative;overflow:hidden;
  backdrop-filter:blur(16px);
  transition:all .22s;will-change:transform;
}
.stat-card:hover{
  border-color:var(--border2);
  transform:translateY(-3px);
  box-shadow:0 12px 36px rgba(139,92,246,.16);
}
.stat-card::after{
  content:'';position:absolute;top:0;left:0;right:0;height:2px;
  background:var(--c-accent,var(--grad-brand));
}
.stat-card::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse 80% 60% at 10% 0%,var(--brand-t2),transparent);
  pointer-events:none;
}
.stat-icon{
  width:40px;height:40px;border-radius:11px;
  display:flex;align-items:center;justify-content:center;
  margin-bottom:16px;
  background:var(--c-icon,var(--brand-t));
  border:1px solid var(--border2);
  box-shadow:0 0 14px rgba(139,92,246,.1);
}
.stat-icon svg{width:18px;height:18px;stroke:var(--c-accent,var(--brand));fill:none}
.stat-value{font-size:30px;font-weight:800;letter-spacing:-.8px;color:var(--text);line-height:1;margin-bottom:6px}
.stat-label{font-size:11.5px;color:var(--text2);font-weight:600;letter-spacing:.1px}

/* ══ GRIDS ═══════════════════════════════════════════════════ */
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.grid3{display:grid;grid-template-columns:2fr 1fr;gap:16px}

/* ══ TABLES ══════════════════════════════════════════════════ */
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse}
th{
  padding:10px 16px;text-align:left;
  font-size:10.5px;font-weight:700;color:var(--text3);
  text-transform:uppercase;letter-spacing:.6px;
  border-bottom:1px solid var(--border);white-space:nowrap;
  background:rgba(22,25,48,0.3);
}
td{padding:12px 16px;font-size:13px;border-bottom:1px solid var(--border);vertical-align:middle}
tr:last-child td{border-bottom:none}
tr:hover td{background:rgba(139,92,246,.05);transition:background .15s}
tr:hover td:first-child{box-shadow:inset 3px 0 0 rgba(139,92,246,.35)}
.table-empty{text-align:center;padding:48px;color:var(--text2);font-size:13px}

/* ══ TAGS ════════════════════════════════════════════════════ */
.tag{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:var(--r3);font-size:11px;font-weight:600}
.tag-ban{background:rgba(244,63,94,.1);color:var(--danger);border:1px solid rgba(244,63,94,.2)}
.tag-warn{background:rgba(245,158,11,.1);color:var(--warn);border:1px solid rgba(245,158,11,.2)}
.tag-mute{background:var(--brand-t);color:var(--brand-3);border:1px solid var(--border2)}
.tag-kick{background:rgba(251,146,60,.1);color:#FB923C;border:1px solid rgba(251,146,60,.2)}
.tag-open{background:rgba(16,185,129,.1);color:var(--success);border:1px solid rgba(16,185,129,.2)}
.tag-closed{background:rgba(22,25,48,.8);color:var(--text3);border:1px solid var(--border)}
.tag-premium{background:var(--gold-t);color:var(--gold);border:1px solid rgba(245,158,11,.25)}

/* ══ FORMS ═══════════════════════════════════════════════════ */
.form-group{margin-bottom:20px}
.form-label{display:block;font-size:11.5px;font-weight:700;color:var(--text2);margin-bottom:8px;letter-spacing:.3px;text-transform:uppercase}
.form-input,.form-select,.form-textarea{
  width:100%;
  background:rgba(16,20,40,0.7);
  border:1px solid var(--border2);
  border-radius:10px;color:var(--text);font-size:13px;font-family:inherit;
  padding:11px 14px;transition:all .2s;outline:none;appearance:none;
  backdrop-filter:blur(8px);
}
.form-input:focus,.form-select:focus,.form-textarea:focus{
  border-color:var(--brand);
  box-shadow:0 0 0 3px rgba(139,92,246,.18),0 2px 8px rgba(139,92,246,.1);
  background:rgba(20,24,48,0.9);
}
.form-input::placeholder,.form-textarea::placeholder{color:var(--text3)}
.form-textarea{resize:vertical;min-height:80px;line-height:1.6}
.form-select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2394A3B8' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;padding-right:34px;cursor:pointer;
}
.form-hint{font-size:11.5px;color:var(--text3);margin-top:6px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}

/* ══ TOGGLES ═════════════════════════════════════════════════ */
.toggle-wrap{display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid var(--border)}
.toggle-wrap:last-of-type{border-bottom:none}
.toggle-info{flex:1;padding-right:20px}
.ti-title{font-size:13px;font-weight:500;color:var(--text)}
.ti-desc{font-size:12px;color:var(--text2);margin-top:2px}
.toggle{position:relative;display:inline-flex;width:40px;height:22px;flex-shrink:0}
.toggle input{opacity:0;width:0;height:0}
.toggle-slider{
  position:absolute;inset:0;
  background:rgba(22,25,48,.8);
  border:1px solid var(--border2);
  border-radius:11px;cursor:pointer;transition:all .22s;
}
.toggle-slider::before{
  content:'';position:absolute;
  width:16px;height:16px;left:2px;top:2px;
  background:var(--text3);border-radius:50%;transition:all .22s;
}
.toggle input:checked+.toggle-slider{
  background:var(--grad-brand);
  border-color:transparent;
  box-shadow:0 0 12px rgba(139,92,246,.35);
}
.toggle input:checked+.toggle-slider::before{transform:translateX(18px);background:white}

/* ══ TABS ════════════════════════════════════════════════════ */
.tabs{
  display:flex;gap:2px;margin-bottom:18px;
  background:rgba(13,16,32,0.7);
  border:1px solid var(--border);border-radius:10px;padding:4px;
  width:fit-content;flex-wrap:wrap;
  backdrop-filter:blur(8px);
}
.tab-btn{
  padding:8px 15px;border-radius:7px;border:none;
  background:transparent;color:var(--text2);
  font-size:12.5px;font-weight:500;cursor:pointer;transition:all .15s;font-family:inherit;
}
.tab-btn:hover{color:var(--text)}
.tab-btn.active{
  background:rgba(139,92,246,.18);
  color:var(--text);
  border:1px solid var(--border2);
  box-shadow:0 2px 8px rgba(139,92,246,.15);
}
.tab-content{display:none}
.tab-content.active{display:block}

/* ══ PAGINATION ══════════════════════════════════════════════ */
.pagination{display:flex;align-items:center;justify-content:center;gap:5px;padding:16px;border-top:1px solid var(--border)}
.page-btn{
  background:rgba(22,25,48,.6);border:1px solid var(--border);
  color:var(--text2);font-size:12px;padding:6px 12px;border-radius:7px;
  cursor:pointer;transition:all .15s;font-family:inherit;
}
.page-btn:hover{background:var(--brand-t);color:var(--text);border-color:var(--border2)}
.page-btn.active{background:var(--grad-brand);color:white;border-color:transparent;box-shadow:0 3px 10px rgba(139,92,246,.35)}
.page-info{font-size:12px;color:var(--text2)}

/* ══ SKELETON ════════════════════════════════════════════════ */
.skeleton{
  background:linear-gradient(90deg,rgba(22,25,48,.8) 25%,rgba(35,38,70,.8) 50%,rgba(22,25,48,.8) 75%);
  background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:var(--r);
}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
.sk-card{border-radius:var(--r)}

/* ══ SPINNER ═════════════════════════════════════════════════ */
.spinner{
  width:20px;height:20px;
  border:2px solid rgba(139,92,246,.2);
  border-top-color:var(--brand);
  border-radius:50%;animation:spin .7s linear infinite;display:inline-block;
}
@keyframes spin{to{transform:rotate(360deg)}}

/* ══ MODAL ═══════════════════════════════════════════════════ */
.modal-overlay{
  position:fixed;inset:0;z-index:200;
  display:none;align-items:center;justify-content:center;
  background:rgba(0,0,0,.75);backdrop-filter:blur(8px);
}
.modal-overlay.open{display:flex}
.modal{
  background:rgba(13,16,32,0.95);
  border:1px solid var(--border2);border-radius:16px;
  padding:26px;max-width:520px;width:94%;max-height:80vh;overflow-y:auto;
  box-shadow:0 28px 60px rgba(0,0,0,.7), var(--glow);
  backdrop-filter:blur(24px);
}
.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}
.modal-title{
  font-size:16px;font-weight:700;letter-spacing:-.3px;
  background:var(--grad-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.modal-close{background:none;border:none;color:var(--text3);cursor:pointer;padding:5px;border-radius:6px;transition:all .15s}
.modal-close:hover{color:var(--text);background:var(--brand-t)}

/* ══ TOAST ═══════════════════════════════════════════════════ */
#toast-container{position:fixed;bottom:24px;right:24px;z-index:999;display:flex;flex-direction:column;gap:8px}
.toast{
  display:flex;align-items:center;gap:10px;
  padding:12px 16px;border-radius:10px;
  font-size:13px;font-weight:500;min-width:260px;max-width:380px;
  box-shadow:0 10px 30px rgba(0,0,0,.5);animation:toastIn .24s ease;
  backdrop-filter:blur(16px);
}
.toast-icon{width:16px;height:16px;flex-shrink:0;stroke:currentColor;fill:none}
.toast-msg{flex:1}
@keyframes toastIn{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}
.toast-success{background:rgba(16,185,129,.12);border:1px solid rgba(16,185,129,.25);color:var(--success)}
.toast-error{background:rgba(244,63,94,.12);border:1px solid rgba(244,63,94,.25);color:var(--danger)}
.toast-info{background:var(--brand-t);border:1px solid var(--border2);color:var(--brand-3)}

/* ══ FILTER BAR ══════════════════════════════════════════════ */
.filter-bar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:16px}

/* ══ CHARTS ══════════════════════════════════════════════════ */
.bar-chart{display:flex;align-items:flex-end;gap:6px;height:100px;padding:8px 0}
.bar-group{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px}
.bar{
  width:100%;
  background:linear-gradient(to top,var(--brand),rgba(167,139,250,.4));
  border-radius:5px 5px 0 0;min-height:4px;transition:height .45s ease;
  box-shadow:0 0 8px rgba(139,92,246,.2);
}
.bar-label{font-size:9px;color:var(--text3)}
#donut-panel{display:flex;align-items:center;justify-content:center;gap:20px;flex-wrap:wrap;padding:8px 0}
.donut-legend{display:flex;flex-direction:column;gap:8px}
.donut-item{display:flex;align-items:center;gap:8px;font-size:12px}
.donut-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}

/* ══ ACTIVITY / TOP ══════════════════════════════════════════ */
.activity-item{display:flex;align-items:flex-start;gap:10px;padding:11px 0;border-bottom:1px solid var(--border)}
.activity-item:last-child{border-bottom:none}
.activity-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;margin-top:5px}
.activity-text{font-size:12.5px;color:var(--text)}
.activity-time{font-size:11px;color:var(--text3);margin-top:1px}
.top-member{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--border)}
.top-member:last-child{border-bottom:none}
.top-rank{width:20px;font-size:12px;font-weight:700;color:var(--text3);text-align:center;flex-shrink:0}
.top-rank.gold{color:var(--gold)}.top-rank.silver{color:#94A3B8}.top-rank.bronze{color:#CD7F32}
.top-name{flex:1;font-size:12.5px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.top-val{font-size:12px;font-weight:600;color:var(--text2);flex-shrink:0}

/* ══ COMMANDS ════════════════════════════════════════════════ */
.cmd-form{
  background:rgba(13,16,32,0.7);border:1px solid var(--border);
  border-radius:var(--r);padding:20px;margin-bottom:16px;
  backdrop-filter:blur(12px);
}
.cmd-form-title{font-size:13px;font-weight:600;margin-bottom:14px}
.cmd-form-row{display:flex;gap:12px;align-items:flex-end}
.cmd-card{
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 16px;
  background:rgba(13,16,32,0.7);
  border:1px solid var(--border);border-radius:10px;margin-bottom:8px;
  transition:all .18s;backdrop-filter:blur(8px);
}
.cmd-card:hover{border-color:var(--border2);background:var(--brand-t2)}
.cmd-trigger{font-size:13px;font-weight:600;color:var(--brand-3);font-family:'Fira Code',monospace}
.cmd-response{font-size:12.5px;color:var(--text2);flex:1;margin:0 16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cmd-del{background:none;border:none;color:var(--text3);cursor:pointer;padding:4px;border-radius:5px;transition:color .15s}
.cmd-del:hover{color:var(--danger)}

/* ══ LOG MODULES ═════════════════════════════════════════════ */
.log-modules-grid{display:flex;flex-direction:column;gap:20px}

/* Résumé global */
.log-summary{
  display:flex;align-items:center;gap:10px;
  padding:14px 18px;border-radius:var(--r);
  background:linear-gradient(135deg,rgba(139,92,246,.1),rgba(99,102,241,.05));
  border:1px solid var(--border2);
}
.log-summary-count{font-size:18px;font-weight:800;letter-spacing:-.5px;
  background:var(--grad-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.log-summary-label{font-size:13px;color:var(--text2)}

/* Groupe */
.log-group{margin-bottom:4px}
.log-group-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:8px 4px 10px;margin-bottom:10px;
  border-bottom:1px solid var(--border);
}
.log-group-title{
  font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:1px;
  color:var(--brand-3);display:flex;align-items:center;gap:7px;
}
.log-group-title::before{content:'';width:3px;height:14px;border-radius:2px;background:var(--grad-brand);display:inline-block}
.log-group-badge{
  font-size:10.5px;font-weight:700;
  background:var(--brand-t);color:var(--brand-3);
  border:1px solid var(--border2);border-radius:99px;
  padding:2px 9px;
}
.log-group-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}

/* Carte individuelle */
.log-module{
  background:rgba(16,20,40,0.65);border:1px solid var(--border);
  border-radius:12px;padding:14px 16px;backdrop-filter:blur(10px);
  transition:all .2s;position:relative;
}
.log-module:hover{border-color:var(--border2);transform:translateY(-1px);box-shadow:0 4px 16px rgba(139,92,246,.08)}
.log-module.active{border-color:oklch(0.62 0.20 295 / 0.3);background:rgba(139,92,246,.07)}
.log-module.active::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:var(--grad-brand);border-radius:12px 12px 0 0}
.log-module-head{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.log-module-icon{
  width:32px;height:32px;flex-shrink:0;border-radius:9px;
  display:flex;align-items:center;justify-content:center;
  background:var(--brand-t);border:1px solid var(--border2);
  color:var(--brand-3);
}
.log-module-icon svg{width:15px;height:15px;stroke:currentColor;fill:none}
.log-module.active .log-module-icon{background:rgba(139,92,246,.2);border-color:oklch(0.62 0.20 295 / 0.3);color:var(--brand)}
.log-module-title{font-size:12.5px;font-weight:700;color:var(--text);flex:1}
.log-module-dot{width:6px;height:6px;border-radius:50%;background:var(--success);box-shadow:0 0 6px var(--success);flex-shrink:0}
.log-module-desc{font-size:11.5px;color:var(--text3);line-height:1.4;margin-bottom:10px}
.log-module .form-select{font-size:12px;padding:8px 30px 8px 10px}

/* ══ LEVEL REWARDS ═══════════════════════════════════════════ */
.reward-row{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--border)}
.reward-row:last-child{border-bottom:none}
.reward-level{
  width:50px;height:28px;
  background:var(--brand-t);border:1px solid var(--border2);
  border-radius:6px;display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:700;color:var(--brand-3);flex-shrink:0;
}
.reward-role{flex:1;font-size:12.5px;display:flex;align-items:center;gap:6px}
.role-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.reward-del{background:none;border:none;color:var(--text3);cursor:pointer;padding:4px;border-radius:5px;transition:color .15s}
.reward-del:hover{color:var(--danger)}

/* ══ PREMIUM PAGE ════════════════════════════════════════════ */
.premium-status-banner{
  padding:18px 22px;border-radius:var(--r);border:1px solid var(--border);
  background:rgba(13,16,32,0.7);
  display:flex;align-items:center;gap:14px;margin-bottom:20px;
  backdrop-filter:blur(12px);
}
.premium-status-banner.active{
  background:rgba(245,158,11,.05);
  border-color:rgba(245,158,11,.25);
  box-shadow:0 0 24px rgba(245,158,11,.08);
}
.psb-icon{font-size:22px;flex-shrink:0}
.psb-text .psb-title{font-size:14px;font-weight:700}
.psb-text .psb-sub{font-size:12px;color:var(--text2);margin-top:2px}
.psb-action{margin-left:auto}

.pricing-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px}
.pricing-card{
  background:rgba(13,16,32,0.75);border:1px solid var(--border);
  border-radius:var(--r);padding:28px;
  display:flex;flex-direction:column;gap:16px;position:relative;
  transition:all .22s;backdrop-filter:blur(16px);
}
.pricing-card:hover{border-color:var(--border2);transform:translateY(-2px);box-shadow:var(--glow)}
.pricing-featured{
  border-color:rgba(245,158,11,.3);
  background:linear-gradient(145deg,rgba(245,158,11,.05),rgba(13,16,32,.75));
}
.pricing-featured:hover{box-shadow:0 0 30px rgba(245,158,11,.12)}
.pricing-badge{
  position:absolute;top:-11px;left:50%;transform:translateX(-50%);
  background:var(--grad-gold);color:#0C0D12;
  font-size:9.5px;font-weight:800;padding:3px 12px;border-radius:99px;
  text-transform:uppercase;letter-spacing:.6px;
  box-shadow:0 2px 10px rgba(245,158,11,.4);
}
.pricing-name{font-size:12.5px;font-weight:600;color:var(--text2)}
.pricing-price{font-size:32px;font-weight:800;letter-spacing:-1.2px;color:var(--text);line-height:1}
.pricing-price span{font-size:14px;font-weight:400;color:var(--text2)}
.pricing-features{list-style:none;display:flex;flex-direction:column;gap:9px}
.pricing-features li{font-size:13px;color:var(--text2);display:flex;align-items:center;gap:8px}
.pricing-features li::before{content:'✓';color:var(--success);font-weight:700;font-size:12px;flex-shrink:0}

.perk-list{display:flex;flex-direction:column;gap:14px}
.perk-item{display:flex;align-items:flex-start;gap:12px}
.perk-item.perk-soon{opacity:.45}
.perk-icon{width:26px;height:26px;border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;flex-shrink:0}
.perk-ok{background:rgba(16,185,129,.1);color:var(--success);border:1px solid rgba(16,185,129,.2)}
.perk-title{font-size:13px;font-weight:600;color:var(--text)}
.perk-desc{font-size:12px;color:var(--text2);margin-top:2px}

/* ── Avatar upload ────────────────────────────────────────── */
.avatar-upload-wrap{margin-bottom:20px}
.avatar-current{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.avatar-img{
  width:72px;height:72px;border-radius:50%;
  object-fit:cover;border:3px solid var(--border2);flex-shrink:0;
  background:var(--bg3);
}
.avatar-img-placeholder{
  width:72px;height:72px;border-radius:50%;
  background:var(--grad-brand);border:3px solid var(--border2);
  display:flex;align-items:center;justify-content:center;
  font-size:24px;font-weight:800;color:white;flex-shrink:0;
  box-shadow:0 0 20px rgba(139,92,246,.4);
}
.avatar-current-info .avatar-label{font-size:13px;font-weight:600;color:var(--text)}
.avatar-current-info .avatar-sub{font-size:12px;color:var(--text2);margin-top:2px}
.avatar-drop{
  border:2px dashed var(--border2);border-radius:var(--r);
  padding:24px;text-align:center;cursor:pointer;
  transition:all .22s;
  background:rgba(22,25,48,.4);position:relative;
}
.avatar-drop:hover,.avatar-drop.dragover{
  border-color:var(--brand);background:var(--brand-t);
  box-shadow:0 0 20px rgba(139,92,246,.1);
}
.avatar-drop input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer}
.avatar-drop-icon{font-size:28px;margin-bottom:8px}
.avatar-drop-text{font-size:13px;color:var(--text2)}
.avatar-drop-text strong{color:var(--brand-3)}
.avatar-drop-sub{font-size:11.5px;color:var(--text3);margin-top:4px}
.avatar-preview-new{
  width:64px;height:64px;border-radius:50%;
  object-fit:cover;border:3px solid var(--brand);
  margin:0 auto 10px;display:none;
  box-shadow:0 0 16px rgba(139,92,246,.35);
}

/* ── Nick lock notice ─────────────────────────────────────── */
.lock-notice{
  display:flex;align-items:flex-start;gap:10px;
  padding:13px 16px;border-radius:10px;
  background:var(--brand-t);border:1px solid var(--border2);
  margin-bottom:16px;font-size:12.5px;color:var(--text2);line-height:1.4;
}
.lock-notice svg{flex-shrink:0;margin-top:1px;stroke:var(--brand-3);fill:none}
.lock-notice.no-premium{background:var(--gold-t);border-color:rgba(245,158,11,.2)}
.lock-notice.no-premium svg{stroke:var(--gold)}

/* ══ AI CONFIG EXTRAS ════════════════════════════════════════ */
.ai-var-list{
  display:flex;flex-wrap:wrap;gap:6px;
  padding:12px 14px;
  background:rgba(139,92,246,.05);
  border:1px solid var(--border);
  border-radius:9px;margin-bottom:14px;
}
.ai-var{
  font-size:11px;font-family:'Fira Code',monospace;
  background:var(--brand-t);color:var(--brand-3);
  border:1px solid var(--border2);border-radius:5px;
  padding:3px 8px;cursor:pointer;transition:all .15s;
}
.ai-var:hover{background:rgba(139,92,246,.22);border-color:var(--brand)}
.ai-preview-box{
  background:rgba(22,25,48,.7);border:1px solid var(--border);
  border-radius:9px;padding:14px;
  font-size:12.5px;color:var(--text2);line-height:1.6;
  white-space:pre-wrap;
  backdrop-filter:blur(8px);
}
.webhook-code{
  background:rgba(8,11,20,.8);border:1px solid var(--border);
  border-radius:9px;padding:12px 14px;
  font-size:12px;font-family:'Fira Code',monospace;color:#A5D8FF;
  overflow-x:auto;white-space:pre;
}

/* ══ AI CHECKLIST (rôles / salons) ══════════════════════════ */
.ai-checklist{
  display:flex;flex-direction:column;gap:4px;
  max-height:200px;overflow-y:auto;
  padding:6px 8px;
  background:var(--bg1);
  border:1px solid var(--border);border-radius:9px;
}
.ai-checklist:empty::before{
  content:'Chargement…';
  font-size:12px;color:var(--text3);padding:4px 2px;
}
.ai-check-item{
  display:flex;align-items:center;gap:8px;
  padding:5px 8px;border-radius:6px;cursor:pointer;
  transition:background .12s;
  font-size:13px;color:var(--text1);
}
.ai-check-item:hover{background:var(--bg3)}
.ai-check-item input[type=checkbox]{
  width:15px;height:15px;accent-color:var(--brand);
  cursor:pointer;flex-shrink:0;
}
.ai-check-item .check-icon{
  width:18px;height:18px;border-radius:4px;
  background:var(--bg3);display:flex;align-items:center;justify-content:center;
  flex-shrink:0;font-size:10px;
}

/* ══ AUTOMOD v2 : gear + sanctions ═══════════════════════════ */
.am-card-actions{display:flex;align-items:center;gap:8px}
.am-gear{
  background:var(--bg3);border:1px solid var(--border);border-radius:7px;
  width:28px;height:28px;display:flex;align-items:center;justify-content:center;
  color:var(--text3);cursor:pointer;transition:all .15s;
}
.am-gear:hover{color:var(--brand-3);border-color:var(--brand);background:var(--brand-t)}

.sanction-builder{
  display:grid;grid-template-columns:repeat(4,1fr) auto;gap:12px;align-items:end;
}
@media (max-width:900px){.sanction-builder{grid-template-columns:1fr 1fr}}
.sb-empty{
  border:1px dashed var(--border);border-radius:9px;
  padding:18px;text-align:center;font-size:12.5px;color:var(--text3);
}
.sb-rule{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:var(--bg1);border:1px solid var(--border);border-radius:9px;
  padding:10px 14px;margin-bottom:8px;
}
.sb-rule-txt{font-size:13px;color:var(--text2)}
.sb-rule-txt strong{color:var(--text)}
.sb-rule-del{
  background:none;border:none;color:var(--text3);cursor:pointer;
  padding:6px;border-radius:6px;transition:all .15s;flex-shrink:0;
}
.sb-rule-del:hover{color:#FF6B6B;background:rgba(255,107,107,.1)}

/* ══ SOCIALS ═════════════════════════════════════════════════ */
.social-platform-picker{display:flex;flex-wrap:wrap;gap:8px}
.sp-btn{
  display:flex;align-items:center;gap:8px;
  background:var(--bg1);border:1px solid var(--border);border-radius:9px;
  padding:9px 16px;font-size:13px;font-weight:600;color:var(--text2);
  cursor:pointer;transition:all .15s;font-family:inherit;
}
.sp-btn:hover{border-color:var(--brand);color:var(--text)}
.sp-btn.active{
  border-color:var(--brand);background:var(--brand-t);color:var(--text);
  box-shadow:0 0 0 1px var(--brand);
}
.sp-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.social-feed-row{
  display:flex;align-items:center;gap:12px;
  background:var(--bg1);border:1px solid var(--border);border-radius:10px;
  padding:12px 16px;margin-bottom:8px;transition:opacity .2s;
}
.social-feed-row.off{opacity:.5}
.sf-info{flex:1;min-width:0}
.sf-name{font-size:13.5px;font-weight:700;color:var(--text)}
.sf-platform{
  font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;
  background:var(--bg3);border:1px solid var(--border);border-radius:5px;
  padding:2px 7px;margin-left:6px;color:var(--text2);
}
.sf-sub{font-size:12px;color:var(--text3);margin-top:2px}

/* ══ AUTOMOD MODULES ═════════════════════════════════════════ */
.am-banner{
  display:flex;align-items:center;gap:14px;
  padding:18px 22px;margin-bottom:20px;border-radius:var(--r);
  background:linear-gradient(135deg,rgba(139,92,246,.12),rgba(99,102,241,.05));
  border:1px solid var(--border2);backdrop-filter:blur(12px);
}
.am-banner-ico{
  width:44px;height:44px;border-radius:12px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;font-size:22px;
  background:var(--brand-t);border:1px solid var(--border2);
}
.am-banner-txt h3{font-size:15px;font-weight:700;color:var(--text);margin-bottom:2px}
.am-banner-txt p{font-size:12.5px;color:var(--text2)}
.am-banner .am-count{margin-left:auto;text-align:center;flex-shrink:0}
.am-banner .am-count b{font-size:24px;font-weight:800;background:var(--grad-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.am-banner .am-count span{display:block;font-size:11px;color:var(--text3)}

.am-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:16px}
.am-card{
  background:rgba(13,16,32,.7);border:1px solid var(--border);
  border-radius:var(--r);padding:20px;backdrop-filter:blur(14px);
  transition:all .22s;position:relative;overflow:hidden;will-change:transform;
}
.am-card:hover{border-color:var(--border2);transform:translateY(-2px);box-shadow:0 8px 28px rgba(139,92,246,.1)}
.am-card.on{border-color:var(--border2);box-shadow:0 0 0 1px var(--border2),0 8px 28px rgba(139,92,246,.1)}
.am-card.on::before{
  content:'';position:absolute;top:0;left:0;right:0;height:2px;background:var(--grad-brand);
}
.am-card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.am-ico{
  width:42px;height:42px;border-radius:11px;
  display:flex;align-items:center;justify-content:center;font-size:21px;
  background:var(--brand-t);border:1px solid var(--border);transition:all .2s;
}
.am-card.on .am-ico{background:rgba(139,92,246,.2);border-color:var(--border2)}
.am-title{font-size:15px;font-weight:700;color:var(--text);margin-bottom:5px}
.am-desc{font-size:12.5px;color:var(--text2);line-height:1.5}
.am-field{
  display:flex;align-items:center;gap:10px;margin-top:14px;
  padding-top:14px;border-top:1px solid var(--border);
}
.am-field label{font-size:12px;font-weight:600;color:var(--text2);white-space:nowrap;flex:1}
.am-field input{
  width:84px;flex-shrink:0;background:rgba(22,25,48,.6);border:1px solid var(--border2);
  border-radius:8px;color:var(--text);font-size:13px;font-family:inherit;padding:8px 10px;outline:none;text-align:center;transition:all .18s;
}
.am-field input:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(139,92,246,.15)}
.am-field select{
  flex-shrink:0;appearance:none;cursor:pointer;outline:none;font-family:inherit;
  background:rgba(22,25,48,.6) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11' viewBox='0 0 24 24' fill='none' stroke='%2394A3B8' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") no-repeat right 9px center;
  border:1px solid var(--border2);border-radius:8px;
  color:var(--text);font-size:12px;padding:7px 28px 7px 10px;transition:all .18s;
}
.am-field select:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(139,92,246,.15)}
.am-field select option{background:oklch(0.20 0.035 275);color:var(--text)}

/* ══ EMBED BUILDER ═══════════════════════════════════════════ */
.embed-builder-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
.eb-preview-wrap{position:sticky;top:96px}
.eb-section{margin-bottom:22px}
.eb-section-title{
  font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:1px;
  color:var(--brand-3);margin-bottom:12px;
  display:flex;align-items:center;gap:8px;
  padding:8px 12px;border-radius:8px;
  background:linear-gradient(90deg,rgba(139,92,246,.1),transparent);
  border-left:2px solid var(--brand);
}
.eb-field-card,.eb-btn-card{
  background:rgba(22,25,48,.5);border:1px solid var(--border);
  border-radius:10px;padding:12px;margin-bottom:8px;
}
.eb-row{display:flex;gap:8px;align-items:center}
.eb-row .form-input{flex:1;margin:0}
.eb-row-del{
  background:rgba(244,63,94,.1);border:1px solid rgba(244,63,94,.2);color:var(--danger);
  cursor:pointer;border-radius:8px;width:34px;height:34px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;transition:all .15s;
}
.eb-row-del:hover{background:rgba(244,63,94,.2)}
.eb-inline-check{display:flex;align-items:center;gap:7px;margin-top:8px;font-size:12px;color:var(--text2);cursor:pointer}
.eb-color-row{display:flex;align-items:center;gap:10px}

/* ── Discord embed preview mock ── */
.ep{
  position:relative;background:#2b2d31;border-radius:4px;
  border-left:4px solid #8B5CF6;padding:13px 16px 13px 12px;max-width:432px;
  font-family:'Inter','gg sans',sans-serif;
}
.ep-content{color:#dbdee1;font-size:14px;margin-bottom:8px;white-space:pre-wrap;word-break:break-word}
.ep-author{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.ep-author img{width:24px;height:24px;border-radius:50%;object-fit:cover}
.ep-author span{font-size:13px;font-weight:600;color:#fff}
.ep-title{font-size:15px;font-weight:600;color:#fff;margin-bottom:8px;word-break:break-word}
.ep-title a{color:#00a8fc;text-decoration:none}
.ep-desc{font-size:13px;color:#dbdee1;white-space:pre-wrap;margin-bottom:8px;line-height:1.45;word-break:break-word}
.ep-fields{display:grid;grid-template-columns:1fr;gap:8px;margin-bottom:8px}
.ep-fields.has-inline{grid-template-columns:repeat(3,1fr)}
.ep-field-full{grid-column:1/-1}
.ep-field-name{font-size:13px;font-weight:600;color:#fff;margin-bottom:2px}
.ep-field-val{font-size:13px;color:#dbdee1;white-space:pre-wrap;word-break:break-word}
.ep-image img{max-width:100%;border-radius:4px;margin-top:4px;display:block}
.ep-thumb{position:absolute;top:13px;right:16px;width:72px;height:72px;border-radius:4px;object-fit:cover}
.ep-footer{display:flex;align-items:center;gap:8px;font-size:11px;color:#949ba4;margin-top:8px}
.ep-footer img{width:18px;height:18px;border-radius:50%;object-fit:cover}
.ep-buttons{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.ep-btn{background:#4e5058;color:#fff;font-size:13px;font-weight:500;padding:8px 14px;border-radius:4px;display:inline-flex;align-items:center;gap:6px}
.ep-btn::after{content:'↗';font-size:11px;opacity:.7}
.ep-empty{color:#949ba4;font-style:italic;font-size:13px}
.ep-msg-wrap{background:#313338;border-radius:8px;padding:16px}

/* ── Saved templates ── */
.eb-saved{display:flex;align-items:center;gap:10px;padding:10px 14px;background:rgba(13,16,32,.7);border:1px solid var(--border);border-radius:9px;margin-bottom:8px}
.eb-saved-name{flex:1;font-size:13px;font-weight:600;color:var(--text)}
.eb-saved-date{font-size:11px;color:var(--text3)}

@media(max-width:1100px){.embed-builder-grid{grid-template-columns:1fr}.eb-preview-wrap{position:static}}

/* ══ RANGE SLIDER ════════════════════════════════════════════ */
input[type=range]{
  -webkit-appearance:none;appearance:none;
  width:100%;height:4px;
  background:linear-gradient(to right,var(--brand) 0%,var(--brand) var(--pct,50%),rgba(22,25,48,.8) var(--pct,50%));
  border-radius:2px;outline:none;
}
input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;
  width:18px;height:18px;border-radius:50%;
  background:var(--grad-brand);cursor:pointer;
  box-shadow:0 0 10px rgba(139,92,246,.5);
  border:2px solid rgba(255,255,255,.1);
}
input[type=range]::-moz-range-thumb{
  width:18px;height:18px;border-radius:50%;
  background:var(--grad-brand);cursor:pointer;
  box-shadow:0 0 10px rgba(139,92,246,.5);
  border:2px solid rgba(255,255,255,.1);
}

/* ══ COLOR INPUT ═════════════════════════════════════════════ */
input[type=color]{
  -webkit-appearance:none;appearance:none;
  width:42px;height:36px;border-radius:8px;
  border:1px solid var(--border2);padding:0 3px;
  background:rgba(22,25,48,.6);cursor:pointer;
}
input[type=color]::-webkit-color-swatch-wrapper{padding:2px}
input[type=color]::-webkit-color-swatch{border-radius:5px;border:none}

/* ══ FOCUS VISIBLE ═══════════════════════════════════════════ */
:focus-visible{outline:2px solid var(--brand);outline-offset:3px;box-shadow:0 0 0 4px rgba(139,92,246,.15)}

/* ══ SELECTION ═══════════════════════════════════════════════ */
::selection{background:rgba(139,92,246,.3);color:var(--text)}

/* ══ LOG MODULE ICON ═════════════════════════════════════════ */
.log-module-title{display:flex;align-items:center;gap:7px}
.log-module-title::before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--brand);flex-shrink:0;box-shadow:0 0 6px rgba(139,92,246,.6)}

/* ══ CMD CARD HOVER ══════════════════════════════════════════ */
.cmd-card{will-change:transform}
.cmd-card:hover{transform:translateX(2px)}

/* ══ PRICING CARD ════════════════════════════════════════════ */
.pricing-card{will-change:transform}

/* ══ PREFERS REDUCED MOTION ══════════════════════════════════ */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
}

/* ══ RESPONSIVE ══════════════════════════════════════════════ */
@media(max-width:1100px){
  .cards-row{grid-template-columns:repeat(2,1fr)}
  .grid3{grid-template-columns:1fr}
}
@media(max-width:768px){
  :root{--sidebar:0px}
  .sidebar{display:none}
  .page-content{padding:14px 16px}
  .page-header{padding:16px 16px 14px}
  .grid2,.form-row,.grid3{grid-template-columns:1fr}
  .cards-row{grid-template-columns:repeat(2,1fr)}
  .pricing-grid{grid-template-columns:1fr}
  .log-modules-grid{grid-template-columns:1fr}
  .cmd-form-row{flex-direction:column}
}