/* ============================================================
   SI9NAL — App-level overrides & missing styles
   Bridges the gap between component CSS and actual HTML/JS classes
   ============================================================ */

/* ===== LAYOUT ===== */
.container { max-width:1400px; margin:0 auto; padding:0 32px; }

/* ===== TICKER ===== */
.ticker {
  background:var(--accent); color:#fff;
  padding:10px 0; overflow:hidden; position:relative; z-index:100;
  font-family:'Space Mono',monospace; font-size:12px; letter-spacing:.5px;
}
.ticker-track {
  display:flex; white-space:nowrap;
  animation:ticker-scroll 45s linear infinite;
}
.ticker-track:hover { animation-play-state:paused; }
.ticker-item { padding:0 40px; display:flex; align-items:center; gap:10px; }
.ticker-item::before { content:'●'; font-size:6px; opacity:.6; }
.ticker-live {
  background:#fff; color:var(--accent); padding:2px 8px;
  font-weight:700; font-size:10px; border-radius:2px;
  animation:ticker-pulse 1.5s ease-in-out infinite;
}
@keyframes ticker-scroll { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
@keyframes ticker-pulse { 0%,100%{opacity:1} 50%{opacity:.5} }

/* ===== HEADER ===== */
.header {
  position:sticky; top:0; z-index:90;
  background:var(--glass); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
  border-bottom:1px solid var(--border);
  transition:background var(--transition);
}
.header__inner {
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 32px; max-width:1400px; margin:0 auto;
}
.header__left { display:flex; align-items:center; gap:16px; }
.header__tagline {
  font-family:'Space Mono',monospace; font-size:11px;
  color:var(--text3); letter-spacing:.5px; text-transform:uppercase;
  white-space:nowrap; border-left:1px solid var(--border); padding-left:16px;
}
.header__right { display:flex; align-items:center; gap:12px; }
.header__welcome {
  font-size:13px; color:var(--text2);
  font-family:'Space Mono',monospace;
}

/* Logo */
.logo {
  font-family:'Instrument Serif',serif; font-size:38px;
  letter-spacing:-1px; color:var(--text);
  text-decoration:none; display:flex; align-items:baseline;
}
.logo__dot { color:var(--accent); font-size:44px; line-height:0; }

/* Search */
.search-box {
  display:flex; align-items:center; gap:10px;
  background:var(--bg2); border:1px solid var(--border);
  border-radius:40px; padding:10px 18px;
  transition:all var(--transition); width:220px;
}
.search-box:focus-within {
  border-color:var(--accent); width:280px;
  box-shadow:0 0 0 3px var(--accent-glow);
}
.search-box__icon { color:var(--text3); flex-shrink:0; font-size:13px; position:static !important; transform:none !important; top:auto !important; left:auto !important; }
.search-box__input {
  background:none; border:none; outline:none;
  color:var(--text); font-size:12px; width:100%;
  font-family:'DM Sans',sans-serif;
  padding:0 !important; line-height:1.2;
}
.search-box__input::placeholder { color:var(--text3); }

/* Mobile menu button */
.mobile-menu-btn {
  display:none; flex-direction:column; gap:5px;
  background:none; border:none; cursor:pointer; padding:6px;
}
.mobile-menu-btn span {
  display:block; width:22px; height:2px; background:var(--text);
  transition:all .3s ease;
}
.mobile-nav { display:none; }

/* ===== BUTTONS ===== */
.btn {
  display:inline-flex; align-items:center; gap:8px;
  font-family:'Space Mono',monospace; font-size:12px;
  letter-spacing:.5px; text-transform:uppercase;
  border:1px solid var(--border); border-radius:4px;
  padding:10px 20px; cursor:pointer;
  background:transparent; color:var(--text);
  transition:all var(--transition); white-space:nowrap;
  text-decoration:none;
}
.btn:hover { border-color:var(--text2); }
.btn--primary {
  background:var(--accent); border-color:var(--accent); color:#fff;
}
.btn--primary:hover { background:var(--accent2); border-color:var(--accent2); }
.btn--accent {
  background:var(--accent); border-color:var(--accent); color:#fff;
  padding:12px 24px; font-size:12px; font-weight:700;
}
.btn--accent:hover { background:var(--accent2); border-color:var(--accent2); transform:translateY(-1px); }
.btn--secondary { background:var(--bg2); }
.btn--ghost { border-color:transparent; }
.btn--ghost:hover { background:var(--bg2); }
.btn--outline { border-color:var(--border2); }
.btn--sm { padding:6px 14px; font-size:11px; }
.btn--icon {
  width:40px; height:40px; padding:0; border-radius:50%;
  display:grid; place-items:center; font-size:16px;
}
.btn--icon:hover { background:var(--bg3); border-color:var(--accent); color:var(--accent); }
.btn--block { display:flex; width:100%; justify-content:center; }
.btn-label { }

/* ===== DATE BAR ===== */
.date-bar {
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 0; border-bottom:1px solid var(--border);
}
.date-bar__date {
  font-family:'Space Mono',monospace; font-size:11px;
  color:var(--text3); letter-spacing:1.5px; text-transform:uppercase;
}
.date-bar__edition {
  font-family:'Space Mono',monospace; font-size:10px;
  color:var(--accent); letter-spacing:2px; text-transform:uppercase;
  background:var(--tag-bg); padding:4px 12px; border-radius:2px;
}

/* ===== MISSION BAR ===== */
.mission-bar {
  padding:20px 0; text-align:center;
  border-bottom:1px solid var(--border);
  background:var(--accent-glow);
}
.mission-bar__text {
  font-family:'Instrument Serif',serif; font-size:16px;
  color:var(--text2); letter-spacing:.3px; font-style:italic;
}
.mission-bar__text strong { color:var(--accent); font-style:normal; }

/* ===== TAB NAVIGATION ===== */
.tab-nav {
  background:var(--bg2);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  overflow-x:auto; scrollbar-width:none;
}
.tab-nav::-webkit-scrollbar { display:none; }
.tab-nav__inner {
  display:flex; gap:4px; padding:12px 32px;
}
.tab-btn {
  font-family:'Space Mono',monospace; font-size:11px;
  letter-spacing:.5px; text-transform:uppercase;
  padding:10px 20px; border-radius:4px;
  border:1px solid transparent; background:transparent;
  color:var(--text3); cursor:pointer; white-space:nowrap;
  transition:all var(--transition); display:flex; align-items:center; gap:6px;
}
.tab-btn:hover { color:var(--text); background:var(--bg2); }
.tab-btn--active {
  background:var(--accent); color:#fff; border-color:var(--accent);
}

/* ===== CATEGORIES ===== */
.categories {
  display:flex; gap:6px; padding:16px 0;
  overflow-x:auto; scrollbar-width:none;
}
.categories::-webkit-scrollbar { display:none; }
.cat-btn {
  font-family:'Space Mono',monospace; font-size:11px;
  letter-spacing:.5px; text-transform:uppercase;
  padding:8px 18px; border-radius:2px;
  border:1px solid var(--border); background:transparent;
  color:var(--text2); cursor:pointer; white-space:nowrap;
  transition:all var(--transition);
}
.cat-btn:hover { border-color:var(--text2); color:var(--text); }
.cat-btn--active {
  background:var(--accent); border-color:var(--accent); color:#fff;
}

/* ===== MAIN CONTENT ===== */
.main-content { padding-top:24px; padding-bottom:80px; }

/* ===== SECTION HEADER ===== */
.section-header {
  display:flex; align-items:center; gap:16px;
  margin:40px 0 24px; position:relative;
}
.section-header h2 {
  font-family:'Instrument Serif',serif; font-size:28px;
  font-weight:400; white-space:nowrap; display:flex; align-items:center; gap:10px;
}
.section-header::after {
  content:''; flex:1; height:1px;
  background:linear-gradient(90deg,var(--border),transparent);
}
.live-dot {
  display:inline-block; width:8px; height:8px;
  background:var(--accent); border-radius:50%;
  animation:ticker-pulse 1.5s ease-in-out infinite;
}

/* ===== HERO SECTION ===== */
.hero-grid {
  display:grid; grid-template-columns:1.3fr .7fr; gap:20px;
  margin-bottom:16px;
}
.hero-main {
  position:relative; border-radius:8px; overflow:hidden;
  cursor:pointer; min-height:480px;
  border:1px solid var(--border); background:var(--card);
}
.hero-main__img, .hero-card__img {
  width:100%; height:100%; object-fit:cover;
  transition:transform .6s ease;
}
.hero-main:hover .hero-main__img,
.hero-card:hover .hero-card__img { transform:scale(1.03); }
.hero-main__placeholder, .hero-card__placeholder {
  width:100%; height:100%; display:grid; place-items:center;
  font-size:60px; color:rgba(255,255,255,.3);
}
.hero-overlay {
  position:absolute; bottom:0; left:0; right:0;
  padding:36px 32px;
  background:linear-gradient(transparent,rgba(0,0,0,.85));
  display:flex; flex-direction:column; gap:8px;
}
.hero-tag {
  font-family:'Space Mono',monospace; font-size:10px;
  letter-spacing:2px; text-transform:uppercase;
}
.hero-headline {
  font-family:'Instrument Serif',serif; font-size:36px;
  line-height:1.15; color:#fff; font-weight:400;
}
.hero-meta { font-size:13px; color:rgba(255,255,255,.6); }
.hero-side { display:flex; flex-direction:column; gap:20px; }
.hero-card {
  flex:1; position:relative; border-radius:8px; overflow:hidden;
  cursor:pointer; border:1px solid var(--border); background:var(--card);
  min-height:200px;
}
.hero-card__headline {
  font-family:'Instrument Serif',serif; font-size:20px;
  line-height:1.2; color:#fff; font-weight:400;
}

/* ===== REPORT GRID ===== */
.report-grid {
  display:grid; grid-template-columns:repeat(3,1fr); gap:20px;
}
.report-grid--disputed { }

/* ===== REPORT CARD ===== */
.report-card {
  background:var(--card); border:1px solid var(--border);
  border-radius:8px; overflow:hidden; cursor:default;
  transition:all var(--transition);
  display:flex; flex-direction:column;
}
.report-card:hover {
  border-color:var(--border2);
  box-shadow:var(--shadow);
  background:var(--card-hover);
}
.report-card__media {
  width:100%; height:200px; overflow:hidden;
  position:relative;
}
.report-card__img {
  width:100%; height:100%; object-fit:cover;
  transition:transform .5s ease;
}
.report-card:hover .report-card__img { transform:scale(1.03); }
.report-card__placeholder {
  width:100%; height:100%; display:grid; place-items:center;
  opacity:.6;
}
.report-card__placeholder-icon { font-size:36px; color:rgba(255,255,255,.4); }
.report-card__status-overlay {
  position:absolute; top:12px; left:12px; z-index:2;
}
.report-card__body {
  padding:16px; flex:1; display:flex; flex-direction:column; gap:10px;
  min-width:0; overflow:hidden;
}
.report-card__tag {
  font-family:'Space Mono',monospace; font-size:10px;
  letter-spacing:1.5px; text-transform:uppercase;
  color:var(--accent); font-weight:700;
}
.report-card__headline {
  font-family:'Instrument Serif',serif; font-size:19px;
  font-weight:400; line-height:1.3;
}
.report-card__headline a {
  color:var(--text); text-decoration:none;
  transition:color var(--transition);
}
.report-card__headline a:hover { color:var(--accent); }
.report-card__summary {
  font-size:13px; line-height:1.6; color:var(--text2);
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical;
  overflow:hidden;
}
.report-card__footer {
  display:flex; align-items:center; justify-content:space-between;
  gap:8px; margin-top:auto; flex-wrap:wrap;
}
.report-card__reporter { }
.report-card__level {
  font-family:'Space Mono',monospace; font-size:11px;
  color:var(--text2); display:inline-flex; align-items:center; gap:4px;
}
.report-card__level.level--new { color:var(--text3); }
.report-card__level.level--local { color:var(--blue, #3b82f6); }
.report-card__level.level--trusted { color:var(--green, #22c55e); }
.report-card__level.level--verified { color:var(--purple, #a855f7); }
.report-card__level.level--expert { color:var(--gold, #eab308); }
.report-card__level.level--superadmin { color:#f59e0b; }
.report-card__footer-right {
  display:flex; align-items:center; gap:6px;
  font-family:'Space Mono',monospace; font-size:11px; color:var(--text3);
}
.report-card__dot { opacity:.5; }
.report-card__time { }
.report-card__signals { letter-spacing:.3px; }

/* ===== WITNESS TAG ===== */
.witness-tag {
  font-family:'Space Mono',monospace; font-size:10px;
  letter-spacing:.5px; text-transform:uppercase;
  padding:3px 10px; border-radius:3px;
  display:inline-flex; align-items:center; gap:5px;
}
.witness-tag--witness {
  background:var(--green-bg, rgba(34,197,94,.12));
  color:var(--green, #22c55e);
}
.witness-tag--summary {
  background:var(--blue-bg, rgba(59,130,246,.12));
  color:var(--blue, #3b82f6);
}

/* ===== EVIDENCE METER ===== */
.evidence-meter { display:flex; flex-direction:column; gap:4px; }
.evidence-meter__label {
  font-family:'Space Mono',monospace; font-size:10px;
  color:var(--text3); letter-spacing:.5px;
}
.evidence-meter__bar {
  width:100%; height:4px; background:var(--bg3);
  border-radius:2px; overflow:hidden;
}
.evidence-meter__fill {
  height:100%; background:var(--accent);
  border-radius:2px; transition:width .5s ease;
}

/* ===== TRUST METER ===== */
.trust-meter { display:flex; flex-direction:column; gap:4px; }
.trust-meter__bar {
  width:100%; height:6px; background:var(--bg3);
  border-radius:3px; overflow:hidden;
}
.trust-meter__fill {
  height:100%; border-radius:3px; transition:width .5s ease;
}
.trust-meter__info {
  display:flex; justify-content:space-between; align-items:center;
}
.trust-meter__score {
  font-family:'Space Mono',monospace; font-size:13px;
  font-weight:700; color:var(--text);
}
.trust-meter__stage {
  font-family:'Space Mono',monospace; font-size:10px;
  color:var(--text3); letter-spacing:.5px;
}

/* ===== BADGES (status) ===== */
.badge {
  font-family:'Space Mono',monospace; font-size:10px;
  letter-spacing:.5px; text-transform:uppercase;
  padding:4px 10px; border-radius:3px;
  display:inline-flex; align-items:center; gap:5px;
  font-weight:700;
}
.badge--breaking {
  background:var(--accent); color:#fff;
  animation:ticker-pulse 1.5s ease-in-out infinite;
}
.badge--verified {
  background:var(--green-bg, rgba(34,197,94,.12));
  color:var(--green, #22c55e);
  border:1px solid rgba(34,197,94,.2);
}
.badge--needs-ver {
  background:var(--gold-bg, rgba(234,179,8,.12));
  color:var(--gold, #eab308);
  border:1px solid rgba(234,179,8,.2);
}
.badge--disputed {
  background:var(--red-bg, rgba(239,68,68,.12));
  color:var(--red, #ef4444);
  border:1px solid rgba(239,68,68,.2);
}
.badge--false {
  background:var(--bg3); color:var(--text3);
  text-decoration:line-through;
}
.badge--unknown { background:var(--bg3); color:var(--text3); }

/* ===== SIGNAL BAR (inline voting) ===== */
.signal-bar {
  display:flex; flex-wrap:wrap; gap:6px;
  margin-top:auto; min-width:0; width:100%;
}

/* — Card mode: compact pills in footer area — */
.signal-bar--card {
  padding-top:10px; border-top:1px solid var(--border);
  gap:5px;
}
.signal-bar--card .signal-chip {
  padding:3px 7px; font-size:11px; gap:4px; border-radius:20px;
}
.signal-bar--card .signal-chip__count {
  font-size:10px;
}

/* — Detail mode: full labeled bar — */
.signal-bar--detail {
  padding:16px 0; gap:8px;
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  margin:20px 0;
}

/* ===== SIGNAL CHIP (individual vote button) ===== */
.signal-chip {
  display:inline-flex; align-items:center; gap:5px;
  font-family:'Space Mono',monospace; font-size:12px;
  padding:6px 12px; border-radius:20px;
  border:1px solid var(--border); background:transparent;
  color:var(--text3); cursor:pointer;
  transition:all .2s ease; white-space:nowrap;
}
.signal-chip:hover:not([disabled]) {
  border-color:var(--text2); color:var(--text);
  background:var(--bg2);
}
.signal-chip i { font-size:12px; }
.signal-chip__label {
  font-size:10px; letter-spacing:.3px; text-transform:uppercase;
}
.signal-chip__count {
  font-weight:700; font-size:11px;
  min-width:14px; text-align:center;
}

/* Active states by category */
.signal-chip--active.signal-chip--positive {
  background:var(--green-bg, rgba(34,197,94,.1));
  border-color:var(--green, #22c55e);
  color:var(--green, #22c55e);
}
.signal-chip--active.signal-chip--negative {
  background:var(--red-bg, rgba(239,68,68,.1));
  border-color:var(--red, #ef4444);
  color:var(--red, #ef4444);
}
.signal-chip--active.signal-chip--neutral {
  background:var(--gold-bg, rgba(234,179,8,.1));
  border-color:var(--gold, #eab308);
  color:var(--gold, #eab308);
}

/* Disabled */
.signal-chip--disabled {
  opacity:.45; cursor:not-allowed;
}
.signal-chip--disabled:hover {
  background:transparent; border-color:var(--border); color:var(--text3);
}

/* ===== REPORTER BADGE ===== */
.reporter-badge {
  display:inline-flex; align-items:center; gap:8px;
}
.reporter-badge__avatar {
  width:28px; height:28px; border-radius:50%;
  object-fit:cover;
}
.reporter-badge__avatar--initial {
  display:grid; place-items:center;
  background:var(--accent-glow); border:2px solid var(--accent);
  font-family:'Space Mono',monospace; font-size:11px; font-weight:700;
  color:var(--accent);
}
.reporter-badge__info { display:flex; flex-direction:column; }
.reporter-badge__name {
  font-size:12px; font-weight:600; color:var(--text);
  line-height:1.2; text-transform:uppercase; letter-spacing:.3px;
}
.reporter-badge__level {
  font-family:'Space Mono',monospace; font-size:9px;
  color:var(--text3); text-transform:uppercase; letter-spacing:.5px;
}
.reporter-badge__score { opacity:.6; }

/* Level colors */
.level--new .reporter-badge__level { color:var(--text3); }
.level--local .reporter-badge__level { color:var(--blue, #3b82f6); }
.level--trusted .reporter-badge__level { color:var(--green, #22c55e); }
.level--verified .reporter-badge__level { color:var(--purple, #a855f7); }
.level--expert .reporter-badge__level { color:var(--gold, #eab308); }
.level--superadmin .reporter-badge__level { color:#f59e0b; }
.level--new .reporter-badge__avatar--initial { border-color:var(--text3); color:var(--text3); background:var(--bg3); }
.level--local .reporter-badge__avatar--initial { border-color:var(--blue); color:var(--blue); background:var(--blue-bg); }
.level--trusted .reporter-badge__avatar--initial { border-color:var(--green); color:var(--green); background:var(--green-bg); }
.level--verified .reporter-badge__avatar--initial { border-color:var(--purple); color:var(--purple); background:var(--purple-bg); }
.level--expert .reporter-badge__avatar--initial { border-color:var(--gold); color:var(--gold); background:var(--gold-bg); }
.level--superadmin .reporter-badge__avatar--initial { border-color:#f59e0b; color:#f59e0b; background:rgba(245,158,11,0.15); }

/* ===== LEADERBOARD ===== */
.leaderboard { }
.leaderboard__title {
  font-family:'Instrument Serif',serif; font-size:24px;
  font-weight:400; margin-bottom:20px;
  display:flex; align-items:center; gap:10px;
}
.leaderboard__list {
  list-style:none; padding:0; margin:0;
  display:flex; flex-direction:column; gap:8px;
}
.leaderboard__item {
  display:flex; align-items:center; gap:14px;
  padding:14px 16px; border-radius:8px;
  background:var(--card); border:1px solid var(--border);
  transition:all var(--transition);
}
.leaderboard__item:hover { border-color:var(--border2); background:var(--card-hover); }
.leaderboard__item--top1 { border-color:var(--gold, #eab308); }
.leaderboard__item--top2 { border-color:var(--text3); }
.leaderboard__item--top3 { border-color:var(--accent); }
.leaderboard__rank {
  font-family:'Instrument Serif',serif; font-size:24px;
  color:var(--text3); min-width:30px; text-align:center;
}
.leaderboard__item--top1 .leaderboard__rank { color:var(--gold); }
.leaderboard__item--top2 .leaderboard__rank { color:var(--text2); }
.leaderboard__item--top3 .leaderboard__rank { color:var(--accent); }
.leaderboard__avatar {
  width:36px; height:36px; border-radius:50%; object-fit:cover;
}
.leaderboard__avatar--initial {
  display:grid; place-items:center;
  background:var(--bg3); border:2px solid var(--border);
  font-family:'Space Mono',monospace; font-size:13px; font-weight:700;
  color:var(--text2);
}
.leaderboard__details { flex:1; display:flex; flex-direction:column; }
.leaderboard__name { font-size:14px; font-weight:600; color:var(--text); }
.leaderboard__level {
  font-family:'Space Mono',monospace; font-size:10px;
  letter-spacing:.5px; color:var(--text3);
}
.leaderboard__score-wrap { text-align:right; }
.leaderboard__score {
  font-family:'Space Mono',monospace; font-size:18px;
  font-weight:700; color:var(--accent);
}
.leaderboard__reports {
  font-family:'Space Mono',monospace; font-size:10px; color:var(--text3);
}

/* ===== TRENDING ===== */
.trending-list {
  list-style:none; padding:0; margin:0;
  display:flex; flex-direction:column; gap:4px;
}
.trending-item {
  display:flex; gap:16px; padding:16px;
  border-radius:6px; cursor:pointer;
  transition:all var(--transition);
  border:1px solid transparent;
}
.trending-item:hover {
  background:var(--card); border-color:var(--border);
}
.trending-rank {
  font-family:'Instrument Serif',serif; font-size:28px;
  color:var(--border2); min-width:36px; line-height:1;
}
.trending-info { flex:1; }
.trending-title {
  font-size:15px; font-weight:500; line-height:1.4; color:var(--text);
  margin-bottom:6px;
}
.trending-item:hover .trending-title { color:var(--accent); }
.trending-meta {
  display:flex; gap:12px; align-items:center;
  font-family:'Space Mono',monospace; font-size:11px; color:var(--text3);
}
.trending-cat { font-weight:700; }
.trending-signals { }

/* ===== HOW IT WORKS ===== */
.how-it-works { margin:48px 0; }
.steps-grid {
  display:flex; align-items:flex-start; gap:0;
  justify-content:center;
}
.step {
  flex:1; text-align:center; padding:24px 20px;
  position:relative;
}
.step__number {
  font-family:'Space Mono',monospace; font-size:11px;
  color:var(--accent); letter-spacing:2px; margin-bottom:12px;
}
.step__icon {
  width:56px; height:56px; border-radius:50%;
  background:var(--accent-glow); border:2px solid var(--accent);
  display:grid; place-items:center; margin:0 auto 16px;
  font-size:22px; color:var(--accent);
}
.step__title {
  font-family:'Instrument Serif',serif; font-size:20px;
  font-weight:400; margin-bottom:8px; color:var(--text);
}
.step__desc {
  font-size:13px; line-height:1.6; color:var(--text2);
}
.step__connector {
  display:flex; align-items:center; padding-top:48px;
  color:var(--border2); font-size:16px;
}

/* ===== SIDEBAR LAYOUT ===== */
.sidebar-layout {
  display:grid; grid-template-columns:1fr 340px; gap:36px; align-items:start;
}
.sidebar-newsletter { display:flex; flex-direction:column; gap:20px; padding-top:60px; }
.newsletter-card {
  background:var(--card); border:1px solid var(--border);
  border-radius:8px; padding:28px;
}
.newsletter-card__title {
  font-family:'Instrument Serif',serif; font-size:22px;
  font-weight:400; margin-bottom:8px;
}
.newsletter-card__text {
  font-size:13px; color:var(--text2); line-height:1.6; margin-bottom:16px;
}
.newsletter-card__form { display:flex; gap:8px; }
.newsletter-card__input { flex:1; }
.newsletter-card__btn { white-space:nowrap; }
.demo-controls { text-align:center; }

/* ===== MAP ===== */
.map-filter-bar {
  display:flex; gap:6px; padding:0 0 16px;
  overflow-x:auto; scrollbar-width:none;
  flex-wrap:wrap;
}
.map-filter-bar::-webkit-scrollbar { display:none; }
.map-cat-btn {
  display:inline-flex; align-items:center; gap:6px;
  font-family:'Space Mono',monospace; font-size:11px;
  letter-spacing:.5px; text-transform:uppercase;
  padding:7px 14px; border-radius:4px;
  border:1px solid var(--border); background:transparent;
  color:var(--text3); cursor:pointer; white-space:nowrap;
  transition:all var(--transition);
}
.map-cat-btn:hover { border-color:var(--text2); color:var(--text); }
.map-cat-btn--active {
  background:var(--bg3); border-color:var(--border2); color:var(--text);
}
.map-cat-btn__dot {
  width:8px; height:8px; border-radius:50%; flex-shrink:0;
}
.map-cat-btn:not(.map-cat-btn--active) .map-cat-btn__dot { opacity:.35; }
.map-wrapper {
  position:relative; border-radius:12px; overflow:hidden;
  border:1px solid var(--border); background:var(--bg2);
}
.map-view {
  width:100%; height:540px; z-index:1;
}
/* Map container background matches dark tiles to prevent white edges */
.leaflet-container { background: #1a1a2e !important; }

/* Override Leaflet controls to match theme */
.leaflet-control-zoom a {
  background:var(--card) !important; color:var(--text) !important;
  border-color:var(--border) !important;
  width:34px !important; height:34px !important; line-height:34px !important;
  font-size:16px !important;
}
.leaflet-control-zoom a:hover {
  background:var(--card-hover) !important; color:var(--accent) !important;
}
.leaflet-control-zoom { border:none !important; border-radius:8px !important; overflow:hidden; box-shadow:var(--shadow-sm) !important; }
.leaflet-control-attribution {
  background:var(--glass) !important; color:var(--text3) !important;
  font-size:10px !important; backdrop-filter:blur(8px);
  border-radius:4px 0 0 0 !important; padding:2px 8px !important;
}
.leaflet-control-attribution a { color:var(--text2) !important; }
/* Popup styling */
.signal-popup .leaflet-popup-content-wrapper {
  background:var(--card) !important; color:var(--text) !important;
  border:1px solid var(--border) !important; border-radius:10px !important;
  box-shadow:var(--shadow) !important; padding:0 !important;
}
.signal-popup .leaflet-popup-content { margin:14px 16px !important; }
.signal-popup .leaflet-popup-tip { background:var(--card) !important; border:1px solid var(--border) !important; }
.map-popup__headline { font-family:'Instrument Serif',serif; font-size:15px; font-weight:400; margin-bottom:6px; color:var(--text); }
.map-popup__reporter { font-size:12px; color:var(--text3); margin-bottom:8px; }
.map-popup__link { font-family:'Space Mono',monospace; font-size:11px; color:var(--accent); text-decoration:none; font-weight:700; letter-spacing:.3px; }
.map-popup__link:hover { text-decoration:underline; }

/* ===== MODALS ===== */
.modal-overlay {
  position:fixed; top:0; left:0; width:100%; height:100%; z-index:200;
  background:rgba(0,0,0,.6); backdrop-filter:blur(4px);
  display:flex; align-items:center; justify-content:center;
  padding:24px; box-sizing:border-box;
}
.modal-overlay--active { }
.modal-overlay .modal {
  position:static; top:auto; left:auto;
  transform:none;
  opacity:1; visibility:visible;
  background:var(--card); border:1px solid var(--border2, var(--border));
  border-radius:12px; width:100%; max-width:640px;
  max-height:calc(100vh - 48px); overflow-y:auto;
  box-shadow:0 24px 64px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.06);
}
.modal--sm { max-width:440px; }
.modal--lg { max-width:800px; }
.modal__header {
  display:flex; align-items:center; justify-content:space-between;
  padding:20px 24px; border-bottom:1px solid var(--border);
}
.modal__header-badges { display:flex; gap:8px; align-items:center; }
.detail__category {
  font-family:'Space Mono',monospace; font-size:10px;
  letter-spacing:.5px; text-transform:uppercase; font-weight:700;
  padding:4px 10px; border-radius:3px;
  display:inline-flex; align-items:center; gap:5px;
  border:none; background:rgba(255,255,255,.08);
}
.modal__title {
  font-family:'Instrument Serif',serif; font-size:22px;
  font-weight:400; display:flex; align-items:center; gap:8px;
}
.modal__close {
  width:32px; height:32px; border-radius:50%;
  background:var(--bg2); border:1px solid var(--border);
  color:var(--text3); cursor:pointer; display:grid; place-items:center;
  transition:all var(--transition); font-size:14px;
}
.modal__close:hover { background:var(--bg3); color:var(--text); }
.modal__body { padding:24px; }

/* Location picker map */
.form-location-picker { display:flex; flex-direction:column; gap:8px; }
.form-location-map {
  width:100%; height:220px; border-radius:8px; overflow:hidden;
  border:1px solid var(--border); background:var(--bg2);
}
.form-location-coords {
  font-family:'Space Mono',monospace; font-size:11px;
  color:var(--text3); min-height:16px;
}
.modal__body--detail { display:flex; flex-direction:column; gap:20px; }

/* ===== FORMS ===== */
.form-group { margin-bottom:16px; }
.form-group--half { flex:1; min-width:0; }
.form-row { display:flex; gap:16px; }
.form-label {
  display:block; font-family:'Space Mono',monospace;
  font-size:11px; letter-spacing:.5px; text-transform:uppercase;
  color:var(--text3); margin-bottom:6px;
}
.form-input {
  width:100%; padding:10px 14px; border-radius:6px;
  background:var(--bg2); border:1px solid var(--border);
  color:var(--text); font-size:14px; font-family:'DM Sans',sans-serif;
  outline:none; transition:border var(--transition);
}
.form-input:focus { border-color:var(--accent); }
.form-input::placeholder { color:var(--text3); }
.form-textarea { resize:vertical; min-height:60px; }
.form-toggle-group { display:flex; gap:12px; }
.form-toggle { cursor:pointer; display:flex; align-items:center; gap:6px; }
.form-toggle__label {
  font-size:13px; color:var(--text2);
  display:flex; align-items:center; gap:6px;
}
.form-error {
  font-size:13px; color:var(--red, #ef4444); padding:8px 12px;
  background:var(--red-bg, rgba(239,68,68,.1)); border-radius:6px;
  border:1px solid rgba(239,68,68,.2);
}
.modal__switch {
  text-align:center; font-size:13px; color:var(--text3);
  margin-top:16px; padding-top:12px; border-top:1px solid var(--border);
}
.modal__switch a {
  color:var(--accent); text-decoration:none; font-weight:600;
}
.modal__switch a:hover { text-decoration:underline; }
.form-actions {
  display:flex; gap:10px; justify-content:flex-end;
  padding-top:16px; border-top:1px solid var(--border);
  margin-top:8px;
}

/* ===== CONTENT BLOCK EDITOR ===== */
.content-blocks {
  display:flex; flex-direction:column; gap:8px;
}
.content-block {
  position:relative;
  display:flex; align-items:flex-start; gap:8px;
  background:var(--bg3); border:1px solid var(--border);
  border-radius:var(--radius-sm); padding:8px;
  transition:border-color var(--transition);
}
.content-block:focus-within {
  border-color:var(--accent);
}
.content-block__handle {
  color:var(--text3); font-size:12px; padding:8px 2px;
  cursor:grab; flex-shrink:0; opacity:.4;
}
.content-block__handle:hover { opacity:.8; }
.content-block__text {
  flex:1; min-height:70px; resize:vertical;
  background:var(--bg2) !important; border-color:var(--border) !important;
}
.content-block__image-input {
  flex:1; display:flex; flex-direction:column; gap:6px;
}
.content-block__caption { font-size:13px; }
.content-block__dropzone {
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:6px; padding:24px 16px;
  border:2px dashed var(--border2); border-radius:var(--radius-md);
  color:var(--text3); cursor:pointer;
  transition:all var(--transition);
  text-align:center;
}
.content-block__dropzone:hover,
.content-block__dropzone--active {
  border-color:var(--accent); color:var(--accent);
  background:var(--accent-glow);
}
.content-block__dropzone i { font-size:24px; }
.content-block__dropzone span { font-size:13px; }
.content-block__dropzone strong { color:var(--accent); }
.content-block__dropzone-hint {
  font-family:var(--font-mono); font-size:10px;
  letter-spacing:.3px; opacity:.6;
}
.content-block__preview {
  border-radius:var(--radius-sm); overflow:hidden;
  max-height:200px;
}
.content-block__preview img {
  width:100%; max-height:200px; object-fit:cover; display:block;
  border-radius:var(--radius-sm); border:1px solid var(--border);
}
.content-block__status {
  display:flex; align-items:center; gap:6px;
  font-family:var(--font-mono); font-size:11px;
  color:var(--text3); padding:4px 0;
}
.content-block__status--done { color:var(--green); }
.content-block__status--error { color:var(--red); }
.content-block__remove {
  position:absolute; top:4px; right:4px;
  width:24px; height:24px; border-radius:50%;
  background:var(--bg2); border:1px solid var(--border);
  color:var(--text3); cursor:pointer; display:grid; place-items:center;
  font-size:10px; transition:all var(--transition);
  opacity:0;
}
.content-block:hover .content-block__remove { opacity:1; }
.content-block__remove:hover {
  background:var(--red); border-color:var(--red); color:#fff;
}
.content-blocks__actions {
  display:flex; gap:8px; margin-top:8px;
}

/* ===== AVATAR UPLOAD ===== */
.avatar-upload {
  display:flex; align-items:center; gap:16px;
}
.avatar-upload__preview {
  width:64px; height:64px; border-radius:50%;
  object-fit:cover; border:2px solid var(--border);
  flex-shrink:0;
}
.avatar-upload__preview--empty {
  display:grid; place-items:center;
  background:var(--bg3); color:var(--text3); font-size:24px;
}
.avatar-upload__actions {
  display:flex; flex-direction:column; gap:6px;
}
.avatar-upload__btn { cursor:pointer; }
.avatar-upload__status {
  font-family:var(--font-mono); font-size:11px;
  color:var(--text3); display:flex; align-items:center; gap:4px;
}

/* ===== DETAIL MODAL ===== */
.detail__headline {
  font-family:'Instrument Serif',serif; font-size:28px;
  font-weight:400; line-height:1.2;
}
.detail__meta {
  display:flex; align-items:center; gap:16px; flex-wrap:wrap;
}
.detail__time {
  font-family:'Space Mono',monospace; font-size:12px; color:var(--text3);
}
.detail__location {
  font-family:'Space Mono',monospace; font-size:12px; color:var(--text3);
}
.detail__gallery {
  display:grid; grid-template-columns:repeat(auto-fill, minmax(200px, 1fr));
  gap:12px;
}
.detail__gallery-img {
  width:100%; border-radius:6px; border:1px solid var(--border);
}
.detail__content { font-size:15px; line-height:1.7; color:var(--text2); }
.detail__summary { color:var(--text); margin-bottom:12px; font-weight:500; }
.detail__full-text { }
.detail__paragraph { margin-bottom:20px; }
.detail__figure {
  margin:24px 0; border-radius:var(--radius-md); overflow:hidden;
  border:1px solid var(--border); background:var(--bg2);
}
.detail__figure-img {
  width:100%; display:block;
}
.detail__figure-caption {
  padding:10px 16px;
  font-family:var(--font-mono); font-size:12px; color:var(--text3);
  border-top:1px solid var(--border); letter-spacing:.3px;
}
.detail__sources { }
.detail__sources h4 {
  font-family:'Space Mono',monospace; font-size:12px;
  color:var(--text3); letter-spacing:1px; text-transform:uppercase;
  margin-bottom:10px;
}
.detail__source-list { list-style:none; padding:0; }
.detail__source-list li { margin-bottom:8px; }
.detail__source-list a {
  color:var(--accent); text-decoration:none; font-size:13px;
  word-break:break-all;
}
.detail__source-list a:hover { text-decoration:underline; }
.detail__trust, .detail__evolution, .detail__context { }
.detail__evolution h4, .detail__context h4 {
  font-family:'Space Mono',monospace; font-size:12px;
  color:var(--text3); letter-spacing:1px; text-transform:uppercase;
  margin-bottom:12px;
}

/* ===== TIMELINE (evolution) ===== */
.timeline {
  position:relative; padding-left:28px;
}
.timeline--empty { font-size:13px; color:var(--text3); padding-left:0; }
.timeline::before {
  content:''; position:absolute; left:10px; top:0; bottom:0;
  width:2px; background:var(--border);
}
.timeline__item {
  position:relative; padding-bottom:20px;
}
.timeline__item--latest { padding-bottom:0; }
.timeline__marker {
  position:absolute; left:-28px; top:2px;
  width:22px; height:22px; border-radius:50%;
  display:grid; place-items:center;
  font-size:10px; color:#fff;
}
.timeline__content { padding-left:4px; }
.timeline__type {
  font-family:'Space Mono',monospace; font-size:10px;
  letter-spacing:.5px; text-transform:uppercase; font-weight:700;
}
.timeline__desc { font-size:13px; color:var(--text2); margin:4px 0; }
.timeline__time {
  font-family:'Space Mono',monospace; font-size:10px; color:var(--text3);
}

/* ===== CONTEXT NOTES ===== */
.context-notes { display:flex; flex-direction:column; gap:12px; }
.context-notes__empty { font-size:13px; color:var(--text3); }
.context-note {
  padding:14px; border-radius:8px;
  border:1px solid var(--border); background:var(--bg2);
}
.context-note--visible { border-color:var(--green, #22c55e); background:var(--green-bg, rgba(34,197,94,.06)); }
.context-note--low { opacity:.7; }
.context-note__low-indicator {
  font-size:11px; color:var(--text3); margin-bottom:8px;
  font-style:italic;
}
.context-note__header {
  display:flex; justify-content:space-between; align-items:center;
  margin-bottom:8px;
}
.context-note__author {
  font-family:'Space Mono',monospace; font-size:11px;
  color:var(--text2); font-weight:600;
}
.context-note__time {
  font-family:'Space Mono',monospace; font-size:10px; color:var(--text3);
}
.context-note__text { font-size:14px; line-height:1.6; color:var(--text); margin-bottom:10px; }
.context-note__votes { display:flex; gap:8px; }
.context-vote-btn {
  display:inline-flex; align-items:center; gap:5px;
  font-size:12px; padding:4px 10px; border-radius:4px;
  border:1px solid var(--border); background:transparent;
  color:var(--text3); cursor:pointer; transition:all var(--transition);
}
.context-vote-btn:hover { border-color:var(--text2); color:var(--text); }
.context-vote-btn--helpful:hover { color:var(--green); border-color:var(--green); }
.context-vote-btn--nothelpful:hover { color:var(--red); border-color:var(--red); }
.context-vote-btn__count { font-weight:700; }
.context-form { display:flex; flex-direction:column; gap:8px; }
.context-form__input { }
.context-form__actions { display:flex; gap:8px; justify-content:flex-end; }
.context-notes__add-btn { align-self:flex-start; }

/* ===== TOASTS ===== */
.toast-container {
  position:fixed; bottom:24px; right:24px; z-index:300;
  display:flex; flex-direction:column; gap:8px;
}
.toast {
  display:flex; align-items:center; gap:10px;
  padding:12px 20px; border-radius:8px;
  background:var(--card); border:1px solid var(--border);
  color:var(--text); font-size:14px;
  box-shadow:0 8px 32px rgba(0,0,0,.3);
  transform:translateX(120%); transition:transform .35s ease;
}
.toast--visible { transform:translateX(0); }
.toast--success { border-color:var(--green); color:var(--green); }
.toast--error { border-color:var(--red); color:var(--red); }
.toast--info { border-color:var(--blue); color:var(--blue); }
.toast--warning { border-color:var(--gold); color:var(--gold); }

/* ===== EMPTY STATE ===== */
.empty-state {
  text-align:center; padding:48px 24px; color:var(--text3);
  display:flex; flex-direction:column; align-items:center; gap:12px;
}
.empty-state i { font-size:32px; opacity:.4; }
.empty-state p { font-size:14px; }

/* ===== FADE ANIMATIONS ===== */
.fade-up {
  opacity:0; transform:translateY(30px);
  transition:opacity .6s ease, transform .6s ease;
}
.fade-up.visible { opacity:1; transform:translateY(0); }

/* ===== FOOTER ===== */
.footer {
  border-top:1px solid var(--border);
  padding:48px 0 24px; margin-top:40px;
}
.footer__grid {
  display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr;
  gap:40px; margin-bottom:40px;
}
.footer__brand { }
.footer__brand .logo { font-size:28px; margin-bottom:12px; }
.footer__tagline {
  font-size:13px; color:var(--text3); line-height:1.6; max-width:300px;
}
.footer__col h4 {
  font-family:'Space Mono',monospace; font-size:10px;
  letter-spacing:2px; text-transform:uppercase;
  color:var(--text3); margin-bottom:16px;
}
.footer__col a {
  display:block; font-size:14px; color:var(--text2);
  text-decoration:none; padding:4px 0;
  transition:color var(--transition);
}
.footer__col a:hover { color:var(--accent); }
.footer__bottom {
  display:flex; justify-content:space-between; align-items:center;
  padding-top:24px; border-top:1px solid var(--border);
  font-size:12px; color:var(--text3);
  font-family:'Space Mono',monospace;
}

/* ===== MAP POPUP ===== */
.map-popup { }
.map-popup__status { margin-bottom:6px; }
.map-popup__headline { font-size:14px; font-weight:600; margin-bottom:4px; }
.map-popup__reporter { font-size:12px; color:#666; margin-bottom:6px; }
.map-popup__link {
  font-size:12px; color:var(--accent); text-decoration:none;
  font-weight:600;
}

/* ===== RESPONSIVE ===== */
@media(max-width:1024px) {
  .hero-grid { grid-template-columns:1fr; }
  .hero-main { min-height:340px; }
  .hero-side { flex-direction:row; }
  .hero-card { min-height:180px; }
  .report-grid { grid-template-columns:repeat(2,1fr); }
  .sidebar-layout { grid-template-columns:1fr; }
  .footer__grid { grid-template-columns:repeat(2,1fr); }
  .steps-grid { flex-wrap:wrap; }
  .step__connector { display:none; }
  .step { flex:0 0 50%; }
}
@media(max-width:768px) {
  .header__tagline { display:none; }
  .mobile-menu-btn { display:flex; }
  .btn-label { display:none; }
  .map-view { height:360px; }
  .map-filter-bar { gap:4px; }
  .map-cat-btn { padding:5px 10px; font-size:10px; }
}
@media(max-width:640px) {
  .container { padding:0 16px; }
  .header__inner { padding:12px 16px; }
  .logo { font-size:26px; }
  .search-box { width:140px; }
  .search-box:focus-within { width:170px; }
  .main-content { padding-top:16px; padding-bottom:40px; }
  .hero-grid { grid-template-columns:1fr; }
  .hero-main { min-height:260px; }
  .hero-headline { font-size:24px !important; }
  .hero-side { flex-direction:column; }
  .report-grid { grid-template-columns:1fr; }
  .steps-grid { flex-direction:column; }
  .step { flex:1; }
  .step__connector { display:none; }
  .footer__grid { grid-template-columns:1fr; }
  .footer__bottom { flex-direction:column; gap:8px; text-align:center; }
  .tab-nav { gap:2px; }
  .tab-btn { padding:8px 12px; font-size:10px; }
  .modal-overlay .modal { margin:0; max-height:95vh; transform:none; position:static; top:auto; left:auto; opacity:1; visibility:visible; }
  .form-row { flex-direction:column; gap:0; }
  .signal-bar--card { gap:4px; }
  .signal-bar--card .signal-chip { padding:2px 6px; font-size:10px; }
  .newsletter-card__form { flex-direction:column; }
  .sidebar-layout { grid-template-columns:1fr; }
  .detail__headline { font-size:22px; }
}

/* ============================================================
   MODERATION SYSTEM
   ============================================================ */

/* --- Flag Button (on cards) --- */
.flag-btn {
  background: none;
  border: none;
  color: var(--muted);
  cursor: pointer;
  padding: 4px 6px;
  font-size: 12px;
  border-radius: 4px;
  transition: color .2s, background .2s;
  opacity: 0.5;
}
.flag-btn:hover {
  color: var(--danger, #e53935);
  background: rgba(229,57,53,.08);
  opacity: 1;
}
.flag-btn--detail {
  font-size: 13px;
  padding: 6px 12px;
  border: 1px solid var(--border);
  border-radius: 6px;
  opacity: 1;
  color: var(--muted);
}
.flag-btn--detail:hover {
  border-color: var(--danger, #e53935);
  color: var(--danger, #e53935);
  background: rgba(229,57,53,.06);
}
.modal__header-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

/* --- Flag Modal --- */
.flag-modal__headline {
  font-size: 14px;
  padding: 10px 14px;
  background: var(--surface);
  border-radius: 8px;
  border-left: 3px solid var(--accent);
  margin-bottom: 16px;
}
.flag-modal__label {
  font-weight: 600;
  margin-bottom: 12px;
  font-size: 14px;
}
.flag-reasons {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 16px;
}
.flag-reason {
  display: flex;
  align-items: center;
  cursor: pointer;
}
.flag-reason input[type="radio"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.flag-reason__content {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 10px 14px;
  border: 1px solid var(--border);
  border-radius: 8px;
  transition: border-color .2s, background .2s;
}
.flag-reason input:checked + .flag-reason__content {
  border-color: var(--danger, #e53935);
  background: rgba(229,57,53,.06);
}
.flag-reason:hover .flag-reason__content {
  border-color: var(--muted);
}
.flag-reason__icon {
  font-size: 16px;
  color: var(--muted);
  width: 20px;
  text-align: center;
}
.flag-reason input:checked + .flag-reason__content .flag-reason__icon {
  color: var(--danger, #e53935);
}
.flag-reason__text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.flag-reason__label {
  font-weight: 600;
  font-size: 13px;
}
.flag-reason__desc {
  font-size: 11px;
  color: var(--muted);
}
/* --- Delete Reason Modal --- */
.modal__header--danger {
  background: linear-gradient(135deg, #e74c3c, #c0392b);
}
.modal__header--danger .modal__title {
  color: #fff;
}
.modal__header--danger .modal__close {
  color: rgba(255,255,255,0.8);
}
.modal__header--danger .modal__close:hover {
  color: #fff;
}
.delete-reason__report-info {
  padding: 12px 14px;
  background: rgba(231,76,60,0.06);
  border: 1px solid rgba(231,76,60,0.15);
  border-radius: 8px;
  margin-bottom: 16px;
  font-size: 14px;
  color: var(--text);
}
.delete-reason__report-info i {
  color: var(--danger, #e53935);
  margin-right: 8px;
}
.delete-reason__label {
  font-weight: 600;
  font-size: 14px;
  margin: 0 0 4px;
}
.delete-reason__sublabel {
  font-size: 12px;
  color: var(--muted);
  margin: 0 0 14px;
}
.delete-reasons {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 16px;
  max-height: 260px;
  overflow-y: auto;
}
.delete-reason {
  display: flex;
  align-items: center;
  cursor: pointer;
}
.delete-reason input[type="radio"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.delete-reason__content {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 10px 14px;
  border: 1px solid var(--border);
  border-radius: 8px;
  transition: border-color .2s, background .2s;
}
.delete-reason input:checked + .delete-reason__content {
  border-color: var(--danger, #e53935);
  background: rgba(229,57,53,.06);
}
.delete-reason:hover .delete-reason__content {
  border-color: var(--muted);
}
.delete-reason__icon {
  font-size: 16px;
  color: var(--muted);
  width: 20px;
  text-align: center;
}
.delete-reason input:checked + .delete-reason__content .delete-reason__icon {
  color: var(--danger, #e53935);
}
.delete-reason__text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.delete-reason__name {
  font-weight: 600;
  font-size: 13px;
}
/* RTL support for delete reason modal */
[dir="rtl"] .delete-reason__report-info i {
  margin-right: 0;
  margin-left: 8px;
}

.btn--danger {
  background: var(--danger, #e53935);
  color: #fff;
  border: none;
}
.btn--danger:hover {
  background: #c62828;
}
.btn--danger-dark {
  background: #8b0000;
  color: #fff;
  border: none;
}
.btn--danger-dark:hover {
  background: #5c0000;
}
.btn--success {
  background: #43a047;
  color: #fff;
  border: none;
}
.btn--success:hover {
  background: #2e7d32;
}
.btn--warning {
  background: #f9a825;
  color: #111;
  border: none;
}
.btn--warning:hover {
  background: #f57f17;
}

/* --- Profile tab pushed to right end --- */
.tab-btn[data-tab="profile"] {
  margin-left: auto;
}

/* --- Mod Tab Badge --- */
.tab-btn--mod {
  position: relative;
}
.mod-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--danger, #e53935);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  min-width: 18px;
  height: 18px;
  border-radius: 9px;
  padding: 0 5px;
  margin-left: 6px;
  line-height: 1;
}

/* --- Mod Stats Row --- */
.mod-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 16px;
  margin-bottom: 32px;
}
.mod-stat {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 20px;
  text-align: center;
}
.mod-stat__number {
  font-family: 'Space Mono', monospace;
  font-size: 32px;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 6px;
}
.mod-stat--pending .mod-stat__number { color: #f9a825; }
.mod-stat--reviewed .mod-stat__number { color: #43a047; }
.mod-stat--hidden .mod-stat__number { color: var(--muted); }
.mod-stat--banned .mod-stat__number { color: #e53935; }
.mod-stat__label {
  font-size: 12px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* --- Mod Sections --- */
.mod-section {
  margin-bottom: 32px;
}
.mod-section__title {
  font-family: 'Instrument Serif', serif;
  font-size: 20px;
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.mod-section__title i {
  color: var(--accent);
}
.mod-empty {
  padding: 32px;
  text-align: center;
  color: var(--muted);
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  font-size: 14px;
}
.mod-empty i {
  font-size: 24px;
  display: block;
  margin-bottom: 8px;
  color: #43a047;
}

/* --- Approval Card --- */
.mod-approval-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-left: 3px solid var(--gold, #ffc107);
  border-radius: 8px;
  padding: 16px;
  margin-bottom: 12px;
}
.mod-approval-card__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}
.mod-approval-card__status {
  font-family: var(--font-mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: var(--gold, #ffc107);
  display: flex;
  align-items: center;
  gap: 6px;
}
.mod-approval-card__time {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--text3);
}
.mod-approval-card__report { margin-bottom: 12px; }
.mod-approval-card__headline {
  font-family: var(--font-heading);
  font-size: var(--fs-base);
  margin-bottom: 6px;
}
.mod-approval-card__headline a {
  color: var(--text);
  text-decoration: none;
}
.mod-approval-card__headline a:hover { color: var(--accent); }
.mod-approval-card__summary {
  font-size: var(--fs-sm);
  color: var(--text2);
  line-height: 1.5;
  margin-bottom: 8px;
}
.mod-approval-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--text3);
}
.mod-approval-card__meta span {
  display: flex;
  align-items: center;
  gap: 4px;
}
.mod-approval-card__images {
  display: flex;
  gap: 8px;
  margin-bottom: 12px;
}
.mod-approval-card__thumb {
  width: 80px;
  height: 60px;
  object-fit: cover;
  border-radius: 6px;
  border: 1px solid var(--border);
}
.mod-approval-card__more {
  display: flex;
  align-items: center;
  font-size: var(--fs-xs);
  color: var(--text3);
}
.mod-approval-card__actions {
  display: flex;
  gap: 8px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
}
.btn--green {
  background: var(--green, #00c853);
  color: #fff;
  border: none;
}
.btn--green:hover {
  background: #00b848;
}
.btn--red {
  background: var(--red, #e53935);
  color: #fff;
  border: none;
}
.btn--red:hover {
  background: #d32f2f;
}
.mod-stat--approval .mod-stat__number {
  color: var(--gold, #ffc107);
}
.mod-section__count {
  font-size: var(--fs-xs);
  background: var(--gold, #ffc107);
  color: #000;
  padding: 2px 8px;
  border-radius: 10px;
  margin-left: 8px;
  font-weight: 700;
}

/* Pending badge on report cards */
.report-card__pending-badge {
  position: absolute;
  top: 10px;
  right: 10px;
  background: rgba(255, 193, 7, 0.9);
  color: #000;
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  padding: 4px 10px;
  border-radius: 4px;
  display: flex;
  align-items: center;
  gap: 5px;
  z-index: 2;
}

/* --- Flag Card --- */
.mod-flag-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 20px;
  margin-bottom: 12px;
  border-left: 3px solid #f9a825;
}
.mod-flag-card__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}
.mod-flag-card__reason {
  font-weight: 600;
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 8px;
  color: #f9a825;
}
.mod-flag-card__time {
  font-size: 12px;
  color: var(--muted);
}
.mod-flag-card__report {
  padding: 12px 14px;
  background: var(--surface);
  border-radius: 8px;
  margin-bottom: 12px;
}
.mod-flag-card__headline {
  font-size: 15px;
  margin-bottom: 4px;
}
.mod-flag-card__headline a {
  color: var(--heading);
  text-decoration: none;
}
.mod-flag-card__headline a:hover {
  text-decoration: underline;
  color: var(--accent);
}
.mod-flag-card__meta {
  font-size: 12px;
  color: var(--muted);
}
.mod-flag-card__details {
  font-size: 13px;
  color: var(--muted);
  padding: 10px 14px;
  background: var(--surface);
  border-radius: 8px;
  margin-bottom: 12px;
  font-style: italic;
}
.mod-flag-card__details i {
  color: var(--border);
  margin-right: 6px;
}
.mod-flag-card__flagger {
  font-size: 12px;
  color: var(--muted);
  margin-bottom: 12px;
}
.mod-flag-card__aggregate {
  font-size: 12px;
  color: #f9a825;
  font-weight: 600;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.mod-flag-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

/* --- Banned Card --- */
.mod-banned-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 14px 18px;
  margin-bottom: 8px;
  border-left: 3px solid #e53935;
}
.mod-banned-card__info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.mod-banned-card__reason {
  font-size: 12px;
  color: var(--muted);
}
.mod-banned-card__date {
  font-size: 11px;
  color: var(--muted);
}

/* --- Mod Log --- */
.mod-log {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.mod-log__entry {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 13px;
}
.mod-log__icon {
  font-size: 14px;
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  flex-shrink: 0;
}
.mod-log__icon--dismiss    { color: #43a047; background: rgba(67,160,71,.1); }
.mod-log__icon--warn_author{ color: #f9a825; background: rgba(249,168,37,.1); }
.mod-log__icon--hide       { color: var(--muted); background: var(--surface); }
.mod-log__icon--remove     { color: #e53935; background: rgba(229,57,53,.1); }
.mod-log__icon--ban        { color: #8b0000; background: rgba(139,0,0,.1); }
.mod-log__content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.mod-log__action {
  font-weight: 600;
  font-size: 13px;
}
.mod-log__detail {
  font-size: 12px;
  color: var(--muted);
}
.mod-log__time {
  font-size: 11px;
  color: var(--muted);
  white-space: nowrap;
}

/* --- Responsive: Moderation --- */
@media (max-width: 640px) {
  .mod-stats { grid-template-columns: repeat(2, 1fr); }
  .mod-flag-card__actions { flex-direction: column; }
  .mod-flag-card__actions .btn { width: 100%; }
}

/* ============================================================
   PROFILE PAGE
   ============================================================ */

/* ---- Profile Header ---- */
.profile-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-xl);
  padding: var(--space-2xl) 0;
  border-bottom: 1px solid var(--border);
}
.profile-header__left {
  display: flex;
  align-items: flex-start;
  gap: var(--space-xl);
  flex: 1;
}
.profile-header__actions {
  display: flex;
  gap: var(--space-sm);
  flex-shrink: 0;
  padding-top: var(--space-xs);
}

/* Avatar */
.profile-avatar {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  border: 3px solid var(--border);
}
.profile-avatar--initial {
  display: grid;
  place-items: center;
  font-family: var(--font-heading);
  font-size: var(--fs-3xl);
  color: #fff;
  background: var(--bg3);
}
.profile-avatar--initial.level--new      { background: var(--text3);   border-color: var(--text3); }
.profile-avatar--initial.level--local    { background: var(--blue);    border-color: var(--blue); }
.profile-avatar--initial.level--trusted  { background: var(--green);   border-color: var(--green); }
.profile-avatar--initial.level--verified { background: var(--purple);  border-color: var(--purple); }
.profile-avatar--initial.level--expert   { background: var(--gold);    border-color: var(--gold); }
.profile-avatar--initial.level--superadmin { background: #f59e0b; border-color: #f59e0b; }

/* Info */
.profile-info { flex: 1; min-width: 0; }
.profile-name {
  font-family: var(--font-heading);
  font-size: var(--fs-2xl);
  color: var(--text);
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  margin: 0;
}
.profile-mod-badge {
  color: var(--blue);
  font-size: var(--fs-sm);
  background: var(--blue-bg);
  padding: 2px 8px;
  border-radius: var(--radius-sm);
}
.profile-banned-badge {
  color: var(--red);
  font-size: var(--fs-xs);
  background: var(--red-bg);
  padding: 2px 8px;
  border-radius: var(--radius-sm);
  font-family: var(--font-mono);
  text-transform: uppercase;
  letter-spacing: .5px;
}

.profile-level {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  letter-spacing: .5px;
  text-transform: uppercase;
  padding: 4px 12px;
  border-radius: var(--radius-sm);
  margin-top: var(--space-sm);
}
.profile-level.level--new      { color: var(--text3); background: var(--bg3); }
.profile-level.level--local    { color: var(--blue);  background: var(--blue-bg); }
.profile-level.level--trusted  { color: var(--green); background: var(--green-bg); }
.profile-level.level--verified { color: var(--purple);background: var(--purple-bg); }
.profile-level.level--expert   { color: var(--gold);  background: var(--gold-bg); }
.profile-level.level--superadmin { color: #f59e0b; background: rgba(245,158,11,0.15); }

.profile-bio {
  font-size: var(--fs-sm);
  color: var(--text2);
  line-height: var(--lh-normal);
  margin-top: var(--space-sm);
  max-width: 520px;
}

.profile-meta {
  display: flex;
  align-items: center;
  gap: var(--space-lg);
  margin-top: var(--space-md);
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  color: var(--text3);
  flex-wrap: wrap;
}
.profile-meta span {
  display: flex;
  align-items: center;
  gap: 6px;
}
.profile-meta i { font-size: 11px; }

/* ---- Stats Grid ---- */
.profile-stats {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: var(--space-md);
  padding: var(--space-xl) 0;
  border-bottom: 1px solid var(--border);
}
.profile-stat {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: var(--space-lg) var(--space-md);
  text-align: center;
  transition: all var(--transition);
}
.profile-stat:hover {
  border-color: var(--border2);
  transform: translateY(-2px);
  box-shadow: var(--shadow-sm);
}
.profile-stat__icon {
  font-size: var(--fs-lg);
  color: var(--text3);
  margin-bottom: var(--space-sm);
}
.profile-stat__value {
  font-family: var(--font-heading);
  font-size: var(--fs-xl);
  color: var(--text);
}
.profile-stat__label {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--text3);
  text-transform: uppercase;
  letter-spacing: .5px;
  margin-top: 4px;
}
/* Stat color variants */
.stat--green .profile-stat__icon,
.stat--green .profile-stat__value { color: var(--green); }
.stat--red .profile-stat__icon,
.stat--red .profile-stat__value   { color: var(--red); }
.stat--blue .profile-stat__icon,
.stat--blue .profile-stat__value  { color: var(--blue); }
.stat--gold .profile-stat__icon,
.stat--gold .profile-stat__value  { color: var(--gold); }

/* ---- Profile Sections ---- */
.profile-section {
  padding: var(--space-xl) 0;
  border-bottom: 1px solid var(--border);
}
.profile-section:last-child { border-bottom: none; }
.profile-section__title {
  font-family: var(--font-heading);
  font-size: var(--fs-lg);
  color: var(--text);
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  margin: 0 0 var(--space-lg);
}
.profile-section__title i { color: var(--accent); font-size: var(--fs-sm); }

.profile-empty {
  text-align: center;
  padding: var(--space-2xl);
  color: var(--text3);
}
.profile-empty i { font-size: var(--fs-2xl); margin-bottom: var(--space-md); display: block; }
.profile-empty p { font-size: var(--fs-sm); margin: 0; }

/* ---- Reputation Progress Bar ---- */
.rep-progress {
  position: relative;
  padding-bottom: 48px;
}
.rep-progress__bar {
  position: relative;
  height: 10px;
  background: var(--bg3);
  border-radius: var(--radius-full);
  overflow: visible;
}
.rep-progress__fill {
  height: 100%;
  border-radius: var(--radius-full);
  transition: width 0.6s cubic-bezier(.4, 0, .2, 1);
  position: relative;
}
.rep-progress__fill.level--new      { background: var(--text3); }
.rep-progress__fill.level--local    { background: var(--blue); }
.rep-progress__fill.level--trusted  { background: var(--green); }
.rep-progress__fill.level--verified { background: var(--purple); }
.rep-progress__fill.level--expert   { background: linear-gradient(90deg, var(--gold), var(--accent)); }

.rep-progress__marker {
  position: absolute;
  top: -6px;
  transform: translateX(-50%);
  z-index: 2;
}
.rep-progress__score {
  display: block;
  background: var(--accent);
  color: #fff;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: var(--radius-sm);
  white-space: nowrap;
}
.rep-progress__score::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 50%;
  transform: translateX(-50%);
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid var(--accent);
}

.rep-progress__levels {
  position: relative;
  height: 32px;
  margin-top: var(--space-md);
}
.rep-level {
  position: absolute;
  top: 0;
  transform: translateX(-50%);
  text-align: center;
  color: var(--text3);
  font-size: 10px;
  transition: color var(--transition);
}
.rep-level i { display: block; font-size: 14px; margin-bottom: 2px; }
.rep-level span { font-family: var(--font-mono); letter-spacing: .3px; white-space: nowrap; }
.rep-level--active { color: var(--text); }

/* ---- Report Rows ---- */
.profile-reports {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.profile-report-row {
  display: flex;
  align-items: center;
  gap: var(--space-md);
  padding: var(--space-md) var(--space-lg);
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: all var(--transition);
}
.profile-report-row:hover {
  border-color: var(--accent);
  background: var(--card-hover);
  transform: translateX(4px);
}
.profile-report-row__cat {
  font-size: var(--fs-lg);
  flex-shrink: 0;
  width: 32px;
  text-align: center;
}
.profile-report-row__info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.profile-report-row__headline {
  font-family: var(--font-heading);
  font-size: var(--fs-base);
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.profile-report-row__meta {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--text3);
}
.profile-report-row__status {
  flex-shrink: 0;
}

/* ---- Vote Breakdown ---- */
.vote-breakdown {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}
.vote-breakdown__row {
  display: flex;
  align-items: center;
  gap: var(--space-md);
}
.vote-breakdown__label {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  color: var(--text2);
  width: 120px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 6px;
}
.vote-breakdown__bar-wrap {
  flex: 1;
  height: 8px;
  background: var(--bg3);
  border-radius: var(--radius-full);
  overflow: hidden;
}
.vote-breakdown__bar {
  height: 100%;
  border-radius: var(--radius-full);
  transition: width 0.5s ease;
  min-width: 2px;
}
.vote-breakdown__count {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  color: var(--text);
  width: 80px;
  text-align: right;
  flex-shrink: 0;
}
.vote-breakdown__pct {
  color: var(--text3);
}

/* ---- Profile Responsive ---- */
@media (max-width: 1024px) {
  .profile-stats { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
  .profile-header {
    flex-direction: column;
    align-items: stretch;
  }
  .profile-header__left {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
  .profile-header__actions {
    justify-content: center;
  }
  .profile-name { justify-content: center; flex-wrap: wrap; }
  .profile-bio { max-width: none; }
  .profile-meta { justify-content: center; }
  .profile-stats { grid-template-columns: repeat(3, 1fr); }
  .vote-breakdown__label { width: 90px; font-size: 10px; }
}
@media (max-width: 640px) {
  .profile-stats { grid-template-columns: repeat(2, 1fr); }
  .profile-avatar { width: 72px; height: 72px; }
  .profile-avatar--initial { font-size: var(--fs-2xl); }
  .profile-name { font-size: var(--fs-xl); }
  .profile-report-row { padding: var(--space-sm) var(--space-md); }
  .profile-report-row__status { display: none; }
  .vote-breakdown__label { width: 70px; }
  .vote-breakdown__count { width: 60px; }
}

/* ============================================================
   BROADCAST — Live Streams & Field Footage
   ============================================================ */

/* Sub-tabs */
.broadcast-tabs {
  display: flex;
  gap: 4px;
  padding: 0 0 var(--space-lg);
  border-bottom: 1px solid var(--border);
  margin-bottom: var(--space-xl);
}
.broadcast-tab {
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: .5px;
  text-transform: uppercase;
  padding: 10px 24px;
  border-radius: 4px;
  border: 1px solid transparent;
  background: transparent;
  color: var(--text3);
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: all var(--transition);
}
.broadcast-tab:hover { color: var(--text); background: var(--bg2); }
.broadcast-tab--active {
  background: var(--bg2);
  color: var(--text);
  border-color: var(--border);
}

/* Live pulse dot */
.live-pulse {
  color: #e53935;
  font-size: 8px;
  animation: livePulse 1.5s ease-in-out infinite;
}
@keyframes livePulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.3; }
}

/* Live header bar */
.broadcast-live-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--space-lg);
}
.broadcast-live-count {
  font-family: var(--font-mono);
  font-size: var(--fs-sm);
  color: var(--text2);
  display: flex;
  align-items: center;
  gap: 8px;
}
.broadcast-live-count strong {
  color: var(--text);
  font-size: var(--fs-md);
}

/* Videos header */
.broadcast-videos__header {
  display: flex;
  justify-content: flex-end;
  margin-bottom: var(--space-lg);
}

/* Card grid */
.broadcast-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: var(--space-lg);
}

/* Card */
.broadcast-card {
  background: var(--bg2);
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
  transition: all var(--transition);
  cursor: pointer;
}
.broadcast-card:hover {
  border-color: var(--accent);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.3);
}

/* Preview / Thumbnail area */
.broadcast-card__preview {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  background: var(--bg3);
  overflow: hidden;
}
.broadcast-card__placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.5rem;
  color: var(--text3);
  background: linear-gradient(135deg, var(--bg3) 0%, rgba(255,107,53,0.08) 100%);
}
.broadcast-card__placeholder--video {
  background: linear-gradient(135deg, var(--bg3) 0%, rgba(26,115,232,0.08) 100%);
}

/* Live badge overlay */
.broadcast-card__live-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  background: #e53935;
  color: #fff;
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1px;
  padding: 4px 10px;
  border-radius: 3px;
  display: flex;
  align-items: center;
  gap: 5px;
}
.broadcast-card__live-badge .fa-circle {
  font-size: 6px;
  animation: livePulse 1.5s ease-in-out infinite;
}
.broadcast-card--live {
  border-color: rgba(229, 57, 53, 0.3);
}
.broadcast-card--live:hover {
  border-color: #e53935;
}

/* Viewer count overlay */
.broadcast-card__viewers {
  position: absolute;
  top: 10px;
  right: 10px;
  background: rgba(0,0,0,0.7);
  color: #fff;
  font-family: var(--font-mono);
  font-size: 11px;
  padding: 4px 8px;
  border-radius: 3px;
  display: flex;
  align-items: center;
  gap: 5px;
}

/* Elapsed time overlay */
.broadcast-card__elapsed {
  position: absolute;
  bottom: 10px;
  right: 10px;
  background: rgba(0,0,0,0.7);
  color: #fff;
  font-family: var(--font-mono);
  font-size: 11px;
  padding: 4px 8px;
  border-radius: 3px;
  display: flex;
  align-items: center;
  gap: 5px;
}

/* Duration overlay (videos) */
.broadcast-card__duration {
  position: absolute;
  bottom: 10px;
  right: 10px;
  background: rgba(0,0,0,0.8);
  color: #fff;
  font-family: var(--font-mono);
  font-size: 11px;
  padding: 4px 8px;
  border-radius: 3px;
  display: flex;
  align-items: center;
  gap: 5px;
}
.broadcast-card__delete-btn {
  position: absolute;
  top: 8px;
  right: 8px;
  background: rgba(0,0,0,0.7);
  color: #e53935;
  border: none;
  cursor: pointer;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  transition: background .2s, color .2s;
  z-index: 2;
}
.broadcast-card__delete-btn:hover {
  background: #e53935;
  color: #fff;
}

/* Go-live location toggle */
.go-live-loc-btn--active {
  background: rgba(0, 180, 216, 0.12) !important;
  border-color: var(--accent) !important;
  color: var(--accent) !important;
}

/* Card body */
.broadcast-card__body {
  padding: var(--space-md);
}
.broadcast-card__title {
  font-family: var(--font-heading);
  font-size: var(--fs-sm);
  color: var(--text);
  margin-bottom: var(--space-sm);
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.broadcast-card__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: var(--fs-xs);
  color: var(--text3);
}
.broadcast-card__reporter {
  display: flex;
  align-items: center;
  gap: 6px;
}
.broadcast-card__avatar {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--bg3);
  border: 1px solid var(--border);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-mono);
  font-size: 9px;
  color: var(--text2);
  font-weight: 700;
}
.broadcast-card__cat {
  font-family: var(--font-mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .5px;
  display: flex;
  align-items: center;
  gap: 4px;
}
.broadcast-card__stats {
  display: flex;
  gap: var(--space-md);
  margin-top: var(--space-sm);
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--text3);
}
.broadcast-card__stats span {
  display: flex;
  align-items: center;
  gap: 4px;
}

/* Location indicator on cards */
.broadcast-card__location {
  display:flex; align-items:center; gap:4px;
  font-size:11px; color:var(--text3);
  margin-top:var(--space-sm);
  font-family:var(--font-mono);
}
.broadcast-card__loc-type {
  font-size:9px; text-transform:uppercase; letter-spacing:.5px;
  background:var(--bg3); color:var(--text2);
  padding:1px 5px; border-radius:4px; margin-left:4px;
}

/* Live stream marker (pulsing red) on broadcast map */
.broadcast-marker-live-wrap { background:transparent; border:none; }
.broadcast-marker-live {
  width:14px; height:14px; border-radius:50%;
  background:#e53935; border:2px solid #fff;
  box-shadow:0 0 0 0 rgba(229,57,53,.5);
  animation:liveMarkerPulse 2s ease-out infinite;
}
@keyframes liveMarkerPulse {
  0% { box-shadow:0 0 0 0 rgba(229,57,53,.5); }
  70% { box-shadow:0 0 0 10px rgba(229,57,53,0); }
  100% { box-shadow:0 0 0 0 rgba(229,57,53,0); }
}

/* Empty state */
.broadcast-empty {
  text-align: center;
  padding: var(--space-3xl) var(--space-xl);
  color: var(--text3);
}
.broadcast-empty i {
  font-size: 3rem;
  margin-bottom: var(--space-md);
  opacity: 0.4;
}
.broadcast-empty p {
  font-family: var(--font-heading);
  font-size: var(--fs-md);
  color: var(--text2);
  margin-bottom: var(--space-xs);
}
.broadcast-empty__sub {
  font-size: var(--fs-sm) !important;
  color: var(--text3) !important;
  font-family: var(--font-body) !important;
}

/* Broadcast map panel */
.broadcast-map-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  border-bottom: 1px solid var(--border);
}
.broadcast-map-header h3 {
  font-family: var(--font-mono);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: var(--text2);
  margin: 0;
  display: flex;
  align-items: center;
  gap: 8px;
}
.broadcast-map-legend {
  display: flex;
  gap: 12px;
}
.broadcast-map-legend__item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--text3);
  text-transform: uppercase;
  letter-spacing: .5px;
}
.broadcast-map-legend__dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: inline-block;
}
.broadcast-map-legend__dot--live {
  background: #e53935;
  box-shadow: 0 0 6px rgba(229,57,53,.6);
  animation: livePulse 1.5s ease-in-out infinite;
}
.broadcast-map-legend__dot--video {
  background: var(--accent);
}

/* Blinking live marker on map */
.broadcast-marker-live {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #e53935;
  border: 2px solid #fff;
  box-shadow: 0 0 8px rgba(229,57,53,.7), 0 0 20px rgba(229,57,53,.3);
  animation: liveMarkerPulse 1.5s ease-in-out infinite;
}
@keyframes liveMarkerPulse {
  0%, 100% { transform: scale(1); box-shadow: 0 0 8px rgba(229,57,53,.7), 0 0 20px rgba(229,57,53,.3); }
  50% { transform: scale(1.3); box-shadow: 0 0 16px rgba(229,57,53,.9), 0 0 40px rgba(229,57,53,.5); }
}
.broadcast-marker-live::after {
  content: '';
  position: absolute;
  top: -6px; left: -6px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: 2px solid rgba(229,57,53,.4);
  animation: liveRing 2s ease-out infinite;
}
@keyframes liveRing {
  0% { transform: scale(1); opacity: 1; }
  100% { transform: scale(2.5); opacity: 0; }
}

/* Static video marker */
.broadcast-marker-video {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--accent);
  border: 2px solid #fff;
  box-shadow: 0 0 4px rgba(255,107,53,.5);
}

/* Map popup styling */
.broadcast-popup { font-family: var(--font-body); }
.broadcast-popup__title { font-family: var(--font-heading); font-size: 13px; font-weight: 600; margin-bottom: 4px; }
.broadcast-popup__meta { font-size: 11px; color: #888; }
.broadcast-popup__live { color: #e53935; font-weight: 700; font-size: 10px; text-transform: uppercase; letter-spacing: .5px; }


/* Upload dropzone */
.upload-dropzone {
  border: 2px dashed var(--border);
  border-radius: 8px;
  padding: var(--space-xl);
  text-align: center;
  cursor: pointer;
  transition: all var(--transition);
  background: var(--bg3);
}
.upload-dropzone:hover,
.upload-dropzone--dragover {
  border-color: var(--accent);
  background: rgba(255,107,53,0.05);
}
.upload-dropzone__content {
  pointer-events: none;
}
.upload-dropzone__content i {
  font-size: 2rem;
  color: var(--text3);
  margin-bottom: var(--space-sm);
}
.upload-dropzone__content p {
  color: var(--text2);
  font-size: var(--fs-sm);
  margin-bottom: var(--space-xs);
}
.upload-dropzone__content a {
  color: var(--accent);
  pointer-events: auto;
}
.upload-dropzone__sub {
  font-size: var(--fs-xs) !important;
  color: var(--text3) !important;
}
.upload-dropzone__hint {
  font-family: var(--font-mono);
  font-size: 10px !important;
  color: var(--text3) !important;
  letter-spacing: .3px;
  margin-top: var(--space-xs);
}

/* Upload progress */
.upload-progress {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  margin-top: var(--space-sm);
}
.upload-progress__bar {
  flex: 1;
  height: 6px;
  background: var(--bg3);
  border-radius: 3px;
  overflow: hidden;
}
.upload-progress__fill {
  height: 100%;
  background: var(--accent);
  border-radius: 3px;
  width: 0%;
  transition: width 0.3s ease;
}
.upload-progress__text {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--text2);
  min-width: 36px;
  text-align: right;
}

/* Section header sub */
.section-header__sub {
  font-size: var(--fs-sm);
  color: var(--text3);
  margin-top: var(--space-xs);
  font-family: var(--font-body);
}

/* Responsive */
@media (max-width: 600px) {
  .broadcast-grid {
    grid-template-columns: 1fr;
  }
  .broadcast-tabs {
    overflow-x: auto;
    scrollbar-width: none;
  }
  .broadcast-tabs::-webkit-scrollbar { display: none; }
  .broadcast-tab {
    padding: 8px 16px;
    font-size: 11px;
  }
}

/* ===== CREDIT WIDGET (Signal Points) ===== */
.credit-widget {
  background: var(--bg2);
  border: 1px solid var(--border);
  border-radius: var(--radius-md, 12px);
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.credit-widget--loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 32px;
  color: var(--text3);
  font-size: 13px;
}

/* Header: balance + meta */
.credit-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}
.credit-balance {
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.credit-balance__icon {
  font-size: 22px;
  color: var(--gold, #f5a623);
}
.credit-balance__amount {
  font-family: 'Space Mono', monospace;
  font-size: 32px;
  font-weight: 700;
  color: var(--gold, #f5a623);
  line-height: 1;
}
.credit-balance__label {
  font-family: 'Space Mono', monospace;
  font-size: 14px;
  color: var(--text3);
  letter-spacing: 1px;
  text-transform: uppercase;
}
.credit-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.credit-multiplier {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  background: var(--bg3);
  border: 1px solid var(--border);
  border-radius: 20px;
  font-family: 'Space Mono', monospace;
  font-size: 11px;
  color: var(--accent);
  letter-spacing: 0.3px;
}
.credit-multiplier i { font-size: 10px; }
.credit-streak {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  background: var(--bg3);
  border: 1px solid var(--border);
  border-radius: 20px;
  font-family: 'Space Mono', monospace;
  font-size: 11px;
  color: var(--red, #ff4d6a);
  letter-spacing: 0.3px;
}
.credit-streak i { color: var(--red, #ff4d6a); font-size: 10px; }

/* Section title */
.credit-section-title {
  font-family: 'Space Mono', monospace;
  font-size: 11px;
  color: var(--text3);
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-bottom: 10px;
}

/* Milestone progress bar */
.credit-milestone-bar {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.credit-milestone-bar__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.credit-milestone-bar__label {
  font-family: 'Space Mono', monospace;
  font-size: 12px;
  color: var(--text2);
}
.credit-milestone-bar__badge {
  font-family: 'Space Mono', monospace;
  font-size: 11px;
  color: var(--gold, #f5a623);
  letter-spacing: 0.5px;
}
.credit-milestone-bar__track {
  height: 8px;
  background: var(--bg3);
  border-radius: 4px;
  overflow: hidden;
}
.credit-milestone-bar__fill {
  height: 100%;
  background: linear-gradient(90deg, var(--accent), var(--gold, #f5a623));
  border-radius: 4px;
  transition: width 0.6s ease;
}

/* 7-day chart */
.credit-chart {
  display: flex;
  flex-direction: column;
}
.credit-chart__bars {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  height: 100px;
}
.credit-chart__col {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  height: 100%;
}
.credit-chart__value {
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  color: var(--text3);
  white-space: nowrap;
}
.credit-chart__bar-wrap {
  flex: 1;
  width: 100%;
  display: flex;
  align-items: flex-end;
}
.credit-chart__bar {
  width: 100%;
  background: var(--accent);
  border-radius: 3px 3px 0 0;
  min-height: 4px;
  transition: height 0.4s ease;
}
.credit-chart__label {
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  color: var(--text3);
  letter-spacing: 0.5px;
}

/* Milestones grid */
.credit-milestones__grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.credit-milestone-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: var(--bg3);
  border: 1px solid var(--border);
  border-radius: 20px;
  font-size: 12px;
  color: var(--gold, #f5a623);
}
.credit-milestone-badge i {
  font-size: 12px;
}

/* Transactions list */
.credit-transactions__list {
  max-height: 320px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.credit-transactions__empty {
  font-size: 13px;
  color: var(--text3);
  padding: 12px 0;
}
.credit-tx {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 12px;
  border-radius: 6px;
  transition: background var(--transition, 0.2s ease);
}
.credit-tx:hover {
  background: var(--bg3);
}
.credit-tx__info {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  flex: 1;
}
.credit-tx__desc {
  font-size: 13px;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.credit-tx__time {
  font-family: 'Space Mono', monospace;
  font-size: 10px;
  color: var(--text3);
}
.credit-tx__amount {
  font-family: 'Space Mono', monospace;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
  margin-left: 12px;
}
.credit-tx--earn .credit-tx__amount {
  color: var(--green, #00e5a0);
}
.credit-tx--deduct .credit-tx__amount {
  color: var(--red, #ff4d6a);
}

/* Responsive */
@media (max-width: 600px) {
  .credit-widget { padding: 16px; gap: 16px; }
  .credit-header { flex-direction: column; align-items: flex-start; }
  .credit-balance__amount { font-size: 24px; }
  .credit-chart__bars { height: 70px; }
}


/* ============================================================
   PAGE MODALS (About, Careers, Ethics, Contact)
   Full-screen overlay pages rendered from js/pages.js
   ============================================================ */

/* --- Overlay & Layout --- */
.page-modal {
  position: fixed; inset: 0; z-index: 9000;
  opacity: 0; visibility: hidden;
  transition: opacity var(--transition), visibility var(--transition);
}
.page-modal--active { opacity: 1; visibility: visible; }

.page-modal__backdrop {
  position: absolute; inset: 0;
  background: rgba(0, 0, 0, .7);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}

.page-modal__scroll {
  position: relative; z-index: 1;
  height: 100%; overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 60px 24px 80px;
}

.page-modal__content {
  position: relative;
  max-width: 820px; margin: 0 auto;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 0 0 48px;
  box-shadow: var(--shadow-lg);
  transform: translateY(20px);
  transition: transform var(--transition);
}
.page-modal--active .page-modal__content { transform: translateY(0); }

.page-modal__close {
  position: sticky; top: 0; float: right;
  z-index: 10;
  width: 44px; height: 44px;
  margin: 16px 16px 0 0;
  display: flex; align-items: center; justify-content: center;
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: 50%; color: var(--text2);
  font-size: 16px; cursor: pointer;
  transition: all var(--transition-fast);
}
.page-modal__close:hover {
  background: var(--accent); color: #fff; border-color: var(--accent);
}

/* --- Hero --- */
.page-hero {
  padding: 56px 48px 40px;
  border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, var(--bg3) 0%, var(--bg) 100%);
  border-radius: 16px 16px 0 0;
}
.page-hero__label {
  display: inline-block;
  font-family: var(--font-mono);
  font-size: var(--fs-xs); letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--accent);
  margin-bottom: 12px;
}
.page-hero__title {
  font-family: var(--font-heading);
  font-size: var(--fs-4xl); line-height: var(--lh-tight);
  color: var(--text); margin: 0 0 16px;
}
.page-hero__subtitle {
  font-size: var(--fs-md);
  color: var(--text2); line-height: var(--lh-normal);
  max-width: 620px; margin: 0;
}

/* --- Sections --- */
.page-section {
  padding: 40px 48px 0;
}
.page-section--cta {
  text-align: center;
  padding-top: 48px;
  padding-bottom: 8px;
}
.page-section__heading {
  font-family: var(--font-heading);
  font-size: var(--fs-2xl); color: var(--text);
  margin: 0 0 16px; line-height: var(--lh-snug);
}
.page-section__text {
  font-size: var(--fs-base); color: var(--text2);
  line-height: var(--lh-normal); margin: 0 0 14px;
}
.page-section__text:last-child { margin-bottom: 0; }

/* --- Lists (Ethics) --- */
.page-list {
  padding-left: 24px; margin: 12px 0 0;
  color: var(--text2); font-size: var(--fs-base);
  line-height: var(--lh-normal);
}
.page-list li { margin-bottom: 10px; }
.page-list li strong { color: var(--text); }
.page-list--ordered { list-style-type: decimal; }

/* --- How It Works Pillars (About) --- */
.page-pillars {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 24px; margin-top: 20px;
}
.page-pillar {
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: 12px; padding: 28px 24px;
  text-align: center;
  transition: border-color var(--transition-fast);
}
.page-pillar:hover { border-color: var(--accent); }
.page-pillar__icon {
  width: 52px; height: 52px; margin: 0 auto 16px;
  display: flex; align-items: center; justify-content: center;
  background: var(--accent-glow); border-radius: 50%;
  color: var(--accent); font-size: 20px;
}
.page-pillar h3 {
  font-family: var(--font-heading);
  font-size: var(--fs-lg); color: var(--text); margin: 0 0 8px;
}
.page-pillar p {
  font-size: var(--fs-sm); color: var(--text2);
  line-height: var(--lh-normal); margin: 0;
}

/* --- Values Grid (About & Careers) --- */
.page-values-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 20px; margin-top: 20px;
}
.page-value-card {
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: 12px; padding: 24px;
  transition: border-color var(--transition-fast);
}
.page-value-card:hover { border-color: var(--accent); }
.page-value-card__icon {
  width: 40px; height: 40px;
  display: flex; align-items: center; justify-content: center;
  background: var(--accent-glow); border-radius: 10px;
  color: var(--accent); font-size: 16px;
  margin-bottom: 14px;
}
.page-value-card__title {
  font-family: var(--font-heading);
  font-size: var(--fs-lg); color: var(--text);
  margin: 0 0 8px;
}
.page-value-card__desc {
  font-size: var(--fs-sm); color: var(--text2);
  line-height: var(--lh-normal); margin: 0;
}

/* --- Stats (About) --- */
.page-stats {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 20px; margin-top: 20px;
}
.page-stat {
  text-align: center;
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: 12px; padding: 28px 16px;
}
.page-stat__number {
  display: block;
  font-family: var(--font-heading);
  font-size: var(--fs-3xl); color: var(--accent);
  line-height: 1;
}
.page-stat__label {
  display: block; margin-top: 8px;
  font-family: var(--font-mono);
  font-size: var(--fs-xs); color: var(--text3);
  letter-spacing: 0.5px; text-transform: uppercase;
}

/* --- Job Cards (Careers) --- */
.page-jobs { display: flex; flex-direction: column; gap: 16px; margin-top: 8px; }
.page-job-card {
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: 12px; padding: 28px;
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}
.page-job-card:hover {
  border-color: var(--accent);
  box-shadow: 0 0 0 1px var(--accent-glow);
}
.page-job-card__header { margin-bottom: 12px; }
.page-job-card__title {
  font-family: var(--font-heading);
  font-size: var(--fs-xl); color: var(--text);
  margin: 0 0 8px;
}
.page-job-card__meta {
  display: flex; flex-wrap: wrap; gap: 16px;
  font-size: var(--fs-xs); color: var(--text3);
  font-family: var(--font-mono);
}
.page-job-card__meta i { margin-right: 4px; color: var(--accent); }
.page-job-card__desc {
  font-size: var(--fs-sm); color: var(--text2);
  line-height: var(--lh-normal); margin: 0 0 16px;
}

/* --- Contact Info Cards --- */
.page-contact-cards {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.page-contact-card {
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: 12px; padding: 24px; text-align: center;
  transition: border-color var(--transition-fast);
}
.page-contact-card:hover { border-color: var(--accent); }
.page-contact-card__icon {
  width: 48px; height: 48px; margin: 0 auto 14px;
  display: flex; align-items: center; justify-content: center;
  background: var(--accent-glow); border-radius: 50%;
  color: var(--accent); font-size: 18px;
}
.page-contact-card h3 {
  font-family: var(--font-heading);
  font-size: var(--fs-lg); color: var(--text);
  margin: 0 0 8px;
}
.page-contact-card a {
  font-size: var(--fs-sm); color: var(--accent);
  text-decoration: none;
}
.page-contact-card a:hover { text-decoration: underline; }

/* --- Contact Form --- */
.page-contact-form { margin-top: 8px; }
.page-form-row {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 16px; margin-bottom: 16px;
}
.page-form-group { margin-bottom: 16px; }
.page-form-row .page-form-group { margin-bottom: 0; }
.page-form-group label {
  display: block; margin-bottom: 6px;
  font-size: var(--fs-sm); color: var(--text2);
  font-family: var(--font-mono); font-weight: 600;
}
.page-contact-form .form-input {
  width: 100%; box-sizing: border-box;
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: 8px; padding: 12px 14px;
  color: var(--text); font-size: var(--fs-base);
  font-family: var(--font-body);
  transition: border-color var(--transition-fast);
}
.page-contact-form .form-input:focus {
  outline: none; border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-glow);
}
.page-contact-form select.form-input {
  appearance: none; -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%236b6862' viewBox='0 0 16 16'%3E%3Cpath d='M1.5 5.5l6.5 6 6.5-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 36px;
}
.page-contact-form textarea.form-input { resize: vertical; min-height: 120px; }

/* --- FAQ (Contact) --- */
.page-faq { margin-top: 8px; }
.page-faq__item {
  border-bottom: 1px solid var(--border);
  padding: 20px 0;
}
.page-faq__item:last-child { border-bottom: none; }
.page-faq__question {
  font-family: var(--font-heading);
  font-size: var(--fs-lg); color: var(--text);
  margin: 0 0 8px; cursor: default;
}
.page-faq__question i {
  font-size: 12px; color: var(--accent);
  margin-right: 8px;
}
.page-faq__answer {
  font-size: var(--fs-sm); color: var(--text2);
  line-height: var(--lh-normal); margin: 0;
  padding-left: 24px;
}

/* --- Social Links (Contact) --- */
.page-social {
  display: flex; justify-content: center; gap: 16px; margin-top: 16px;
}
.page-social__link {
  width: 48px; height: 48px;
  display: flex; align-items: center; justify-content: center;
  background: var(--bg2); border: 1px solid var(--border);
  border-radius: 50%; color: var(--text2);
  font-size: 18px; text-decoration: none;
  transition: all var(--transition-fast);
}
.page-social__link:hover {
  background: var(--accent); color: #fff; border-color: var(--accent);
}

/* --- Footer legal links --- */
.footer__legal-link {
  color: inherit; text-decoration: none;
  transition: color var(--transition-fast);
}
.footer__legal-link:hover { color: var(--accent); }

/* --- Community Guidelines page --- */
.page-list {
  list-style: none; padding: 0; margin: var(--space-md) 0 0;
}
.page-list li {
  padding: 10px 0 10px 24px; position: relative;
  color: var(--text2); font-size: var(--fs-sm); line-height: 1.7;
  border-bottom: 1px solid var(--border);
}
.page-list li:last-child { border-bottom: none; }
.page-list li::before {
  content: ''; position: absolute; left: 0; top: 18px;
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--accent);
}
.page-list li strong { color: var(--text); }

.page-prohibited-grid {
  display: grid; grid-template-columns: repeat(2, 1fr);
  gap: 10px; margin-top: var(--space-md);
}
.page-prohibited-item {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 16px; background: rgba(229,57,53,.06);
  border: 1px solid rgba(229,57,53,.15); border-radius: 8px;
  font-size: var(--fs-sm); color: var(--text2);
}
.page-prohibited-item i { color: var(--red); flex-shrink: 0; }

.page-enforcement { margin-top: var(--space-md); }
.page-enforcement-step {
  display: flex; align-items: flex-start; gap: 16px;
  padding: 16px 0; border-bottom: 1px solid var(--border);
}
.page-enforcement-step:last-child { border-bottom: none; }
.page-enforcement-step__num {
  width: 32px; height: 32px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%; background: var(--accent); color: #fff;
  font-family: var(--font-mono); font-size: var(--fs-sm); font-weight: 700;
}
.page-enforcement-step__info strong {
  display: block; color: var(--text); font-size: var(--fs-base); margin-bottom: 4px;
}
.page-enforcement-step__info p {
  color: var(--text2); font-size: var(--fs-sm); line-height: 1.6; margin: 0;
}

@media (max-width: 600px) {
  .page-prohibited-grid { grid-template-columns: 1fr; }
}

/* --- Cookie policy table --- */
.page-cookie-table { margin-top: var(--space-md); border: 1px solid var(--border); border-radius: 8px; overflow: hidden; }
.page-cookie-row {
  display: grid; grid-template-columns: 1.5fr 0.8fr 2fr 0.8fr;
  padding: 10px 16px; font-size: var(--fs-sm); color: var(--text2);
  border-bottom: 1px solid var(--border);
}
.page-cookie-row:last-child { border-bottom: none; }
.page-cookie-row--header {
  background: var(--bg3); font-family: var(--font-mono); font-size: 11px;
  text-transform: uppercase; letter-spacing: .5px; color: var(--text3); font-weight: 700;
}
.page-cookie-row code {
  font-family: var(--font-mono); font-size: 11px; color: var(--accent);
  background: rgba(255,107,53,.08); padding: 2px 6px; border-radius: 3px;
}
.page-cookie-types { margin-top: var(--space-md); display: flex; flex-direction: column; gap: 16px; }
.page-cookie-type {
  display: flex; align-items: flex-start; gap: 16px;
  padding: 16px; background: var(--bg2); border: 1px solid var(--border); border-radius: 8px;
}
.page-cookie-type__icon {
  width: 40px; height: 40px; flex-shrink: 0; border-radius: 8px;
  display: flex; align-items: center; justify-content: center; color: #fff; font-size: 16px;
}
.page-cookie-type strong { display: block; color: var(--text); margin-bottom: 4px; }
.page-cookie-type p { color: var(--text2); font-size: var(--fs-sm); line-height: 1.6; margin: 0; }

@media (max-width: 600px) {
  .page-cookie-row { grid-template-columns: 1fr 1fr; gap: 4px; }
  .page-cookie-row--header span:nth-child(3),
  .page-cookie-row--header span:nth-child(4),
  .page-cookie-row span:nth-child(3),
  .page-cookie-row span:nth-child(4) { display: none; }
}

/* --- Buttons used in pages --- */
.btn--lg { padding: 14px 32px; font-size: var(--fs-base); }

/* --- Responsive --- */
@media (max-width: 768px) {
  .page-modal__scroll { padding: 32px 12px 60px; }
  .page-modal__content { border-radius: 12px; }
  .page-hero { padding: 40px 28px 32px; }
  .page-hero__title { font-size: var(--fs-2xl); }
  .page-section { padding: 32px 28px 0; }
  .page-pillars { grid-template-columns: 1fr; }
  .page-values-grid { grid-template-columns: 1fr; }
  .page-stats { grid-template-columns: repeat(2, 1fr); }
  .page-contact-cards { grid-template-columns: 1fr; }
  .page-form-row { grid-template-columns: 1fr; }
  .page-job-card__meta { gap: 10px; }
}

@media (max-width: 480px) {
  .page-hero { padding: 32px 20px 24px; }
  .page-hero__title { font-size: var(--fs-xl); }
  .page-hero__subtitle { font-size: var(--fs-sm); }
  .page-section { padding: 24px 20px 0; }
  .page-section__heading { font-size: var(--fs-xl); }
  .page-stats { grid-template-columns: 1fr 1fr; gap: 12px; }
  .page-stat { padding: 20px 12px; }
  .page-stat__number { font-size: var(--fs-2xl); }
}

/* ============================================================
   S9C WALLET WIDGET
   ============================================================ */
.wallet-widget {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 0;
  overflow: hidden;
  margin-top: 20px;
}
.wallet-widget--loading {
  padding: 24px;
  text-align: center;
  color: var(--text3);
}
.wallet-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 24px;
  background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%);
  border-bottom: 1px solid var(--border);
}
.wallet-title {
  font-family: var(--font-heading);
  font-size: var(--fs-lg);
  color: #ffc107;
  display: flex;
  align-items: center;
  gap: 8px;
}
.wallet-title i { font-size: var(--fs-xl); }
.wallet-subtitle {
  font-family: var(--font-mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: rgba(255,255,255,0.5);
  margin-top: 2px;
}
.wallet-balance {
  text-align: right;
}
.wallet-balance__amount {
  font-family: var(--font-heading);
  font-size: var(--fs-2xl);
  color: #ffc107;
  font-weight: 700;
}
.wallet-balance__label {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  color: rgba(255,255,255,0.6);
  margin-left: 4px;
}
.wallet-usd {
  font-family: var(--font-mono);
  font-size: var(--fs-sm);
  color: var(--green, #00c853);
  text-align: right;
  margin-top: 2px;
}
.wallet-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-bottom: 1px solid var(--border);
}
.wallet-stat {
  padding: 14px 16px;
  text-align: center;
  border-right: 1px solid var(--border);
}
.wallet-stat:last-child { border-right: none; }
.wallet-stat__value {
  font-family: var(--font-heading);
  font-size: var(--fs-lg);
  color: var(--text);
  font-weight: 700;
}
.wallet-stat__label {
  font-family: var(--font-mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: var(--text3);
  margin-top: 2px;
}
.wallet-section {
  padding: 16px 24px;
  border-bottom: 1px solid var(--border);
}
.wallet-section:last-child { border-bottom: none; }
.wallet-section__title {
  font-family: var(--font-mono);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--text3);
  margin-bottom: 12px;
}
.wallet-earn-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}
.wallet-earn-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  background: var(--bg2);
  border-radius: 6px;
  font-size: var(--fs-sm);
}
.wallet-earn-item i {
  color: #ffc107;
  width: 16px;
  text-align: center;
}
.wallet-earn-item__label {
  flex: 1;
  color: var(--text2);
}
.wallet-earn-item__amount {
  font-family: var(--font-mono);
  font-weight: 700;
  color: var(--green, #00c853);
}
.wallet-tiers {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.wallet-tier {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 12px;
  border-radius: 6px;
  background: var(--bg2);
  font-size: var(--fs-sm);
}
.wallet-tier--active {
  background: rgba(255, 193, 7, 0.1);
  border: 1px solid rgba(255, 193, 7, 0.3);
}
.wallet-tier__label { color: var(--text2); }
.wallet-tier__rate {
  font-family: var(--font-mono);
  color: var(--text);
  font-weight: 600;
}
.wallet-tier--active .wallet-tier__rate { color: #ffc107; }
.wallet-withdraw {
  padding: 16px 24px;
  border-bottom: 1px solid var(--border);
}
.wallet-withdraw__btn {
  width: 100%;
  padding: 12px;
  font-size: var(--fs-base);
  font-weight: 700;
  border-radius: 8px;
  cursor: pointer;
}
.wallet-withdraw__locked {
  text-align: center;
  padding: 12px;
  background: var(--bg2);
  border-radius: 8px;
  color: var(--text3);
  font-size: var(--fs-sm);
}
.wallet-withdraw__locked i { margin-right: 6px; }
.wallet-tx-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.wallet-tx {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid var(--border);
}
.wallet-tx:last-child { border-bottom: none; }
.wallet-tx__icon {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
}
.wallet-tx--earn .wallet-tx__icon { background: rgba(0,200,83,0.15); color: var(--green, #00c853); }
.wallet-tx--spend .wallet-tx__icon { background: rgba(229,57,53,0.15); color: var(--red, #e53935); }
.wallet-tx__info { flex: 1; }
.wallet-tx__desc {
  font-size: var(--fs-sm);
  color: var(--text);
  display: block;
}
.wallet-tx__time {
  font-family: var(--font-mono);
  font-size: 10px;
  color: var(--text3);
}
.wallet-tx__amount {
  font-family: var(--font-mono);
  font-weight: 700;
  font-size: var(--fs-sm);
}
.wallet-tx--earn .wallet-tx__amount { color: var(--green, #00c853); }
.wallet-tx--spend .wallet-tx__amount { color: var(--red, #e53935); }

/* Withdrawal Modal */
.modal--withdraw {
  max-width: 480px;
}
.withdraw-preview {
  background: linear-gradient(135deg, #1a1a2e, #0f3460);
  border-radius: 10px;
  padding: 20px;
  text-align: center;
  margin-bottom: 16px;
}
.withdraw-preview__label {
  display: block;
  font-family: var(--font-mono);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: rgba(255,255,255,0.5);
  margin-bottom: 4px;
}
.withdraw-preview__amount {
  display: block;
  font-family: var(--font-heading);
  font-size: 32px;
  font-weight: 700;
  color: var(--green, #00c853);
}
.withdraw-preview__rate {
  display: block;
  font-family: var(--font-mono);
  font-size: 10px;
  color: rgba(255,255,255,0.4);
  margin-top: 4px;
}
.payment-methods {
  display: flex;
  gap: 8px;
  margin-bottom: 12px;
}
.payment-method {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 10px;
  background: var(--bg2);
  border: 1px solid var(--border);
  border-radius: 8px;
  cursor: pointer;
  font-size: var(--fs-sm);
  color: var(--text2);
  transition: border-color 0.2s;
}
.payment-method:has(input:checked) {
  border-color: #ffc107;
  color: var(--text);
}
.payment-method input { display: none; }
.payment-method i { font-size: var(--fs-lg); }
.withdraw-notice {
  margin-top: 12px;
  font-size: var(--fs-xs);
  color: var(--text3);
  text-align: center;
}
.withdraw-notice i { margin-right: 4px; }

/* Admin Withdrawal Cards */
.withdrawal-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-left: 3px solid #ffc107;
  border-radius: 8px;
  padding: 16px;
  margin-bottom: 12px;
}
.withdrawal-card__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}
.withdrawal-card__user {
  color: var(--text);
  font-size: var(--fs-sm);
}
.withdrawal-card__time {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--text3);
}
.withdrawal-card__details {
  margin-bottom: 12px;
}
.withdrawal-card__amount {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 6px;
}
.withdrawal-card__coins {
  font-family: var(--font-heading);
  font-size: var(--fs-lg);
  color: #ffc107;
  font-weight: 700;
}
.withdrawal-card__usd {
  font-family: var(--font-mono);
  color: var(--green, #00c853);
  font-weight: 600;
}
.withdrawal-card__method {
  font-size: var(--fs-sm);
  color: var(--text2);
}
.withdrawal-card__actions {
  display: flex;
  gap: 8px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
}

/* ===== ROLE BADGES ===== */
.role-badge {
  display:inline-flex; align-items:center; gap:4px;
  font-family:'Space Mono',monospace; font-size:10px;
  letter-spacing:.5px; text-transform:uppercase;
  padding:3px 10px; border-radius:3px;
  font-weight:700; vertical-align:middle;
}
.role-badge--superadmin {
  background:linear-gradient(135deg, #ffc107, #ff9800);
  color:#3e2723;
}
.role-badge--moderator {
  background:var(--accent, #1a73e8);
  color:#fff;
}
.role-badge--user {
  background:var(--bg3, #333);
  color:var(--text2, #aaa);
}

/* ===== ADMIN USER MANAGEMENT ===== */
.admin-user-list {
  display:flex; flex-direction:column; gap:8px;
}
.admin-user-card {
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 18px; border-radius:8px;
  background:var(--bg2, #1a1a2e); border:1px solid var(--border, #2a2a4a);
  transition:all var(--transition, .2s);
}
.admin-user-card:hover {
  border-color:var(--accent, #1a73e8);
  background:var(--bg3, #222244);
}
.admin-user-card__info {
  display:flex; flex-direction:column; gap:3px;
}
.admin-user-card__info strong {
  font-size:14px; color:var(--text, #fff);
}
.admin-user-card__email {
  font-family:'Space Mono',monospace; font-size:11px;
  color:var(--text3, #666); letter-spacing:.3px;
}
.admin-user-card__meta {
  font-size:11px; color:var(--text3, #666);
}
.admin-user-card__actions {
  display:flex; gap:8px; align-items:center;
}

/* ===== LEVEL SELECT DROPDOWN ===== */
.mod-level-select {
  background:var(--bg3); color:var(--text); border:1px solid var(--border);
  border-radius:6px; padding:5px 10px; font-size:11px;
  cursor:pointer; outline:none; font-family:inherit;
  transition:border-color var(--transition);
}
.mod-level-select:hover, .mod-level-select:focus {
  border-color:var(--accent);
}
.mod-level-select option { background:var(--bg2); color:var(--text); }

/* ===== PROMOTE / DEMOTE BUTTONS ===== */
.btn--promote {
  background:#43a047; border-color:#43a047; color:#fff;
  padding:6px 14px; font-size:11px;
}
.btn--promote:hover {
  background:#388e3c; border-color:#388e3c;
}
.btn--demote {
  background:#e53935; border-color:#e53935; color:#fff;
  padding:6px 14px; font-size:11px;
}
.btn--demote:hover {
  background:#c62828; border-color:#c62828;
}

/* ===== FOLLOW BUTTON ===== */
.btn--follow {
  background:var(--accent); border-color:var(--accent); color:#fff;
  padding:6px 14px; font-size:11px; gap:6px;
  transition:all .2s ease;
}
.btn--follow:hover {
  background:#e64a19; border-color:#e64a19;
}
.btn--follow.btn--following {
  background:transparent; border-color:var(--border); color:var(--text2);
}
.btn--follow.btn--following:hover {
  border-color:var(--red); color:var(--red);
}

/* Small follow button on report cards */
.follow-btn {
  display:inline-flex; align-items:center; justify-content:center;
  background:none; border:1px solid var(--border); color:var(--text3);
  border-radius:6px; padding:3px 8px; font-size:11px; cursor:pointer;
  transition:all .2s ease; gap:4px; white-space:nowrap;
}
.follow-btn:hover {
  border-color:var(--accent); color:var(--accent);
}
.follow-btn--following {
  border-color:var(--accent); color:var(--accent); background:rgba(255,87,34,.08);
}
.follow-btn--following:hover {
  border-color:var(--red); color:var(--red); background:rgba(229,57,53,.08);
}
.follow-btn--card {
  margin-left:auto; flex-shrink:0;
}
.follow-btn:disabled { opacity:.5; cursor:wait; }

/* ===== PROFILE FOLLOW STATS ===== */
.profile-follow-stats {
  display:flex; gap:20px; margin-top:8px;
}
a.profile-follow-stat {
  font-size:13px; color:var(--text2); text-decoration:none; cursor:pointer;
  padding:4px 8px; border-radius:6px; transition: background .2s;
}
a.profile-follow-stat:hover {
  background:rgba(255,255,255,.06); color:var(--accent);
}
a.profile-follow-stat:hover strong {
  color:var(--accent);
}
.profile-follow-stat strong {
  color:var(--text); font-weight:700;
}

/* --- Follow List Modal --- */
.follow-list-modal .modal__body {
  padding:0; max-height:420px; overflow-y:auto;
}
.follow-list__loading {
  text-align:center; padding:40px; color:var(--muted); font-size:20px;
}
.follow-list__empty {
  text-align:center; padding:40px 24px; color:var(--muted);
}
.follow-list__empty i {
  font-size:32px; margin-bottom:12px; display:block; opacity:.4;
}
.follow-list__empty p {
  margin:0; font-size:14px;
}
.follow-list {
  display:flex; flex-direction:column;
}
.follow-list__item {
  display:flex; align-items:center; gap:12px;
  padding:12px 20px; border-bottom:1px solid var(--border);
  cursor:pointer; transition: background .15s;
}
.follow-list__item:last-child { border-bottom:none; }
.follow-list__item:hover { background:rgba(255,255,255,.03); }
.follow-list__avatar {
  width:40px; height:40px; border-radius:50%; object-fit:cover; flex-shrink:0;
}
.follow-list__avatar--initial {
  display:flex; align-items:center; justify-content:center;
  background:var(--accent); color:#fff; font-weight:700; font-size:16px;
}
.follow-list__info {
  flex:1; min-width:0; display:flex; flex-direction:column; gap:2px;
}
.follow-list__name {
  font-weight:600; font-size:14px; color:var(--text);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.follow-list__level {
  font-size:11px; color:var(--muted);
}
.follow-list__level i { margin-right:4px; }
.follow-list__item .btn--follow {
  flex-shrink:0; font-size:11px; padding:5px 12px;
}
.follow-list__item .btn--follow span {
  display:inline;
}
/* RTL */
[dir="rtl"] .follow-list__level i { margin-right:0; margin-left:4px; }
[dir="rtl"] .follow-list__item .btn--follow { margin-left:0; margin-right:auto; }

/* ===== FEED MODE TOGGLE ===== */
.feed-mode-toggle {
  display:flex; gap:8px; margin-bottom:16px;
}
.feed-mode-btn {
  display:inline-flex; align-items:center; gap:6px;
  background:transparent; border:1px solid var(--border);
  color:var(--text3); padding:6px 16px; border-radius:8px;
  font-size:13px; font-weight:600; cursor:pointer;
  transition:all .2s ease; font-family:inherit;
}
.feed-mode-btn:hover {
  border-color:var(--text2); color:var(--text2);
}
.feed-mode-btn.feed-mode--active {
  background:var(--accent); border-color:var(--accent); color:#fff;
}

/* ===== COMMUNITY HUB ===== */
.community-toolbar {
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:12px; margin-bottom:16px;
}
.community-filters {
  display:flex; gap:6px; flex-wrap:wrap;
}
.community-filter-btn {
  display:inline-flex; align-items:center; gap:4px;
  background:var(--bg2); border:1px solid var(--border);
  color:var(--text3); padding:6px 14px; border-radius:20px;
  font-size:12px; font-weight:600; cursor:pointer;
  transition:all .2s ease; font-family:inherit;
}
.community-filter-btn:hover { border-color:var(--text2); color:var(--text2); }
.community-filter-btn.community-filter--active {
  background:var(--accent); border-color:var(--accent); color:#fff;
}

.community-sort {
  display:flex; gap:6px;
}
.community-sort-btn {
  display:inline-flex; align-items:center; gap:5px;
  background:transparent; border:1px solid var(--border);
  color:var(--text3); padding:6px 14px; border-radius:6px;
  font-size:12px; cursor:pointer; transition:all .2s ease;
  font-family:inherit;
}
.community-sort-btn:hover { border-color:var(--text2); color:var(--text2); }
.community-sort-btn.community-sort--active {
  background:var(--bg3); border-color:var(--accent); color:var(--accent);
}

/* 3-column layout */
.community-layout {
  display:grid;
  grid-template-columns:240px 1fr 280px;
  gap:24px;
  align-items:start;
}
.community-sidebar {
  position:sticky; top:80px;
}
.community-main {
  min-width:0;
}

/* Sidebar widgets */
.community-widget {
  background:var(--bg2); border:1px solid var(--border);
  border-radius:10px; padding:16px; margin-bottom:16px;
}
.community-widget__title {
  font-size:13px; font-weight:700; color:var(--text);
  margin:0 0 12px; display:flex; align-items:center; gap:8px;
  text-transform:uppercase; letter-spacing:0.5px;
}
.community-widget__title i { color:var(--accent); font-size:14px; }

.community-widget__list {
  list-style:none; margin:0; padding:0;
  display:flex; flex-direction:column; gap:8px;
}
.community-widget__list li {
  font-size:12px; color:var(--text2); display:flex; align-items:center; gap:8px;
  line-height:1.4;
}
.community-widget__list li .fa-check-circle { color:#43a047; font-size:11px; flex-shrink:0; }
.community-widget__list li .fa-times-circle { color:#e53935; font-size:11px; flex-shrink:0; }

.community-widget__tags {
  display:flex; flex-wrap:wrap; gap:6px;
}
.community-sidebar-tag {
  display:inline-flex; align-items:center; gap:4px;
  background:var(--bg3); border:1px solid var(--border);
  color:var(--accent); padding:4px 10px; border-radius:14px;
  font-size:11px; font-weight:600; cursor:pointer;
  transition:all .2s ease;
}
.community-sidebar-tag:hover { border-color:var(--accent); }
.community-sidebar-tag__count {
  color:var(--text3); font-weight:400; font-size:10px;
}

.community-widget__stats {
  display:flex; flex-direction:column; gap:8px;
}
.community-stat-row {
  display:flex; justify-content:space-between; align-items:center;
  font-size:12px; color:var(--text2);
}
.community-stat-row i { margin-right:4px; }
.community-stat-row__count {
  font-weight:700; color:var(--text);
  background:var(--bg3); padding:2px 8px; border-radius:10px;
  font-size:11px;
}

.community-widget__empty {
  color:var(--text3); font-size:12px; text-align:center; padding:12px 0; margin:0;
}

/* Trending list */
.community-trending-list {
  display:flex; flex-direction:column; gap:2px;
}
.community-trending-item {
  display:flex; gap:10px; align-items:flex-start;
  padding:8px 6px; border-radius:6px; cursor:pointer;
  transition:background .2s ease;
}
.community-trending-item:hover { background:var(--bg3); }
.community-trending-rank {
  font-size:14px; font-weight:800; color:var(--accent);
  min-width:20px; text-align:center; line-height:1.4;
}
.community-trending-body { min-width:0; flex:1; }
.community-trending-text {
  font-size:12px; color:var(--text); margin:0 0 4px;
  line-height:1.4; word-break:break-word;
}
.community-trending-meta {
  display:flex; gap:10px; font-size:11px; color:var(--text3);
}
.community-trending-meta i { margin-right:2px; }

/* Top contributors */
.community-top-list {
  display:flex; flex-direction:column; gap:6px;
}
.community-top-item {
  display:flex; justify-content:space-between; align-items:center;
  font-size:12px; padding:4px 0;
}
.community-top-item__name {
  color:var(--text2); display:flex; align-items:center; gap:6px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.community-top-item__name i { color:var(--accent); }
.community-top-item__stat {
  color:var(--text3); font-size:11px; white-space:nowrap;
}
.community-top-item__stat i { color:#43a047; margin-right:2px; }

/* Header bar: New Post + controls */
.community-header-bar {
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; margin-bottom:16px; flex-wrap:wrap;
}
.community-header-controls {
  display:flex; align-items:center; gap:8px;
}
.community-toggle {
  display:inline-flex; align-items:center;
  background:var(--bg); border:1px solid var(--border);
  border-radius:8px; padding:2px; overflow:hidden;
}
.community-toggle__btn {
  display:inline-flex; align-items:center; gap:5px;
  padding:6px 12px; background:none; border:none; border-radius:6px;
  color:var(--text3); font-size:11px; font-weight:600;
  cursor:pointer; transition:all .15s ease; white-space:nowrap;
  font-family:inherit;
}
.community-toggle__btn:hover { color:var(--text2); }
.community-toggle__btn--active {
  background:var(--accent); color:#fff;
}

/* Sidebar filter buttons (vertical) */
.community-widget__filters {
  display:flex; flex-direction:column; gap:4px;
}
.community-widget__filters .community-filter-btn {
  width:100%; justify-content:flex-start; border-radius:6px; padding:7px 12px;
}

.community-create-bar {
  margin-bottom:20px;
}

/* Empty state */
.community-empty {
  text-align:center; padding:60px 20px; color:var(--text3);
}
.community-empty i { font-size:48px; margin-bottom:16px; opacity:.4; }
.community-empty p { font-size:16px; margin:0; }
.community-empty__sub { font-size:13px; margin-top:6px !important; opacity:.7; }

/* Post list */
.community-posts {
  display:flex; flex-direction:column; gap:12px;
}

/* Post card */
.community-post {
  display:flex; gap:12px;
  background:var(--bg2); border:1px solid var(--border);
  border-radius:10px; padding:16px;
  transition:border-color .2s ease; cursor:pointer;
}
.community-post:hover { border-color:var(--accent); }

/* Vote column */
.community-vote-col {
  display:flex; flex-direction:column; align-items:center;
  gap:2px; flex-shrink:0; min-width:36px;
}
.community-vote-col--lg { min-width:44px; }
.community-vote-btn {
  background:none; border:none; color:var(--text3);
  cursor:pointer; padding:4px 6px; border-radius:4px;
  font-size:14px; transition:all .15s ease;
  display:flex; align-items:center; justify-content:center;
}
.community-vote-btn:hover { color:var(--accent); background:var(--bg3); }
.community-vote-btn.community-vote--active.community-vote-up { color:#43a047; }
.community-vote-btn.community-vote--active.community-vote-down { color:#e53935; }
.community-vote-btn--sm { font-size:11px; padding:2px 4px; }
.community-vote-score {
  font-family:'Space Mono',monospace; font-size:14px;
  font-weight:700; color:var(--text);
}
.community-vote-score--sm { font-size:11px; }

/* Post body */
.community-post__body { flex:1; min-width:0; }
.community-post__header {
  display:flex; align-items:center; gap:8px; margin-bottom:8px;
  flex-wrap:wrap;
}
.community-type-badge {
  display:inline-flex; align-items:center; gap:4px;
  padding:3px 10px; border-radius:12px;
  font-size:11px; font-weight:700; color:#fff;
  text-transform:uppercase; letter-spacing:.3px;
}
.community-pinned {
  display:inline-flex; align-items:center; gap:4px;
  font-size:11px; color:var(--accent); font-weight:600;
}
.community-post__content {
  font-size:14px; color:var(--text); line-height:1.6;
  margin-bottom:8px; word-break:break-word;
  display:-webkit-box; -webkit-line-clamp:3;
  -webkit-box-orient:vertical; overflow:hidden;
}
.community-post__tags {
  display:flex; gap:6px; flex-wrap:wrap; margin-bottom:8px;
}
.community-tag {
  font-size:11px; color:var(--accent); font-family:'Space Mono',monospace;
  background:rgba(255,87,34,.08); padding:2px 8px; border-radius:4px;
}
.community-post__meta {
  display:flex; align-items:center; gap:14px;
  font-size:12px; color:var(--text3); flex-wrap:wrap;
}
.community-post__author { display:flex; align-items:center; gap:5px; }
.community-post__replies { display:flex; align-items:center; gap:4px; }
.community-flag-btn {
  background:none; border:none; color:var(--text3);
  cursor:pointer; font-size:12px; padding:2px 4px;
  transition:color .2s ease;
}
.community-flag-btn:hover { color:#e53935; }
.community-delete-btn {
  background:none; border:none; color:#e53935;
  cursor:pointer; font-size:12px; padding:2px 4px;
  transition:color .2s ease; margin-left:auto;
}
.community-delete-btn:hover { color:#ff6659; }

/* Detail view */
.community-detail {
  display:flex; gap:16px;
  background:var(--bg2); border:1px solid var(--border);
  border-radius:10px; padding:20px; margin-top:12px;
}
.community-detail__body { flex:1; min-width:0; }
.community-detail__content {
  font-size:15px; color:var(--text); line-height:1.7;
  margin-bottom:12px; word-break:break-word; white-space:pre-wrap;
}
.community-detail__image { margin-bottom:12px; }
.community-detail__image img {
  max-width:100%; border-radius:8px; border:1px solid var(--border);
}

/* Reply form */
.community-reply-form {
  display:flex; gap:8px; align-items:flex-start;
  margin:16px 0; padding:12px; background:var(--bg3);
  border-radius:8px; border:1px solid var(--border);
}
.community-reply-form textarea {
  flex:1; min-height:50px; resize:vertical;
}

/* Replies */
.community-replies { margin-top:20px; }
.community-replies__title {
  font-size:14px; color:var(--text2); margin-bottom:12px;
  display:flex; align-items:center; gap:6px;
}
.community-reply {
  padding:12px; margin-bottom:8px;
  background:var(--bg3); border:1px solid var(--border);
  border-radius:8px; border-left:3px solid var(--border2);
}
.community-reply__header {
  display:flex; align-items:center; gap:10px;
  font-size:12px; color:var(--text3); margin-bottom:6px;
}
.community-reply__author { display:flex; align-items:center; gap:4px; font-weight:600; color:var(--text2); }
.community-reply__content {
  font-size:13px; color:var(--text); line-height:1.6;
  margin-bottom:6px; word-break:break-word;
}
.community-reply__actions {
  display:flex; align-items:center; gap:8px; font-size:12px;
}
.community-reply-btn {
  background:none; border:none; color:var(--text3);
  cursor:pointer; font-size:11px; display:flex;
  align-items:center; gap:4px; padding:2px 6px;
  transition:color .2s ease;
}
.community-reply-btn:hover { color:var(--accent); }

/* Inline reply */
.community-inline-reply-box {
  display:flex; gap:8px; align-items:flex-start;
  margin-top:8px; padding:8px; background:var(--bg2);
  border-radius:6px; border:1px solid var(--border);
}
.community-inline-textarea { flex:1; min-height:40px; resize:vertical; font-size:13px; }

/* Create post modal */
.community-modal-overlay {
  position:fixed; inset:0; z-index:1000;
  background:rgba(0,0,0,.65); backdrop-filter:blur(4px);
  display:flex; align-items:center; justify-content:center;
  padding:20px;
  opacity:1; visibility:visible; pointer-events:auto;
}
.community-modal {
  background:var(--bg); border:1px solid var(--border);
  border-radius:12px; width:100%; max-width:540px;
  max-height:90vh; overflow-y:auto;
  transform:none; opacity:1;
  box-shadow:0 24px 64px rgba(0,0,0,.6);
}
.community-modal .modal__header {
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 20px; border-bottom:1px solid var(--border);
}
.community-modal .modal__header h3 {
  font-size:16px; color:var(--text); margin:0;
}
.community-modal .modal__close {
  background:none; border:none; color:var(--text3);
  cursor:pointer; font-size:16px; padding:4px;
}
.community-modal .modal__close:hover { color:var(--text); }
.community-modal .modal__body { padding:20px; }
.community-modal .form-actions { padding:12px 20px 16px; }

/* Post detail modal */
.community-detail-modal {
  max-width:680px; max-height:85vh;
}
.community-detail-modal__body {
  padding:20px; overflow-y:auto; max-height:calc(85vh - 60px);
}
.community-detail__post { margin-bottom:0; }
.community-detail__content {
  font-size:15px; line-height:1.6; color:var(--text);
  white-space:pre-wrap; margin-bottom:12px;
}
.community-detail__image { margin:12px 0; }
.community-detail__image img { max-width:100%; border-radius:8px; }
.community-detail__actions {
  display:flex; align-items:center; gap:8px;
  padding:8px 0; margin-top:4px;
}
.community-detail__actions .community-flag-btn { margin-left:auto; }

/* Legacy openmic toolbar (kept for compat) */
.openmic-toolbar { display:none; }

/* Type selector */
.community-type-selector {
  display:flex; gap:6px; flex-wrap:wrap;
}
.community-type-option {
  display:inline-flex; align-items:center; gap:5px;
  padding:6px 14px; border-radius:20px;
  border:1px solid var(--border); background:var(--bg2);
  color:var(--text3); font-size:12px; font-weight:600;
  cursor:pointer; transition:all .2s ease;
}
.community-type-option:hover { border-color:var(--type-color, var(--text2)); color:var(--type-color, var(--text2)); }
.community-type-option--active {
  background:var(--type-color, var(--accent)); border-color:var(--type-color, var(--accent));
  color:#fff;
}

.community-char-count {
  float:right; font-weight:400; color:var(--text3);
}

/* Responsive */
@media (max-width:1100px) {
  .community-layout { grid-template-columns:1fr 260px; }
  .community-sidebar--left { display:none; }
}
@media (max-width:800px) {
  .community-layout { grid-template-columns:1fr; }
  .community-sidebar--right { display:none; }
}
@media (max-width:640px) {
  .community-header-bar { flex-direction:column; align-items:stretch; }
  .community-header-controls { justify-content:center; flex-wrap:wrap; }
  .community-detail { flex-direction:column; }
  .community-vote-col { flex-direction:row; }
  .community-vote-col--lg { flex-direction:row; }
  .community-reply-form { flex-direction:column; }
}

/* ============================================================
   CONFIRM DIALOG
   ============================================================ */
.s9-confirm-overlay {
  position:fixed; inset:0; z-index:99999;
  background:rgba(0,0,0,0.7); backdrop-filter:blur(4px);
  display:flex; align-items:center; justify-content:center;
  opacity:0; transition:opacity .25s ease;
}
.s9-confirm-overlay--visible { opacity:1; }
.s9-confirm {
  background:var(--bg2, #1a1a2e); border:1px solid var(--border, #2a2a4a);
  border-radius:12px; padding:28px 32px 24px; max-width:380px; width:90%;
  text-align:center; transform:scale(0.92); transition:transform .25s ease;
  box-shadow:0 8px 32px rgba(0,0,0,0.5);
}
.s9-confirm-overlay--visible .s9-confirm { transform:scale(1); }
.s9-confirm__icon {
  font-size:32px; color:#e53935; margin-bottom:12px;
}
.s9-confirm__title {
  color:var(--text1, #fff); font-family:var(--font-display, 'Orbitron', sans-serif);
  font-size:16px; font-weight:700; margin:0 0 8px; text-transform:uppercase;
  letter-spacing:1px;
}
.s9-confirm__msg {
  color:var(--text2, #aaa); font-size:13px; line-height:1.5; margin:0 0 20px;
}
.s9-confirm__actions {
  display:flex; gap:10px; justify-content:center;
}
.s9-confirm__btn {
  border:none; border-radius:6px; padding:10px 24px; font-size:13px;
  font-weight:600; cursor:pointer; transition:all .2s ease;
  text-transform:uppercase; letter-spacing:0.5px;
}
.s9-confirm__btn--cancel {
  background:var(--bg3, #2a2a4a); color:var(--text2, #aaa);
}
.s9-confirm__btn--cancel:hover {
  background:var(--bg4, #3a3a5a); color:var(--text1, #fff);
}
.s9-confirm__btn--confirm {
  background:#e53935; color:#fff;
}
.s9-confirm__btn--confirm:hover {
  background:#ff5252; box-shadow:0 0 12px rgba(229,57,53,0.4);
}

/* ============================================================
   LANGUAGE TOGGLE BUTTON
   ============================================================ */
.lang-dropdown {
  position:relative; display:inline-block;
}
.lang-toggle-btn {
  display:inline-flex; align-items:center; justify-content:center;
  width:36px; height:36px; border-radius:50%; padding:0;
  font-size:13px; white-space:nowrap;
  background:var(--bg2); border:1.5px solid var(--border);
  transition:background 0.2s, border-color 0.2s;
}
.lang-toggle-btn:hover { border-color:var(--accent); background:var(--card); }
.lang-btn-code {
  font-family:'DM Sans', sans-serif;
  font-weight:700; font-size:12px; letter-spacing:0.5px;
  color:var(--text);
}
.lang-dropdown__menu {
  position:absolute; top:calc(100% + 6px); right:0;
  min-width:180px; background:var(--card); border:1px solid var(--border);
  border-radius:10px; box-shadow:0 8px 24px rgba(0,0,0,0.35);
  opacity:0; visibility:hidden; transform:translateY(-8px);
  transition:opacity 0.2s, transform 0.2s, visibility 0.2s;
  z-index:9999; padding:6px 0; overflow:hidden;
}
.lang-dropdown__menu--open {
  opacity:1; visibility:visible; transform:translateY(0);
}
[dir="rtl"] .lang-dropdown__menu { right:auto; left:0; }
.lang-dropdown__item {
  display:flex; align-items:center; gap:10px; width:100%;
  padding:10px 16px; border:none; background:none; color:var(--text);
  font-size:13px; font-family:inherit; cursor:pointer;
  transition:background 0.15s;
}
.lang-dropdown__item:hover:not(:disabled) { background:var(--bg2); }
.lang-dropdown__item--active {
  color:var(--accent); font-weight:600;
}
.lang-dropdown__item--active::after {
  content:'\f00c'; font-family:'Font Awesome 5 Free'; font-weight:900;
  margin-inline-start:auto; font-size:11px;
}
.lang-dropdown__item--soon {
  opacity:0.45; cursor:default;
}
.lang-dropdown__flag { font-size:16px; }
.lang-dropdown__label { flex:1; text-align:start; }
.lang-dropdown__soon {
  font-size:10px; text-transform:uppercase; letter-spacing:0.5px;
  background:var(--accent); color:#000; border-radius:4px;
  padding:1px 6px; font-weight:700; margin-inline-start:auto;
}

/* ============================================================
   TRANSLATE BUTTON
   ============================================================ */
.translate-wrap { margin:6px 0 2px; }
.translate-btn {
  display:inline-flex; align-items:center; gap:5px;
  padding:4px 10px; border:1px solid var(--border); border-radius:6px;
  background:none; color:var(--text3); font-size:11px;
  font-family:inherit; cursor:pointer; transition:all 0.15s;
}
.translate-btn:hover { color:var(--accent); border-color:var(--accent); }
.translate-btn i { font-size:13px; }
.translate-actions {
  display:inline-flex; align-items:center; gap:6px;
}
.translate-btn--original {
  color:var(--text3); border-color:var(--border);
}
.translate-btn--original:hover { color:var(--accent); border-color:var(--accent); }
.translate-btn--more {
  padding:4px 8px; min-width:auto;
}
.translate-badge {
  font-size:10px; color:var(--green); font-weight:600;
  display:inline-flex; align-items:center; gap:4px;
}
.translate-picker {
  display:flex; flex-wrap:wrap; gap:4px; margin-top:6px;
  padding:8px; background:var(--card); border:1px solid var(--border);
  border-radius:8px; box-shadow:0 4px 12px rgba(0,0,0,0.25);
}
.translate-picker__item {
  padding:4px 10px; border:1px solid var(--border); border-radius:5px;
  background:none; color:var(--text); font-size:11px;
  font-family:inherit; cursor:pointer; transition:all 0.15s;
}
.translate-picker__item:hover {
  border-color:var(--accent); color:var(--accent); background:rgba(255,255,255,0.04);
}

/* ============================================================
   RTL (Right-to-Left) SUPPORT — Arabic, Hebrew, Farsi, Urdu
   ============================================================ */
[dir="rtl"] {
  font-family: 'IBM Plex Sans Arabic', 'DM Sans', sans-serif;
  font-weight: 500;
}
[dir="rtl"] h1, [dir="rtl"] h2, [dir="rtl"] h3, [dir="rtl"] h4,
[dir="rtl"] .section-header h2,
[dir="rtl"] .tab-btn,
[dir="rtl"] .cat-btn,
[dir="rtl"] .btn,
[dir="rtl"] .broadcast-tab,
[dir="rtl"] .s9-confirm__title,
[dir="rtl"] .newsletter-card__title,
[dir="rtl"] .step__title {
  font-family: 'IBM Plex Sans Arabic', 'DM Sans', sans-serif;
  font-weight: 700;
}
[dir="rtl"] .logo {
  font-family: 'Orbitron', 'IBM Plex Sans Arabic', sans-serif;
  direction: ltr;
  unicode-bidi: embed;
}
[dir="rtl"] .step__number {
  font-family: 'Orbitron', 'IBM Plex Sans Arabic', sans-serif;
}
[dir="rtl"] .header__tagline {
  direction: ltr;
  unicode-bidi: embed;
}
[dir="rtl"] p, [dir="rtl"] span, [dir="rtl"] a, [dir="rtl"] li,
[dir="rtl"] .report-card__summary,
[dir="rtl"] .step__desc,
[dir="rtl"] .footer__tagline,
[dir="rtl"] .mission-bar__text,
[dir="rtl"] .section-header__sub,
[dir="rtl"] .newsletter-card__text {
  font-family: 'IBM Plex Sans Arabic', 'DM Sans', sans-serif;
  font-weight: 500;
  line-height: 1.8;
}
[dir="rtl"] .header__tagline,
[dir="rtl"] .date-bar__edition,
[dir="rtl"] .date-bar__date {
  font-family: 'IBM Plex Sans Arabic', 'DM Sans', sans-serif;
  font-weight: 600;
}
[dir="rtl"] input, [dir="rtl"] textarea, [dir="rtl"] select {
  font-family: 'IBM Plex Sans Arabic', 'DM Sans', sans-serif;
  font-weight: 500;
}

/* Flip layout direction */
[dir="rtl"] .header__inner { flex-direction:row-reverse; }
[dir="rtl"] .header__left { flex-direction:row-reverse; }
[dir="rtl"] .header__right { flex-direction:row-reverse; }

/* Search box */
[dir="rtl"] .search-box__icon { left:auto; right:12px; }
[dir="rtl"] .search-box__input { padding-left:12px; padding-right:36px; text-align:right; }

/* Tab navigation */
[dir="rtl"] .tab-nav__inner { direction:rtl; }
[dir="rtl"] .tab-btn { flex-direction:row-reverse; }

/* Category filter */
[dir="rtl"] .categories { direction:rtl; }

/* Section headers */
[dir="rtl"] .section-header h2 { direction:rtl; }

/* Feed cards — flip text alignment */
[dir="rtl"] .report-card { text-align:right; }
[dir="rtl"] .report-card__meta { flex-direction:row-reverse; }
[dir="rtl"] .report-card__body { text-align:right; }
[dir="rtl"] .report-card__headline { text-align:right; }

/* Hero section */
[dir="rtl"] .hero-card { text-align:right; }
[dir="rtl"] .hero-card__body { text-align:right; }

/* Map filter bar */
[dir="rtl"] .map-filter-bar { direction:rtl; }

/* Broadcast cards */
[dir="rtl"] .broadcast-card { text-align:right; }
[dir="rtl"] .broadcast-card__body { text-align:right; }
[dir="rtl"] .broadcast-card__delete-btn { left:8px; right:auto; }
[dir="rtl"] .broadcast-tabs { direction:rtl; }

/* Community posts */
[dir="rtl"] .community-post { text-align:right; }
[dir="rtl"] .community-post__body { text-align:right; direction:rtl; }
[dir="rtl"] .community-post__meta { flex-direction:row-reverse; }
[dir="rtl"] .community-post__author { flex-direction:row-reverse; }
[dir="rtl"] .community-detail { text-align:right; direction:rtl; }
[dir="rtl"] .community-detail__meta { flex-direction:row-reverse; }
[dir="rtl"] .community-widget { text-align:right; direction:rtl; }
[dir="rtl"] .community-widget__title { flex-direction:row-reverse; }
[dir="rtl"] .community-widget__list li { flex-direction:row-reverse; }
[dir="rtl"] .community-stat-row { flex-direction:row-reverse; }
[dir="rtl"] .community-stat-row i { margin-right:0; margin-left:4px; }
[dir="rtl"] .community-trending-item { flex-direction:row-reverse; }
[dir="rtl"] .community-trending-meta { flex-direction:row-reverse; }
[dir="rtl"] .community-trending-meta i { margin-right:0; margin-left:2px; }
[dir="rtl"] .community-top-item { flex-direction:row-reverse; }
[dir="rtl"] .community-top-item__name { flex-direction:row-reverse; }
[dir="rtl"] .community-top-item__stat i { margin-right:0; margin-left:2px; }

/* Modals */
[dir="rtl"] .modal-panel { text-align:right; }
[dir="rtl"] .modal-panel__close { left:16px; right:auto; }

/* Profile */
[dir="rtl"] .profile-header { text-align:right; }
[dir="rtl"] .profile-stats { direction:rtl; }

/* Leaderboard */
[dir="rtl"] .leaderboard-row { flex-direction:row-reverse; text-align:right; }

/* Footer */
[dir="rtl"] .footer__grid { direction:rtl; text-align:right; }
[dir="rtl"] .footer__col { text-align:right; }
[dir="rtl"] .footer__bottom { flex-direction:row-reverse; }

/* Mission bar */
[dir="rtl"] .mission-bar__text { direction:rtl; }

/* Date bar */
[dir="rtl"] .date-bar { flex-direction:row-reverse; }

/* How it works steps — flip arrows */
[dir="rtl"] .step__connector i { transform:scaleX(-1); }
[dir="rtl"] .steps-grid { direction:rtl; }

/* Mobile nav */
[dir="rtl"] .mobile-nav { text-align:right; }
[dir="rtl"] .mobile-nav__links a { text-align:right; }

/* Forms */
[dir="rtl"] .form-input,
[dir="rtl"] .form-textarea,
[dir="rtl"] select.form-input { text-align:right; direction:rtl; }
[dir="rtl"] .form-label { text-align:right; display:block; }

/* Voting chips */
[dir="rtl"] .signal-chip { flex-direction:row-reverse; }

/* Toast container */
[dir="rtl"] .toast-container { left:20px; right:auto; }
[dir="rtl"] .toast { direction:rtl; text-align:right; }

/* Newsletter */
[dir="rtl"] .newsletter-card { text-align:right; }
[dir="rtl"] .newsletter-card__form { flex-direction:row-reverse; }

/* Ticker */
[dir="rtl"] .ticker-track { animation-direction:reverse; }

/* Category tags/chips */
[dir="rtl"] .cat-tag { direction:rtl; }

/* Sidebar layout */
[dir="rtl"] .sidebar-layout { direction:rtl; }

/* Report detail modal */
[dir="rtl"] .detail-header { text-align:right; direction:rtl; }
[dir="rtl"] .detail-body { text-align:right; direction:rtl; }
[dir="rtl"] .detail-meta { flex-direction:row-reverse; }

/* Moderation */
[dir="rtl"] .mod-card { text-align:right; direction:rtl; }
[dir="rtl"] .mod-card__actions { flex-direction:row-reverse; }

/* Video player overlay */
[dir="rtl"] .video-detail { text-align:right; direction:rtl; }

/* Context notes */
[dir="rtl"] .context-note { text-align:right; direction:rtl; }

/* ===== TICKER MANAGEMENT (Moderation Panel) ===== */
.mod-ticker { margin-top:12px; }
.mod-ticker__loading { text-align:center; padding:24px 0; color:var(--text3); }
.mod-ticker__form {
  background:var(--bg2); border:1px solid var(--border);
  border-radius:8px; padding:14px; margin-bottom:14px;
}
.mod-ticker__form-row {
  display:flex; align-items:center; gap:10px;
}
.mod-ticker__input { flex:1; }
.mod-ticker__live-label {
  display:flex; align-items:center; gap:6px;
  font-size:12px; color:var(--text2); cursor:pointer; white-space:nowrap;
}
.mod-ticker__list {
  display:flex; flex-direction:column; gap:6px;
}
.mod-ticker__item {
  display:flex; align-items:center; gap:10px;
  background:var(--bg2); border:1px solid var(--border);
  border-radius:8px; padding:10px 14px;
  transition:opacity var(--transition), background var(--transition);
}
.mod-ticker__item--inactive {
  opacity:.45;
  background:var(--bg3);
}
.mod-ticker__order {
  font-family:'Space Mono',monospace; font-size:11px;
  color:var(--text3); min-width:22px; text-align:center;
  background:var(--bg3); border-radius:4px; padding:2px 6px;
}
.mod-ticker__text {
  flex:1; font-size:13px; color:var(--text);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.mod-ticker__actions {
  display:flex; gap:4px; flex-shrink:0;
}
.mod-ticker__actions .btn--icon {
  width:28px; height:28px; padding:0;
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:6px; font-size:12px;
}
.mod-ticker__actions .btn--icon:disabled {
  opacity:.25; cursor:not-allowed;
}

/* Ticker mgmt RTL */
[dir="rtl"] .mod-ticker__form-row { flex-direction:row-reverse; }
[dir="rtl"] .mod-ticker__item { flex-direction:row-reverse; text-align:right; }
[dir="rtl"] .mod-ticker__actions { flex-direction:row-reverse; }

/* General utility */
[dir="rtl"] .flex-row-reverse-rtl { flex-direction:row-reverse; }

/* RTL — Messaging */
[dir="rtl"] .msger { direction:rtl; }
[dir="rtl"] .msger-sidebar { border-right:none; border-left:1px solid var(--border); }
[dir="rtl"] .msger-convo { flex-direction:row-reverse; text-align:right; }
[dir="rtl"] .msger-convo-body { text-align:right; }
[dir="rtl"] .msger-convo-top { flex-direction:row-reverse; }
[dir="rtl"] .msger-convo-bottom { flex-direction:row-reverse; }
[dir="rtl"] .msger-avatar-wrap { margin-left:12px; margin-right:0; }
[dir="rtl"] .msger-search i { left:auto; right:14px; }
[dir="rtl"] .msger-search input { padding-left:14px; padding-right:36px; text-align:right; }
[dir="rtl"] .msger-chat-header { flex-direction:row-reverse; }
[dir="rtl"] .msger-chat-user { flex-direction:row-reverse; }
[dir="rtl"] .msger-chat-user-info { text-align:right; }
[dir="rtl"] .msger-chat-actions { flex-direction:row-reverse; }
[dir="rtl"] .msger-msg--sent { flex-direction:row-reverse; }
[dir="rtl"] .msger-msg--recv { flex-direction:row; }
[dir="rtl"] .msger-bubble-meta { text-align:left; }
[dir="rtl"] .msger-msg--sent .msger-bubble-meta { text-align:right; }
[dir="rtl"] .msger-input-bar { flex-direction:row-reverse; }
[dir="rtl"] .msger-text-input { text-align:right; direction:rtl; }
[dir="rtl"] .msger-welcome { text-align:right; }
[dir="rtl"] .msger-feature { flex-direction:row-reverse; }
[dir="rtl"] .msger-mode-tabs { direction:rtl; }

/* ============================================================
   MESSAGING — Split-panel Messenger
   ============================================================ */

/* Tab badge */
.msg-tab-badge {
  background:var(--accent); color:#fff;
  font-size:10px; font-weight:700;
  padding:1px 5px; border-radius:8px;
  margin-left:4px; font-family:var(--font-mono);
}

/* === SPLIT LAYOUT === */
.msger {
  display:flex; height:calc(100vh - 260px); min-height:500px;
  border:1px solid var(--border); border-radius:var(--radius-lg);
  overflow:hidden; background:var(--bg2);
  margin:0 auto; max-width:1200px;
}

/* --- Sidebar (conversations list) --- */
.msger-sidebar {
  width:340px; min-width:280px; max-width:380px;
  border-right:1px solid var(--border);
  display:flex; flex-direction:column;
  background:var(--card);
}
.msger-sidebar-header {
  padding:20px 20px 12px;
  border-bottom:1px solid var(--border);
}
.msger-sidebar-title {
  font-family:var(--font-heading); font-size:var(--fs-lg);
  color:var(--text); display:flex; align-items:center; gap:8px;
  margin:0;
}
.msger-sidebar-title i { color:var(--accent); font-size:.9em; }

/* Mode tabs (Messages / Requests) */
.msger-mode-tabs {
  display:flex; gap:0;
}
.msger-mode-tab {
  flex:1; padding:10px 12px;
  background:none; border:none; border-bottom:2px solid transparent;
  color:var(--text3); font-size:var(--fs-sm); font-weight:500;
  font-family:var(--font-body); cursor:pointer;
  display:flex; align-items:center; justify-content:center; gap:6px;
  transition:all var(--transition-fast);
}
.msger-mode-tab:hover { color:var(--text2); }
.msger-mode-tab.msger-mode--active {
  color:var(--accent); border-bottom-color:var(--accent);
}
.msger-mode-tab i { font-size:13px; }
.msger-req-count {
  background:var(--accent); color:#fff;
  font-size:10px; font-weight:700;
  min-width:16px; height:16px;
  padding:0 4px; border-radius:8px;
  display:inline-flex; align-items:center; justify-content:center;
  font-family:var(--font-mono);
}

/* Empty hint */
.msger-convo-empty-hint {
  font-size:12px; color:var(--text3); margin-top:4px; opacity:.7;
}

/* Search */
.msger-search {
  padding:10px 16px; display:flex; align-items:center; gap:8px;
  border-bottom:1px solid var(--border);
}
.msger-search i { color:var(--text3); font-size:13px; }
.msger-search input {
  flex:1; background:none; border:none; color:var(--text);
  font-size:var(--fs-sm); font-family:var(--font-body); outline:none;
}
.msger-search input::placeholder { color:var(--text3); }

/* Conversation list */
.msger-convo-list {
  flex:1; overflow-y:auto; padding:4px 0;
}
.msger-convo-list::-webkit-scrollbar { width:4px; }
.msger-convo-list::-webkit-scrollbar-thumb { background:var(--border); border-radius:4px; }

.msger-convo {
  display:flex; align-items:center; gap:12px;
  padding:12px 16px; cursor:pointer;
  transition:background var(--transition-fast);
  border-left:3px solid transparent;
}
.msger-convo:hover { background:var(--bg3); }
.msger-convo--active {
  background:rgba(240,78,35,.08);
  border-left-color:var(--accent);
}
.msger-convo--unread { background:rgba(240,78,35,.04); }

/* Avatar with online dot */
.msger-avatar-wrap {
  position:relative; flex-shrink:0;
}
.msger-avatar {
  width:44px; height:44px; border-radius:50%;
  object-fit:cover; display:block;
}
.msger-avatar--initials {
  display:flex; align-items:center; justify-content:center;
  background:var(--bg3); color:var(--text2);
  font-size:14px; font-weight:600;
  font-family:var(--font-mono);
}
.msger-online-dot {
  position:absolute; bottom:1px; right:1px;
  width:10px; height:10px; border-radius:50%;
  background:var(--green); border:2px solid var(--card);
}

/* Convo body */
.msger-convo-body { flex:1; min-width:0; }
.msger-convo-top {
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:2px;
}
.msger-convo-name {
  font-size:var(--fs-sm); font-weight:500; color:var(--text);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  display:flex; align-items:center; gap:4px;
}
.msger-convo--unread .msger-convo-name { font-weight:700; }
.msger-convo-time {
  font-size:11px; color:var(--text3);
  font-family:var(--font-mono); flex-shrink:0;
}
.msger-convo--unread .msger-convo-time { color:var(--accent); font-weight:600; }
.msger-convo-bottom {
  display:flex; align-items:center; justify-content:space-between; gap:8px;
}
.msger-convo-preview {
  font-size:var(--fs-xs); color:var(--text3);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  flex:1; min-width:0;
}
.msger-convo--unread .msger-convo-preview { color:var(--text2); }

/* Unread badge */
.msger-badge {
  background:var(--accent); color:#fff;
  font-size:10px; font-weight:700;
  min-width:18px; height:18px;
  padding:0 5px; border-radius:9px;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-mono); flex-shrink:0;
}

/* Trust badge */
.msg-trust-badge {
  font-size:12px; margin-left:2px;
}

/* Empty sidebar */
.msger-convo-empty {
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  padding:48px 16px; color:var(--text3); text-align:center;
}
.msger-convo-empty i { font-size:36px; margin-bottom:12px; opacity:.3; }
.msger-convo-empty p { margin:0; font-size:var(--fs-sm); }

/* --- Main panel (chat or welcome) --- */
.msger-main {
  flex:1; display:flex; flex-direction:column;
  min-width:0; background:var(--bg);
}

/* Welcome screen */
.msger-welcome {
  flex:1; display:flex; align-items:center; justify-content:center;
}
.msger-welcome-inner { text-align:center; max-width:360px; padding:32px; }
.msger-welcome-logo {
  font-family:var(--font-heading); font-size:3rem;
  color:var(--text); letter-spacing:-2px; margin-bottom:12px;
}
.msger-welcome-logo span { color:var(--accent); }
.msger-welcome-text {
  color:var(--text3); font-size:var(--fs-sm); margin-bottom:32px; line-height:1.6;
}
.msger-welcome-features {
  display:flex; flex-direction:column; gap:12px;
}
.msger-feature {
  display:flex; align-items:center; gap:10px;
  color:var(--text2); font-size:var(--fs-sm); text-align:left;
}
.msger-feature i {
  color:var(--accent); font-size:16px; width:20px; text-align:center; flex-shrink:0;
}

/* Chat container */
.msger-chat {
  flex:1; display:flex; flex-direction:column; min-height:0;
}

/* Chat header */
.msger-chat-header {
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 20px; border-bottom:1px solid var(--border);
  background:var(--bg2);
}
.msger-chat-user {
  display:flex; align-items:center; gap:12px;
}
.msger-chat-avatar {
  width:36px; height:36px; border-radius:50%; object-fit:cover;
}
.msger-chat-user-info { display:flex; flex-direction:column; }
.msger-chat-name {
  font-size:var(--fs-base); font-weight:600; color:var(--text);
  display:flex; align-items:center; gap:4px;
}
.msger-chat-status {
  font-size:11px; color:var(--text3);
  font-family:var(--font-mono); text-transform:uppercase; letter-spacing:.3px;
}
.msger-chat-actions { display:flex; gap:4px; }
.msger-hdr-btn {
  background:none; border:none; color:var(--text3);
  font-size:14px; cursor:pointer; padding:8px;
  border-radius:var(--radius-sm);
  transition:all var(--transition-fast);
}
.msger-hdr-btn:hover { color:var(--text); background:var(--bg3); }

/* Messages area */
.msger-messages {
  flex:1; overflow-y:auto; padding:20px 24px;
  display:flex; flex-direction:column; gap:4px;
}
.msger-messages::-webkit-scrollbar { width:4px; }
.msger-messages::-webkit-scrollbar-thumb { background:var(--border); border-radius:4px; }

/* Date separator */
.msger-date-sep {
  display:flex; align-items:center; justify-content:center;
  padding:16px 0 8px;
}
.msger-date-sep span {
  font-size:11px; color:var(--text3);
  font-family:var(--font-mono); text-transform:uppercase;
  background:var(--bg); padding:4px 14px; border-radius:12px;
  letter-spacing:.5px;
}

/* Message bubbles */
.msger-msg {
  display:flex; margin:2px 0;
}
.msger-msg--sent { justify-content:flex-end; }
.msger-msg--recv { justify-content:flex-start; }
.msger-bubble {
  max-width:65%; padding:10px 14px; border-radius:18px;
  position:relative;
}
.msger-msg--sent .msger-bubble {
  background:var(--accent); color:#fff;
  border-bottom-right-radius:4px;
}
.msger-msg--recv .msger-bubble {
  background:var(--bg3); color:var(--text);
  border-bottom-left-radius:4px;
}
.msger-bubble-text {
  font-size:var(--fs-base); line-height:1.5;
  word-wrap:break-word; white-space:pre-wrap;
}
.msger-bubble-meta {
  font-size:10px; margin-top:4px; text-align:right;
  opacity:.6;
}
.msger-link {
  color:inherit; text-decoration:underline;
  text-underline-offset:2px;
}

/* Shared report card in chat */
.msger-bubble--report { padding:0; overflow:hidden; }
.msger-report-card {
  display:flex; align-items:center; gap:12px;
  padding:12px 14px;
}
.msger-report-icon {
  width:36px; height:36px; border-radius:8px;
  background:rgba(255,255,255,.15);
  display:flex; align-items:center; justify-content:center;
  font-size:16px; flex-shrink:0;
}
.msger-msg--recv .msger-report-icon {
  background:var(--accent-glow); color:var(--accent);
}
.msger-report-info { flex:1; min-width:0; }
.msger-report-label {
  font-size:10px; text-transform:uppercase; letter-spacing:.5px;
  opacity:.6; font-family:var(--font-mono);
}
.msger-report-title {
  font-size:var(--fs-sm); font-weight:500; line-height:1.3;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  overflow:hidden;
}
.msger-bubble--report .msger-bubble-meta {
  padding:0 14px 8px; border-top:1px solid rgba(255,255,255,.1);
  margin-top:0; padding-top:6px;
}
.msger-msg--recv .msger-bubble--report .msger-bubble-meta {
  border-top-color:var(--border);
}

/* Image bubbles */
.msger-bubble--image { padding:4px 4px 0; background:transparent; }
.msger-msg--sent .msger-bubble--image { background:var(--accent); }
.msger-msg--recv .msger-bubble--image { background:var(--bg3); }
.msger-img-bubble { cursor:pointer; line-height:0; }
.msger-chat-img {
  max-width:280px; max-height:260px; border-radius:12px;
  object-fit:cover; display:block;
}
.msger-bubble--image .msger-bubble-text { padding:6px 10px 0; }
.msger-bubble--image .msger-bubble-meta { padding:4px 10px 6px; }

/* Image viewer overlay */
.msger-img-viewer {
  position:fixed; inset:0; z-index:9999;
  background:rgba(0,0,0,.92); display:flex;
  align-items:center; justify-content:center;
  animation:fadeIn .15s ease;
}
.msger-img-viewer-inner { position:relative; max-width:90vw; max-height:90vh; }
.msger-img-viewer-close {
  position:absolute; top:-40px; right:0;
  background:none; border:none; color:#fff;
  font-size:24px; cursor:pointer; padding:8px;
  opacity:.7; transition:opacity .15s;
}
.msger-img-viewer-close:hover { opacity:1; }
.msger-img-viewer-img {
  max-width:90vw; max-height:85vh;
  border-radius:8px; object-fit:contain;
}

/* Empty chat */
.msger-empty-chat {
  flex:1; display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  color:var(--text3); text-align:center;
}
.msger-empty-chat i { font-size:40px; margin-bottom:12px; opacity:.3; }
.msger-empty-chat p { margin:0; font-size:var(--fs-sm); }

/* Full-page empty (not signed in) */
.msger-empty-full {
  flex:1; display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  min-height:400px; color:var(--text3);
}
.msger-empty-icon { font-size:48px; margin-bottom:16px; opacity:.3; }

/* Typing indicator */
.msger-typing {
  display:flex; align-items:center; gap:4px;
  padding:4px 24px 8px;
}
.msger-typing-dot {
  width:6px; height:6px; border-radius:50%;
  background:var(--text3);
  animation:msger-typing-bounce .6s ease-in-out infinite;
}
.msger-typing-dot:nth-child(2) { animation-delay:.15s; }
.msger-typing-dot:nth-child(3) { animation-delay:.3s; }
@keyframes msger-typing-bounce {
  0%,100% { opacity:.3; transform:translateY(0); }
  50% { opacity:1; transform:translateY(-3px); }
}

/* Input bar */
.msger-input-bar {
  display:flex; align-items:center; gap:8px;
  padding:12px 20px; border-top:1px solid var(--border);
  background:var(--bg2);
}
.msger-attach-btn {
  width:36px; height:36px; border-radius:50%;
  background:none; border:1px solid var(--border);
  color:var(--text3); display:flex; align-items:center; justify-content:center;
  font-size:14px; cursor:pointer;
  transition:all var(--transition-fast);
}
.msger-attach-btn:hover {
  color:var(--accent); border-color:var(--accent);
  background:var(--accent-glow);
}
.msger-text-input {
  flex:1; padding:10px 16px;
  background:var(--bg3); border:1px solid var(--border);
  border-radius:22px; color:var(--text); font-size:var(--fs-base);
  font-family:var(--font-body); outline:none;
  transition:border-color var(--transition-fast);
}
.msger-text-input:focus { border-color:var(--accent); }
.msger-text-input::placeholder { color:var(--text3); }
.msger-send-btn {
  width:40px; height:40px; border-radius:50%;
  background:var(--accent); color:#fff; border:none;
  display:flex; align-items:center; justify-content:center;
  font-size:15px; cursor:pointer;
  transition:all var(--transition-fast);
}
.msger-send-btn:hover { background:var(--accent2); transform:scale(1.05); }

/* Blocked */
.msger-blocked {
  padding:14px; text-align:center;
  color:var(--red); font-size:var(--fs-sm);
  background:var(--red-bg); border-radius:var(--radius-sm);
  margin:8px 20px;
}

/* Share report picker */
.msger-share-picker {
  border-top:1px solid var(--border);
  background:var(--bg2); max-height:200px;
  display:flex; flex-direction:column;
}
.msger-share-header {
  display:flex; align-items:center; justify-content:space-between;
  padding:8px 16px; font-size:var(--fs-sm); font-weight:600; color:var(--text2);
}
.msger-share-header i { color:var(--accent); margin-right:6px; }
.msger-share-list {
  overflow-y:auto; padding:0 8px 8px; flex:1;
}
.msger-share-item {
  padding:8px 12px; border-radius:var(--radius-sm);
  cursor:pointer; font-size:var(--fs-sm);
  transition:background var(--transition-fast);
  display:flex; align-items:center; gap:8px;
}
.msger-share-item:hover { background:var(--bg3); }
.msger-share-cat {
  font-size:10px; font-family:var(--font-mono);
  color:var(--accent); font-weight:700;
  letter-spacing:.3px;
}
.msger-share-title {
  color:var(--text); flex:1;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* --- RESPONSIVE: stack on mobile --- */
@media (max-width:768px) {
  .msger { flex-direction:column; height:calc(100vh - 200px); border-radius:0; border:none; }
  .msger-sidebar {
    width:100%; max-width:none; border-right:none;
    border-bottom:1px solid var(--border);
    max-height:50vh;
  }
  .msger-convo--active ~ .msger-sidebar { display:none; }
  .msger-welcome { display:none; }
  .msger-chat { min-height:300px; }
}