/* ==========================================================================
   TAKAS SUNUCUSU ÖZEL ZÜMRÜT (EMERALD) & ALTIN (GOLD) LÜKS TEMA
   İlham: Resmi Takas Bannerı, Robux / Token Parıltıları ve Zümrüt Kristal Efekti
   ========================================================================== */

:root {
  /* Zümrüt / Emerald Neon & Derinlik Renkleri */
  --emerald-neon: #00F59B;
  --emerald-main: #10B981;
  --emerald-dark: #059669;
  --emerald-glow: rgba(0, 245, 155, 0.35);
  --emerald-surface: rgba(0, 245, 155, 0.08);

  /* Altın / 3D Metallic Gold Renkleri */
  --gold-bright: #FFF2A1;
  --gold-main: #F5C518;
  --gold-metallic: #E5B83B;
  --gold-deep: #D4AF37;
  --gold-dark: #C99616;
  --gold-glow: rgba(245, 197, 24, 0.4);

  /* Arka Plan ve Koyu Zümrüt Kadife Tonları */
  --bg-black: #020b07;
  --bg-dark: #04140d;
  --bg-surface: #071f15;
  --bg-card: rgba(8, 27, 19, 0.78);
  --bg-card-hover: rgba(12, 38, 27, 0.9);

  /* Çerçeve ve Işık Sınırları */
  --border-emerald: rgba(0, 245, 155, 0.28);
  --border-gold: rgba(245, 197, 24, 0.35);
  --border-light: rgba(255, 255, 255, 0.09);

  /* Metin Renkleri */
  --text-primary: #ffffff;
  --text-secondary: #e4f5ed;
  --text-muted: #83a897;

  /* Yardımcı Renkler */
  --danger: #FF4757;
  --cyan: #00E8C6;

  /* Yazı Tipleri */
  --font-main: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-display: 'Outfit', sans-serif;

  /* Yuvarlatmalar */
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --radius-xl: 30px;
}

*, *::before, *::after {
  box-sizing: border-box !important;
  margin: 0;
  padding: 0;
  user-select: none !important;
  -webkit-user-select: none !important;
  -moz-user-select: none !important;
  -ms-user-select: none !important;
  -webkit-touch-callout: none !important;
}

input, textarea, select {
  user-select: text !important;
  -webkit-user-select: text !important;
  -moz-user-select: text !important;
  -ms-user-select: text !important;
}

/* ================= ALTIN YUVARLAK ÖZEL MOUSE İMLECİ ================= */
@media (pointer: fine) {
  *, *::before, *::after {
    cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='7' fill='%23F5C518' stroke='%23FFF4A3' stroke-width='2' filter='drop-shadow(0 0 4px rgba(245,197,24,0.9))'/%3E%3Ccircle cx='12' cy='12' r='2.5' fill='%2304140D'/%3E%3C/svg%3E") 12 12, auto !important;
  }

  a, button, [role="button"], input, select, textarea, .cmd-filter-btn, .stat-card, .vouch-card, .rule-box, .btn, .step-card, .feature-card {
    cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28'%3E%3Ccircle cx='14' cy='14' r='9' fill='%2300F59B' stroke='%23FFF4A3' stroke-width='2.2' filter='drop-shadow(0 0 6px rgba(0,245,155,0.9))'/%3E%3Ccircle cx='14' cy='14' r='3.5' fill='%23F5C518'/%3E%3C/svg%3E") 14 14, pointer !important;
  }
}

/* Dinamik Altın Parıltılı Yuvarlak İmleç Elemanları (DOM) */
.custom-cursor-dot {
  position: fixed;
  top: 0;
  left: 0;
  width: 8px;
  height: 8px;
  background: #FFF4A3;
  border-radius: 50%;
  pointer-events: none;
  z-index: 999999;
  transform: translate(-50%, -50%);
  box-shadow: 0 0 10px #F5C518, 0 0 4px #FFFFFF;
  transition: width 0.2s ease, height 0.2s ease, background-color 0.2s ease, opacity 0.2s ease;
  will-change: transform;
  opacity: 0;
}

.custom-cursor-ring {
  position: fixed;
  top: 0;
  left: 0;
  width: 36px;
  height: 36px;
  border: 2px solid #F5C518;
  border-radius: 50%;
  pointer-events: none;
  z-index: 999998;
  transform: translate(-50%, -50%);
  box-shadow: 0 0 16px rgba(245, 197, 24, 0.45), inset 0 0 8px rgba(245, 197, 24, 0.2);
  transition: width 0.2s ease-out, height 0.2s ease-out, border-color 0.2s ease, background-color 0.2s ease, opacity 0.2s ease;
  will-change: transform;
  opacity: 0;
}

.custom-cursor-ring.cursor-hover {
  width: 52px;
  height: 52px;
  border-color: var(--emerald-neon);
  background-color: rgba(0, 245, 155, 0.12);
  box-shadow: 0 0 25px rgba(0, 245, 155, 0.6), inset 0 0 10px rgba(0, 245, 155, 0.25);
}

.custom-cursor-dot.cursor-hover {
  background: var(--emerald-neon);
  box-shadow: 0 0 12px var(--emerald-neon), 0 0 5px #FFF;
  transform: translate(-50%, -50%) scale(1.3);
}

.custom-cursor-ring.cursor-active {
  transform: translate(-50%, -50%) scale(0.85);
}

@media (hover: none), (pointer: coarse), (max-width: 868px) {
  .custom-cursor-dot,
  .custom-cursor-ring {
    display: none !important;
  }
}

::selection {
  background: transparent !important;
  color: inherit !important;
}

::-moz-selection {
  background: transparent !important;
  color: inherit !important;
}

img {
  -webkit-user-drag: none !important;
  user-drag: none !important;
  pointer-events: none;
}

html {
  overflow-x: hidden !important;
  overflow-x: clip !important;
  width: 100% !important;
  max-width: 100vw !important;
  scroll-behavior: smooth;
  font-family: var(--font-main);
  background-color: var(--bg-black);
  color: var(--text-primary);
  line-height: 1.6;
  touch-action: pan-y;
}

body {
  overflow-x: hidden !important;
  overflow-x: clip !important;
  width: 100% !important;
  max-width: 100% !important;
  position: relative;
  min-height: 100vh;
  background: 
    radial-gradient(circle at 50% 0%, #08291c 0%, #04140d 45%, #020b07 100%);
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
}

body, main, section, header, footer, nav, article, aside, .section, .section-container, .nav-container, .hero-container, .hero-section {
  box-sizing: border-box !important;
  max-width: 100% !important;
}

img, svg, video, iframe, canvas {
  max-width: 100% !important;
  height: auto;
}

pre, code {
  word-break: break-word !important;
  white-space: pre-wrap !important;
  overflow-wrap: break-word !important;
}

/* ================= ZÜMRÜT & ALTIN IŞIK PARILTILARI ================= */
.glow-bg-container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  max-width: 100vw;
  height: 100%;
  overflow: hidden !important;
  pointer-events: none;
  z-index: -1;
}

.glow-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(140px);
  pointer-events: none;
  z-index: -1;
  max-width: 100vw;
}

.glow-top {
  width: 650px;
  height: 650px;
  top: -150px;
  left: 50%;
  transform: translateX(-50%);
  background: radial-gradient(circle, rgba(0, 245, 155, 0.28) 0%, rgba(245, 197, 24, 0.18) 45%, transparent 70%);
}

.glow-middle {
  width: 700px;
  height: 700px;
  top: 900px;
  right: -200px;
  background: radial-gradient(circle, rgba(245, 197, 24, 0.22) 0%, rgba(0, 245, 155, 0.15) 50%, transparent 70%);
}

.glow-bottom {
  width: 800px;
  height: 800px;
  top: 2000px;
  left: -250px;
  background: radial-gradient(circle, rgba(0, 245, 155, 0.25) 0%, transparent 70%);
}

/* ================= ÜST GEZİNME (NAVBAR) ================= */
.navbar {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: rgba(3, 15, 10, 0.82);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--border-emerald);
  padding: 0.95rem 0;
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.45);
}

.nav-container {
  width: 100%;
  max-width: 1560px;
  margin: 0 auto;
  padding: 0 1.25rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
  box-sizing: border-box;
  position: relative;
}

.brand-logo {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  text-decoration: none;
  color: inherit;
  flex: 0 0 auto;
  margin-right: 0.5rem;
  white-space: nowrap;
}

.logo-box {
  position: relative;
  width: 44px;
  height: 44px;
  flex-shrink: 0;
}

.logo-img {
  width: 100%;
  height: 100%;
  border-radius: 12px;
  object-fit: cover;
  border: 2px solid var(--gold-main);
  box-shadow: 0 0 14px rgba(245, 197, 24, 0.35);
}

.online-indicator {
  position: absolute;
  bottom: -2px;
  right: -2px;
  width: 13px;
  height: 13px;
  background-color: var(--emerald-neon);
  border: 2.5px solid var(--bg-black);
  border-radius: 50%;
  box-shadow: 0 0 8px var(--emerald-neon);
}

.brand-text {
  display: flex;
  flex-direction: column;
}

.brand-title {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: 1.3rem;
  letter-spacing: 0.8px;
  background: linear-gradient(180deg, var(--gold-bright) 0%, var(--gold-main) 60%, var(--gold-dark) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 2px 10px rgba(245, 197, 24, 0.3);
  line-height: 1.1;
}

.brand-subtitle {
  font-size: 0.72rem;
  color: var(--emerald-neon);
  font-weight: 600;
  letter-spacing: 0.4px;
}

.nav-links {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(0.2rem, 0.45vw, 0.65rem) !important;
  flex: 1 1 auto;
  min-width: 0;
  margin: 0 0.25rem;
}

.nav-link {
  color: var(--text-secondary);
  text-decoration: none;
  font-size: clamp(0.76rem, 0.8vw, 0.86rem) !important;
  font-weight: 700;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;
  white-space: nowrap !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.35rem !important;
  line-height: 1 !important;
  height: 36px !important;
  padding: 0 clamp(0.35rem, 0.42vw, 0.55rem) !important;
  border-radius: 999px;
  box-sizing: border-box;
  flex-shrink: 0;
  border: 1px solid transparent;
}

.nav-link:hover {
  color: var(--gold-main);
  background: rgba(245, 197, 24, 0.08);
  text-shadow: 0 0 10px rgba(245, 197, 24, 0.4);
}

.nav-actions {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  flex: 0 0 auto !important;
  white-space: nowrap;
  margin-left: auto;
  z-index: 2;
}

.nav-actions .btn {
  padding: 0 clamp(0.75rem, 0.9vw, 1.15rem) !important;
  height: 38px !important;
  font-size: 0.85rem !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  border-radius: 20px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.45rem !important;
  box-shadow: 0 0 18px rgba(245, 197, 24, 0.45) !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.live-ping-pill {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0 0.85rem;
  height: 38px;
  background: rgba(0, 245, 155, 0.08);
  border: 1px solid var(--border-emerald);
  border-radius: 25px;
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--emerald-neon);
  box-shadow: inset 0 0 12px rgba(0, 245, 155, 0.1);
  white-space: nowrap;
  flex-shrink: 0;
}

.ping-dot {
  width: 8px;
  height: 8px;
  background-color: var(--emerald-neon);
  border-radius: 50%;
  box-shadow: 0 0 10px var(--emerald-neon);
  animation: pulse-dot 1.8s infinite;
}

@keyframes pulse-dot {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.35; transform: scale(0.8); }
}

.mobile-menu-btn {
  display: none;
  background: rgba(0, 245, 155, 0.08);
  border: 1px solid var(--border-emerald);
  border-radius: var(--radius-sm);
  padding: 8px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  cursor: pointer;
  width: 42px;
  height: 42px;
  transition: all 0.25s ease;
  z-index: 1001;
}

.mobile-menu-btn:hover {
  background: rgba(0, 245, 155, 0.16);
  border-color: var(--gold-main);
}

.mobile-menu-btn span {
  width: 22px;
  height: 2px;
  background: var(--gold-main);
  border-radius: 2px;
  transition: all 0.28s cubic-bezier(0.4, 0, 0.2, 1);
  transform-origin: center;
}

.mobile-menu-btn.open {
  background: rgba(245, 197, 24, 0.15);
  border-color: var(--gold-main);
}

.mobile-menu-btn.open span:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}

.mobile-menu-btn.open span:nth-child(2) {
  opacity: 0;
  transform: scaleX(0);
}

.mobile-menu-btn.open span:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

/* ================= LÜKS BUTONLAR (GOLD & EMERALD) ================= */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.65rem;
  padding: 0.7rem 1.45rem;
  border-radius: var(--radius-md);
  font-weight: 700;
  font-size: 0.95rem;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.28s cubic-bezier(0.4, 0, 0.2, 1);
  border: none;
}

/* 3D Altın Buton */
.btn-gold {
  background: linear-gradient(180deg, #FFF4A3 0%, #F5C518 45%, #D4AF37 80%, #996E0F 100%);
  color: #071911;
  font-weight: 800;
  box-shadow: 0 4px 20px rgba(245, 197, 24, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.6);
  border: 1px solid #FFE775;
}

.btn-gold:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 30px rgba(245, 197, 24, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.8);
  filter: brightness(1.05);
}

/* Zümrüt Parlayan Buton */
.btn-emerald {
  background: linear-gradient(135deg, #00F59B 0%, #10B981 100%);
  color: #03140d;
  font-weight: 800;
  box-shadow: 0 4px 22px rgba(0, 245, 155, 0.4);
  border: 1px solid #57FFC5;
}

.btn-emerald:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 32px rgba(0, 245, 155, 0.6);
}

/* Discord Zümrüt Özel Buton */
.btn-discord {
  background: linear-gradient(135deg, #10B981 0%, #059669 100%);
  color: #fff;
  border: 1px solid var(--border-emerald);
  box-shadow: 0 4px 16px rgba(16, 185, 129, 0.3);
}

.btn-discord:hover {
  background: linear-gradient(135deg, #00F59B 0%, #10B981 100%);
  color: #03140d;
  transform: translateY(-2px);
  box-shadow: 0 6px 24px rgba(0, 245, 155, 0.45);
}

/* Şeffaf Cam Buton */
.btn-glass {
  background: rgba(0, 245, 155, 0.08);
  color: #fff;
  border: 1px solid var(--border-emerald);
  backdrop-filter: blur(10px);
}

.btn-glass:hover {
  background: rgba(0, 245, 155, 0.18);
  border-color: var(--emerald-neon);
  transform: translateY(-2px);
}

.btn-lg {
  padding: 0.95rem 2rem;
  font-size: 1.08rem;
  border-radius: var(--radius-lg);
}

/* ================= HERO BÖLÜMÜ (ATMOSFERİK ARKA PLAN BANNER) ================= */
.hero-section {
  position: relative;
  overflow: hidden;
  padding: 6.5rem 1.5rem 5rem;
  text-align: center;
  min-height: 82vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hero-bg-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}

.hero-bg-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
  opacity: 0.36;
  filter: saturate(1.25) brightness(0.85);
  transform: scale(1.04);
}

.hero-bg-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: 
    radial-gradient(ellipse at 50% 35%, rgba(4, 20, 13, 0.45) 0%, rgba(2, 11, 7, 0.88) 70%, #020b07 100%),
    linear-gradient(180deg, rgba(3, 15, 10, 0.8) 0%, transparent 35%, rgba(2, 11, 7, 0.95) 85%, #020b07 100%);
}

.hero-bg-glow {
  position: absolute;
  top: 30%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 750px;
  height: 420px;
  background: radial-gradient(circle, rgba(0, 245, 155, 0.22) 0%, rgba(245, 197, 24, 0.16) 45%, transparent 70%);
  filter: blur(85px);
  pointer-events: none;
}

.hero-container {
  position: relative;
  z-index: 2;
  max-width: 960px;
  margin: 0 auto;
}

.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  background: rgba(8, 30, 21, 0.85);
  border: 1px solid var(--border-gold);
  padding: 0.5rem 1.25rem;
  border-radius: 35px;
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--gold-main);
  margin-bottom: 1.8rem;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3), 0 0 15px rgba(245, 197, 24, 0.15);
}

