/* ==========================================================================
   LimeRP — Limester "Los Santos After Dark" noir design system
   style.css'ten SONRA yüklenir. Palet-agnostik token'ları okur, tüm temayı giydirir.
   Bkz. design.md
   ========================================================================== */

:root{
  /* harman markası — sabit (palet drift'i olmasın diye pinlendi) */
  --lime: #8ae048;
  --lime-2: #a6ee6b;
  /* markaya sabit */
  --gold: #d6a340;  --gold-2: #e7bd63;
  --bg: #070a09;  --bg-2: #0b1110;  --surface: #10171a;  --surface-2: #151e21;
  --ink: #eef3ee;  --dim: #aeb9b3;  --mute: #909e97;
  --line: rgba(238,243,238,.09);  --line-2: rgba(238,243,238,.17);
  --mag: #ff3d8b;  --cyn: #2ee6d6;
  --fd: 'Oswald','Arial Narrow',Impact,sans-serif;
  --fb: 'Inter',-apple-system,'Segoe UI',system-ui,sans-serif;
  --fm: 'JetBrains Mono',ui-monospace,monospace;
  --ease: cubic-bezier(.22,.9,.28,1);
  --lime-06: rgba(138,224,72,.06);  --lime-10: rgba(138,224,72,.12);
  --lime-20: rgba(138,224,72,.2);  --lime-shadow: rgba(138,224,72,.45);
  --lime-border: rgba(138,224,72,.35);
  --gold-10: rgba(214,163,64,.12);
}

/* palet kilidi — DB'de hangi renk seçili olursa olsun (canlıda 'yellow' kalmıştı) noir'ı zorla.
   html:root, layout'ların geç enjekte ettiği :root paletini specificity ile yener; böylece
   style.css'teki ~665 var(--primary-*) referansı ve tüm bespoke class'lar lime/altın okur. */
html:root{
  --body-bg: rgba(7 10 9);
  --primary-bg: rgba(138 224 72);
  --secondary-bg: rgba(16 23 26);
  --primary-color: rgba(138 224 72);
  --secondary-color: rgba(214 163 64);
  --primary-transparent: rgba(138 224 72 / .1);
  --secondary-transparent: rgba(214 163 64 / .1);
  --primary-fade: rgba(138 224 72 / .05);
  --primary-light: rgba(138 224 72 / .2);
  --primary-shadow: rgba(138 224 72 / .28);
  --primary-border: rgba(138 224 72 / .3);
}

