/* ---------- Theme (fun, warm, “game center”) ---------- */
        :root{
            --sd-bg: #0b1221;
            --sd-bg-2: #0e1530;
            --sd-gradient: radial-gradient(1200px 600px at -10% -10%, #1a2b6b 0%, transparent 60%),
                           radial-gradient(900px 500px at 110% -10%, #5d2dfc 0%, transparent 65%),
                           linear-gradient(180deg, #0e1530 0%, #0b1221 100%);
            --sd-surface: rgba(255,255,255,.06);
            --sd-surface-2: rgba(255,255,255,.08);
            --sd-border: rgba(255,255,255,.12);
            --sd-text: #ecf0ff;
            --sd-muted: #9aa3c7;
            --sd-primary: #7c5cff;
            --sd-primary-600:#6a47ff;
            --sd-accent: #ffb34d;   /* warm amber */
            --sd-accent-2:#ff6b6b;  /* coral */
            --sd-success:#35d4a2;
            --sd-warning:#ffd166;
            --sd-danger:#ff6b6b;
            --sd-shadow: 0 18px 40px rgba(0,0,0,.35);
            --sd-blur: blur(8px);
            --sd-radius: 18px;
        }

        html, body { height: 100%; }
        body{
            font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial;
            background: var(--sd-gradient);
            color: var(--sd-text);
            font-size: 16.75px; /* larger base type */
        }

        /* ---------- Navbar ---------- */
        .navbar.sd-navbar{
            background: rgba(255,255,255,.06);
            backdrop-filter: var(--sd-blur);
            -webkit-backdrop-filter: var(--sd-blur);
            border-bottom: 1px solid var(--sd-border);
            border-radius: 0 0 var(--sd-radius) var(--sd-radius);
        }
        .sd-brand{ font-weight:800; letter-spacing:.2px; color:#fff; }
        .sd-nav-link{ color:var(--sd-text); font-weight:600; opacity:.85; }
        .sd-nav-link:hover{ opacity:1; }

        .btn{ border-radius: 12px; }
        .btn.sd-cta{
            background: linear-gradient(90deg, var(--sd-accent), var(--sd-accent-2));
            color:#101322 !important; border:none; font-weight:800;
            box-shadow: 0 6px 18px rgba(255,107,107,.25);
        }
        .btn.sd-cta:hover{ filter: brightness(1.05); transform: translateY(-1px); }

        /* ---------- Cards / Panels ---------- */
        .card{
            background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.06));
            border:1px solid var(--sd-border);
            box-shadow: var(--sd-shadow);
            border-radius: var(--sd-radius);
            color: var(--sd-text);
        }
        .card-header{ border-bottom:1px solid var(--sd-border); }

        .sd-subtle{ color: var(--sd-muted); }

        /* ---------- Tables to “mission list” look ---------- */
        .table{ color: var(--sd-text); }
        .table thead th{
            font-size:.9rem; text-transform:uppercase; letter-spacing:.04em;
            color: var(--sd-muted); border-bottom:1px solid var(--sd-border)!important;
        }
        .table tbody td{ border-top:1px solid rgba(255,255,255,.06); }
        .table-hover tbody tr:hover{ background: rgba(255,255,255,.05); }

        /* ---------- Status “LED” badges ---------- */
        .status-pill{
            font-size:.8rem; font-weight:700; padding:.45rem .75rem; border-radius:999px;
            border:1px solid var(--sd-border); background: rgba(255,255,255,.06);
            box-shadow: inset 0 0 12px rgba(255,255,255,.08);
        }
        .text-bg-warning.status-pill{ color:#2c2200; background: rgba(255,209,102,.85); border-color: rgba(255,209,102,.4); }
        .text-bg-success.status-pill{ color:#00281f; background: rgba(53,212,162,.9); border-color: rgba(53,212,162,.45); }
        .text-bg-secondary.status-pill{ color:#e2e6ff; background: rgba(154,163,199,.3); border-color: rgba(154,163,199,.35); }

        /* ---------- Media thumb ---------- */
        .sd-thumb{ width:72px; height:72px; object-fit:cover; border-radius:14px; border:1px solid var(--sd-border); }

        /* ---------- Hero / Section ---------- */
        .sd-hero{
            background: radial-gradient(600px 280px at -10% 0, rgba(124,92,255,.25), transparent 60%),
                        radial-gradient(600px 280px at 110% -10%, rgba(255,179,77,.24), transparent 60%),
                        linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
            border:1px solid var(--sd-border);
            border-radius: var(--sd-radius);
            box-shadow: var(--sd-shadow);
        }
        .sd-hero h2{ font-weight:900; letter-spacing:.3px; }
        .sd-kpi{
            background: rgba(255,255,255,.06);
            border:1px solid var(--sd-border);
            border-radius: 14px;
            padding:.75rem 1rem;
        }

        /* ---------- Pagination container tweak ---------- */
        .pagination{ --bs-pagination-color:#fff; --bs-pagination-bg:transparent; }

/* === Scoped "Game Center" card list === */
:root{
  --gc-bg:#0c1324; --gc-surface:#101a35; --gc-glass:rgba(255,255,255,.06);
  --gc-border:rgba(255,255,255,.12); --gc-txt:#ecf0ff; --gc-muted:#a4add0;
  --gc-accent:#ffb34d; --gc-accent2:#ff6b6b; --gc-good:#35d4a2; --gc-warn:#ffd166;
  --gc-radius:16px; --gc-shadow:0 16px 38px rgba(0,0,0,.35);
}
.gc-wrap { color:var(--gc-txt); }
.gc-hero{
  background:
    radial-gradient(600px 260px at -10% -20%, rgba(124,92,255,.28), transparent 60%),
    radial-gradient(500px 260px at 110% -10%, rgba(255,179,77,.22), transparent 60%),
    linear-gradient(180deg, var(--gc-surface), #0f1730);
  border:1px solid var(--gc-border);
  border-radius:22px; box-shadow:var(--gc-shadow);
}
.gc-hero .kpi{ background:var(--gc-glass); border:1px solid var(--gc-border); border-radius:14px; padding:.6rem .9rem; }

.gc-card{
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.05));
  border:1px solid var(--gc-border);
  border-radius:18px; box-shadow:var(--gc-shadow);
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.gc-card:hover{ transform: translateY(-2px); border-color: rgba(255,255,255,.2); }

.gc-thumb{ width:92px; height:92px; border-radius:14px; object-fit:cover; border:1px solid var(--gc-border); }
.gc-client{ background:rgba(255,255,255,.08); border:1px solid var(--gc-border); border-radius:999px; padding:.25rem .7rem; font-weight:700; }
.gc-caption{ font-weight:800; letter-spacing:.2px; font-size:1.03rem; }
.gc-meta{ color:var(--gc-muted); }
.gc-dot{ width:6px; height:6px; display:inline-block; border-radius:50%; margin-right:.4rem; background:var(--gc-muted); }

.gc-pill{
  font-size:.82rem; font-weight:800; padding:.45rem .75rem; border-radius:999px;
  border:1px solid var(--gc-border); background: rgba(255,255,255,.07);
}
.gc-pill.scheduled{ background:rgba(255,209,102,.9); color:#2c2200; border-color:rgba(255,209,102,.5); }
.gc-pill.published{ background:rgba(53,212,162,.92); color:#00281f; border-color:rgba(53,212,162,.52); }
.gc-pill.archived{ background:rgba(164,173,208,.35); color:#e7ecff; border-color:rgba(164,173,208,.45); }

.gc-actions .btn{ border-radius:10px; }
.gc-actions .btn-outline-light{ border-color:rgba(255,255,255,.25); }
.gc-actions .btn-outline-warning{ color:#ffc86d; border-color:#ffc86d; }
.gc-actions .btn-outline-danger{ color:var(--gc-accent2); border-color:var(--gc-accent2); }

.gc-new{
  background: linear-gradient(90deg, var(--gc-accent), var(--gc-accent2));
  color:#171a2c !important; font-weight:900; border:none; border-radius:12px; padding:.8rem 1.2rem;
  box-shadow:0 10px 24px rgba(255,107,107,.28);
}
.gc-new:hover{ filter:brightness(1.05); transform: translateY(-1px); }

.gc-empty{ color:var(--gc-muted); }

/* === Page-scoped theme matching the Posts index (warm/dark, gamified) === */
:root{
  --gc-bg:#0c1324; --gc-surface:#101a35; --gc-glass:rgba(255,255,255,.06);
  --gc-border:rgba(255,255,255,.12); --gc-txt:#ecf0ff; --gc-muted:#a4add0;
  --gc-accent:#ffb34d; --gc-accent2:#ff6b6b; --gc-good:#35d4a2; --gc-warn:#ffd166;
  --gc-radius:16px; --gc-shadow:0 16px 38px rgba(0,0,0,.35);
}
.gc-wrap { color:var(--gc-txt); }
.gc-hero{
  background:
    radial-gradient(600px 260px at -10% -20%, rgba(124,92,255,.28), transparent 60%),
    radial-gradient(500px 260px at 110% -10%, rgba(255,179,77,.22), transparent 60%),
    linear-gradient(180deg, var(--gc-surface), #0f1730);
  border:1px solid var(--gc-border);
  border-radius:22px; box-shadow:var(--gc-shadow);
}
.gc-card{
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.05));
  border:1px solid var(--gc-border);
  border-radius:18px; box-shadow:var(--gc-shadow);
}
.gc-label{ color:var(--gc-muted); font-weight:700; text-transform:uppercase; font-size:.85rem; letter-spacing:.04em; }
.gc-preview{
  background: var(--gc-glass);
  border:1px solid var(--gc-border);
  border-radius:14px;
}
.gc-preview .title{ color:var(--gc-muted); font-size:.8rem; text-transform:uppercase; letter-spacing:.04em; }
.gc-subtle{ color:var(--gc-muted); }

/* Make controls bigger and friendlier without changing IDs/names */
.gc-card .form-control,
.gc-card .form-select{ background:#0f1730; color:var(--gc-txt); border:1px solid var(--gc-border); border-radius:12px; padding:.7rem .9rem; }
.gc-card .form-control::placeholder{ color:#92a0cf; }

/* Buttons aligned with warm palette (no behavior change) */
.gc-wrap .btn-outline-primary{ color:#ffc86d; border-color:#ffc86d; }
.gc-wrap .btn-outline-primary:hover{ background:rgba(255,200,109,.12); }
.gc-wrap .btn.sd-cta{ font-weight:800; border:none; background: linear-gradient(90deg, var(--gc-accent), var(--gc-accent2)); color:#171a2c !important; box-shadow:0 10px 24px rgba(255,107,107,.28); }
.gc-wrap .btn.sd-cta:hover{ filter:brightness(1.05); transform: translateY(-1px); }

/* Back button to match theme slightly */
.gc-wrap .btn-outline-secondary{ color:#cfd6ff; border-color:rgba(255,255,255,.22); }
.gc-wrap .btn-outline-secondary:hover{ background:rgba(255,255,255,.08); }

/* === Page-scoped theme matching the Posts index (warm/dark, gamified) === */
:root{
  --gc-bg:#0c1324; --gc-surface:#101a35; --gc-glass:rgba(255,255,255,.06);
  --gc-border:rgba(255,255,255,.12); --gc-txt:#ecf0ff; --gc-muted:#a4add0;
  --gc-accent:#ffb34d; --gc-accent2:#ff6b6b; --gc-good:#35d4a2; --gc-warn:#ffd166;
  --gc-radius:16px; --gc-shadow:0 16px 38px rgba(0,0,0,.35);
}
.gc-wrap { color:var(--gc-txt); }
.gc-hero{
  background:
    radial-gradient(600px 260px at -10% -20%, rgba(124,92,255,.28), transparent 60%),
    radial-gradient(500px 260px at 110% -10%, rgba(255,179,77,.22), transparent 60%),
    linear-gradient(180deg, var(--gc-surface), #0f1730);
  border:1px solid var(--gc-border);
  border-radius:22px; box-shadow:var(--gc-shadow);
}
.gc-card{
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.05));
  border:1px solid var(--gc-border);
  border-radius:18px; box-shadow:var(--gc-shadow);
}
.gc-label{ color:var(--gc-muted); font-weight:700; text-transform:uppercase; font-size:.85rem; letter-spacing:.04em; }
.gc-preview{
  background: var(--gc-glass);
  border:1px solid var(--gc-border);
  border-radius:14px;
}
.gc-preview .title{ color:var(--gc-muted); font-size:.8rem; text-transform:uppercase; letter-spacing:.04em; }
.gc-subtle{ color:var(--gc-muted); }

/* Make controls bigger and friendlier without changing IDs/names */
.gc-card .form-control,
.gc-card .form-select{ background:#0f1730; color:var(--gc-txt); border:1px solid var(--gc-border); border-radius:12px; padding:.7rem .9rem; }
.gc-card .form-control::placeholder{ color:#92a0cf; }

/* Buttons aligned with warm palette (no behavior change) */
.gc-wrap .btn-outline-primary{ color:#ffc86d; border-color:#ffc86d; }
.gc-wrap .btn-outline-primary:hover{ background:rgba(255,200,109,.12); }
.gc-wrap .btn.sd-cta{ font-weight:800; border:none; background: linear-gradient(90deg, var(--gc-accent), var(--gc-accent2)); color:#171a2c !important; box-shadow:0 10px 24px rgba(255,107,107,.28); }
.gc-wrap .btn.sd-cta:hover{ filter:brightness(1.05); transform: translateY(-1px); }

/* Back button to match theme slightly */
.gc-wrap .btn-outline-secondary{ color:#cfd6ff; border-color:rgba(255,255,255,.22); }
.gc-wrap .btn-outline-secondary:hover{ background:rgba(255,255,255,.08); }

/* === Page‑scoped theme (matches Index & Edit) === */
:root{
  --gc-bg:#0c1324; --gc-surface:#101a35; --gc-glass:rgba(255,255,255,.06);
  --gc-border:rgba(255,255,255,.12); --gc-txt:#ecf0ff; --gc-muted:#a4add0;
  --gc-accent:#ffb34d; --gc-accent2:#ff6b6b; --gc-good:#35d4a2; --gc-warn:#ffd166;
  --gc-radius:16px; --gc-shadow:0 16px 38px rgba(0,0,0,.35);
}
.gc-wrap { color:var(--gc-txt); }
.gc-hero{
  background:
    radial-gradient(600px 260px at -10% -20%, rgba(124,92,255,.28), transparent 60%),
    radial-gradient(500px 260px at 110% -10%, rgba(255,179,77,.22), transparent 60%),
    linear-gradient(180deg, var(--gc-surface), #0f1730);
  border:1px solid var(--gc-border);
  border-radius:22px; box-shadow:var(--gc-shadow);
}
.gc-card{
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.05));
  border:1px solid var(--gc-border);
  border-radius:18px; box-shadow:var(--gc-shadow);
}
.gc-label{ color:var(--gc-muted); font-weight:700; text-transform:uppercase; font-size:.85rem; letter-spacing:.04em; }
.gc-subtle{ color:var(--gc-muted); }
.gc-preview{
  background: var(--gc-glass);
  border:1px solid var(--gc-border);
  border-radius:14px;
}

/* Form controls (bigger, friendlier; same as Edit) */
.gc-card .form-control,
.gc-card .form-select{ background:#0f1730; color:var(--gc-txt); border:1px solid var(--gc-border); border-radius:12px; padding:.7rem .9rem; }
.gc-card .form-control::placeholder{ color:#92a0cf; }

/* Buttons consistent with theme */
.gc-wrap .btn-outline-secondary{ color:#cfd6ff; border-color:rgba(255,255,255,.22); }
.gc-wrap .btn-outline-secondary:hover{ background:rgba(255,255,255,.08); }
.gc-wrap .btn-outline-primary{ color:#ffc86d; border-color:#ffc86d; }
.gc-wrap .btn-outline-primary:hover{ background:rgba(255,200,109,.12); }
.gc-wrap .btn.sd-cta{ font-weight:800; border:none; background: linear-gradient(90deg, var(--gc-accent), var(--gc-accent2)); color:#171a2c !important; box-shadow:0 10px 24px rgba(255,107,107,.28); }
.gc-wrap .btn.sd-cta:hover{ filter:brightness(1.05); transform: translateY(-1px); }

/* Mini helper for the media preview box */
#media-preview img, #media-preview video{ border-radius:12px; border:1px solid var(--gc-border); box-shadow:var(--gc-shadow); }

/* Utility classes extracted from inline styles */
.max-w-320{ max-width:320px; }
.max-w-280{ max-width:280px; }
.max-w-360{ max-width:360px; }
.max-w-600{ max-width:600px; }
.max-w-420{ max-width:420px; }
.reply-box{ background:#f8fafc; border:1px solid rgba(17,24,39,.06); }