.badge-gem {
  font-size: 1.1rem;
}

.hero-title {
  font-family: var(--font-display);
  font-size: 3.8rem;
  font-weight: 900;
  line-height: 1.12;
  letter-spacing: -1.2px;
  margin-bottom: 1.4rem;
}

/* 3D Altın & Zümrüt Başlık Efekti */
.gold-3d-text {
  background: linear-gradient(180deg, #FFFFFF 0%, #FFF2A1 25%, #F5C518 55%, #D4AF37 80%, #8C6409 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 4px 15px rgba(245, 197, 24, 0.4));
}

.emerald-glow-text {
  background: linear-gradient(180deg, #FFFFFF 0%, #80FFCE 30%, #00F59B 70%, #059669 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 4px 20px rgba(0, 245, 155, 0.5));
}

.hero-desc {
  font-size: 1.2rem;
  color: var(--text-secondary);
  max-width: 720px;
  margin: 0 auto 2.5rem;
  line-height: 1.7;
}

.hero-buttons {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.3rem;
  margin-bottom: 3.5rem;
  flex-wrap: wrap;
}

/* discord.gg/takas Fotoğraftaki Özel Pill Tasarımı */
.takas-url-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.6rem 1.6rem;
  background: rgba(3, 16, 11, 0.9);
  border: 1.5px solid var(--emerald-neon);
  border-radius: 40px;
  box-shadow: 
    0 0 20px rgba(0, 245, 155, 0.35),
    inset 0 0 15px rgba(0, 245, 155, 0.15);
  font-family: var(--font-display);
  font-size: 1.15rem;
  font-weight: 800;
  color: var(--gold-main);
  letter-spacing: 0.5px;
}

/* Canlı Durum Şeridi */
.hero-status-strip {
  display: inline-flex;
  align-items: center;
  gap: 1.8rem;
  padding: 0.85rem 2.2rem;
  background: rgba(8, 28, 20, 0.8);
  border: 1px solid var(--border-gold);
  border-radius: 40px;
  backdrop-filter: blur(16px);
  font-size: 0.95rem;
  color: var(--text-secondary);
  font-weight: 600;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4);
}

.status-item {
  display: flex;
  align-items: center;
  gap: 0.55rem;
}

.status-separator {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--gold-main);
  box-shadow: 0 0 8px var(--gold-main);
}

/* ================= BÖLÜM ŞABLONLARI ================= */
.section {
  padding: 5.5rem 1.5rem;
  position: relative;
}

.section-container {
  max-width: 1240px;
  margin: 0 auto;
}

.section-header {
  text-align: center;
  max-width: 720px;
  margin: 0 auto 3.8rem;
}

.section-tag {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 2px;
  color: var(--gold-main);
  margin-bottom: 0.7rem;
  text-transform: uppercase;
}

.section-title {
  font-family: var(--font-display);
  font-size: 2.5rem;
  font-weight: 800;
  margin-bottom: 0.9rem;
  letter-spacing: -0.5px;
  background: linear-gradient(180deg, #fff 40%, var(--text-secondary));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.section-desc {
  color: var(--text-muted);
  font-size: 1.05rem;
}

/* ================= ÖNE ÇIKAN VIP ARACI KARTI ================= */
.vip-stat-card {
  position: relative;
  background: 
    linear-gradient(135deg, rgba(0, 245, 155, 0.12) 0%, rgba(7, 26, 18, 0.92) 50%, rgba(245, 197, 24, 0.1) 100%);
  border: 2px solid var(--border-gold);
  border-radius: var(--radius-xl);
  padding: 3.5rem 2rem;
  text-align: center;
  margin-bottom: 2.8rem;
  overflow: hidden;
  box-shadow: 
    0 15px 50px rgba(0, 0, 0, 0.6),
    0 0 40px rgba(0, 245, 155, 0.15),
    inset 0 0 30px rgba(245, 197, 24, 0.08);
}

.vip-card-glow {
  position: absolute;
  top: -40%;
  left: 50%;
  transform: translateX(-50%);
  width: 450px;
  height: 450px;
  background: radial-gradient(circle, rgba(0, 245, 155, 0.3) 0%, rgba(245, 197, 24, 0.15) 50%, transparent 70%);
  filter: blur(60px);
  pointer-events: none;
}

.vip-card-inner {
  position: relative;
  z-index: 1;
}

.vip-badge {
  display: inline-block;
  font-size: 0.85rem;
  font-weight: 800;
  letter-spacing: 1.5px;
  color: #04140d;
  background: linear-gradient(135deg, #FFF4A3 0%, var(--gold-main) 100%);
  padding: 0.45rem 1.2rem;
  border-radius: 25px;
  margin-bottom: 1.4rem;
  box-shadow: 0 4px 18px rgba(245, 197, 24, 0.4);
}

.vip-number-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
  margin-bottom: 0.5rem;
}

.vip-number {
  font-family: var(--font-display);
  font-size: 5.6rem;
  font-weight: 900;
  line-height: 1;
  background: linear-gradient(180deg, #FFFFFF 0%, #FFF2A1 30%, #F5C518 65%, #C99616 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 4px 25px rgba(245, 197, 24, 0.5));
}

.vip-plus {
  font-size: 3.5rem;
  font-weight: 900;
  color: var(--emerald-neon);
  text-shadow: 0 0 20px var(--emerald-neon);
}

.vip-title {
  font-size: 1.65rem;
  font-weight: 800;
  margin-bottom: 0.7rem;
  color: #fff;
}

.vip-desc {
  max-width: 620px;
  margin: 0 auto 1.6rem;
  color: var(--text-secondary);
  font-size: 1.05rem;
}

.vip-footer {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  font-size: 0.92rem;
  color: var(--emerald-neon);
  font-weight: 700;
  background: rgba(0, 245, 155, 0.08);
  padding: 0.4rem 1.2rem;
  border-radius: 20px;
  border: 1px solid var(--border-emerald);
}

.pulse-circle {
  width: 10px;
  height: 10px;
  background: var(--emerald-neon);
  border-radius: 50%;
  box-shadow: 0 0 12px var(--emerald-neon);
}

/* ================= 6'LI STAT IZGARASI ================= */
.stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));
  gap: 1.6rem;
}

.stat-card {
  display: flex;
  align-items: center;
  gap: 1.4rem;
  padding: 2rem;
  background: var(--bg-card);
  border: 1px solid var(--border-emerald);
  border-radius: var(--radius-lg);
  backdrop-filter: blur(16px);
  transition: all 0.32s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
}

.stat-card:hover {
  background: var(--bg-card-hover);
  border-color: var(--gold-main);
  transform: translateY(-5px);
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.6), 0 0 25px rgba(245, 197, 24, 0.2);
}

.stat-icon-wrap {
  width: 64px;
  height: 64px;
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border: 1.5px solid;
}

/* Zümrüt & Altın İkon Kutuları */
.icon-emerald {
  background: rgba(0, 245, 155, 0.15);
  color: var(--emerald-neon);
  border-color: var(--border-emerald);
  box-shadow: 0 0 15px rgba(0, 245, 155, 0.2);
}

.icon-gold {
  background: rgba(245, 197, 24, 0.15);
  color: var(--gold-main);
  border-color: var(--border-gold);
  box-shadow: 0 0 15px rgba(245, 197, 24, 0.25);
}

.stat-number {
  font-family: var(--font-display);
  font-size: 2.4rem;
  font-weight: 900;
  line-height: 1.1;
  color: #fff;
  letter-spacing: -0.5px;
}

.stat-number .unit {
  font-size: 1.15rem;
  color: var(--gold-main);
  font-weight: 600;
}

.stat-label {
  font-size: 0.98rem;
  font-weight: 700;
  color: var(--text-secondary);
  margin-top: 0.25rem;
}

.stat-subtext {
  font-size: 0.82rem;
  color: var(--text-muted);
  margin-top: 0.2rem;
}

/* ================= ARACI SİSTEMİ ADIMLARI ================= */
.steps-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
  gap: 2rem;
}

.step-card {
  position: relative;
  background: var(--bg-card);
  border: 1px solid var(--border-emerald);
  border-radius: var(--radius-lg);
  padding: 2.8rem 2rem;
  backdrop-filter: blur(14px);
  text-align: center;
  transition: all 0.3s ease;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
}

.step-card:hover {
  border-color: var(--gold-main);
  transform: translateY(-5px);
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.5), 0 0 25px rgba(0, 245, 155, 0.2);
}

.step-badge {
  position: absolute;
  top: 1.2rem;
  left: 1.4rem;
  font-family: var(--font-display);
  font-size: 1.2rem;
  font-weight: 900;
  color: var(--gold-main);
}

.step-icon {
  font-size: 3.2rem;
  margin-bottom: 1.3rem;
  filter: drop-shadow(0 4px 12px rgba(0, 245, 155, 0.4));
}

.step-title {
  font-size: 1.3rem;
  font-weight: 800;
  margin-bottom: 0.75rem;
  color: #fff;
}

.step-desc {
  font-size: 0.95rem;
  color: var(--text-muted);
  line-height: 1.65;
}

/* ================= ÖZELLİKLER IZGARASI ================= */
.features-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));
  gap: 2rem;
}

.feature-card {
  background: var(--bg-card);
  border: 1px solid var(--border-emerald);
  border-radius: var(--radius-lg);
  padding: 2.2rem;
  backdrop-filter: blur(14px);
  transition: all 0.3s ease;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
}

.feature-card:hover {
  background: var(--bg-card-hover);
  border-color: var(--gold-main);
  transform: translateY(-5px);
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.5), 0 0 25px rgba(245, 197, 24, 0.18);
}

.feature-icon {
  font-size: 2.4rem;
  margin-bottom: 1.1rem;
}

.feature-title {
  font-size: 1.25rem;
  font-weight: 800;
  margin-bottom: 0.65rem;
  color: #fff;
}

.feature-desc {
  font-size: 0.95rem;
  color: var(--text-muted);
  line-height: 1.65;
}

/* ================= KOMUTLAR BÖLÜMÜ ================= */
.command-categories {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.85rem;
  margin-bottom: 2.8rem;
  flex-wrap: wrap;
}

.cmd-filter-btn {
  background: rgba(8, 28, 20, 0.8);
  border: 1px solid var(--border-emerald);
  color: var(--text-secondary);
  padding: 0.65rem 1.3rem;
  border-radius: 25px;
  font-size: 0.9rem;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.25s ease;
}

.cmd-filter-btn:hover,
.cmd-filter-btn.active {
  background: linear-gradient(135deg, var(--gold-main) 0%, var(--gold-dark) 100%);
  color: #03140d;
  border-color: var(--gold-main);
  box-shadow: 0 4px 18px rgba(245, 197, 24, 0.45);
}

.commands-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(310px, 1fr));
  gap: 1.5rem;
}

.cmd-card {
  background: var(--bg-card);
  border: 1px solid var(--border-emerald);
  border-radius: var(--radius-md);
  padding: 1.6rem;
  transition: all 0.25s ease;
}

.cmd-card:hover {
  border-color: var(--emerald-neon);
  background: var(--bg-card-hover);
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.35);
}

.cmd-header {
  display: flex;
  gap: 0.55rem;
  margin-bottom: 0.75rem;
}

.cmd-badge {
  font-size: 0.8rem;
  font-weight: 800;
  padding: 0.3rem 0.65rem;
  border-radius: 6px;
  font-family: monospace;
}

.cmd-badge.slash {
  background: rgba(0, 245, 155, 0.16);
  color: var(--emerald-neon);
  border: 1px solid var(--border-emerald);
}

.cmd-badge.prefix {
  background: rgba(245, 197, 24, 0.16);
  color: var(--gold-main);
  border: 1px solid var(--border-gold);
}

.cmd-name {
  font-size: 1.1rem;
  font-weight: 800;
  margin-bottom: 0.45rem;
  color: #fff;
}

.cmd-desc {
  font-size: 0.9rem;
  color: var(--text-muted);
}

/* ================= DEĞERLENDİRMELER (VOUCHES) ================= */
.vouches-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(310px, 1fr));
  gap: 1.6rem;
}

.vouch-card {
  background: var(--bg-card);
  border: 1px solid var(--border-emerald);
  border-radius: var(--radius-lg);
  padding: 2rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
}

.vouch-stars {
  color: var(--gold-main);
  font-size: 1.3rem;
  margin-bottom: 0.9rem;
  letter-spacing: 2px;
  text-shadow: 0 0 10px rgba(245, 197, 24, 0.4);
}

.vouch-text {
  font-size: 0.98rem;
  color: var(--text-secondary);
  font-style: italic;
  margin-bottom: 1.3rem;
  line-height: 1.6;
}

.vouch-author {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid var(--border-emerald);
  padding-top: 0.9rem;
}

.vouch-user {
  font-weight: 700;
  font-size: 0.92rem;
  color: #fff;
}

.vouch-badge {
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--emerald-neon);
  background: rgba(0, 245, 155, 0.14);
  padding: 0.25rem 0.65rem;
  border-radius: 14px;
  border: 1px solid var(--border-emerald);
}

/* ================= VOUCH BOŞ DURUM (EMPTY STATE) ================= */
.vouches-container-wrap {
  width: 100%;
}

.vouches-empty-state {
  max-width: 680px;
  margin: 0 auto;
  text-align: center;
  padding: 3.5rem 2rem;
  background: var(--bg-card);
  border: 1.5px dashed var(--border-gold);
  border-radius: var(--radius-xl);
  backdrop-filter: blur(14px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
}

.empty-icon-box {
  width: 70px;
  height: 70px;
  margin: 0 auto 1.4rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.2rem;
  border-radius: 50%;
  background: rgba(245, 197, 24, 0.12);
  border: 1.5px solid var(--border-gold);
  box-shadow: 0 0 20px rgba(245, 197, 24, 0.25);
  animation: pulse-dot 2.5s infinite;
}

.empty-title {
  font-family: var(--font-display);
  font-size: 1.45rem;
  font-weight: 800;
  color: #fff;
  margin-bottom: 0.8rem;
}

.empty-desc {
  font-size: 0.98rem;
  color: var(--text-muted);
  line-height: 1.7;
  margin-bottom: 1.6rem;
}

.empty-desc code {
  color: var(--gold-main);
  background: rgba(245, 197, 24, 0.1);
  padding: 0.2rem 0.5rem;
  border-radius: 6px;
  font-family: monospace;
  border: 1px solid rgba(245, 197, 24, 0.2);
}

.highlight-ch {
  color: var(--emerald-neon);
  font-weight: 700;
}

.empty-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.45rem 1.1rem;
  background: rgba(0, 245, 155, 0.08);
  border: 1px solid var(--border-emerald);
  border-radius: 20px;
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--emerald-neon);
}

/* ================= KURALLAR BÖLÜMÜ ================= */
.rules-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1.6rem;
}

.rule-box {
  background: var(--bg-card);
  border: 1px solid var(--border-emerald);
  border-radius: var(--radius-lg);
  padding: 2.2rem 1.8rem;
  position: relative;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
}

.rule-num {
  font-family: var(--font-display);
  font-size: 2.4rem;
  font-weight: 900;
  color: var(--gold-main);
  opacity: 0.8;
  margin-bottom: 0.8rem;
  text-shadow: 0 0 15px rgba(245, 197, 24, 0.3);
}

.rule-title {
  font-size: 1.2rem;
  font-weight: 800;
  margin-bottom: 0.55rem;
  color: #fff;
}

.rule-desc {
  font-size: 0.92rem;
  color: var(--text-muted);
  line-height: 1.65;
}

/* ================= CTA BANNER ================= */
.cta-section {
  padding: 3rem 1.5rem 6.5rem;
}

