/* ==========================================================================
   TICKMC NETWORK - UNIFIED OBSIDIAN & GOLD MINECRAFT PORTAL SYSTEM (v2.0)
   ALL PAGE DESIGN & STYLING MUST BE DEFINED IN THIS MASTER STYLESHEET
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800;900&family=Plus+Jakarta+Sans:wght@500;600;700;800&family=Inter:wght@400;500;600;700&display=swap');

:root {
  --bg-deep: #090b10;
  --bg-surface: #0e121b;
  --bg-card: rgba(18, 22, 32, 0.85);
  --bg-card-hover: rgba(24, 30, 44, 0.92);
  
  --gold-main: #f59e0b;
  --gold-light: #fbbf24;
  --gold-dark: #d97706;
  --gold-glow: rgba(245, 158, 11, 0.28);
  --gold-border: rgba(245, 158, 11, 0.35);

  --emerald-main: #10b981;
  --emerald-glow: rgba(16, 185, 129, 0.25);

  --crimson-main: #ef4444;
  --crimson-glow: rgba(239, 68, 68, 0.25);

  --text-primary: #f8fafc;
  --text-secondary: #cbd5e1;
  --text-muted: #94a3b8;
  --text-dark: #64748b;

  --font-heading: 'Outfit', 'Plus Jakarta Sans', sans-serif;
  --font-body: 'Inter', system-ui, sans-serif;

  --border-subtle: rgba(255, 255, 255, 0.08);
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 18px;
}

* { box-sizing: border-box !important; margin: 0; padding: 0; }

html, body {
  width: 100% !important;
  min-height: 100vh !important;
  background-color: #090b10 !important;
  color: #f8fafc !important;
  font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
  line-height: 1.6 !important;
  overflow-x: hidden !important;
}

body {
  background-image: 
    radial-gradient(circle at 50% 0%, rgba(245, 158, 11, 0.14) 0%, transparent 55%),
    radial-gradient(circle at 85% 60%, rgba(16, 185, 129, 0.05) 0%, transparent 45%),
    linear-gradient(rgba(255, 255, 255, 0.015) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.015) 1px, transparent 1px),
    linear-gradient(to bottom, #090b10 0%, #07090e 100%) !important;
  background-size: 100% 100%, 100% 100%, 48px 48px, 48px 48px, 100% 100% !important;
  background-attachment: fixed !important;
  display: flex !important;
  flex-direction: column !important;
}

a { color: #f59e0b; text-decoration: none; transition: all 0.25s ease; }
a:hover { color: #fbbf24; }

h1, h2, h3, h4, h5, h6 {
  font-family: 'Outfit', 'Plus Jakarta Sans', sans-serif !important;
  color: #fff !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
}

/* Universal Element Base Overrides */
input, select, textarea, button {
  background-color: rgba(12, 16, 24, 0.9) !important;
  color: #f8fafc !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 8px !important;
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 0.95rem !important;
  padding: 0.7rem 0.95rem !important;
  box-shadow: none !important;
  transition: all 0.2s ease !important;
}

select option {
  background-color: #0e121b !important;
  color: #f8fafc !important;
  padding: 10px !important;
}

input:focus, select:focus, textarea:focus {
  outline: none !important;
  border-color: #f59e0b !important;
  box-shadow: 0 0 14px rgba(245, 158, 11, 0.25) !important;
}

/* Compact form layout helpers — used across the staff/owner admin surfaces
   (admin_users.php, private_admin.php, shop_admin.php, gift_cards_admin.php, profile.php).
   Previously only defined locally inside admin_users.php's own <style> block, so every
   other page using these same class names got no layout benefit from them at all. */
