/* ══ GothLand v11 — Design moderne sombre ═══════════════════════════════════ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#080610;--surface:rgba(14,8,28,.92);--card:rgba(11,6,22,.95);
  --purple:#8b5cf6;--violet:#4c1d95;--deep:#1e0a3c;
  --magenta:#d946ef;--pink:#ec4899;--rose:#be185d;
  --cyan:#06b6d4;--green:#10b981;--red:#ef4444;--orange:#f59e0b;
  --gold:#fbbf24;
  --text:#f1e8ff;--sub:#b8a4d4;--muted:#7c6a9a;--faint:#2e1a4a;
  --border:rgba(139,92,246,.2);--border2:rgba(139,92,246,.08);
  --glow:0 0 32px rgba(139,92,246,.25);
  --glow-mg:0 0 20px rgba(217,70,239,.3);
  --r:12px;--r-sm:8px;
  --font-main:'Inter',system-ui,sans-serif;
  --font-deco:'Cinzel Decorative',serif;
  --font-goth:'Cinzel',serif;
  --font-mono:'JetBrains Mono',monospace;
  --font-body:'Inter',system-ui,sans-serif;
}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
html{overflow-x:hidden;max-width:100vw}
body{background:var(--bg);color:var(--text);font-family:var(--font-main);min-height:100vh;overflow-x:hidden;max-width:100vw;-webkit-font-smoothing:antialiased;display:flex;flex-direction:column;font-size:14px;line-height:1.6}
body::before{content:'';position:fixed;inset:0;z-index:-1;background:radial-gradient(ellipse 80% 50% at 20% -10%,rgba(76,29,149,.12),transparent),radial-gradient(ellipse 60% 40% at 80% 100%,rgba(139,92,246,.06),transparent);pointer-events:none}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}

/* ── Network Bar (sister sites) ──────────────────────────────────────────── */
#network-bar{background:linear-gradient(90deg,#0e0520 0%,#130830 40%,#0e0520 100%);border-bottom:1px solid rgba(139,92,246,.18);display:none;position:relative;overflow:hidden}
#network-bar::after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(139,92,246,.35),rgba(217,70,239,.25),rgba(139,92,246,.35),transparent)}
#network-bar.show{display:block}
.network-bar-inner{max-width:1400px;margin:0 auto;height:32px;display:flex;align-items:center;gap:0;overflow-x:auto;scrollbar-width:none;padding:0 16px;-webkit-overflow-scrolling:touch}
.network-bar-inner::-webkit-scrollbar{display:none}
.net-label{font-size:8px;font-weight:700;letter-spacing:2px;color:rgba(255,255,255,.9);text-transform:uppercase;padding-right:14px;margin-right:4px;white-space:nowrap;font-family:var(--font-goth);position:relative}
.net-label::after{content:'';position:absolute;right:0;top:50%;transform:translateY(-50%);height:16px;width:1px;background:rgba(139,92,246,.4)}
.net-site{font-size:10px;font-weight:400;color:rgba(180,155,220,.5);padding:5px 13px;white-space:nowrap;transition:all .22s;cursor:pointer;text-decoration:none;letter-spacing:.8px;font-family:var(--font-goth);position:relative}
.net-site:hover{color:rgba(255,255,255,.85)}
.net-site.active{color:#e8d5ff;font-weight:600;letter-spacing:.9px}
.net-site.active::after{content:'';position:absolute;bottom:0;left:13px;right:13px;height:2px;background:linear-gradient(90deg,var(--purple),var(--magenta));border-radius:2px 2px 0 0}
.net-sep{display:inline-block;width:1px;height:12px;background:rgba(139,92,246,.2);margin:0 1px;vertical-align:middle;flex-shrink:0}
/* ── Header ──────────────────────────────────────────────────────────────── */
header{position:sticky;top:0;z-index:50;background:rgba(8,6,16,.95);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--border);padding:0 12px;width:100%;box-sizing:border-box}
.header-inner{max-width:1400px;margin:0 auto;height:56px;display:flex;align-items:center;gap:10px;min-width:0}
.site-logo{font-family:var(--font-deco);font-size:18px;font-weight:900;color:var(--text);letter-spacing:2px;white-space:nowrap;flex-shrink:0}
.site-logo span{-webkit-text-fill-color:var(--purple);background:none}
.header-search{flex:1;min-width:0;max-width:420px;position:relative}
.header-search input{width:100%;background:rgba(139,92,246,.06);border:1px solid var(--border);border-radius:24px;color:var(--text);padding:8px 12px 8px 36px;font-size:13px;outline:none;transition:all .2s;font-family:var(--font-main);font-weight:400;box-sizing:border-box;min-width:0}
.header-search::before{content:'🔍';position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:12px;pointer-events:none}
.header-search input:focus{border-color:var(--purple);background:rgba(139,92,246,.1);box-shadow:0 0 0 3px rgba(139,92,246,.1)}
.header-actions{margin-left:auto;display:flex;align-items:center;gap:6px;flex-shrink:0}
.anon-btn{background:rgba(139,92,246,.1);border:1px solid var(--border);border-radius:24px;color:var(--sub);padding:6px 12px;font-size:12px;font-weight:500;cursor:pointer;font-family:var(--font-main);display:flex;align-items:center;gap:5px;transition:all .2s;-webkit-tap-highlight-color:transparent;white-space:nowrap;flex-shrink:0}
.anon-btn:hover,.anon-btn:active{background:rgba(139,92,246,.18);border-color:var(--purple);color:var(--text)}
.admin-link{background:linear-gradient(135deg,var(--violet),var(--purple));color:#fff;padding:6px 12px;border-radius:8px;font-size:11px;font-weight:700;letter-spacing:.3px;display:none;transition:all .2s;white-space:nowrap;flex-shrink:0}
.admin-link:hover{opacity:.85;transform:translateY(-1px)}
.user-menu{position:relative;display:none}
.user-menu.show{display:flex;align-items:center;gap:6px}
.user-menu-btn{background:rgba(155,48,240,.15);border:1px solid rgba(155,48,240,.3);color:var(--text);padding:5px 12px;border-radius:8px;font-size:12px;cursor:pointer;display:flex;align-items:center;gap:6px;font-family:var(--font-main);transition:all .15s}
.user-menu-btn:hover{background:rgba(155,48,240,.25)}
#user-avatar-display{width:24px;height:24px;min-width:24px;max-width:24px;min-height:24px;max-height:24px;border-radius:50%;overflow:hidden;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0;background:rgba(139,92,246,.15)}
#user-avatar-display img{width:24px;height:24px;max-width:24px;max-height:24px;object-fit:cover;display:block;border-radius:50%}
.user-menu-btn .user-avatar-sm{width:22px;height:22px;border-radius:50%;object-fit:cover;border:1px solid var(--border)}
.user-dropdown{position:absolute;top:calc(100% + 6px);right:0;background:rgba(12,4,24,.97);border:1px solid var(--border);border-radius:10px;min-width:180px;padding:6px 0;display:none;z-index:150;box-shadow:0 10px 30px rgba(0,0,0,.5)}
.user-dropdown.open{display:block}
.user-dropdown a,.user-dropdown button{display:block;width:100%;text-align:left;padding:8px 14px;color:var(--text);font-size:12px;font-family:var(--font-main);background:none;border:none;cursor:pointer;transition:background .12s}
.user-dropdown a:hover,.user-dropdown button:hover{background:rgba(155,48,240,.1)}
.user-dropdown hr{border:none;border-top:1px solid var(--border);margin:4px 0}
.auth-btn{background:rgba(155,48,240,.18);border:1px solid rgba(155,48,240,.3);color:#c084fc;padding:5px 12px;border-radius:8px;font-size:12px;cursor:pointer;font-family:var(--font-main);transition:all .15s;white-space:nowrap}
.auth-btn:hover{background:rgba(155,48,240,.3)}
.auth-modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,.85);z-index:300;overflow-y:auto;padding:20px}
.auth-modal.open{display:flex;align-items:center;justify-content:center}
.auth-box{background:rgba(12,4,24,.98);border:1px solid var(--border);border-radius:14px;padding:28px;max-width:380px;width:100%;position:relative;box-shadow:var(--glow)}
.auth-tabs{display:flex;gap:0;margin-bottom:20px;border-bottom:1px solid var(--border)}
.auth-tab{flex:1;padding:10px;text-align:center;font-size:13px;font-family:var(--font-main);color:var(--muted);cursor:pointer;border-bottom:2px solid transparent;transition:all .15s}
.auth-tab.active{color:var(--magenta);border-bottom-color:var(--magenta)}
.auth-box input{width:100%;padding:10px 12px;background:rgba(255,255,255,.04);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:13px;margin-bottom:10px;font-family:var(--font-main);box-sizing:border-box}
.auth-box input:focus{border-color:var(--purple);outline:none}
.auth-box .auth-submit{width:100%;padding:10px;background:linear-gradient(135deg,var(--violet),var(--purple));color:#fff;border:none;border-radius:8px;font-size:13px;cursor:pointer;font-family:var(--font-main);font-weight:600;margin-top:4px;transition:opacity .15s}
.auth-box .auth-submit:hover{opacity:.85}
.auth-box .auth-error{color:#f87171;font-size:11px;margin-bottom:8px;display:none}
.fav-btn{background:none;border:none;cursor:pointer;font-size:16px;opacity:.5;transition:all .15s;padding:2px}
.fav-btn:hover,.fav-btn.active{opacity:1;transform:scale(1.15)}
.fav-btn.active{color:#f43f5e}
.admin-link.show{display:block}
@media(max-width:520px){
  .header-inner{gap:6px}
  .site-logo{font-size:15px;letter-spacing:1px}
  .header-search{max-width:none;min-width:0}
  .header-search input{padding:7px 10px 7px 32px;font-size:12px}
  .anon-btn .btn-label{display:none}
  .anon-btn{padding:6px 8px;font-size:11px}
  .admin-link{padding:6px 8px;font-size:10px}
  .auth-btn{padding:5px 8px;font-size:11px}
  .user-menu-btn{padding:4px 8px;font-size:11px}
  #user-name-display{display:none}
  .lang-switch{display:none}
  .header-actions{gap:4px}
}
@media(max-width:420px){
  .header-inner{gap:5px}
  .site-logo{font-size:14px;letter-spacing:.5px}
  .header-actions{gap:3px}
  #anon-toggle-btn{display:none}
  .admin-link{padding:5px 7px;font-size:9px}
  .auth-btn{padding:4px 8px;font-size:10px}
}

/* ── Section tabs ─────────────────────────────────────────────────────────── */
.section-tabs{background:rgba(8,6,16,.96);backdrop-filter:blur(12px);border-bottom:1px solid var(--border2);position:sticky;top:56px;z-index:40;overflow-x:auto;scrollbar-width:none;width:100%;box-sizing:border-box;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory}
.section-tabs::-webkit-scrollbar{display:none}
.section-tabs-inner{max-width:1400px;margin:0 auto;padding:0 16px;display:flex;gap:0}
.s-tab{padding:11px 14px;cursor:pointer;font-size:12px;font-weight:600;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-1px;transition:all .2s;white-space:nowrap;user-select:none;font-family:var(--font-main);-webkit-tap-highlight-color:transparent;touch-action:manipulation;letter-spacing:.1px;scroll-snap-align:start;flex-shrink:0}
.s-tab:hover{color:var(--sub)}
.s-tab.active{color:var(--magenta);border-bottom-color:var(--magenta)}

/* ── Cat pills ─────────────────────────────────────────────────────────────── */
.cat-bar{padding:10px 16px;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--border2);background:rgba(8,6,16,.6);-webkit-overflow-scrolling:touch;width:100%;box-sizing:border-box}
.cat-bar::-webkit-scrollbar{display:none}
.cat-bar-inner{max-width:1400px;margin:0 auto;display:flex;gap:6px;flex-wrap:nowrap}
.cat-pill{padding:5px 14px;border-radius:20px;border:1px solid var(--border);background:transparent;color:var(--muted);font-size:11px;font-weight:500;cursor:pointer;font-family:var(--font-main);transition:all .2s;white-space:nowrap;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.cat-pill:hover,.cat-pill:active{border-color:var(--purple);color:var(--text)}
.cat-pill.active{background:var(--purple);border-color:var(--purple);color:#fff;box-shadow:0 0 14px rgba(139,92,246,.4)}
.cat-pill-sep{width:1px;align-self:stretch;margin:2px 6px;background:var(--border);flex:none}
.cat-pill-tag{color:var(--muted);opacity:.85;font-style:italic}
.cat-pill-tag:hover{opacity:1;border-color:var(--cyan,#00e5ff);color:var(--cyan,#00e5ff)}
.cat-pill-tag.active{background:var(--cyan,#00e5ff);border-color:var(--cyan,#00e5ff);color:#04121a;font-style:normal;box-shadow:0 0 14px rgba(0,229,255,.4)}

/* ── Main layout ─────────────────────────────────────────────────────────── */
.main-wrapper{max-width:1400px;margin:0 auto;padding:16px;display:grid;grid-template-columns:1fr 272px;gap:16px;flex:1;align-items:start;box-sizing:border-box;width:100%}
@media(max-width:1100px){.main-wrapper{grid-template-columns:1fr}}
@media(max-width:600px){.main-wrapper{padding:10px}}

/* ── Video grid ──────────────────────────────────────────────────────────── */
.video-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;width:100%}
@media(max-width:700px){.video-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}}
@media(max-width:380px){.video-grid{grid-template-columns:repeat(2,1fr);gap:6px}}

/* ── Video card ──────────────────────────────────────────────────────────── */
.video-card{background:var(--card);border:1px solid var(--border2);border-radius:var(--r);overflow:hidden;cursor:pointer;transition:all .22s cubic-bezier(.4,0,.2,1);position:relative;-webkit-tap-highlight-color:transparent}
.video-card:hover,.video-card:active{transform:translateY(-4px);box-shadow:0 12px 40px rgba(139,92,246,.18),0 0 0 1px rgba(139,92,246,.15)}
.card-thumb{aspect-ratio:16/9;background:linear-gradient(135deg,#0d0820,#180530);position:relative;overflow:hidden}
.card-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .3s cubic-bezier(.4,0,.2,1);display:block}
.video-card:hover .card-thumb img{transform:scale(1.05)}
.card-thumb .no-thumb{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:rgba(139,92,246,.2)}
.card-thumb .no-thumb svg{width:36px;height:36px;opacity:.3}
.card-thumb .no-thumb span{font-size:9px;font-weight:500;letter-spacing:.5px;color:rgba(139,92,246,.25);font-family:var(--font-main);text-transform:uppercase}
.card-dur{position:absolute;bottom:6px;right:7px;background:rgba(0,0,0,.82);color:#e8e0f8;font-size:10px;padding:2px 7px;border-radius:4px;font-family:var(--font-mono);font-weight:500;letter-spacing:.4px;backdrop-filter:blur(4px)}
.card-badges{position:absolute;top:7px;left:7px;display:flex;gap:4px;flex-wrap:wrap}
.badge{padding:2px 7px;border-radius:5px;font-size:9px;font-weight:700;letter-spacing:.4px;font-family:var(--font-main)}
.b-hot{background:rgba(239,68,68,.18);color:#fca5a5;border:1px solid rgba(239,68,68,.3)}
.b-new{background:rgba(139,92,246,.2);color:#c4b5fd;border:1px solid rgba(139,92,246,.35)}
.b-feat{background:rgba(251,191,36,.12);color:#fcd34d;border:1px solid rgba(251,191,36,.25)}
.card-body{padding:11px 12px 7px}
.card-title{font-family:var(--font-main);font-size:13px;font-weight:600;line-height:1.45;color:var(--text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:7px;letter-spacing:.05px}
.card-meta{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:6px}
.card-views{font-size:11px;color:var(--muted);font-weight:500}
.card-cat{font-size:10px;color:var(--purple);padding:2px 8px;background:rgba(139,92,246,.1);border-radius:20px;font-weight:600;border:1px solid rgba(139,92,246,.2)}
.card-author{font-size:10px;color:var(--muted);display:flex;align-items:center;gap:5px;padding:0 12px 8px;font-weight:400;border-top:1px solid var(--border2);padding-top:6px;margin-top:2px}
.card-author-dot{width:14px;height:14px;border-radius:50%;background:linear-gradient(135deg,var(--violet),var(--purple));display:flex;align-items:center;justify-content:center;font-size:7px;flex-shrink:0;color:#fff}
.card-reactions{display:flex;gap:5px;padding:6px 10px 9px;border-top:1px solid var(--border2)}
.react-btn{background:none;border:1px solid var(--border2);border-radius:6px;color:var(--muted);padding:4px 9px;font-size:11px;font-weight:500;cursor:pointer;display:flex;align-items:center;gap:3px;transition:all .18s;font-family:var(--font-main);-webkit-tap-highlight-color:transparent;touch-action:manipulation;min-width:44px;justify-content:center}
.react-btn:hover,.react-btn:active{border-color:var(--purple);color:var(--text);background:rgba(139,92,246,.07)}
.react-btn.liked{border-color:var(--green);color:var(--green);background:rgba(16,185,129,.08)}
.react-btn.disliked{border-color:var(--red);color:var(--red);background:rgba(239,68,68,.07)}
.react-btn.hotted{border-color:var(--orange);color:var(--orange);background:rgba(245,158,11,.07)}

/* ── Sidebar ─────────────────────────────────────────────────────────────── */
.sidebar{display:flex;flex-direction:column;gap:14px;position:sticky;top:20px}
@media(max-width:1100px){.sidebar{display:none}}
.sidebar-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:16px}
.sidebar-card h3{font-family:var(--font-main);font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:1px;margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid var(--border2)}
#age-gate{display:none}
.top-vid{display:flex;gap:9px;margin-bottom:9px;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:opacity .15s}
.top-vid:hover{opacity:.8}
.top-vid-thumb{width:58px;height:34px;border-radius:5px;object-fit:cover;flex-shrink:0;background:linear-gradient(135deg,#0d0820,#180530);border:1px solid var(--border2)}
.top-vid-title{font-size:12px;font-weight:500;line-height:1.4;color:var(--text);font-family:var(--font-main);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.top-vid-views{font-size:10px;color:var(--muted);margin-top:2px}
.tag-cloud{display:flex;flex-wrap:wrap;gap:5px}
.tag-chip{padding:4px 10px;border-radius:20px;font-size:11px;font-weight:500;background:rgba(139,92,246,.07);color:var(--sub);border:1px solid rgba(139,92,246,.15);cursor:pointer;font-family:var(--font-main);transition:all .18s;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.tag-chip:hover,.tag-chip:active{background:rgba(139,92,246,.16);border-color:var(--purple);color:var(--text)}
.tag-chip.active{background:var(--purple);color:#fff;border-color:var(--purple)}
.ad-slot{border:1px dashed rgba(139,92,246,.18);border-radius:8px;min-height:60px;display:flex;align-items:center;justify-content:center;color:rgba(139,92,246,.2);font-size:9px;font-family:var(--font-main);letter-spacing:1px;padding:8px}

/* ── Empty / loading states ──────────────────────────────────────────────── */
.loading-state,.empty-state{grid-column:1/-1;text-align:center;padding:48px 16px;color:var(--muted)}
/* Fix: sidebar stays aligned even when grid is empty */
.main-wrapper>div:first-child{min-height:160px}
.video-grid:has(.empty-state){min-height:200px}
/* Fix sidebar quand grille vide : la div parente doit garder sa hauteur */
.main-wrapper>div:first-child{min-height:160px}
.loading-state{font-family:var(--font-main);letter-spacing:.5px;font-size:13px;font-weight:500}
.loading-state::after{content:'';display:block;margin:16px auto 0;width:28px;height:28px;border:2px solid var(--border);border-top-color:var(--purple);border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.empty-state{font-family:var(--font-main);color:var(--muted)}
#sentinel{height:40px;grid-column:1/-1}

/* ── Anon panel ──────────────────────────────────────────────────────────── */
.anon-panel{position:fixed;top:64px;right:12px;z-index:200;background:rgba(8,5,18,.99);border:1px solid var(--border);border-radius:var(--r);padding:16px;min-width:240px;max-width:calc(100vw - 24px);box-shadow:0 12px 40px rgba(0,0,0,.5),var(--glow);display:none;font-family:var(--font-main);backdrop-filter:blur(16px);box-sizing:border-box}
@media(max-width:480px){.anon-panel{left:12px;right:12px;min-width:0;width:auto}}
.anon-panel.open{display:block}
.anon-panel h3{font-family:var(--font-main);font-size:11px;font-weight:700;color:var(--purple);margin-bottom:10px;letter-spacing:.3px}
.anon-panel input{width:100%;background:rgba(139,92,246,.05);border:1px solid var(--border);border-radius:8px;color:var(--text);padding:8px 11px;font-size:13px;outline:none;margin-bottom:8px;font-family:var(--font-main);transition:border .18s}.anon-panel input:focus{border-color:var(--purple);outline:none}
.anon-token-display{font-size:9px;color:var(--muted);font-family:monospace;word-break:break-all;padding:4px 8px;background:rgba(0,0,0,.4);border-radius:4px;margin-bottom:8px;user-select:all;cursor:text}
.anon-panel .close-x{float:right;cursor:pointer;color:var(--muted);font-size:18px;line-height:1;-webkit-tap-highlight-color:transparent}
.btn-sm{padding:6px 14px;border-radius:7px;border:none;cursor:pointer;font-size:11px;font-weight:600;font-family:var(--font-main);transition:all .18s}
.btn-purple{background:var(--purple);color:#fff}
.btn-ghost{background:transparent;border:1px solid var(--border);color:var(--muted)}
.btn-ghost:hover{color:var(--text);border-color:var(--purple)}

/* ── Footer ──────────────────────────────────────────────────────────────── */
footer{margin-top:auto;border-top:1px solid var(--border);background:rgba(6,4,14,.98)}
.footer-inner{max-width:1400px;margin:0 auto;padding:24px 16px 16px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px}
@media(max-width:700px){.footer-inner{grid-template-columns:1fr 1fr}}
@media(max-width:440px){.footer-inner{grid-template-columns:1fr}}
.footer-col h4{font-family:var(--font-main);font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:1px;margin-bottom:12px;padding-bottom:7px;border-bottom:1px solid var(--border2)}
.footer-col a{display:block;color:var(--muted);font-size:13px;margin-bottom:6px;transition:color .15s;font-family:var(--font-main);font-weight:400}
.footer-col a:hover{color:var(--text)}
.footer-social{display:flex;gap:8px;margin-top:6px}
@keyframes pulse-tg{0%,100%{box-shadow:0 0 0 0 rgba(0,136,204,.4)}50%{box-shadow:0 0 0 6px rgba(0,136,204,0)}}
@keyframes pulse-sg{0%,100%{box-shadow:0 0 0 0 rgba(16,185,129,.35)}50%{box-shadow:0 0 0 6px rgba(16,185,129,0)}}
.social-btn{display:flex;align-items:center;gap:7px;padding:9px 16px;border-radius:20px;font-size:12px;font-weight:600;cursor:pointer;text-decoration:none;transition:all .25s cubic-bezier(.4,0,.2,1);font-family:var(--font-main);position:relative;overflow:hidden}
.social-btn::before{content:'';position:absolute;inset:0;opacity:0;transition:opacity .25s}
.social-btn:hover::before{opacity:1}
.social-btn svg{transition:transform .25s cubic-bezier(.4,0,.2,1);flex-shrink:0}
.social-btn:hover svg{transform:scale(1.2) rotate(-5deg)}
.social-btn:hover{transform:translateY(-2px)}
.telegram-btn{background:rgba(0,136,204,.1);border:1px solid rgba(0,136,204,.25);color:#38bdf8}
.telegram-btn::before{background:rgba(0,136,204,.08)}
.telegram-btn:hover{background:rgba(0,136,204,.22);border-color:rgba(0,136,204,.5);color:#7dd3fc;box-shadow:0 6px 20px rgba(0,136,204,.25);animation:pulse-tg .8s ease-out}
.discord-btn{background:rgba(88,101,242,.1);border:1px solid rgba(88,101,242,.25);color:#7289da}
.discord-btn::before{background:rgba(88,101,242,.08)}
.discord-btn:hover{background:rgba(88,101,242,.22);border-color:rgba(88,101,242,.5);color:#99aaf5;box-shadow:0 6px 20px rgba(88,101,242,.25);animation:pulse-dc .8s ease-out}
.footer-bottom{border-top:1px solid var(--border2);padding:14px 16px;text-align:center;font-size:11px;color:var(--muted);font-family:var(--font-main);letter-spacing:.2px}
.footer-bottom span{color:var(--magenta)}

/* ── Toast ───────────────────────────────────────────────────────────────── */
#toast{position:fixed;bottom:20px;right:20px;z-index:999;padding:10px 16px;border-radius:10px;font-size:12px;font-weight:600;background:rgba(8,5,18,.98);border:1px solid var(--purple);color:var(--text);opacity:0;transform:translateY(10px);transition:all .2s cubic-bezier(.4,0,.2,1);pointer-events:none;font-family:var(--font-main);max-width:300px;backdrop-filter:blur(12px);box-shadow:0 8px 32px rgba(0,0,0,.4)}
#toast.show{opacity:1;transform:none}
#toast.success{border-color:var(--green);color:var(--green)}
#toast.error{border-color:var(--red);color:var(--red)}
#toast.warn{border-color:var(--orange);color:var(--orange)}
/* ── Upload Modal ─────────────────────────────────────────────────────────── */
#upload-modal{display:none;position:fixed;inset:0;z-index:300;background:rgba(0,0,0,.85);backdrop-filter:blur(8px);overflow-y:auto;overflow-x:hidden;padding:12px}
#upload-modal.open{display:flex;align-items:flex-start;justify-content:center}
.upload-box{background:rgba(10,6,22,.99);border:1px solid var(--border);border-radius:14px;padding:20px;width:100%;max-width:540px;margin:auto;position:relative;box-shadow:0 24px 60px rgba(0,0,0,.5),var(--glow);box-sizing:border-box}
.upload-box h2{font-family:var(--font-deco);font-size:20px;font-weight:700;color:var(--text);text-align:center;margin-bottom:6px;letter-spacing:.5px}
.upload-box p.sub{text-align:center;color:var(--muted);font-size:13px;margin-bottom:20px;line-height:1.65;font-family:var(--font-main)}
.upload-drop{border:2px dashed rgba(139,92,246,.25);border-radius:12px;padding:28px;text-align:center;cursor:pointer;transition:all .2s;margin-bottom:12px;position:relative;background:rgba(139,92,246,.03)}
.upload-drop.drag-over{border-color:var(--purple);background:rgba(139,92,246,.1)}
.upload-drop:hover{border-color:rgba(139,92,246,.4);background:rgba(139,92,246,.05)}
.upload-drop input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.upload-drop .drop-icon{font-size:32px;margin-bottom:8px;display:block}
.upload-drop .drop-lbl{color:var(--muted);font-size:13px;font-family:var(--font-main)}
.upload-drop .drop-lbl strong{color:var(--text)}
.upload-field{margin-bottom:12px}
.upload-field label{display:block;font-size:10px;font-weight:700;color:var(--muted);font-family:var(--font-main);letter-spacing:.8px;margin-bottom:5px;text-transform:uppercase}
.upload-field input,.upload-field textarea{width:100%;background:rgba(139,92,246,.05);border:1px solid var(--border);border-radius:8px;color:var(--text);padding:9px 12px;font-size:13px;font-family:var(--font-main);outline:none;transition:all .2s}
.upload-field input:focus,.upload-field textarea:focus{border-color:var(--purple);background:rgba(139,92,246,.08);box-shadow:0 0 0 3px rgba(139,92,246,.1)}
.upload-field textarea{resize:vertical;min-height:70px}
.upload-field div{font-size:10px;color:var(--muted);margin-top:3px;font-family:var(--font-main)}
/* Tag chips for user upload */
.upload-tags-wrap{border:1px solid var(--border);border-radius:8px;padding:6px 8px;background:rgba(139,92,246,.05);display:flex;flex-wrap:wrap;gap:5px;min-height:38px;cursor:text;transition:border .2s}
.upload-tags-wrap:focus-within{border-color:var(--purple);box-shadow:0 0 0 3px rgba(139,92,246,.1)}
.upload-tags-wrap input{border:none!important;background:none!important;padding:2px 4px!important;min-width:80px;flex:1;box-shadow:none!important;font-size:13px!important;color:var(--text)!important;outline:none!important}
.upload-tags-wrap input::placeholder{color:var(--muted);font-size:12px}
.upload-tag-chip{display:flex;align-items:center;gap:3px;padding:2px 8px;border-radius:14px;background:rgba(139,92,246,.2);border:1px solid rgba(139,92,246,.35);color:var(--text);font-size:11px;font-family:var(--font-main);white-space:nowrap;animation:fadeIn .15s ease}
.upload-tag-chip .tag-rm{cursor:pointer;color:var(--muted);font-size:14px;line-height:1;margin-left:2px;transition:color .15s}
.upload-tag-chip .tag-rm:hover{color:#f87171}
.upload-progress{background:rgba(139,92,246,.1);border-radius:6px;height:5px;margin:12px 0;overflow:hidden;display:none}
.upload-progress-bar{height:100%;background:linear-gradient(90deg,var(--purple),var(--magenta));width:0%;transition:width .3s;border-radius:6px}
.upload-btn{width:100%;background:linear-gradient(135deg,var(--violet),var(--purple));color:#fff;border:none;border-radius:10px;padding:12px;font-size:14px;font-weight:700;cursor:pointer;font-family:var(--font-main);letter-spacing:.2px;transition:all .2s;-webkit-tap-highlight-color:transparent;margin-top:4px}
.upload-btn:hover{background:linear-gradient(135deg,var(--purple),var(--magenta));box-shadow:0 4px 20px rgba(139,92,246,.4);transform:translateY(-1px)}
.upload-btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.upload-my-list{margin-top:16px;border-top:1px solid var(--border2);padding-top:14px}
.upload-my-list h4{font-size:10px;font-weight:700;color:var(--muted);font-family:var(--font-main);text-transform:uppercase;letter-spacing:.8px;margin-bottom:8px}
.upl-item{display:flex;align-items:center;gap:8px;padding:8px 10px;background:rgba(139,92,246,.05);border:1px solid var(--border2);border-radius:8px;margin-bottom:6px;font-size:12px;font-family:var(--font-main)}
.upl-status{padding:2px 8px;border-radius:20px;font-size:10px;font-weight:700}
.upl-status.pending{background:rgba(245,158,11,.15);color:var(--orange);border:1px solid rgba(245,158,11,.25)}
.upl-status.approved{background:rgba(16,185,129,.12);color:var(--green);border:1px solid rgba(16,185,129,.25)}
.upl-status.rejected{background:rgba(239,68,68,.12);color:var(--red);border:1px solid rgba(239,68,68,.25)}
@media(max-width:480px){#toast{left:12px;right:12px;max-width:none}}
/* ── Mobile overrides ─────────────────────────────────────────────────────── */
@media(max-width:768px){
  .card-title{font-size:12px;-webkit-line-clamp:2;margin-bottom:4px}
  .card-meta{font-size:10px}
  .card-body{padding:8px 8px 4px}
  .react-btn{min-width:36px;padding:3px 6px;font-size:10px}
  #upload-modal{padding:8px}
  .upload-box{border-radius:10px;padding:16px}
  .footer-inner{grid-template-columns:1fr 1fr}
  .section-tabs{top:56px}
  .card-author{font-size:9px;padding:0 8px 6px;padding-top:5px}
  .card-reactions{padding:4px 8px 6px}
}
@media(max-width:480px){
  .footer-inner{grid-template-columns:1fr}
  .main-wrapper{padding:6px}
  .video-grid{grid-template-columns:repeat(2,1fr);gap:6px}
  .card-author{font-size:9px}
  .card-dur{font-size:9px;padding:1px 5px}
  .card-title{font-size:11px;line-height:1.35;margin-bottom:3px}
  .card-body{padding:6px 6px 3px}
  .card-meta{gap:4px;margin-bottom:4px}
  .card-cat{font-size:9px;padding:1px 6px}
  .card-views{font-size:10px}
  .react-btn{min-width:30px;padding:2px 5px;font-size:9px;gap:2px;border-radius:4px}
  .card-reactions{gap:3px;padding:3px 6px 5px}
  .card-author-dot{width:12px;height:12px;font-size:6px}
  .badge{font-size:8px;padding:1px 5px}
  .s-tab{padding:9px 10px;font-size:11px}
  .cat-pill{padding:4px 10px;font-size:10px}
  .section-tabs-inner{padding:0 8px}
  .cat-bar{padding:8px 8px}
}

/* ── Lang Switcher ─────────────────────────────────────────────────────── */
.lang-switch{display:flex;gap:2px;align-items:center;background:rgba(139,92,246,.08);border:1px solid var(--border);border-radius:6px;padding:2px;margin-left:4px}
.lang-opt{padding:3px 7px;border-radius:4px;font-size:10px;font-weight:600;cursor:pointer;color:var(--muted);transition:all .15s;letter-spacing:.5px;font-family:var(--font-main);-webkit-tap-highlight-color:transparent}
.lang-opt:hover{color:var(--text)}
.lang-opt.active{background:var(--purple);color:#fff}
@media(max-width:768px){.lang-switch{display:none!important}}