.cta-box {
  max-width: 1040px;
  margin: 0 auto;
  background: 
    linear-gradient(135deg, rgba(0, 245, 155, 0.2) 0%, rgba(8, 28, 20, 0.96) 50%, rgba(245, 197, 24, 0.2) 100%);
  border: 2px solid var(--border-gold);
  border-radius: var(--radius-xl);
  padding: 4.5rem 2rem;
  text-align: center;
  box-shadow: 
    0 20px 60px rgba(0, 0, 0, 0.7),
    0 0 50px rgba(0, 245, 155, 0.25),
    0 0 40px rgba(245, 197, 24, 0.2);
}

.cta-title {
  font-family: var(--font-display);
  font-size: 2.8rem;
  font-weight: 900;
  margin-bottom: 1.1rem;
}

.cta-desc {
  max-width: 650px;
  margin: 0 auto 2.4rem;
  color: var(--text-secondary);
  font-size: 1.15rem;
}

/* ================= FOOTER ================= */
.footer {
  background: #020805;
  border-top: 1px solid var(--border-emerald);
  padding: 3.8rem 1.5rem 2.2rem;
}

.footer-container {
  max-width: 1240px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  flex-wrap: wrap;
  padding-bottom: 2.5rem;
  border-bottom: 1px solid var(--border-emerald);
}

.footer-logo {
  font-family: var(--font-display);
  font-size: 1.6rem;
  font-weight: 900;
  letter-spacing: 1px;
  background: linear-gradient(180deg, var(--gold-bright) 0%, var(--gold-main) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.footer-text {
  font-size: 0.9rem;
  color: var(--text-muted);
  margin-top: 0.25rem;
}

.footer-pill {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.5rem 1.1rem;
  background: rgba(0, 245, 155, 0.06);
  border: 1px solid var(--border-emerald);
  border-radius: 25px;
  font-size: 0.85rem;
  color: var(--text-secondary);
}

.footer-right {
  display: flex;
  gap: 1.6rem;
}

.footer-link {
  color: var(--text-muted);
  text-decoration: none;
  font-size: 0.95rem;
  transition: color 0.2s;
}

.footer-link:hover {
  color: var(--gold-main);
}

.footer-bottom {
  max-width: 1240px;
  margin: 2rem auto 0;
  text-align: center;
  font-size: 0.85rem;
  color: var(--text-muted);
}

/* ================= TAM KAPSAMLI MOBİL & TABLET DUYARLILIK SİSTEMİ ================= */

@media (max-width: 1220px) {
  .hero-title {
    font-size: clamp(2.4rem, 6.5vw, 3.4rem);
  }

  .live-ping-pill {
    display: none !important;
  }

  .mobile-menu-btn {
    display: flex;
  }

  .nav-links {
    display: none;
  }

  .nav-links.active {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    width: 100% !important;
    max-width: 100vw !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
    background: rgba(3, 14, 9, 0.98);
    backdrop-filter: blur(25px);
    -webkit-backdrop-filter: blur(25px);
    padding: 1.5rem 1.25rem 2rem;
    border-bottom: 2px solid var(--border-emerald);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.9);
    gap: 0.65rem;
    z-index: 999;
    animation: slideDownNav 0.25s ease-out forwards;
  }

  .nav-link {
    padding: 0.85rem 1.2rem !important;
    height: auto !important;
    font-size: 1.05rem !important;
    font-weight: 700 !important;
    color: var(--text-secondary) !important;
    border-radius: var(--radius-sm) !important;
    background: rgba(0, 245, 155, 0.04) !important;
    border: 1px solid rgba(0, 245, 155, 0.12) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    transition: all 0.2s ease !important;
    white-space: nowrap !important;
  }

  .nav-link:hover, .nav-link:active {
    background: rgba(245, 197, 24, 0.12) !important;
    border-color: var(--gold-main) !important;
    color: var(--gold-bright) !important;
    text-shadow: 0 0 10px rgba(245, 197, 24, 0.5) !important;
  }
}

@media (max-width: 868px) {

  /* Parıltı Orbları & Arka Plan Işıkları Mobilde Taşmayı Engelleme */
  .glow-top {
    width: 320px !important;
    height: 320px !important;
    top: -50px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    filter: blur(65px) !important;
  }

  .glow-middle {
    width: 280px !important;
    height: 280px !important;
    top: 35% !important;
    right: -40px !important;
    filter: blur(65px) !important;
  }

  .glow-bottom {
    width: 300px !important;
    height: 300px !important;
    top: 75% !important;
    left: -40px !important;
    filter: blur(75px) !important;
  }

  .hero-bg-glow {
    width: 90vw !important;
    max-width: 360px !important;
    height: 240px !important;
    filter: blur(55px) !important;
  }

  .vip-card-glow {
    width: 85vw !important;
    max-width: 300px !important;
    height: 240px !important;
    filter: blur(50px) !important;
  }

  .hero-section {
    padding: 4rem 1rem 3rem;
    min-height: auto;
  }

  .hero-bg-img {
    opacity: 0.28;
    object-position: center;
  }

  .hero-badge {
    font-size: 0.82rem;
    padding: 0.45rem 1rem;
    max-width: 100%;
    line-height: 1.4;
  }

  .hero-title {
    font-size: clamp(2rem, 7.5vw, 2.9rem);
    letter-spacing: -0.5px;
  }

  .hero-desc {
    font-size: 1.02rem;
    padding: 0 0.5rem;
    margin-bottom: 2rem;
  }

  .hero-status-strip {
    flex-direction: column;
    width: 100%;
    max-width: 360px;
    padding: 1.1rem 1.25rem;
    gap: 0.75rem;
    border-radius: 20px;
  }

  .status-separator {
    display: none;
  }

  /* Section Padding */
  .section {
    padding: 3.8rem 1rem;
  }

  .section-header {
    margin-bottom: 2.5rem;
  }

  .section-title {
    font-size: clamp(1.65rem, 5.5vw, 2.2rem);
  }

  .section-desc {
    font-size: 0.95rem;
  }

  /* VIP Kart */
  .vip-stat-card {
    padding: 2.5rem 1.25rem;
    border-radius: var(--radius-lg);
    margin-bottom: 2rem;
  }

  .vip-number {
    font-size: clamp(3.2rem, 12vw, 4.8rem);
  }

  .vip-plus {
    font-size: 2.6rem;
  }

  .vip-badge {
    font-size: 0.75rem;
    padding: 0.35rem 0.9rem;
    letter-spacing: 1px;
    line-height: 1.3;
  }

  .vip-title {
    font-size: 1.35rem;
  }

  .vip-desc {
    font-size: 0.92rem;
  }

  /* Tüm Izgaralar Mobilde Tek Sütun */
  .stats-grid,
  .steps-grid,
  .features-grid,
  .commands-grid,
  .vouches-grid,
  .rules-grid,
  .scammer-portal-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 1.25rem !important;
    width: 100% !important;
  }

  .stat-card,
  .step-card,
  .feature-card,
  .cmd-card,
  .vouch-card,
  .rule-box,
  .portal-card {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  .vouch-author {
    flex-wrap: wrap !important;
    gap: 0.5rem !important;
  }

  .vouch-user {
    word-break: break-all !important;
  }

  .stat-card {
    padding: 1.35rem;
    gap: 1.1rem;
  }

  .stat-icon-wrap {
    width: 52px;
    height: 52px;
  }

  .stat-icon-wrap svg {
    width: 24px;
    height: 24px;
  }

  .stat-number {
    font-size: 2rem;
  }

  .command-categories {
    gap: 0.5rem;
    margin-bottom: 2rem;
  }

  .cmd-filter-btn {
    padding: 0.5rem 0.95rem;
    font-size: 0.82rem;
  }

  /* CTA Bölümü */
  .cta-section {
    padding: 2rem 1rem 4.5rem;
  }

  .cta-box {
    padding: 3rem 1.25rem;
    border-radius: var(--radius-lg);
  }

  .cta-title {
    font-size: clamp(1.8rem, 6.5vw, 2.3rem);
  }

  .cta-desc {
    font-size: 0.98rem;
    margin-bottom: 1.8rem;
  }

  /* Footer */
  .footer {
    padding: 2.8rem 1rem 1.8rem;
  }

  .footer-container {
    flex-direction: column;
    text-align: center;
    gap: 1.6rem;
    padding-bottom: 1.8rem;
  }

  .footer-pill {
    justify-content: center;
  }

  .footer-right {
    justify-content: center;
    gap: 1.4rem;
  }
}

/* Küçük Telefonlar (Akıllı Telefonlar <= 600px) */
@media (max-width: 600px) {
  .nav-container {
    padding: 0 1rem;
  }

  .brand-title {
    font-size: 1.15rem;
  }

  .brand-subtitle {
    font-size: 0.68rem;
  }

  .logo-box {
    width: 38px;
    height: 38px;
  }

  .hero-buttons {
    flex-direction: column;
    width: 100%;
    max-width: 320px;
    margin: 0 auto 2.5rem;
    gap: 0.85rem;
  }

  .hero-buttons .btn {
    width: 100%;
  }

  .cta-box .btn {
    width: 100%;
    max-width: 320px;
  }

  .takas-url-pill {
    font-size: 0.95rem;
    padding: 0.5rem 1.2rem;
    max-width: 100%;
  }

  /* Dolandırıcı Sorgulama & İhbar Formu Mobilde Tam Uyum */
  .search-input-wrap {
    flex-direction: column !important;
    width: 100% !important;
    gap: 0.65rem !important;
  }

  .portal-search-btn {
    width: 100% !important;
    padding: 0.85rem !important;
    justify-content: center !important;
    display: flex !important;
  }

  .portal-card {
    padding: 1.5rem 1.15rem !important;
    border-radius: 20px !important;
  }

  .portal-form-row {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }

  .result-detail-row {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 0.25rem !important;
  }

  .result-detail-val {
    text-align: left !important;
    word-break: break-all !important;
  }
}

/* ================= <span class="tk-e tk-sword"></span> MM2 MAĞAZA VE BUTON STİLLERİ ================= */
.btn-mm2 {
  background: linear-gradient(135deg, #00F59B 0%, #059669 60%, #02422c 100%) !important;
  color: #020b07 !important;
  font-weight: 800 !important;
  border: 1.5px solid #00F59B !important;
  box-shadow: 0 0 25px rgba(0, 245, 155, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.4) !important;
  position: relative !important;
  overflow: hidden !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.65rem !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.btn-mm2:hover {
  transform: translateY(-3px) scale(1.02) !important;
  box-shadow: 0 0 35px rgba(0, 245, 155, 0.7), 0 10px 30px rgba(0, 0, 0, 0.6) !important;
  border-color: #FFF4A3 !important;
  color: #000000 !important;
}

.btn-badge-pill {
  background: rgba(2, 11, 7, 0.75) !important;
  color: #00F59B !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  padding: 0.2rem 0.55rem !important;
  border-radius: 20px !important;
  border: 1px solid rgba(0, 245, 155, 0.4) !important;
  letter-spacing: 0.4px !important;
  text-transform: uppercase !important;
}

.nav-mm2-pill {
  background: linear-gradient(135deg, rgba(0, 245, 155, 0.16) 0%, rgba(245, 197, 24, 0.12) 100%) !important;
  border: 1.5px solid rgba(0, 245, 155, 0.45) !important;
  color: #00F59B !important;
  font-weight: 800 !important;
  border-radius: 20px !important;
  padding: 0 0.85rem !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.4rem !important;
  height: 38px !important;
  line-height: 1 !important;
  box-shadow: 0 0 16px rgba(0, 245, 155, 0.25) !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  transition: all 0.25s ease !important;
}

.nav-mm2-pill:hover {
  background: rgba(0, 245, 155, 0.28) !important;
  border-color: #00F59B !important;
  color: #ffffff !important;
  box-shadow: 0 0 24px rgba(0, 245, 155, 0.5) !important;
  transform: translateY(-2px) !important;
}

.badge-auto-pill {
  background: rgba(0, 245, 155, 0.12) !important;
  border: 1px solid rgba(0, 245, 155, 0.35) !important;
  color: #00F59B !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  padding: 0.3rem 0.7rem !important;
  border-radius: 20px !important;
}

.mm2-showcase-card {
  background: radial-gradient(circle at 10% 20%, rgba(0, 245, 155, 0.1) 0%, rgba(4, 20, 13, 0.95) 90%) !important;
  border: 2px solid rgba(0, 245, 155, 0.35) !important;
  border-radius: 26px !important;
  padding: 3rem !important;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.7), 0 0 40px rgba(0, 245, 155, 0.2) !important;
  position: relative !important;
  overflow: hidden !important;
  display: grid !important;
  grid-template-columns: 1.25fr 0.75fr !important;
  gap: 2.5rem !important;
  align-items: center !important;
  margin-top: 2rem !important;
}

.mm2-showcase-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, transparent, #00F59B, #F5C518, transparent);
}

@media (max-width: 900px) {
  .mm2-showcase-card {
    grid-template-columns: 1fr !important;
    padding: 2rem 1.4rem !important;
    gap: 1.8rem !important;
  }
}

/* 520px ve Altı Ekranlar: Buton Simgeye Dönüşür (Asla Taşma Yapmaz) */
@media (max-width: 520px) {
  .nav-actions .btn span {
    display: none !important;
  }

  .nav-actions .btn {
    padding: 0 !important;
    border-radius: 50% !important;
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .nav-actions .btn svg {
    margin: 0 !important;
    width: 18px !important;
    height: 18px !important;
  }

  .vip-footer {
    font-size: 0.8rem;
    padding: 0.35rem 0.8rem;
  }
}

/* ==========================================================================
   DOLANDIRICI SORGULAMA & GÜVENLİK İHBAR PORTALI STILLERI (PREMIUM LÜKS TEMA)
   ========================================================================== */

.scammer-section {
  position: relative;
  padding: 5.5rem 1.5rem;
  background: radial-gradient(ellipse at top center, rgba(0, 245, 155, 0.06) 0%, transparent 70%);
}

.section-tag-danger {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.4rem 1rem;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
  background: rgba(255, 71, 87, 0.14) !important;
  color: #FF6B81 !important;
  border: 1px solid rgba(255, 71, 87, 0.45) !important;
  box-shadow: 0 0 16px rgba(255, 71, 87, 0.25) !important;
  margin-bottom: 1rem;
}

.scammer-portal-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 2.2rem !important;
  margin-top: 2.5rem !important;
  align-items: stretch !important;
}

.portal-card {
  background: rgba(6, 25, 17, 0.88) !important;
  border: 1.5px solid rgba(0, 245, 155, 0.3) !important;
  border-radius: 24px !important;
  padding: 2.4rem !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  position: relative !important;
  overflow: hidden !important;
}

.portal-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, #00F59B, transparent);
  opacity: 0.7;
}