/* ---- base ---- */
body{ background: var(--bg); color: var(--ink); font-family: var(--fb); -webkit-font-smoothing: antialiased; }
h1,h2,h3,h4,h5,.header-title,.section-title,.widget-title{ font-family: var(--fd); text-transform: uppercase; letter-spacing: .01em; }
.mono,[data-count],.count{ font-family: var(--fm); font-variant-numeric: tabular-nums; }
a{ transition: color .2s; }
::selection{ background: var(--lime-10); color: var(--ink); }
:focus-visible{ outline: 2px solid var(--lime); outline-offset: 3px; }
::-webkit-scrollbar{ width: 11px; height: 11px; }
::-webkit-scrollbar-track{ background: var(--bg); }
::-webkit-scrollbar-thumb{ background: #1c2725; border-radius: 99px; border: 3px solid var(--bg); }
::-webkit-scrollbar-thumb:hover{ background: var(--lime-border); }

/* ---- site-wide atmosphere (fısıltı) ---- */
.limerp-grain,.limerp-vhs{ position: fixed; inset: 0; z-index: 3; pointer-events: none; }
.limerp-grain{ opacity: .022; mix-blend-mode: overlay; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.limerp-vhs{ opacity: .013; background: repeating-linear-gradient(0deg,transparent 0 3px,rgba(0,0,0,.55) 3px 4px); }

/* ---- buttons ---- */
.btn-gradient,.btn-lime,.btn-primary{
  font-family: var(--fd); text-transform: uppercase; letter-spacing: .06em; font-weight: 600;
  background: var(--lime) !important; color: #06140a !important; border: 0 !important;
  border-radius: 6px !important; box-shadow: 0 8px 30px -8px var(--lime-shadow), inset 0 1px 0 rgba(255,255,255,.35);
  transition: transform .2s var(--ease), box-shadow .25s var(--ease);
}
.btn-gradient:hover,.btn-lime:hover,.btn-primary:hover{ transform: translateY(-2px); box-shadow: 0 14px 42px -8px var(--lime-shadow), inset 0 1px 0 rgba(255,255,255,.4); color: #06140a !important; }
.btn-gradient-transparent,.btn-outline-lime,.btn-ghost{
  font-family: var(--fd); text-transform: uppercase; letter-spacing: .06em; font-weight: 600;
  background: rgba(255,255,255,.015) !important; color: var(--ink) !important;
  border: 1px solid var(--line-2) !important; border-radius: 6px !important; backdrop-filter: blur(6px);
  transition: transform .2s var(--ease), border-color .25s, color .25s;
}
.btn-gradient-transparent:hover,.btn-outline-lime:hover,.btn-ghost:hover{ transform: translateY(-2px); border-color: var(--lime-border) !important; color: var(--lime) !important; }

/* ---- navbar ---- */
.header-broadcast{ background: var(--bg-2); border-bottom: 1px solid var(--line); }
.header-broadcast-label{ color: var(--gold); }
.header-top{ background: transparent; transition: background .3s, border-color .3s, backdrop-filter .3s; border-bottom: 1px solid transparent; }
.header-top.limerp-solid{ background: rgba(7,10,9,.86); backdrop-filter: blur(14px); border-bottom-color: var(--line); }
.header-nav-item{ position: relative; color: var(--dim); font-weight: 500; transition: color .2s; }
.header-nav-item:hover,.header-nav-item.active{ color: var(--ink); }
.header-nav-item::after{ content:""; position: absolute; left: 0; right: 100%; bottom: -4px; height: 2px; background: var(--lime); transition: right .25s; }
.header-nav-item:hover::after,.header-nav-item.active::after{ right: 0; }
.nav-item-dropdown-btn{ color: var(--dim); font-family: var(--fb); }
.nav-item-dropdown-btn:hover{ color: var(--ink); }
.nav-item-dropdown-menu{ background: var(--surface); border: 1px solid var(--line); border-radius: 10px; }
.nav-item-dropdown-link{ color: var(--dim); }
.nav-item-dropdown-link:hover{ color: var(--lime); background: var(--lime-06); }
.header-cart{ color: var(--dim); }
.header-cart:hover{ color: var(--lime); }
.header-cart-count{ background: var(--lime); color: #06140a; font-family: var(--fm); }
.categories-section-nav-balance{ border: 1px solid var(--lime-border); border-radius: 999px; color: var(--lime); background: var(--lime-10); transition: box-shadow .25s; }
.categories-section-nav-balance:hover{ box-shadow: 0 0 0 3px var(--lime-06); }
.header-mobile-toggle{ color: var(--ink); border: 1px solid var(--line-2); border-radius: 9px; background: transparent; }

/* ---- header-bottom → Server Pulse hero (home) ---- */
.header-tag{ display: inline-flex; align-items: center; gap: 9px; border: 1px solid var(--lime-border); border-radius: 999px; padding: 7px 15px; background: rgba(7,10,9,.45); backdrop-filter: blur(6px); color: var(--lime-2); font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; }
.header-tag i{ color: var(--lime); }
.header-title{ font-size: clamp(2.6rem,7vw,5.2rem); line-height: .98; letter-spacing: -.005em; }
.header-title .g,.header-title em{ font-style: normal; color: var(--lime); display: block; text-shadow: 0 0 22px var(--lime-20); }
.header-description{ color: var(--dim); max-width: 46ch; }
.header-stat-number{ font-family: var(--fm); color: var(--lime); }
.header-stat-label{ color: var(--mute); text-transform: uppercase; letter-spacing: .08em; font-size: .7rem; }

/* Server Pulse HUD panel (home) */
.pulse-panel{ background: linear-gradient(165deg,rgba(21,30,33,.92),rgba(11,17,16,.9)); border: 1px solid var(--line); border-radius: 14px; padding: 22px; backdrop-filter: blur(12px); position: relative; box-shadow: 0 30px 80px -30px rgba(0,0,0,.8); }
.pulse-panel::before{ content:""; position: absolute; top: 0; left: 18px; right: 18px; height: 1px; background: linear-gradient(90deg,transparent,var(--lime-border),transparent); }
.pulse-head{ display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.pulse-head .t{ font-family: var(--fd); text-transform: uppercase; font-size: 1.05rem; letter-spacing: .05em; }
.canli{ display: inline-flex; align-items: center; gap: 7px; font-size: .64rem; letter-spacing: .18em; color: var(--lime-2); border: 1px solid var(--lime-border); border-radius: 999px; padding: 4px 11px; }
.stat-grid{ display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.stat{ background: rgba(7,10,9,.55); border: 1px solid var(--line); border-radius: 10px; padding: 13px 15px; }
.stat .n{ font-family: var(--fm); font-size: 1.45rem; color: var(--ink); letter-spacing: -.02em; }
.stat.acc .n{ color: var(--lime); }
.stat .s{ font-size: .85rem; color: var(--mute); }
.stat .l{ font-size: .64rem; text-transform: uppercase; letter-spacing: .1em; color: var(--mute); margin-top: 3px; }
.pulse-panel .bar{ height: 5px; border-radius: 99px; background: rgba(255,255,255,.06); margin: 15px 0 11px; overflow: hidden; }
.pulse-panel .bar i{ display: block; height: 100%; width: 64%; border-radius: 99px; background: linear-gradient(90deg,var(--lime),var(--gold)); }
.pulse-foot{ display: flex; align-items: center; gap: 9px; font-size: .74rem; color: var(--mute); }
.live-dot{ width: 8px; height: 8px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 4px var(--lime-10); animation: limerp-pulse 2.2s infinite; display: inline-block; flex: 0 0 auto; }
@keyframes limerp-pulse{ 0%,100%{opacity:1} 50%{opacity:.4} }

/* ---- generic cards / surfaces (tüm sayfalar) ---- */
.card,.widget,.box,.panel{ background: linear-gradient(180deg,var(--surface-2),var(--surface)) !important; border: 1px solid var(--line) !important; border-radius: 14px !important; }
.card:hover{ border-color: var(--line-2) !important; }
.widget-title,.section-title{ font-family: var(--fd); }

/* section header helper */
.limerp-eyebrow{ display: inline-flex; align-items: center; gap: 9px; font-size: .72rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--gold); margin-bottom: 12px; }
.limerp-eyebrow::before{ content:""; width: 22px; height: 1px; background: var(--gold); }
.section-kicker,.kicker,.kick{ display: inline-flex; align-items: center; gap: 9px; font-size: .72rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--gold); }
.section-kicker::before,.kicker::before,.kick::before{ content:""; width: 22px; height: 1px; background: var(--gold); }

/* ---- forms ---- */
.form-control,.form-select,input[type=text],input[type=email],input[type=password],input[type=number],input[type=search],textarea,select{
  background: rgba(7,10,9,.55) !important; border: 1px solid var(--line) !important; color: var(--ink) !important; border-radius: 9px !important; font-family: var(--fb); }
.form-control:focus,.form-select:focus,textarea:focus,input:focus,select:focus{ border-color: var(--lime-border) !important; box-shadow: 0 0 0 3px var(--lime-06) !important; }
.form-control::placeholder,input::placeholder,textarea::placeholder{ color: var(--mute) !important; }
label,.form-label{ color: var(--dim); }

/* ---- tables (leaderboard vb.) ---- */
.table,table.table{ color: var(--dim); }
.table thead th,table thead th{ font-family: var(--fb); text-transform: uppercase; letter-spacing: .06em; font-size: .72rem; color: var(--mute); border-color: var(--line) !important; }
.table td,.table th,table td,table th{ border-color: var(--line) !important; }
.table tbody tr:hover{ background: var(--lime-06); }
.leaderboards-table .username-cell,.table .fw-bold{ color: var(--ink); }
td.text-end,.gd-value,.amt,.balance{ font-family: var(--fm); color: var(--gold); font-variant-numeric: tabular-nums; }

/* ---- badges / pills ---- */
.badge{ font-weight: 600; letter-spacing: .02em; border-radius: 999px; }
.badge.bg-primary,.badge-primary{ background: var(--lime-10) !important; color: var(--lime-2) !important; border: 1px solid var(--lime-border); }

/* ---- alerts ---- */
.alert{ border-radius: 11px; border: 1px solid var(--line); }
.alert-warning{ background: var(--gold-10); border-color: var(--gold-30,rgba(214,163,64,.32)); color: var(--gold-2); }

/* ---- breadcrumb / pagination ---- */
.breadcrumb{ font-size: .82rem; }
.breadcrumb a{ color: var(--mute); }
.breadcrumb a:hover{ color: var(--lime); }
.page-link,.pagination a,.pagination span{ background: var(--surface) !important; border: 1px solid var(--line) !important; color: var(--dim) !important; border-radius: 8px !important; }
.page-item.active .page-link,.pagination .active{ background: var(--lime) !important; color: #06140a !important; border-color: var(--lime) !important; }

/* ---- profile offcanvas ---- */
.profile-offcanvas,.offcanvas{ background: var(--surface) !important; border-left: 1px solid var(--line); }
.profile-offcanvas-item{ color: var(--dim); border-radius: 10px; transition: background .2s, color .2s; }
.profile-offcanvas-item:hover{ background: var(--lime-06); color: var(--lime); }
.profile-offcanvas-balance-amount{ font-family: var(--fm); color: var(--gold); }
.profile-offcanvas-name{ font-family: var(--fd); }
/* profil portalı — cüzdan hero + bölüm etiketleri */
.profile-offcanvas-wallet{ display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; padding: 15px 18px; border-radius: 14px; background: linear-gradient(135deg, var(--lime-10), var(--surface-2)); border: 1px solid var(--lime-border); text-decoration: none; transition: border-color .2s, transform .2s; }
.profile-offcanvas-wallet:hover{ border-color: var(--lime); transform: translateY(-1px); }
.profile-offcanvas-wallet .pow-info{ display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.profile-offcanvas-wallet .pow-label{ display: flex; align-items: center; gap: 6px; font-size: .72rem; text-transform: uppercase; letter-spacing: .09em; color: var(--mute); }
.profile-offcanvas-wallet .pow-amount{ font-family: var(--fm); font-size: 1.5rem; font-weight: 600; color: var(--gold); line-height: 1; }
.profile-offcanvas-wallet .pow-topup{ flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; padding: 9px 14px; border-radius: 10px; background: var(--lime); color: #06140a; font-family: var(--fb); font-weight: 600; font-size: .82rem; white-space: nowrap; }
.profile-offcanvas-section-label{ padding: 14px 6px 6px; font-size: .68rem; text-transform: uppercase; letter-spacing: .11em; color: var(--mute); }
.offcanvas-body > .profile-offcanvas-menu > .profile-offcanvas-section-label:first-child{ padding-top: 2px; }
.nav-item-dropdown-link{ display: flex; align-items: center; gap: 9px; }
.nav-item-dropdown-link i{ width: 16px; text-align: center; color: var(--mute); font-size: .85em; }
.nav-item-dropdown-link.active,.nav-item-dropdown-link.active i{ color: var(--lime); }
.mobile-nav-item{ color: var(--dim); }
.mobile-nav-item:hover,.mobile-nav-item.active{ color: var(--lime); }

/* ---- modals ---- */
.modal-content{ background: var(--surface) !important; border: 1px solid var(--line) !important; border-radius: 14px; }
.modal-title{ font-family: var(--fd); }
.language-item,.currency-item{ border: 1px solid var(--line); border-radius: 10px; color: var(--dim); }
.language-item.active,.currency-item.active,.language-item:hover,.currency-item:hover{ border-color: var(--lime-border); color: var(--lime); }

/* ---- footer ---- */
.footer{ border-top: 1px solid var(--line); background: var(--bg); }
.footer-nav-group h3{ font-family: var(--fb); text-transform: uppercase; letter-spacing: .1em; font-size: .7rem; color: var(--mute); }
.footer-nav-group a{ color: var(--dim); }
.footer-nav-group a:hover{ color: var(--lime); }
.footer-social-link{ width: 38px; height: 38px; border: 1px solid var(--line); border-radius: 10px; color: var(--dim); display: inline-flex; align-items: center; justify-content: center; transition: .2s; }
.footer-social-link:hover{ color: var(--lime); border-color: var(--lime-border); transform: translateY(-2px); }
.footer-setting-btn{ background: var(--surface); border: 1px solid var(--line); border-radius: 9px; color: var(--dim); }
.brand-x-divider{ color: var(--mute) !important; }
.lime-brand-box p strong{ color: var(--gold); }

/* ==========================================================================
   HOME LANDING SECTIONS
   ========================================================================== */
.limerp-wrap{ max-width: 1200px; margin: 0 auto; padding: 0 clamp(18px,4vw,48px); }
.limerp-sec{ position: relative; padding: clamp(72px,11vh,128px) 0; z-index: 2; }
.limerp-head{ max-width: 660px; margin-bottom: 44px; }
.limerp-head h2{ font-size: clamp(1.9rem,4.6vw,3.2rem); }
.limerp-head p{ color: var(--dim); margin-top: 14px; max-width: 56ch; }
.ghost-word{ position: absolute; top: 8px; left: 50%; transform: translateX(-50%); font-family: var(--fd); font-weight: 700; font-size: clamp(4rem,14vw,11rem); letter-spacing: .06em; color: transparent; -webkit-text-stroke: 1px rgba(238,243,238,.045); text-transform: uppercase; pointer-events: none; user-select: none; white-space: nowrap; z-index: 0; }
[data-reveal]{ opacity: 0; transform: translateY(30px); transition: opacity .8s var(--ease), transform .8s var(--ease); }
[data-reveal].in{ opacity: 1; transform: none; }

/* hero */
.hero-grid{ display: grid; grid-template-columns: 1.15fr .85fr; gap: 44px; align-items: center; width: 100%; position: relative; z-index: 1; }
.hero-cta{ display: flex; gap: 14px; flex-wrap: wrap; margin-top: 28px; }
.hero-meta{ display: flex; gap: 22px; flex-wrap: wrap; margin-top: 26px; font-size: .68rem; letter-spacing: .14em; color: var(--mute); text-transform: uppercase; }
.hero-meta span{ display: flex; align-items: center; gap: 8px; }
.hero-meta i{ width: 5px; height: 5px; border-radius: 50%; background: var(--gold); }

/* ticker */
.limerp-ticker{ display: flex; align-items: center; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--bg-2); overflow: hidden; position: relative; z-index: 2; }
.limerp-ticker .tag{ display: inline-flex; align-items: center; gap: 8px; padding: 12px 18px; font-size: .64rem; letter-spacing: .2em; color: var(--lime-2); border-right: 1px solid var(--line); white-space: nowrap; text-transform: uppercase; background: var(--bg-2); z-index: 2; }
.limerp-ticker .track{ display: flex; white-space: nowrap; width: max-content; padding: 12px 0; animation: limerp-scroll 38s linear infinite; }
.limerp-ticker .item{ display: flex; align-items: center; gap: 9px; margin-right: 44px; font-size: .84rem; color: var(--dim); }
.limerp-ticker .item i{ width: 5px; height: 5px; border-radius: 50%; background: var(--lime); }
.limerp-ticker .item em{ font-style: normal; font-family: var(--fm); color: var(--gold); }
@keyframes limerp-scroll{ to{ transform: translateX(-50%); } }

/* eco */
.eco-grid{ display: grid; grid-template-columns: 1.1fr .9fr; gap: 44px; align-items: start; position: relative; z-index: 1; }
.podium{ display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; align-items: end; }
.pod{ background: var(--surface); border: 1px solid var(--line); border-radius: 13px; padding: 20px 12px 16px; text-align: center; position: relative; }
.pod .medal{ width: 38px; height: 38px; margin: 0 auto 10px; border-radius: 50%; display: grid; place-items: center; font-family: var(--fd); font-size: 1.05rem; color: #0b1408; }
.pod-1{ border-color: var(--gold-30,rgba(214,163,64,.32)); background: linear-gradient(180deg,var(--gold-10),var(--surface)); box-shadow: 0 -10px 44px -18px var(--gold); padding-top: 30px; }
.pod-1 .medal{ background: linear-gradient(145deg,var(--gold-2),var(--gold)); }
.pod-2 .medal{ background: linear-gradient(145deg,#cdd3d0,#8b938f); }
.pod-3 .medal{ background: linear-gradient(145deg,#c98b52,#9a6531); }
.pod .crown{ position: absolute; top: -15px; left: 50%; transform: translateX(-50%); width: 26px; height: 26px; color: var(--gold); }
.pod .nm{ font-size: .88rem; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pod .amt{ font-family: var(--fm); font-size: 1rem; color: var(--gold); margin-top: 4px; }
.pod .tag{ font-size: .6rem; letter-spacing: .14em; text-transform: uppercase; color: var(--mute); margin-top: 5px; }
.rich-list{ margin-top: 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); overflow: hidden; }
.rrow{ display: flex; align-items: center; gap: 13px; padding: 12px 18px; border-bottom: 1px solid var(--line); font-size: .92rem; }
.rrow:last-child{ border-bottom: none; }
.rrow .rk{ font-family: var(--fm); color: var(--mute); width: 20px; font-size: .8rem; }
.rrow .nm{ flex: 1; color: var(--dim); }
.rrow .amt{ font-family: var(--fm); color: var(--gold); font-size: .88rem; }
.rrow.you{ background: var(--lime-06); }
.rrow.you .nm{ color: var(--ink); }
.rrow .sen{ font-size: .6rem; letter-spacing: .12em; text-transform: uppercase; color: var(--lime); border: 1px solid var(--lime-border); border-radius: 99px; padding: 2px 9px; }
.eco-note{ margin-top: 14px; font-family: var(--fm); font-size: .74rem; color: var(--mute); }
.char-label{ font-size: .66rem; letter-spacing: .18em; text-transform: uppercase; color: var(--mute); margin-bottom: 12px; }
.char{ position: relative; background: linear-gradient(170deg,var(--surface-2),var(--surface)); border: 1px solid var(--line); border-radius: 16px; padding: 24px; overflow: hidden; box-shadow: 0 30px 80px -30px rgba(0,0,0,.75); }
.char .ck{ position: absolute; top: 0; left: 22px; right: 22px; height: 1px; background: linear-gradient(90deg,transparent,var(--lime-border),transparent); }
.char-top{ display: flex; align-items: center; gap: 15px; margin-bottom: 18px; }
.char-ava{ width: 58px; height: 58px; flex: 0 0 auto; border-radius: 50%; padding: 2px; background: conic-gradient(from 210deg,var(--lime),var(--gold),var(--lime)); position: relative; }
.char-ava .inn{ position: absolute; inset: 3px; border-radius: 50%; background: var(--surface); display: grid; place-items: center; color: var(--dim); }
.char-ava svg{ width: 26px; height: 26px; }
.char-id .name{ font-family: var(--fd); font-size: 1.5rem; text-transform: uppercase; }
.char-pills{ display: flex; gap: 7px; flex-wrap: wrap; margin-top: 6px; }
.pill{ font-size: .66rem; padding: 4px 11px; border-radius: 999px; border: 1px solid var(--line); color: var(--mute); }
.pill.job{ background: var(--lime-10); color: var(--lime-2); border-color: var(--lime-border); }
.char-stats{ display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }
.cstat{ background: rgba(7,10,9,.55); border: 1px solid var(--line); border-radius: 10px; padding: 12px 13px; }
.cstat .k{ display: block; font-size: .62rem; text-transform: uppercase; letter-spacing: .08em; color: var(--mute); }
.cstat .v{ font-family: var(--fm); font-size: 1.05rem; color: var(--gold); margin-top: 4px; display: block; }
.char-foot{ display: flex; align-items: center; gap: 9px; margin-top: 16px; padding-top: 14px; border-top: 1px dashed var(--line); font-size: .76rem; color: var(--mute); }
.char-foot .dot{ width: 7px; height: 7px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 3px var(--lime-10); }

/* trust */
.trust{ border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--bg-2); }
.trust-grid{ display: grid; grid-template-columns: repeat(4,1fr); gap: 0; }
.tcard{ display: flex; gap: 14px; align-items: flex-start; padding: 26px 22px; border-right: 1px solid var(--line); }
.tcard:last-child{ border-right: none; }
.tcard .ic{ width: 38px; height: 38px; flex: 0 0 auto; border-radius: 9px; background: var(--lime-10); border: 1px solid var(--lime-border); display: grid; place-items: center; color: var(--lime); }
.tcard .ic svg{ width: 19px; height: 19px; }
.tcard h3{ font-family: var(--fb); text-transform: none; letter-spacing: 0; font-size: .95rem; font-weight: 700; }
.tcard p{ font-size: .8rem; color: var(--mute); margin-top: 3px; }

/* departmanlar bento */
.deptb{ display: grid; margin-top: 4px; grid-template-columns: repeat(12,1fr); gap: 12px; position: relative; z-index: 1; }
.dcard{ position: relative; min-height: 200px; overflow: hidden; padding: 26px; border: 1px solid var(--line); background: var(--surface); transition: transform .3s var(--ease), border-color .3s, background .3s; }
.dcard:nth-child(1){ grid-column: span 5; } .dcard:nth-child(2){ grid-column: span 3; } .dcard:nth-child(3){ grid-column: span 4; }
.dcard:nth-child(4){ grid-column: span 4; } .dcard:nth-child(5){ grid-column: span 5; } .dcard:nth-child(6){ grid-column: span 3; }
.dcard::after{ position: absolute; right: -42px; bottom: -48px; color: rgba(238,243,238,.028); content: attr(data-code); font-family: var(--fd); font-size: 8.5rem; font-weight: 700; line-height: 1; pointer-events: none; }
.dcard:hover{ z-index: 1; border-color: var(--lime-border); background: var(--surface-2); transform: translateY(-7px); }
.dtop{ display: flex; justify-content: space-between; align-items: center; }
.didx{ color: var(--lime); font-family: var(--fm); font-size: .61rem; letter-spacing: .13em; }
.dcard h3{ margin: 42px 0 8px; font-size: 1.55rem; }
.dcard p{ max-width: 320px; color: var(--dim); font-size: .83rem; }
.dep-tag{ font-size: .6rem; letter-spacing: .14em; text-transform: uppercase; color: var(--mute); border: 1px solid var(--line); border-radius: 99px; padding: 3px 10px; }
.dep-tag.illegal{ color: var(--mag); border-color: rgba(255,61,139,.4); }

/* neden */
.why-grid{ display: grid; grid-template-columns: repeat(4,1fr); gap: 15px; position: relative; z-index: 1; }
.why{ position: relative; border: 1px solid var(--line); border-radius: 13px; background: var(--surface); padding: 26px 22px; overflow: hidden; }
.why-num{ position: absolute; top: 14px; right: 18px; font-family: var(--fd); font-size: 2.2rem; color: transparent; -webkit-text-stroke: 1px rgba(238,243,238,.12); }
.why-ic{ width: 44px; height: 44px; border-radius: 11px; background: var(--lime-10); border: 1px solid var(--lime-border); display: grid; place-items: center; color: var(--lime); margin-bottom: 16px; }
.why-ic svg{ width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.why h3{ font-family: var(--fb); text-transform: none; letter-spacing: 0; font-size: 1.02rem; font-weight: 700; margin-bottom: 7px; }
.why p{ font-size: .84rem; color: var(--mute); }

/* store */
.store-head{ display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; flex-wrap: wrap; margin-bottom: 40px; }
.store-live{ display: inline-flex; align-items: center; gap: 8px; font-size: .66rem; letter-spacing: .16em; text-transform: uppercase; color: var(--lime-2); border: 1px solid var(--lime-border); border-radius: 99px; padding: 6px 13px; }
.store-grid{ display: grid; grid-template-columns: 1.25fr 1fr 1fr; gap: 15px; position: relative; z-index: 1; }
.prod-feat{ position: relative; border: 1px solid var(--gold-30,rgba(214,163,64,.32)); border-radius: 16px; overflow: hidden; min-height: 380px; display: flex; align-items: flex-end; isolation: isolate; transition: transform .3s var(--ease); }
.prod-feat:hover{ transform: translateY(-5px); }
.prod-feat .ph{ position: absolute; inset: 0; z-index: -2; background-size: cover; background-position: center; transition: transform .6s var(--ease); }
.prod-feat:hover .ph{ transform: scale(1.05); }
.prod-feat .sc{ position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg,rgba(7,10,9,.1),rgba(7,10,9,.42) 46%,rgba(7,10,9,.97)),linear-gradient(135deg,rgba(46,230,214,.12),transparent 55%,rgba(255,61,139,.12)); }
.ribbon{ position: absolute; top: 16px; left: -34px; transform: rotate(-38deg); background: var(--lime); color: #0b1408; font-size: .62rem; font-weight: 700; letter-spacing: .16em; padding: 6px 42px; z-index: 3; font-family: var(--fd); }
.prod-feat-in{ padding: 24px; }
.badges{ display: flex; gap: 7px; flex-wrap: wrap; margin-bottom: 12px; }
.pbadge{ font-size: .62rem; letter-spacing: .1em; text-transform: uppercase; color: var(--dim); border: 1px solid var(--line-2); border-radius: 99px; padding: 4px 10px; backdrop-filter: blur(6px); background: rgba(7,10,9,.4); }
.pbadge.lm{ color: var(--lime-2); border-color: var(--lime-border); background: var(--lime-10); }
.prod-feat h3{ font-size: 1.7rem; margin-bottom: 6px; }
.prod-feat .micro{ font-size: .8rem; color: var(--dim); margin-bottom: 18px; }
.feat-buy{ display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.pricebox .old{ font-family: var(--fm); font-size: .82rem; color: var(--mute); text-decoration: line-through; }
.pricebox .now{ font-family: var(--fm); font-size: 1.7rem; color: var(--gold); }
.prod{ background: var(--surface); border: 1px solid var(--line); border-radius: 16px; padding: 24px; display: flex; flex-direction: column; transition: transform .3s var(--ease), border-color .3s; }
.prod:hover{ transform: translateY(-5px); border-color: var(--lime-border); }
.prod-top{ display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 16px; }
.prod h3{ font-size: 1.2rem; }
.prod ul{ list-style: none; display: flex; flex-direction: column; gap: 10px; margin-bottom: 20px; padding: 0; }
.prod li{ display: flex; gap: 10px; align-items: center; font-size: .86rem; color: var(--dim); }
.prod li svg{ width: 15px; height: 15px; color: var(--lime); flex: 0 0 auto; }
.prod-buy{ margin-top: auto; display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.prod-buy .now{ font-family: var(--fm); font-size: 1.3rem; color: var(--gold); }
.buys{ display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin-top: 22px; border: 1px dashed var(--line); border-radius: 12px; padding: 14px 18px; }
.buys-label{ display: inline-flex; align-items: center; gap: 9px; font-size: .64rem; letter-spacing: .16em; text-transform: uppercase; color: var(--lime-2); white-space: nowrap; }
.buys-items{ display: flex; gap: 22px; flex-wrap: wrap; }
.buy{ font-size: .8rem; color: var(--dim); }
.buy .at{ color: var(--lime-2); font-family: var(--fm); }
.buy .t{ color: var(--mute); font-size: .72rem; }

/* tiers */
.topup-grid{ display: grid; grid-template-columns: repeat(3,1fr); gap: 15px; position: relative; z-index: 1; }
.tier{ position: relative; background: var(--surface); border: 1px solid var(--line); border-radius: 15px; padding: 28px 24px; transition: transform .3s var(--ease), border-color .3s; }
.tier:hover{ transform: translateY(-5px); }
.tier.best{ border-color: var(--lime-border); background: linear-gradient(170deg,var(--lime-06),var(--surface)); box-shadow: 0 24px 60px -28px var(--lime-shadow); }
.tier-best{ position: absolute; top: -11px; left: 22px; font-size: .6rem; letter-spacing: .14em; text-transform: uppercase; color: #0b1408; background: var(--lime); border-radius: 99px; padding: 4px 12px; font-weight: 700; }
.tier-amt{ font-family: var(--fm); font-size: 2.1rem; color: var(--ink); }
.tier-amt .cur{ color: var(--mute); font-size: 1.2rem; }
.tier-bonus{ font-family: var(--fd); font-size: 1.5rem; color: var(--gold); margin: 8px 0 14px; text-transform: uppercase; }
.tier-bar{ height: 6px; border-radius: 99px; background: rgba(255,255,255,.06); overflow: hidden; }
.tier-bar i{ display: block; height: 100%; width: 0; border-radius: 99px; background: linear-gradient(90deg,var(--gold),var(--lime)); transition: width 1.2s var(--ease) .3s; }
.in .tier-bar i.w33{ width: 33%; } .in .tier-bar i.w66{ width: 66%; } .in .tier-bar i.w100{ width: 100%; }
.tier-note{ font-size: .74rem; color: var(--mute); margin-top: 12px; }

/* gaming night */
.gn{ position: relative; isolation: isolate; overflow: hidden; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.gn-bg{ position: absolute; inset: 0; z-index: -2; background-size: cover; background-position: center; opacity: .13; }
.gn-scrim{ position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg,var(--bg) 6%,rgba(7,10,9,.7) 50%,var(--bg) 94%); }
.gn-inner{ display: grid; grid-template-columns: minmax(0,.88fr) minmax(min(420px,100%),1.12fr); gap: 7vw; align-items: center; }
.event-list{ display: flex; flex-direction: column; }
.event-item{ display: flex; align-items: center; gap: 16px; padding: 19px 0; border-bottom: 1px solid var(--line); transition: padding .25s, background .25s; }
.event-item:last-child{ border-bottom: 0; }
.event-item:hover{ padding-left: 13px; background: rgba(8,11,10,.24); }
.event-signal{ width: 13px; height: 1px; background: var(--lime); box-shadow: 7px 0 0 var(--lime-10); flex: 0 0 auto; }
.event-name{ color: var(--ink); font-family: var(--fd); font-size: clamp(1.25rem,2.2vw,1.9rem); text-transform: uppercase; }
.event-time{ color: var(--gold); font-family: var(--fm); font-size: .7rem; white-space: nowrap; margin-left: auto; }

/* steps */
.steps2{ display: grid; margin-top: 52px; grid-template-columns: repeat(3,1fr); border-top: 1px solid var(--line-2); position: relative; z-index: 1; }
.step2{ padding: 30px 26px 36px; border-right: 1px solid var(--line); transition: background .3s, transform .3s var(--ease); }
.step2:last-child{ border-right: 0; }
.step2:hover{ background: rgba(18,24,26,.84); transform: translateY(-6px); }
.step2 .no{ color: var(--lime); font-family: var(--fm); font-size: .73rem; letter-spacing: .12em; }
.step2 h3{ font-size: 1.3rem; margin: 40px 0 8px; }
.step2 p{ font-size: .86rem; color: var(--dim); max-width: 30ch; }
.onb{ position: relative; isolation: isolate; overflow: hidden; }
.onb .obg{ position: absolute; inset: 0; z-index: -3; background-size: cover; background-position: center; will-change: transform; }
.onb .oscrim{ position: absolute; inset: 0; z-index: -2; background: linear-gradient(180deg,var(--bg) 0%,rgba(7,10,9,.82) 22%,rgba(7,10,9,.86) 78%,var(--bg) 100%),linear-gradient(135deg,rgba(46,230,214,.1),transparent 50%,rgba(255,61,139,.12)); }

/* discord band */
.disc{ position: relative; isolation: isolate; overflow: hidden; }
.disc .dbg{ position: absolute; inset: 0; z-index: -3; background-size: cover; background-position: center; will-change: transform; }
.disc .dscrim{ position: absolute; inset: 0; z-index: -2; background: linear-gradient(90deg,rgba(7,10,9,.94) 18%,rgba(7,10,9,.55) 65%,rgba(7,10,9,.85)),radial-gradient(75% 100% at 0 55%,var(--lime-10),transparent 55%),linear-gradient(135deg,rgba(46,230,214,.1),transparent 55%,rgba(255,61,139,.14)); }
.disc h2{ font-size: clamp(2rem,4.6vw,3.3rem); max-width: 15ch; margin: 14px 0 18px; }
.disc h2 em{ font-style: normal; color: var(--lime); }
.disc .members{ display: flex; align-items: center; gap: 10px; color: var(--dim); font-size: .92rem; margin-bottom: 24px; }
.disc .members .mono{ color: var(--lime); }

/* intro (home-only) */
.limerp-intro{ position: fixed; inset: 0; z-index: 100; background: linear-gradient(180deg,rgba(5,7,6,.72),rgba(5,7,6,.88)), var(--intro-bg,#050706); background-size: cover; background-position: center; display: flex; align-items: center; justify-content: center; transition: opacity .7s var(--ease), visibility .7s; }
.limerp-intro.done{ opacity: 0; visibility: hidden; pointer-events: none; }
.limerp-intro .bar{ position: absolute; left: 0; right: 0; height: 12vh; background: #000; z-index: 2; transition: transform 1s var(--ease) .2s; }
.limerp-intro .bar.t{ top: 0; } .limerp-intro .bar.b{ bottom: 0; }
.limerp-intro.open .bar.t{ transform: translateY(-100%); } .limerp-intro.open .bar.b{ transform: translateY(100%); }
.intro-logo{ text-align: center; position: relative; z-index: 1; }
.intro-logo .word{ font-family: var(--fd); font-weight: 700; font-size: clamp(3rem,12vw,7.5rem); letter-spacing: .04em; color: var(--ink); text-transform: uppercase; }
.intro-logo .word .rp{ color: var(--lime); text-shadow: 0 0 18px var(--lime-20), 0 0 60px var(--lime-shadow); }
.intro-logo .sub{ margin-top: 10px; font-family: var(--fm); font-size: .72rem; letter-spacing: .5em; color: var(--mute); text-transform: uppercase; }
.intro-skip{ position: absolute; bottom: 5vh; left: 50%; transform: translateX(-50%); font-size: .66rem; letter-spacing: .2em; text-transform: uppercase; color: var(--mute); z-index: 1; }
.limerp-progress{ position: fixed; top: 0; left: 0; height: 2px; width: 0; background: linear-gradient(90deg,var(--lime),var(--gold)); z-index: 60; box-shadow: 0 0 12px var(--lime-shadow); }

/* ---- responsive ---- */
@media(max-width:980px){
  .hero-grid{ grid-template-columns: 1fr; }
  .eco-grid{ grid-template-columns: 1fr; }
  .trust-grid{ grid-template-columns: 1fr 1fr; }
  .tcard{ border-right: none; border-bottom: 1px solid var(--line); }
  .deptb .dcard{ grid-column: span 6 !important; }
  .why-grid{ grid-template-columns: 1fr 1fr; }
  .store-grid{ grid-template-columns: 1fr; }
  .topup-grid{ grid-template-columns: 1fr; }
  .gn-inner{ grid-template-columns: 1fr; gap: 26px; }
  .steps2{ grid-template-columns: 1fr; }
  .step2{ border-right: 0; border-bottom: 1px solid var(--line); }
  .step2:last-child{ border-bottom: 0; }
}
@media(max-width:560px){
  .trust-grid,.why-grid{ grid-template-columns: 1fr; }
  .deptb .dcard{ grid-column: span 12 !important; min-height: 170px; }
  .char-stats,.stat-grid{ grid-template-columns: 1fr 1fr; }
}
@media (prefers-reduced-motion: reduce){
  *{ animation: none !important; }
  [data-reveal]{ opacity: 1 !important; transform: none !important; }
  .limerp-intro{ display: none !important; }
  #limerp-rain{ display: none !important; }
  .in .tier-bar i.w33{ width: 33%; } .in .tier-bar i.w66{ width: 66%; } .in .tier-bar i.w100{ width: 100%; }
}

/* ==========================================================================
   HERO ATMOSPHERE — hero lives inside .header (home whitelist), not .limerp-hero.
   main.php emits a home-only inline .header{position:relative;overflow:hidden;
   min-height:100vh}; the position:relative below is a site-wide floor so the rain
   canvas + grade anchor to .header regardless of that inline block.
   ========================================================================== */
.header{ position: relative; }
.header-top{ position: relative; z-index: 5; }
.header .header-container{ position: relative; z-index: 2; }
#limerp-rain{ position: absolute; inset: 0; z-index: 0; pointer-events: none; opacity: .5; }
.hgrade{ position: absolute; inset: 0; z-index: 0; pointer-events: none; mix-blend-mode: soft-light; background: linear-gradient(135deg,rgba(46,230,214,.12),transparent 52%,rgba(255,61,139,.18)); }
.header .hero-grid{ padding: 8vh 0 6vh; }
.header-title{ color: var(--ink); text-shadow: 0 2px 34px rgba(0,0,0,.55); }
.header-description{ text-shadow: 0 1px 20px rgba(0,0,0,.5); }

/* secondary "Details" CTA on store cards */
.btn-tint{ display: inline-flex; align-items: center; gap: 8px; font-family: var(--fd); text-transform: uppercase; letter-spacing: .05em; font-weight: 600; font-size: .8rem; padding: 9px 16px; border-radius: 6px; background: var(--lime-10); color: var(--lime-2); border: 1px solid var(--lime-border); transition: background .2s, color .2s, transform .2s var(--ease); }
.btn-tint:hover{ background: var(--lime-06); color: var(--lime); transform: translateY(-2px); }

/* inline lime accent inside landing headings (hero uses .header-title .g with display:block) */
.limerp-head h2 .g{ color: var(--lime); }
.topup-cta{ margin-top: 28px; text-align: center; }

/* ==========================================================================
   HARMAN GLITCH / NEON — flicker on hero headline + intro wordmark, char scanline
   ========================================================================== */
@keyframes limerp-neon{0%,100%{opacity:1}92%{opacity:1}93%{opacity:.6}94%{opacity:1}97%{opacity:.75}98%{opacity:1}}
.header-title .g{ animation: limerp-neon 4.5s linear infinite; }
@keyframes limerp-flick{0%{opacity:0}6%{opacity:1}9%{opacity:.2}12%{opacity:1}18%{opacity:.35}21%,100%{opacity:1}}
.limerp-intro .word{ animation: limerp-flick 2.1s steps(1) both; }
.char{ position: relative; }
.char .scanl{ position:absolute; left:0; right:0; height:44%; top:-46%; background:linear-gradient(180deg,transparent,rgba(138,224,72,.06),transparent); animation:limerp-scan 5.5s linear infinite; pointer-events:none; z-index:0; }
@keyframes limerp-scan{ to{ top:110%; } }
@media (prefers-reduced-motion: reduce){ .header-title .g,.limerp-intro .word,.char .scanl{ animation:none !important; } }

/* ==========================================================================
   LimeRP WORDMARK (harman) — replaces the default Leaderos logo image in nav + footer
   ========================================================================== */
.limerp-logo{ display: inline-flex; align-items: center; gap: 11px; font-family: var(--fd); text-transform: uppercase; color: var(--ink); line-height: 1; }
.limerp-logo .mark{ width: 34px; height: 34px; border-radius: 8px; background: linear-gradient(145deg,var(--lime),var(--gold)); display: grid; place-items: center; transform: rotate(-4deg); box-shadow: 0 6px 18px -6px var(--lime-shadow); flex: 0 0 auto; }
.limerp-logo .mark span{ font-size: 1.05rem; font-weight: 700; color: #0b1408; transform: rotate(4deg); }
.limerp-logo b{ font-size: 1.2rem; font-weight: 700; letter-spacing: .02em; }
.limerp-logo b i{ font-style: normal; color: var(--lime); }
.footer-logo-mark{ margin-bottom: 10px; }
/* resim logo (headerLogo) — navbar + footer */
.header-logo-link,.footer-logo-link{ display: inline-flex; align-items: center; }
.header-logo{ height: 40px; width: auto; max-width: 200px; object-fit: contain; display: block; }
.limerp-foot .footer-logo{ height: 46px; width: auto; max-width: 210px; object-fit: contain; display: block; }
.limerp-foot .cobrand .cobrand-logo{ height: 30px; }

/* ==========================================================================
   TYPOGRAPHY LOCK — force harman fonts over base Poppins (icons excluded)
   ========================================================================== */
body, body :not(i):not(svg):not(path):not(use):not([class^="fa-"]):not([class*=" fa-"]){ font-family: var(--fb) !important; }
body h1, body h2, body h3, body h4, body h5, body h6,
body .header-title, body .section-title, body .widget-title, body .limerp-head h2,
body .section-1-title, body .section-2-title, body .section-3-title, body .section-4-title, body .section-5-title, body .section-6-title, body .section-7-title,
body .event-name, body .tier-bonus, body .char-id .name, body .pulse-head .t, body .limerp-logo b,
body .dcard h3, body .step2 h3, body .tcard h3, body .why h3, body .prod h3, body .prod-feat h3, body .disc h2,
body .cobrand .lg, body .foot-col h5, body .pod .medal, body .intro-logo .word, body .limerp-intro .word{ font-family: var(--fd) !important; }
body .mono, body .count, body [data-countup], body .amt, body .tier-amt, body .stat .n, body .cstat .v, body .pod .amt, body .rrow .amt, body .pricebox .now, body .pricebox .old, body .buy .at, body .event-time, body .header-stat-number, body .profile-offcanvas-balance-amount{ font-family: var(--fm) !important; }

/* ==========================================================================
   NEON GLOW — lime/gold elements glow like harman
   ========================================================================== */
.btn-gradient, .btn-lime, .btn-primary{ box-shadow: 0 8px 30px -8px var(--lime-shadow), 0 0 22px -6px var(--lime-shadow), inset 0 1px 0 rgba(255,255,255,.35); }
.pricebox .now, .prod-buy .now, .tier-amt{ text-shadow: 0 0 22px var(--gold-10); }
.stat.acc .n, .disc .members .mono, .header-stat-number{ text-shadow: 0 0 16px var(--lime-20); }
.pulse-panel .bar i, .tier-bar i{ box-shadow: 0 0 12px var(--lime-shadow); }
.event-signal{ box-shadow: 7px 0 0 var(--lime-10), 0 0 10px var(--lime-shadow); }
.live-dot{ box-shadow: 0 0 0 4px var(--lime-10), 0 0 12px var(--lime-shadow); }
.canli, .store-live, .header-tag, .categories-section-nav-balance{ box-shadow: 0 0 22px -9px var(--lime-shadow); }
.pod-1{ box-shadow: 0 -10px 44px -18px var(--gold), 0 0 34px -12px var(--gold-10); }
.limerp-logo .mark{ box-shadow: 0 6px 18px -6px var(--lime-shadow), 0 0 16px -4px var(--lime-shadow); }
.tcard .ic, .why-ic{ box-shadow: 0 0 20px -8px var(--lime-shadow); }

/* ==========================================================================
   GLITCH — stronger site-wide grain/scanline + chromatic flicker on hero title
   ========================================================================== */
.limerp-grain{ opacity: .04; }
.limerp-vhs{ opacity: .028; }
@keyframes limerp-glitch{
  0%,90%,100%{ text-shadow: 0 0 24px var(--lime-border), 0 0 72px var(--lime-20); clip-path: none; }
  91%{ text-shadow: -2px 0 var(--mag), 2px 0 var(--cyn), 0 0 24px var(--lime-border); transform: translate(1px,0); }
  93%{ text-shadow: 2px 0 var(--mag), -2px 0 var(--cyn), 0 0 24px var(--lime-border); transform: translate(-1px,0); }
  95%{ text-shadow: 0 0 24px var(--lime-border); transform: none; }
  97%{ text-shadow: -1px 0 var(--mag), 1px 0 var(--cyn); transform: translate(1px,0); }
}
.header-title .g{ animation: limerp-neon 4.5s linear infinite, limerp-glitch 5.5s steps(1) infinite; text-shadow: 0 0 24px var(--lime-border), 0 0 72px var(--lime-20); }
@media (prefers-reduced-motion: reduce){ .header-title .g{ animation: none !important; } }

/* ==========================================================================
   FOOTER — harman .foot structure (limerp-foot wrapper on the real footer)
   ========================================================================== */
.limerp-foot{ border-top: 1px solid var(--line); background: var(--bg); padding: 56px 0 40px; }
.limerp-foot .cobrand{ display: flex; align-items: center; gap: 20px; padding: 22px 26px; border: 1px solid var(--line); border-radius: 15px; background: var(--surface); flex-wrap: wrap; margin-bottom: 44px; }
.limerp-foot .cobrand .lg{ font-family: var(--fd); font-size: 1.1rem; text-transform: uppercase; display: inline-flex; align-items: center; gap: 9px; color: var(--ink); }
.limerp-foot .cobrand .lg b i{ font-style: normal; color: var(--lime); }
.limerp-foot .cobrand .lg.net b i{ color: var(--gold); }
.limerp-foot .cobrand .x{ font-family: var(--fd); color: var(--mute); font-size: 1.25rem; }
.limerp-foot .cobrand .sub{ margin-left: auto; font-size: .72rem; color: var(--mute); }
.limerp-foot .foot-top{ display: flex; gap: 40px; flex-wrap: wrap; justify-content: space-between; margin-bottom: 8px; }
.limerp-foot .foot-brand{ max-width: 340px; }
.limerp-foot .foot-brand p{ color: var(--mute); font-size: .86rem; margin-top: 14px; }
.limerp-foot .foot-cols{ display: flex; gap: 54px; flex-wrap: wrap; }
.limerp-foot .foot-col h5{ font-family: var(--fb); text-transform: uppercase; letter-spacing: .1em; font-size: .68rem; color: var(--mute); margin-bottom: 13px; }
.limerp-foot .foot-col a{ display: block; color: var(--dim); font-size: .88rem; padding: 4px 0; transition: color .2s; }
.limerp-foot .foot-col a:hover{ color: var(--lime); }
.limerp-foot .foot-bottom{ display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; align-items: center; margin-top: 34px; padding-top: 22px; border-top: 1px solid var(--line); font-size: .78rem; color: var(--mute); }
.limerp-foot .foot-actions{ display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.limerp-foot .footer-setting-btn{ background: var(--surface); border: 1px solid var(--line); border-radius: 9px; color: var(--dim); padding: 7px 12px; font-size: .78rem; }
.limerp-foot .socials{ display: flex; gap: 10px; }
.limerp-foot .socials a{ width: 38px; height: 38px; border: 1px solid var(--line); border-radius: 10px; display: grid; place-items: center; color: var(--dim); transition: .2s; }
.limerp-foot .socials a:hover{ color: var(--lime); border-color: var(--lime-border); transform: translateY(-2px); }
.limerp-foot .foot-legal{ margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--line); text-align: center; }
.limerp-foot .foot-legal p{ color: var(--mute); font-size: .78rem; }
.limerp-foot .foot-legal a{ color: var(--dim); }
.limerp-foot .foot-legal a:hover{ color: var(--lime); }
.limerp-foot .foot-legal img{ display: inline-block; vertical-align: middle; opacity: .8; }

/* ==========================================================================
   BACKGROUND MUSIC WIDGET — hidden YouTube player + minimal play/pause pill
   ========================================================================== */
.limerp-music{ position: fixed; left: 18px; bottom: 18px; z-index: 55; display: flex; align-items: center; gap: 11px; max-width: 240px; padding: 7px 16px 7px 7px; background: rgba(16,23,26,.9); border: 1px solid var(--line); border-radius: 999px; backdrop-filter: blur(10px); box-shadow: 0 12px 34px -12px rgba(0,0,0,.7); }
.limerp-music[hidden]{ display: none; }
.limerp-music .lm-toggle{ width: 36px; height: 36px; flex: 0 0 auto; border: 0; border-radius: 50%; background: var(--lime); display: grid; place-items: center; cursor: pointer; box-shadow: 0 0 16px -4px var(--lime-shadow); transition: transform .2s var(--ease); }
.limerp-music .lm-toggle:hover{ transform: scale(1.07); }
.limerp-music .lm-ic{ display: block; width: 0; height: 0; border-style: solid; border-width: 7px 0 7px 12px; border-color: transparent transparent transparent #06140a; margin-left: 3px; }
.limerp-music.playing .lm-ic{ width: 12px; height: 13px; border: 0; border-left: 3.5px solid #06140a; border-right: 3.5px solid #06140a; margin: 0; }
.limerp-music .lm-title{ font-family: var(--fb); font-size: .78rem; color: var(--dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#limerp-music-yt{ position: fixed; right: 0; bottom: 0; width: 200px; height: 120px; opacity: 0; z-index: -1; pointer-events: none; }
@media (max-width: 560px){ .limerp-music{ max-width: 170px; left: 12px; bottom: 12px; } }

/* ==========================================================================
   RESPONSIVE NAV + MOBILE MENU — implements the previously-missing #mobileMenu
   Dünya sayfaları tek "Sunucu ▾" dropdown'da toplandı; üst bar ~6 item ferah aralıkla
   ≥1280px'de sığıyor, altında hamburger offcanvas'a düşer.
   ========================================================================== */
@media (min-width: 1280px){
  .header-mobile-toggle{ display: none !important; }
  .header-nav{ gap: .3rem !important; flex-wrap: nowrap; }
  .header-nav .header-nav-item,
  .header-nav .nav-item-dropdown-btn{ padding: .55rem .9rem !important; font-size: .86rem !important; white-space: nowrap; }
  .header-nav .header-nav-item > i,
  .header-nav .nav-item-dropdown-btn > i:first-child{ margin-right: .42rem !important; }
}
@media (max-width: 1279px){
  .header-nav{ display: none !important; }
  .header-buttons{ display: none !important; }
  .header-mobile-toggle{ display: inline-flex !important; align-items: center; justify-content: center; }
}
.limerp-mobile-menu{ background: var(--surface) !important; border-right: 1px solid var(--line); width: min(86vw, 340px) !important; color: var(--ink); }
.limerp-mobile-menu .offcanvas-header{ border-bottom: 1px solid var(--line); padding: 16px 18px; }
.limerp-mobile-menu .btn-close{ opacity: 1; background: none; border: 1px solid var(--line-2); border-radius: 8px; width: 34px; height: 34px; display: grid; place-items: center; color: var(--ink); box-shadow: none; }
.limerp-mobile-menu .offcanvas-body{ padding: 14px 16px 22px; display: flex; flex-direction: column; overflow-y: auto; }
.limerp-mobile-menu .mobile-nav{ display: flex; flex-direction: column; gap: 2px; }
.limerp-mobile-menu .mobile-nav-item{ display: flex; align-items: center; gap: 12px; padding: 13px 14px; border-radius: 10px; color: var(--dim); font-family: var(--fb); font-weight: 500; font-size: .92rem; transition: background .2s, color .2s; }
.limerp-mobile-menu .mobile-nav-item i:first-child{ width: 18px; text-align: center; color: var(--mute); flex: 0 0 auto; }
.limerp-mobile-menu .mobile-nav-item:hover, .limerp-mobile-menu .mobile-nav-item.active{ background: var(--lime-06); color: var(--lime); }
.limerp-mobile-menu .mobile-nav-item:hover i:first-child, .limerp-mobile-menu .mobile-nav-item.active i:first-child{ color: var(--lime); }
.limerp-mobile-menu .mobile-nav-group{ margin: 4px 0; }
.limerp-mobile-menu .mobile-nav-label{ display: flex; align-items: center; gap: 10px; padding: 12px 14px 4px; font-size: .68rem; text-transform: uppercase; letter-spacing: .1em; color: var(--mute); }
.limerp-mobile-menu .mobile-nav-group .mobile-nav-item{ padding-left: 42px; }
.limerp-mobile-menu .mobile-nav-actions{ display: flex; flex-direction: column; gap: 10px; margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); }
.limerp-mobile-menu .mobile-nav-actions .btn-gradient, .limerp-mobile-menu .mobile-nav-actions .btn-gradient-transparent{ width: 100%; justify-content: center; }
.limerp-mobile-menu .mobile-nav-item .header-cart-count{ margin-left: auto; }
.offcanvas-backdrop.show{ background: rgba(3,5,4,.72); }

/* ==========================================================================
   INNER-PAGE COMPONENTS — noir treatment for shared Bootstrap primitives used
   across the inner pages. Standard Bootstrap contract → inert if a page doesn't
   use a component, noir when it does. Palette-driven.
   ========================================================================== */

/* tabs / pills (account settings, product/detail tabs) */
.nav-tabs{ border-bottom: 1px solid var(--line); gap: 2px; }
.nav-tabs .nav-link{ color: var(--dim); border: 0; border-bottom: 2px solid transparent; border-radius: 0; font-family: var(--fb); font-weight: 500; padding: 11px 16px; background: none; }
.nav-tabs .nav-link:hover{ color: var(--ink); border-bottom-color: var(--line-2); }
.nav-tabs .nav-link.active{ color: var(--lime); background: none; border-color: transparent transparent var(--lime); }
.nav-pills .nav-link{ color: var(--dim); border-radius: 9px; font-weight: 500; }
.nav-pills .nav-link.active{ background: var(--lime-10) !important; color: var(--lime); }

/* list-group */
.list-group{ border-radius: 12px; overflow: hidden; }
.list-group-item{ background: var(--surface) !important; border-color: var(--line) !important; color: var(--dim); }
.list-group-item-action:hover{ background: var(--surface-2) !important; color: var(--ink); }
.list-group-item.active{ background: var(--lime-10) !important; border-color: var(--lime-border) !important; color: var(--lime); }

/* dropdowns (bootstrap) */
.dropdown-menu{ background: var(--surface) !important; border: 1px solid var(--line) !important; border-radius: 11px; box-shadow: 0 20px 50px -20px rgba(0,0,0,.7); }
.dropdown-item{ color: var(--dim); }
.dropdown-item:hover, .dropdown-item:focus{ background: var(--lime-06); color: var(--lime); }
.dropdown-divider{ border-color: var(--line); }

/* accordion (FAQ / help) */
.accordion-item{ background: var(--surface) !important; border: 1px solid var(--line) !important; border-radius: 12px !important; margin-bottom: 10px; overflow: hidden; }
.accordion-button{ background: var(--surface) !important; color: var(--ink) !important; font-family: var(--fb); font-weight: 600; box-shadow: none !important; }
.accordion-button:not(.collapsed){ background: var(--surface-2) !important; color: var(--lime) !important; }
.accordion-button::after{ filter: invert(1) grayscale(1) brightness(1.5); }
.accordion-body{ color: var(--dim); }

/* progress (bootstrap) */
.progress{ background: rgba(255,255,255,.06) !important; border-radius: 99px; height: 8px; }
.progress-bar{ background: linear-gradient(90deg,var(--lime),var(--gold)) !important; }

/* form primitives */
.input-group-text{ background: var(--surface-2) !important; border-color: var(--line) !important; color: var(--dim) !important; }
.form-check-input{ background-color: rgba(7,10,9,.6); border-color: var(--line-2); }
.form-check-input:checked{ background-color: var(--lime); border-color: var(--lime); }
.form-check-input:focus{ border-color: var(--lime-border); box-shadow: 0 0 0 3px var(--lime-06); }
.form-range::-webkit-slider-thumb{ background: var(--lime); }
.form-range::-moz-range-thumb{ background: var(--lime); border: 0; }
.form-text{ color: var(--mute); }

/* tables → responsive scroll frame */
.table-responsive{ border-radius: 12px; border: 1px solid var(--line); }
.table thead th{ background: var(--surface-2) !important; color: var(--mute); }

/* bootstrap button variants → noir system */
.btn-primary, .btn-success{ background: var(--lime) !important; border-color: var(--lime) !important; color: #06140a !important; }
.btn-outline-primary{ border-color: var(--lime-border) !important; color: var(--lime) !important; background: transparent !important; }
.btn-outline-primary:hover{ background: var(--lime) !important; color: #06140a !important; }
.btn-secondary, .btn-light, .btn-outline-secondary{ background: var(--surface-2) !important; border-color: var(--line-2) !important; color: var(--ink) !important; }
.btn-danger{ background: var(--mag) !important; border-color: var(--mag) !important; color: #fff !important; }

/* responsive foundation */
@media (max-width: 991px){ .limerp-sec{ padding: clamp(48px,8vh,80px) 0; } }
@media (max-width: 640px){ .table{ font-size: .85rem; } .limerp-head h2{ font-size: clamp(1.5rem,7vw,2rem); } .store-head{ flex-direction: column; align-items: flex-start; } }

/* ==========================================================================
   INNER-PAGE NOIR FOUNDATION
   Extends the noir layer onto the ~100 inner pages (store, credits, play,
   profile/account, leaderboards, members, characters, staff, shared parts).
   Targets the bespoke class names those pages already emit — no .php edits.
   Reuses pinned tokens only; !important is used ONLY to beat base style.css
   / legacy .profile-section / page-embedded <style> rules that outrank us.
   ========================================================================== */

/* ---- token top-up (brand-derived alphas the base doesn't define) ---- */
:root{
  --gold-30: rgba(214,163,64,.32);
  --mag-08: rgba(255,61,139,.08); --mag-12: rgba(255,61,139,.12); --mag-border: rgba(255,61,139,.3);
  --cyn-08: rgba(46,230,214,.08); --cyn-border: rgba(46,230,214,.3);
}

/* ==========================================================================
   1. SHARED INNER-PAGE HEADER — custom breadcrumb component (70+ pages)
   ========================================================================== */
.breadcrumb-section{ background: var(--bg-2); border: 1px solid var(--line); border-radius: 12px; padding: 13px 18px; margin-bottom: 26px; }
.breadcrumb-section::before,.breadcrumb-nav::before{ background: none !important; content: none !important; }
.breadcrumb-list{ display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0; padding: 0; list-style: none; }
.breadcrumb-item{ color: var(--mute); font-size: .82rem; }
.breadcrumb-item a{ color: var(--mute); }
.breadcrumb-item a:hover{ color: var(--lime); }
/* base paints the active crumb with a background-clip:text gradient — flatten it */
.breadcrumb-item.active,.breadcrumb-item[aria-current]{ color: var(--gold) !important; -webkit-text-fill-color: var(--gold) !important; background: none !important; -webkit-background-clip: border-box !important; background-clip: border-box !important; font-family: var(--fd); text-transform: uppercase; letter-spacing: .04em; }
.breadcrumb-home-icon{ color: var(--lime); }
/* optional page title a markup pass can add next to the breadcrumb */
.limerp-page-title{ font-family: var(--fd); text-transform: uppercase; color: var(--ink); font-size: clamp(1.6rem,3.6vw,2.4rem); line-height: 1.05; margin: 6px 0 0; }

/* ==========================================================================
   2. CUSTOM PAGINATION component (.section-3-*)
   ========================================================================== */
.section-3-pagination{ display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 10px; margin-top: 30px; }
.section-3-prev,.section-3-next{ min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; background: var(--surface); border: 1px solid var(--line); color: var(--dim); border-radius: 10px; transition: border-color .2s, color .2s, transform .2s var(--ease); }
.section-3-prev:hover,.section-3-next:hover{ border-color: var(--lime-border); color: var(--lime); transform: translateY(-2px); }
.section-3-more{ font-family: var(--fd); text-transform: uppercase; letter-spacing: .08em; color: var(--dim); }
.section-3-more:hover{ color: var(--lime); }

/* ==========================================================================
   3. ALERTS (success/danger/info) + semantic utilities + empty states
   base alert colours are hardcoded bright semantic hexes; re-frame on noir
   ========================================================================== */
.alert-success{ background: var(--lime-06); border-color: var(--lime-border); color: var(--lime-2); }
.alert-danger,.alert-error{ background: var(--mag-08); border-color: var(--mag-border); color: var(--mag); }
.alert-info{ background: var(--cyn-08); border-color: var(--cyn-border); color: var(--cyn); }
.text-success{ color: var(--lime) !important; }
.text-danger{ color: var(--mag) !important; }

/* status badges — bare + .profile-section-scoped variant to beat the legacy !important block */
.badge.bg-success,.profile-section .badge.bg-success{ background: var(--lime-10) !important; color: var(--lime-2) !important; border: 1px solid var(--lime-border); }
.badge.bg-danger,.profile-section .badge.bg-danger{ background: var(--mag-12) !important; color: var(--mag) !important; border: 1px solid var(--mag-border); }
.badge.bg-warning,.profile-section .badge.bg-warning{ background: var(--gold-10) !important; color: var(--gold-2) !important; border: 1px solid var(--gold-30); }
.badge.bg-info,.profile-section .badge.bg-info{ background: var(--cyn-08) !important; color: var(--cyn) !important; border: 1px solid var(--cyn-border); }

/* subscription pills — undefined in every base file, define them noir */
.lifetime-badge,.active-badge,.expired-badge{ display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; padding: 3px 11px; font-size: .7rem; font-weight: 600; border: 1px solid var(--line); }
.lifetime-badge{ background: var(--gold-10); color: var(--gold-2); border-color: var(--gold-30); }
.active-badge{ background: var(--lime-10); color: var(--lime-2); border-color: var(--lime-border); }
.expired-badge{ background: var(--white-05); color: var(--mute); }

/* unified noir empty state */
.gd-empty,.character-empty,.members-empty-state,.staff-empty-section,.modern-empty-cart{ text-align: center; padding: 40px 22px; color: var(--mute); }
.gd-empty i,.character-empty i,.members-empty-state i,.staff-empty-section i,.modern-empty-icon{ color: var(--mute); opacity: .8; }
.character-empty-text,.members-empty-state-text,.staff-empty-text{ color: var(--mute); }
.staff-empty-title{ font-family: var(--fd); text-transform: uppercase; color: var(--dim); }

/* ==========================================================================
   4. AVATAR (component/avatar.php + generic sizes)
   ========================================================================== */
.avatar,.avatar-xl,.avatar-lg,.avatar-sm,.avatar-150px{ border-radius: 50%; border: 1px solid var(--line); background: var(--surface); object-fit: cover; }
.avatar-ring{ padding: 2px; border-radius: 50%; background: conic-gradient(from 210deg,var(--lime),var(--gold),var(--lime)); display: inline-block; }
.avatar-ring > img,.avatar-ring .avatar{ display: block; border: 2px solid var(--surface); }

/* ==========================================================================
   5. SIDEBAR PROFILE CARD (account rail, 11 pages)
   base rules target the old .sidebar-link name and miss .menu-link entirely
   ========================================================================== */
.sidebar-profile-card .profile-image,.sidebar-profile-card .profile-image-wrapper img{ border: 2px solid var(--lime-border); border-radius: 50%; }
.sidebar-profile-card .profile-name{ font-family: var(--fd); text-transform: uppercase; color: var(--ink); }
.sidebar-profile-card .role__default{ background: var(--lime-10); color: var(--lime-2); border: 1px solid var(--lime-border); border-radius: 999px; padding: 2px 10px; font-size: .7rem; }
.sidebar-profile-card .menu-title{ font-family: var(--fb); text-transform: uppercase; letter-spacing: .1em; font-size: .68rem; color: var(--mute); border-color: var(--line) !important; }
.sidebar-profile-card .menu-items{ list-style: none; margin: 0; padding: 0; }
.sidebar-profile-card .menu-link{ display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 10px 12px; border-radius: 10px; color: var(--dim); transition: background .2s, color .2s; }
.sidebar-profile-card .menu-link i{ color: var(--mute); width: 18px; text-align: center; flex: 0 0 auto; }
.sidebar-profile-card .menu-link:hover,.sidebar-profile-card .menu-link.active{ background: var(--lime-06); color: var(--lime); }
.sidebar-profile-card .menu-link:hover i,.sidebar-profile-card .menu-link.active i{ color: var(--lime); }

/* ==========================================================================
   6. STORE (native) — bespoke categories-section-* / product-* / modern-cart-* / tiers-page
   these classes live in style.css keyed to the admin palette; repoint to noir
   ========================================================================== */
.categories-section-tag,.product-section-tag,.modern-cart-tag{ display: inline-flex; align-items: center; gap: 9px; font-family: var(--fd); font-size: .72rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--gold); }
.categories-section-header-title,.product-section-header-title,.modern-cart-title,.tiers-title{ font-family: var(--fd); text-transform: uppercase; color: var(--ink); }
.modern-cart-subtitle{ color: var(--dim); }

.categories-section-card,.product-card{ background: linear-gradient(180deg,var(--surface-2),var(--surface)); border: 1px solid var(--line); border-radius: 14px; transition: transform .3s var(--ease), border-color .3s; }
.categories-section-card:hover,.product-card:hover{ border-color: var(--lime-border); transform: translateY(-5px); }
.categories-section-title,.product-title{ font-family: var(--fd); color: var(--ink); }
.categories-section-title a,.product-title a{ color: inherit; text-decoration: none; }
.categories-section-stat{ color: var(--dim); }

.product-price-current,.product-price,.price-main,.price-value,.total-price-display,.totalPrice,.modern-price,.tier-price,.tier-tier-price{ font-family: var(--fm); color: var(--gold); font-variant-numeric: tabular-nums; }
.product-price-old,.price-original,.modern-old-price,.tier-old-price{ font-family: var(--fm); color: var(--mute); text-decoration: line-through; }
.product-discount,.price-discount,.tier-discount,.discount{ display: inline-flex; align-items: center; background: var(--gold-10); color: var(--gold-2); border: 1px solid var(--gold-30); border-radius: 999px; padding: 2px 9px; font-size: .7rem; }
.price-total-row,.price-total{ color: var(--ink); }

.product-stock,.tier-stock,.stock{ color: var(--dim); font-size: .8rem; }
.product-stock.in-stock,.tier-stock.in-stock,.stock.have-stock{ color: var(--lime); }
.product-stock.out-of-stock,.tier-stock.out-of-stock,.stock.stock-out{ color: var(--mag); }

/* store CTAs (bespoke, not Bootstrap .btn — the lime .btn-primary override never reaches them) */
.categories-section-button,.product-button,.btn-add-cart,.modern-checkout-btn,.modern-promo-btn,.tier-button.primary,.tier-button.success{ display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-family: var(--fd); text-transform: uppercase; letter-spacing: .05em; font-weight: 600; background: var(--lime) !important; color: #06140a !important; border: 0 !important; border-radius: 6px !important; transition: transform .2s var(--ease), box-shadow .25s; }
.categories-section-button:hover,.product-button:hover,.btn-add-cart:hover,.modern-checkout-btn:hover,.modern-promo-btn:hover,.tier-button.primary:hover,.tier-button.success:hover{ transform: translateY(-2px); box-shadow: 0 12px 34px -10px var(--lime-shadow); color: #06140a !important; }
.tier-button.danger{ background: var(--mag) !important; color: #fff !important; border: 0 !important; }
.btn-add-cart[disabled],.product-button[disabled],.btn-add-cart:disabled,.tier-button[disabled]{ background: var(--surface-2) !important; color: var(--mute) !important; box-shadow: none !important; cursor: not-allowed; transform: none !important; }

/* quantity steppers — noir ghost, 44px touch target */
.quantity-btn,.modern-quantity-btn,.minusItem,.addItem{ min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; background: var(--surface-2); border: 1px solid var(--line); color: var(--ink); border-radius: 8px; transition: border-color .2s, color .2s; }
.quantity-btn:hover,.modern-quantity-btn:hover{ border-color: var(--lime-border); color: var(--lime); }
.quantity-btn[disabled]{ opacity: .5; cursor: not-allowed; }
.quantity-value,.quantity-input,.modern-quantity-input{ font-family: var(--fm); color: var(--ink); background: transparent; }

/* product-detail meta badges + description box */
.meta-badge{ display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; padding: 3px 10px; font-size: .7rem; border: 1px solid var(--line); color: var(--dim); }
.meta-badge.success{ background: var(--lime-10); color: var(--lime-2); border-color: var(--lime-border); }
.meta-badge.warning{ background: var(--gold-10); color: var(--gold-2); border-color: var(--gold-30); }
.meta-badge.danger{ background: var(--mag-12); color: var(--mag); border-color: var(--mag-border); }
.meta-badge.info{ background: var(--cyn-08); color: var(--cyn); border-color: var(--cyn-border); }
.product-desc{ background: var(--white-03); border: 1px solid var(--white-10); border-radius: 10px; padding: 14px 16px; max-height: 180px; overflow: auto; color: var(--dim); }
.product-hero-section{ background: linear-gradient(180deg,var(--surface-2),var(--surface)); border: 1px solid var(--line); border-radius: 16px; }
.product-category-tag{ font-family: var(--fd); text-transform: uppercase; letter-spacing: .14em; color: var(--gold); font-size: .72rem; }

/* raw modern-cart-table (NOT a Bootstrap .table — needs its own noir) */
.modern-cart-items{ overflow-x: auto; }
.modern-cart-table{ width: 100%; border-collapse: collapse; color: var(--dim); }
.modern-cart-table th{ font-family: var(--fb); text-transform: uppercase; letter-spacing: .06em; font-size: .72rem; color: var(--mute); text-align: left; padding: 12px; border-bottom: 1px solid var(--line); }
.modern-cart-table td{ padding: 12px; border-bottom: 1px solid var(--line); }
.modern-cart-table tbody tr:hover{ background: var(--lime-06); }
.modern-product-name{ color: var(--ink); }
.modern-product-desc{ color: var(--mute); font-size: .8rem; }
.modern-remove-btn{ min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; background: transparent; border: 1px solid var(--line); color: var(--mute); border-radius: 8px; transition: color .2s, border-color .2s; }
.modern-remove-btn:hover{ color: var(--mag); border-color: var(--mag-border); }

/* cart summary / promo / payment / featured */
.modern-summary{ background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 20px; }
.modern-summary-title{ font-family: var(--fd); text-transform: uppercase; color: var(--ink); }
.modern-summary-row{ color: var(--dim); }
.modern-summary-row.total{ border-top: 1px solid var(--line); color: var(--ink); }
.modern-promo-input{ background: var(--white-03); border: 1px solid var(--line); color: var(--ink); border-radius: 9px; }
.modern-cashback-alert{ background: var(--gold-10); border: 1px solid var(--gold-30); color: var(--gold-2); border-radius: 10px; }
.modern-checkbox{ accent-color: var(--lime); }
.modern-featured-card{ background: linear-gradient(180deg,var(--surface-2),var(--surface)); border: 1px solid var(--line); border-radius: 14px; }
.modern-featured-title,.modern-promo-title,.modern-payment-title{ font-family: var(--fd); text-transform: uppercase; color: var(--ink); }

/* payment selector — shared by native cart + credits (one noir rule) */
.modern-payment-option{ background: var(--surface); border: 1px solid var(--line); border-radius: 12px; transition: border-color .2s, background .2s, box-shadow .2s; }
.modern-payment-option:hover,.modern-payment-option.selected{ border-color: var(--lime-border); background: var(--lime-06); box-shadow: 0 0 0 3px var(--lime-06); }
.modern-payment-icon{ background: var(--lime-10); color: var(--lime); border-radius: 9px; }
.modern-payment-label{ color: var(--ink); }
.modern-payment-radio{ accent-color: var(--lime); }

/* tiers-page comparison */
.tier-card{ background: linear-gradient(180deg,var(--surface-2),var(--surface)); border: 1px solid var(--line); border-radius: 15px; transition: transform .3s var(--ease), border-color .3s; }
.tier-card:hover{ transform: translateY(-5px); border-color: var(--lime-border); }
.tier-name,.tier-tier-name,.tier-tier-title{ font-family: var(--fd); color: var(--ink); }
.features-table{ color: var(--dim); }
.features-table th,.features-table .category-header,.features-table .table-header{ background: var(--surface-2); color: var(--mute); font-family: var(--fb); text-transform: uppercase; letter-spacing: .06em; }
.features-table td,.features-table th{ border-color: var(--line) !important; }
.feature-icon.check{ color: var(--lime); }
.feature-icon.times{ color: var(--mag); }
.feature-text{ color: var(--dim); }

/* native store sub-navbar */
.categories-section-navbar{ background: rgba(7,10,9,.86); border-bottom: 1px solid var(--line); backdrop-filter: blur(12px); }
.categories-section-nav-logo{ font-family: var(--fd); text-transform: uppercase; color: var(--ink); }
.categories-section-nav-link{ position: relative; color: var(--dim); transition: color .2s; }
.categories-section-nav-link:hover,.categories-section-nav-link.active{ color: var(--lime); }
.categories-section-nav-cart-count{ background: var(--lime); color: #06140a; font-family: var(--fm); border-radius: 999px; }

/* ==========================================================================
   7. TEBEX storefront (Bootstrap/Tabler + bespoke card-product / tebex-list)
   ========================================================================== */
.tebex-list-item,.tebex-list-subitem{ color: var(--dim); border-radius: 8px; transition: background .2s, color .2s; }
.tebex-list-item:hover,.tebex-list-subitem:hover{ background: var(--lime-06); color: var(--lime); }
.tebex-list-item.active,.tebex-list-subitem.active{ background: var(--lime-10) !important; color: var(--lime) !important; }
.card-product{ background: linear-gradient(180deg,var(--surface-2),var(--surface)) !important; border: 1px solid var(--line) !important; border-radius: 14px; transition: transform .3s var(--ease), border-color .3s; }
.card-product:hover,.card-hover:hover{ transform: translateY(-5px); border-color: var(--lime-border) !important; }
.store-card-text{ color: var(--dim); }
.card-product .price,.vip-table .price,.tebex-section .price{ font-family: var(--fm); color: var(--gold); }
.card-product .old-price,.vip-table .old-price,.old-price{ font-family: var(--fm); color: var(--mute); text-decoration: line-through; }
.vip-table td,.vip-table th{ border-color: var(--line) !important; }
.vip-table .table-header,.vip-table thead th{ background: var(--surface-2); }
.tebex-cart-count{ background: var(--lime) !important; color: #06140a !important; border-radius: 999px; font-family: var(--fm); }
.shopping-cart-loading,.shoppingCartSpinner{ background: var(--surface-2); border-color: var(--line); }
/* skeleton loaders ship a light-grey shimmer — dark it down */
.sl,.sl-image,.sl-title,.sl-paragraph{ background: var(--surface-2) !important; }
.sl-animation-shimmer{ background-image: linear-gradient(90deg,var(--surface-2) 0%,var(--white-05) 50%,var(--surface-2) 100%) !important; }

/* ==========================================================================
   8. CREDITS / TOP-UP (charge, send, packages)
   ========================================================================== */
.credit-history-item,.transfer-history-item,.credit-log-item{ display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-bottom: 1px solid var(--line); color: var(--dim); }
.credit-history-item:last-child,.transfer-history-item:last-child,.credit-log-item:last-child{ border-bottom: 0; }
.credit-history-item .amt,.transfer-history-item .amt,.credit-log-item .amt{ font-family: var(--fm); }
.credit-chip{ width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; flex: 0 0 auto; background: var(--lime-10); color: var(--lime); }
.credit-chip.in{ background: var(--lime-10); color: var(--lime); }
.credit-chip.out{ background: var(--mag-12); color: var(--mag); }
.credit-earning-summary,.credit-earning{ display: flex; gap: .5rem; align-items: center; }
.order-summary,.credits-package-show-section .order-summary{ background: var(--surface); border: 1px solid var(--line); border-radius: 14px; }
.order-summary .total,.order-summary-total{ color: var(--ink); }

/* ==========================================================================
   9. PLAY / CONNECT (fivem connect, roster, steps)
   backing CSS is the purple base — repoint to noir + fix touch targets
   ========================================================================== */
.play-card{ background: linear-gradient(180deg,var(--surface-2),var(--surface)); border: 1px solid var(--line); border-radius: 14px; transition: border-color .3s, transform .3s var(--ease); }
.play-card:hover{ border-color: var(--lime-border); }
.play-card-header i{ color: var(--lime); }
.play-card-header h3{ font-family: var(--fd); text-transform: uppercase; color: var(--ink); }
.page-section-title{ font-family: var(--fd); text-transform: uppercase; color: var(--ink); font-size: clamp(1.8rem,4vw,2.6rem); line-height: 1.04; }
.page-section-tag{ display: inline-flex; align-items: center; gap: 9px; border: 1px solid var(--lime-border); border-radius: 999px; padding: 6px 14px; background: var(--lime-10); color: var(--lime-2); font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; }
.page-section-tag i{ color: var(--lime); }
.page-section-description{ color: var(--dim); }
.server-ip-copy,.server-info-item{ background: rgba(7,10,9,.55); border: 1px solid var(--line); border-radius: 10px; transition: border-color .2s; }
.server-ip-copy:hover{ border-color: var(--lime-border); }
.server-ip-copy span,.server-info-item span{ font-family: var(--fm); color: var(--gold); }
.copy-btn{ min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; background: var(--lime); color: #06140a; border: 0; border-radius: 8px; transition: transform .2s var(--ease); }
.copy-btn:hover{ transform: translateY(-2px); }
.step-number{ width: 34px; height: 34px; border-radius: 50%; background: var(--lime); color: #06140a; font-family: var(--fd); display: grid; place-items: center; flex: 0 0 auto; }
.gd-fivem-connect-btn{ background: linear-gradient(135deg,var(--lime),var(--gold)) !important; color: #06140a !important; font-family: var(--fd); text-transform: uppercase; letter-spacing: .05em; border: 0 !important; box-shadow: 0 8px 30px -8px var(--lime-shadow); transition: transform .2s var(--ease); }
.gd-fivem-connect-btn:hover{ transform: translateY(-2px); }
.action-btn{ min-height: 44px; }
.action-btn.primary{ background: var(--lime) !important; color: #06140a !important; }
.action-btn.discord,.action-btn.info,.action-btn.store{ background: var(--white-03) !important; border: 1px solid var(--line-2) !important; color: var(--ink) !important; }
.action-btn.discord:hover,.action-btn.info:hover,.action-btn.store:hover{ border-color: var(--lime-border) !important; color: var(--lime) !important; }
.rule-item{ color: var(--dim); }

/* ==========================================================================
   10. PROFILE / ACCOUNT
   legacy .profile-section block + profile.php embedded <style> outrank us by
   source order → !important where they hardcode grey/purple/emerald.
   ========================================================================== */
.profile-header-card{ background: linear-gradient(170deg,var(--surface-2),var(--surface)) !important; border: 1px solid var(--line) !important; border-radius: 16px; }
.profile-avatar{ border: 2px solid var(--lime-border) !important; }
.profile-username{ font-family: var(--fd); text-transform: uppercase; color: var(--ink); }
.profile-email{ color: var(--mute); }
.info-card{ background: rgba(7,10,9,.55) !important; border: 1px solid var(--line) !important; border-radius: 12px; }
.info-icon{ background: var(--lime-10) !important; border: 1px solid var(--lime-border); color: var(--lime) !important; }
.info-label{ color: var(--mute); text-transform: uppercase; }
.info-value{ color: var(--ink); word-break: break-word; }
.user-info-grid .info-content{ min-width: 0; }
.user-info-grid .info-card .card-body{ padding: 1.1rem 1.2rem; }

/* gd-* in-game character cards — accents ride --primary-* (grey) / hardcoded hex; pin to lime/gold/mag */
.gd-badge-job{ background: var(--lime-10) !important; color: var(--lime-2) !important; border: 1px solid var(--lime-border) !important; }
.gd-count-badge,.gd-inv-count{ background: var(--lime-10) !important; color: var(--lime) !important; border: 1px solid var(--lime-border) !important; }
.gd-money-value{ font-family: var(--fm) !important; color: var(--gold) !important; }
.gd-veh-plate{ font-family: var(--fm) !important; color: var(--dim); }
.gd-linkcode{ font-family: var(--fm) !important; color: var(--gold) !important; }
.gd-lic-on{ background: var(--lime-10) !important; color: var(--lime) !important; }
.gd-linked-ok,.gd-veh-state-garaged{ color: var(--lime) !important; }
.gd-veh-state-out{ color: var(--gold) !important; }
.gd-veh-state-impound{ color: var(--mag) !important; }
.gd-trophy{ color: var(--gold) !important; }
.gd-metric-btn{ min-height: 44px; }
.gd-metric-btn.active{ background: var(--lime-10) !important; color: var(--lime) !important; border-color: var(--lime-border) !important; }

/* RP profile cards / list / hero */
.character-card,.character-list-item{ background: linear-gradient(180deg,var(--surface-2),var(--surface)); border: 1px solid var(--line); border-radius: 14px; transition: transform .3s var(--ease), border-color .3s; }
.character-card:hover,.character-list-item:hover{ transform: translateY(-4px); border-color: var(--lime-border); }
.character-card-name,.character-list-name,.character-header-name{ font-family: var(--fd); text-transform: uppercase; color: var(--ink); }
.character-card-meta,.character-list-citizenid{ font-family: var(--fm); color: var(--mute); }
.character-header{ position: relative; background: linear-gradient(170deg,var(--surface-2),var(--surface)); border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 30px 80px -30px rgba(0,0,0,.75); }
.character-header-portrait{ border: 2px solid var(--lime-border); }
.character-story-text{ color: var(--dim); }
.faction-tag{ display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--line); border-radius: 999px; padding: 4px 11px; color: var(--dim); text-decoration: none; }
.faction-tag:hover{ border-color: var(--lime-border); color: var(--lime); }
.character-danger-zone{ border: 1px solid var(--mag-border) !important; }
.page-title{ font-family: var(--fd); text-transform: uppercase; color: var(--ink); }

/* orders/show summary (uses .orders-section, own hardcoded green/red) */
.orders-card,.orders-summary-card{ background: var(--surface); border: 1px solid var(--line); border-radius: 14px; }
.orders-summary-row{ border-color: var(--line); color: var(--dim); }
.orders-summary-label{ color: var(--dim); }
.orders-summary-value{ font-family: var(--fm); color: var(--gold); }
.orders-summary-value.text-success{ color: var(--gold) !important; }
.orders-summary-value.text-danger{ color: var(--mag) !important; }
.orders-coupon-input{ background: rgba(7,10,9,.55); border: 1px solid var(--line); color: var(--ink); border-radius: 9px; }
.credit-icon{ color: var(--lime); }

/* table action buttons + linked-account icon touch/size */
.table-responsive .btn-icon,.table .btn-icon.btn-sm{ min-width: 44px; min-height: 44px; }
.linked-account-icon{ width: 40px; height: 40px; border-radius: 8px; object-fit: cover; }

/* ==========================================================================
   11. LEADERBOARDS / MEMBERS / CHARACTERS / STAFF
   ========================================================================== */
/* .leaderboards-table forces color:var(--white)!important on every cell — restore noir + accents */
.leaderboards-table td,.leaderboards-table th{ color: var(--dim) !important; background: transparent !important; border-color: var(--line) !important; }
.leaderboards-table .username-cell,.leaderboards-table .fw-bold{ color: var(--ink) !important; }
.leaderboards-table .gd-value,.leaderboards-table td.text-end,.leaderboards-table .gd-jobs-count{ color: var(--gold) !important; font-family: var(--fm) !important; }
.leaderboards-table tbody tr:hover{ background: var(--lime-06) !important; }
.leaderboards-table tr.active,.leaderboards-table .leaderboard-row.active{ background: var(--lime-10) !important; }
.gd-jobs-onduty{ background: var(--lime-10) !important; color: var(--lime) !important; border: 1px solid var(--lime-border); border-radius: 999px; }
.gd-value{ color: var(--gold); font-family: var(--fm); }

/* richest podium — noir gradient discs, gold #1 */
.gd-podium-item{ background: linear-gradient(180deg,var(--surface-2),var(--surface)); border: 1px solid var(--line); border-radius: 13px; }
.gd-podium-1{ border-color: var(--gold-30); background: linear-gradient(180deg,var(--gold-10),var(--surface)); box-shadow: 0 -10px 44px -18px var(--gold), 0 0 34px -12px var(--gold-10); }
.gd-podium-name{ font-family: var(--fd); color: var(--ink); }
.gd-podium-value{ font-family: var(--fm); color: var(--gold); }
.gd-rank-num,.gd-rank-1,.gd-rank-2,.gd-rank-3{ font-family: var(--fm); }
.gd-rank-1{ color: var(--gold); }

/* per-server leaderboard sidebar + search */
.leaderboards-sidebar,.leaderboards-main{ background: var(--surface) !important; border: 1px solid var(--line) !important; border-radius: 14px; }
.leaderboards-sidebar-link{ color: var(--dim); border-radius: 9px; }
.leaderboards-sidebar-link:hover,.leaderboards-sidebar-item.active .leaderboards-sidebar-link{ background: var(--lime-06); color: var(--lime); }
.leaderboards-search .text-danger{ color: var(--mag) !important; }

/* members profile */
.members-card,.members-leaderboard-card{ background: linear-gradient(180deg,var(--surface-2),var(--surface)) !important; border: 1px solid var(--line) !important; border-radius: 16px; }
.members-avatar{ border: 2px solid var(--lime-border) !important; box-shadow: 0 0 22px -6px var(--lime-shadow) !important; }
.members-username{ font-family: var(--fd); text-transform: uppercase; color: var(--ink); }
.members-role-badge{ background: var(--lime-10) !important; color: var(--lime-2) !important; border: 1px solid var(--lime-border) !important; }
.members-detail-label{ color: var(--mute); }
.members-detail-value{ color: var(--ink); }
.members-detail-icon{ color: var(--lime); }
.members-bans-header,.members-ban-item{ color: var(--mag); }
.members-leaderboard-nav .nav-link.active{ background: none !important; color: var(--lime) !important; border-color: transparent transparent var(--lime) !important; }

/* staff roster — base is a purple/blue/emerald template */
.staff-member-card,.staff-empty-section{ background: var(--surface) !important; border: 1px solid var(--line) !important; border-radius: 14px; }
.staff-member-card::before{ background: linear-gradient(90deg,var(--lime),var(--gold)) !important; }
.staff-member-card:hover{ border-color: var(--lime-border) !important; }
.staff-member-avatar{ border: 2px solid var(--lime-border) !important; }
.staff-member-name{ font-family: var(--fd); color: var(--ink); }
.staff-member-name:hover{ color: var(--lime) !important; -webkit-text-fill-color: var(--lime) !important; background: none !important; }
.staff-member-role{ background: var(--lime-10) !important; color: var(--lime-2) !important; border: 1px solid var(--lime-border) !important; }
.staff-status-indicator{ background: var(--lime) !important; box-shadow: 0 0 0 3px var(--lime-10), 0 0 12px var(--lime-shadow) !important; }
.staff-role-title{ font-family: var(--fd); text-transform: uppercase; color: var(--ink); }

/* ==========================================================================
   12. TABLER ERROR / EMPTY (403 on layouts/error — no style.css there)
   ========================================================================== */
.page.page-center{ background: var(--bg); }
.empty-title{ font-family: var(--fd); text-transform: uppercase; color: var(--ink); }
.empty-subtitle{ color: var(--dim); }
.empty-icon{ color: var(--lime); }

/* ==========================================================================
   13. MONO NUMBER LOCK — extend the --fm rule to store/credit/profile numerics
   (body prefix matches the existing typography-lock specificity at limerp.css:456)
   ========================================================================== */
body .product-price-current, body .product-price-old, body .product-price, body .modern-price, body .modern-old-price,
body .price-main, body .price-original, body .price-value, body .tier-price, body .tier-tier-price, body .total-price-display,
body .gd-money-value, body .gd-veh-plate, body .gd-linkcode, body .gd-podium-value, body .members-detail-value,
body .orders-summary-value, body .server-ip-copy span, body .credit-log-item .amt{ font-family: var(--fm) !important; }

/* ==========================================================================
   14. INNER-PAGE RESPONSIVE + REDUCED MOTION
   ========================================================================== */
/* play grid uses minmax(350px) which overflows below 360px — relax the min */
.play-grid{ grid-template-columns: repeat(auto-fit,minmax(min(100%,280px),1fr)); align-items: start; }
@media (max-width: 560px){
  .categories-section-grid,.product-section-grid,.tiers-grid,.modern-featured-grid{ grid-template-columns: 1fr; }
  .categories-section-nav-menu{ overflow-x: auto; flex-wrap: nowrap; }
}
@media (prefers-reduced-motion: reduce){
  .categories-section-card,.product-card,.tier-card,.character-card,.character-list-item,.card-product,.staff-member-card,.gd-fivem-connect-btn,.copy-btn,.play-card,.prod,.tier,.dcard{ transition: none !important; }
  .categories-section-card:hover,.product-card:hover,.tier-card:hover,.character-card:hover,.character-list-item:hover,.card-product:hover,.staff-member-card:hover,.gd-fivem-connect-btn:hover,.copy-btn:hover{ transform: none !important; }
}

/* ==========================================================================
   15. A11Y — keyboard focus ring for custom interactive elements
   (foundation gave these hover states but no :focus-visible; offset keeps the
   lime ring visible even on lime/gradient button faces against the dark page)
   ========================================================================== */
.copy-btn:focus-visible,
.action-btn:focus-visible,
.action-btn.primary:focus-visible,
.product-button:focus-visible,
.categories-section-button:focus-visible,
.modern-payment-option:focus-visible,
.quantity-btn:focus-visible,
.section-3-prev:focus-visible,
.section-3-next:focus-visible,
.tebex-list-item:focus-visible,
.gd-fivem-connect-btn:focus-visible,
.credit-chip:focus-visible{
  outline: 2px solid var(--lime);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px var(--primary-fade,var(--lime-10));
}

/* ==========================================================================
   16. Support tickets — noir override for style.css .ticket-* bespoke classes
   ========================================================================== */
.ticket-section{ background: var(--bg); }
.ticket-section .ticket-section-tag{ background: var(--lime-10); }
.ticket-section .ticket-section-tag i,
.ticket-section .ticket-section-tag span{ color: var(--lime); }
.ticket-section .ticket-section-title,
.ticket-section .ticket-info-value,
.ticket-section .ticket-section-subject h2{ color: var(--ink); }
.ticket-section .ticket-info-label{ color: var(--mute); }
.ticket-section .ticket-status-open,
.ticket-section .ticket-status.open{ background: var(--lime-10); color: var(--lime); }
.ticket-section .ticket-status-answered,
.ticket-section .ticket-status.answered{ background: var(--cyn-08); color: var(--cyn); }
.ticket-section .ticket-status-closed,
.ticket-section .ticket-status.closed{ background: var(--mag-12); color: var(--mag); }
.ticket-section .ticket-message,
.ticket-section .ticket-category{ background: var(--surface); border: 1px solid var(--line); }
.ticket-section .ticket-message-role.admin{ background: var(--lime-10); color: var(--lime); }
.ticket-section .ticket-message-user img{ border-color: var(--lime); }
.ticket-section .ticket-action-btn:hover{ color: var(--lime); }
.ticket-section .ticket-action-btn.delete:hover{ color: var(--mag); }

/* ==========================================================================
   17. Applications — noir override for style.css .application-* bespoke classes
   ========================================================================== */
.status-rejected,
.status-error{ background: var(--mag-12); color: var(--mag); border-color: var(--mag-border); }
.status-approved{ background: var(--lime-10); color: var(--lime-2); border-color: var(--lime-border); }
.status-pending{ background: var(--gold-10); color: var(--gold-2); border-color: var(--gold-30); }
.application-form-section .application-form-card{ background: var(--surface-2); border-color: var(--line); }
.application-form-section .application-form-card-header{
  background: linear-gradient(135deg, var(--surface-2), var(--surface));
  border-bottom: 1px solid var(--lime-border);
}
.application-form-section .application-form-tag{ background: var(--lime-10); color: var(--lime); border-color: var(--lime-border); }
.application-form-section .application-form-title{ color: var(--ink); }
.application-question-block{ background: var(--surface-2); border-color: var(--line); }
.application-question-block:hover{ border-color: var(--lime-border); }
.application-question-label{ color: var(--lime); }
.application-answer-text{ border-left-color: var(--lime); }
.application-reason-block{ background: var(--gold-10); border-color: var(--gold-30); }
.application-reason-label{ color: var(--gold-2); }

/* ==========================================================================
   18. Punishments — noir override for style.css .punishment-* bespoke classes
   ========================================================================== */
.punishment-card{ background: linear-gradient(135deg, var(--surface-2), var(--surface)); border-color: var(--line); }
.punishment-card:hover{ border-color: var(--lime-border); }
.punishment-card:hover .punishment-title{ color: var(--lime); }
.punishment-title{ color: var(--ink); }
.punishment-icon::after{ background: linear-gradient(45deg, var(--lime), var(--gold)); }
.ban-card .punishment-icon{ background: var(--mag-12); color: var(--mag); }
.warning-card .punishment-icon{ background: var(--gold-10); color: var(--gold); }
.mute-card .punishment-icon,
.kick-card .punishment-icon{ background: var(--lime-10); color: var(--lime); }
.punishments-bans-card,
.punishments-kicks-card,
.punishments-mutes-card,
.punishments-warnings-card{ background: linear-gradient(135deg, var(--surface-2), var(--surface)); border-color: var(--line); }
.punishments-bans-card:hover,
.punishments-kicks-card:hover,
.punishments-mutes-card:hover,
.punishments-warnings-card:hover{ border-color: var(--lime-border); }
.punishments-bans-header{ background: linear-gradient(135deg, var(--mag-12), var(--mag-08)); border-bottom-color: var(--mag-border); }
.punishments-warnings-header{ background: linear-gradient(135deg, var(--gold-10), transparent); border-bottom-color: var(--gold-30); }
.punishments-kicks-header,
.punishments-mutes-header{ background: linear-gradient(135deg, var(--lime-10), var(--lime-06)); border-bottom-color: var(--lime-border); }
.punishments-bans-title,
.punishments-kicks-title,
.punishments-mutes-title,
.punishments-warnings-title{ color: var(--ink); }
.punishments-bans-title i{ color: var(--mag); }
.punishments-warnings-title i{ color: var(--gold); }
.punishments-kicks-title i,
.punishments-mutes-title i{ color: var(--lime); }
.punishments-bans-empty,
.punishments-kicks-empty,
.punishments-mutes-empty,
.punishments-warnings-empty{ color: var(--mute); }
.punishments-bans-empty i,
.punishments-kicks-empty i,
.punishments-mutes-empty i,
.punishments-warnings-empty i{ color: var(--mute); }

/* ==========================================================================
   19. Help center — noir override for style.css .help-* bespoke classes
   (article.php's embedded style is recolored in-page; these are the
   style.css-driven index/topic/search pages)
   ========================================================================== */
.help-topic-card,
.help-faq-card,
.help-topic-article-card,
.help-search-result-card{ background: var(--surface-2); border-color: var(--line); }
.help-topic-card:hover,
.help-faq-card:hover,
.help-topic-article-card:hover,
.help-search-result-card:hover{ background: var(--surface); border-color: var(--lime-border); }
.help-topic-card h3,
.help-topics-section h2,
.help-faq-section h2,
.help-search-results-section h2,
.help-topic-articles-section h2,
.help-topic-header-section h1,
.help-search-no-results h3,
.help-topic-no-articles h3{ color: var(--ink); }
.help-topic-card img{ background: var(--lime-10); }
.help-faq-card i,
.help-topic-article-card i,
.help-search-result-card i{ color: var(--lime); }
.help-topics-section h2::after,
.help-faq-section h2::after,
.help-search-results-section h2::after,
.help-topic-articles-section h2::after,
.help-search-results-section::before,
.help-topic-articles-section::before{ background: linear-gradient(135deg, var(--lime), var(--gold)); }
.help-search-results-section,
.help-topic-articles-section{ background: var(--surface); border-color: var(--line); }
.help-topic-header-section{ background: linear-gradient(135deg, var(--lime-10), var(--surface)); border-color: var(--line); }
.help-topic-header-section::before{ background: radial-gradient(circle, var(--lime-10) 0%, transparent 70%); }
.help-topic-no-articles,
.help-search-no-results{ color: var(--mute); }
.help-topic-no-articles i,
.help-search-no-results i{ color: var(--mute); }