/* ===== Planeta Jorjão — estilo global ===== */
* { box-sizing: border-box; margin: 0; padding: 0; }

:root{
  --bg:#060410;
  --panel:rgba(13,8,24,0.7);
  --panel2:rgba(8,4,16,0.4);
  --border:rgba(168,85,247,0.22);
  --border-soft:rgba(168,85,247,0.14);
  --purple:#a855f7;
  --purple-lt:#bd6bff;
  --magenta:#d96bff;
  --text:#e8e2f4;
  --dim:#9a86c8;
  --dim2:#9384b6;
  --green:#4ade80;
  --red:#ff3b3b;
}

body{
  background:var(--bg);
  font-family:'Rajdhani',system-ui,sans-serif;
  color:var(--text);
  min-height:100vh;
}
a{ text-decoration:none; color:inherit; }
::selection{ background:var(--purple); color:#fff; }
input,select,button,textarea{ font-family:'Rajdhani',sans-serif; }
input:focus,select:focus{ outline:none; border-color:var(--purple); }

/* fundo nebulosa + estrelas */
.space{
  position:relative;
  width:1536px;
  max-width:100%;
  margin:0 auto;
  overflow:hidden;
  background:
    radial-gradient(900px 600px at 12% 8%, rgba(120,40,200,0.28), transparent 60%),
    radial-gradient(1000px 700px at 95% 35%, rgba(90,30,180,0.22), transparent 55%),
    radial-gradient(800px 600px at 70% 95%, rgba(140,50,220,0.18), transparent 55%),
    linear-gradient(160deg,#0a0518 0%,#07040f 45%,#0b0617 100%);
}
.stars{
  position:absolute; inset:0; pointer-events:none; opacity:.5;
  background-image:
    radial-gradient(1px 1px at 20% 12%,#fff,transparent),
    radial-gradient(1px 1px at 80% 22%,#d9b8ff,transparent),
    radial-gradient(1px 1px at 40% 60%,#fff,transparent),
    radial-gradient(1px 1px at 65% 80%,#c79bff,transparent),
    radial-gradient(1px 1px at 90% 70%,#fff,transparent),
    radial-gradient(1px 1px at 10% 85%,#fff,transparent),
    radial-gradient(1px 1px at 55% 30%,#e7d4ff,transparent);
}

/* ===== Header / Nav ===== */
.topbar{ position:relative; display:flex; align-items:center; justify-content:space-between; padding:22px 32px 18px; gap:20px; }
.brand{ display:flex; align-items:center; gap:14px; }
.planet{ width:62px; height:62px; border-radius:50%; position:relative; flex-shrink:0;
  background:radial-gradient(circle at 38% 35%,#c98bff 0%,#7b2ed1 35%,#2a0d52 75%,#160730 100%);
  box-shadow:0 0 22px rgba(168,85,247,0.55),inset -6px -6px 14px rgba(0,0,0,0.5); }
.planet::before{ content:""; position:absolute; inset:-9px 0; border:3px solid rgba(196,140,255,0.55);
  border-radius:50%; transform:rotate(-22deg); border-left-color:transparent; border-right-color:transparent; }
.planet.sm{ width:54px; height:54px; }
.brand .lines{ line-height:.78; }
.brand .p{ font-family:'Anton',sans-serif; font-size:30px; letter-spacing:1.5px; color:#f3edff; text-shadow:0 2px 10px rgba(0,0,0,.6); }
.brand .j{ font-family:'Permanent Marker',cursive; font-size:30px; font-style:italic; color:#b65dff;
  text-shadow:0 0 16px rgba(182,93,255,.7); transform:skewX(-6deg); margin-top:2px; }

.nav{ display:flex; align-items:center; gap:30px; font-weight:600; font-size:15px; letter-spacing:1.2px; }
.nav a{ color:#cabfe0; padding-bottom:6px; }
.nav a:hover{ color:#e7d8ff; }
.nav a.active{ color:var(--purple-lt); border-bottom:2px solid var(--purple-lt); text-shadow:0 0 12px rgba(189,107,255,.6); }

.actions{ display:flex; align-items:center; gap:14px; }
.btn{ display:inline-flex; align-items:center; gap:9px; font-weight:700; font-size:14px; letter-spacing:1.5px;
  padding:13px 26px; border-radius:5px; cursor:pointer; border:none; }
.btn-ghost{ background:transparent; border:1.5px solid #8b4dd6; color:#d9c4ff; }
.btn-primary{ background:linear-gradient(135deg,#9333ea,#7c22cc); color:#fff; box-shadow:0 0 22px rgba(147,51,234,.5); }
.btn-lg{ font-size:15px; padding:15px 26px; border-radius:6px; }

/* ===== Hero ===== */
.hero{ position:relative; display:grid; grid-template-columns:430px 1fr 280px; padding:8px 32px 0; align-items:stretch; }
.hero-left{ padding:18px 30px 18px 8px; display:flex; flex-direction:column; justify-content:center; }
.badge{ display:inline-flex; align-items:center; gap:9px; font-weight:700; font-size:13px; letter-spacing:1.5px; padding:8px 16px; border-radius:6px; width:fit-content; }
.badge-live{ background:rgba(180,30,40,0.18); border:1px solid rgba(239,68,68,0.5); color:#ff6b6b; }
.dot{ width:9px; height:9px; border-radius:50%; background:var(--red); box-shadow:0 0 10px var(--red); }
.dot.gray{ background:#9a86c8; box-shadow:0 0 8px #9a86c8; }
.dot.sm{ width:8px; height:8px; }
@keyframes blink{ 0%,100%{opacity:1;} 50%{opacity:.35;} }
.blink{ animation:blink 1.4s infinite; }
.hero-sub{ font-weight:600; font-size:17px; letter-spacing:1px; color:#c9bce0; margin-top:22px; }
.hero-title{ font-family:'Anton',sans-serif; font-size:60px; line-height:.96; letter-spacing:1px; margin-top:10px;
  background:linear-gradient(180deg,#f4eeff,#b9a9d6); -webkit-background-clip:text; background-clip:text; color:transparent; text-shadow:0 4px 18px rgba(0,0,0,.5); }
.hero-title .caos{ background:linear-gradient(180deg,#d96bff,#9333ea); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hero-go{ font-weight:600; font-size:18px; letter-spacing:1.5px; color:#d7ccea; margin-top:16px; }
.hero-actions{ display:flex; gap:14px; margin-top:26px; }
.btn-dark{ background:rgba(20,12,32,0.8); border:1px solid rgba(168,85,247,0.35); color:#e7dcff; }
.watchers{ display:flex; align-items:center; gap:18px; margin-top:24px; font-size:15px; font-weight:600; color:#b6a8d0; }
.watchers .sep{ opacity:.4; }

/* video */
.video{ position:relative; border-radius:10px; overflow:hidden; border:1px solid rgba(168,85,247,0.3); box-shadow:0 0 40px rgba(80,20,160,0.35); min-height:420px;
  background:radial-gradient(600px 300px at 30% 30%, rgba(160,60,230,0.35), transparent 60%),radial-gradient(500px 400px at 75% 70%, rgba(70,30,140,0.4), transparent 60%),linear-gradient(150deg,#1a0c33 0%,#0c0620 50%,#150a2c 100%); }
.video .city{ position:absolute; inset:0; background-image:linear-gradient(transparent 60%, rgba(8,4,18,0.85)),repeating-linear-gradient(90deg, rgba(180,120,255,0.05) 0 3px, transparent 3px 26px); }
.video .bld{ position:absolute; bottom:24%; background:linear-gradient(#2a1550,#0e0722); }
.video .neon{ position:absolute; top:18%; left:42%; width:14px; height:14px; border-radius:50%; background:#ff5b9a; box-shadow:0 0 24px 6px #ff5b9a; }
.video-badge{ position:absolute; top:16px; left:16px; display:flex; align-items:center; gap:8px; background:rgba(0,0,0,0.55); border:1px solid rgba(239,68,68,0.5); padding:6px 12px; border-radius:5px; font-weight:700; font-size:13px; letter-spacing:1px; color:#fff; }
.video-alien{ position:absolute; bottom:88px; right:18px; font-size:20px; opacity:.5; }
.video-ctrl{ position:absolute; left:0; right:0; bottom:0; padding:0 18px 14px; }
.progress{ height:4px; background:rgba(255,255,255,0.2); border-radius:3px; margin-bottom:14px; position:relative; }
.progress > i{ position:absolute; left:0; top:0; bottom:0; width:78%; background:var(--purple); border-radius:3px; }
.progress > b{ position:absolute; left:78%; top:50%; width:13px; height:13px; background:#fff; border-radius:50%; transform:translate(-50%,-50%); box-shadow:0 0 8px rgba(168,85,247,.8); }
.ctrl-row{ display:flex; align-items:center; justify-content:space-between; color:#e6dcf5; font-size:15px; }
.ctrl-row .grp{ display:flex; align-items:center; gap:18px; }
.ctrl-status{ display:flex; align-items:center; gap:7px; font-weight:600; font-size:13px; }
.twitch-frame{ position:absolute; inset:0; width:100%; height:100%; border:none; }
#twitch-fallback{ position:absolute; inset:0; }
.twitch-open-btn{ position:absolute; bottom:60px; left:50%; transform:translateX(-50%); z-index:2; text-align:center; }

/* chat */
.chat{ margin-left:18px; border:1px solid rgba(168,85,247,0.28); border-radius:10px; background:rgba(14,8,26,0.78); display:flex; flex-direction:column; overflow:hidden; }
.chat-head{ padding:12px 16px; border-bottom:1px solid rgba(168,85,247,0.2); font-weight:700; font-size:12px; letter-spacing:1.5px; color:#b79ce0; }
.chat-msgs{ padding:14px 16px; display:flex; flex-direction:column; gap:13px; font-size:14px; line-height:1.3; }
.chat-msgs b{ font-weight:700; }
.chat-msgs span{ color:#cdc2e0; }
.chat-frame{ flex:1; width:100%; border:none; }

/* ===== Cards / grids ===== */
.row3{ position:relative; display:grid; grid-template-columns:1fr 1.32fr 1.32fr; gap:24px; padding:34px 32px 0; }
.card{ border:1px solid var(--border); border-radius:10px; background:var(--panel); padding:20px; }
.card-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.card-title{ font-family:'Anton',sans-serif; font-size:19px; letter-spacing:.5px; color:#efe7ff; }
.card-title .ar{ color:var(--purple); }
.see-all{ font-size:11px; font-weight:700; letter-spacing:1px; color:var(--dim); }

/* jogos em alta */
.games{ display:flex; flex-direction:column; gap:6px; }
.game-row{ display:flex; align-items:center; gap:12px; padding:8px; border-radius:7px; }
.game-row .rank{ font-family:'Anton',sans-serif; font-size:16px; color:#7a6a9c; width:14px; text-align:center; }
.game-row .thumb{ width:54px; height:38px; border-radius:5px; flex-shrink:0; }
.game-row .name{ font-weight:700; font-size:15px; color:#ece4fa; }
.game-row .meta{ font-size:12.5px; color:var(--dim2); }
.game-row .flex{ flex:1; }
.tag{ font-size:10px; font-weight:700; letter-spacing:.8px; color:#c4b6e0; background:rgba(168,85,247,0.14); border:1px solid rgba(168,85,247,0.25); padding:3px 8px; border-radius:4px; white-space:nowrap; }

/* loja */
.shop-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.product{ background:var(--panel2); border:1px solid var(--border-soft); border-radius:8px; padding:12px; display:flex; flex-direction:column; }
.product .img{ height:96px; border-radius:6px; background:radial-gradient(circle at 50% 50%, #2a1a40, #0c0618); display:flex; align-items:center; justify-content:center; font-size:38px; overflow:hidden; }
.product .img img{ width:100%; height:100%; object-fit:cover; }
.product .pname{ font-size:13px; font-weight:600; color:#d6cbec; line-height:1.25; margin-top:10px; min-height:34px; }
.price{ font-family:'Anton',sans-serif; font-size:19px; color:#f3ecff; margin-top:6px; }
.buy{ margin-top:10px; background:linear-gradient(135deg,#9333ea,#7c22cc); border:none; color:#fff; font-weight:700; font-size:13px; letter-spacing:1px; padding:10px; border-radius:5px; cursor:pointer; }

/* galeria */
.gallery-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.tile{ position:relative; aspect-ratio:4/3; border-radius:7px; overflow:hidden; border:1px solid rgba(168,85,247,0.18); }
.tile img{ width:100%; height:100%; object-fit:cover; transition:transform .35s ease; }
.tile[data-lb]{ cursor:pointer; }
.tile[data-lb]:hover img{ transform:scale(1.07); }
.tile[data-lb]:hover::after{ content:'🔍'; position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:28px; background:rgba(0,0,0,0.32); }
.tile .cap{ position:absolute; left:0; right:0; bottom:0; padding:10px 12px; background:linear-gradient(transparent,rgba(8,4,18,0.9)); font-size:13px; font-weight:600; color:#e6def6; }

/* lightbox */
.pj-lb{ position:fixed; inset:0; z-index:9999; background:rgba(5,2,15,0.94); display:flex; align-items:center; justify-content:center; opacity:0; visibility:hidden; transition:opacity .22s,visibility .22s; }
.pj-lb.open{ opacity:1; visibility:visible; }
.pj-lb-inner{ position:relative; display:flex; flex-direction:column; align-items:center; max-width:90vw; }
.pj-lb-img{ max-width:90vw; max-height:80vh; object-fit:contain; border-radius:10px; box-shadow:0 0 70px rgba(147,51,234,0.45); display:block; }
.pj-lb-info{ display:flex; align-items:center; justify-content:center; gap:18px; margin-top:14px; }
.pj-lb-cap{ color:#c4b2e8; font-size:15px; font-family:'Rajdhani',sans-serif; font-weight:600; }
.pj-lb-counter{ color:rgba(255,255,255,0.4); font-size:13px; font-family:'Rajdhani',sans-serif; letter-spacing:1px; }
.pj-lb-close{ position:fixed; top:18px; right:22px; width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,0.08); border:1px solid rgba(168,85,247,0.4); color:#fff; font-size:18px; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .2s; z-index:2; }
.pj-lb-close:hover{ background:rgba(147,51,234,0.4); }
.pj-lb-arrow{ position:fixed; top:50%; transform:translateY(-50%); background:rgba(0,0,0,0.45); border:1px solid rgba(168,85,247,0.35); color:#fff; font-size:32px; line-height:1; padding:12px 8px; border-radius:8px; cursor:pointer; transition:background .2s; z-index:2; user-select:none; }
.pj-lb-arrow:hover{ background:rgba(147,51,234,0.35); }
.pj-lb-prev{ left:12px; }
.pj-lb-next{ right:12px; }

/* ===== Lower row ===== */
.lower{ position:relative; display:grid; grid-template-columns:1.05fr 1.35fr 0.85fr; gap:24px; padding:24px 32px 0; }
.agenda-list{ display:flex; flex-direction:column; gap:4px; }
.agenda-row{ display:flex; align-items:center; gap:14px; padding:11px 8px; border-bottom:1px solid rgba(168,85,247,0.1); }
.agenda-row .date{ font-weight:700; font-size:13px; color:#c4b6e0; }
.agenda-row .time{ font-size:12px; color:#8a7cae; }
.agenda-row .av{ width:30px; height:30px; border-radius:50%; flex-shrink:0; }
.agenda-row .title{ flex:1; font-weight:600; font-size:14.5px; color:#e6def6; }
.agenda-row .lbl{ font-size:10px; font-weight:700; letter-spacing:.5px; color:var(--dim2); }

.sub-card{ background:rgba(8,4,16,0.5); border:1px solid rgba(168,85,247,0.15); border-radius:8px; padding:14px; }
.sub-title{ font-size:12px; font-weight:700; letter-spacing:1px; color:var(--dim); margin-bottom:12px; }
.trend-row{ display:flex; align-items:center; gap:9px; padding:6px 0; }
.trend-row .rk{ font-family:'Anton',sans-serif; font-size:14px; color:var(--purple); width:14px; }
.trend-row .nm{ flex:1; font-weight:600; font-size:14px; color:#ddd2f0; }
.trend-row .up{ font-size:13px; font-weight:700; color:var(--green); }
.donut{ width:96px; height:96px; border-radius:50%; flex-shrink:0;
  background:conic-gradient(#a855f7 0 42%, #6d28d9 42% 70%, #38bdf8 70% 85%, #ec4899 85% 94%, #475569 94% 100%);
  -webkit-mask:radial-gradient(circle, transparent 44%, #000 45%); mask:radial-gradient(circle, transparent 44%, #000 45%); }
.legend{ display:flex; flex-direction:column; gap:7px; font-size:12.5px; font-weight:600; }
.legend > div{ display:flex; align-items:center; gap:7px; }
.legend .sw{ width:9px; height:9px; border-radius:2px; }
.legend .ln{ color:#cdc2e0; width:120px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.legend .pc{ color:var(--dim); }

.coins-wrap{ display:flex; align-items:center; gap:20px; }
@keyframes float{ 0%,100%{transform:translateY(0);} 50%{transform:translateY(-6px);} }
.coin{ width:108px; height:108px; border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center;
  background:radial-gradient(circle at 40% 35%, rgba(120,40,200,0.5), rgba(20,10,40,0.9)); border:2px dashed rgba(168,85,247,0.55); animation:float 4s ease-in-out infinite; }
.coin span{ font-size:46px; filter:drop-shadow(0 0 10px rgba(168,85,247,.8)); }
.coin-num{ font-family:'Anton',sans-serif; font-size:40px; color:#f3ecff; line-height:1; }
.coin-lbl{ font-size:12px; font-weight:700; letter-spacing:1.5px; color:var(--dim); margin-top:4px; }
.coin-btn{ display:flex; align-items:center; justify-content:center; gap:10px; width:100%; margin-top:22px; background:linear-gradient(135deg,#9333ea,#7c22cc); border:none; color:#fff; font-weight:700; font-size:15px; letter-spacing:1.5px; padding:15px; border-radius:6px; cursor:pointer; box-shadow:0 0 22px rgba(147,51,234,.4); }

/* ===== Footer ===== */
.foot{ position:relative; margin-top:40px; padding:40px 32px 32px; border-top:1px solid rgba(168,85,247,0.18); background:linear-gradient(180deg, rgba(20,10,38,0.5), rgba(8,4,18,0.9)); }
.foot-cols{ display:grid; grid-template-columns:1.3fr 1fr 1fr 1.2fr; gap:40px; }
.foot p{ font-size:14px; color:#9a8cbc; line-height:1.5; margin-top:16px; max-width:240px; }
.socials{ display:flex; gap:12px; margin-top:18px; font-size:16px; }
.socials span{ width:34px; height:34px; border-radius:50%; background:rgba(168,85,247,0.15); border:1px solid rgba(168,85,247,0.3); display:flex; align-items:center; justify-content:center; }
.foot h4{ font-weight:700; font-size:13px; letter-spacing:1.5px; color:var(--purple-lt); margin-bottom:16px; }
.foot-links{ display:flex; flex-direction:column; gap:11px; font-size:14px; color:#a89cc4; font-weight:500; }
.foot-links.two{ display:grid; grid-template-columns:1fr 1fr; gap:11px 18px; }
.newsletter{ display:flex; gap:8px; margin-top:6px; }
.newsletter input{ flex:1; background:rgba(8,4,16,0.7); border:1px solid rgba(168,85,247,0.3); border-radius:6px; padding:12px 14px; color:var(--text); font-size:14px; }
.newsletter button{ width:46px; background:linear-gradient(135deg,#9333ea,#7c22cc); border:none; border-radius:6px; color:#fff; font-size:18px; cursor:pointer; }
.stamp{ position:absolute; right:40px; top:36px; width:230px; height:160px; border:3px solid rgba(168,85,247,0.35); border-radius:50%/40%;
  display:flex; flex-direction:column; align-items:center; justify-content:center; transform:rotate(-9deg); opacity:.5; }
.stamp .em{ font-size:30px; margin-bottom:4px; }
.stamp .tx{ font-family:'Anton',sans-serif; font-size:26px; letter-spacing:2px; color:#b07bdf; line-height:.9; text-align:center; }
.foot-mini{ font-family:'Anton',sans-serif; font-size:24px; letter-spacing:1px; color:#f3edff; }
.foot-mini .j{ font-family:'Permanent Marker',cursive; color:#b65dff; font-style:italic; }

/* ===== Páginas internas ===== */
main.page{ position:relative; padding:18px 32px 0; }
.page-head{ display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:24px; }
.eyebrow{ font-size:13px; font-weight:700; letter-spacing:2px; color:var(--dim); }
.page-title{ font-family:'Anton',sans-serif; font-size:52px; letter-spacing:1px; color:#f3ecff; line-height:1; }
.page-desc{ font-size:17px; color:#b6a8d0; margin-top:6px; }
.chips{ display:flex; gap:10px; margin-bottom:24px; flex-wrap:wrap; }
.chip{ background:rgba(168,85,247,0.12); border:1px solid rgba(168,85,247,0.3); color:#c4b6e0; font-weight:600; font-size:13px; letter-spacing:1px; padding:9px 18px; border-radius:20px; }
.chip.on{ background:linear-gradient(135deg,#9333ea,#7c22cc); color:#fff; border:none; }
.grid4{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.grid3{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.vcard{ border:1px solid rgba(168,85,247,0.18); border-radius:10px; overflow:hidden; background:var(--panel); }
.vthumb{ position:relative; aspect-ratio:16/9; }
.vthumb .pill{ position:absolute; top:10px; left:10px; color:#fff; font-size:11px; font-weight:700; padding:3px 8px; border-radius:4px; }
.vthumb .dur{ position:absolute; bottom:10px; right:10px; background:rgba(0,0,0,0.6); color:#fff; font-size:11px; font-weight:700; padding:3px 8px; border-radius:4px; }
.vbody{ padding:13px; }
.vbody .t{ font-weight:700; font-size:15px; color:#ece4fa; line-height:1.2; }
.vbody .m{ font-size:12.5px; color:var(--dim2); margin-top:5px; }
.stats5{ display:grid; grid-template-columns:repeat(5,1fr); gap:18px; margin-bottom:34px; }
.stat{ border:1px solid rgba(168,85,247,0.2); border-radius:10px; background:var(--panel); padding:18px 20px; }
.stat .n{ font-family:'Anton',sans-serif; font-size:30px; color:#f3ecff; }
.stat .l{ font-size:12px; font-weight:700; letter-spacing:1px; color:var(--dim); margin-top:4px; }
.section-title{ font-family:'Anton',sans-serif; font-size:22px; color:#efe7ff; margin-bottom:16px; }

.foot-row{ position:relative; margin-top:50px; padding:28px 32px; border-top:1px solid rgba(168,85,247,0.18); display:flex; align-items:center; justify-content:space-between; }

/* ===== Admin ===== */
.login-wrap{ position:relative; display:flex; align-items:center; justify-content:center; padding:70px 32px; }
.login-card{ width:420px; max-width:100%; border:1px solid rgba(168,85,247,0.25); border-radius:14px; background:rgba(13,8,24,0.8); padding:40px; box-shadow:0 0 50px rgba(80,20,160,0.3); }
.login-card .ic{ text-align:center; font-size:42px; }
.login-card h2{ font-family:'Anton',sans-serif; font-size:30px; color:#f3ecff; text-align:center; margin-top:6px; }
.login-card .hint{ font-size:14px; color:var(--dim); text-align:center; margin-top:4px; }
label{ font-size:12px; font-weight:700; letter-spacing:1px; color:var(--dim); display:block; }
.inp{ width:100%; background:rgba(8,4,16,0.7); border:1px solid rgba(168,85,247,0.3); border-radius:7px; padding:12px 14px; color:var(--text); font-size:15px; }
.inp.file{ border:1px dashed rgba(168,85,247,0.4); color:#b6a8d0; font-size:13px; padding:11px 14px; }
.flash{ font-size:14px; font-weight:600; margin-bottom:14px; padding:10px 16px; border-radius:7px; }
.flash.ok{ color:#6ee7a8; background:rgba(22,163,74,0.15); border:1px solid rgba(34,197,94,0.4); }
.flash.err{ color:#ff6b6b; background:rgba(180,30,40,0.15); border:1px solid rgba(239,68,68,0.4); }
.dash-stats{ display:flex; gap:20px; margin-bottom:24px; flex-wrap:wrap; }
.dash-stat{ flex:1; min-width:180px; border:1px solid rgba(168,85,247,0.2); border-radius:10px; background:var(--panel); padding:18px 22px; }
.dash-stat .l{ font-size:13px; color:var(--dim); letter-spacing:1px; }
.dash-stat .n{ font-family:'Anton',sans-serif; font-size:34px; color:#f3ecff; }
.dash-stat .lk{ font-weight:700; font-size:18px; color:var(--purple-lt); }
.admin-card{ border:1px solid var(--border); border-radius:12px; background:var(--panel); padding:24px; }
.admin-card h3{ font-family:'Anton',sans-serif; font-size:22px; color:#efe7ff; margin-bottom:6px; }
.admin-card .sub{ font-size:13px; color:var(--dim); margin-bottom:16px; }
.grid2{ display:grid; grid-template-columns:1fr 1fr; gap:24px; align-items:start; }
.form-col{ display:flex; flex-direction:column; gap:14px; }
.row-gap{ display:flex; gap:14px; }
.ch-btns{ display:flex; gap:14px; }
.ch-btn{ flex:1; padding:16px; border-radius:9px; cursor:pointer; font-weight:700; font-size:15px; letter-spacing:1px; display:flex; align-items:center; justify-content:center; gap:8px; border:2px solid rgba(168,85,247,0.22); background:rgba(8,4,16,0.5); color:var(--dim); }
.ch-btn.on-yt{ border-color:#ff3b3b; background:rgba(255,59,59,0.13); color:#fff; }
.ch-btn.on-tw{ border-color:#9146ff; background:rgba(145,70,255,0.13); color:#fff; }
.save-btn{ background:linear-gradient(135deg,#9333ea,#7c22cc); border:none; color:#fff; font-weight:700; font-size:15px; letter-spacing:1px; padding:13px; border-radius:8px; cursor:pointer; }
.toggle-btn{ padding:13px 22px; border-radius:8px; cursor:pointer; font-weight:700; font-size:14px; letter-spacing:1px; border:none; color:#fff; }
.toggle-btn.on{ background:linear-gradient(135deg,#16a34a,#15803d); }
.toggle-btn.off{ background:linear-gradient(135deg,#52525b,#3f3f46); }
.item-row{ display:flex; align-items:center; gap:12px; padding:8px 12px; border:1px solid var(--border-soft); border-radius:8px; background:var(--panel2); }
.item-row .it-name{ font-weight:700; font-size:14px; color:#ece4fa; }
.item-row .it-meta{ font-size:12px; color:var(--dim2); }
.item-row img{ width:48px; height:40px; object-fit:cover; border-radius:5px; }
.del-btn{ background:rgba(180,30,40,0.18); border:1px solid rgba(239,68,68,0.4); color:#ff8080; font-weight:700; font-size:12px; padding:7px 12px; border-radius:6px; cursor:pointer; }

/* ===== Banners ===== */
.banners-strip{ position:relative; display:flex; gap:16px; padding:24px 32px 0; overflow-x:auto; scrollbar-width:none; }
.banners-strip::-webkit-scrollbar{ display:none; }
.banner-card{ position:relative; flex:0 0 320px; height:140px; border-radius:12px; overflow:hidden; border:1px solid var(--border); display:flex; align-items:flex-end; text-decoration:none; color:inherit; cursor:pointer; background:var(--panel); }
.banner-card .banner-bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.banner-overlay{ position:absolute; inset:0; background:linear-gradient(to top, rgba(6,4,16,0.88) 40%, rgba(6,4,16,0.25) 100%); }
.banner-body{ position:relative; z-index:1; padding:14px 16px; width:100%; }
.banner-title{ font-family:'Anton',sans-serif; font-size:17px; letter-spacing:1px; color:#fff; line-height:1.2; }
.banner-sub{ font-size:12px; color:var(--dim); margin-top:3px; }
.banner-cta{ display:inline-block; margin-top:7px; font-size:11px; font-weight:700; letter-spacing:1px; color:var(--purple-lt); }
.ch-tab{ padding:9px 16px; border-radius:7px; cursor:pointer; font-weight:700; font-size:13px; border:1.5px solid rgba(168,85,247,0.22); background:rgba(8,4,16,0.5); color:var(--dim); }
.ch-tab.on-yt{ border-color:#ff3b3b; background:rgba(255,59,59,0.13); color:#fff; }
.ch-tab.on-tw{ border-color:#9146ff; background:rgba(145,70,255,0.13); color:#fff; }
.gal-admin{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.gal-admin .g{ position:relative; aspect-ratio:1/1; border-radius:8px; overflow:hidden; border:1px solid rgba(168,85,247,0.2); }
.gal-admin .g img{ width:100%; height:100%; object-fit:cover; }
.gal-admin .x{ position:absolute; top:6px; right:6px; width:26px; height:26px; background:rgba(180,30,40,0.85); border:none; color:#fff; font-weight:700; border-radius:6px; cursor:pointer; }
.muted{ font-size:14px; color:#6b5d8a; }

/* tiers (comunidade) */
.tiers{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-bottom:40px; }
.tier{ border:1px solid var(--border); border-radius:12px; background:var(--panel); padding:28px; }
.tier.feat{ border:2px solid var(--purple); background:linear-gradient(180deg,rgba(76,29,149,0.4),rgba(13,8,24,0.8)); position:relative; box-shadow:0 0 36px rgba(147,51,234,0.35); }
.tier h3{ font-family:'Anton',sans-serif; font-size:22px; color:#cdbcec; }
.tier .pr{ font-family:'Anton',sans-serif; font-size:40px; color:#f3ecff; margin:8px 0; }
.tier .pr small{ font-size:15px; color:var(--dim2); font-family:'Rajdhani'; }
.tier ul{ list-style:none; display:flex; flex-direction:column; gap:11px; font-size:15px; color:#c2b5dc; margin:18px 0 24px; }
.tier .pill{ position:absolute; top:-12px; left:50%; transform:translateX(-50%); background:linear-gradient(135deg,#9333ea,#7c22cc); color:#fff; font-size:11px; font-weight:700; letter-spacing:1.5px; padding:5px 14px; border-radius:20px; }
.tier .cta{ display:block; text-align:center; font-weight:700; letter-spacing:1px; padding:13px; border-radius:7px; }
.cta-ghost{ border:1px solid rgba(168,85,247,0.4); color:#d9c4ff; }
.cta-fill{ background:linear-gradient(135deg,#9333ea,#7c22cc); color:#fff; box-shadow:0 0 22px rgba(147,51,234,.5); }