.portal-card.report-card::before {
  background: linear-gradient(90deg, transparent, #F5C518, #FF4757, transparent);
}

.portal-card:hover {
  border-color: #00F59B !important;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.7), 0 0 30px rgba(0, 245, 155, 0.22) !important;
  transform: translateY(-4px) !important;
}

.portal-card.report-card:hover {
  border-color: #F5C518 !important;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.7), 0 0 30px rgba(245, 197, 24, 0.22) !important;
}

.portal-card-header {
  display: flex !important;
  align-items: center !important;
  gap: 1.1rem !important;
  margin-bottom: 1.8rem !important;
  padding-bottom: 1.3rem !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.portal-icon-wrap {
  width: 56px !important;
  height: 56px !important;
  border-radius: 16px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 1.65rem !important;
  flex-shrink: 0 !important;
}

.search-icon-wrap {
  background: radial-gradient(circle, rgba(0, 245, 155, 0.25) 0%, rgba(6, 30, 20, 0.8) 100%) !important;
  border: 1.5px solid #00F59B !important;
  box-shadow: 0 0 18px rgba(0, 245, 155, 0.35) !important;
}

.report-icon-wrap {
  background: radial-gradient(circle, rgba(255, 71, 87, 0.25) 0%, rgba(30, 8, 12, 0.8) 100%) !important;
  border: 1.5px solid #FF4757 !important;
  box-shadow: 0 0 18px rgba(255, 71, 87, 0.35) !important;
}

.portal-card-title {
  font-family: 'Outfit', sans-serif !important;
  font-size: 1.35rem !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  margin-bottom: 0.25rem !important;
  letter-spacing: -0.3px !important;
}

.portal-card-subtitle {
  font-size: 0.88rem !important;
  color: #83a897 !important;
  line-height: 1.4 !important;
}

.portal-form {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
}

.portal-form-group {
  display: flex !important;
  flex-direction: column !important;
  margin-bottom: 1.2rem !important;
  text-align: left !important;
}

.portal-form-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 1.1rem !important;
  margin-bottom: 1.2rem !important;
}

.portal-label {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 0.55rem !important;
  font-size: 0.88rem !important;
  font-weight: 700 !important;
  color: #FFF2A1 !important;
  letter-spacing: 0.3px !important;
}

.portal-label .req {
  color: #FF4757 !important;
  font-weight: 800 !important;
  font-size: 0.8rem !important;
}

.portal-input,
.portal-textarea {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  background: rgba(3, 16, 10, 0.92) !important;
  border: 1.5px solid rgba(0, 245, 155, 0.3) !important;
  border-radius: 12px !important;
  padding: 0.85rem 1.15rem !important;
  color: #ffffff !important;
  font-family: 'Inter', -apple-system, sans-serif !important;
  font-size: 0.95rem !important;
  outline: none !important;
  transition: all 0.25s ease !important;
  box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.6) !important;
}

.portal-input:focus,
.portal-textarea:focus {
  border-color: #00F59B !important;
  box-shadow: 0 0 18px rgba(0, 245, 155, 0.35), inset 0 2px 6px rgba(0, 0, 0, 0.6) !important;
  background: rgba(4, 22, 14, 0.98) !important;
}

.portal-input::placeholder,
.portal-textarea::placeholder {
  color: rgba(131, 168, 151, 0.65) !important;
  font-size: 0.9rem !important;
}

.portal-textarea {
  resize: vertical !important;
  min-height: 95px !important;
  line-height: 1.5 !important;
}

.search-input-wrap {
  display: flex !important;
  gap: 0.75rem !important;
  align-items: stretch !important;
}

.search-input-wrap .portal-input {
  flex: 1 !important;
}

.portal-hint {
  margin-top: 0.55rem !important;
  font-size: 0.82rem !important;
  color: #83a897 !important;
  line-height: 1.45 !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 0.4rem !important;
}

/* Arama Sonuç Paneli */
.search-result-box {
  margin-top: 1.4rem !important;
  min-height: 155px !important;
  border-radius: 16px !important;
  background: rgba(2, 12, 8, 0.75) !important;
  border: 1.5px dashed rgba(0, 245, 155, 0.3) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  overflow: hidden !important;
  transition: all 0.3s ease !important;
}

.result-placeholder {
  padding: 1.8rem !important;
  text-align: center !important;
  color: #83a897 !important;
  font-size: 0.92rem !important;
  line-height: 1.55 !important;
}

.placeholder-icon {
  display: block !important;
  font-size: 2.2rem !important;
  margin-bottom: 0.6rem !important;
  opacity: 0.85 !important;
}

/* Temiz Sonuç */
.result-safe {
  padding: 1.8rem !important;
  text-align: center !important;
  background: rgba(0, 245, 155, 0.08) !important;
  border: 1.5px solid #00F59B !important;
  border-radius: 16px !important;
  box-shadow: inset 0 0 25px rgba(0, 245, 155, 0.15) !important;
  animation: fadeInResult 0.35s ease !important;
}

.result-safe-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  color: #00F59B !important;
  font-weight: 800 !important;
  font-size: 1.15rem !important;
  margin-bottom: 0.6rem !important;
  text-shadow: 0 0 12px rgba(0, 245, 155, 0.4) !important;
}

.result-safe-desc {
  font-size: 0.92rem !important;
  color: #e4f5ed !important;
  line-height: 1.6 !important;
}

/* Tehlikeli / Dolandırıcı Sonuç */
.result-danger {
  padding: 1.8rem !important;
  background: rgba(255, 71, 87, 0.12) !important;
  border: 1.5px solid #FF4757 !important;
  border-radius: 16px !important;
  box-shadow: 0 0 30px rgba(255, 71, 87, 0.3), inset 0 0 20px rgba(255, 71, 87, 0.15) !important;
  animation: fadeInResult 0.35s ease !important;
}

.result-danger-badge {
  display: flex !important;
  align-items: center !important;
  gap: 0.6rem !important;
  color: #FF4757 !important;
  font-weight: 900 !important;
  font-size: 1.18rem !important;
  margin-bottom: 1.1rem !important;
  text-shadow: 0 0 15px rgba(255, 71, 87, 0.6) !important;
  border-bottom: 1px solid rgba(255, 71, 87, 0.3) !important;
  padding-bottom: 0.75rem !important;
}

.result-danger-details {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.65rem !important;
  font-size: 0.9rem !important;
}

.result-detail-row {
  display: flex !important;
  justify-content: space-between !important;
  gap: 1rem !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  padding-bottom: 0.45rem !important;
}

.result-detail-key {
  color: #83a897 !important;
  font-weight: 600 !important;
  flex-shrink: 0 !important;
}

.result-detail-val {
  color: #ffffff !important;
  font-weight: 700 !important;
  word-break: break-all !important;
  text-align: right !important;
}

/* Geri Bildirim Kutusu */
.report-feedback-box {
  margin-top: 1.1rem !important;
  padding: 1rem 1.2rem !important;
  border-radius: 12px !important;
  font-size: 0.92rem !important;
  line-height: 1.5 !important;
  text-align: center !important;
  font-weight: 700 !important;
  animation: fadeInResult 0.35s ease !important;
}

.feedback-success {
  background: rgba(0, 245, 155, 0.16) !important;
  border: 1.5px solid #00F59B !important;
  color: #00F59B !important;
  box-shadow: 0 0 20px rgba(0, 245, 155, 0.25) !important;
}

.feedback-error {
  background: rgba(255, 71, 87, 0.16) !important;
  border: 1.5px solid #FF4757 !important;
  color: #FF6B81 !important;
  box-shadow: 0 0 20px rgba(255, 71, 87, 0.25) !important;
}

.w-100 {
  width: 100% !important;
}

@keyframes fadeInResult {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 900px) {
  .scammer-portal-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 1.8rem !important;
  }
}

@media (max-width: 600px) {
  .portal-card {
    padding: 1.5rem 1.15rem !important;
  }
  .search-input-wrap {
    flex-direction: column !important;
    width: 100% !important;
    gap: 0.65rem !important;
  }
  .portal-search-btn {
    width: 100% !important;
    padding: 0.85rem !important;
    justify-content: center !important;
  }
}

@media (max-width: 550px) {
  .portal-form-row {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }
  .result-detail-row {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 0.25rem !important;
  }
  .result-detail-val {
    text-align: left !important;
    word-break: break-all !important;
  }
}

/* ================= <span class="tk-e tk-sword"></span> MM2 MAĞAZA VE BUTON STİLLERİ ================= */
.btn-mm2 {
  background: linear-gradient(135deg, #00F59B 0%, #059669 60%, #02422c 100%) !important;
  color: #020b07 !important;
  font-weight: 800 !important;
  border: 1.5px solid #00F59B !important;
  box-shadow: 0 0 25px rgba(0, 245, 155, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.4) !important;
  position: relative !important;
  overflow: hidden !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.65rem !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.btn-mm2:hover {
  transform: translateY(-3px) scale(1.02) !important;
  box-shadow: 0 0 35px rgba(0, 245, 155, 0.7), 0 10px 30px rgba(0, 0, 0, 0.6) !important;
  border-color: #FFF4A3 !important;
  color: #000000 !important;
}

.btn-badge-pill {
  background: rgba(2, 11, 7, 0.75) !important;
  color: #00F59B !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  padding: 0.2rem 0.55rem !important;
  border-radius: 20px !important;
  border: 1px solid rgba(0, 245, 155, 0.4) !important;
  letter-spacing: 0.4px !important;
  text-transform: uppercase !important;
}

.nav-mm2-pill {
  background: linear-gradient(135deg, rgba(0, 245, 155, 0.16) 0%, rgba(245, 197, 24, 0.12) 100%) !important;
  border: 1.5px solid rgba(0, 245, 155, 0.45) !important;
  color: #00F59B !important;
  font-weight: 800 !important;
  border-radius: 20px !important;
  padding: 0 0.85rem !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.4rem !important;
  height: 38px !important;
  line-height: 1 !important;
  box-shadow: 0 0 16px rgba(0, 245, 155, 0.25) !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  transition: all 0.25s ease !important;
}

.nav-mm2-pill:hover {
  background: rgba(0, 245, 155, 0.28) !important;
  border-color: #00F59B !important;
  color: #ffffff !important;
  box-shadow: 0 0 24px rgba(0, 245, 155, 0.5) !important;
  transform: translateY(-2px) !important;
}

.badge-auto-pill {
  background: rgba(0, 245, 155, 0.12) !important;
  border: 1px solid rgba(0, 245, 155, 0.35) !important;
  color: #00F59B !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  padding: 0.3rem 0.7rem !important;
  border-radius: 20px !important;
}

.mm2-showcase-card {
  background: radial-gradient(circle at 10% 20%, rgba(0, 245, 155, 0.1) 0%, rgba(4, 20, 13, 0.95) 90%) !important;
  border: 2px solid rgba(0, 245, 155, 0.35) !important;
  border-radius: 26px !important;
  padding: 3rem !important;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.7), 0 0 40px rgba(0, 245, 155, 0.2) !important;
  position: relative !important;
  overflow: hidden !important;
  display: grid !important;
  grid-template-columns: 1.25fr 0.75fr !important;
  gap: 2.5rem !important;
  align-items: center !important;
  margin-top: 2rem !important;
}

.mm2-showcase-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, transparent, #00F59B, #F5C518, transparent);
}

@media (max-width: 900px) {
  .mm2-showcase-card {
    grid-template-columns: 1fr !important;
    padding: 2rem 1.4rem !important;
    gap: 1.8rem !important;
  }
}

/* ================= GÜNCEL TAKAS İLANLARI (CANLI YATAY DİKDÖRTGEN CAROUSEL) ================= */

.trade-listings-section {
  position: relative;
  padding: 5.5rem 1.5rem;
  background: radial-gradient(ellipse at 50% 0%, rgba(0, 245, 155, 0.08) 0%, transparent 70%),
              radial-gradient(ellipse at 80% 100%, rgba(245, 197, 24, 0.05) 0%, transparent 60%);
  border-top: 1px solid rgba(0, 245, 155, 0.12);
  border-bottom: 1px solid rgba(0, 245, 155, 0.12);
  overflow: hidden;
}

.trade-listings-header-wrap {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.5rem;
  margin-bottom: 1.5rem;
  flex-wrap: wrap;
}

.trade-listings-header-wrap .section-header-left {
  max-width: 650px;
}

.section-tag-gold {
  color: #F5C518 !important;
  background: rgba(245, 197, 24, 0.12) !important;
  border: 1px solid rgba(245, 197, 24, 0.35) !important;
  padding: 0.35rem 0.9rem !important;
  border-radius: 999px !important;
}

.trade-listings-header-actions {
  display: flex;
  align-items: center;
  gap: 0.85rem;
}

.carousel-nav-buttons {
  display: flex;
  gap: 0.5rem;
}

.carousel-nav-btn {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  border: 1px solid rgba(0, 245, 155, 0.3);
  background: rgba(4, 20, 13, 0.8);
  color: #00F59B;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
}

.carousel-nav-btn:hover {
  background: #00F59B;
  color: #020b07;
  border-color: #00F59B;
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0, 245, 155, 0.4);
}

.carousel-nav-btn:active {
  transform: translateY(0);
}

.trade-post-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.65rem 1.25rem !important;
  font-weight: 700 !important;
}

.trade-listings-viewport {
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
  padding: 1rem 0.25rem 2rem;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 245, 155, 0.4) rgba(4, 20, 13, 0.5);
  cursor: grab;
}

.trade-listings-viewport:active {
  cursor: grabbing;
}

.trade-listings-viewport::-webkit-scrollbar {
  height: 8px;
}

.trade-listings-viewport::-webkit-scrollbar-track {
  background: rgba(4, 20, 13, 0.6);
  border-radius: 10px;
}

.trade-listings-viewport::-webkit-scrollbar-thumb {
  background: linear-gradient(90deg, #00F59B, #F5C518);
  border-radius: 10px;
  box-shadow: 0 0 10px rgba(0, 245, 155, 0.5);
}

.trade-listings-track {
  display: flex;
  gap: 1.25rem;
  min-width: 100%;
  width: max-content;
}

.trade-listing-card {
  flex: 0 0 350px;
  max-width: 380px;
  scroll-snap-align: start;
  background: linear-gradient(155deg, rgba(8, 28, 19, 0.94) 0%, rgba(4, 15, 10, 0.98) 100%);
  border: 1.5px solid rgba(0, 245, 155, 0.22);
  border-radius: 18px;
  padding: 1.3rem;
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.5), 0 0 20px rgba(0, 245, 155, 0.05);
  transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
  position: relative;
  overflow: hidden;
  user-select: none;
}

.trade-listing-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2.5px;
  background: linear-gradient(90deg, transparent, #00F59B 40%, #F5C518 70%, transparent);
  opacity: 0.7;
}

.trade-listing-card:hover {
  transform: translateY(-4px);
  border-color: rgba(0, 245, 155, 0.55);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.65), 0 0 30px rgba(0, 245, 155, 0.18);
}

.tlc-header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.tlc-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 2px solid rgba(0, 245, 155, 0.45);
  object-fit: cover;
  background: rgba(0, 0, 0, 0.4);
  flex-shrink: 0;
}

.tlc-user-info {
  flex: 1;
  min-width: 0;
}

.tlc-display-name {
  font-weight: 700;
  font-size: 0.95rem;
  color: #ffffff;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  letter-spacing: -0.2px;
}