.form-group { margin-bottom: 0.75rem; }
.form-label { display: block; font-size: 0.76rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.05em; color: #94a3b8; margin-bottom: 0.25rem; }
.form-input, .form-select, .form-textarea { width: 100%; }

/* ======================================================================
   STAFF PANEL CATEGORY NAVIGATION
   ====================================================================== */
.staff-panel-identity-strip { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 0.6rem; width: 100%; max-width: 1320px; margin: 0.85rem auto 0; padding: 0 1.25rem; }
.staff-panel-identity-badges, .staff-panel-identity-user { display: flex; align-items: center; gap: 0.5rem; }
.staff-panel-identity-badges { gap: 0.45rem; flex-wrap: wrap; }
.staff-panel-identity-badges .mc-badge-admin { font-size: 0.75rem; letter-spacing: 0.05em; }
.staff-panel-version-badge { color: #cbd5e1; background: rgba(56, 189, 248, 0.1); border: 1px solid rgba(56, 189, 248, 0.25); font-size: 0.68rem; }
.staff-panel-identity-user img { width: 26px; height: 26px; border-radius: 4px; }
.staff-panel-identity-user span { display: grid; line-height: 1.2; }
.staff-panel-identity-user strong { color: var(--text-primary); font-size: 0.85rem; }
.staff-panel-identity-user small { color: var(--gold-main); font-size: 0.7rem; }
.staff-panel-navigation-page { width: 100%; max-width: 1320px; margin: 0 auto; padding: 1.5rem 1.25rem 0; }
.staff-panel-category-shell { width: 100%; max-width: 1270px; margin: 0 auto 1.25rem; }
.staff-category-navigation { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-flow: row; grid-auto-rows: 128px; gap: 0.85rem; width: 100%; }
.staff-category-card {
  position: relative;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  align-items: center;
  column-gap: 0.9rem;
  width: 100%;
  height: 128px;
  min-width: 0;
  padding: 0.85rem 4.75rem 0.85rem 1rem;
  overflow: hidden;
  border: 2px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  background: rgba(18, 22, 32, 0.85);
  color: var(--text-primary);
  text-decoration: none;
  transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}
.staff-category-card:hover, .staff-category-card:focus-visible { border-color: rgba(245, 158, 11, 0.4); background: rgba(245, 158, 11, 0.04); box-shadow: 0 0 14px rgba(245, 158, 11, 0.08); color: var(--text-primary); }
.staff-category-card.is-active { border-color: var(--gold-main); background: linear-gradient(135deg, rgba(245, 158, 11, 0.15), rgba(18, 22, 32, 0.95)); box-shadow: 0 0 20px rgba(245, 158, 11, 0.2); }
.staff-category-card:focus-visible { outline: 2px solid var(--gold-light); outline-offset: 3px; }
.staff-category-icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 10px; background: rgba(255, 255, 255, 0.05); font-size: 1.25rem; }
.staff-category-card.is-active .staff-category-icon { color: #0b0e14 !important; background: var(--gold-main); }
.staff-category-copy { display: grid; min-width: 0; gap: 0.3rem; }
.staff-category-title { display: -webkit-box; min-height: 2.4em; overflow: hidden; color: var(--text-primary); font-family: var(--font-heading); font-size: 1.02rem; font-weight: 800; line-height: 1.2; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.staff-category-description { display: -webkit-box; min-height: 2.7em; overflow: hidden; color: var(--text-muted); font-size: 0.76rem; line-height: 1.35; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.staff-category-count { position: absolute; top: 0.75rem; right: 0.75rem; max-width: 3.7rem; overflow: hidden; color: #fecaca; font-size: 0.64rem; font-weight: 800; line-height: 1.2; text-align: right; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 1180px) { .staff-category-navigation { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 880px) { .staff-category-navigation { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .staff-category-navigation { grid-template-columns: minmax(0, 1fr); grid-auto-rows: 120px; } .staff-category-card { height: 120px; padding-left: 0.9rem; } }

table {
  width: 100% !important;
  border-collapse: collapse !important;
  color: #f8fafc !important;
}

th, td {
  padding: 0.85rem 1rem !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

th {
  font-family: 'Outfit', sans-serif !important;
  font-weight: 700 !important;
  color: #94a3b8 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  font-size: 0.85rem !important;
}

/* Wrap any wide table (e.g. top.php's leaderboards) in this so it scrolls horizontally on
   narrow screens instead of being silently clipped by the page's overflow-x:hidden below. */
.mc-table-responsive { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.mc-table { width: 100%; border-collapse: collapse; }

/* ======================================================================
   SUPPORT WORKSPACE
   ====================================================================== */
.support-page { width: 100%; max-width: 1540px; margin: 0 auto; padding: 2.25rem 2rem 3rem; }
.support-page.staff-support-page { padding-top: 0; }
.support-page-hero { min-height: 168px; display:flex; align-items:center; justify-content:space-between; gap:2rem; overflow:hidden; position:relative; padding:2rem 2.25rem; border:1px solid rgba(245,158,11,.28); border-radius:var(--radius-lg); background:linear-gradient(115deg,rgba(245,158,11,.16),rgba(18,22,32,.92) 48%,rgba(16,185,129,.10)); box-shadow:0 20px 55px rgba(0,0,0,.25); }
.support-page-hero h1 { font-size:clamp(1.75rem,3vw,2.55rem); line-height:1.12; margin:.45rem 0 .65rem; }
.support-page-hero p { max-width:640px; color:var(--text-secondary); font-size:.97rem; }
.support-kicker { display:inline-flex; align-items:center; gap:.5rem; color:var(--gold-light); font-family:var(--font-heading); font-weight:800; font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; }
.support-hero-shield { display:grid; place-items:center; flex:0 0 auto; width:96px; height:96px; border-radius:28px; font-size:2.7rem; color:var(--gold-main); background:rgba(245,158,11,.12); border:1px solid rgba(245,158,11,.23); transform:rotate(8deg); box-shadow:inset 0 0 26px rgba(245,158,11,.09); }
.support-workspace { min-height:560px; margin-top:1.5rem; }
.support-loading, .support-empty-card { min-height:330px; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:.65rem; padding:2rem; text-align:center; border:1px solid var(--border-subtle); border-radius:var(--radius-lg); background:var(--bg-card); color:var(--text-muted); }
.support-empty-card i { color:var(--gold-main); font-size:2rem; }
.support-empty-card h2 { font-size:1.25rem; }
.support-choice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.2rem; max-width:960px; margin:0 auto; padding:1.2rem 0; }
.support-choice { min-height:280px; display:flex; flex-direction:column; align-items:flex-start; text-align:left; gap:1rem; padding:1.75rem !important; border-radius:var(--radius-lg) !important; background:linear-gradient(160deg,rgba(18,22,32,.95),rgba(10,13,20,.95)) !important; border:1px solid var(--border-subtle) !important; cursor:pointer; }
.support-choice:not(:disabled):hover { transform:translateY(-4px); border-color:rgba(245,158,11,.5) !important; box-shadow:0 18px 38px rgba(0,0,0,.28),0 0 22px rgba(245,158,11,.08) !important; }
.support-choice:not(:disabled):active { transform:translateY(-1px) scale(.99); }
.support-choice:disabled, .support-primary-button:disabled, .support-icon-action:disabled, .support-action-button:disabled, .support-modal-cancel:disabled, .support-modal-delete:disabled { opacity:.5; cursor:not-allowed; box-shadow:none !important; transform:none !important; }
.support-choice-icon { display:grid; place-items:center; width:56px; height:56px; border-radius:16px; font-size:1.45rem; color:var(--gold-light); background:rgba(245,158,11,.12); }
.support-choice h2 { font-size:1.3rem; }
.support-choice p { color:var(--text-muted); line-height:1.65; }
.support-choice small { margin-top:auto; color:var(--emerald-main); font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
.support-choice.virtual { opacity:.7; cursor:not-allowed; }
.support-choice.virtual .support-choice-icon { color:#94a3b8; background:rgba(148,163,184,.12); }
.support-coming { display:inline-flex; padding:.23rem .55rem; border-radius:999px; color:#fbbf24; background:rgba(251,191,36,.13); border:1px solid rgba(251,191,36,.25); font-size:.68rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.support-dashboard { display:grid; grid-template-columns:310px minmax(0,1fr); min-height:640px; overflow:hidden; border:1px solid var(--border-subtle); border-radius:var(--radius-lg); background:rgba(12,16,24,.74); box-shadow:0 20px 48px rgba(0,0,0,.2); }
.support-sidebar { display:flex; flex-direction:column; min-width:0; border-right:1px solid var(--border-subtle); background:rgba(8,11,17,.58); }
.support-sidebar-header { padding:1.15rem; border-bottom:1px solid var(--border-subtle); }
.support-sidebar-title { display:flex; align-items:center; justify-content:space-between; gap:.75rem; margin-bottom:.9rem; }
.support-sidebar-title h2 { font-size:1rem; }
.support-attention { min-width:22px; padding:.08rem .42rem; border-radius:999px; text-align:center; color:#1a1205; background:var(--gold-light); font-size:.72rem; font-weight:900; }
.support-sidebar-search { position:relative; margin-top:.7rem; }
.support-sidebar-search i { position:absolute; left:.7rem; top:50%; color:var(--text-muted); transform:translateY(-50%); font-size:.76rem; }
.support-sidebar-search input { width:100%; padding-left:2rem !important; font-size:.82rem !important; }
.support-filters { display:flex; gap:.35rem; overflow-x:auto; padding:.75rem 1rem; border-bottom:1px solid var(--border-subtle); }
.support-filter { flex:0 0 auto; padding:.36rem .6rem !important; border-radius:999px !important; color:var(--text-muted) !important; background:transparent !important; border-color:transparent !important; font-size:.7rem !important; font-weight:800; cursor:pointer; }
.support-filter:hover, .support-filter.active { color:var(--gold-light) !important; background:rgba(245,158,11,.1) !important; border-color:rgba(245,158,11,.2) !important; }
.support-ticket-list { flex:1; overflow-y:auto; padding:.65rem; }
.support-ticket-row { display:block; width:100%; margin-bottom:.45rem; padding:.75rem !important; text-align:left; color:var(--text-primary) !important; background:transparent !important; border-color:transparent !important; cursor:pointer; }
.support-ticket-row:hover { background:rgba(255,255,255,.045) !important; border-color:var(--border-subtle) !important; }
.support-ticket-row.active { background:rgba(245,158,11,.1) !important; border-color:rgba(245,158,11,.28) !important; }
.support-ticket-row-top, .support-ticket-row-meta { display:flex; align-items:center; justify-content:space-between; gap:.45rem; }
.support-ticket-code { color:var(--gold-light); font-size:.69rem; font-weight:900; letter-spacing:.045em; }
.support-ticket-subject { overflow:hidden; margin:.18rem 0; color:var(--text-primary); font-size:.82rem; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }
.support-ticket-row-meta { color:var(--text-muted); font-size:.68rem; }
.support-status { display:inline-flex; align-items:center; gap:.28rem; padding:.18rem .43rem; border-radius:999px; border:1px solid transparent; font-size:.61rem; font-weight:900; letter-spacing:.045em; text-transform:uppercase; white-space:nowrap; }
.support-status.open { color:#6ee7b7; background:rgba(52,211,153,.1); border-color:rgba(52,211,153,.22); }
.support-status.waiting_support { color:#fcd34d; background:rgba(251,191,36,.1); border-color:rgba(251,191,36,.22); }
.support-status.staff_replied { color:#93c5fd; background:rgba(96,165,250,.1); border-color:rgba(96,165,250,.22); }
.support-status.waiting_user { color:#fdba74; background:rgba(251,146,60,.1); border-color:rgba(251,146,60,.22); }
.support-status.closed { color:#fca5a5; background:rgba(248,113,113,.1); border-color:rgba(248,113,113,.22); }
.support-main { display:flex; min-width:0; min-height:0; flex-direction:column; background:linear-gradient(180deg,rgba(18,22,32,.76),rgba(10,13,20,.68)); }
.support-main-empty { flex:1; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:.6rem; padding:3rem; color:var(--text-muted); text-align:center; }
.support-main-empty i { color:rgba(245,158,11,.65); font-size:2.3rem; }
.support-ticket-header { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; padding:1.25rem 1.4rem; border-bottom:1px solid var(--border-subtle); }
.support-ticket-heading { min-width:0; }
.support-ticket-heading h2 { overflow:hidden; font-size:1.15rem; text-overflow:ellipsis; white-space:nowrap; }
.support-ticket-heading p { margin-top:.2rem; color:var(--text-muted); font-size:.78rem; }
.support-ticket-actions { display:flex; align-items:center; flex-wrap:wrap; justify-content:flex-end; gap:.42rem; }
.support-icon-action { display:inline-flex; align-items:center; justify-content:center; min-width:34px; height:34px; padding:.45rem !important; color:var(--text-secondary) !important; background:rgba(255,255,255,.04) !important; border-color:var(--border-subtle) !important; font-size:.75rem !important; cursor:pointer; }
.support-icon-action:hover { color:var(--gold-light) !important; border-color:rgba(245,158,11,.35) !important; }
.support-icon-action.danger:hover { color:#fca5a5 !important; border-color:rgba(248,113,113,.4) !important; }
.support-action-button { display:inline-flex; align-items:center; justify-content:center; gap:.42rem; min-height:34px; padding:.48rem .65rem !important; color:var(--text-secondary) !important; background:rgba(255,255,255,.04) !important; border-color:var(--border-subtle) !important; font-size:.72rem !important; font-weight:800; cursor:pointer; white-space:nowrap; }
.support-action-button:hover { color:var(--gold-light) !important; border-color:rgba(245,158,11,.35) !important; background:rgba(245,158,11,.08) !important; }
.support-action-button:active { transform:translateY(1px); }
.support-action-button.danger:hover { color:#fecaca !important; border-color:rgba(248,113,113,.42) !important; background:rgba(185,28,28,.12) !important; }
.support-ticket-info { display:flex; align-items:center; flex-wrap:wrap; gap:.5rem .9rem; padding:.7rem 1.4rem; color:var(--text-muted); font-size:.73rem; border-bottom:1px solid var(--border-subtle); }
.support-ticket-info i { margin-right:.25rem; color:var(--gold-main); }
.support-ticket-body { display:grid; grid-template-columns:minmax(0,1fr) 195px; min-height:0; flex:1; }
.support-messages { min-height:320px; max-height:calc(100vh - 386px); overflow-y:auto; padding:1.3rem; }
.support-message { display:flex; align-items:flex-start; gap:.65rem; max-width:82%; margin-bottom:1rem; }
.support-message.mine { margin-left:auto; flex-direction:row-reverse; }
.support-message-avatar { width:32px; height:32px; flex:0 0 auto; border-radius:10px; background:#1e293b; object-fit:cover; }
.support-message-bubble { min-width:0; padding:.72rem .86rem; border:1px solid var(--border-subtle); border-radius:4px 13px 13px 13px; background:rgba(255,255,255,.045); }
.support-message.mine .support-message-bubble { border-color:rgba(245,158,11,.24); border-radius:13px 4px 13px 13px; background:rgba(245,158,11,.11); }
.support-message-meta { display:flex; align-items:center; gap:.45rem; margin-bottom:.25rem; color:var(--text-muted); font-size:.65rem; }
.support-message-meta strong { color:var(--text-secondary); font-size:.7rem; }
.support-message-body { overflow-wrap:anywhere; color:#e5e7eb; font-size:.82rem; line-height:1.6; white-space:pre-wrap; }
.support-customer-card { margin:.9rem .9rem .9rem 0; align-self:start; padding:.9rem; border:1px solid var(--border-subtle); border-radius:12px; background:rgba(8,11,17,.5); }
.support-customer-card h3 { margin-bottom:.55rem; font-size:.78rem; letter-spacing:.05em; text-transform:uppercase; }
.support-customer-card p { margin:.35rem 0; color:var(--text-muted); font-size:.72rem; overflow-wrap:anywhere; }
.support-customer-card strong { color:var(--text-secondary); }
.support-compose { display:flex; align-items:flex-end; gap:.65rem; padding:.9rem 1.25rem 1.1rem; border-top:1px solid var(--border-subtle); background:rgba(8,11,17,.36); }
.support-compose textarea { width:100%; min-height:48px; max-height:130px; resize:vertical; }
.support-compose-count { flex:0 0 auto; color:var(--text-muted); font-size:.65rem; }
.support-send { flex:0 0 auto; min-width:92px; height:44px; padding:.65rem !important; cursor:pointer; }
.support-create { width:min(680px,100%); margin:auto; padding:1.8rem; }
.support-create h2 { font-size:1.4rem; margin:.25rem 0; }
.support-create > p { color:var(--text-muted); font-size:.86rem; }
.support-category-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.55rem; margin:1.35rem 0; }
.support-category { min-height:73px; padding:.65rem !important; color:var(--text-secondary) !important; background:rgba(255,255,255,.025) !important; border-color:var(--border-subtle) !important; font-size:.75rem !important; font-weight:700; cursor:pointer; }
.support-category:hover,.support-category.active { color:var(--gold-light) !important; background:rgba(245,158,11,.09) !important; border-color:rgba(245,158,11,.36) !important; }
.support-form-group { margin-top:.9rem; }
.support-form-group label { display:flex; justify-content:space-between; margin-bottom:.35rem; color:var(--text-secondary); font-size:.74rem; font-weight:800; }
.support-form-group input,.support-form-group textarea { width:100%; }
.support-form-group textarea { min-height:145px; resize:vertical; }
.support-create-actions { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:1rem; }
.support-link-button { padding:.55rem !important; color:var(--text-muted) !important; background:transparent !important; border-color:transparent !important; cursor:pointer; }
.support-primary-button { display:inline-flex; align-items:center; gap:.5rem; padding:.7rem 1rem !important; color:#17100a !important; background:var(--gold-main) !important; border-color:var(--gold-main) !important; font-weight:900; cursor:pointer; }
.support-primary-button:hover { background:var(--gold-light) !important; }
.support-blank-list { padding:1.8rem .75rem; color:var(--text-muted); font-size:.78rem; text-align:center; }
.support-modal-backdrop { position:fixed; inset:0; z-index:4600; display:grid; place-items:center; padding:1rem; background:rgba(2,4,8,.75); backdrop-filter:blur(5px); }
.support-modal { width:min(460px,100%); padding:1.35rem; border:1px solid rgba(245,158,11,.25); border-radius:16px; background:#121722; box-shadow:0 25px 70px rgba(0,0,0,.55); }
.support-modal h2 { font-size:1.12rem; }
.support-modal p { margin:.5rem 0 .85rem; color:var(--text-muted); font-size:.84rem; }
.support-modal textarea,.support-modal select { width:100%; }
.support-modal-actions { display:flex; justify-content:flex-end; gap:.55rem; margin-top:1rem; }
.support-modal-cancel { padding:.65rem .9rem !important; cursor:pointer; }
.support-modal-delete { padding:.65rem .9rem !important; color:#fff !important; background:#b91c1c !important; border-color:#dc2626 !important; cursor:pointer; }
.support-logs { max-height:180px; overflow:auto; margin:.7rem 1.4rem 0; padding:.65rem; border:1px solid var(--border-subtle); border-radius:10px; background:rgba(8,11,17,.45); }
.support-log { padding:.45rem 0; color:var(--text-muted); border-bottom:1px solid rgba(255,255,255,.05); font-size:.7rem; }
.support-log:last-child { border-bottom:0; }

@media (max-width: 900px) { .support-page { padding:1.25rem 1rem 2rem; } .support-dashboard { grid-template-columns:270px minmax(0,1fr); } .support-ticket-body { grid-template-columns:1fr; } .support-customer-card { display:none; } .support-messages { max-height:440px; } }
@media (max-width: 680px) { .support-page-hero { min-height:0; padding:1.45rem; } .support-hero-shield { display:none; } .support-choice-grid { grid-template-columns:1fr; } .support-choice { min-height:190px; } .support-dashboard { display:flex; min-height:0; flex-direction:column; } .support-sidebar { max-height:310px; border-right:0; border-bottom:1px solid var(--border-subtle); } .support-ticket-header { padding:1rem; flex-direction:column; } .support-ticket-actions { justify-content:flex-start; } .support-ticket-info { padding:.65rem 1rem; } .support-messages { max-height:420px; padding:1rem; } .support-message { max-width:94%; } .support-compose { padding:.75rem; gap:.45rem; } .support-compose-count { display:none; } .support-send { min-width:48px; } .support-send .support-send-label { display:none; } .support-category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .support-create { padding:1rem; } }

/* ==========================================================================
   SIDEBAR & TOPBAR NAVIGATION SYSTEM
   ========================================================================== */
:root {
  --sidebar-w: 264px;
  --sidebar-w-collapsed: 76px;
  --topbar-h: 56px;
}

body {
  padding-left: var(--sidebar-w) !important;
  transition: padding-left 0.2s ease;
}

html.mc-sidebar-collapsed body {
  padding-left: var(--sidebar-w-collapsed) !important;
}

@media (max-width: 992px) {
  body { padding-left: 0 !important; padding-top: var(--topbar-h) !important; }
}

/* Mobile-only slim top bar (hamburger + brand + avatar) */
.mc-topbar { display: none; }

@media (max-width: 992px) {
  .mc-topbar {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    position: fixed;
    top: 0; left: 0; right: 0;
    height: var(--topbar-h);
    padding: 0 1rem;
    background: rgba(9, 11, 16, 0.92);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom: 1px solid var(--border-subtle);
    z-index: 1100;
  }
  .mc-topbar .mc-brand-title { font-size: 1.1rem; }
  .mc-topbar .mc-brand-logo { width: 32px; height: 32px; }
}

@media (max-width: 420px) {
  .mc-topbar { gap: 0.5rem; padding: 0 0.5rem; }
  .mc-topbar .mc-brand-title { display: none; }
  .mc-topbar .mc-brand { gap: 0; }
}

.mc-topbar-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  flex-shrink: 0;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  color: #f8fafc;
  font-size: 1.05rem;
  cursor: pointer;
  padding: 0 !important;
  transition: all 0.2s ease;
}
.mc-topbar-toggle:hover { border-color: rgba(245, 158, 11, 0.4); color: #f59e0b; }

/* Sidebar shell */
.mc-sidebar {
  position: fixed;
  top: 0; left: 0;
  height: 100vh;
  width: var(--sidebar-w);
  background: rgba(10, 13, 20, 0.97) !important;
  backdrop-filter: blur(20px) saturate(160%);
  -webkit-backdrop-filter: blur(20px) saturate(160%);
  border-right: 1px solid var(--border-subtle);
  z-index: 1000;
  transition: width 0.2s ease, transform 0.25s ease;
  box-shadow: 6px 0 24px rgba(0, 0, 0, 0.35);
}

html.mc-sidebar-collapsed .mc-sidebar { width: var(--sidebar-w-collapsed); }

.mc-sidebar-inner {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: visible;
}

.mc-sidebar-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 1.15rem 1rem;
  border-bottom: 1px solid var(--border-subtle);
  flex-shrink: 0;
}

.mc-sidebar-collapse-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  flex-shrink: 0;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  color: #94a3b8;
  cursor: pointer;
  padding: 0 !important;
  transition: all 0.2s ease;
}
.mc-sidebar-collapse-btn:hover { color: #f59e0b; border-color: rgba(245, 158, 11, 0.4); }
.mc-sidebar-collapse-btn i { transition: transform 0.2s ease; }
html.mc-sidebar-collapsed .mc-sidebar-collapse-btn i { transform: rotate(180deg); }

.mc-sidebar-nav {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 0.85rem 0.75rem;
  scrollbar-gutter: stable both-edges;
}
.mc-sidebar-nav::-webkit-scrollbar { width: 6px; }
.mc-sidebar-nav::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.12); border-radius: 3px; }

.mc-nav-section { margin-bottom: 1.15rem; }
.mc-nav-section-label {
  font-family: 'Outfit', sans-serif;
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #64748b;
  padding: 0 0.6rem;
  margin-bottom: 0.45rem;
  white-space: nowrap;
}

/* Brand Logo */
.mc-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none !important;
  user-select: none;
}

.mc-brand-logo {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: linear-gradient(135deg, #f59e0b, #d97706);
  padding: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 20px rgba(245, 158, 11, 0.35);
  border: 1px solid rgba(251, 191, 36, 0.5);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.mc-brand:hover .mc-brand-logo {
  transform: translateY(-1px) scale(1.04);
  box-shadow: 0 0 26px rgba(245, 158, 11, 0.55);
}

.mc-brand-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  image-rendering: pixelated;
  border-radius: 6px;
}

.mc-brand-title {
  font-family: 'Outfit', sans-serif !important;
  font-size: 1.55rem;
  font-weight: 900;
  color: #ffffff !important;
  letter-spacing: -0.02em;
  line-height: 1;
}

.mc-brand-title span {
  background: linear-gradient(135deg, #fbbf24 20%, #f59e0b 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-left: 2px;
}

/* Sidebar nav rows (also used for the mobile drawer, same markup) */
.mc-nav-link {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  width: 100%;
  min-height: 42px;
  padding: 0.6rem 0.65rem !important;
  margin-bottom: 2px;
  font-family: 'Outfit', sans-serif !important;
  font-size: 0.92rem;
  font-weight: 600;
  color: #94a3b8 !important;
  background: none;
  border-radius: 9px !important;
  border: 1px solid transparent;
  text-decoration: none !important;
  cursor: pointer;
  text-align: left;
  transition: all 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  white-space: nowrap;
}

/* Buttons inherit global form defaults, so explicitly restore navigation-row sizing. */
.mc-sidebar button.mc-nav-link {
  background: none !important;
  border-color: transparent !important;
}
.mc-sidebar button.mc-nav-link:hover { background: rgba(255, 255, 255, 0.05) !important; }

.mc-nav-link > i:first-child {
  width: 18px;
  text-align: center;
  font-size: 0.95rem;
  opacity: 0.85;
  flex-shrink: 0;
  transition: transform 0.2s ease, opacity 0.2s ease;
}

.mc-nav-label {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mc-nav-link:hover {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.05);
}

.mc-nav-link:hover > i:first-child {
  opacity: 1;
  transform: translateY(-1px);
}

.mc-nav-link.active {
  color: #fbbf24 !important;
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.18), rgba(217, 119, 6, 0.08)) !important;
  border-color: rgba(245, 158, 11, 0.3) !important;
  font-weight: 700;
}

.mc-nav-link.active > i:first-child {
  color: #fbbf24;
  opacity: 1;
}

.mc-nav-link.mc-nav-staff {
  color: #fca5a5 !important;
}

.mc-nav-link.mc-nav-staff:hover {
  background: rgba(239, 68, 68, 0.12);
  border-color: rgba(239, 68, 68, 0.25);
  color: #fecaca !important;
}

.mc-nav-link.mc-nav-staff.active {
  background: linear-gradient(135deg, rgba(239, 68, 68, 0.2), rgba(185, 28, 28, 0.1)) !important;
  border-color: rgba(239, 68, 68, 0.4) !important;
  color: #fca5a5 !important;
}

/* Expandable groups (e.g. Shop -> Elemental / Regular) */
.mc-nav-group-chevron {
  font-size: 0.72rem;
  opacity: 0.6;
  margin-left: auto;
  flex-shrink: 0;
  transition: transform 0.2s ease;
}
.mc-nav-group.open .mc-nav-group-chevron { transform: rotate(180deg); }

.mc-nav-group-children {
  overflow: hidden;
  max-height: 0;
  padding-left: 1.6rem;
  transition: max-height 0.25s ease;
}

.mc-nav-sublink {
  font-size: 0.87rem;
  padding: 0.5rem 0.6rem;
}

/* Server status / IP widgets, relocated into the sidebar */
.mc-sidebar-widgets {
  padding: 0.85rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  border-top: 1px solid var(--border-subtle);
  flex-shrink: 0;
}

/* User profile area (bottom of sidebar) */
.mc-sidebar-footer {
  padding: 0.9rem 1rem;
  border-top: 1px solid var(--border-subtle);
  position: relative;
  flex-shrink: 0;
}

.mc-user-card {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  width: 100%;
  background: none !important;
  border: 1px solid transparent !important;
  border-radius: 10px;
  padding: 0.45rem !important;
  cursor: pointer;
  transition: all 0.18s ease;
}
.mc-user-card:hover { background: rgba(255, 255, 255, 0.05) !important; border-color: var(--border-subtle) !important; }
.mc-user-card .mc-head-avatar {
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  padding: 3px;
  box-sizing: border-box;
  object-fit: contain;
}

.mc-user-card-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  overflow: hidden;
  flex: 1;
  min-width: 0;
}
.mc-user-card-name {
  color: #fff;
  font-weight: 700;
  font-size: 0.88rem;
  font-family: 'Outfit', sans-serif;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.mc-user-card-role {
  color: #64748b;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.mc-user-card-chevron { font-size: 0.75rem; color: #64748b; flex-shrink: 0; }

.mc-user-card-menu {
  position: absolute;
  bottom: calc(100% + 6px);
  left: 1rem;
  right: 1rem;
  background: #12151d;
  border: 1px solid var(--border-subtle);
  border-radius: 10px;
  padding: 0.4rem;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.5);
  z-index: 1200;
}
.mc-user-card-menu a, .mc-user-card-menu button {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  width: 100%;
  padding: 0.55rem 0.7rem !important;
  border-radius: 7px !important;
  border: none !important;
  background: none !important;
  color: #cbd5e1 !important;
  font-family: inherit !important;
  font-size: 0.87rem !important;
  font-weight: 600;
  text-decoration: none !important;
  text-align: left;
  cursor: pointer;
}
.mc-user-card-menu a:hover, .mc-user-card-menu button:hover { background: rgba(255, 255, 255, 0.06); color: #fff !important; }
.mc-user-card-logout:hover { background: rgba(239, 68, 68, 0.14) !important; color: #fca5a5 !important; }

/* Collapsed (icon-only) desktop state */
html.mc-sidebar-collapsed .mc-nav-label,
html.mc-sidebar-collapsed .mc-nav-section-label,
html.mc-sidebar-collapsed .mc-nav-group-chevron,
html.mc-sidebar-collapsed .mc-sidebar-widgets,
html.mc-sidebar-collapsed .mc-user-card-text,
html.mc-sidebar-collapsed .mc-user-card-chevron,
html.mc-sidebar-collapsed .mc-brand-title {
  display: none !important;
}
html.mc-sidebar-collapsed .mc-sidebar-header {
  position: relative;
  justify-content: center;
  min-height: 88px;
  padding: 0.75rem 0.5rem 0.5rem;
}
html.mc-sidebar-collapsed .mc-sidebar-header .mc-brand {
  position: absolute;
  top: 0.75rem;
  left: 50%;
  gap: 0;
  transform: translateX(-50%);
}
html.mc-sidebar-collapsed .mc-sidebar-collapse-btn {
  position: absolute;
  bottom: 0.45rem;
  left: 50%;
  width: 28px;
  height: 26px;
  transform: translateX(-50%);
}
html.mc-sidebar-collapsed .mc-nav-section,
html.mc-sidebar-collapsed .mc-nav-group,
html.mc-sidebar-collapsed .mc-nav-group-children {
  display: grid;
  justify-items: center;
  gap: 0.35rem;
  width: 100%;
}
html.mc-sidebar-collapsed .mc-nav-section { margin-bottom: 0.85rem; }
html.mc-sidebar-collapsed .mc-nav-group-children { max-height: none !important; padding-left: 0; }
html.mc-sidebar-collapsed .mc-nav-link {
  justify-content: center;
  width: 44px;
  min-height: 44px;
  height: 44px;
  margin: 0;
  padding: 0 !important;
}
html.mc-sidebar-collapsed .mc-nav-link > i:first-child { width: auto; }
html.mc-sidebar-collapsed .mc-sidebar-footer {
  display: flex;
  justify-content: center;
  padding: 0.8rem 0.5rem;
}
html.mc-sidebar-collapsed .mc-user-card {
  justify-content: center;
  width: 48px;
  min-width: 48px;
  height: 48px;
  padding: 3px !important;
}
html.mc-sidebar-collapsed .mc-user-card .mc-head-avatar {
  width: 40px;
  height: 40px;
  flex-basis: 40px;
}
html.mc-sidebar-collapsed .mc-user-card-menu {
  bottom: 0;
  left: calc(100% + 0.75rem);
  right: auto;
  width: 178px;
}

html.mc-sidebar-collapsed .mc-sidebar [data-tooltip] { position: relative; }
html.mc-sidebar-collapsed .mc-sidebar [data-tooltip]:hover::after,
html.mc-sidebar-collapsed .mc-sidebar [data-tooltip]:focus-visible::after {
  content: attr(data-tooltip);
  position: absolute;
  left: calc(100% + 12px);
  top: 50%;
  transform: translateY(-50%);
  background: #14181f;
  color: #fff;
  padding: 0.4rem 0.75rem;
  border-radius: 6px;
  border: 1px solid rgba(245, 158, 11, 0.35);
  font-family: 'Outfit', sans-serif;
  font-size: 0.8rem;
  font-weight: 600;
  white-space: nowrap;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.5);
  z-index: 1300;
  pointer-events: none;
}

/* The compact duty control remains icon-only in the expanded sidebar too. */
.mc-duty-toggle-sidebar[data-tooltip] { position: relative; }
@media (min-width: 993px) {
  .mc-duty-toggle-sidebar[data-tooltip]:hover::after,
  .mc-duty-toggle-sidebar[data-tooltip]:focus-visible::after {
    content: attr(data-tooltip);
    position: absolute;
    left: calc(100% + 0.7rem);
    top: 50%;
    transform: translateY(-50%);
    padding: 0.4rem 0.65rem;
    border: 1px solid rgba(245, 158, 11, 0.35);
    border-radius: 6px;
    background: #14181f;
    color: #fff;
    font-family: 'Outfit', sans-serif;
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: none;
    white-space: nowrap;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.5);
    z-index: 1300;
    pointer-events: none;
  }
}

/* Mobile: sidebar becomes an off-canvas drawer under the topbar */
.mc-sidebar-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
  z-index: 1090;
  opacity: 0;
  transition: opacity 0.2s ease;
}
.mc-sidebar-overlay.visible { opacity: 1; }

@media (min-width: 993px) {
  .mc-sidebar-overlay { display: none !important; }
}

@media (max-width: 992px) {
  .mc-sidebar {
    top: var(--topbar-h);
    height: calc(100vh - var(--topbar-h));
    width: min(280px, 82vw) !important;
    transform: translateX(-100%);
    z-index: 1150;
  }
  .mc-sidebar.open { transform: translateX(0); }
  .mc-sidebar-collapse-btn { display: none; }
  html.mc-sidebar-collapsed .mc-sidebar-header {
    position: static;
    min-height: 0;
    padding: 1.15rem 1rem;
  }
  html.mc-sidebar-collapsed .mc-sidebar-header .mc-brand { position: static; gap: 12px; transform: none; }
  html.mc-sidebar-collapsed .mc-sidebar .mc-brand-title,
  html.mc-sidebar-collapsed .mc-sidebar .mc-nav-label,
  html.mc-sidebar-collapsed .mc-sidebar .mc-nav-section-label,
  html.mc-sidebar-collapsed .mc-sidebar .mc-nav-group-chevron,
  html.mc-sidebar-collapsed .mc-sidebar .mc-user-card-chevron { display: block !important; }
  html.mc-sidebar-collapsed .mc-sidebar .mc-sidebar-widgets,
  html.mc-sidebar-collapsed .mc-sidebar .mc-user-card-text { display: flex !important; }
  html.mc-sidebar-collapsed .mc-nav-section,
  html.mc-sidebar-collapsed .mc-nav-group,
  html.mc-sidebar-collapsed .mc-nav-group-children { display: block; width: auto; }
  html.mc-sidebar-collapsed .mc-nav-section { margin-bottom: 1.15rem; }
  html.mc-sidebar-collapsed .mc-nav-group-children { padding-left: 1.6rem; }
  html.mc-sidebar-collapsed .mc-nav-group:not(.open) .mc-nav-group-children { max-height: 0 !important; }
  html.mc-sidebar-collapsed .mc-nav-group.open .mc-nav-group-children { max-height: none !important; }
  html.mc-sidebar-collapsed .mc-sidebar .mc-nav-link {
    justify-content: flex-start;
    width: 100%;
    min-height: 42px;
    height: auto;
    margin-bottom: 2px;
    padding: 0.6rem 0.65rem !important;
  }
  html.mc-sidebar-collapsed .mc-sidebar .mc-nav-link > i:first-child { width: 18px; }
  html.mc-sidebar-collapsed .mc-sidebar-footer { display: block; padding: 0.9rem 1rem; }
  html.mc-sidebar-collapsed .mc-user-card {
    justify-content: flex-start;
    width: 100%;
    min-width: 0;
    height: auto;
    padding: 0.45rem !important;
  }
  html.mc-sidebar-collapsed .mc-user-card .mc-head-avatar { width: 40px; height: 40px; flex-basis: 40px; }
  html.mc-sidebar-collapsed .mc-user-card-menu { bottom: calc(100% + 6px); left: 1rem; right: 1rem; width: auto; }
}

/* Status Pill */
.mc-status-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(16, 185, 129, 0.08);
  border: 1px solid rgba(16, 185, 129, 0.25);
  color: #34d399;
  font-family: 'Outfit', sans-serif;
  font-size: 0.8rem;
  font-weight: 700;
  padding: 0.35rem 0.75rem;
  border-radius: 20px;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.mc-status-dot {
  width: 7px;
  height: 7px;
  background: #10b981;
  border-radius: 50%;
  box-shadow: 0 0 8px #10b981;
  animation: pulse-dot 2s infinite ease-in-out;
}
.mc-status-pill.mc-duty-off { background:rgba(239,68,68,.1); border-color:rgba(239,68,68,.35); color:#f87171; }
.mc-status-dot.mc-status-dot-off { background:#ef4444; box-shadow:0 0 8px #ef4444; animation:none; }

@keyframes pulse-dot {
  0%, 100% { opacity: 1; transform: scale(1); box-shadow: 0 0 8px #10b981; }
  50% { opacity: 0.4; transform: scale(0.85); box-shadow: 0 0 2px #10b981; }
}

/* On-duty / off-duty toggle — deliberately placed in the topbar (mobile) and sidebar header
   (desktop) so it's reachable in one click from anywhere, not buried in a staff sub-tab. */
.mc-duty-toggle { display:inline-flex; align-items:center; gap:.4rem; border:1px solid var(--border-subtle); border-radius:20px !important; padding:.35rem .75rem !important; font:700 .72rem var(--font-heading); letter-spacing:.03em; text-transform:uppercase; cursor:pointer; background:rgba(148,163,184,.08); color:var(--text-muted); transition:background .15s,border-color .15s,color .15s; }
.mc-duty-toggle .mc-duty-dot { width:7px; height:7px; border-radius:50%; background:currentColor; flex-shrink:0; }
.mc-duty-toggle.on-duty { background-color:rgba(16,185,129,.12) !important; border-color:rgba(16,185,129,.35) !important; color:#34d399 !important; box-shadow:0 0 13px rgba(16,185,129,.16) !important; text-shadow:0 0 7px rgba(52,211,153,.24); }
.mc-duty-toggle.on-duty .mc-duty-dot { box-shadow:0 0 8px #10b981; animation:pulse-dot 2s infinite ease-in-out; }
.mc-duty-toggle.off-duty { background-color:rgba(239,68,68,.1) !important; border-color:rgba(239,68,68,.35) !important; color:#f87171 !important; box-shadow:0 0 13px rgba(239,68,68,.16) !important; text-shadow:0 0 7px rgba(248,113,113,.24); }
.mc-duty-toggle.off-duty .mc-duty-dot { box-shadow:0 0 8px #ef4444; }
.mc-duty-toggle.off-duty:hover { background:rgba(239,68,68,.18); border-color:rgba(248,113,113,.65); color:#fca5a5; }
.mc-duty-toggle-sidebar { align-self:center; justify-content:center; width:42px; min-width:42px; height:42px; margin:0 auto .8rem; padding:0 !important; border-radius:11px !important; }
.mc-duty-toggle-sidebar .mc-duty-icon { font-size:0.95rem; line-height:1; }
.mc-duty-toggle-sidebar .mc-duty-dot { display:none; }
.mc-duty-toggle-sidebar .mc-duty-label { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (max-width: 992px) { .mc-duty-toggle-sidebar { display:none; } }

/* Holiday Mode management stays intentionally calm: the staff workspace receives
   settings controls and status only, never decorative particles or animations. */
.holiday-admin-card { margin-bottom:1rem; }
.holiday-admin-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; padding-bottom:1rem; border-bottom:1px solid var(--border-subtle); }
.holiday-admin-heading .mc-card-title { margin:.18rem 0 .3rem; }
.holiday-admin-heading .mc-card-title i { color:#fbbf24; }
.holiday-admin-heading p,.holiday-admin-help,.holiday-schedule-panel > p { margin:0; max-width:680px; color:var(--text-muted); font-size:.82rem; line-height:1.55; }
.holiday-admin-eyebrow { display:inline-flex; align-items:center; gap:.35rem; color:#fbbf24; font:800 .68rem var(--font-heading); letter-spacing:.06em; text-transform:uppercase; }
.holiday-admin-status { display:inline-flex; align-items:center; gap:.4rem; flex:0 0 auto; padding:.38rem .62rem; border:1px solid var(--border-subtle); border-radius:999px; font:800 .72rem var(--font-heading); }
.holiday-admin-status i { font-size:.52rem; }
.holiday-admin-status.is-enabled { color:#6ee7b7; border-color:rgba(16,185,129,.35); background:rgba(16,185,129,.09); }
.holiday-admin-status.is-disabled { color:#fca5a5; border-color:rgba(239,68,68,.35); background:rgba(239,68,68,.08); }
.holiday-admin-summary { display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:.7rem; margin:1rem 0; }
.holiday-admin-summary > div { padding:.72rem .8rem; border:1px solid var(--border-subtle); border-radius:9px; background:rgba(255,255,255,.025); }
.holiday-admin-summary span { display:block; margin-bottom:.12rem; color:#64748b; font-size:.68rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }
.holiday-admin-summary strong { color:#f8fafc; font-size:.86rem; }
.holiday-admin-form { display:grid; gap:.8rem; }
.holiday-admin-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.8rem; }
.holiday-admin-fields label { display:grid; gap:.32rem; color:#cbd5e1; font-size:.76rem; font-weight:800; }
.holiday-admin-fields select { width:100%; }
.holiday-admin-options { display:flex; flex-wrap:wrap; gap:.5rem 1rem; }
.holiday-admin-options label { display:inline-flex; align-items:center; gap:.42rem; color:#cbd5e1; font-size:.78rem; cursor:pointer; }
.holiday-admin-options input { width:15px; height:15px; accent-color:#f59e0b; }
.holiday-admin-actions { display:flex; flex-wrap:wrap; gap:.6rem; }
.holiday-admin-disable { margin-top:1rem; padding-top:1rem; border-top:1px solid var(--border-subtle); }
.holiday-schedule-panel { margin-bottom:1rem; }
.holiday-schedule-panel summary { display:flex; align-items:center; justify-content:space-between; gap:.75rem; cursor:pointer; color:#f8fafc; font:800 .92rem var(--font-heading); }
.holiday-schedule-panel summary span { display:inline-flex; align-items:center; gap:.45rem; }
.holiday-schedule-panel summary i { color:#fbbf24; }
.holiday-schedule-panel summary small { color:#64748b; font:700 .68rem var(--font-body); }
.holiday-schedule-panel > p { margin:1rem 0 .75rem; }
.holiday-schedule-form { display:grid; gap:.85rem; }
.holiday-schedule-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:.7rem; }
.holiday-schedule-grid fieldset { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.5rem; min-width:0; padding:.7rem; border:1px solid var(--border-subtle); border-radius:9px; background:rgba(255,255,255,.02); }
.holiday-schedule-grid legend { padding:0 .25rem; color:#f8fafc; font:800 .77rem var(--font-heading); }
.holiday-schedule-grid label { display:grid; gap:.2rem; color:#94a3b8; font-size:.67rem; font-weight:700; }
.holiday-schedule-grid input { width:100%; min-width:0; padding:.42rem .5rem !important; font-size:.8rem !important; }
@media (max-width:680px) { .holiday-admin-heading{flex-direction:column}.holiday-admin-summary,.holiday-admin-fields{grid-template-columns:1fr}.holiday-admin-status{align-self:flex-start}.holiday-schedule-panel summary{align-items:flex-start;flex-direction:column} }

/* Read-only Rules categories and the intentionally minimal Guides placeholder. */
.mc-rules-page { max-width:1120px; }
.mc-rules-hero { position:relative; overflow:hidden; margin-bottom:1.15rem; background:linear-gradient(135deg,rgba(18,22,32,.96),rgba(245,158,11,.12)) !important; border-color:rgba(245,158,11,.32) !important; }
.mc-rules-hero::after { content:''; position:absolute; width:290px; height:290px; right:-115px; top:-160px; border-radius:50%; background:radial-gradient(circle,rgba(245,158,11,.2),transparent 67%); pointer-events:none; }
.mc-rules-hero .mc-page-title { position:relative; z-index:1; margin-top:.55rem; }
.mc-rules-hero .mc-page-title span { color:var(--gold-main); }
.mc-rules-hero .mc-page-subtitle { position:relative; z-index:1; margin:0; }
.mc-rules-nav { display:flex; flex-wrap:wrap; gap:.6rem; padding:.7rem; margin-bottom:1.55rem; border:1px solid var(--border-subtle); border-radius:12px; background:rgba(12,16,24,.65); }
.mc-rules-nav a { display:inline-flex; align-items:center; gap:.45rem; padding:.55rem .78rem; color:var(--text-muted); border:1px solid transparent; border-radius:8px; font-family:var(--font-heading); font-size:.8rem; font-weight:800; text-decoration:none; }
.mc-rules-nav a:hover { color:#fef3c7; background:rgba(245,158,11,.08); border-color:rgba(245,158,11,.22); }
.mc-rules-nav a.active { color:#fef3c7; background:rgba(245,158,11,.14); border-color:rgba(245,158,11,.35); box-shadow:inset 0 0 16px rgba(245,158,11,.06); }
.mc-rules-intro { margin:0 0 1.1rem; }
.mc-rules-intro h2, .mc-rules-section-heading h2 { font-size:1.55rem; margin-bottom:.25rem; }
.mc-rules-intro p, .mc-rules-section-heading p { color:var(--text-muted); max-width:700px; }
.mc-rules-category-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.mc-rules-category-card { position:relative; display:flex; min-height:220px; flex-direction:column; align-items:flex-start; padding:1.35rem; overflow:hidden; background:rgba(18,22,32,.82); border:1px solid var(--border-subtle); border-radius:14px; color:var(--text-primary); text-decoration:none; box-shadow:0 16px 34px rgba(0,0,0,.24); transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.mc-rules-category-card:hover { transform:translateY(-3px); color:#fff; border-color:rgba(245,158,11,.42); box-shadow:0 20px 40px rgba(0,0,0,.38),0 0 18px rgba(245,158,11,.09); }
.mc-rules-category-icon, .mc-rules-section-icon { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; margin-bottom:1rem; border:1px solid rgba(245,158,11,.35); border-radius:11px; background:rgba(245,158,11,.13); color:#fbbf24; font-size:1.2rem; }
.mc-rules-category-card.game .mc-rules-category-icon, .mc-rules-section-icon.game { border-color:rgba(16,185,129,.35); background:rgba(16,185,129,.13); color:#6ee7b7; }
.mc-rules-category-card.discord .mc-rules-category-icon, .mc-rules-section-icon.discord { border-color:rgba(139,92,246,.4); background:rgba(139,92,246,.14); color:#c4b5fd; }
.mc-rules-category-content { display:flex; flex-direction:column; gap:.35rem; }
.mc-rules-category-content strong { font:800 1.22rem var(--font-heading); }
.mc-rules-category-content > span { color:#fbbf24; font-size:.8rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }
.mc-rules-category-card.game .mc-rules-category-content > span { color:#6ee7b7; }
.mc-rules-category-card.discord .mc-rules-category-content > span { color:#c4b5fd; }
.mc-rules-category-content small { color:var(--text-muted); font-size:.88rem; line-height:1.5; }
.mc-rules-category-arrow { position:absolute; right:1.2rem; bottom:1.2rem; color:var(--text-dark); transition:transform .2s ease,color .2s ease; }
.mc-rules-category-card:hover .mc-rules-category-arrow { color:#fbbf24; transform:translateX(4px); }
.mc-rules-section-heading { display:flex; gap:1rem; align-items:flex-start; margin:0 0 1.2rem; padding:1.15rem 0; border-bottom:1px solid var(--border-subtle); }
.mc-rules-section-icon { flex:0 0 auto; margin:0; }
.mc-rules-kicker { display:block; margin-bottom:.25rem; color:#fbbf24; font:800 .72rem var(--font-heading); letter-spacing:.1em; text-transform:uppercase; }
.mc-rules-list { display:grid; gap:.8rem; }
.mc-rules-rule { display:grid; grid-template-columns:38px minmax(0,1fr); gap:.9rem; padding:1.1rem 1.2rem; background:rgba(18,22,32,.76); border:1px solid var(--border-subtle); border-radius:12px; }
.mc-rules-rule-number { display:flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:9px; background:rgba(245,158,11,.13); border:1px solid rgba(245,158,11,.3); color:#fbbf24; font:800 .85rem var(--font-heading); }
.mc-rules-rule h3 { margin:0 0 .25rem; font-size:1rem; }
.mc-rules-rule p { color:var(--text-secondary); font-size:.92rem; line-height:1.6; }
.mc-rules-rule ul { display:grid; gap:.28rem; margin:.7rem 0 0 1.05rem; color:var(--text-muted); font-size:.88rem; }
.mc-rules-rule li::marker { color:#f59e0b; }
.mc-rules-enforcement { display:flex; gap:.8rem; align-items:flex-start; margin:1.25rem 0 2rem; padding:1rem 1.15rem; border:1px solid rgba(16,185,129,.28); border-radius:11px; background:rgba(16,185,129,.08); color:#d1fae5; }
.mc-rules-enforcement > i { margin-top:.2rem; color:#34d399; }
.mc-rules-enforcement p { font-size:.9rem; line-height:1.55; }
.mc-guides-page { display:flex; align-items:center; min-height:calc(100vh - 150px); max-width:780px; }
.mc-guides-placeholder { width:100%; padding:3.5rem 1.5rem !important; text-align:center; background:linear-gradient(135deg,rgba(18,22,32,.96),rgba(245,158,11,.08)) !important; border-color:rgba(245,158,11,.3) !important; }
.mc-guides-placeholder-icon { display:inline-flex; align-items:center; justify-content:center; width:64px; height:64px; margin-bottom:1rem; border:1px solid rgba(245,158,11,.4); border-radius:18px; background:rgba(245,158,11,.14); color:#fbbf24; font-size:1.65rem; box-shadow:0 0 20px rgba(245,158,11,.12); }
.mc-guides-placeholder p { color:var(--text-muted); font-size:1.05rem; }
@media (max-width:800px) { .mc-rules-category-grid { grid-template-columns:1fr; } .mc-rules-category-card { min-height:0; } }
@media (max-width:560px) { .mc-rules-page, .mc-guides-page { margin-top:1rem; padding:0 1rem; } .mc-rules-hero { padding:1.35rem !important; } .mc-rules-nav { padding:.5rem; } .mc-rules-nav a { flex:1 1 100%; justify-content:center; } .mc-rules-section-heading { gap:.75rem; } .mc-rules-section-icon { width:38px; height:38px; font-size:1rem; } .mc-rules-rule { grid-template-columns:30px minmax(0,1fr); padding:1rem; gap:.65rem; } .mc-rules-rule-number { width:28px; height:28px; } }

/* Server IP Button */
.mc-server-ip-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  background: rgba(18, 22, 32, 0.85);
  border: 1px solid rgba(245, 158, 11, 0.3) !important;
  padding: 0.45rem 0.95rem !important;
  border-radius: 10px !important;
  cursor: pointer;
  color: #f8fafc !important;
  font-family: 'Outfit', sans-serif !important;
  font-weight: 700 !important;
  font-size: 0.9rem !important;
  transition: all 0.25s ease !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.mc-server-ip-btn i {
  color: #f59e0b;
  font-size: 0.85rem;
  transition: transform 0.2s ease;
}

.mc-server-ip-btn:hover {
  background: rgba(245, 158, 11, 0.15) !important;
  border-color: #f59e0b !important;
  box-shadow: 0 0 18px rgba(245, 158, 11, 0.3) !important;
  transform: translateY(-1px);
}

.mc-server-ip-btn:hover i {
  transform: scale(1.15);
}

/* Avatar Link */
.mc-avatar-wrap {
  display: flex;
  align-items: center;
  text-decoration: none;
  position: relative;
}

.mc-head-avatar {
  width: 36px;
  height: 36px;
  border-radius: 9px;
  border: 1.5px solid rgba(245, 158, 11, 0.4);
  image-rendering: pixelated;
  background: #090b10;
  transition: all 0.25s ease;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
}

.mc-avatar-wrap:hover .mc-head-avatar {
  border-color: #f59e0b;
  transform: scale(1.08);
  box-shadow: 0 0 16px rgba(245, 158, 11, 0.45);
}

/* Logout Button */
.mc-logout-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.09);
  color: #94a3b8;
  border-radius: 9px;
  text-decoration: none;
  transition: all 0.25s ease;
  font-size: 0.95rem;
}

.mc-logout-btn:hover {
  background: rgba(239, 68, 68, 0.18);
  border-color: rgba(239, 68, 68, 0.35);
  color: #fca5a5;
  transform: translateY(-1px);
  box-shadow: 0 0 14px rgba(239, 68, 68, 0.25);
}

/* HERO SECTION */
.mc-hero {
  position: relative; width: 100%;
  padding: 4.5rem 1.5rem 3.5rem 1.5rem; text-align: center; overflow: hidden;
  background: radial-gradient(circle at 50% 30%, rgba(245, 158, 11, 0.16) 0%, transparent 65%), linear-gradient(to bottom, rgba(9, 11, 16, 0.4), #090b10);
}
.mc-hero-title {
  font-family: 'Outfit', sans-serif !important;
  font-size: clamp(2.5rem, 5vw, 4.2rem) !important;
  font-weight: 900 !important; line-height: 1.1 !important;
  margin-bottom: 1.2rem !important; color: #fff !important;
  letter-spacing: -0.03em !important;
}
.mc-hero-highlight {
  background: linear-gradient(135deg, #ffffff 20%, #fbbf24 60%, #f59e0b 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.mc-hero-subtitle {
  font-size: 1.2rem; color: #94a3b8; max-width: 720px;
  margin: 0 auto 2.2rem auto; line-height: 1.6;
}
/* Smaller page-banner title/subtitle (not the big dashboard.php hero) — was duplicated as
   identical inline styles on rules.php and top.php; any new page-banner should reuse this. */
.mc-page-title { font-family: 'Outfit', sans-serif; font-size: 2.3rem; font-weight: 900; color: #fff; margin-bottom: 0.4rem; }
.mc-page-subtitle { color: #94a3b8; font-size: 1rem; max-width: 800px; }
.mc-ip-widget {
  display: inline-flex; flex-direction: column; align-items: center;
  background: rgba(14, 18, 26, 0.95); border: 1px solid rgba(245, 158, 11, 0.35);
  padding: 0.9rem 1.8rem; border-radius: 14px; margin-bottom: 2.2rem;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.5);
}
.mc-ip-label {
  font-size: 0.72rem; font-weight: 800; color: #64748b;
  text-transform: uppercase; letter-spacing: 0.12em; margin-bottom: 0.3rem;
}
.mc-ip-text {
  font-family: 'Outfit', sans-serif; font-weight: 800; font-size: 1.45rem; color: #fff; letter-spacing: 0.02em;
}
.mc-stats-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 2rem; max-width: 900px; margin: 0 auto;
  border-top: 1px solid rgba(255, 255, 255, 0.08); padding-top: 2.2rem;
}
.mc-stat-num {
  font-size: 2.8rem; font-weight: 900; color: #fff; font-family: 'Outfit', sans-serif; line-height: 1;
}
.mc-stat-label {
  color: #64748b; font-weight: 800; font-size: 0.82rem; letter-spacing: 0.12em; text-transform: uppercase; margin-top: 0.4rem;
}

/* Layout Containers */
.mc-container {
  max-width: 1320px; width: 100%;
  margin: 2rem auto; padding: 0 1.5rem;
  flex: 1;
}

.mc-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 1.5rem; }

.mc-card {
  background: rgba(18, 22, 32, 0.85) !important;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 14px !important;
  padding: 1.75rem !important;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5) !important;
  transition: all 0.3s ease;
}
.mc-card:hover {
  border-color: rgba(245, 158, 11, 0.25) !important;
  transform: translateY(-2px);
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.6) !important;
}

/* Compact stat pill (used on Profile and Dashboard) */
.stat-pill {
  background: rgba(18, 22, 32, 0.75);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  padding: 1.25rem 1.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: all 0.2s ease;
}
.stat-pill:hover {
  border-color: rgba(245, 158, 11, 0.4);
  transform: translateY(-2px);
}

.mc-card-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 1.25rem; padding-bottom: 0.85rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.mc-card-title {
  font-family: 'Outfit', sans-serif !important;
  font-size: 1.35rem; font-weight: 800; color: #fff !important;
  display: flex; align-items: center; gap: 10px;
}
.mc-card-title i { color: #f59e0b; }

/* Buttons */
.mc-btn {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 10px !important;
  padding: 0.7rem 1.4rem !important;
  font-family: 'Outfit', sans-serif !important; font-size: 1.05rem !important; font-weight: 700 !important;
  border-radius: 10px !important; border: none !important; cursor: pointer !important; text-decoration: none !important;
  transition: all 0.25s ease !important;
}
.mc-btn-gold {
  background: linear-gradient(135deg, #fbbf24, #f59e0b) !important;
  color: #0d0f17 !important;
  box-shadow: 0 0 20px rgba(245, 158, 11, 0.3) !important;
}
.mc-btn-gold:hover {
  background: linear-gradient(135deg, #fcd34d, #fbbf24) !important;
  box-shadow: 0 0 28px rgba(245, 158, 11, 0.5) !important;
  transform: translateY(-1px);
}

.mc-btn-primary { background: #10b981 !important; color: #04140c !important; }
.mc-btn-primary:hover { background: #34d399 !important; color: #000 !important; box-shadow: 0 0 20px rgba(16, 185, 129, 0.35) !important; }

.mc-btn-secondary {
  background: rgba(255, 255, 255, 0.06) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
}
.mc-btn-secondary:hover {
  background: rgba(255, 255, 255, 0.12) !important;
  border-color: rgba(255, 255, 255, 0.25) !important;
}

.mc-btn-danger {
  background: rgba(239, 68, 68, 0.18) !important;
  color: #fca5a5 !important;
  border: 1px solid rgba(239, 68, 68, 0.35) !important;
}
.mc-btn-danger:hover {
  background: rgba(239, 68, 68, 0.32) !important;
  color: #fff !important;
}

.mc-btn-block { width: 100%; display: flex; }

/* Badges */
.mc-badge {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 0.25rem 0.65rem; border-radius: 6px;
  font-family: 'Outfit', sans-serif !important; font-size: 0.82rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.05em;
}
.mc-badge-gold { background: rgba(245, 158, 11, 0.15); color: #fbbf24; border: 1px solid rgba(245, 158, 11, 0.35); }
.mc-badge-emerald { background: rgba(16, 185, 129, 0.15); color: #34d399; border: 1px solid rgba(16, 185, 129, 0.35); }
.mc-badge-admin { background: rgba(239, 68, 68, 0.15); color: #fca5a5; border: 1px solid rgba(239, 68, 68, 0.35); }
/* Referenced by includes/ranks.php (rank_meta() badge field) and top.php's category tags,
   but never previously defined — badges using these rendered with no color/border at all. */
.mc-badge-red { background: rgba(239, 68, 68, 0.15); color: #f87171; border: 1px solid rgba(239, 68, 68, 0.35); }
.mc-badge-blue { background: rgba(56, 189, 248, 0.15); color: #38bdf8; border: 1px solid rgba(56, 189, 248, 0.35); }
.mc-badge-green { background: rgba(16, 185, 129, 0.15); color: #34d399; border: 1px solid rgba(16, 185, 129, 0.35); }
.mc-duty-badge { display:inline-flex; align-items:center; gap:.32rem; padding:.2rem .48rem; border:1px solid; border-radius:999px; font:800 .65rem var(--font-heading); letter-spacing:.04em; text-transform:uppercase; white-space:nowrap; }
.mc-duty-badge::before { content:''; width:6px; height:6px; border-radius:50%; background:currentColor; box-shadow:0 0 7px currentColor; }
.mc-duty-badge.on-duty { color:#34d399; background:rgba(16,185,129,.12); border-color:rgba(16,185,129,.38); }
.mc-duty-badge.off-duty { color:#f87171; background:rgba(239,68,68,.12); border-color:rgba(239,68,68,.38); }

/* Numbered leaderboard rank badges (top.php's #1/#2/#3/#n per-row markers) — used on every
   leaderboard tab but never previously defined, so they rendered as bare unstyled text. */
.mc-rank-badge { display:inline-flex; align-items:center; justify-content:center; min-width:2.1rem; padding:.22rem .5rem; border-radius:8px; font:800 .8rem var(--font-heading); letter-spacing:.02em; }
.mc-rank-gold { background:rgba(245,158,11,.18); color:#fbbf24; border:1px solid rgba(245,158,11,.4); }
.mc-rank-silver { background:rgba(203,213,225,.14); color:#e2e8f0; border:1px solid rgba(203,213,225,.35); }
.mc-rank-bronze { background:rgba(217,119,6,.18); color:#f0a868; border:1px solid rgba(217,119,6,.4); }
.mc-rank-default { background:rgba(148,163,184,.1); color:var(--text-muted); border:1px solid var(--border-subtle); }

/* Footer */
.mc-footer {
  margin-top: 5rem;
  padding: 3rem 0;
  background: rgba(7, 9, 14, 0.95);
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  color: var(--text-muted);
  font-size: 0.9rem;
  text-align: center;
}
.mc-footer-inner {
  width: min(100%, 46rem);
  margin: 0 auto;
  padding: 0 1.5rem;
  display: grid;
  justify-items: center;
  gap: 1.35rem;
}
.mc-footer-brand { display: grid; justify-items: center; gap: 0.6rem; }
.mc-footer-title {
  margin: 0;
  color: var(--text-primary);
  font-family: var(--font-heading);
  font-size: 1.1rem;
  font-weight: 900;
  letter-spacing: 0.1em;
}
.mc-footer-title span { color: var(--gold-main); }
.mc-footer-divider {
  width: 4rem;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold-main), transparent);
}
.mc-footer-legal-copy { display: grid; justify-items: center; gap: 0.25rem; }
.mc-footer-copy, .mc-footer-disclaimer, .mc-footer-supplemental { margin: 0; }
.mc-footer-copy { color: var(--text-secondary); font-size: 0.9rem; }
.mc-footer-disclaimer, .mc-footer-supplemental { color: var(--text-dark); font-size: 0.82rem; }
.mc-footer-supplemental { max-width: 38rem; }
.mc-footer-legal-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0.45rem 0.7rem;
  width: 100%;
  padding: 1.1rem 0;
  border-top: 1px solid var(--border-subtle);
  border-bottom: 1px solid var(--border-subtle);
  font-size: 0.84rem;
}
.mc-footer-legal-links a {
  color: var(--text-secondary);
  font-weight: 700;
  text-decoration: none;
}
.mc-footer-legal-links a:hover, .mc-footer-legal-links a:focus-visible { color: var(--gold-light); }
.mc-footer-legal-links span { color: var(--text-dark); }
.mc-footer-business { display: grid; justify-items: center; gap: 0.2rem; }
.mc-footer-business-title {
  margin: 0;
  color: var(--text-primary);
  font-family: var(--font-heading);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.mc-footer-email {
  max-width: 100%;
  color: var(--gold-light);
  font-size: 0.9rem;
  font-weight: 700;
  overflow-wrap: anywhere;
  text-decoration: none;
}
.mc-footer-email:hover, .mc-footer-email:focus-visible { color: #fff; text-decoration: underline; text-underline-offset: 0.2em; }
.mc-footer-social-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.7rem;
  width: 100%;
}
.mc-footer-social-btn {
  display: inline-flex;
  flex: 0 1 9.75rem;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: 2.7rem;
  max-width: 100%;
  padding: 0.65rem 1rem;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 0.65rem;
  background: rgba(255, 255, 255, 0.035);
  color: var(--text-secondary);
  font-size: 0.84rem;
  font-weight: 800;
  line-height: 1;
  text-decoration: none;
  transition: transform 0.2s ease, border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, color 0.2s ease;
}
.mc-footer-social-btn i { color: var(--gold-light); font-size: 1rem; }
.mc-footer-social-btn:hover, .mc-footer-social-btn:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(245, 158, 11, 0.58);
  background: rgba(245, 158, 11, 0.1);
  box-shadow: 0 0.5rem 1.4rem rgba(245, 158, 11, 0.16);
  color: #fff;
}
.mc-footer a:focus-visible {
  outline: 2px solid var(--gold-light);
  outline-offset: 3px;
}

@media (max-width: 480px) {
  .mc-footer { margin-top: 3.5rem; padding: 2.5rem 0; }
  .mc-footer-inner { padding: 0 1rem; gap: 1.2rem; }
  .mc-footer-title { font-size: 1rem; }
  .mc-footer-social-btn { flex-basis: 100%; max-width: 20rem; }
}

@media (max-width: 992px) {
  .mc-grid { grid-template-columns: 1fr; }
}

/* Shared stat-tile component — used by private_admin.php and admin_users.php's
   Support/AI statistics tabs so both draw from the one definition. */
.priv-stat-card {
  background: var(--bg-card);
  border: 1px solid var(--border-subtle);
  border-radius: 14px;
  padding: 1.25rem;
  text-align: center;
}
.priv-stat-num {
  font-family: var(--font-heading);
  font-size: 2rem;
  font-weight: 900;
  color: var(--text-primary);
}
.priv-stat-label {
  font-size: 0.78rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-top: 0.3rem;
}

/* Staff notification center: data is rendered server-side and refreshed only
   through the authenticated, CSRF-protected support API. */
.mc-staff-notification-wrap { position: relative; }
.mc-staff-notification-button { position: relative; width: 38px; height: 38px; padding: 0 !important; border-radius: 10px; color: var(--text-primary); background: rgba(255,255,255,.045); border: 1px solid var(--border-subtle); cursor: pointer; }
.mc-staff-notification-button:hover, .mc-staff-notification-button[aria-expanded="true"] { border-color: rgba(251,191,36,.55); color: var(--gold); }
.mc-staff-notification-count { position: absolute; top: -6px; right: -7px; min-width: 17px; padding: 1px 4px; border-radius: 99px; background: #ef4444; color: #fff; font-size: .62rem; font-weight: 800; border: 2px solid var(--bg-dark); }
.mc-staff-notification-center { position: absolute; z-index: 300; top: calc(100% + .65rem); right: 0; width: min(360px, calc(100vw - 2rem)); overflow: hidden; border-radius: 12px; border: 1px solid var(--border-subtle); background: #101722; box-shadow: 0 20px 50px rgba(0,0,0,.45); }
.mc-staff-notification-center header { display:flex; justify-content:space-between; align-items:center; gap:.75rem; padding:.8rem .95rem; border-bottom:1px solid var(--border-subtle); color:var(--text-primary); font-size:.86rem; }
.mc-staff-notification-center header span { color:var(--text-muted); font-size:.7rem; font-weight:700; }
.mc-staff-notification-list { max-height: 360px; overflow-y:auto; }
.mc-staff-notification, .mc-staff-notification-empty { display:flex; gap:.65rem; padding:.75rem .9rem; color:var(--text-secondary); text-decoration:none; font-size:.76rem; }
.mc-staff-notification { border-bottom:1px solid rgba(255,255,255,.045); }
.mc-staff-notification:hover { background:rgba(255,255,255,.04); }
.mc-staff-notification.unread { background:rgba(251,191,36,.07); }
.mc-staff-notification > i { color:#34d399; padding-top:.13rem; }
.mc-staff-notification span { min-width:0; }
.mc-staff-notification strong, .mc-staff-notification small { display:block; overflow-wrap:anywhere; }
.mc-staff-notification strong { color:var(--text-primary); margin-bottom:.15rem; }
.mc-staff-notification small { color:var(--text-muted); line-height:1.35; }
.mc-staff-notification-empty { color:var(--text-muted); margin:0; }

/* Player notification center. The bell shares the existing header footprint but
   has its own user-scoped API and never exposes another account's records. */
.mc-user-notification-wrap { position:relative; }
.mc-user-notification-button { position:relative; display:grid; place-items:center; width:38px; height:38px; padding:0!important; border:1px solid var(--border-subtle); border-radius:10px; color:var(--text-primary); background:rgba(255,255,255,.045); cursor:pointer; }
.mc-user-notification-button:hover,.mc-user-notification-button[aria-expanded="true"] { color:var(--gold); border-color:rgba(251,191,36,.55); }
.mc-user-notification-count { position:absolute; top:-6px; right:-7px; min-width:17px; padding:1px 4px; border:2px solid var(--bg-dark); border-radius:99px; color:#fff; background:#ef4444; font-size:.62rem; font-weight:800; line-height:1.15; }
.mc-user-notification-center { position:absolute; z-index:300; top:calc(100% + .65rem); right:0; width:min(390px,calc(100vw - 2rem)); overflow:hidden; border:1px solid var(--border-subtle); border-radius:12px; background:#101722; box-shadow:0 20px 50px rgba(0,0,0,.45); }
.mc-user-notification-center header { display:flex; justify-content:space-between; gap:.75rem; align-items:center; padding:.8rem .95rem; border-bottom:1px solid var(--border-subtle); }
.mc-user-notification-center header span,.mc-user-notification-center header strong,.mc-user-notification-center header small { display:block; }
.mc-user-notification-center header strong { color:var(--text-primary); font-size:.86rem; }
.mc-user-notification-center header small { margin-top:.08rem; color:var(--text-muted); font-size:.7rem; font-weight:700; }
.mc-user-notification-text-button { padding:0; border:0; color:var(--gold-light); background:transparent; font:800 .72rem var(--font-body); cursor:pointer; }
.mc-user-notification-text-button:disabled { color:var(--text-muted); cursor:default; }
.mc-user-notification-list { max-height:360px; overflow-y:auto; }
.mc-user-notification-row { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:stretch; border-bottom:1px solid rgba(255,255,255,.045); }
.mc-user-notification-row.unread { background:rgba(251,191,36,.07); box-shadow:inset 3px 0 0 rgba(251,191,36,.7); }
.mc-user-notification-open { display:flex; gap:.65rem; min-width:0; padding:.78rem .82rem .78rem .9rem; border:0; color:var(--text-secondary); background:transparent; text-align:left; cursor:pointer; }
.mc-user-notification-open:hover { background:rgba(255,255,255,.04); }
.mc-user-notification-open>i { width:1.15rem; padding-top:.13rem; color:#fbbf24; text-align:center; }
.mc-user-notification-open>span { min-width:0; }.mc-user-notification-open strong,.mc-user-notification-open small { display:block; overflow-wrap:anywhere; }
.mc-user-notification-open strong { margin-bottom:.16rem; color:var(--text-primary); font-size:.78rem; }.mc-user-notification-open small { color:var(--text-muted); font-size:.7rem; line-height:1.38; }
.mc-user-notification-dismiss { width:32px; margin:.36rem .34rem .36rem 0; border:0; border-radius:7px; color:var(--text-muted); background:transparent; cursor:pointer; }.mc-user-notification-dismiss:hover { color:#fecaca; background:rgba(239,68,68,.12); }
.mc-user-notification-empty { margin:0; padding:1.1rem .95rem; color:var(--text-muted); font-size:.8rem; }
.mc-user-notification-center footer { padding:.68rem .95rem; border-top:1px solid var(--border-subtle); color:var(--text-secondary); font-size:.74rem; }.mc-user-notification-center footer label { display:flex; align-items:center; gap:.45rem; cursor:pointer; }
.mc-sidebar-user-notification-wrap { margin:0 0 .55rem; }.mc-sidebar-user-notification-button { display:flex; align-items:center; gap:.7rem; width:100%; padding:0 .72rem!important; color:var(--text-secondary); background:rgba(255,255,255,.035); text-align:left; }.mc-sidebar-user-notification-button:hover { color:var(--text-primary); }.mc-sidebar-user-notification-label { font-size:.8rem; font-weight:800; }.mc-sidebar-user-notification-wrap .mc-user-notification-center { top:auto; bottom:calc(100% + .65rem); left:0; right:auto; width:360px; }
html.mc-sidebar-collapsed .mc-sidebar-user-notification-button { justify-content:center; padding:0!important; } html.mc-sidebar-collapsed .mc-sidebar-user-notification-label { display:none; } html.mc-sidebar-collapsed .mc-sidebar-user-notification-wrap .mc-user-notification-center { left:calc(100% + .75rem); }

/* Update Management and public updates deliberately accept only a validated hex
   custom property; no database value is ever used as arbitrary CSS or HTML. */
.update-management-heading { display:flex; justify-content:space-between; gap:1rem; align-items:flex-start; margin-bottom:1.25rem; }.update-management-heading h2 { margin:.1rem 0 .35rem; }.update-management-heading p:not(.mc-eyebrow) { max-width:710px; margin:0; color:var(--text-secondary); font-size:.87rem; line-height:1.5; }
.update-management-layout { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(290px,.8fr); gap:1.25rem; align-items:start; margin-bottom:1.25rem; }.update-editor-title-row { display:flex; justify-content:space-between; gap:1rem; align-items:flex-start; margin-bottom:1rem; }.update-editor-title-row h3 { margin:0 0 .2rem; color:#fff; font:800 1.05rem var(--font-heading); }.update-editor-title-row p { margin:0; color:var(--text-muted); font-size:.78rem; line-height:1.45; }
.update-editor-form { display:grid; gap:1rem; }.update-editor-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem; }.update-field { display:grid; gap:.34rem; color:var(--text-muted); font-size:.75rem; font-weight:800; }.update-field-wide { grid-column:1/-1; }.update-color-input { display:flex; align-items:center; gap:.6rem; min-height:39px; padding:.3rem .55rem; border:1px solid var(--border-subtle); border-radius:8px; background:rgba(8,11,17,.35); }.update-color-input input { width:34px; height:28px; padding:0; border:0; background:transparent; cursor:pointer; }.update-color-input output { color:var(--text-secondary); font:800 .76rem var(--font-body); }
.update-editor-options { display:flex; flex-wrap:wrap; gap:.65rem 1rem; padding:.75rem; border:1px solid rgba(255,255,255,.08); border-radius:9px; background:rgba(8,11,17,.3); }.update-editor-options label { display:flex; align-items:center; gap:.4rem; color:#cbd5e1; font-size:.77rem; cursor:pointer; }.update-editor-actions { display:flex; justify-content:flex-end; gap:.6rem; flex-wrap:wrap; }
.update-preview-shell { position:sticky; top:1rem; }.update-preview-shell-head { display:flex; justify-content:space-between; align-items:center; gap:.75rem; margin-bottom:.85rem; color:#e2e8f0; font-size:.84rem; }.update-preview-shell-head .mc-btn { padding:.28rem .55rem; font-size:.7rem; }
.public-update-card { position:relative; overflow:hidden; padding:1.15rem; border:1px solid color-mix(in srgb,var(--update-accent) 55%,transparent); border-left:4px solid var(--update-accent); border-radius:13px; color:var(--text-primary); background:linear-gradient(135deg,rgba(20,26,38,.94),rgba(10,14,22,.91)); box-shadow:0 12px 30px rgba(0,0,0,.18); }.public-update-card.is-pinned { box-shadow:0 14px 36px rgba(0,0,0,.25),0 0 26px color-mix(in srgb,var(--update-accent) 17%,transparent); }
.public-update-card-head { display:flex; align-items:flex-start; gap:.85rem; }.public-update-icon,.update-history-icon { display:grid; flex:0 0 auto; place-items:center; width:43px; height:43px; border:1px solid color-mix(in srgb,var(--update-accent) 50%,transparent); border-radius:11px; color:var(--update-accent); background:color-mix(in srgb,var(--update-accent) 13%,transparent); }.public-update-title-wrap { min-width:0; flex:1; }.public-update-badges { display:flex; align-items:center; flex-wrap:wrap; gap:.35rem; margin-bottom:.38rem; }.public-update-tier,.public-update-category,.public-update-pinned,.update-status-badge { display:inline-flex; align-items:center; gap:.28rem; padding:.18rem .42rem; border-radius:99px; font-size:.63rem; font-weight:900; letter-spacing:.035em; text-transform:uppercase; }.public-update-tier { color:var(--update-accent); border:1px solid color-mix(in srgb,var(--update-accent) 42%,transparent); background:color-mix(in srgb,var(--update-accent) 11%,transparent); }.public-update-category { color:#cbd5e1; background:rgba(148,163,184,.12); }.public-update-pinned { color:#fde68a; background:rgba(245,158,11,.12); }.public-update-card h2,.public-update-card h3 { margin:0; color:#fff; font:800 1.12rem var(--font-heading); overflow-wrap:anywhere; }.public-update-meta { margin:.28rem 0 0; color:var(--text-muted); font-size:.71rem; }.public-update-summary { margin:.9rem 0 0; color:#d3dce9; font-size:.87rem; line-height:1.55; overflow-wrap:anywhere; }.public-update-details { margin-top:.82rem; border-top:1px solid rgba(255,255,255,.08); }.public-update-details summary { display:flex; justify-content:space-between; align-items:center; gap:.5rem; padding:.75rem 0 0; color:var(--gold-light); font-size:.78rem; font-weight:800; cursor:pointer; list-style:none; }.public-update-details summary::-webkit-details-marker { display:none; }.public-update-details[open] summary i { transform:rotate(180deg); }.public-update-content { padding:.78rem 0 .05rem; color:var(--text-secondary); font-size:.86rem; line-height:1.65; overflow-wrap:anywhere; }.public-update-permalink { display:inline-flex; align-items:center; gap:.38rem; margin-top:.9rem; color:var(--gold-light); font-size:.76rem; font-weight:800; text-decoration:none; }.public-update-permalink:hover { color:#fef3c7; }
.update-notification-preview { display:flex; gap:.6rem; align-items:flex-start; margin-top:.9rem; padding:.7rem; border:1px solid rgba(56,189,248,.2); border-radius:9px; color:#cbd5e1; background:rgba(56,189,248,.06); }.update-notification-preview>i { color:#7dd3fc; }.update-notification-preview strong,.update-notification-preview small { display:block; }.update-notification-preview strong { color:#eaf5ff; font-size:.76rem; }.update-notification-preview small { margin-top:.12rem; color:#94a3b8; font-size:.69rem; line-height:1.4; }
.update-history-card { margin-top:1.25rem; }.update-history-list { display:grid; gap:.7rem; }.update-history-row { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:.75rem; align-items:start; padding:.8rem; border:1px solid rgba(255,255,255,.08); border-left:3px solid var(--update-accent); border-radius:10px; background:rgba(8,11,17,.35); }.update-history-icon { width:35px; height:35px; border-radius:9px; font-size:.82rem; }.update-history-copy { min-width:0; }.update-history-copy h4 { margin:.32rem 0 .15rem; color:#fff; font:800 .9rem var(--font-heading); overflow-wrap:anywhere; }.update-history-copy p { margin:0; color:#aebdce; font-size:.76rem; line-height:1.42; overflow-wrap:anywhere; }.update-history-copy small { display:block; margin-top:.38rem; color:#64748b; font-size:.67rem; }.update-history-copy .fa-thumbtack { margin-left:.35rem; color:#fbbf24; font-size:.68rem; }.update-status-badge { margin-right:.32rem; color:#cbd5e1; background:rgba(148,163,184,.12); }.update-status-badge.is-published { color:#86efac; background:rgba(34,197,94,.12); }.update-status-badge.is-scheduled { color:#7dd3fc; background:rgba(14,165,233,.12); }.update-status-badge.is-draft { color:#cbd5e1; background:rgba(148,163,184,.12); }.update-status-badge.is-archived { color:#fda4af; background:rgba(244,63,94,.1); }.update-history-actions { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:.38rem; max-width:290px; }.update-history-actions form { margin:0; }.update-history-actions .mc-btn { padding:.27rem .48rem; font-size:.67rem; }

.mc-updates-page { max-width:1040px; padding-top:2rem; padding-bottom:3rem; }.mc-updates-hero { display:flex; justify-content:space-between; gap:1.5rem; align-items:center; position:relative; overflow:hidden; margin-bottom:1.25rem; padding:2rem; border:1px solid rgba(245,158,11,.3); border-radius:16px; background:linear-gradient(130deg,rgba(20,26,39,.97),rgba(26,30,37,.9) 65%,rgba(245,158,11,.12)); }.mc-updates-hero h1 { margin:.1rem 0 .4rem; }.mc-updates-hero p:not(.mc-eyebrow) { max-width:650px; margin:0; color:var(--text-secondary); line-height:1.55; }.mc-updates-hero-icon { display:grid; flex:0 0 auto; place-items:center; width:75px; height:75px; border:1px solid rgba(245,158,11,.35); border-radius:20px; color:#fbbf24; background:rgba(245,158,11,.1); font-size:2rem; }.mc-update-back { margin:.4rem 0 1rem; }.mc-update-back a { color:var(--gold-light); font-size:.82rem; font-weight:800; text-decoration:none; }.mc-updates-not-found { margin:0 0 1rem; padding:.8rem 1rem; border:1px solid rgba(245,158,11,.3); border-radius:10px; color:#fde68a; background:rgba(245,158,11,.08); }.public-update-list { display:grid; gap:1rem; }.mc-updates-empty { display:grid; place-items:center; min-height:240px; text-align:center; }.mc-updates-empty>i { color:#fbbf24; font-size:2.4rem; }.mc-updates-empty h2 { margin:.7rem 0 .2rem; color:#fff; }.mc-updates-empty p { margin:0; color:var(--text-muted); }
.dashboard-updates-list { display:grid; gap:.55rem; }.dashboard-update-link { display:grid; grid-template-columns:32px minmax(0,1fr); gap:.62rem; padding:.6rem; border:1px solid rgba(255,255,255,.07); border-left:3px solid var(--update-accent); border-radius:9px; color:var(--text-primary); background:rgba(10,14,22,.38); text-decoration:none; }.dashboard-update-link:hover { border-color:color-mix(in srgb,var(--update-accent) 55%,transparent); background:rgba(255,255,255,.035); }.dashboard-update-link>span { display:grid; place-items:center; width:30px; height:30px; border-radius:8px; color:var(--update-accent); background:color-mix(in srgb,var(--update-accent) 12%,transparent); }.dashboard-update-link div { min-width:0; }.dashboard-update-link small,.dashboard-update-link strong,.dashboard-update-link p { display:block; overflow-wrap:anywhere; }.dashboard-update-link small { color:var(--update-accent); font-size:.62rem; font-weight:800; text-transform:uppercase; }.dashboard-update-link strong { margin:.1rem 0; color:#fff; font-size:.79rem; }.dashboard-update-link p { margin:0; color:#94a3b8; font-size:.69rem; line-height:1.35; }

@media (max-width:960px) { .update-management-layout { grid-template-columns:1fr; }.update-preview-shell { position:static; }.update-history-row { grid-template-columns:auto minmax(0,1fr); }.update-history-actions { grid-column:1/-1; justify-content:flex-start; max-width:none; } }
@media (max-width:992px) { .mc-sidebar-user-notification-wrap { display:none; } }
@media (max-width:760px) { .mc-user-notification-center { position:fixed; top:58px; right:1rem; left:auto!important; }.update-management-heading,.mc-updates-hero { align-items:flex-start; flex-direction:column; }.mc-updates-hero-icon { width:56px; height:56px; border-radius:15px; font-size:1.45rem; }.update-editor-grid { grid-template-columns:1fr; }.update-field-wide { grid-column:auto; }.update-history-row { grid-template-columns:1fr; }.update-history-icon { display:none; }.update-history-actions { grid-column:auto; }.public-update-card { padding:1rem; } }
@media (max-width:560px) { .mc-topbar .mc-duty-toggle { display:none; }.mc-topbar .mc-user-notification-wrap { margin-left:auto!important; } }
@media (prefers-reduced-motion:reduce) { .mc-toast,.public-update-card,.update-history-row,.dashboard-update-link { animation:none!important; transition:none!important; } .public-update-details[open] summary i { transform:none; } }
/* Site-wide toast notifications (success/warning/error/info/support). Created lazily by
   window.mcToast() — see includes/header.php — so any page that includes the header can use it. */
/* bottom offset clears the bottom-right media player's collapsed bar
   (see .tickmc-player) at every width, not just mobile, now that the
   player sits in that corner on desktop too. */
.mc-toast-region { position:fixed; z-index:5000; right:1rem; bottom:calc(3.6rem + 1rem); display:grid; gap:.5rem; max-width:min(380px, calc(100vw - 2rem)); }
.mc-toast { display:flex; align-items:flex-start; gap:.65rem; padding:.75rem .85rem; border-radius:10px; background:#111826; border:1px solid var(--border-subtle); box-shadow:0 12px 30px rgba(0,0,0,.35); font-size:.82rem; line-height:1.4; animation:mc-toast-in .18s ease-out; }
.mc-toast-icon { flex-shrink:0; width:1.9rem; height:1.9rem; display:grid; place-items:center; border-radius:8px; font-size:.85rem; }
.mc-toast-body { flex:1; min-width:0; }
.mc-toast-title { display:block; color:var(--text-primary); font-weight:800; margin-bottom:.15rem; }
.mc-toast-message { display:block; color:var(--text-secondary); overflow-wrap:anywhere; }
.mc-toast-time { display:block; color:var(--text-muted); font-size:.7rem; margin-top:.25rem; }
.mc-toast-close { flex-shrink:0; background:none; border:0; color:var(--text-muted); cursor:pointer; font-size:.9rem; padding:.1rem; line-height:1; }
.mc-toast-close:hover { color:var(--text-primary); }
.mc-toast-action { display:inline-block; margin-top:.4rem; color:var(--gold-light); font-weight:700; text-decoration:none; font-size:.78rem; }
.mc-toast-success .mc-toast-icon { background:rgba(16,185,129,.15); color:#34d399; }
.mc-toast-success { border-color:rgba(16,185,129,.35); }
.mc-toast-warning .mc-toast-icon { background:rgba(245,158,11,.15); color:#fbbf24; }
.mc-toast-warning { border-color:rgba(245,158,11,.35); }
.mc-toast-error .mc-toast-icon { background:rgba(239,68,68,.15); color:#f87171; }
.mc-toast-error { border-color:rgba(239,68,68,.35); }
.mc-toast-info .mc-toast-icon { background:rgba(56,189,248,.15); color:#38bdf8; }
.mc-toast-info { border-color:rgba(56,189,248,.35); }
.mc-toast-support .mc-toast-icon { background:rgba(129,140,248,.15); color:#a5b4fc; }
.mc-toast-support { border-color:rgba(129,140,248,.35); }
@keyframes mc-toast-in { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:none; } }

/* Shop image library and icon browser */
.shop-product-media { width:56px; height:56px; border-radius:12px; display:grid; place-items:center; overflow:hidden; background:rgba(245,158,11,.12); border:1px solid rgba(245,158,11,.3); color:#fbbf24; margin-bottom:.85rem; }
.shop-product-media img { width:100%; height:100%; object-fit:contain; padding:5px; }
.shop-product-media i { font-size:1.5rem; }
.shop-admin-layout { display:grid; grid-template-columns:minmax(340px,.88fr) minmax(440px,1.22fr); gap:1.25rem; align-items:start; }
.shop-admin-stack { display:grid; gap:1.25rem; }
.shop-admin-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.7rem; }
.shop-admin-field { display:grid; gap:.32rem; }
.shop-admin-field label, .shop-media-title { color:var(--text-muted); font-size:.76rem; font-weight:700; }
.shop-display-toggle { display:grid; grid-template-columns:1fr 1fr; gap:.5rem; }
.shop-display-toggle label { display:flex; align-items:center; gap:.45rem; border:1px solid rgba(255,255,255,.1); border-radius:9px; padding:.6rem .7rem; color:#cbd5e1; cursor:pointer; }
.shop-display-toggle label:has(input:checked) { color:#fff; border-color:rgba(245,158,11,.5); background:rgba(245,158,11,.1); }
.shop-media-selection { display:grid; gap:.55rem; padding:.75rem; border:1px solid rgba(255,255,255,.08); border-radius:10px; background:rgba(8,11,17,.35); }
.shop-media-selection[hidden], .shop-picker-modal[hidden], .shop-picker-empty[hidden] { display:none; }
.shop-preview-card { display:grid; grid-template-columns:70px minmax(0,1fr); gap:.85rem; align-items:center; padding:.75rem; border:1px solid rgba(245,158,11,.22); border-radius:10px; background:linear-gradient(135deg,rgba(245,158,11,.1),rgba(15,23,42,.5)); }
.shop-preview-media { width:64px; height:64px; display:grid; place-items:center; overflow:hidden; border-radius:12px; background:rgba(8,11,17,.55); color:#fbbf24; }
.shop-preview-media i { font-size:1.65rem; }
.shop-preview-image { width:100%; height:100%; object-fit:contain; padding:5px; }
.shop-preview-eyebrow { margin:0 0 .18rem; color:#94a3b8; font-size:.65rem; letter-spacing:.08em; text-transform:uppercase; }
.shop-preview-name { margin:0; color:#fff; font-family:'Outfit',sans-serif; font-size:1rem; font-weight:800; overflow-wrap:anywhere; }
.shop-preview-price { margin:.2rem 0 0; color:#fbbf24; font-weight:800; font-size:.78rem; }
.shop-upload-form { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.55rem; align-items:center; }
.shop-upload-input { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.shop-upload-label { display:flex; align-items:center; gap:.5rem; min-height:38px; padding:.5rem .65rem; color:#cbd5e1; border:1px dashed rgba(148,163,184,.45); border-radius:8px; cursor:pointer; overflow:hidden; }
.shop-upload-label span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.shop-picker-modal { position:fixed; z-index:6000; inset:0; display:grid; place-items:center; padding:1rem; background:rgba(2,6,13,.78); backdrop-filter:blur(5px); }
.shop-picker-dialog { width:min(840px,100%); max-height:min(760px,calc(100vh - 2rem)); display:grid; grid-template-rows:auto auto minmax(0,1fr); gap:.85rem; padding:1rem; overflow:hidden; background:linear-gradient(145deg,#141b28,#0a0e16); border:1px solid rgba(148,163,184,.25); border-radius:14px; box-shadow:0 24px 80px rgba(0,0,0,.55); }
.shop-picker-head { display:flex; justify-content:space-between; gap:1rem; align-items:start; }
.shop-picker-head h2 { margin:0; color:#fff; font-family:'Outfit',sans-serif; font-size:1.15rem; }
.shop-picker-head p { margin:.2rem 0 0; color:#94a3b8; font-size:.78rem; }
.shop-picker-tools { display:grid; grid-template-columns:minmax(0,1fr) 170px; gap:.55rem; }
.shop-picker-grid { min-height:0; overflow:auto; display:grid; grid-template-columns:repeat(auto-fill,minmax(106px,1fr)); align-content:start; gap:.55rem; padding-right:.15rem; }
.shop-picker-icon, .shop-image-picker-card { border:1px solid rgba(255,255,255,.09); border-radius:9px; color:#cbd5e1; background:rgba(15,23,42,.55); transition:transform .15s ease,border-color .15s ease,background .15s ease; }
.shop-picker-icon { min-height:88px; display:grid; place-items:center; gap:.35rem; padding:.55rem; cursor:pointer; }
.shop-picker-icon i { color:#fbbf24; font-size:1.3rem; }
.shop-picker-icon span { max-width:100%; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:.68rem; text-transform:capitalize; }
.shop-picker-icon:hover, .shop-picker-icon.selected, .shop-image-picker-card:hover, .shop-image-picker-card.selected { transform:translateY(-2px); border-color:rgba(245,158,11,.6); background:rgba(245,158,11,.11); color:#fff; }
.shop-image-picker-card { display:grid; grid-template-rows:100px auto; gap:.45rem; padding:.45rem; text-align:left; cursor:pointer; }
.shop-image-picker-card img { width:100%; height:100px; object-fit:contain; background:rgba(2,6,13,.45); border-radius:6px; }
.shop-image-picker-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.71rem; font-weight:800; }
.shop-image-picker-meta { color:#94a3b8; font-size:.65rem; }
.shop-picker-empty { padding:1.25rem; text-align:center; color:#94a3b8; font-size:.82rem; }
.shop-admin-product-media { width:36px; height:36px; display:grid; place-items:center; flex:0 0 auto; overflow:hidden; color:#fbbf24; background:rgba(245,158,11,.1); border-radius:8px; }
.shop-admin-product-media img { width:100%; height:100%; object-fit:contain; padding:3px; }
.shop-admin-product-media i { font-size:1rem; }
body.shop-modal-open { overflow:hidden; }
@media (max-width:960px) { .shop-admin-layout { grid-template-columns:1fr; } }
@media (max-width:600px) { .shop-admin-form-grid,.shop-picker-tools,.shop-upload-form { grid-template-columns:1fr; } .shop-picker-modal { padding:.5rem; } .shop-picker-dialog { max-height:calc(100vh - 1rem); padding:.8rem; } .shop-picker-grid { grid-template-columns:repeat(auto-fill,minmax(88px,1fr)); } }

/* Shared confirmation modal — replaces native confirm() everywhere. See includes/header.php
   for the JS that binds [data-confirm] forms/buttons to it, and window.mcConfirmAction(). */
.mc-modal-overlay { position:fixed; inset:0; z-index:5000; display:flex; align-items:center; justify-content:center; padding:1rem; background:rgba(5,7,12,.72); backdrop-filter:blur(3px); }
.mc-modal-overlay[hidden] { display:none; }
.mc-modal { width:100%; max-width:420px; background:linear-gradient(145deg,rgba(20,27,40,.98),rgba(10,14,22,.98)); border:1px solid var(--border-subtle); border-radius:14px; padding:1.5rem; box-shadow:0 20px 60px rgba(0,0,0,.5); animation:mc-toast-in .16s ease-out; }
.mc-modal-title { margin:0 0 .6rem; color:var(--text-primary); font:800 1.1rem var(--font-heading); }
.mc-modal-message { margin:0 0 1.25rem; color:var(--text-secondary); font-size:.9rem; line-height:1.5; white-space:pre-wrap; }
.mc-modal-actions { display:flex; justify-content:flex-end; gap:.6rem; flex-wrap:wrap; }

/* Staff support workspace. The grid degrades to a vertical inbox on tablets. */
.staff-support-workspace { display:grid; grid-template-columns:minmax(245px,.8fr) minmax(340px,1.4fr) minmax(210px,.65fr); gap:1rem; align-items:start; }
.staff-support-list { max-height:650px; overflow:auto; }
.staff-support-row { display:block; padding:.7rem; margin-bottom:.45rem; border:1px solid var(--border-subtle); border-radius:9px; color:var(--text-secondary); text-decoration:none; background:rgba(11,14,20,.45); }
.staff-support-row:hover, .staff-support-row.active { border-color:rgba(52,211,153,.45); background:rgba(52,211,153,.07); }
.staff-support-row-top, .staff-support-row-meta { display:flex; justify-content:space-between; gap:.5rem; align-items:center; }
.staff-support-row-top strong { color:var(--text-primary); font-size:.82rem; overflow-wrap:anywhere; }
.staff-support-row-meta { margin-top:.35rem; color:var(--text-muted); font-size:.69rem; }
.staff-support-status { font-size:.64rem; letter-spacing:.3px; font-weight:800; text-transform:uppercase; }
.staff-support-search { display:grid; grid-template-columns:1fr auto; gap:.5rem; margin:.75rem 0; }
.staff-on-duty-grid { display:flex; flex-wrap:wrap; gap:.65rem; }
.staff-on-duty-card { display:flex; align-items:center; gap:.45rem; padding:.5rem .65rem; background:rgba(52,211,153,.07); border:1px solid rgba(52,211,153,.22); border-radius:9px; min-width:185px; }
.staff-on-duty-card img { width:30px; height:30px; border-radius:7px; }
.staff-on-duty-card strong, .staff-on-duty-card small { display:block; font-size:.72rem; }
.staff-on-duty-card strong { color:var(--text-primary); }.staff-on-duty-card small { color:var(--text-muted); margin-top:.12rem; }
.staff-support-info dl { display:grid; gap:.7rem; margin:0; }.staff-support-info dt { color:var(--text-muted); font-size:.66rem; font-weight:800; letter-spacing:.4px; text-transform:uppercase; }.staff-support-info dd { margin:.18rem 0 0; color:var(--text-secondary); font-size:.8rem; overflow-wrap:anywhere; }
@media (max-width: 1120px) { .staff-support-workspace { grid-template-columns:minmax(230px,.8fr) minmax(330px,1.2fr); }.staff-support-info { grid-column:1/-1; } }
@media (max-width: 760px) { .staff-support-workspace { grid-template-columns:1fr; }.staff-support-search { grid-template-columns:1fr; }.mc-staff-notification-center { position:fixed; top:58px; right:1rem; } }

/* ==========================================================================\n+   PLAYER GUIDES — public player-facing content only.\n+   ========================================================================== */
.sr-only { position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important; }
.mc-guides-page { display:block; min-height:calc(100vh - 150px); max-width:1240px; padding-top:2rem; padding-bottom:3rem; }
.mc-eyebrow { margin:0 0 .35rem; color:var(--gold-light); font:800 .73rem var(--font-heading); letter-spacing:.13em; text-transform:uppercase; }
.mc-guides-main-hero { position:relative; overflow:hidden; padding:2.5rem 2rem 2.25rem; margin-bottom:1rem; border:1px solid rgba(245,158,11,.3); border-radius:var(--radius-lg); background:linear-gradient(130deg,rgba(20,26,39,.97),rgba(26,30,37,.9) 58%,rgba(245,158,11,.12)); box-shadow:0 20px 50px rgba(0,0,0,.2); }
.mc-guides-main-hero::after { content:''; position:absolute; inset:auto -90px -150px auto; width:340px; height:340px; border:1px solid rgba(245,158,11,.13); border-radius:50%; box-shadow:0 0 0 40px rgba(245,158,11,.025),0 0 0 90px rgba(245,158,11,.018); pointer-events:none; }
.mc-guides-main-hero .mc-page-title { position:relative; z-index:1; font-size:clamp(2.1rem,5vw,3.35rem); margin-bottom:.35rem; }
.mc-guides-main-hero > p:not(.mc-eyebrow) { position:relative; z-index:1; max-width:620px; color:var(--text-secondary); font-size:1.02rem; }
.mc-guides-main-hero-orb { position:absolute; right:2.4rem; top:1.8rem; display:flex; align-items:center; justify-content:center; width:78px; height:78px; border:1px solid rgba(245,158,11,.32); border-radius:22px; background:rgba(245,158,11,.1); color:#fbbf24; font-size:2rem; transform:rotate(9deg); }
.mc-guide-search { position:relative; z-index:1; display:flex; align-items:center; max-width:620px; margin-top:1.55rem; }
.mc-guide-search > i { position:absolute; left:1.1rem; z-index:1; color:var(--text-muted); }
.mc-guide-search input { width:100%; padding:.88rem 1rem .88rem 2.9rem !important; border-color:rgba(245,158,11,.24) !important; border-radius:12px !important; background:rgba(7,10,16,.74) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.025); }
.mc-guide-search input:focus { border-color:var(--gold-main) !important; box-shadow:0 0 0 3px rgba(245,158,11,.14) !important; }
.mc-guides-config-note { display:flex; align-items:flex-start; gap:.55rem; margin:0 0 1.55rem; padding:.75rem 1rem; color:#cbd5e1; border:1px solid rgba(56,189,248,.24); border-radius:10px; background:rgba(56,189,248,.065); font-size:.86rem; }
.mc-guides-config-note i { margin-top:.12rem; color:#7dd3fc; }
.mc-guide-no-results { margin:0 0 1.5rem; padding:1rem 1.1rem; color:#fde68a; border:1px solid rgba(245,158,11,.25); border-radius:10px; background:rgba(245,158,11,.08); }
.mc-guide-category { margin:0 0 2.2rem; }
.mc-guide-category-heading { display:grid; grid-template-columns:44px minmax(0,1fr) auto; gap:.9rem; align-items:center; margin:0 0 1rem; }
.mc-guide-category-heading > span, .mc-guide-card-icon, .mc-guide-hero-icon, .mc-guides-empty-icon { display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto; border:1px solid rgba(245,158,11,.3); background:rgba(245,158,11,.11); color:#fbbf24; }
.mc-guide-category-heading > span { width:42px; height:42px; border-radius:11px; font-size:1.1rem; }
.mc-guide-category-heading h2 { margin:0 0 .12rem; font-size:1.38rem; }
.mc-guide-category-heading p { color:var(--text-muted); font-size:.89rem; }
.mc-guide-view-all, .mc-guide-card-link { color:#fbbf24; font:800 .79rem var(--font-heading); letter-spacing:.02em; white-space:nowrap; }
.mc-guide-view-all { display:inline-flex; align-items:center; gap:.45rem; padding:.5rem .7rem; border:1px solid rgba(245,158,11,.24); border-radius:8px; background:rgba(245,158,11,.06); }
.mc-guide-view-all:hover { background:rgba(245,158,11,.14); color:#fef3c7; }
.mc-guide-card-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.mc-guide-category-grid { grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:1.5rem; }
.mc-guide-card { display:flex; gap:.9rem; min-height:185px; padding:1.15rem; color:var(--text-primary); border:1px solid var(--border-subtle); border-radius:14px; background:linear-gradient(150deg,rgba(20,26,38,.86),rgba(13,17,26,.8)); box-shadow:0 12px 30px rgba(0,0,0,.16); text-decoration:none; transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease,background .2s ease; }
.mc-guide-card:hover { color:var(--text-primary); border-color:rgba(245,158,11,.45); background:linear-gradient(150deg,rgba(29,35,47,.94),rgba(18,21,27,.9)); box-shadow:0 18px 36px rgba(0,0,0,.28),0 0 20px rgba(245,158,11,.07); transform:translateY(-3px); }
.mc-guide-card[hidden], .mc-guide-category[hidden] { display:none !important; }
.mc-guide-card-icon { width:42px; height:42px; border-radius:11px; font-size:1.06rem; }
.mc-guide-card-body { display:flex; flex:1; min-width:0; flex-direction:column; align-items:flex-start; }
.mc-guide-card-title { margin:0 0 .3rem; color:#fff; font:800 1rem var(--font-heading); }
.mc-guide-card-summary { color:var(--text-muted); font-size:.84rem; line-height:1.52; }
.mc-guide-card-link { display:inline-flex; align-items:center; gap:.38rem; margin-top:auto; padding-top:1rem; }
.mc-guide-card:hover .mc-guide-card-link i { transform:translateX(3px); }.mc-guide-card-link i { transition:transform .2s ease; }
.mc-guide-breadcrumbs { display:flex; align-items:center; gap:.55rem; margin:0 0 1.1rem; color:var(--text-muted); font-size:.82rem; overflow:auto; white-space:nowrap; }
.mc-guide-breadcrumbs a { color:#fcd34d; text-decoration:none; }.mc-guide-breadcrumbs a:hover { color:#fff; }.mc-guide-breadcrumbs i { color:#475569; font-size:.65rem; }
.mc-guide-index-hero, .mc-guide-hero { display:flex; align-items:center; gap:1rem; padding:1.5rem; margin-bottom:1.35rem; border:1px solid rgba(245,158,11,.27); border-radius:15px; background:linear-gradient(125deg,rgba(19,25,36,.94),rgba(245,158,11,.1)); }
.mc-guide-index-hero .mc-page-title, .mc-guide-hero .mc-page-title { margin-bottom:.18rem; font-size:2.05rem; }.mc-guide-index-hero p:not(.mc-eyebrow), .mc-guide-hero p:not(.mc-eyebrow) { color:var(--text-secondary); }
.mc-guide-hero-icon { width:58px; height:58px; border-radius:16px; font-size:1.55rem; }.mc-guide-hero { align-items:flex-start; }.mc-guide-hero > div:nth-child(2) { min-width:0; }.mc-guide-plugin-tag { align-self:flex-start; margin-left:auto; padding:.33rem .56rem; color:#a5f3fc; border:1px solid rgba(34,211,238,.27); border-radius:999px; background:rgba(34,211,238,.09); font:800 .67rem var(--font-heading); letter-spacing:.04em; text-transform:uppercase; white-space:nowrap; }
.mc-guide-layout { display:grid; grid-template-columns:210px minmax(0,1fr); gap:1.25rem; align-items:start; }.mc-guide-toc { position:sticky; top:1.25rem; display:flex; flex-direction:column; gap:.18rem; padding:.8rem; border:1px solid var(--border-subtle); border-radius:12px; background:rgba(12,16,24,.75); }.mc-guide-toc p { margin:.15rem .45rem .4rem; color:var(--text-muted); font:800 .72rem var(--font-heading); letter-spacing:.09em; text-transform:uppercase; }.mc-guide-toc a { padding:.48rem .55rem; color:var(--text-secondary); border-radius:7px; font-size:.84rem; text-decoration:none; }.mc-guide-toc a:hover { color:#fef3c7; background:rgba(245,158,11,.1); }.mc-guide-mobile-toc { display:none; margin:-.55rem 0 1rem; }
.mc-guide-content { display:grid; gap:1rem; min-width:0; }.mc-guide-section { padding:1.35rem !important; scroll-margin-top:1rem; }.mc-guide-section h2, .mc-guide-callout h2 { display:flex; align-items:center; gap:.55rem; margin:0 0 .75rem; font-size:1.28rem; }.mc-guide-section h2 i { color:#fbbf24; font-size:1rem; }.mc-guide-section > p { color:var(--text-secondary); line-height:1.7; }.mc-guide-section-intro { margin-bottom:1rem !important; color:var(--text-muted) !important; font-size:.87rem; }.mc-guide-steps { display:grid; gap:.75rem; margin:0; padding:0; list-style:none; counter-reset:guide-step; }.mc-guide-steps li { position:relative; min-height:42px; padding:.7rem .85rem .7rem 3.4rem; color:var(--text-secondary); border:1px solid rgba(255,255,255,.06); border-radius:10px; background:rgba(0,0,0,.17); counter-increment:guide-step; line-height:1.55; }.mc-guide-steps li::before { content:counter(guide-step); position:absolute; top:.65rem; left:.75rem; display:flex; align-items:center; justify-content:center; width:25px; height:25px; color:#1b1303; border-radius:50%; background:#fbbf24; font:900 .78rem var(--font-heading); }.mc-guide-list { display:grid; gap:.55rem; margin:0; padding-left:1.15rem; color:var(--text-secondary); }.mc-guide-list li::marker { color:#fbbf24; }.mc-guide-table-wrap { overflow-x:auto; border:1px solid rgba(255,255,255,.08); border-radius:10px; }.mc-guide-command-table { width:100%; min-width:530px; border-collapse:collapse; }.mc-guide-command-table th { padding:.68rem .85rem; color:var(--text-muted); background:rgba(0,0,0,.32); font:800 .7rem var(--font-heading); letter-spacing:.08em; text-align:left; text-transform:uppercase; }.mc-guide-command-table td { padding:.78rem .85rem; color:var(--text-secondary); border-top:1px solid rgba(255,255,255,.06); font-size:.88rem; vertical-align:top; }.mc-guide-command-table code { display:inline-block; padding:.2rem .38rem; color:#fcd34d; border:1px solid rgba(245,158,11,.25); border-radius:5px; background:rgba(245,158,11,.09); font-size:.82rem; white-space:nowrap; }.mc-guide-callout { padding:1.05rem 1.2rem; border:1px solid; border-radius:12px; scroll-margin-top:1rem; }.mc-guide-callout h2 { font-size:1.05rem; }.mc-guide-callout ul { display:grid; gap:.38rem; margin:0; padding-left:1.1rem; font-size:.9rem; line-height:1.55; }.mc-guide-callout-info { color:#dbeafe; border-color:rgba(59,130,246,.3); background:rgba(59,130,246,.09); }.mc-guide-callout-info h2 i { color:#93c5fd; }.mc-guide-callout-tip { color:#d1fae5; border-color:rgba(16,185,129,.3); background:rgba(16,185,129,.09); }.mc-guide-callout-tip h2 i { color:#6ee7b7; }.mc-guide-callout-warning { color:#fef3c7; border-color:rgba(245,158,11,.35); background:rgba(245,158,11,.09); }.mc-guide-callout-warning h2 i { color:#fcd34d; }.mc-guides-empty { max-width:680px; margin:4rem auto; padding:2.5rem 1.5rem !important; text-align:center; }.mc-guides-empty p:not(.mc-eyebrow) { max-width:460px; margin:0 auto 1.3rem; color:var(--text-muted); }.mc-guides-empty-icon { width:62px; height:62px; margin-bottom:1rem; border-radius:18px; font-size:1.5rem; }
@media (max-width:1000px) { .mc-guide-card-grid, .mc-guide-category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.mc-guide-layout { grid-template-columns:1fr; }.mc-guide-toc { position:static; display:none; }.mc-guide-mobile-toc { display:block; }.mc-guide-toc:not([hidden]) { display:flex; }.mc-guide-mobile-toc .mc-btn { width:100%; justify-content:center; } }
@media (max-width:640px) { .mc-guides-page { padding-top:1.1rem; padding-bottom:2rem; }.mc-guides-main-hero { padding:1.55rem 1.15rem; }.mc-guides-main-hero-orb { top:1rem; right:1rem; width:48px; height:48px; border-radius:13px; font-size:1.2rem; }.mc-guides-main-hero .mc-page-title { padding-right:3.1rem; }.mc-guide-category-heading { grid-template-columns:38px minmax(0,1fr); gap:.7rem; }.mc-guide-category-heading > span { width:38px; height:38px; }.mc-guide-view-all { grid-column:1/-1; justify-self:start; }.mc-guide-card-grid, .mc-guide-category-grid { grid-template-columns:1fr; }.mc-guide-card { min-height:0; }.mc-guide-index-hero, .mc-guide-hero { padding:1.15rem; align-items:flex-start; }.mc-guide-hero-icon { width:46px; height:46px; border-radius:13px; font-size:1.2rem; }.mc-guide-index-hero .mc-page-title, .mc-guide-hero .mc-page-title { font-size:1.6rem; }.mc-guide-hero { flex-wrap:wrap; }.mc-guide-plugin-tag { width:100%; margin:0; text-align:center; }.mc-guide-section { padding:1.05rem !important; }.mc-guide-section h2 { font-size:1.14rem; }.mc-guide-breadcrumbs { margin-bottom:.8rem; }.mc-guide-callout { padding:1rem; } }

/* Rich, reusable components for the player-wiki guides. */
.mc-guide-facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.7rem; }
.mc-guide-fact { min-width:0; padding:.9rem; border:1px solid rgba(245,158,11,.2); border-radius:10px; background:linear-gradient(145deg,rgba(245,158,11,.08),rgba(7,10,16,.24)); }
.mc-guide-fact > i { display:grid; width:30px; height:30px; place-items:center; margin-bottom:.62rem; color:#fcd34d; border:1px solid rgba(245,158,11,.25); border-radius:8px; background:rgba(245,158,11,.1); font-size:.82rem; }
.mc-guide-fact p { margin:0 0 .23rem; color:var(--text-muted); font:800 .65rem var(--font-heading); letter-spacing:.07em; line-height:1.3; text-transform:uppercase; }
.mc-guide-fact strong { display:block; color:#fff7df; font:800 .93rem var(--font-heading); line-height:1.4; overflow-wrap:anywhere; }
.mc-guide-flow { display:flex; flex-wrap:wrap; gap:.55rem; align-items:stretch; }
.mc-guide-flow-step { position:relative; flex:1 1 135px; min-width:0; padding:.85rem .75rem .8rem; border:1px solid rgba(245,158,11,.22); border-radius:10px; background:rgba(0,0,0,.19); }
.mc-guide-flow-step:not(:last-child)::after { content:'\f061'; position:absolute; z-index:1; top:50%; right:-.82rem; display:grid; width:1.05rem; height:1.05rem; place-items:center; color:#fbbf24; border-radius:50%; background:#17202d; font:900 .57rem "Font Awesome 6 Free"; transform:translateY(-50%); }
.mc-guide-flow-number { display:grid; width:21px; height:21px; place-items:center; margin-bottom:.45rem; color:#1b1303; border-radius:50%; background:#fbbf24; font:900 .66rem var(--font-heading); }
.mc-guide-flow-step h3 { margin:0 0 .3rem; color:#fff; font-size:.86rem; line-height:1.32; }
.mc-guide-flow-step p { margin:0; color:var(--text-secondary); font-size:.77rem; line-height:1.48; }
.mc-guide-detail-list { display:grid; gap:.8rem; }
.mc-guide-detail-block { padding:1rem; border:1px solid rgba(255,255,255,.08); border-radius:10px; background:rgba(0,0,0,.15); }
.mc-guide-detail-block h3 { display:flex; align-items:center; gap:.48rem; margin:0 0 .42rem; color:#fff; font-size:1rem; }
.mc-guide-detail-block h3 i { color:#fbbf24; font-size:.82rem; }
.mc-guide-detail-block p { margin:0; color:var(--text-secondary); font-size:.88rem; line-height:1.6; }
.mc-guide-detail-block p + ul { margin-top:.65rem; }
.mc-guide-detail-block ul { display:grid; gap:.38rem; margin-bottom:0; padding-left:1.15rem; color:var(--text-secondary); font-size:.85rem; line-height:1.52; }
.mc-guide-detail-block li::marker { color:#fbbf24; }
@media (max-width:760px) { .mc-guide-facts { grid-template-columns:1fr; }.mc-guide-flow { display:grid; grid-template-columns:1fr; gap:.78rem; }.mc-guide-flow-step:not(:last-child)::after { top:auto; right:auto; bottom:-.72rem; left:50%; transform:translateX(-50%) rotate(90deg); } }

/* ==========================================================================
   ELEMENTS GUIDE - player-facing elemental paths.
   ========================================================================== */
.mc-elements-page { max-width:1240px; min-height:calc(100vh - 150px); padding-top:2rem; padding-bottom:3rem; }
.mc-elements-hero { position:relative; display:flex; align-items:center; min-height:275px; padding:2.45rem !important; overflow:hidden; border-color:rgba(245,158,11,.32) !important; background:linear-gradient(128deg,rgba(16,24,38,.98),rgba(25,30,42,.92) 56%,rgba(245,158,11,.12)) !important; }
.mc-elements-hero::before { content:''; position:absolute; top:-190px; right:-110px; width:470px; height:470px; border:1px solid rgba(245,158,11,.16); border-radius:50%; box-shadow:0 0 0 44px rgba(245,158,11,.025),0 0 0 92px rgba(245,158,11,.018); }
.mc-elements-hero-copy { position:relative; z-index:1; max-width:850px; }.mc-elements-hero h1 { margin:0 0 .65rem; font-size:clamp(2.35rem,5vw,4.05rem); }.mc-elements-hero h1 span { color:#fbbf24; }.mc-elements-hero-copy > p:not(.mc-eyebrow) { max-width:790px; color:var(--text-secondary); font-size:1.02rem; line-height:1.7; }
.mc-elements-hero-orb { position:absolute; z-index:1; right:3rem; top:2.2rem; display:grid; width:98px; height:98px; place-items:center; color:#fde68a; border:1px solid rgba(253,230,138,.35); border-radius:28px; background:rgba(245,158,11,.11); box-shadow:0 12px 45px rgba(245,158,11,.12); font-size:2.35rem; transform:rotate(9deg); }
.mc-elements-flow { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; margin-top:1.55rem; color:#e2e8f0; font:800 .76rem var(--font-heading); letter-spacing:.025em; text-transform:uppercase; }.mc-elements-flow > span { display:inline-flex; align-items:center; gap:.42rem; padding:.5rem .65rem; border:1px solid rgba(245,158,11,.24); border-radius:8px; background:rgba(7,10,16,.38); }.mc-elements-flow > span i,.mc-elements-flow > i { color:#fbbf24; }.mc-elements-flow > i { padding:0 .1rem; font-size:.68rem; }
.mc-elements-intro-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin:1.1rem 0; }.mc-elements-path-card { display:flex; gap:1rem; padding:1.25rem; border:1px solid var(--border-subtle); border-radius:14px; background:linear-gradient(145deg,rgba(18,24,35,.9),rgba(11,15,23,.88)); }.mc-elements-path-card.god { border-color:rgba(251,146,60,.28); }.mc-elements-path-card.goddess { border-color:rgba(125,211,252,.28); }.mc-elements-path-icon { display:grid; flex:0 0 auto; width:46px; height:46px; place-items:center; color:#fed7aa; border:1px solid rgba(251,146,60,.3); border-radius:13px; background:rgba(251,146,60,.1); font-size:1.2rem; }.goddess .mc-elements-path-icon { color:#bae6fd; border-color:rgba(125,211,252,.3); background:rgba(56,189,248,.1); }.mc-elements-path-card h2 { margin:.05rem 0 .38rem; color:#fff; font-size:1.16rem; }.mc-elements-path-card p:not(.mc-eyebrow) { color:var(--text-secondary); font-size:.88rem; line-height:1.55; }.mc-elements-path-card .mc-eyebrow { margin:0; font-size:.65rem; }
.mc-elements-fairness { margin:0 0 1.15rem; }.mc-elements-fairness p { margin:0; line-height:1.62; }
.mc-elements-jump-links { display:flex; flex-wrap:wrap; gap:.55rem; margin:0 0 1.15rem; }.mc-elements-jump-links a { display:inline-flex; align-items:center; gap:.42rem; padding:.5rem .67rem; color:var(--element-color); border:1px solid color-mix(in srgb,var(--element-color) 38%,transparent); border-radius:8px; background:color-mix(in srgb,var(--element-color) 8%,transparent); font:800 .76rem var(--font-heading); text-decoration:none; transition:transform .16s ease,background .16s ease; }.mc-elements-jump-links a:hover { color:#fff; background:color-mix(in srgb,var(--element-color) 18%,transparent); transform:translateY(-2px); }
.mc-elements-list { display:grid; gap:1rem; }.mc-element-card { scroll-margin-top:1rem; padding:1.45rem; border:1px solid color-mix(in srgb,var(--element-color) 35%,rgba(255,255,255,.08)); border-radius:16px; background:linear-gradient(135deg,color-mix(in srgb,var(--element-color) 8%,rgba(18,24,35,.95)),rgba(10,14,21,.94) 48%); box-shadow:0 15px 35px rgba(0,0,0,.14); }.mc-element-heading { display:flex; align-items:center; gap:1rem; padding-bottom:1.12rem; border-bottom:1px solid color-mix(in srgb,var(--element-color) 22%,transparent); }.mc-element-icon { position:relative; display:grid; width:58px; height:58px; flex:0 0 auto; place-items:center; overflow:hidden; color:var(--element-color); border:1px solid color-mix(in srgb,var(--element-color) 40%,transparent); border-radius:16px; background:color-mix(in srgb,var(--element-color) 10%,transparent); font-size:1.45rem; }.mc-element-icon img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; padding:.45rem; opacity:.38; }.mc-element-icon i { position:relative; z-index:1; text-shadow:0 2px 13px rgba(0,0,0,.55); }.mc-element-heading .mc-eyebrow { margin:0 0 .1rem; color:var(--element-color); font-size:.65rem; }.mc-element-heading h2 { margin:0 0 .22rem; color:#fff; font-size:1.55rem; }.mc-element-heading p:not(.mc-eyebrow) { color:var(--text-secondary); font-size:.9rem; }
.mc-element-deities { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-top:1.15rem; }.mc-element-deity { display:grid; grid-template-columns:91px minmax(0,1fr); gap:.9rem; min-width:0; padding:1rem; border:1px solid rgba(255,255,255,.08); border-radius:12px; background:rgba(5,8,14,.34); }.mc-element-deity.god { border-color:rgba(251,146,60,.2); }.mc-element-deity.goddess { border-color:rgba(125,211,252,.2); }.mc-element-deity > img { width:91px; height:112px; object-fit:cover; object-position:center top; border:1px solid rgba(255,255,255,.12); border-radius:9px; background:rgba(0,0,0,.3); }.mc-element-deity-copy > span { display:inline-block; margin:0 0 .22rem; color:#fed7aa; font:800 .65rem var(--font-heading); letter-spacing:.11em; }.goddess .mc-element-deity-copy > span { color:#bae6fd; }.mc-element-deity h3 { margin:0 0 .3rem; color:#fff; font-size:1.13rem; }.mc-element-deity p { margin:.28rem 0; color:var(--text-secondary); font-size:.82rem; line-height:1.48; }.mc-element-deity .mc-element-deity-lore { color:#cbd5e1; }.mc-element-deity strong { color:#e2e8f0; }
.mc-element-footnotes { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; margin-top:1rem; }.mc-element-footnotes p { margin:0; padding:.75rem .85rem; color:var(--text-secondary); border:1px solid rgba(255,255,255,.07); border-radius:10px; background:rgba(0,0,0,.16); font-size:.84rem; line-height:1.55; }.mc-element-footnotes i { margin-right:.4rem; color:var(--element-color); }.mc-element-footnotes strong { color:#e2e8f0; }
.mc-elements-closing { margin-top:1.2rem; padding:1.65rem !important; border-color:rgba(245,158,11,.28) !important; background:linear-gradient(125deg,rgba(18,25,36,.95),rgba(245,158,11,.09)) !important; }.mc-elements-closing h2 { margin:.1rem 0 .4rem; color:#fff; font-size:1.55rem; }.mc-elements-closing > p:not(.mc-eyebrow) { max-width:800px; color:var(--text-secondary); line-height:1.65; }.mc-elements-closing .mc-btn { margin-top:.85rem; text-decoration:none; }
@media (max-width:850px) { .mc-elements-hero { padding:1.7rem !important; }.mc-elements-hero-orb { right:1.6rem; top:1.3rem; width:62px; height:62px; border-radius:17px; font-size:1.45rem; }.mc-elements-hero h1 { padding-right:4.2rem; }.mc-element-deities,.mc-element-footnotes { grid-template-columns:1fr; } }
@media (max-width:620px) { .mc-elements-page { padding-top:1.1rem; padding-bottom:2rem; }.mc-elements-hero { min-height:0; padding:1.35rem 1.1rem !important; }.mc-elements-hero-copy > p:not(.mc-eyebrow) { font-size:.92rem; }.mc-elements-flow { gap:.38rem; }.mc-elements-flow > i { display:none; }.mc-elements-flow > span { font-size:.65rem; }.mc-elements-intro-grid { grid-template-columns:1fr; }.mc-elements-path-card { padding:1rem; }.mc-elements-jump-links { gap:.42rem; }.mc-elements-jump-links a { font-size:.69rem; }.mc-element-card { padding:1.1rem; }.mc-element-heading { align-items:flex-start; }.mc-element-icon { width:46px; height:46px; border-radius:13px; font-size:1.1rem; }.mc-element-heading h2 { font-size:1.28rem; }.mc-element-deity { grid-template-columns:66px minmax(0,1fr); padding:.8rem; gap:.7rem; }.mc-element-deity > img { width:66px; height:88px; }.mc-element-deity p { font-size:.78rem; }.mc-elements-closing { padding:1.2rem !important; } }

/* ==========================================================================
   Global website media player — rendered once by includes/footer.php so
   every page that shares the site chrome gets the same persistent widget.
   See assets/media-player.js for behaviour; state lives in localStorage,
   never on the server. Layout only below — the JS never reads these
   positions, so moving/resizing this block cannot affect playback,
   playlist, volume, or cross-page sync.
   `position:fixed` here is relative to the viewport, not the page, as long
   as no ancestor between <body> and #tickmcPlayer sets its own transform/
   filter/perspective/contain (that would create a new containing block and
   make "fixed" track that ancestor instead). Checked: footer.php closes
   every page's <main> before this markup, so #tickmcPlayer is always a
   plain sibling of <body>'s other top-level elements — no such ancestor
   exists, so no JS scroll-position syncing is needed; the browser keeps it
   pinned on its own.
   Stacking: normal content, then this player (4200), then toasts and
   confirmation modals (5000+, unchanged). The notification dropdowns and
   the mobile top bar/sidebar drawer live in their own lower stacking
   contexts (z-index 300/1000/1100) but are positioned at the opposite
   edge of the screen (left sidebar or top bar) from this bottom-right
   player, so they don't need to out-rank it to stay visible.
   .support-modal-backdrop was raised from 2200 to 4600 (below) because
   that confirmation dialog previously sat, incorrectly, behind this
   player. */
.tickmc-player { position:fixed; left:auto; right:1.25rem; top:auto; bottom:1.25rem; z-index:4200; width:min(300px, calc(100vw - 2rem)); font-family:var(--font-body); }
.tickmc-player[hidden] { display:none; }
.tickmc-player-bar { display:flex; align-items:center; gap:.5rem; padding:.4rem .55rem; border:1px solid var(--border-subtle); border-radius:999px; background:linear-gradient(135deg,rgba(18,22,32,.96),rgba(10,14,21,.96)); box-shadow:0 14px 34px rgba(0,0,0,.4); }
.tickmc-player-mini-btn { flex:0 0 auto; width:2.15rem; height:2.15rem; border-radius:50%; border:1px solid var(--gold-border); background:rgba(245,158,11,.14); color:var(--gold-light); display:grid; place-items:center; cursor:pointer; font-size:.8rem; }
.tickmc-player-mini-btn:hover { background:rgba(245,158,11,.24); }
.tickmc-player-mini-btn:disabled { opacity:.45; cursor:not-allowed; }
.tickmc-player-bar-main { flex:1; min-width:0; display:flex; align-items:center; gap:.4rem; border:0; background:none; color:var(--text-primary); cursor:pointer; padding:.2rem 0; text-align:left; font:inherit; }
.tickmc-player-bar-title { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.78rem; font-weight:700; }
.tickmc-player-bar-chevron { color:var(--text-muted); font-size:.68rem; transition:transform .18s ease; }
.tickmc-player[data-expanded="true"] .tickmc-player-bar-chevron { transform:rotate(180deg); }
.tickmc-player-mini-btn:focus-visible, .tickmc-player-bar-main:focus-visible, .tickmc-player-btn:focus-visible, .tickmc-player-volume button:focus-visible { outline:2px solid var(--gold-light); outline-offset:2px; }
.tickmc-player-panel { margin-top:.5rem; padding:.85rem; border:1px solid var(--border-subtle); border-radius:var(--radius-lg); background:linear-gradient(150deg,rgba(18,22,32,.97),rgba(10,14,21,.97)); box-shadow:0 18px 44px rgba(0,0,0,.45); animation:mc-toast-in .16s ease-out; }
.tickmc-player-panel[hidden] { display:none; }
.tickmc-player-now-playing { display:flex; align-items:center; gap:.65rem; margin-bottom:.7rem; }
.tickmc-player-art { flex:0 0 auto; width:2.6rem; height:2.6rem; border-radius:9px; display:grid; place-items:center; color:#fbbf24; background:rgba(245,158,11,.12); border:1px solid var(--gold-border); font-size:1rem; overflow:hidden; }
.tickmc-player-art img { width:100%; height:100%; object-fit:cover; }
.tickmc-player-meta { min-width:0; }
.tickmc-player-meta strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#fff; font-size:.85rem; }
.tickmc-player-meta small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text-muted); font-size:.7rem; margin-top:.1rem; }
.tickmc-player-progress-row { display:flex; align-items:center; gap:.5rem; margin-bottom:.6rem; }
.tickmc-player-time { flex:0 0 auto; min-width:2.4em; color:var(--text-muted); font-size:.68rem; font-variant-numeric:tabular-nums; }
.tickmc-player-seek { flex:1; }
.tickmc-player-controls-row { display:flex; align-items:center; gap:.5rem; }
.tickmc-player-btn { flex:0 0 auto; width:2.15rem; height:2.15rem; border-radius:50%; border:1px solid var(--border-subtle); background:rgba(255,255,255,.04); color:var(--text-primary); display:grid; place-items:center; cursor:pointer; font-size:.76rem; }
.tickmc-player-btn:hover { background:rgba(255,255,255,.09); }
.tickmc-player-btn:disabled, .tickmc-player-seek:disabled, .tickmc-player-volume input:disabled { opacity:.4; cursor:not-allowed; }
.tickmc-player-btn-play { width:2.5rem; height:2.5rem; border-color:var(--gold-border); background:rgba(245,158,11,.16); color:var(--gold-light); font-size:.9rem; }
.tickmc-player-btn-play:hover { background:rgba(245,158,11,.26); }
.tickmc-player-volume { display:flex; align-items:center; gap:.4rem; margin-left:auto; }
.tickmc-player-volume input[type="range"] { width:5.2rem; }
.tickmc-player-status { margin-top:.5rem; color:var(--text-muted); font-size:.68rem; text-align:center; }
.tickmc-player input[type="range"] { -webkit-appearance:none; appearance:none; height:4px; border-radius:999px; background:rgba(255,255,255,.14); outline:none; cursor:pointer; }
.tickmc-player input[type="range"]::-webkit-slider-thumb { -webkit-appearance:none; width:12px; height:12px; border-radius:50%; background:var(--gold-light); border:0; cursor:pointer; }
.tickmc-player input[type="range"]::-moz-range-thumb { width:12px; height:12px; border-radius:50%; background:var(--gold-light); border:0; cursor:pointer; }
.tickmc-player input[type="range"]:focus-visible { outline:2px solid var(--gold-light); outline-offset:3px; }
/* Tablet: stays bottom-right, just pulled in a little so it never crowds
   the sidebar drawer toggle or page content. */
@media (max-width:992px) { .tickmc-player { right:.85rem; bottom:1rem; width:min(272px, calc(100vw - 1.7rem)); } }
/* Mobile: a compact bottom-right pill rather than a full-width bar, so it
   never covers half the screen; the panel still expands from the same
   anchor without a separate player instance or extra listeners. */
@media (max-width:640px) {
  .tickmc-player { bottom:1rem; right:.75rem; width:min(240px, calc(100vw - 1.5rem)); }
  .tickmc-player-bar-title { max-width:9.5rem; }
  .tickmc-player-volume input[type="range"] { width:3.4rem; }
}
@media (max-width:420px) { .tickmc-player { bottom:.75rem; right:.6rem; width:min(210px, calc(100vw - 1.2rem)); } .tickmc-player-bar-title { max-width:7rem; } }
@media (prefers-reduced-motion:reduce) { .tickmc-player-bar-chevron, .tickmc-player-panel { transition:none!important; animation:none!important; } }

/* ==========================================================================
   Update content blocks — the rendered OUTPUT of the Update Management
   block editor (includes/update_blocks.php renders these exact classes
   server-side; assets/update-editor.js's live preview mirrors them
   client-side). Lives here, not in update-editor.css, because updates.php
   (public, no editor loaded) needs these styles too. Every class below is
   part of a fixed, server-controlled set — never arbitrary staff-authored
   CSS. */
.mc-update-heading { margin: 1.1rem 0 .5rem; color: #fff; font-family: var(--font-heading); font-weight: 800; }
.mc-update-paragraph { margin: .6rem 0; color: var(--text-secondary); line-height: 1.65; }
.mc-update-align-left { text-align: left; } .mc-update-align-center { text-align: center; } .mc-update-align-right { text-align: right; }
.mc-update-link { color: var(--gold-light); text-decoration: underline; text-decoration-color: rgba(251,191,36,.4); }
.mc-update-link:hover { color: #fff; }
.mc-update-inline-code { padding: .1rem .35rem; border-radius: 5px; background: rgba(255,255,255,.08); color: #fde68a; font-family: 'JetBrains Mono', 'Consolas', monospace; font-size: .88em; }
.mc-update-highlight { padding: .05rem .3rem; border-radius: 4px; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
.mc-update-highlight-yellow { background: rgba(250,204,21,.28); color: #fef9c3; }
.mc-update-highlight-orange { background: rgba(251,146,60,.28); color: #ffedd5; }
.mc-update-highlight-red { background: rgba(248,113,113,.28); color: #fee2e2; }
.mc-update-highlight-green { background: rgba(74,222,128,.25); color: #dcfce7; }
.mc-update-highlight-blue { background: rgba(96,165,250,.25); color: #dbeafe; }
.mc-update-highlight-purple { background: rgba(192,132,252,.25); color: #f3e8ff; }
.mc-update-highlight-gray { background: rgba(148,163,184,.25); color: #f1f5f9; }
.mc-update-highlight-info { background: rgba(56,189,248,.25); color: #e0f2fe; }
.mc-update-highlight-warning { background: rgba(251,191,36,.28); color: #fef3c7; }
.mc-update-highlight-success { background: rgba(52,211,153,.25); color: #d1fae5; }
.mc-update-highlight-important { background: rgba(248,113,113,.3); color: #fee2e2; }

.mc-update-list { margin: .6rem 0; padding-left: 1.4rem; color: var(--text-secondary); line-height: 1.65; display: grid; gap: .3rem; }
.mc-update-list-checklist { list-style: none; padding-left: 0; }
.mc-update-checklist-item { display: flex; align-items: flex-start; gap: .5rem; }
.mc-update-checklist-item i { margin-top: .2rem; color: var(--text-muted); }
.mc-update-checklist-item.is-checked i { color: #4ade80; }
.mc-update-checklist-item.is-checked span { color: var(--text-muted); text-decoration: line-through; }

.mc-update-quote { margin: .9rem 0; padding: .85rem 1.1rem; border-left: 3px solid var(--gold-main); border-radius: 0 10px 10px 0; background: rgba(245,158,11,.06); color: var(--text-secondary); font-style: italic; }
.mc-update-quote cite { display: block; margin-top: .4rem; color: var(--gold-light); font-style: normal; font-size: .8rem; font-weight: 700; }

.mc-update-callout { display: flex; gap: .7rem; margin: .9rem 0; padding: .85rem 1rem; border-radius: 10px; border: 1px solid; }
.mc-update-callout > i { margin-top: .15rem; font-size: 1rem; flex: 0 0 auto; }
.mc-update-callout > div { color: var(--text-secondary); line-height: 1.6; }
.mc-update-callout-info { border-color: rgba(56,189,248,.35); background: rgba(56,189,248,.08); } .mc-update-callout-info > i { color: #38bdf8; }
.mc-update-callout-tip { border-color: rgba(74,222,128,.35); background: rgba(74,222,128,.08); } .mc-update-callout-tip > i { color: #4ade80; }
.mc-update-callout-warning { border-color: rgba(251,191,36,.4); background: rgba(251,191,36,.09); } .mc-update-callout-warning > i { color: #fbbf24; }
.mc-update-callout-important { border-color: rgba(248,113,113,.4); background: rgba(248,113,113,.09); } .mc-update-callout-important > i { color: #f87171; }
.mc-update-callout-success { border-color: rgba(52,211,153,.4); background: rgba(52,211,153,.09); } .mc-update-callout-success > i { color: #34d399; }
.mc-update-callout-error { border-color: rgba(239,68,68,.45); background: rgba(239,68,68,.1); } .mc-update-callout-error > i { color: #ef4444; }

.mc-update-divider { margin: 1.2rem 0; border: 0; }
.mc-update-divider-line { border-top: 1px solid var(--border-subtle); }
.mc-update-divider-accent { height: 3px; border-radius: 3px; background: linear-gradient(90deg, var(--gold-main), transparent); }
.mc-update-divider-dotted { border-top: 2px dotted rgba(255,255,255,.15); }

.mc-update-image { margin: .9rem 0; }
.mc-update-image img { display: block; max-width: 100%; height: auto; border-radius: 6px; }
.mc-update-image-rounded img { border-radius: 14px; }
.mc-update-image-border img { border: 1px solid var(--border-subtle); }
.mc-update-image-shadow img { box-shadow: 0 16px 34px rgba(0,0,0,.32); }
.mc-update-image-small img { max-width: 260px; } .mc-update-image-medium img { max-width: 440px; } .mc-update-image-large img { max-width: 640px; } .mc-update-image-full img { max-width: 100%; width: 100%; }
.mc-update-image-align-left { text-align: left; } .mc-update-image-align-center { text-align: center; } .mc-update-image-align-right { text-align: right; } .mc-update-image-align-full { text-align: center; }
.mc-update-image figcaption { margin-top: .4rem; color: var(--text-muted); font-size: .78rem; text-align: center; }
.mc-update-image-placeholder { display: grid; place-items: center; min-height: 120px; border: 1px dashed var(--border-subtle); border-radius: 10px; color: var(--text-muted); font-size: .78rem; }

.mc-update-gallery { display: grid; gap: .6rem; margin: .9rem 0; }
.mc-update-gallery-two { grid-template-columns: repeat(2, 1fr); }
.mc-update-gallery-three { grid-template-columns: repeat(3, 1fr); }
.mc-update-gallery-grid { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); }
.mc-update-gallery-item img { width: 100%; height: 100%; object-fit: cover; border-radius: 8px; aspect-ratio: 4 / 3; }
.mc-update-gallery-item figcaption { margin-top: .3rem; color: var(--text-muted); font-size: .72rem; text-align: center; }
@media (max-width: 620px) { .mc-update-gallery-two, .mc-update-gallery-three { grid-template-columns: 1fr 1fr; } }

.mc-update-table-wrap { margin: .9rem 0; overflow-x: auto; border-radius: 10px; border: 1px solid var(--border-subtle); }
.mc-update-table { width: 100%; min-width: 420px; border-collapse: collapse; font-size: .86rem; }
.mc-update-table caption { padding: .6rem .8rem; text-align: left; color: var(--text-muted); font-size: .76rem; border-bottom: 1px solid var(--border-subtle); }
.mc-update-table th, .mc-update-table td { padding: .55rem .7rem; border-bottom: 1px solid var(--border-subtle); color: var(--text-secondary); }
.mc-update-table th { color: #fff; font-weight: 800; background: rgba(255,255,255,.03); }
.mc-update-table-compact th, .mc-update-table-compact td { padding: .32rem .55rem; font-size: .8rem; }
.mc-update-table-striped tbody tr:nth-child(even) td, .mc-update-table-striped tr:nth-child(even) td { background: rgba(255,255,255,.025); }
.mc-update-table-highlight-header th { background: rgba(245,158,11,.14); color: #fde68a; }
.mc-update-table-borderless th, .mc-update-table-borderless td { border-bottom: 0; }
.mc-update-table-comparison th:first-child, .mc-update-table-comparison td:first-child { font-weight: 700; color: #fff; }

.mc-update-code-block { margin: .9rem 0; border-radius: 10px; overflow: hidden; border: 1px solid var(--border-subtle); background: #0b0f16; }
.mc-update-code-lang { display: block; padding: .35rem .8rem; font-size: .68rem; letter-spacing: .06em; text-transform: uppercase; color: var(--text-muted); border-bottom: 1px solid var(--border-subtle); }
.mc-update-code-block pre { margin: 0; padding: .9rem 1rem; overflow-x: auto; }
.mc-update-code-block code { font-family: 'JetBrains Mono', 'Consolas', monospace; font-size: .84rem; color: #e2e8f0; white-space: pre-wrap; word-break: break-word; }

.mc-update-cta { display: inline-flex; align-items: center; gap: .4rem; margin: .5rem .4rem .5rem 0; padding: .6rem 1.1rem; border-radius: 999px; font-weight: 800; font-size: .84rem; text-decoration: none; border: 1px solid transparent; }
.mc-update-cta-primary { background: linear-gradient(135deg, var(--gold-main), var(--gold-light)); color: #1a1206; }
.mc-update-cta-primary:hover { filter: brightness(1.08); }
.mc-update-cta-secondary { background: rgba(255,255,255,.06); border-color: var(--border-subtle); color: var(--text-primary); }
.mc-update-cta-secondary:hover { background: rgba(255,255,255,.1); }
.mc-update-cta-warning { background: rgba(239,68,68,.16); border-color: rgba(239,68,68,.4); color: #fecaca; }
.mc-update-cta-warning:hover { background: rgba(239,68,68,.24); }

.mc-update-changelog { display: grid; gap: .7rem; margin: .9rem 0; }
.mc-update-changelog-section { padding: .7rem .9rem; border-radius: 10px; border: 1px solid var(--border-subtle); background: rgba(255,255,255,.02); }
.mc-update-changelog-section h5 { margin: 0 0 .45rem; display: flex; align-items: center; gap: .4rem; font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; }
.mc-update-changelog-section ul { margin: 0; padding-left: 1.3rem; color: var(--text-secondary); line-height: 1.6; display: grid; gap: .2rem; }
.mc-update-changelog-added h5 { color: #4ade80; } .mc-update-changelog-changed h5 { color: #38bdf8; } .mc-update-changelog-fixed h5 { color: #a3e635; }
.mc-update-changelog-removed h5 { color: #f87171; } .mc-update-changelog-security h5 { color: #fbbf24; }

.mc-update-badge { display: inline-flex; align-items: center; padding: .16rem .55rem; margin: 0 .3rem .3rem 0; border-radius: 999px; font-size: .66rem; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
.mc-update-badge-new { background: rgba(74,222,128,.2); color: #4ade80; }
.mc-update-badge-beta { background: rgba(96,165,250,.2); color: #60a5fa; }
.mc-update-badge-fixed { background: rgba(163,230,53,.2); color: #a3e635; }
.mc-update-badge-important { background: rgba(248,113,113,.22); color: #f87171; }
.mc-update-badge-coming-soon { background: rgba(192,132,252,.2); color: #c084fc; }
.mc-update-badge-deprecated { background: rgba(148,163,184,.22); color: #94a3b8; }

.mc-update-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 1.1rem; margin: .9rem 0; align-items: start; }
.mc-update-columns .mc-update-heading, .mc-update-columns .mc-update-paragraph, .mc-update-columns .mc-update-image { margin-top: 0; }
@media (max-width: 700px) { .mc-update-columns { grid-template-columns: 1fr; gap: .8rem; } }

.mc-update-spacer-small { height: .6rem; } .mc-update-spacer-medium { height: 1.4rem; } .mc-update-spacer-large { height: 2.6rem; }

.mc-update-collapsible { margin: .9rem 0; padding: .2rem 0; border-top: 1px solid var(--border-subtle); border-bottom: 1px solid var(--border-subtle); }
.mc-update-collapsible summary { padding: .7rem .2rem; cursor: pointer; color: var(--gold-light); font-weight: 800; font-size: .86rem; list-style: none; }
.mc-update-collapsible summary::-webkit-details-marker { display: none; }
.mc-update-collapsible summary::before { content: '\25B8'; display: inline-block; margin-right: .5rem; transition: transform .15s ease; }
.mc-update-collapsible[open] summary::before { transform: rotate(90deg); }
.mc-update-collapsible summary:focus-visible { outline: 2px solid var(--gold-light); outline-offset: 2px; }
.mc-update-collapsible > div { padding: 0 .2rem .8rem; color: var(--text-secondary); line-height: 1.6; }

.mc-update-block-error { color: #f87171; font-size: .82rem; }

@media (prefers-reduced-motion: reduce) { .mc-update-collapsible summary::before { transition: none; } }