.tlc-username {
  font-size: 0.78rem;
  color: var(--text-muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tlc-type-badge {
  background: rgba(245, 197, 24, 0.14);
  border: 1px solid rgba(245, 197, 24, 0.35);
  color: #F5C518;
  padding: 0.22rem 0.6rem;
  border-radius: 7px;
  font-size: 0.72rem;
  font-weight: 800;
  white-space: nowrap;
  letter-spacing: 0.3px;
  flex-shrink: 0;
}

.tlc-boxes {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.tlc-box {
  background: rgba(2, 12, 7, 0.75);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 11px;
  padding: 0.7rem 0.85rem;
  transition: border-color 0.2s;
}

.tlc-box.tlc-offer {
  border-left: 3px solid #00F59B;
}

.tlc-box.tlc-request {
  border-left: 3px solid #F5C518;
}

.tlc-box-label {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.7rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.tlc-box.tlc-offer .tlc-box-label {
  color: #00F59B;
}

.tlc-box.tlc-request .tlc-box-label {
  color: #F5C518;
}

.tlc-box-content {
  margin-top: 0.3rem;
  font-size: 0.86rem;
  color: #f0f6fc;
  line-height: 1.45;
  word-break: break-word;
  max-height: 68px;
  overflow-y: auto;
}

.tlc-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 0.5rem;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  font-size: 0.75rem;
  color: var(--text-muted);
}

.tlc-time {
  display: flex;
  align-items: center;
  gap: 0.3rem;
  color: rgba(255, 255, 255, 0.6);
}

.tlc-id {
  font-family: monospace;
  font-size: 0.72rem;
  color: rgba(0, 245, 155, 0.75);
}

.trade-empty-state {
  width: 100%;
  min-width: 320px;
  padding: 3rem 1.5rem;
  text-align: center;
  background: rgba(4, 20, 13, 0.6);
  border: 1.5px dashed rgba(0, 245, 155, 0.25);
  border-radius: 18px;
  margin: 0 auto;
}

.trade-empty-state .empty-icon-box {
  font-size: 2.2rem;
  margin-bottom: 0.6rem;
}

.trade-empty-state .empty-title {
  font-size: 1.15rem;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 0.35rem;
}

.trade-empty-state .empty-desc {
  font-size: 0.88rem;
  color: var(--text-muted);
}

@media (max-width: 768px) {
  .trade-listing-card {
    flex: 0 0 290px;
    padding: 1.1rem;
  }
  
  .trade-listings-header-wrap {
    flex-direction: column;
    align-items: flex-start;
  }

  .trade-listings-header-actions {
    width: 100%;
    justify-content: space-between;
  }
}

.tlc-badge-wrap {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  flex-shrink: 0;
}

.tlc-delete-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  background: rgba(255, 71, 87, 0.16);
  border: 1px solid rgba(255, 71, 87, 0.45);
  color: #FF6B81;
  padding: 0.24rem 0.55rem;
  border-radius: 7px;
  font-size: 0.72rem;
  font-weight: 800;
  cursor: pointer;
  transition: all 0.2s ease;
  user-select: none;
}

.tlc-delete-btn:hover {
  background: #FF4757;
  color: #ffffff;
  border-color: #FF4757;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(255, 71, 87, 0.45);
}

.tlc-delete-btn:active {
  transform: translateY(0);
}

.tlc-ban-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  background: rgba(255, 71, 87, 0.25);
  border: 1px solid #FF4757;
  color: #ffffff;
  padding: 0.24rem 0.55rem;
  border-radius: 7px;
  font-size: 0.72rem;
  font-weight: 800;
  cursor: pointer;
  transition: all 0.2s ease;
  user-select: none;
}

.tlc-ban-btn:hover {
  background: #d63031;
  border-color: #ff7675;
  color: #ffffff;
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(214, 48, 49, 0.6);
}

.tlc-ban-btn:active {
  transform: translateY(0);
}

/* ================= ADMIN GİRİŞİ, BİLDİRİM VE ONAY MODALLARI ================= */

.admin-trigger-btn {
  padding: 0.45rem 0.85rem !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  border-color: rgba(0, 245, 155, 0.35) !important;
}

.admin-logged-in-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.4rem 0.85rem;
  background: rgba(0, 245, 155, 0.14);
  border: 1px solid rgba(0, 245, 155, 0.4);
  border-radius: 999px;
  color: #00F59B;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.3px;
}

.admin-logout-btn {
  background: none;
  border: none;
  color: #FF4757;
  font-size: 0.9rem;
  font-weight: 800;
  cursor: pointer;
  padding: 0 0.15rem;
  line-height: 1;
  transition: transform 0.15s;
}

.admin-logout-btn:hover {
  transform: scale(1.2);
}

.custom-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(1, 10, 6, 0.85);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  z-index: 999999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.2rem;
  animation: modalFadeIn 0.2s ease;
}

.custom-modal-box {
  background: linear-gradient(155deg, rgba(8, 28, 19, 0.98) 0%, rgba(3, 14, 9, 0.99) 100%);
  border: 1.5px solid rgba(0, 245, 155, 0.35);
  border-radius: 22px;
  max-width: 460px;
  width: 100%;
  padding: 1.8rem;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.85), 0 0 35px rgba(0, 245, 155, 0.15);
  position: relative;
  animation: modalPopIn 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.custom-modal-box.delete-confirm-box {
  border-color: rgba(255, 71, 87, 0.5) !important;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.85), 0 0 35px rgba(255, 71, 87, 0.25) !important;
}

.custom-modal-box.ban-confirm-box {
  border-color: rgba(255, 71, 87, 0.65) !important;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.85), 0 0 45px rgba(255, 71, 87, 0.35) !important;
}

.custom-modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1.1rem;
  padding-bottom: 0.8rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.modal-header-title {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}

.modal-header-title .modal-icon {
  font-size: 1.35rem;
}

.modal-header-title h3 {
  font-family: var(--font-display);
  font-size: 1.18rem;
  font-weight: 800;
  margin: 0;
  color: #ffffff;
}

.modal-close-btn {
  background: none;
  border: none;
  color: var(--text-muted);
  font-size: 1.6rem;
  cursor: pointer;
  line-height: 1;
  padding: 0 0.2rem;
  transition: color 0.2s;
}

.modal-close-btn:hover {
  color: #ffffff;
}

.modal-subtitle {
  font-size: 0.88rem;
  color: var(--text-muted);
  line-height: 1.5;
  margin-bottom: 1.25rem;
}

.modal-input-group {
  margin-bottom: 1.2rem;
}

.modal-input-group label {
  display: block;
  font-size: 0.82rem;
  font-weight: 700;
  color: #c4ded1;
  margin-bottom: 0.45rem;
}

.modal-text-input {
  width: 100%;
  padding: 0.8rem 1rem;
  background: rgba(2, 12, 7, 0.85);
  border: 1.5px solid rgba(0, 245, 155, 0.3);
  border-radius: 11px;
  color: #ffffff;
  font-size: 0.95rem;
  outline: none;
  transition: border-color 0.2s, box-shadow 0.2s;
  box-sizing: border-box;
}

.modal-text-input:focus {
  border-color: #00F59B;
  box-shadow: 0 0 15px rgba(0, 245, 155, 0.3);
}

.modal-error-msg {
  padding: 0.65rem 0.9rem;
  background: rgba(255, 71, 87, 0.15);
  border: 1px solid #FF4757;
  border-radius: 9px;
  color: #FF6B81;
  font-size: 0.82rem;
  font-weight: 600;
  margin-bottom: 1rem;
}

.modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.75rem;
  margin-top: 1.4rem;
}

.delete-listing-preview {
  background: rgba(2, 12, 7, 0.85);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-left: 3px solid #FF4757;
  border-radius: 10px;
  padding: 0.85rem 1rem;
  margin-bottom: 1.2rem;
  font-size: 0.85rem;
  color: #f0f6fc;
  line-height: 1.45;
}

.btn-danger {
  background: #FF4757 !important;
  color: #ffffff !important;
  border: 1px solid #FF4757 !important;
  font-weight: 700 !important;
  box-shadow: 0 4px 15px rgba(255, 71, 87, 0.4) !important;
}

.btn-danger:hover {
  background: #e03040 !important;
  border-color: #e03040 !important;
  box-shadow: 0 6px 20px rgba(255, 71, 87, 0.6) !important;
  transform: translateY(-2px) !important;
}

.custom-toast {
  position: fixed;
  bottom: 24px;
  right: 24px;
  background: linear-gradient(135deg, rgba(7, 28, 18, 0.98), rgba(4, 15, 10, 0.98));
  border: 1.5px solid #00F59B;
  color: #ffffff;
  padding: 0.9rem 1.4rem;
  border-radius: 14px;
  font-size: 0.9rem;
  font-weight: 700;
  box-shadow: 0 12px 35px rgba(0, 0, 0, 0.8), 0 0 25px rgba(0, 245, 155, 0.3);
  z-index: 1000000;
  animation: toastSlideUp 0.3s ease;
}

@keyframes modalFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes modalPopIn {
  from { transform: scale(0.92); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}

@keyframes toastSlideUp {
  from { transform: translateY(20px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}




/* ============================================================================
   TAKAS PREMIUM ÖZEL EMOJİ SİSTEMİ (V2 - ULTRA HD)
   Zümrüt (#00F59B) & Altın (#F5C518) Lüks Tema
   ============================================================================ */
.tk-e {
  display: inline-block;
  width: 1.2em;
  height: 1.2em;
  vertical-align: -0.2em;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  flex-shrink: 0;
  line-height: 1;
}

.nav-link {
  gap: 0.45rem !important;
}

.nav-link .tk-e {
  width: 1.25em !important;
  height: 1.25em !important;
  font-size: 1.15em !important;
  filter: drop-shadow(0 2px 6px rgba(0, 245, 155, 0.35));
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), filter 0.25s ease;
}

.nav-link:hover .tk-e {
  transform: scale(1.22) rotate(-5deg);
  filter: drop-shadow(0 0 10px rgba(0, 245, 155, 0.75)) drop-shadow(0 0 4px #F5C518);
}

.nav-mm2-pill .tk-e {
  font-size: 1.3em !important;
  filter: drop-shadow(0 0 8px rgba(0, 245, 155, 0.65));
}

.nav-mm2-pill:hover .tk-e {
  transform: scale(1.28) rotate(-8deg);
  filter: drop-shadow(0 0 14px rgba(0, 245, 155, 0.9)) drop-shadow(0 0 6px #F5C518);
}
.tk-sword { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cdefs%3E%20%3ClinearGradient%20id%3D%22swB%22%20x1%3D%220%25%22%20y1%3D%220%25%22%20x2%3D%22100%25%22%20y2%3D%22100%25%22%3E%20%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23FFF2A1%22%2F%3E%20%3Cstop%20offset%3D%2240%25%22%20stop-color%3D%22%2300F59B%22%2F%3E%20%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%23059669%22%2F%3E%20%3C%2FlinearGradient%3E%20%3ClinearGradient%20id%3D%22swH%22%20x1%3D%220%25%22%20y1%3D%220%25%22%20x2%3D%22100%25%22%20y2%3D%22100%25%22%3E%20%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23FFF2A1%22%2F%3E%20%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%23D4AF37%22%2F%3E%20%3C%2FlinearGradient%3E%20%3C%2Fdefs%3E%20%3Cpath%20d%3D%22M21.5%202.5c-1.8%200-7%201.8-11.2%206-2.5%202.5-3.6%205.2-3.8%207l2.5%202.5c1.8-.2%204.5-1.3%207-3.8%204.2-4.2%206-9.4%206-11.2z%22%20fill%3D%22url(%23swB)%22%2F%3E%20%3Cpath%20d%3D%22M21.5%202.5c-1%200-5.5%201-9.5%205-2%202-2.8%204-3%205.5.8-.3%202.5-.8%204.5-2.5%203-2.5%206.5-6%208-8z%22%20fill%3D%22%23FFFFFF%22%20opacity%3D%220.5%22%2F%3E%20%3Cpath%20d%3D%22M6%2013.5l4.5%204.5-1.5%201.5-4.5-4.5z%22%20fill%3D%22url(%23swH)%22%2F%3E%20%3Ccircle%20cx%3D%228.2%22%20cy%3D%2215.8%22%20r%3D%221.4%22%20fill%3D%22%23FF4757%22%2F%3E%20%3Cpath%20d%3D%22M6.5%2016.5l-3.5%203.5c-.8.8-.8%202%200%202.8.8.8%202%20.8%202.8%200l3.5-3.5-2.8-2.8z%22%20fill%3D%22%2304140D%22%2F%3E%20%3Cline%20x1%3D%225.2%22%20y1%3D%2217.8%22%20x2%3D%226.6%22%20y2%3D%2219.2%22%20stroke%3D%22%23F5C518%22%20stroke-width%3D%220.9%22%2F%3E%20%3Cline%20x1%3D%224.2%22%20y1%3D%2218.8%22%20x2%3D%225.6%22%20y2%3D%2220.2%22%20stroke%3D%22%23F5C518%22%20stroke-width%3D%220.9%22%2F%3E%20%3Ccircle%20cx%3D%223.8%22%20cy%3D%2221.4%22%20r%3D%221.2%22%20fill%3D%22%2300F59B%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-chart { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cdefs%3E%20%3ClinearGradient%20id%3D%22ch1%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%220%22%20y2%3D%221%22%3E%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%2300F59B%22%2F%3E%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%23059669%22%2F%3E%3C%2FlinearGradient%3E%20%3ClinearGradient%20id%3D%22ch2%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%220%22%20y2%3D%221%22%3E%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23FFF2A1%22%2F%3E%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%23F5C518%22%2F%3E%3C%2FlinearGradient%3E%20%3ClinearGradient%20id%3D%22ch3%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%220%22%20y2%3D%221%22%3E%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%2300E8C6%22%2F%3E%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%2300F59B%22%2F%3E%3C%2FlinearGradient%3E%20%3C%2Fdefs%3E%20%3Crect%20x%3D%222.5%22%20y%3D%2212%22%20width%3D%225%22%20height%3D%229%22%20rx%3D%221.5%22%20fill%3D%22url(%23ch1)%22%2F%3E%20%3Crect%20x%3D%229.5%22%20y%3D%227%22%20width%3D%225%22%20height%3D%2214%22%20rx%3D%221.5%22%20fill%3D%22url(%23ch2)%22%2F%3E%20%3Crect%20x%3D%2216.5%22%20y%3D%222.5%22%20width%3D%225%22%20height%3D%2218.5%22%20rx%3D%221.5%22%20fill%3D%22url(%23ch3)%22%2F%3E%20%3Cpolyline%20points%3D%225%2C11%2012%2C5.5%2019%2C2%22%20fill%3D%22none%22%20stroke%3D%22%23FFFFFF%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%20%3Ccircle%20cx%3D%2219%22%20cy%3D%222%22%20r%3D%222.2%22%20fill%3D%22%23FFF2A1%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-sparkle { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cdefs%3E%20%3ClinearGradient%20id%3D%22spkG%22%20x1%3D%220%25%22%20y1%3D%220%25%22%20x2%3D%22100%25%22%20y2%3D%22100%25%22%3E%20%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23FFFFFF%22%2F%3E%20%3Cstop%20offset%3D%2240%25%22%20stop-color%3D%22%23FFF2A1%22%2F%3E%20%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%23F5C518%22%2F%3E%20%3C%2FlinearGradient%3E%20%3C%2Fdefs%3E%20%3Cpath%20d%3D%22M12%201%20C12%206.5%2013.5%208%2019%208%20C13.5%208%2012%209.5%2012%2015%20C12%209.5%2010.5%208%205%208%20C10.5%208%2012%206.5%2012%201%20Z%22%20fill%3D%22url(%23spkG)%22%2F%3E%20%3Cpath%20d%3D%22M18%2014%20C18%2017%2018.8%2017.8%2022%2018%20C18.8%2018.2%2018%2019%2018%2022%20C18%2019%2017.2%2018.2%2014%2018%20C17.2%2017.8%2018%2017%2018%2014%20Z%22%20fill%3D%22%2300F59B%22%2F%3E%20%3Ccircle%20cx%3D%226%22%20cy%3D%2218%22%20r%3D%221.8%22%20fill%3D%22%23FFF2A1%22%2F%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%228%22%20r%3D%221.4%22%20fill%3D%22%23FFFFFF%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-megaphone { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cdefs%3E%20%3ClinearGradient%20id%3D%22mgG%22%20x1%3D%220%25%22%20y1%3D%220%25%22%20x2%3D%22100%25%22%20y2%3D%22100%25%22%3E%20%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23FFF2A1%22%2F%3E%20%3Cstop%20offset%3D%2260%25%22%20stop-color%3D%22%23F5C518%22%2F%3E%20%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%23D4AF37%22%2F%3E%20%3C%2FlinearGradient%3E%20%3C%2Fdefs%3E%20%3Cpath%20d%3D%22M3%208.5v7h4.5l6.5%205V3.5L7.5%208.5H3z%22%20fill%3D%22url(%23mgG)%22%2F%3E%20%3Cpath%20d%3D%22M7%2015.5v4a1.5%201.5%200%20003%200v-2.8%22%20stroke%3D%22%23D4AF37%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20fill%3D%22none%22%2F%3E%20%3Cpath%20d%3D%22M16.5%207.5a6%206%200%20010%209%22%20fill%3D%22none%22%20stroke%3D%22%2300F59B%22%20stroke-width%3D%222.4%22%20stroke-linecap%3D%22round%22%2F%3E%20%3Cpath%20d%3D%22M20%204.5a10.5%2010.5%200%20010%2015%22%20fill%3D%22none%22%20stroke%3D%22%2300F59B%22%20stroke-width%3D%222.4%22%20stroke-linecap%3D%22round%22%2F%3E%20%3Crect%20x%3D%222%22%20y%3D%228.5%22%20width%3D%222%22%20height%3D%227%22%20rx%3D%221%22%20fill%3D%22%2304140D%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-scale { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cdefs%3E%20%3ClinearGradient%20id%3D%22scG%22%20x1%3D%220%25%22%20y1%3D%220%25%22%20x2%3D%22100%25%22%20y2%3D%22100%25%22%3E%20%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23FFF2A1%22%2F%3E%20%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%23F5C518%22%2F%3E%20%3C%2FlinearGradient%3E%20%3C%2Fdefs%3E%20%3Crect%20x%3D%2211%22%20y%3D%222%22%20width%3D%222%22%20height%3D%2219%22%20rx%3D%221%22%20fill%3D%22url(%23scG)%22%2F%3E%20%3Cpath%20d%3D%22M8%2021h8%22%20stroke%3D%22url(%23scG)%22%20stroke-width%3D%222.5%22%20stroke-linecap%3D%22round%22%2F%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%224%22%20r%3D%222%22%20fill%3D%22%2300F59B%22%2F%3E%20%3Cpath%20d%3D%22M3%207h18%22%20stroke%3D%22url(%23scG)%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%2F%3E%20%3Cpath%20d%3D%22M3%207l2.5%206h5L8%207%22%20stroke%3D%22%2300F59B%22%20stroke-width%3D%221.3%22%20fill%3D%22none%22%2F%3E%20%3Cpath%20d%3D%22M4%2013a4%204%200%20008%200H4z%22%20fill%3D%22%2300F59B%22%2F%3E%20%3Cpath%20d%3D%22M13.5%207l2.5%206h5L18.5%207%22%20stroke%3D%22%2300F59B%22%20stroke-width%3D%221.3%22%20fill%3D%22none%22%2F%3E%20%3Cpath%20d%3D%22M14.5%2013a4%204%200%20008%200h-8z%22%20fill%3D%22%2300F59B%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-star { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cdefs%3E%20%3ClinearGradient%20id%3D%22stG%22%20x1%3D%220%25%22%20y1%3D%220%25%22%20x2%3D%22100%25%22%20y2%3D%22100%25%22%3E%20%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23FFF2A1%22%2F%3E%20%3Cstop%20offset%3D%2245%25%22%20stop-color%3D%22%23F5C518%22%2F%3E%20%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%23D4AF37%22%2F%3E%20%3C%2FlinearGradient%3E%20%3ClinearGradient%20id%3D%22stF%22%20x1%3D%220%25%22%20y1%3D%220%25%22%20x2%3D%220%25%22%20y2%3D%22100%25%22%3E%20%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23FFFFFF%22%20stop-opacity%3D%220.6%22%2F%3E%20%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%23FFFFFF%22%20stop-opacity%3D%220%22%2F%3E%20%3C%2FlinearGradient%3E%20%3C%2Fdefs%3E%20%3Cpolygon%20points%3D%2212%2C1.5%2015.3%2C8.2%2022.7%2C9.3%2017.3%2C14.6%2018.6%2C22%2012%2C18.5%205.4%2C22%206.7%2C14.6%201.3%2C9.3%208.7%2C8.2%22%20fill%3D%22url(%23stG)%22%2F%3E%20%3Cpolygon%20points%3D%2212%2C1.5%2015.3%2C8.2%2012%2C12%22%20fill%3D%22url(%23stF)%22%2F%3E%20%3Cpolygon%20points%3D%2212%2C12%2022.7%2C9.3%2017.3%2C14.6%22%20fill%3D%22url(%23stF)%22%20opacity%3D%220.5%22%2F%3E%20%3Cpolygon%20points%3D%2212%2C12%2018.6%2C22%2012%2C18.5%22%20fill%3D%22%23B38600%22%20opacity%3D%220.35%22%2F%3E%20%3Cpolygon%20points%3D%2212%2C12%205.4%2C22%206.7%2C14.6%22%20fill%3D%22%23B38600%22%20opacity%3D%220.4%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-siren { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cdefs%3E%20%3ClinearGradient%20id%3D%22srR%22%20x1%3D%220%25%22%20y1%3D%220%25%22%20x2%3D%22100%25%22%20y2%3D%220%25%22%3E%20%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23FF6B81%22%2F%3E%20%3Cstop%20offset%3D%2240%25%22%20stop-color%3D%22%23FF4757%22%2F%3E%20%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%23B31224%22%2F%3E%20%3C%2FlinearGradient%3E%20%3C%2Fdefs%3E%20%3Crect%20x%3D%223%22%20y%3D%2218%22%20width%3D%2218%22%20height%3D%224%22%20rx%3D%222%22%20fill%3D%22%232d3436%22%2F%3E%20%3Crect%20x%3D%225%22%20y%3D%2216%22%20width%3D%2214%22%20height%3D%223%22%20fill%3D%22%23636e72%22%2F%3E%20%3Cpath%20d%3D%22M6%2016V9a6%206%200%200112%200v7H6z%22%20fill%3D%22url(%23srR)%22%2F%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2211%22%20r%3D%223.2%22%20fill%3D%22%23FFF2A1%22%2F%3E%20%3Cline%20x1%3D%2212%22%20y1%3D%222%22%20x2%3D%2212%22%20y2%3D%224.5%22%20stroke%3D%22%23FF4757%22%20stroke-width%3D%222.5%22%20stroke-linecap%3D%22round%22%2F%3E%20%3Cline%20x1%3D%223.5%22%20y1%3D%225.5%22%20x2%3D%225.5%22%20y2%3D%227.5%22%20stroke%3D%22%23FF4757%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%2F%3E%20%3Cline%20x1%3D%2220.5%22%20y1%3D%225.5%22%20x2%3D%2218.5%22%20y2%3D%227.5%22%20stroke%3D%22%23FF4757%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%2F%3E%20%3Cpath%20d%3D%22M8%209a4%204%200%20014-4%22%20stroke%3D%22%23FFFFFF%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20fill%3D%22none%22%20opacity%3D%220.6%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-scroll { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cdefs%3E%20%3ClinearGradient%20id%3D%22scP%22%20x1%3D%220%25%22%20y1%3D%220%25%22%20x2%3D%22100%25%22%20y2%3D%22100%25%22%3E%20%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23FFF8E7%22%2F%3E%20%3Cstop%20offset%3D%2260%25%22%20stop-color%3D%22%23FCE1A8%22%2F%3E%20%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%23D4AF37%22%2F%3E%20%3C%2FlinearGradient%3E%20%3C%2Fdefs%3E%20%3Cpath%20d%3D%22M6%203h12a2%202%200%20012%202v13a3%203%200%2001-3%203H7a3%203%200%2001-3-3V5a2%202%200%20012-2z%22%20fill%3D%22url(%23scP)%22%2F%3E%20%3Cpath%20d%3D%22M4%206a2%202%200%20012-2h12a2%202%200%20012%202H4z%22%20fill%3D%22%23F5C518%22%2F%3E%20%3Cline%20x1%3D%228%22%20y1%3D%228%22%20x2%3D%2216%22%20y2%3D%228%22%20stroke%3D%22%2304140D%22%20stroke-width%3D%221.4%22%20opacity%3D%220.4%22%20stroke-linecap%3D%22round%22%2F%3E%20%3Cline%20x1%3D%228%22%20y1%3D%2211.5%22%20x2%3D%2216%22%20y2%3D%2211.5%22%20stroke%3D%22%2304140D%22%20stroke-width%3D%221.4%22%20opacity%3D%220.4%22%20stroke-linecap%3D%22round%22%2F%3E%20%3Cline%20x1%3D%228%22%20y1%3D%2215%22%20x2%3D%2213%22%20y2%3D%2215%22%20stroke%3D%22%2304140D%22%20stroke-width%3D%221.4%22%20opacity%3D%220.4%22%20stroke-linecap%3D%22round%22%2F%3E%20%3Ccircle%20cx%3D%2216%22%20cy%3D%2216%22%20r%3D%222.5%22%20fill%3D%22%2300F59B%22%2F%3E%20%3Ccircle%20cx%3D%2216%22%20cy%3D%2216%22%20r%3D%221.2%22%20fill%3D%22%23F5C518%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-shield { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cdefs%3E%20%3ClinearGradient%20id%3D%22shB%22%20x1%3D%220%25%22%20y1%3D%220%25%22%20x2%3D%22100%25%22%20y2%3D%22100%25%22%3E%20%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%2300F59B%22%2F%3E%20%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%23059669%22%2F%3E%20%3C%2FlinearGradient%3E%20%3ClinearGradient%20id%3D%22shG%22%20x1%3D%220%25%22%20y1%3D%220%25%22%20x2%3D%22100%25%22%20y2%3D%22100%25%22%3E%20%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23FFF2A1%22%2F%3E%20%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%23F5C518%22%2F%3E%20%3C%2FlinearGradient%3E%20%3C%2Fdefs%3E%20%3Cpath%20d%3D%22M12%201.5L4%205.2v6.3c0%205.8%203.4%2011.2%208%2012.5%204.6-1.3%208-6.7%208-12.5V5.2L12%201.5z%22%20fill%3D%22url(%23shB)%22%2F%3E%20%3Cpath%20d%3D%22M12%203.8L5.8%206.7v4.8c0%204.5%202.6%208.8%206.2%209.8%203.6-1%206.2-5.3%206.2-9.8V6.7L12%203.8z%22%20fill%3D%22%2304140D%22%20opacity%3D%220.35%22%2F%3E%20%3Cpolygon%20points%3D%2212%2C7%2013.5%2C10.2%2017%2C10.6%2014.4%2C13%2015.1%2C16.5%2012%2C14.8%208.9%2C16.5%209.6%2C13%207%2C10.6%2010.5%2C10.2%22%20fill%3D%22url(%23shG)%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-trophy { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cdefs%3E%20%3ClinearGradient%20id%3D%22trG%22%20x1%3D%220%25%22%20y1%3D%220%25%22%20x2%3D%22100%25%22%20y2%3D%22100%25%22%3E%20%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23FFF2A1%22%2F%3E%20%3Cstop%20offset%3D%2260%25%22%20stop-color%3D%22%23F5C518%22%2F%3E%20%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%23D4AF37%22%2F%3E%20%3C%2FlinearGradient%3E%20%3C%2Fdefs%3E%20%3Cpath%20d%3D%22M6%203h12v7a6%206%200%2001-12%200V3z%22%20fill%3D%22url(%23trG)%22%2F%3E%20%3Cpath%20d%3D%22M6%205H3.5a2.5%202.5%200%20000%205H6%22%20stroke%3D%22%23F5C518%22%20stroke-width%3D%222%22%20fill%3D%22none%22%2F%3E%20%3Cpath%20d%3D%22M18%205h2.5a2.5%202.5%200%20010%205H18%22%20stroke%3D%22%23F5C518%22%20stroke-width%3D%222%22%20fill%3D%22none%22%2F%3E%20%3Crect%20x%3D%2210.5%22%20y%3D%2214%22%20width%3D%223%22%20height%3D%224%22%20fill%3D%22%23D4AF37%22%2F%3E%20%3Crect%20x%3D%227%22%20y%3D%2218%22%20width%3D%2210%22%20height%3D%223.5%22%20rx%3D%221.5%22%20fill%3D%22%2300F59B%22%2F%3E%20%3Cpolygon%20points%3D%2212%2C5.5%2013%2C7.5%2015.2%2C7.7%2013.6%2C9.2%2014%2C11.4%2012%2C10.3%2010%2C11.4%2010.4%2C9.2%208.8%2C7.7%2011%2C7.5%22%20fill%3D%22%23FFFFFF%22%20opacity%3D%220.8%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-bolt { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cdefs%3E%20%3ClinearGradient%20id%3D%22bltG%22%20x1%3D%220%25%22%20y1%3D%220%25%22%20x2%3D%22100%25%22%20y2%3D%22100%25%22%3E%20%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23FFF2A1%22%2F%3E%20%3Cstop%20offset%3D%2250%25%22%20stop-color%3D%22%23F5C518%22%2F%3E%20%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%2300F59B%22%2F%3E%20%3C%2FlinearGradient%3E%20%3C%2Fdefs%3E%20%3Cpolygon%20points%3D%2214%2C1.5%205%2C13%2012%2C13%2010%2C22.5%2019%2C10%2012%2C10%22%20fill%3D%22url(%23bltG)%22%2F%3E%20%3Cpolygon%20points%3D%2214%2C1.5%205%2C13%2012%2C13%2013%2C6%22%20fill%3D%22%23FFFFFF%22%20opacity%3D%220.4%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-gem { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cpolygon%20points%3D%2212%2C2%204.5%2C8.5%2012%2C22%2019.5%2C8.5%22%20fill%3D%22%23059669%22%2F%3E%20%3Cpolygon%20points%3D%2212%2C2%204.5%2C8.5%2012%2C9%22%20fill%3D%22%2300F59B%22%2F%3E%20%3Cpolygon%20points%3D%2212%2C2%2019.5%2C8.5%2012%2C9%22%20fill%3D%22%2300E8C6%22%2F%3E%20%3Cpolygon%20points%3D%224.5%2C8.5%2012%2C22%2012%2C9%22%20fill%3D%22%2300F59B%22%2F%3E%20%3Cpolygon%20points%3D%2219.5%2C8.5%2012%2C22%2012%2C9%22%20fill%3D%22%2300E8C6%22%20opacity%3D%220.8%22%2F%3E%20%3Cline%20x1%3D%2212%22%20y1%3D%222%22%20x2%3D%2212%22%20y2%3D%229%22%20stroke%3D%22%23FFFFFF%22%20stroke-width%3D%220.7%22%20opacity%3D%220.6%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-ticket { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cpath%20d%3D%22M3%206h18a1%201%200%20011%201v3.5a2.5%202.5%200%20000%205V19a1%201%200%2001-1%201H3a1%201%200%2001-1-1v-3.5a2.5%202.5%200%20000-5V7a1%201%200%20011-1z%22%20fill%3D%22%23F5C518%22%2F%3E%20%3Cline%20x1%3D%229%22%20y1%3D%226%22%20x2%3D%229%22%20y2%3D%2220%22%20stroke%3D%22%2304140D%22%20stroke-width%3D%221.2%22%20stroke-dasharray%3D%222.5%2C2.5%22%20opacity%3D%220.35%22%2F%3E%20%3Cpolygon%20points%3D%2215%2C10%2015.8%2C11.6%2017.5%2C11.8%2016.2%2C13%2016.6%2C14.7%2015%2C13.8%2013.4%2C14.7%2013.8%2C13%2012.5%2C11.8%2014.2%2C11.6%22%20fill%3D%22%2304140D%22%20opacity%3D%220.4%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-gift { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Crect%20x%3D%223%22%20y%3D%2210%22%20width%3D%2218%22%20height%3D%2211%22%20rx%3D%222%22%20fill%3D%22%2300F59B%22%2F%3E%20%3Crect%20x%3D%222.5%22%20y%3D%226.5%22%20width%3D%2219%22%20height%3D%224%22%20rx%3D%221.5%22%20fill%3D%22%23059669%22%2F%3E%20%3Crect%20x%3D%2210.5%22%20y%3D%226.5%22%20width%3D%223%22%20height%3D%2214.5%22%20fill%3D%22%23F5C518%22%2F%3E%20%3Cpath%20d%3D%22M12%206.5C12%206.5%208%202.5%206%203.5s.5%203%206%203%22%20fill%3D%22%23F5C518%22%2F%3E%20%3Cpath%20d%3D%22M12%206.5C12%206.5%2016%202.5%2018%203.5s-.5%203-6%203%22%20fill%3D%22%23F5C518%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-mic { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Crect%20x%3D%228.5%22%20y%3D%222%22%20width%3D%227%22%20height%3D%2211%22%20rx%3D%223.5%22%20fill%3D%22%2300F59B%22%2F%3E%20%3Cpath%20d%3D%22M4.5%209.5a7.5%207.5%200%200015%200%22%20stroke%3D%22%23F5C518%22%20stroke-width%3D%222.2%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%2F%3E%20%3Cline%20x1%3D%2212%22%20y1%3D%2217%22%20x2%3D%2212%22%20y2%3D%2221.5%22%20stroke%3D%22%23F5C518%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%2F%3E%20%3Cline%20x1%3D%228.5%22%20y1%3D%2221.5%22%20x2%3D%2215.5%22%20y2%3D%2221.5%22%20stroke%3D%22%23F5C518%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-plus { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Crect%20x%3D%229.5%22%20y%3D%223%22%20width%3D%225%22%20height%3D%2218%22%20rx%3D%222.5%22%20fill%3D%22%2300F59B%22%2F%3E%20%3Crect%20x%3D%223%22%20y%3D%229.5%22%20width%3D%2218%22%20height%3D%225%22%20rx%3D%222.5%22%20fill%3D%22%2300F59B%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-hourglass { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Crect%20x%3D%225%22%20y%3D%222%22%20width%3D%2214%22%20height%3D%222.5%22%20rx%3D%221.2%22%20fill%3D%22%23F5C518%22%2F%3E%20%3Crect%20x%3D%225%22%20y%3D%2219.5%22%20width%3D%2214%22%20height%3D%222.5%22%20rx%3D%221.2%22%20fill%3D%22%23F5C518%22%2F%3E%20%3Cpath%20d%3D%22M6.5%204.5l5.5%207.5-5.5%207.5h11l-5.5-7.5%205.5-7.5H6.5z%22%20fill%3D%22%23F5C518%22%20opacity%3D%220.85%22%2F%3E%20%3Cpath%20d%3D%22M9%204.5l3%204.5%203-4.5%22%20fill%3D%22%2300F59B%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-gamepad { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cpath%20d%3D%22M6%208h12a4%204%200%20014%204v1a4%204%200%2001-4%204h-1l-2%203h-2l-1-3H11l-1%203H8L6%2017H6a4%204%200%2001-4-4v-1a4%204%200%20014-4z%22%20fill%3D%22%2300F59B%22%2F%3E%20%3Crect%20x%3D%227%22%20y%3D%2210.5%22%20width%3D%222%22%20height%3D%224%22%20rx%3D%220.5%22%20fill%3D%22%2304140D%22%20opacity%3D%220.4%22%2F%3E%20%3Crect%20x%3D%226%22%20y%3D%2211.5%22%20width%3D%224%22%20height%3D%222%22%20rx%3D%220.5%22%20fill%3D%22%2304140D%22%20opacity%3D%220.4%22%2F%3E%20%3Ccircle%20cx%3D%2216%22%20cy%3D%2211.5%22%20r%3D%221.2%22%20fill%3D%22%23F5C518%22%2F%3E%20%3Ccircle%20cx%3D%2218%22%20cy%3D%2213.5%22%20r%3D%221.2%22%20fill%3D%22%23F5C518%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-cart { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cpath%20d%3D%22M1.5%202.5h2.5l3.6%2013a2%202%200%20001.9%201.5h8.5a2%202%200%20001.9-1.4L22%206.5H6.5%22%20stroke%3D%22%2300F59B%22%20stroke-width%3D%222.2%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%20%3Ccircle%20cx%3D%2210%22%20cy%3D%2220.5%22%20r%3D%221.8%22%20fill%3D%22%23F5C518%22%2F%3E%20%3Ccircle%20cx%3D%2217.5%22%20cy%3D%2220.5%22%20r%3D%221.8%22%20fill%3D%22%23F5C518%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-package { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cpath%20d%3D%22M2.5%207.5l9.5-5%209.5%205-9.5%205-9.5-5z%22%20fill%3D%22%23FFF2A1%22%2F%3E%20%3Cpath%20d%3D%22M2.5%207.5v9l9.5%205.5v-9l-9.5-5.5z%22%20fill%3D%22%23F5C518%22%2F%3E%20%3Cpath%20d%3D%22M21.5%207.5v9l-9.5%205.5v-9l9.5-5.5z%22%20fill%3D%22%23D4AF37%22%2F%3E%20%3Cline%20x1%3D%2212%22%20y1%3D%2212.5%22%20x2%3D%2212%22%20y2%3D%2222%22%20stroke%3D%22%2300F59B%22%20stroke-width%3D%220.8%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-chat { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cpath%20d%3D%22M3%204.5h18a2%202%200%20012%202v10a2%202%200%2001-2%202H7.5l-4.5%204V6.5a2%202%200%20012-2z%22%20fill%3D%22%2300F59B%22%2F%3E%20%3Ccircle%20cx%3D%228%22%20cy%3D%2211.5%22%20r%3D%221.5%22%20fill%3D%22%2304140D%22%20opacity%3D%220.45%22%2F%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2211.5%22%20r%3D%221.5%22%20fill%3D%22%2304140D%22%20opacity%3D%220.45%22%2F%3E%20%3Ccircle%20cx%3D%2216%22%20cy%3D%2211.5%22%20r%3D%221.5%22%20fill%3D%22%2304140D%22%20opacity%3D%220.45%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-handshake { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cpath%20d%3D%22M2%2011l4-4%203%201%203-3%204%204-3%203%201%203-4%204-3-3z%22%20fill%3D%22%2300F59B%22%2F%3E%20%3Cpath%20d%3D%22M14%207.5l4-4%204%204-2%202%22%20stroke%3D%22%23F5C518%22%20stroke-width%3D%222.2%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%2F%3E%20%3Cpath%20d%3D%22M10%207.5L6%203.5%202%207.5l2%202%22%20stroke%3D%22%23F5C518%22%20stroke-width%3D%222.2%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%2F%3E%20%3Cpath%20d%3D%22M8%2014.5l2.5%202.5%204.5-4.5%22%20stroke%3D%22%23FFFFFF%22%20stroke-width%3D%221.8%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%20opacity%3D%220.7%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-envelope { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Crect%20x%3D%222.5%22%20y%3D%224.5%22%20width%3D%2219%22%20height%3D%2215%22%20rx%3D%222.5%22%20fill%3D%22%2300F59B%22%2F%3E%20%3Cpath%20d%3D%22M2.5%204.5l9.5%208%209.5-8%22%20stroke%3D%22%2304140D%22%20stroke-width%3D%221.2%22%20fill%3D%22none%22%20opacity%3D%220.3%22%2F%3E%20%3Cpolygon%20points%3D%2212%2C12.5%202.5%2C4.5%2021.5%2C4.5%22%20fill%3D%22%23059669%22%20opacity%3D%220.35%22%2F%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2212.5%22%20r%3D%222%22%20fill%3D%22%23F5C518%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-bulb { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cpath%20d%3D%22M12%201.5a7.5%207.5%200%2000-4.5%2013.5V18h9v-3A7.5%207.5%200%200012%201.5z%22%20fill%3D%22%23F5C518%22%2F%3E%20%3Crect%20x%3D%229%22%20y%3D%2218%22%20width%3D%226%22%20height%3D%222%22%20rx%3D%221%22%20fill%3D%22%23D4AF37%22%2F%3E%20%3Crect%20x%3D%229.5%22%20y%3D%2220.5%22%20width%3D%225%22%20height%3D%222%22%20rx%3D%221%22%20fill%3D%22%23D4AF37%22%2F%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%228%22%20r%3D%222.5%22%20fill%3D%22%23FFFFFF%22%20opacity%3D%220.6%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-lockkey { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Crect%20x%3D%224%22%20y%3D%2210%22%20width%3D%2212%22%20height%3D%2211%22%20rx%3D%222.5%22%20fill%3D%22%23F5C518%22%2F%3E%20%3Cpath%20d%3D%22M7%2010V6.5a3.5%203.5%200%20017%200V10%22%20stroke%3D%22%23F5C518%22%20stroke-width%3D%222.5%22%20fill%3D%22none%22%2F%3E%20%3Ccircle%20cx%3D%2210%22%20cy%3D%2215%22%20r%3D%221.6%22%20fill%3D%22%2304140D%22%20opacity%3D%220.5%22%2F%3E%20%3Ccircle%20cx%3D%2219.5%22%20cy%3D%2217%22%20r%3D%222.2%22%20fill%3D%22%2300F59B%22%2F%3E%20%3Cpath%20d%3D%22M19.5%2015V7%22%20stroke%3D%22%2300F59B%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-warning { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cpath%20d%3D%22M12%201.5L1%2021.5h22L12%201.5z%22%20fill%3D%22%23F5C518%22%2F%3E%20%3Cpath%20d%3D%22M12%204.5L3.2%2020h17.6L12%204.5z%22%20fill%3D%22%23FFF2A1%22%2F%3E%20%3Crect%20x%3D%2211%22%20y%3D%229%22%20width%3D%222%22%20height%3D%226%22%20rx%3D%221%22%20fill%3D%22%2304140D%22%2F%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2217.5%22%20r%3D%221.3%22%20fill%3D%22%2304140D%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-hammer { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Crect%20x%3D%225.5%22%20y%3D%222.5%22%20width%3D%2213%22%20height%3D%227.5%22%20rx%3D%222%22%20fill%3D%22%23FF4757%22%2F%3E%20%3Crect%20x%3D%2210.5%22%20y%3D%227.5%22%20width%3D%223%22%20height%3D%2214%22%20rx%3D%221.5%22%20fill%3D%22%23F5C518%22%2F%3E%20%3Cpath%20d%3D%22M5.5%206h13%22%20stroke%3D%22%23F5C518%22%20stroke-width%3D%221%22%20opacity%3D%220.6%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-stop { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%2210.5%22%20fill%3D%22%23FF4757%22%2F%3E%20%3Crect%20x%3D%225.5%22%20y%3D%2210.5%22%20width%3D%2213%22%20height%3D%223.2%22%20rx%3D%221.6%22%20fill%3D%22%23FFFFFF%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-upload { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Crect%20x%3D%223.5%22%20y%3D%2215%22%20width%3D%2217%22%20height%3D%226.5%22%20rx%3D%222%22%20fill%3D%22%23059669%22%2F%3E%20%3Cpath%20d%3D%22M12%202.5l6%206h-3.5v7h-5v-7H6l6-6z%22%20fill%3D%22%2300F59B%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-download { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Crect%20x%3D%223.5%22%20y%3D%2215%22%20width%3D%2217%22%20height%3D%226.5%22%20rx%3D%222%22%20fill%3D%22%23059669%22%2F%3E%20%3Cpath%20d%3D%22M12%2014.5l6-6h-3.5V1.5h-5v7H6l6%206z%22%20fill%3D%22%23F5C518%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-clock { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229.5%22%20stroke%3D%22%2300F59B%22%20stroke-width%3D%222.2%22%20fill%3D%22%2304140D%22%20opacity%3D%220.9%22%2F%3E%20%3Cline%20x1%3D%2212%22%20y1%3D%225.5%22%20x2%3D%2212%22%20y2%3D%2212%22%20stroke%3D%22%23F5C518%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%2F%3E%20%3Cline%20x1%3D%2212%22%20y1%3D%2212%22%20x2%3D%2216.5%22%20y2%3D%2214%22%20stroke%3D%22%23F5C518%22%20stroke-width%3D%222.2%22%20stroke-linecap%3D%22round%22%2F%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%221.4%22%20fill%3D%22%23FFF2A1%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-crown { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cpath%20d%3D%22M3.5%2017.5l2-10%204.5%205L12%205l2%207.5%204.5-5%202%2010H3.5z%22%20fill%3D%22%23F5C518%22%2F%3E%20%3Crect%20x%3D%223.5%22%20y%3D%2217.5%22%20width%3D%2217%22%20height%3D%223.5%22%20rx%3D%221.5%22%20fill%3D%22%23D4AF37%22%2F%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%225%22%20r%3D%221.8%22%20fill%3D%22%23FF4757%22%2F%3E%20%3Ccircle%20cx%3D%225.5%22%20cy%3D%227.5%22%20r%3D%221.4%22%20fill%3D%22%2300F59B%22%2F%3E%20%3Ccircle%20cx%3D%2218.5%22%20cy%3D%227.5%22%20r%3D%221.4%22%20fill%3D%22%2300F59B%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-lock { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Crect%20x%3D%224.5%22%20y%3D%2210%22%20width%3D%2215%22%20height%3D%2211.5%22%20rx%3D%222.5%22%20fill%3D%22%23F5C518%22%2F%3E%20%3Cpath%20d%3D%22M7.5%2010V6.5a4.5%204.5%200%20019%200V10%22%20stroke%3D%22%23F5C518%22%20stroke-width%3D%222.6%22%20fill%3D%22none%22%2F%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2215%22%20r%3D%221.8%22%20fill%3D%22%2304140D%22%20opacity%3D%220.5%22%2F%3E%20%3Cline%20x1%3D%2212%22%20y1%3D%2216.5%22%20x2%3D%2212%22%20y2%3D%2218.5%22%20stroke%3D%22%2304140D%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20opacity%3D%220.5%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-check { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%2210.5%22%20fill%3D%22%2300F59B%22%2F%3E%20%3Cpath%20d%3D%22M7%2012.5l3.5%203.5%207-7%22%20stroke%3D%22%23FFFFFF%22%20stroke-width%3D%222.8%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-trash { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cpath%20d%3D%22M5.5%207h13l-1.2%2014.5H6.7L5.5%207z%22%20fill%3D%22%23FF4757%22%2F%3E%20%3Crect%20x%3D%223.5%22%20y%3D%224%22%20width%3D%2217%22%20height%3D%223%22%20rx%3D%221.5%22%20fill%3D%22%23B31224%22%2F%3E%20%3Crect%20x%3D%229%22%20y%3D%221.5%22%20width%3D%226%22%20height%3D%222.5%22%20rx%3D%221.2%22%20fill%3D%22%23B31224%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-cross { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%2210.5%22%20fill%3D%22%23FF4757%22%2F%3E%20%3Cpath%20d%3D%22M7.5%207.5l9%209M16.5%207.5l-9%209%22%20stroke%3D%22%23FFFFFF%22%20stroke-width%3D%222.8%22%20stroke-linecap%3D%22round%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-question { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%2210.5%22%20fill%3D%22%23F5C518%22%2F%3E%20%3Cpath%20d%3D%22M9%208.5a3%203%200%20115%202.5c0%201.5-2%202-2%203.5%22%20stroke%3D%22%2304140D%22%20stroke-width%3D%222.2%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%20opacity%3D%220.75%22%2F%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2218%22%20r%3D%221.3%22%20fill%3D%22%2304140D%22%20opacity%3D%220.75%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-user { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%227.5%22%20r%3D%225%22%20fill%3D%22%2300F59B%22%2F%3E%20%3Cpath%20d%3D%22M3.5%2021c0-4.8%203.8-8.5%208.5-8.5s8.5%203.7%208.5%208.5%22%20fill%3D%22%2300F59B%22%20opacity%3D%220.85%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-tick { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cpath%20d%3D%22M3.5%2012.5l5.5%205.5L20.5%205.5%22%20stroke%3D%22%2300F59B%22%20stroke-width%3D%223.2%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-refresh { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cpath%20d%3D%22M4%2012a8%208%200%200114.5-5V3%22%20stroke%3D%22%2300F59B%22%20stroke-width%3D%222.6%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%2F%3E%20%3Cpath%20d%3D%22M20%2012a8%208%200%2001-14.5%205V21%22%20stroke%3D%22%2300F59B%22%20stroke-width%3D%222.6%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%2F%3E%20%3Cpolygon%20points%3D%2218.5%2C3%2021.5%2C7%2015.5%2C7%22%20fill%3D%22%2300F59B%22%2F%3E%20%3Cpolygon%20points%3D%225.5%2C21%202.5%2C17%208.5%2C17%22%20fill%3D%22%2300F59B%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-door { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Crect%20x%3D%223.5%22%20y%3D%222%22%20width%3D%2212%22%20height%3D%2220%22%20rx%3D%221.5%22%20fill%3D%22%23FF4757%22%2F%3E%20%3Cpath%20d%3D%22M15.5%2012h6.5m0%200l-3-3m3%203l-3%203%22%20stroke%3D%22%23F5C518%22%20stroke-width%3D%222.2%22%20fill%3D%22none%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%20%3Ccircle%20cx%3D%2213%22%20cy%3D%2212%22%20r%3D%221.3%22%20fill%3D%22%23F5C518%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-rocket { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cpath%20d%3D%22M12%201.5c-2.5%204-3.5%209-3.5%2013.5h7c0-4.5-1-9.5-3.5-13.5z%22%20fill%3D%22%2300F59B%22%2F%3E%20%3Cpath%20d%3D%22M8.5%2015l-4%204.5h4%22%20fill%3D%22%23F5C518%22%2F%3E%20%3Cpath%20d%3D%22M15.5%2015l4%204.5h-4%22%20fill%3D%22%23F5C518%22%2F%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%229.5%22%20r%3D%222.2%22%20fill%3D%22%23F5C518%22%2F%3E%20%3Cpolygon%20points%3D%2210%2C20%2014%2C20%2012%2C23.5%22%20fill%3D%22%23FF4757%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-headset { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cpath%20d%3D%22M3.5%2012.5a8.5%208.5%200%200117%200%22%20stroke%3D%22%2300F59B%22%20stroke-width%3D%222.6%22%20fill%3D%22none%22%2F%3E%20%3Crect%20x%3D%222%22%20y%3D%2212.5%22%20width%3D%224.5%22%20height%3D%227.5%22%20rx%3D%222%22%20fill%3D%22%2300F59B%22%2F%3E%20%3Crect%20x%3D%2217.5%22%20y%3D%2212.5%22%20width%3D%224.5%22%20height%3D%227.5%22%20rx%3D%222%22%20fill%3D%22%2300F59B%22%2F%3E%20%3Cpath%20d%3D%22M18.5%2020a4.5%204.5%200%2001-4.5%200%22%20stroke%3D%22%23F5C518%22%20stroke-width%3D%221.8%22%20fill%3D%22none%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-bag { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cpath%20d%3D%22M4.5%208.5h15l-1.5%2013H6L4.5%208.5z%22%20fill%3D%22%2300F59B%22%2F%3E%20%3Cpath%20d%3D%22M8%208.5V6a4%204%200%20018%200v2.5%22%20stroke%3D%22%23F5C518%22%20stroke-width%3D%222.2%22%20fill%3D%22none%22%2F%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2214.5%22%20r%3D%222.2%22%20fill%3D%22%23F5C518%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-goldmedal { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cpath%20d%3D%22M7.5%201.5l4.5%206%204.5-6%22%20stroke%3D%22%23F5C518%22%20stroke-width%3D%222.2%22%20fill%3D%22none%22%2F%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2214%22%20r%3D%227.5%22%20fill%3D%22%23F5C518%22%2F%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2214%22%20r%3D%225.5%22%20stroke%3D%22%2304140D%22%20stroke-width%3D%220.6%22%20fill%3D%22none%22%20opacity%3D%220.3%22%2F%3E%20%3Ctext%20x%3D%2212%22%20y%3D%2217.2%22%20text-anchor%3D%22middle%22%20font-size%3D%228%22%20font-weight%3D%22900%22%20fill%3D%22%2304140D%22%20opacity%3D%220.7%22%3E1%3C%2Ftext%3E%20%3C%2Fsvg%3E"); }
.tk-silvermedal { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cpath%20d%3D%22M7.5%201.5l4.5%206%204.5-6%22%20stroke%3D%22%23C0C8D4%22%20stroke-width%3D%222.2%22%20fill%3D%22none%22%2F%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2214%22%20r%3D%227.5%22%20fill%3D%22%23C0C8D4%22%2F%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2214%22%20r%3D%225.5%22%20stroke%3D%22%2304140D%22%20stroke-width%3D%220.6%22%20fill%3D%22none%22%20opacity%3D%220.3%22%2F%3E%20%3Ctext%20x%3D%2212%22%20y%3D%2217.2%22%20text-anchor%3D%22middle%22%20font-size%3D%228%22%20font-weight%3D%22900%22%20fill%3D%22%2304140D%22%20opacity%3D%220.7%22%3E2%3C%2Ftext%3E%20%3C%2Fsvg%3E"); }
.tk-bronzemedal { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cpath%20d%3D%22M7.5%201.5l4.5%206%204.5-6%22%20stroke%3D%22%23CD7F32%22%20stroke-width%3D%222.2%22%20fill%3D%22none%22%2F%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2214%22%20r%3D%227.5%22%20fill%3D%22%23CD7F32%22%2F%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2214%22%20r%3D%225.5%22%20stroke%3D%22%2304140D%22%20stroke-width%3D%220.6%22%20fill%3D%22none%22%20opacity%3D%220.3%22%2F%3E%20%3Ctext%20x%3D%2212%22%20y%3D%2217.2%22%20text-anchor%3D%22middle%22%20font-size%3D%228%22%20font-weight%3D%22900%22%20fill%3D%22%2304140D%22%20opacity%3D%220.7%22%3E3%3C%2Ftext%3E%20%3C%2Fsvg%3E"); }
.tk-medal { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Cpath%20d%3D%22M8.5%202l3.5%206%203.5-6%22%20stroke%3D%22%23F5C518%22%20stroke-width%3D%222%22%20fill%3D%22%2300F59B%22%2F%3E%20%3Ccircle%20cx%3D%2212%22%20cy%3D%2215%22%20r%3D%226.5%22%20fill%3D%22%23F5C518%22%2F%3E%20%3Cpolygon%20points%3D%2212%2C11%2013.2%2C13.5%2016%2C13.8%2014%2C15.7%2014.5%2C18.5%2012%2C17.2%209.5%2C18.5%2010%2C15.7%208%2C13.8%2010.8%2C13.5%22%20fill%3D%22%2304140D%22%20opacity%3D%220.35%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-idcard { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Crect%20x%3D%222%22%20y%3D%224.5%22%20width%3D%2220%22%20height%3D%2215%22%20rx%3D%222.5%22%20fill%3D%22%2300F59B%22%2F%3E%20%3Crect%20x%3D%224.5%22%20y%3D%227.5%22%20width%3D%225.5%22%20height%3D%225.5%22%20rx%3D%221%22%20fill%3D%22%23F5C518%22%2F%3E%20%3Cline%20x1%3D%2212%22%20y1%3D%229%22%20x2%3D%2219%22%20y2%3D%229%22%20stroke%3D%22%2304140D%22%20stroke-width%3D%221.6%22%20opacity%3D%220.4%22%20stroke-linecap%3D%22round%22%2F%3E%20%3Cline%20x1%3D%2212%22%20y1%3D%2212%22%20x2%3D%2217%22%20y2%3D%2212%22%20stroke%3D%22%2304140D%22%20stroke-width%3D%221.6%22%20opacity%3D%220.4%22%20stroke-linecap%3D%22round%22%2F%3E%20%3C%2Fsvg%3E"); }
.tk-search { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%20%3Ccircle%20cx%3D%2210%22%20cy%3D%2210%22%20r%3D%227%22%20stroke%3D%22%2300F59B%22%20stroke-width%3D%222.8%22%20fill%3D%22none%22%2F%3E%20%3Cline%20x1%3D%2215%22%20y1%3D%2215%22%20x2%3D%2221.5%22%20y2%3D%2221.5%22%20stroke%3D%22%23F5C518%22%20stroke-width%3D%223%22%20stroke-linecap%3D%22round%22%2F%3E%20%3Ccircle%20cx%3D%2210%22%20cy%3D%2210%22%20r%3D%223.5%22%20fill%3D%22%2300F59B%22%20opacity%3D%220.2%22%2F%3E%20%3C%2Fsvg%3E"); }


/* ============================================================================
   LÜKS CYBER & ZÜMRÜT ESTETİK YÜKSELTMELERİ (V3 - LUXURY EDITION)
   ============================================================================ */

/* 1. Özel Lüks Kaydırma Çubuğu (Scrollbar) */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: #020b07;
}
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, var(--emerald-neon) 0%, var(--gold-main) 100%);
  border-radius: 4px;
  border: 1px solid rgba(0, 0, 0, 0.5);
}
::-webkit-scrollbar-thumb:hover {
  background: var(--emerald-neon);
  box-shadow: 0 0 10px var(--emerald-neon);
}

/* 2. Neon Seçim Rengi */
::selection {
  background: rgba(0, 245, 155, 0.35) !important;
  color: #FFFFFF !important;
}

/* 3. Navbar Işıltılı Alt Çizgi ve Lüks Cam Efekti */
.navbar {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: rgba(2, 11, 7, 0.88) !important;
  backdrop-filter: blur(24px) !important;
  -webkit-backdrop-filter: blur(24px) !important;
  border-bottom: 1px solid rgba(0, 245, 155, 0.25) !important;
  padding: 0.75rem 0 !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.6) !important;
}

.navbar::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 1.5px;
  background: linear-gradient(90deg, transparent 0%, rgba(0, 245, 155, 0.7) 25%, rgba(245, 197, 24, 0.8) 75%, transparent 100%);
  box-shadow: 0 0 14px rgba(0, 245, 155, 0.5);
  pointer-events: none;
}

/* 4. Navbar Link Hover Kapsül Efekti */
.nav-link:hover {
  color: #FFFFFF !important;
  background: rgba(0, 245, 155, 0.09) !important;
  border-color: rgba(0, 245, 155, 0.3) !important;
  box-shadow: 0 0 16px rgba(0, 245, 155, 0.22) !important;
  text-shadow: 0 0 10px rgba(0, 245, 155, 0.6) !important;
}

/* 5. MM2 Özel Butonu (Navbar Merkez Mücevheri) */
.nav-mm2-pill {
  background: linear-gradient(135deg, rgba(0, 245, 155, 0.2) 0%, rgba(245, 197, 24, 0.15) 100%) !important;
  border: 1.5px solid rgba(0, 245, 155, 0.6) !important;
  color: #00F59B !important;
  box-shadow: 0 0 18px rgba(0, 245, 155, 0.35), inset 0 0 10px rgba(0, 245, 155, 0.15) !important;
  animation: mm2-glow-pulse 3s infinite alternate !important;
}

@keyframes mm2-glow-pulse {
  0% { box-shadow: 0 0 14px rgba(0, 245, 155, 0.35), inset 0 0 8px rgba(0, 245, 155, 0.1); }
  100% { box-shadow: 0 0 25px rgba(0, 245, 155, 0.65), inset 0 0 14px rgba(0, 245, 155, 0.25); }
}

.nav-mm2-pill:hover {
  background: linear-gradient(135deg, rgba(0, 245, 155, 0.32) 0%, rgba(245, 197, 24, 0.22) 100%) !important;
  border-color: #00F59B !important;
  color: #FFFFFF !important;
  box-shadow: 0 0 28px rgba(0, 245, 155, 0.8), 0 0 10px #FFF !important;
  transform: translateY(-2px) scale(1.02) !important;
}

/* 6. Discord Butonu - Asla Taşmaz, Parlak Lüks Altın */
.nav-actions .btn.btn-gold {
  background: linear-gradient(135deg, #FFF2A1 0%, #F5C518 45%, #D4AF37 100%) !important;
  color: #04140D !important;
  border: 1.5px solid #FFF4A3 !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) !important;
}

.nav-actions .btn.btn-gold:hover {
  transform: translateY(-2px) scale(1.03) !important;
  box-shadow: 0 0 28px rgba(245, 197, 24, 0.75), 0 0 8px #FFF !important;
}

/* 7. Orta Ekranlar İçin Akıllı Alan Tasarrufu (1220px - 1380px) */
@media (max-width: 1380px) {
  .live-ping-pill {
    padding: 0 0.55rem;
    font-size: 0.75rem;
    height: 34px;
  }
  .nav-actions .btn {
    padding: 0 0.85rem !important;
    font-size: 0.82rem !important;
  }
}

@media (max-width: 1280px) {
  .live-ping-pill {
    display: none !important;
  }
}

/* 8. Hero Bölümü Lüks Işıklandırma ve Butonlar */
.hero-badge {
  background: rgba(0, 245, 155, 0.08) !important;
  border: 1.5px solid rgba(0, 245, 155, 0.35) !important;
  backdrop-filter: blur(16px) !important;
  box-shadow: 0 0 25px rgba(0, 245, 155, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
  position: relative;
  overflow: hidden;
}

.hero-badge::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 60%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
  transform: skewX(-25deg);
  animation: badge-shine 5s infinite;
}

@keyframes badge-shine {
  0% { left: -100%; }
  25%, 100% { left: 150%; }
}

.gold-3d-text {
  background: linear-gradient(180deg, #FFF7B8 0%, #F5C518 45%, #C99616 85%, #8B6508 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  filter: drop-shadow(0 4px 18px rgba(245, 197, 24, 0.45)) !important;
}

.emerald-glow-text {
  background: linear-gradient(180deg, #FFFFFF 0%, #00F59B 50%, #00C875 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  filter: drop-shadow(0 0 25px rgba(0, 245, 155, 0.65)) !important;
}

.btn-mm2 {
  background: linear-gradient(135deg, #00F59B 0%, #059669 100%) !important;
  color: #04140D !important;
  font-weight: 800 !important;
  box-shadow: 0 0 30px rgba(0, 245, 155, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.4) !important;
  border-radius: 14px !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.btn-mm2:hover {
  transform: translateY(-3px) scale(1.02) !important;
  box-shadow: 0 0 40px rgba(0, 245, 155, 0.8), 0 0 15px #FFF !important;
  color: #000000 !important;
}

/* 9. Kartlar İçin Lüks Cam ve Işık Yansıması */
.stat-card, .feature-card, .vouch-card, .step-card, .rule-box {
  background: rgba(6, 25, 17, 0.78) !important;
  backdrop-filter: blur(16px) !important;
  border: 1px solid rgba(0, 245, 155, 0.22) !important;
  border-radius: 20px !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  position: relative !important;
  overflow: hidden !important;
}

.stat-card::before, .feature-card::before, .rule-box::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(0, 245, 155, 0.65), transparent);
  pointer-events: none;
}

.stat-card:hover, .feature-card:hover, .rule-box:hover {
  transform: translateY(-5px) !important;
  border-color: rgba(0, 245, 155, 0.55) !important;
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.7), 0 0 30px rgba(0, 245, 155, 0.25) !important;
}

/* 10. Canlı Takas Pazarı İlan Kartları */
.trade-listing-card {
  background: rgba(5, 20, 14, 0.92) !important;
  backdrop-filter: blur(16px) !important;
  border: 1px solid rgba(0, 245, 155, 0.25) !important;
  border-radius: 20px !important;
  transition: all 0.25s ease !important;
}

.trade-listing-card:hover {
  transform: translateY(-4px) !important;
  border-color: var(--emerald-neon) !important;
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.8), 0 0 25px rgba(0, 245, 155, 0.25) !important;
}

.tlc-box.tlc-offer {
  border-left: 3px solid #00F59B !important;
  background: rgba(0, 245, 155, 0.08) !important;
  border-radius: 8px !important;
}

.tlc-box.tlc-request {
  border-left: 3px solid #F5C518 !important;
  background: rgba(245, 197, 24, 0.08) !important;
  border-radius: 8px !important;
}