/* zylosys Theme */
:root {
  --bg: #0A0908;
  --bg-2: #12100E;
  --bg-card: #161310;
  --bg-input: #0C0B0A;
  --border: rgba(224, 184, 58, 0.22);
  --border-soft: rgba(255,255,255,0.06);
  --green: #E0B83A;
  --green-2: #B8860B;
  --green-dim: rgba(224, 184, 58, 0.12);
  --green-glow: rgba(224, 184, 58, 0.35);
  --gold: #E0B83A;
  --text: #ffffff;
  --text-muted: #9a9a9a;
  --danger: #ff4d4f;
  --sidebar-w: 264px;
  --sidebar-gap: 0px;
  --radius: 16px;
  --radius-sm: 10px;
  --radius-pill: 999px;
  --font: 'Inter', 'Segoe UI', system-ui, sans-serif;
  --font-display: 'Space Grotesk', 'Inter', sans-serif;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--font);
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button, input, select, textarea { font: inherit; color: inherit; }
ul { list-style: none; }

.container { width: min(1200px, 92%); margin: 0 auto; }

/* Buttons */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  border: none; cursor: pointer; border-radius: var(--radius-pill);
  padding: 12px 22px; font-weight: 600; transition: .2s ease;
}
.btn-primary {
  background: linear-gradient(135deg, var(--green), var(--green-2));
  color: #fff; box-shadow: 0 0 24px var(--green-glow);
}
.btn-primary:hover { filter: brightness(1.08); transform: translateY(-1px); }
.btn-outline {
  background: transparent; border: 1px solid var(--border); color: var(--green);
}
.btn-outline:hover { background: var(--green-dim); }
.btn-block { width: 100%; }
.btn-sm { padding: 8px 14px; font-size: 13px; }

/* Forms */
.form-group { margin-bottom: 16px; }
.form-group label {
  display: block; margin-bottom: 8px; color: var(--text-muted); font-size: 13px; font-weight: 500;
}
.input, .select, .textarea {
  width: 100%; background: var(--bg-input); border: 1px solid var(--border);
  border-radius: 12px; padding: 14px 16px 14px 44px; outline: none; transition: .2s;
}
.input:focus, .select:focus, .textarea:focus {
  border-color: var(--green); box-shadow: 0 0 0 3px var(--green-dim);
}
.input-plain { padding-left: 16px; }
.input-wrap { position: relative; }
.input-wrap .icon {
  position: absolute; left: 14px; top: 50%; transform: translateY(-50%);
  color: var(--green); width: 18px; height: 18px; display: grid; place-items: center;
  pointer-events: none;
}
.input-wrap .icon .svg-icon { display: block; }
.input-wrap .toggle-pass {
  position: absolute; right: 14px; top: 50%; transform: translateY(-50%);
  background: none; border: none; color: var(--text-muted); cursor: pointer;
  display: grid; place-items: center; padding: 0; line-height: 0;
}
.input-wrap .toggle-pass:hover { color: var(--text); }
.svg-icon { display: inline-block; vertical-align: middle; flex-shrink: 0; }
.phone-row { display: grid; grid-template-columns: 110px 1fr; gap: 10px; }
.alert {
  padding: 12px 16px; border-radius: 12px; margin-bottom: 16px; font-size: 14px;
}
.alert-success { background: rgba(224,184,58,.12); border: 1px solid rgba(224,184,58,.3); color: var(--green); }
.alert-error { background: rgba(255,77,79,.12); border: 1px solid rgba(255,77,79,.3); color: #ff8a8a; }
.alert-info { background: rgba(224,184,58,.08); border: 1px solid var(--border); color: var(--text-muted); }

/* Auth */
.auth-page {
  min-height: 100vh; display: grid; grid-template-columns: 1fr 1fr;
  background: radial-gradient(ellipse at 20% 20%, rgba(80,40,0,.25), transparent 50%), var(--bg);
}
.auth-left {
  display: flex; flex-direction: column; justify-content: center;
  padding: 40px 8%; max-width: 560px; margin: 0 auto; width: 100%;
}
.auth-logo { display: flex; align-items: center; gap: 12px; margin-bottom: 36px; font-weight: 700; letter-spacing: .04em; }
.auth-logo-only {
  justify-content: center;
  margin-bottom: 28px;
}
.auth-logo-only img {
  height: 72px;
  width: auto;
  max-width: 240px;
  object-fit: contain;
  display: block;
}
.auth-logo .mark {
  width: 40px; height: 40px; border-radius: 10px;
  background: linear-gradient(135deg, #3d2410, #1f140a);
  border: 1px solid var(--border); display: grid; place-items: center;
}
.auth-left h1 { font-size: 28px; margin-bottom: 28px; font-family: var(--font-display); text-align: center; }
.auth-right {
  position: relative; padding: 24px; display: flex; align-items: center; justify-content: center;
}
.auth-hero {
  width: 100%; height: calc(100vh - 48px); border-radius: 24px; overflow: hidden;
  background:
    linear-gradient(180deg, transparent 40%, rgba(0,0,0,.55)),
    radial-gradient(circle at 70% 40%, rgba(224,184,58,.2), transparent 50%),
    url('../img/auth-hero.svg') center/cover, #1a1008;
  position: relative;
}
.auth-hero::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(135deg, transparent 30%, rgba(224,184,58,.08));
}
.auth-back {
  position: fixed; top: 18px; left: 18px; z-index: 20;
  display: inline-flex; align-items: center; gap: 8px;
  height: 36px; padding: 0 14px 0 10px; border-radius: 999px;
  border: 1px solid var(--border); background: var(--bg-card);
  color: var(--text); font-size: 13px; font-weight: 600;
  text-decoration: none; transition: border-color .2s, color .2s, background .2s;
}
.auth-back:hover {
  border-color: rgba(224,184,58,.45);
  color: #F0D78C;
  background: rgba(224,184,58,.08);
}
.auth-back .svg-icon,
.auth-back svg {
  width: 16px; height: 16px; flex-shrink: 0;
}
.lang-chip {
  position: fixed; top: 18px; left: auto; right: 18px; z-index: 20;
  width: 36px; height: 36px; border-radius: 50%; overflow: hidden;
  border: 1px solid var(--border); background: var(--bg-card);
  display: grid; place-items: center; font-size: 16px;
}
.auth-footer { margin-top: 18px; text-align: center; color: var(--text-muted); font-size: 12px; }
.auth-footer a { color: var(--green); }
.auth-switch { text-align: center; margin-top: 16px; color: var(--text-muted); font-size: 14px; }
.auth-switch a { color: var(--green); font-weight: 600; }
.auth-remember {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 4px 0 18px;
  cursor: pointer;
  user-select: none;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
}
.auth-remember input {
  width: 18px;
  height: 18px;
  margin-top: 1px;
  accent-color: #E0B83A;
  flex-shrink: 0;
}
.auth-remember small {
  display: block;
  color: var(--text-muted);
  font-size: 12px;
  font-weight: 400;
  margin-top: 2px;
}

/* WhatsApp / Support FAB */
.wa-fab,
.support-fab {
  position: fixed; right: 22px; bottom: 22px; z-index: 100;
  width: 56px; height: 56px; border-radius: 50%;
  border: none; padding: 0; cursor: pointer;
  background: linear-gradient(180deg, #F0D78C, #B8860B); display: grid; place-items: center;
  box-shadow: 0 8px 24px rgba(224,184,58,.45); transition: .2s;
  color: #fff;
}
.wa-fab:hover,
.support-fab:hover { transform: scale(1.06); }
.wa-fab svg,
.support-fab svg {
  width: 26px;
  height: 26px;
  fill: none;
  stroke: #fff;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Landing */
.landing { overflow-x: hidden; }
.landing-nav {
  position: sticky; top: 0; z-index: 50; backdrop-filter: blur(16px);
  background: rgba(8,12,10,.8); border-bottom: 1px solid var(--border-soft);
}
.landing-nav .inner {
  display: flex; align-items: center; justify-content: space-between;
  height: 72px; width: min(1200px, 92%); margin: 0 auto;
}
.nav-links { display: flex; gap: 28px; color: var(--text-muted); font-size: 14px; }
.nav-links a:hover { color: var(--text); }
.nav-actions { display: flex; gap: 12px; align-items: center; }

.hero {
  padding: 80px 0 60px;
  background:
    radial-gradient(ellipse at 70% 20%, rgba(224,184,58,.15), transparent 45%),
    radial-gradient(ellipse at 10% 80%, rgba(100,50,0,.2), transparent 40%),
    var(--bg);
}
.hero-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 48px; align-items: center; }
.hero h1 {
  font-family: var(--font-display); font-size: clamp(40px, 6vw, 72px);
  line-height: 1.05; margin-bottom: 18px; letter-spacing: -0.02em;
}
.hero h1 span { color: var(--green); }
.hero p { color: var(--text-muted); font-size: 18px; max-width: 480px; margin-bottom: 28px; }
.hero-cta { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 32px; }
.ticker {
  display: flex; gap: 16px; overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
  margin-top: 40px; padding: 12px 0; border-top: 1px solid var(--border-soft); border-bottom: 1px solid var(--border-soft);
}
.ticker-track { display: flex; gap: 24px; animation: tick 28s linear infinite; white-space: nowrap; }
.ticker-item { color: var(--text-muted); font-size: 13px; }
.ticker-item strong { color: var(--text); margin-right: 6px; }
.up { color: var(--green); } .down { color: #ff6b6b; }
@keyframes tick { from { transform: translateX(0); } to { transform: translateX(-50%); } }

.chart-card {
  background: var(--bg-card); border: 1px solid var(--border); border-radius: 24px;
  padding: 20px; box-shadow: 0 20px 60px rgba(0,0,0,.4);
}
.stats-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 16px; }
.stat-box {
  background: var(--bg-2); border-radius: 14px; padding: 14px; text-align: center; border: 1px solid var(--border-soft);
}
.stat-box strong { display: block; color: var(--green); font-size: 22px; font-family: var(--font-display); }
.stat-box span { color: var(--text-muted); font-size: 12px; }

.section { padding: 80px 0; }
.section-title {
  font-family: var(--font-display); font-size: clamp(28px, 4vw, 42px);
  margin-bottom: 12px; letter-spacing: -0.02em;
}
.section-sub { color: var(--text-muted); margin-bottom: 40px; max-width: 560px; }

.plans-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.plan-card {
  background: var(--bg-card); border: 1px solid var(--border-soft); border-radius: 20px;
  padding: 28px; position: relative; transition: .25s;
}
.plan-card:hover { border-color: var(--border); transform: translateY(-4px); }
.plan-card.featured { border-color: var(--green); box-shadow: 0 0 40px rgba(224,184,58,.12); }
.plan-badge {
  position: absolute; top: -12px; left: 50%; transform: translateX(-50%);
  background: var(--green); color: #1a0c00; font-size: 12px; font-weight: 700;
  padding: 4px 12px; border-radius: var(--radius-pill);
}
.plan-card h3 { font-size: 22px; margin-bottom: 6px; }
.plan-card .desc { color: var(--text-muted); font-size: 14px; margin-bottom: 18px; }
.plan-return { font-size: 36px; font-family: var(--font-display); color: var(--green); margin-bottom: 16px; }
.plan-return small { font-size: 14px; color: var(--text-muted); }
.plan-meta { display: grid; gap: 10px; margin-bottom: 22px; }
.plan-meta li {
  display: flex; justify-content: space-between; font-size: 14px;
  padding-bottom: 8px; border-bottom: 1px solid var(--border-soft); color: var(--text-muted);
}
.plan-meta strong { color: var(--text); }

.founder {
  display: grid; grid-template-columns: .8fr 1.2fr; gap: 40px; align-items: center;
  background: linear-gradient(135deg, rgba(224,184,58,.08), transparent);
  border: 1px solid var(--border); border-radius: 24px; padding: 40px;
}
.founder-avatar {
  width: 220px; height: 220px; border-radius: 50%; margin: 0 auto;
  background: linear-gradient(135deg, #3d2410, #1a1008); border: 3px solid var(--green);
  display: grid; place-items: center; font-size: 64px; color: var(--green);
}
.faq-list { max-width: 800px; }
.faq-item {
  border: 1px solid var(--border-soft); border-radius: 14px; margin-bottom: 10px; overflow: hidden;
  background: var(--bg-card);
}
.faq-item summary {
  padding: 18px 20px; cursor: pointer; font-weight: 600; list-style: none;
  display: flex; justify-content: space-between; align-items: center;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item[open] summary { color: var(--green); }
.faq-item p { padding: 0 20px 18px; color: var(--text-muted); font-size: 14px; }

.landing-footer {
  border-top: 1px solid var(--border-soft); padding: 48px 0 28px; margin-top: 40px;
}
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 32px; margin-bottom: 32px; }
.footer-grid h4 { margin-bottom: 14px; }
.footer-grid a { display: block; color: var(--text-muted); font-size: 14px; margin-bottom: 8px; }
.footer-grid a:hover { color: var(--green); }
.footer-copy { color: var(--text-muted); font-size: 12px; border-top: 1px solid var(--border-soft); padding-top: 20px; }

/* Dashboard shell */
.app-shell { display: flex; min-height: 100vh; }
.sidebar {
  width: var(--sidebar-w);
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 40;
  display: flex;
  flex-direction: column;
  padding: 0;
  background: #050505;
  border-right: 1px solid rgba(224,184,58,.14);
  overflow: hidden;
}
.sidebar::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, #E0B83A 0%, rgba(224,184,58,.15) 55%, transparent 100%);
  pointer-events: none;
}
.sidebar::after {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 80% 40% at 0% 0%, rgba(224,184,58,.1), transparent 55%),
    linear-gradient(180deg, #0c0c0c 0%, #050505 40%);
  pointer-events: none;
  z-index: 0;
}
.sidebar > * { position: relative; z-index: 1; }

.sidebar-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 22px 20px 18px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.sidebar-brand-mark {
  width: 40px; height: 40px; border-radius: 12px;
  display: grid; place-items: center;
  background: linear-gradient(145deg, #1a120a, #0a0a0a);
  border: 1px solid rgba(224,184,58,.45);
  box-shadow: 0 0 0 3px rgba(224,184,58,.06);
  flex-shrink: 0;
}
.sidebar-brand-logo { height: 36px; width: auto; border-radius: 8px; }
.sidebar-brand-logo-only {
  justify-content: center;
  padding: 26px 18px 20px;
}
.sidebar-brand-logo-lg {
  height: 72px;
  width: auto;
  max-width: 200px;
  object-fit: contain;
  border-radius: 0;
  display: block;
  margin: 0 auto;
}
.sidebar-brand-text {
  display: flex; flex-direction: column; gap: 2px; min-width: 0;
}
.sidebar-brand-text strong {
  font-family: var(--font-display);
  font-size: 14px;
  letter-spacing: .1em;
  color: #fff;
  line-height: 1.1;
}
.sidebar-brand-text span {
  font-size: 11px;
  color: rgba(224,184,58,.85);
  letter-spacing: .04em;
  font-weight: 500;
}

.sidebar-label {
  margin: 18px 20px 8px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(255,255,255,.32);
}

.side-nav {
  display: flex;
  flex-direction: column;
  gap: 3px;
  flex: 1;
  overflow-y: auto;
  padding: 0 12px 12px;
  scrollbar-width: none;
}
.side-nav::-webkit-scrollbar { display: none; }

.side-nav a,
.side-nav .nav-parent {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 9px 10px;
  border-radius: 12px;
  color: rgba(255,255,255,.62);
  font-size: 13.5px;
  font-weight: 500;
  letter-spacing: .01em;
  transition: color .18s ease, background .18s ease, border-color .18s ease;
  cursor: pointer;
  border: 1px solid transparent;
  background: transparent;
  width: 100%;
  text-align: left;
  position: relative;
}
.side-nav a:hover,
.side-nav .nav-parent:hover {
  color: #fff;
  background: rgba(255,255,255,.03);
  border-color: rgba(255,255,255,.04);
}
.side-nav a.active {
  color: #E8C547;
  background: linear-gradient(90deg, rgba(224,184,58,.16), rgba(224,184,58,.05));
  border-color: rgba(224,184,58,.22);
  font-weight: 600;
}
.side-nav a.active::before {
  content: '';
  position: absolute;
  left: -12px;
  top: 20%;
  bottom: 20%;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: #E0B83A;
}

.nav-ico {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  background: #111;
  border: 1px solid rgba(255,255,255,.06);
  color: rgba(255,255,255,.7);
  transition: background .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease;
}
.side-nav a:hover .nav-ico,
.side-nav .nav-parent:hover .nav-ico {
  color: #fff;
  border-color: rgba(255,255,255,.1);
}
.side-nav a.active .nav-ico {
  color: #E8C547;
  background: rgba(224,184,58,.12);
  border-color: rgba(224,184,58,.35);
  box-shadow: 0 0 16px rgba(224,184,58,.15);
}
.nav-ico svg,
.side-nav svg {
  width: 17px;
  height: 17px;
  stroke-width: 1.7;
}

.side-nav .nav-chevron {
  margin-left: auto;
  display: grid;
  place-items: center;
  opacity: .45;
  transition: transform .2s ease, opacity .2s ease;
  color: inherit;
}
.side-nav .nav-parent[aria-expanded="true"] .nav-chevron,
.side-nav .nav-parent.open .nav-chevron {
  transform: rotate(180deg);
  opacity: .9;
}

.submenu {
  display: none;
  margin: 2px 0 6px 22px;
  padding: 4px 0 4px 14px;
  border-left: 1px solid rgba(224,184,58,.2);
}
.submenu.open { display: block; }
.submenu a {
  font-size: 12.5px;
  padding: 9px 12px;
  margin-bottom: 0;
  border-radius: 9px;
  color: rgba(255,255,255,.45);
  border: none;
}
.submenu a:hover {
  color: #fff;
  background: rgba(255,255,255,.03);
}
.submenu a.active {
  background: rgba(224,184,58,.1);
  color: #E8C547;
  border: none;
}
.submenu a.active::before { display: none; }
.submenu a .nav-ico { display: none; }

.sidebar-foot {
  margin-top: auto;
  padding: 14px 16px 18px;
  border-top: 1px solid rgba(255,255,255,.06);
}
.lang-btn {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  background: #0c0c0c;
  border: 1px solid rgba(224,184,58,.2);
  border-radius: 12px;
  padding: 10px 12px;
  color: rgba(255,255,255,.88);
  font-size: 13px;
  cursor: pointer;
  transition: border-color .2s ease, background .2s ease;
}
.lang-btn:hover {
  background: rgba(224,184,58,.06);
  border-color: rgba(224,184,58,.4);
}
.lang-btn .nav-chevron {
  margin-left: auto;
  display: grid;
  place-items: center;
  opacity: .55;
}
.lang-code {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .04em;
  color: #0a0a0a;
  background: linear-gradient(180deg, #F0D78C, #E0B83A);
  flex-shrink: 0;
}
.lang-code-sm {
  width: 22px;
  height: 22px;
  border-radius: 6px;
  font-size: 9px;
}
.lang-flag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  line-height: 0;
  border-radius: 6px;
  overflow: hidden;
}
.lang-flag .svg-icon,
.lang-flag svg {
  display: block;
  border-radius: 4px;
}
.lang-flag-sm {
  width: 22px;
  height: 16px;
}
.lang-flag-sm .svg-icon,
.lang-flag-sm svg {
  width: 22px;
  height: 16px;
}
.m-round-btn .lang-flag {
  width: 22px;
  height: 16px;
}

.main {
  margin-left: var(--sidebar-w);
  flex: 1;
  min-width: 0;
  background: var(--bg);
  min-height: 100vh;
}
.topbar {
  display: flex; align-items: center; justify-content: space-between;
  padding: 22px 28px 8px; gap: 16px; flex-wrap: wrap;
}
.page-title { font-size: 28px; font-family: var(--font-display); font-weight: 700; }
.top-actions { display: flex; align-items: center; gap: 12px; }
.currency-select, .icon-btn {
  background: var(--bg-card); border: 1px solid var(--border-soft); border-radius: var(--radius-pill);
  padding: 8px 14px; color: var(--text); display: inline-flex; align-items: center; gap: 8px;
}
.icon-btn { width: 40px; height: 40px; justify-content: center; padding: 0; position: relative; cursor: pointer; }
.icon-btn .dot {
  position: absolute; top: 8px; right: 8px; width: 8px; height: 8px;
  background: var(--danger); border-radius: 50%;
}
.avatar {
  width: 40px; height: 40px; border-radius: 50%; background: var(--green); color: #1a0c00;
  display: grid; place-items: center; font-weight: 700;
}
.avatar-logo {
  width: 48px;
  height: 48px;
  background: rgba(224,184,58,.12);
  border: 1px solid rgba(224,184,58,.35);
  overflow: hidden;
  padding: 2px;
}
.avatar-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  transform: scale(1.12);
}
.top-brand-logo {
  display: inline-flex;
  align-items: center;
  height: 40px;
  max-width: 150px;
  padding: 4px 8px;
  border-radius: 12px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
}
.top-brand-logo img {
  height: 32px;
  width: auto;
  max-width: 140px;
  object-fit: contain;
  display: block;
}
.content { padding: 12px 28px 40px; }

/* Dashboard widgets */
.topbar-compact { padding-top: 16px; padding-bottom: 0; }
.topbar-spacer { flex: 1; }

.balance-block { margin-bottom: 22px; }
.balance-panel-desk {
  background: linear-gradient(165deg, #17140f 0%, #100e0c 100%);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 18px;
  padding: 22px 24px 18px;
  box-shadow: 0 12px 32px rgba(0,0,0,.28);
}
.balance-block .label { color: var(--text-muted); font-size: 13px; font-weight: 500; }
.balance-block .value {
  font-size: 40px; font-family: var(--font-display); font-weight: 700;
  letter-spacing: -0.03em; margin-top: 4px;
  background: linear-gradient(180deg, #fff 35%, #F0D78C);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
.balance-breakdown-desk {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin: 16px 0 0;
  padding-top: 14px;
  border-top: 1px solid rgba(255,255,255,.07);
}
.balance-breakdown-desk > div { padding: 0 12px 0 0; }
.balance-breakdown-desk dt {
  font-size: 12px;
  color: var(--text-muted);
  margin-bottom: 4px;
}
.balance-breakdown-desk dd {
  margin: 0;
  font-size: 15px;
  font-weight: 650;
  font-family: var(--font-display);
  letter-spacing: -.02em;
  color: #fff;
}
.balance-breakdown-desk .is-comm { color: #4ade80; }

/* People carousel */
.people-strip {
  display: flex; gap: 14px; overflow-x: auto; padding: 4px 2px 18px;
  scrollbar-width: none; -ms-overflow-style: none;
}
.people-strip::-webkit-scrollbar { display: none; }
.people-item { flex: 0 0 auto; text-align: center; width: 64px; }
.people-ring {
  width: 56px; height: 56px; border-radius: 50%; margin: 0 auto 6px;
  border: 2px solid var(--green);
  box-shadow: 0 0 12px var(--green-glow);
  background: linear-gradient(160deg, rgba(224,184,58,.25), #1a1210);
  display: grid; place-items: center; overflow: hidden;
  color: #fff; font-weight: 700; font-size: 13px;
}
.people-ring img { width: 100%; height: 100%; object-fit: cover; }
.people-item small {
  display: block; font-size: 11px; color: var(--text-muted);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* Quick actions — desktop: row horizontal; mobile: pill em cima */
.qa-actions {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 18px;
  margin: 6px 0 26px;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}
.qa-row {
  display: flex;
  align-items: flex-start;
  gap: 18px;
  margin: 0;
  padding: 0;
  flex-wrap: nowrap;
  flex: 0 0 auto;
}
.qa-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: auto;
  flex: 0 0 auto;
  height: 50px;
  padding: 0 22px 0 16px;
  border-radius: 14px;
  background: linear-gradient(180deg, #1c1712 0%, #14110e 100%);
  border: 1px solid rgba(224,184,58,.22);
  color: #fff;
  font-weight: 650;
  font-size: 14px;
  box-shadow: 0 8px 20px rgba(0,0,0,.25);
  transition: border-color .2s ease, background .2s ease, transform .15s ease;
  box-sizing: border-box;
  text-align: center;
  white-space: nowrap;
}
.qa-pill:hover {
  border-color: rgba(224,184,58,.4);
  background: linear-gradient(180deg, #221c15 0%, #17130f 100%);
  box-shadow: 0 10px 24px rgba(0,0,0,.3);
  transform: translateY(-1px);
}
.qa-pill-ico {
  width: 30px; height: 30px; border-radius: 9px;
  display: grid; place-items: center; color: #0A0908;
  background: linear-gradient(160deg, #F0D78C, #E0B83A);
  flex-shrink: 0;
}
.qa-circle {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  flex: 0 0 auto;
  min-width: 72px;
  color: var(--text-muted);
  font-size: 12px;
  transition: color .2s ease;
}
.qa-circle:hover { color: #fff; }
.qa-circle span:last-child {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  text-align: center;
  font-size: 12px;
  line-height: 1.2;
}
.qa-ci {
  width: 50px; height: 50px; border-radius: 14px;
  display: grid; place-items: center; color: #E0B83A;
  background: linear-gradient(165deg, #1a1612, #12100E);
  border: 1px solid rgba(224,184,58,.16);
  box-shadow: 0 6px 16px rgba(0,0,0,.22);
  transition: border-color .2s ease, color .2s ease, background .2s ease, transform .15s ease;
  flex-shrink: 0;
}
.qa-circle:hover .qa-ci {
  border-color: rgba(224,184,58,.35);
  color: #F0D78C;
  background: linear-gradient(165deg, #201b15, #14110e);
  box-shadow: 0 8px 18px rgba(0,0,0,.28);
  transform: translateY(-1px);
}

.quick-actions {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin: 20px 0 28px;
}
.quick-btn {
  background: var(--bg-card); border: 1px solid var(--border-soft); border-radius: 16px;
  padding: 18px 12px; text-align: center; color: var(--text-muted); transition: .2s;
}
.quick-btn:hover, .quick-btn.active {
  border-color: var(--green); color: var(--text); background: var(--green-dim);
}
.quick-btn .qi {
  width: 48px; height: 48px; margin: 0 auto 10px; border-radius: 50%;
  background: rgba(224,184,58,.08); border: 1px solid var(--border);
  display: grid; place-items: center; color: var(--green);
}
.quick-btn span { font-size: 12px; display: block; }

.dash-grid { display: grid; grid-template-columns: 1.45fr .9fr; gap: 18px; width: 100%; max-width: 100%; }
.dash-grid-top { margin-bottom: 18px; align-items: stretch; }
.dash-grid-bottom { margin-bottom: 8px; }
.dash-grid > * { min-width: 0; max-width: 100%; }
.card {
  background: var(--bg-card); border: 1px solid var(--border-soft); border-radius: 20px; padding: 22px;
}
.card-title { font-size: 16px; font-weight: 600; margin-bottom: 14px; }
.roadmap-card { padding: 18px; overflow: hidden; min-width: 0; max-width: 100%; }

.days-row {
  display: flex; gap: 10px; overflow-x: auto; padding-bottom: 4px;
  scrollbar-width: thin; width: 100%; max-width: 100%; min-width: 0;
  -webkit-overflow-scrolling: touch;
}
.day-card {
  min-width: 148px; max-width: 168px; flex: 1;
  background: #0e0c0a; border: 1px solid var(--border-soft);
  border-radius: 16px; padding: 14px; text-align: left; flex-shrink: 0;
  display: flex; flex-direction: column; min-height: 148px;
  transition: .2s; color: inherit;
}
.day-card:hover { border-color: rgba(224,184,58,.35); }
.day-card.active {
  border-color: var(--green);
  background: linear-gradient(165deg, rgba(224,184,58,.22), rgba(20,14,10,.95));
  box-shadow: 0 0 24px rgba(224,184,58,.12);
}
.day-card.done { opacity: .72; }
.day-card.final {
  border-color: rgba(245,197,66,.45);
  background: linear-gradient(165deg, rgba(245,197,66,.12), #0e0c0a);
  color: var(--gold);
  justify-content: flex-start;
}
.day-card .d { font-size: 11px; color: var(--text-muted); margin-bottom: 8px; font-weight: 600; letter-spacing: .04em; }
.day-card.active .d { color: rgba(255,255,255,.75); }
.day-card.final .d { color: rgba(245,197,66,.7); }
.day-title {
  font-size: 13px; font-weight: 600; line-height: 1.35; color: #fff;
  flex: 1; margin-bottom: 10px;
}
.day-foot {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  margin-top: auto; font-size: 12px;
}
.day-foot strong { white-space: nowrap; }
.day-locked {
  flex: 1; display: grid; place-items: center; color: rgba(255,255,255,.25);
}
.final-ico { color: var(--gold); margin-bottom: 6px; }
.day-card .v { font-size: 13px; font-weight: 600; line-height: 1.3; }
.final-reward { margin-top: auto; font-size: 12px; color: var(--gold); font-weight: 600; }

.progress-bar {
  height: 6px; background: #0a0908; border-radius: 999px; overflow: hidden; margin-top: 16px;
  border: 1px solid var(--border-soft);
}
.progress-bar > span { display: block; height: 100%; background: var(--green); border-radius: 999px; }
.progress-meta {
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
  color: var(--text-muted); font-size: 12px; margin-top: 10px; flex-wrap: wrap;
}
.progress-meta .dot-ok,
.progress-meta .dot-warn {
  display: inline-block; width: 7px; height: 7px; border-radius: 50%;
  margin: 0 2px 0 8px; vertical-align: middle;
}
.progress-meta .dot-ok:first-child { margin-left: 0; }
.progress-meta .dot-ok { background: var(--green); }
.progress-meta .dot-warn { background: #E0B83A; }

.promo-card {
  background: linear-gradient(160deg, rgba(100,50,0,.4), #0c0a08 72%);
  border: 1px solid var(--border); border-radius: 20px; padding: 28px 22px;
  text-align: center; position: relative; overflow: hidden;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  min-height: 220px; transition: .2s;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  min-width: 0;
}
.promo-card:hover { border-color: var(--green); transform: translateY(-2px); }
.promo-card::before {
  content: ''; position: absolute; inset: 0; opacity: .18;
  background-image: radial-gradient(circle, var(--green) 1px, transparent 1px);
  background-size: 16px 16px;
  mask-image: radial-gradient(ellipse at center, #000 20%, transparent 75%);
}
.promo-card > * { position: relative; }
.promo-card .trophy { margin-bottom: 10px; color: var(--gold); display: flex; justify-content: center; }
.promo-card h3 {
  font-size: 28px; margin-bottom: 6px; color: var(--gold);
  font-family: var(--font-display); font-weight: 700;
}
.promo-card p {
  color: rgba(245,197,66,.65); margin-bottom: 18px;
  font-size: 12px; letter-spacing: .12em; font-weight: 600;
}
.promo-cta {
  color: var(--green); font-weight: 600; font-size: 14px;
  display: inline-flex; align-items: center; gap: 6px;
}

.chart-head {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 12px;
  margin-bottom: 8px;
}
.chart-sub { color: var(--text-muted); font-size: 13px; }
.line-chart {
  display: grid; grid-template-columns: 36px 1fr; gap: 6px;
  height: 160px; margin-top: 8px;
}
.line-chart .y-axis {
  display: flex; flex-direction: column; justify-content: space-between;
  font-size: 11px; color: var(--text-muted); padding: 4px 0;
}
.line-chart svg { width: 100%; height: 100%; }
.line-chart .grid-line { stroke: rgba(255,255,255,.06); stroke-width: 1; }

.trading-summary-card { padding: 18px; min-width: 0; max-width: 100%; display: flex; flex-direction: column; }
.ts-grid {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px; margin-top: 6px;
}
.ts-cell {
  background: #0e0c0a; border: 1px solid var(--border-soft);
  border-radius: 14px; padding: 12px 14px;
  display: flex; flex-direction: column; gap: 6px; min-width: 0;
}
.ts-cell-wide { grid-column: 1 / -1; }
.ts-label { font-size: 12px; color: var(--text-muted); }
.ts-value { font-size: 18px; font-weight: 700; color: #fff; line-height: 1.1; }
.ts-value small { font-size: 12px; font-weight: 600; color: var(--text-muted); }
.ts-value.pos { color: var(--green); }
.ts-value.neg { color: #f0605c; }

.trading-card .card-title { margin-bottom: 12px; }
.trading-media {
  display: grid; grid-template-columns: 100px 1fr; gap: 12px; min-height: 160px;
}
.tm-thumb {
  border-radius: 16px; background-size: cover; background-position: center top;
  position: relative; overflow: hidden; min-height: 160px;
  border: 1px solid var(--border-soft);
}
.tm-thumb::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(180deg, transparent 35%, rgba(0,0,0,.7));
}
.tm-overlay {
  position: absolute; inset: 0; z-index: 1;
  display: grid; place-items: center;
  font-family: var(--font-display); font-weight: 700; font-size: clamp(22px, 3vw, 36px);
  letter-spacing: .06em; color: rgba(255,255,255,.55);
  text-shadow: 0 2px 20px rgba(0,0,0,.5);
}
.tm-yt {
  position: absolute; left: 14px; bottom: 14px; z-index: 2;
  display: inline-flex; align-items: center; gap: 6px;
  background: #e11; color: #fff; font-size: 11px; font-weight: 700;
  padding: 6px 12px; border-radius: 999px; letter-spacing: .04em;
}

.rentabilidade { margin-top: 20px; }
.badge-green {
  display: inline-block; background: var(--green-dim); color: var(--green);
  border-radius: 999px; padding: 5px 10px; font-size: 12px; font-weight: 600;
}

/* Buy contract */
.buy-page { max-width: 1120px; }
.buy-intro { margin-bottom: 22px; }
.buy-kicker {
  font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: #E8C547; margin-bottom: 8px;
}
.buy-heading {
  font-family: var(--font-display); font-size: clamp(24px, 3vw, 32px);
  font-weight: 700; letter-spacing: -.02em; margin-bottom: 6px;
}
.buy-sub { color: var(--text-muted); font-size: 14px; max-width: 480px; }
.buy-balance-banner {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px;
  background: rgba(34, 197, 94, 0.08);
  border: 1px solid rgba(34, 197, 94, 0.28);
  border-radius: 14px; padding: 14px 16px; margin-bottom: 20px;
}
.buy-balance-banner span { display: block; font-size: 12px; color: var(--text-muted); }
.buy-balance-banner strong { font-size: 22px; color: #22c55e; font-family: var(--font-display); }
.pix-pay-box { margin-top: 4px; }
.pix-wait {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-top: 14px;
  padding: 12px 14px;
  border-radius: 12px;
  background: rgba(245, 158, 11, 0.1);
  border: 1px solid rgba(245, 158, 11, 0.35);
}
.pix-wait strong {
  display: block;
  font-size: 14px;
  color: #fbbf24;
  margin-bottom: 2px;
}
.pix-wait p {
  margin: 0;
  font-size: 12px;
  color: var(--text-muted);
  line-height: 1.4;
}
.pix-wait-dot {
  width: 10px;
  height: 10px;
  margin-top: 4px;
  border-radius: 50%;
  background: #f59e0b;
  flex-shrink: 0;
  animation: pixWaitPulse 1.2s ease-in-out infinite;
}
.pix-wait.is-paid {
  background: rgba(34, 197, 94, 0.1);
  border-color: rgba(34, 197, 94, 0.35);
}
.pix-wait.is-paid strong { color: #22c55e; }
.pix-wait.is-paid .pix-wait-dot {
  background: #22c55e;
  animation: none;
}
.pix-paid-alert { margin-bottom: 12px; }
@keyframes pixWaitPulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.35; transform: scale(0.85); }
}
.pix-qr-frame {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border-radius: 14px;
  padding: 12px;
  margin: 0 auto 12px;
  width: fit-content;
  max-width: 100%;
  line-height: 0;
  box-shadow: 0 8px 28px rgba(0,0,0,.35);
}
.pix-qr-img {
  display: block;
  width: 180px;
  height: 180px;
  max-width: min(180px, 70vw);
  max-height: min(180px, 70vw);
  object-fit: contain;
  border-radius: 6px;
}
@media (max-width: 480px) {
  .pix-qr-img {
    width: 160px;
    height: 160px;
  }
}
.pix-amount {
  text-align: center;
  font-size: 22px;
  font-weight: 700;
  color: #22c55e;
  font-family: var(--font-display);
  margin-bottom: 4px;
}
.pix-hint {
  text-align: center;
  font-size: 13px;
  color: var(--text-muted);
  margin-bottom: 16px;
}
.pix-copy-label {
  display: block;
  font-size: 12px;
  color: var(--text-muted);
  margin-bottom: 6px;
}
.pix-code {
  font-size: 11px !important;
  line-height: 1.4;
  word-break: break-all;
  margin-bottom: 12px;
}

.plans-dash {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-bottom: 8px;
}
.plan-select {
  position: relative; text-align: left;
  background: linear-gradient(180deg, #141414 0%, #0c0c0c 100%);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 20px; padding: 22px 20px 18px;
  cursor: pointer; transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
  color: inherit; font: inherit; width: 100%;
  appearance: none; -webkit-appearance: none;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
.plan-select:hover {
  border-color: rgba(224,184,58,.28);
  transform: translateY(-2px);
}
.plan-select.selected {
  border-color: rgba(224,184,58,.55);
  box-shadow: 0 0 0 1px rgba(224,184,58,.2), 0 18px 40px rgba(0,0,0,.35);
  background:
    radial-gradient(ellipse at top right, rgba(224,184,58,.12), transparent 50%),
    linear-gradient(180deg, #171210 0%, #0c0c0c 100%);
}
.plan-pill {
  position: absolute; top: 14px; right: 14px; z-index: 2;
  font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  color: #0a0a0a; background: linear-gradient(180deg, #F0D78C, #E0B83A);
  padding: 4px 9px; border-radius: 999px;
  max-width: 42%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.plan-select-top {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
  margin-bottom: 8px; padding-right: 88px;
}
.plan-select h3 {
  font-size: 17px; font-weight: 700; margin: 0; letter-spacing: -.01em;
}
.plan-rate {
  font-family: var(--font-display); font-size: 22px; font-weight: 700; color: #E8C547; line-height: 1;
  white-space: nowrap;
}
.plan-rate small { font-size: 12px; color: rgba(255,255,255,.45); font-weight: 500; margin-left: 2px; }
.plan-select .desc {
  color: rgba(255,255,255,.5); font-size: 13px; line-height: 1.45;
  margin: 0 0 16px; min-height: 38px;
}
.plan-stats { display: grid; gap: 10px; margin: 0 0 16px; padding: 0; }
.plan-stats li {
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
  font-size: 13px; color: rgba(255,255,255,.45);
  padding-bottom: 8px; border-bottom: 1px solid rgba(255,255,255,.05);
}
.plan-stats li:last-child { border-bottom: none; padding-bottom: 0; }
.plan-stats strong { color: #fff; font-weight: 600; text-align: right; }
.cap-bar { margin-top: 4px; }
.cap-bar .meta {
  display: flex; justify-content: space-between; gap: 8px;
  font-size: 11px; color: rgba(255,255,255,.4); margin-bottom: 7px;
}
.plan-check {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  width: 100%; min-height: 44px;
  margin-top: 16px; padding: 11px 16px;
  border: 1px solid rgba(34, 197, 94, .35);
  border-radius: 12px;
  background: linear-gradient(180deg, #34d399 0%, #16a34a 55%, #15803d 100%);
  color: #fff; font-size: 13px; font-weight: 700;
  letter-spacing: .02em;
  box-shadow: 0 8px 22px rgba(22, 163, 74, .28), inset 0 1px 0 rgba(255,255,255,.22);
  transition: filter .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.plan-select:hover .plan-check,
.plan-select.selected .plan-check {
  color: #fff;
  border-color: rgba(74, 222, 128, .55);
  background: linear-gradient(180deg, #4ade80 0%, #22c55e 55%, #16a34a 100%);
  box-shadow: 0 10px 28px rgba(34, 197, 94, .38), inset 0 1px 0 rgba(255,255,255,.28);
  filter: brightness(1.04);
}

.buy-grid {
  display: grid; grid-template-columns: 1.35fr .85fr; gap: 16px; align-items: start;
}

/* Buy checkout modal */
body.buy-modal-lock { overflow: hidden; }
.buy-modal[hidden] { display: none !important; }
.buy-modal {
  position: fixed; inset: 0; z-index: 10000;
  display: grid; place-items: center;
  padding: 20px 16px 100px;
  opacity: 0;
  pointer-events: none;
  transition: opacity .22s ease;
}
.buy-modal.is-open {
  opacity: 1;
  pointer-events: auto;
}
.buy-modal-backdrop {
  position: absolute; inset: 0;
  background: rgba(0,0,0,.78);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  cursor: pointer;
}
.buy-modal-sheet {
  position: relative; z-index: 2;
  width: min(860px, 100%);
  max-height: min(92vh, 820px);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  background:
    radial-gradient(ellipse at top left, rgba(224,184,58,.14), transparent 42%),
    linear-gradient(165deg, #171310 0%, #0c0c0c 55%, #0a0a0a 100%);
  border: 1px solid rgba(224,184,58,.28);
  border-radius: 24px;
  padding: 22px;
  box-shadow:
    0 30px 80px rgba(0,0,0,.55),
    0 0 0 1px rgba(255,255,255,.04) inset;
  transform: translateY(18px) scale(.97);
  transition: transform .28s cubic-bezier(.2,.9,.3,1);
}
.buy-modal.is-open .buy-modal-sheet {
  transform: translateY(0) scale(1);
}
.buy-modal-close {
  position: absolute; top: 14px; right: 14px; z-index: 5;
  width: 40px; height: 40px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.1);
  background: rgba(20,20,20,.92);
  color: rgba(255,255,255,.85);
  cursor: pointer;
  pointer-events: auto;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.buy-modal-close:hover {
  background: rgba(224,184,58,.12);
  border-color: rgba(224,184,58,.35);
  color: #E8C547;
}
.buy-modal-grid {
  display: grid;
  grid-template-columns: 1.35fr .85fr;
  gap: 14px;
  align-items: start;
  padding-top: 8px;
}
.buy-modal-checkout {
  margin: 0;
  box-shadow: none;
  border-color: rgba(255,255,255,.08);
  background: rgba(0,0,0,.22);
}
.buy-modal-meta {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin: -6px 0 16px;
}
.buy-modal-meta span {
  font-size: 12px; font-weight: 600;
  color: rgba(255,255,255,.7);
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 999px;
  padding: 5px 10px;
}
.buy-balance-banner--modal {
  margin-bottom: 16px;
  padding: 12px 14px;
}
.buy-balance-banner--modal strong { font-size: 18px; }
.buy-modal-aside { margin: 0; }

@media (max-width: 760px) {
  .buy-modal { padding: 12px 10px 90px; align-items: end; }
  .buy-modal-sheet {
    width: 100%;
    max-height: min(88vh, 760px);
    border-radius: 22px 22px 16px 16px;
    padding: 18px 14px 16px;
  }
  .buy-modal-grid { grid-template-columns: 1fr; padding-top: 28px; }
  .buy-modal-aside { display: none; }
  .buy-modal-checkout { padding: 22px 16px 18px; }
  .checkout-head { padding-right: 44px; }
  .buy-submit {
    min-height: 52px;
    border-radius: 14px;
    font-size: 15px;
    font-weight: 700;
    white-space: normal;
    line-height: 1.2;
    padding: 14px 18px;
  }
}
.checkout-card {
  max-width: none;
  background: linear-gradient(165deg, #141210 0%, #0c0c0c 100%);
  border: 1px solid rgba(224,184,58,.18);
  border-radius: 22px; padding: 26px;
  box-shadow: 0 20px 48px rgba(0,0,0,.35);
}
.checkout-head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
  margin-bottom: 22px; padding-bottom: 18px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.checkout-head h3 {
  font-family: var(--font-display); font-size: 20px; margin: 0 0 4px; letter-spacing: -.02em;
}
.checkout-head p { margin: 0; color: rgba(255,255,255,.45); font-size: 13px; }
.pay-badge {
  font-size: 11px; font-weight: 700; letter-spacing: .08em;
  color: #E8C547; background: rgba(224,184,58,.12);
  border: 1px solid rgba(224,184,58,.3);
  border-radius: 999px; padding: 7px 12px;
}
.selected-plan-chip {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  background: rgba(224,184,58,.08); border: 1px solid rgba(224,184,58,.2);
  border-radius: 12px; padding: 12px 14px; margin-bottom: 18px;
}
.selected-plan-chip span { font-size: 12px; color: rgba(255,255,255,.45); }
.selected-plan-chip strong { color: #E8C547; font-size: 14px; }

.amount-field {
  position: relative; display: flex; align-items: center;
}
.amount-prefix {
  position: absolute; left: 16px; z-index: 1;
  color: #E8C547; font-weight: 700; font-size: 14px; pointer-events: none;
}
.amount-field .input { padding-left: 46px; font-size: 18px; font-weight: 600; }
.field-hint {
  display: block; margin-top: 8px; font-size: 12px; color: rgba(255,255,255,.4);
}
.buy-submit { margin-top: 8px; padding: 15px 22px; font-size: 15px; }

.buy-aside { display: grid; gap: 12px; }
.buy-aside-card {
  background: #0e0e0e; border: 1px solid rgba(255,255,255,.06);
  border-radius: 18px; padding: 20px;
}
.buy-aside-card h4 {
  font-size: 13px; font-weight: 700; letter-spacing: .04em;
  text-transform: uppercase; color: rgba(255,255,255,.7); margin-bottom: 12px;
}
.buy-aside-card ol {
  margin: 0; padding-left: 18px; color: rgba(255,255,255,.55);
  font-size: 13px; line-height: 1.7;
}
.buy-aside-card ol li { margin-bottom: 4px; }
.buy-aside-muted p {
  margin: 0; color: rgba(255,255,255,.45); font-size: 13px; line-height: 1.55;
}
.buy-aside-muted strong { color: #E8C547; }

@media (max-width: 1024px) {
  .plans-dash, .buy-grid { grid-template-columns: 1fr; }
  .plan-select {
    padding-top: 18px;
  }
  .plan-pill {
    position: static;
    display: inline-flex;
    align-items: center;
    margin: 0 0 12px;
    max-width: none;
    overflow: visible;
    text-overflow: unset;
  }
  .plan-select-top {
    padding-right: 0;
    flex-wrap: nowrap;
    align-items: baseline;
    gap: 10px;
  }
  .plan-select h3 {
    flex: 1;
    min-width: 0;
    font-size: 16px;
    padding-right: 4px;
  }
  .plan-rate {
    flex-shrink: 0;
    font-size: 18px;
  }
  .plan-stats strong {
    text-align: right;
    word-break: break-word;
    overflow-wrap: anywhere;
  }
}

@media (max-width: 600px) {
  .buy-page { width: 100%; }
  .plans-dash { gap: 12px; }
  .plan-select {
    padding: 18px 16px 16px;
    border-radius: 18px;
    transform: none;
  }
  .plan-select:hover { transform: none; }
  .plan-select:active { transform: scale(.99); }
  .plan-select-top { align-items: center; }
  .plan-select .desc { min-height: 0; }
  .plan-check {
    min-height: 48px;
    margin-top: 14px;
    border-radius: 14px;
    background: linear-gradient(180deg, #34d399 0%, #16a34a 55%, #15803d 100%);
    border-color: rgba(34, 197, 94, .35);
    color: #fff;
    box-shadow: 0 8px 22px rgba(22, 163, 74, .28), inset 0 1px 0 rgba(255,255,255,.22);
  }
  .plan-check svg { flex: 0 0 auto; }
}

/* Tables */
.filters { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 18px; align-items: center; }
.search-input {
  flex: 1; min-width: 220px; background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius-pill); padding: 12px 18px 12px 42px; position: relative;
}
.filter-btn {
  background: transparent; border: 1px solid var(--border); color: var(--green);
  border-radius: var(--radius-pill); padding: 10px 16px; cursor: pointer; font-size: 13px;
}
.table-wrap { overflow-x: auto; border: 1px solid var(--border-soft); border-radius: 16px; }
table.data { width: 100%; border-collapse: collapse; }
table.data th, table.data td {
  padding: 14px 16px; text-align: left; border-bottom: 1px solid var(--border-soft); font-size: 13px;
}
table.data th { color: var(--text-muted); font-weight: 500; }
.empty-state { text-align: center; padding: 60px 20px; color: var(--text-muted); }
.empty-state .ei { color: var(--green); margin-bottom: 12px; display: flex; justify-content: center; }
.empty-state h3 { color: var(--text); margin-bottom: 8px; }
.pagination {
  display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap;
  gap: 12px; margin-top: 16px; color: var(--text-muted); font-size: 13px;
}
.page-btns { display: flex; gap: 6px; align-items: center; }
.page-btns button {
  background: var(--bg-card); border: 1px solid var(--border-soft); color: var(--text);
  border-radius: 10px; padding: 8px 12px; cursor: pointer;
}

.status {
  display: inline-block; padding: 4px 10px; border-radius: 999px; font-size: 11px; font-weight: 600;
}
.status-pending { background: rgba(245,197,66,.15); color: var(--gold); }
.status-active,
.status-completed,
.status-paid { background: rgba(34,197,94,.16); color: #4ade80; }
.status-failed, .status-rejected, .status-cancelled { background: rgba(255,77,79,.15); color: #ff8a8a; }

.wd-type {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 650;
  white-space: nowrap;
}
.wd-type-commission {
  background: rgba(224,184,58,.16);
  color: #F0D78C;
  border: 1px solid rgba(224,184,58,.35);
}
.wd-type-investment {
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.75);
  border: 1px solid rgba(255,255,255,.1);
}
.wd-amount-commission { color: #F0D78C !important; font-weight: 650; }
.wd-row-commission td:first-child {
  box-shadow: inset 3px 0 0 #E0B83A;
}

.tabs { display: flex; gap: 8px; margin-bottom: 20px; }
.tab {
  padding: 10px 18px; border-radius: var(--radius-pill); border: 1px solid var(--border-soft);
  background: transparent; color: var(--text-muted); cursor: pointer; font-size: 14px;
}
.tab.active { background: var(--green-dim); border-color: var(--border); color: var(--green); }

.info-box {
  border: 1px solid var(--border); border-radius: 16px; padding: 20px; margin: 16px 0;
  background: rgba(224,184,58,.04);
}
.info-box h4 { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.radio-row { display: flex; gap: 20px; margin: 16px 0; flex-wrap: wrap; }
.radio-row label { display: flex; align-items: center; gap: 8px; cursor: pointer; }
.rate-bar {
  background: var(--green); color: #1a0c00; font-weight: 600; text-align: center;
  padding: 12px; border-radius: 12px; margin-top: 20px;
}

.profile-head { display: flex; align-items: center; gap: 18px; margin-bottom: 28px; }
.profile-head .big-avatar {
  width: 80px; height: 80px; border-radius: 50%; background: var(--green); color: #1a0c00;
  display: grid; place-items: center; font-size: 32px; font-weight: 700;
}
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.form-grid .full { grid-column: 1 / -1; }

.arena-hero {
  text-align: center; padding: 48px 24px; border-radius: 20px;
  background: linear-gradient(160deg, rgba(100,50,0,.3), #0d1612);
  border: 1px solid var(--border); margin-bottom: 28px;
}
.gerente-hero {
  border-radius: 20px; padding: 32px; margin-bottom: 28px;
  background: linear-gradient(135deg, rgba(100,50,0,.3), #0d1612);
  border: 1px solid var(--border);
}
.gerente-hero ul,
.gerente-hero .feature-list { margin-top: 16px; list-style: none; padding: 0; }
.gerente-hero li { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; color: var(--text-muted); }
.gerente-hero li .svg-icon { color: var(--green); }

.network-stats {
  display: grid;
  grid-template-columns: repeat(var(--network-cols, 3), minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 24px;
}
.n-stat {
  display: block;
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-radius: 14px;
  padding: 16px;
  text-align: center;
  transition: border-color .2s ease, background .2s ease;
}
.n-stat:hover,
.n-stat.is-active {
  border-color: var(--green);
  background: rgba(224, 184, 58, 0.06);
}
.n-stat strong { display: block; font-size: 24px; color: var(--green); font-family: var(--font-display); }
.n-stat span { font-size: 12px; color: var(--text-muted); }
.ref-box {
  background: var(--bg-card); border: 1px dashed var(--border); border-radius: 14px;
  padding: 16px; display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 12px; align-items: center; margin-bottom: 20px;
}
.ref-label { font-size: 12px; color: var(--text-muted); }
.ref-code strong { font-size: 16px; letter-spacing: .04em; }
.ref-link {
  min-width: 0;
  background: var(--bg); padding: 10px 14px; border-radius: 10px;
  font-size: 13px; color: var(--text-muted);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ref-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
  flex-shrink: 0;
}
.ref-copy,
.ref-share { white-space: nowrap; flex-shrink: 0; }

.reward-progress-card {
  margin-bottom: 16px;
  padding: 18px;
}
.reward-progress-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}
.reward-progress-kicker {
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #E0B83A;
  font-weight: 650;
  margin-bottom: 4px;
}
.reward-progress-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}
.reward-progress-stats > div {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 12px;
  padding: 10px 12px;
}
.reward-progress-stats span {
  display: block;
  font-size: 11px;
  color: var(--text-muted);
  margin-bottom: 4px;
}
.reward-progress-stats strong {
  font-size: 18px;
  font-family: var(--font-display);
  letter-spacing: -.02em;
}
.reward-bars { display: grid; gap: 12px; }
.reward-bar-meta {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  font-size: 12px;
  color: var(--text-muted);
  margin-bottom: 6px;
}
.reward-bar-track {
  height: 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  overflow: hidden;
}
.reward-bar-track > span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #E0B83A, #F0D78C);
}
.reward-earned-note {
  margin: 12px 0 0;
  font-size: 12px;
  color: #86efac;
}

body.reward-modal-lock { overflow: hidden; }
.reward-modal[hidden] { display: none !important; }
.reward-modal {
  position: fixed;
  inset: 0;
  z-index: 11000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}
.reward-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.72);
}
.reward-modal-sheet {
  position: relative;
  z-index: 1;
  width: min(420px, 100%);
  max-height: min(92vh, 820px);
  overflow: auto;
  background: #12100E;
  border: 1px solid rgba(224,184,58,.22);
  border-radius: 18px;
  box-shadow: 0 24px 60px rgba(0,0,0,.45);
}
.reward-modal-close {
  position: sticky;
  top: 10px;
  float: right;
  z-index: 5;
  width: 40px;
  height: 40px;
  margin: 10px 10px -50px 0;
  border-radius: 50%;
  border: 1px solid rgba(224,184,58,.45);
  background: rgba(10,9,8,.88);
  color: #F0D78C;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(0,0,0,.45);
}
.reward-modal-close:hover,
.reward-modal-close:focus-visible {
  background: rgba(224,184,58,.18);
  border-color: rgba(224,184,58,.7);
  outline: none;
}
.reward-modal-dismiss {
  margin-top: 2px;
  color: rgba(255,255,255,.65) !important;
  border: none !important;
  background: transparent !important;
  min-height: 40px;
  font-weight: 500;
}
.reward-modal-dismiss:hover,
.reward-modal-dismiss:focus-visible {
  color: #F0D78C !important;
}
.reward-modal-media img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 18px 18px 0 0;
}
.reward-modal-body {
  padding: 16px 16px 18px;
}
.reward-modal-body h3 {
  margin: 0 0 6px;
  font-size: 20px;
  font-family: var(--font-display);
}
.reward-modal-sub {
  margin: 0 0 14px;
  font-size: 13px;
  color: var(--text-muted);
  line-height: 1.45;
}
.reward-modal-counters {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 14px;
}
.reward-modal-counters > div {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 12px;
  padding: 10px 8px;
  text-align: center;
}
.reward-modal-counters span {
  display: block;
  font-size: 10px;
  color: var(--text-muted);
  margin-bottom: 4px;
  line-height: 1.25;
}
.reward-modal-counters strong {
  font-size: 16px;
  font-family: var(--font-display);
}
.reward-modal-actions {
  display: grid;
  gap: 8px;
}
.reward-share-preview {
  margin: 10px 0 0;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(224,184,58,.08);
  border: 1px solid rgba(224,184,58,.18);
  color: rgba(255,255,255,.85);
  font-size: 12px;
  line-height: 1.45;
  white-space: pre-wrap;
}

/* Support chat modal */
body.support-modal-lock { overflow: hidden; }
.support-modal[hidden] { display: none !important; }
.support-modal {
  position: fixed;
  inset: 0;
  z-index: 12000;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding: 12px;
}
.support-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.72);
}
.support-modal-sheet {
  position: relative;
  z-index: 1;
  width: min(420px, 100%);
  max-height: min(88vh, 640px);
  display: flex;
  flex-direction: column;
  background: #12100E;
  border: 1px solid rgba(224,184,58,.22);
  border-radius: 18px;
  box-shadow: 0 24px 60px rgba(0,0,0,.45);
  overflow: hidden;
}
.support-modal-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 14px 12px;
  border-bottom: 1px solid rgba(255,255,255,.06);
  background: linear-gradient(180deg, rgba(224,184,58,.1), transparent);
}
.support-modal-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.support-modal-logo {
  width: 44px;
  height: 44px;
  object-fit: contain;
  border-radius: 10px;
  background: rgba(0,0,0,.25);
  flex-shrink: 0;
}
.support-modal-logo-fallback {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: linear-gradient(180deg, #F0D78C, #B8860B);
  color: #fff;
  flex-shrink: 0;
}
.support-modal-logo-fallback .svg-icon {
  stroke: #fff;
}
.support-modal-head h3 {
  margin: 0;
  font-size: 17px;
  font-family: var(--font-display);
}
.support-modal-head p {
  margin: 4px 0 0;
  font-size: 12px;
  color: var(--text-muted);
  line-height: 1.35;
}
.support-modal-close {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid rgba(224,184,58,.35);
  background: rgba(10,9,8,.85);
  color: #F0D78C;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  flex-shrink: 0;
}
.support-modal-msgs {
  flex: 1 1 auto;
  overflow: auto;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 220px;
  -webkit-overflow-scrolling: touch;
}
.support-chat-empty {
  margin: auto;
  text-align: center;
  color: var(--text-muted);
  font-size: 13px;
  padding: 24px 12px;
}
.support-bubble {
  max-width: 86%;
  padding: 10px 12px;
  border-radius: 14px;
  font-size: 13px;
  line-height: 1.45;
}
.support-bubble.is-user {
  align-self: flex-end;
  background: rgba(224,184,58,.16);
  border: 1px solid rgba(224,184,58,.22);
  border-bottom-right-radius: 4px;
}
.support-bubble.is-admin {
  align-self: flex-start;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.08);
  border-bottom-left-radius: 4px;
}
.support-bubble-meta {
  font-size: 10px;
  color: var(--text-muted);
  margin-bottom: 4px;
}
.support-bubble-body { color: rgba(255,255,255,.92); word-break: break-word; }
.support-modal-compose {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
  padding: 10px 12px;
  border-top: 1px solid rgba(255,255,255,.06);
  align-items: end;
}
.support-modal-compose textarea {
  width: 100%;
  resize: none;
  min-height: 44px;
  max-height: 96px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.1);
  background: rgba(0,0,0,.35);
  color: #fff;
  padding: 10px 12px;
  font: inherit;
  font-size: 13px;
}
.support-modal-compose .btn {
  min-height: 44px;
  padding: 0 16px;
}
.support-modal-wa {
  margin: 0;
  padding: 0 14px 12px;
  font-size: 11px;
  color: var(--text-muted);
  text-align: center;
}
.support-modal-wa a { color: #F0D78C; }
.support-end-btn {
  appearance: none;
  border: none;
  background: transparent;
  color: rgba(255,255,255,.55);
  font: inherit;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  padding: 6px 10px;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.support-end-btn:hover {
  color: #f87171;
}

/* Admin support — WhatsApp Desktop (light) */
.wa-support {
  --wa-bg: #efeae2;
  --wa-panel: #ffffff;
  --wa-header: #f0f2f5;
  --wa-border: #e9edef;
  --wa-green: #00a884;
  --wa-green-deep: #008069;
  --wa-green-bubble: #d9fdd3;
  --wa-green-dot: #25d366;
  --wa-in: #ffffff;
  --wa-text: #111b21;
  --wa-muted: #667781;
  --wa-hover: #f5f6f6;
  --wa-active: #f0f2f5;
  display: grid;
  grid-template-columns: minmax(280px, 380px) 1fr;
  gap: 0;
  min-height: min(80vh, 760px);
  max-height: min(84vh, 800px);
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid var(--wa-border);
  background: var(--wa-panel);
  box-shadow: 0 8px 30px rgba(11,20,26,.12);
  position: relative;
  z-index: 1;
  color: var(--wa-text);
}
.wa-support-sidebar {
  display: flex;
  flex-direction: column;
  background: var(--wa-panel);
  border-right: 1px solid var(--wa-border);
  min-height: 0;
  position: relative;
  z-index: 2;
}
.wa-support-side-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 16px;
  background: var(--wa-header);
  border-bottom: 1px solid var(--wa-border);
}
.wa-support-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.wa-support-side-head strong {
  display: block;
  font-size: 17px;
  color: var(--wa-text);
  font-weight: 700;
}
.wa-support-side-head span {
  font-size: 12px;
  color: var(--wa-muted);
}
.wa-support-badge {
  min-width: 22px;
  height: 22px;
  padding: 0 7px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: var(--wa-green-dot);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
}
.wa-support-search {
  padding: 8px 12px 10px;
  background: var(--wa-panel);
  border-bottom: 1px solid var(--wa-border);
}
.wa-support-search input {
  width: 100%;
  border: none;
  border-radius: 8px;
  background: var(--wa-header);
  color: var(--wa-text);
  padding: 10px 14px;
  font: inherit;
  font-size: 13px;
  outline: none;
}
.wa-support-search input::placeholder { color: #8696a0; }
.wa-support-chats {
  flex: 1;
  overflow: auto;
  min-height: 0;
  background: #fff;
}
.wa-support-empty {
  color: var(--wa-muted);
  font-size: 13px;
  text-align: center;
  padding: 28px 16px;
  margin: 0;
}
.wa-chat-item {
  display: flex;
  gap: 12px;
  align-items: center;
  width: 100%;
  padding: 12px 14px;
  text-decoration: none !important;
  color: inherit;
  border: none;
  border-bottom: 1px solid #f0f2f5;
  border-radius: 0;
  background: transparent;
  text-align: left;
  transition: background .12s;
  cursor: pointer;
  position: relative;
  z-index: 1;
  pointer-events: auto;
  font: inherit;
}
.wa-chat-item:hover { background: var(--wa-hover); }
.wa-chat-item.is-active { background: var(--wa-active); }
.wa-avatar {
  width: 49px;
  height: 49px;
  border-radius: 50%;
  flex-shrink: 0;
  display: grid;
  place-items: center;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .02em;
  color: #fff;
  background: linear-gradient(145deg, #00a884, #008069);
}
.wa-avatar-self {
  width: 40px;
  height: 40px;
  font-size: 13px;
  background: #dfe5e7;
  color: #54656f;
}
.wa-chat-body { flex: 1; min-width: 0; pointer-events: none; }
.wa-chat-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.wa-chat-row strong {
  font-size: 16px;
  color: #111b21;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wa-chat-row time {
  font-size: 12px;
  color: var(--wa-muted);
  flex-shrink: 0;
}
.wa-chat-item.is-open time { color: var(--wa-green-dot); font-weight: 600; }
.wa-chat-row p {
  margin: 3px 0 0;
  font-size: 13px;
  color: var(--wa-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
  min-width: 0;
}
.wa-you { color: var(--wa-muted); }
.wa-dot {
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--wa-green-dot);
  color: #fff;
  flex-shrink: 0;
  font-size: 11px;
  font-weight: 700;
  display: grid;
  place-items: center;
}
.wa-dot::before { content: '1'; }
.wa-support-main {
  display: flex;
  flex-direction: column;
  min-height: 0;
  background: var(--wa-bg);
  position: relative;
  z-index: 1;
}
.wa-thread {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
}
.wa-thread[hidden] { display: none !important; }
.wa-support-placeholder {
  margin: auto;
  text-align: center;
  padding: 40px 24px;
  max-width: 420px;
}
.wa-support-placeholder-ico {
  width: 72px;
  height: 72px;
  margin: 0 auto 16px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #fff;
  color: var(--wa-green);
  border: 1px solid var(--wa-border);
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
}
.wa-support-placeholder h3 {
  margin: 0 0 8px;
  font-size: 28px;
  font-weight: 300;
  color: #41525d;
}
.wa-support-placeholder p {
  margin: 0;
  color: var(--wa-muted);
  font-size: 14px;
  line-height: 1.5;
}
.wa-support-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 16px;
  background: var(--wa-header);
  border-bottom: 1px solid var(--wa-border);
}
.wa-support-top-user {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.wa-support-top-user .wa-avatar {
  width: 40px;
  height: 40px;
  font-size: 13px;
}
.wa-support-top-user strong {
  display: block;
  color: var(--wa-text);
  font-size: 16px;
  font-weight: 500;
}
.wa-support-top-user span {
  display: block;
  font-size: 13px;
  color: var(--wa-muted);
  margin-top: 1px;
}
.wa-support-top-user a { color: var(--wa-green-deep); }
.wa-support-status select {
  border: 1px solid var(--wa-border);
  border-radius: 8px;
  background: #fff;
  color: var(--wa-text);
  padding: 8px 10px;
  font: inherit;
  font-size: 12px;
}
.wa-support-msgs {
  flex: 1 1 auto;
  overflow: auto;
  padding: 18px 60px 24px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-height: 0;
  background-color: #efeae2;
  background-image:
    radial-gradient(rgba(0,0,0,.04) 1px, transparent 1px);
  background-size: 18px 18px;
}
.wa-day {
  align-self: center;
  margin: 10px 0 14px;
  padding: 6px 12px;
  border-radius: 8px;
  background: #ffffff;
  color: #54656f;
  font-size: 12.5px;
  box-shadow: 0 1px 1px rgba(11,20,26,.08);
}
.wa-msg {
  display: flex;
  width: 100%;
  margin-bottom: 2px;
}
.wa-msg.is-in { justify-content: flex-start; }
.wa-msg.is-out { justify-content: flex-end; }
.wa-msg-bubble {
  max-width: min(65%, 520px);
  padding: 6px 9px 4px;
  border-radius: 8px;
  position: relative;
  box-shadow: 0 1px 0.5px rgba(11,20,26,.13);
}
.wa-msg.is-in .wa-msg-bubble {
  background: var(--wa-in);
  border-top-left-radius: 0;
  color: var(--wa-text);
}
.wa-msg.is-out .wa-msg-bubble {
  background: var(--wa-green-bubble);
  border-top-right-radius: 0;
  color: #111b21;
}
.wa-msg-sig {
  font-size: 12.5px;
  font-weight: 700;
  color: #06cf9c;
  margin-bottom: 2px;
}
.wa-msg-text {
  font-size: 14.2px;
  line-height: 1.4;
  word-break: break-word;
  white-space: pre-wrap;
  color: #111b21;
}
.wa-msg-time {
  text-align: right;
  font-size: 11px;
  color: #667781;
  margin-top: 2px;
  margin-left: 12px;
  float: right;
  position: relative;
  top: 4px;
}
.wa-msg.is-out .wa-msg-time { color: #667781; }
.wa-chat-item.is-closed { opacity: .72; }
.wa-closed-tag {
  color: #ea4335;
  font-weight: 600;
  font-size: 12px;
}
.wa-closed-banner {
  display: flex;
  flex-direction: column;
  gap: 2px;
  align-items: center;
  text-align: center;
  padding: 8px 14px;
  background: #fff3cd;
  border-bottom: 1px solid #ffe69c;
  color: #664d03;
}
.wa-closed-banner strong {
  font-size: 13px;
  color: #ea4335;
}
.wa-closed-banner span {
  font-size: 12px;
  color: #664d03;
}
.wa-support-top-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.wa-support-delete-inline {
  margin: 0;
}
.wa-support-delete-inline .wa-delete-btn {
  width: auto;
  white-space: nowrap;
  padding: 8px 12px;
  min-height: 36px;
}
.wa-support-footer {
  background: var(--wa-header);
  border-top: 1px solid var(--wa-border);
}
.wa-support-compose {
  background: transparent;
  padding: 8px 12px 6px;
  border-top: none;
}
.wa-support-delete-row {
  display: flex;
  justify-content: center;
  padding: 0 12px 10px;
}
.wa-delete-btn {
  appearance: none;
  border: 1px solid #f1aeb5;
  background: #fff;
  color: #b02a37;
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  padding: 8px 14px;
  border-radius: 8px;
  cursor: pointer;
  width: 100%;
}
.wa-delete-btn:hover {
  background: #f8d7da;
}
.wa-support-sig-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  flex-wrap: wrap;
}
.wa-support-sig-row label {
  font-size: 11px;
  color: var(--wa-muted);
  margin: 0;
}
.wa-sig-input {
  width: 120px;
  border: 1px solid var(--wa-border);
  border-radius: 8px;
  background: #fff;
  color: var(--wa-green-deep);
  font-weight: 600;
  padding: 7px 10px;
  font: inherit;
  font-size: 13px;
  outline: none;
}
.wa-sig-preview {
  font-size: 11px;
  color: var(--wa-muted);
  flex: 1;
  min-width: 140px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wa-support-input-row {
  display: flex;
  align-items: flex-end;
  gap: 10px;
}
.wa-support-input-row textarea {
  flex: 1;
  resize: none;
  min-height: 42px;
  max-height: 120px;
  border: none;
  border-radius: 8px;
  background: #fff;
  color: var(--wa-text);
  padding: 11px 14px;
  font: inherit;
  font-size: 15px;
  line-height: 1.35;
  outline: none;
  box-shadow: 0 1px 1px rgba(0,0,0,.04);
}
.wa-send-btn {
  width: 46px;
  height: 46px;
  border: none;
  border-radius: 50%;
  background: var(--wa-green);
  color: #fff;
  display: grid;
  place-items: center;
  cursor: pointer;
  flex-shrink: 0;
}
.wa-send-btn:hover { background: var(--wa-green-deep); }
.wa-send-btn .svg-icon { stroke: #fff; }
.wa-support-closed {
  padding: 14px;
  text-align: center;
  color: var(--wa-muted);
  font-size: 13px;
  background: var(--wa-header);
}
@media (max-width: 900px) {
  .wa-support {
    grid-template-columns: 1fr;
    max-height: none;
    min-height: 0;
  }
  .wa-support-sidebar {
    max-height: 280px;
  }
  .wa-support-main {
    min-height: 480px;
  }
  .wa-support-msgs {
    padding: 14px 12px 18px;
  }
  .support-modal {
    padding: 8px 8px max(8px, env(safe-area-inset-bottom));
  }
  .support-modal-sheet {
    max-height: min(92vh, 100dvh - 16px);
    width: 100%;
  }
}

.network-cards { display: none; gap: 10px; }
.network-card {
  background: var(--bg); border: 1px solid var(--border-soft);
  border-radius: 12px; padding: 14px 16px;
}
.network-card-top {
  display: flex; justify-content: space-between; align-items: center; gap: 10px;
  margin-bottom: 4px;
}
.network-card-top strong { font-size: 15px; }
.network-card-down { font-size: 12px; color: var(--green); white-space: nowrap; }
.network-card-meta { font-size: 13px; color: var(--text-muted); margin-bottom: 6px; }
.network-card-email {
  font-size: 13px; color: var(--text);
  overflow-wrap: anywhere; word-break: break-word;
}
.network-card-date { margin-top: 8px; font-size: 12px; color: var(--text-muted); }
.network-card-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 12px;
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--border-soft);
}
.network-card-stats span {
  display: block;
  font-size: 11px;
  color: var(--text-muted);
  margin-bottom: 2px;
}
.network-card-stats strong {
  font-size: 13px;
  font-weight: 650;
  color: var(--text);
}
.aff-badge {
  display: inline-flex;
  align-items: center;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 650;
  white-space: nowrap;
  line-height: 1.2;
}
.aff-badge-ok {
  color: #86efac;
  background: rgba(34, 197, 94, 0.14);
  border: 1px solid rgba(34, 197, 94, 0.28);
}
.aff-badge-muted {
  color: var(--text-muted);
  background: rgba(255,255,255,0.04);
  border: 1px solid var(--border-soft);
}
.empty-state-sm { padding: 36px 16px; }
.empty-state-sm p { max-width: 260px; margin: 0 auto; line-height: 1.45; }

.money-commission { color: #22c55e !important; }
.network-summary-row {
  display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px;
  margin-bottom: 16px; padding-bottom: 16px; border-bottom: 1px solid var(--border-soft);
}
.network-summary-label { display: block; color: var(--text-muted); font-size: 13px; margin-bottom: 4px; }
.network-summary-value { font-size: 22px; }
.network-withdraw {
  display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 14px;
}
.commission-hint {
  background: rgba(34, 197, 94, 0.1);
  border: 1px solid rgba(34, 197, 94, 0.35);
  border-radius: 12px;
  padding: 12px 14px;
  margin-bottom: 14px;
  font-size: 13px;
  color: var(--text-muted);
}

/* Admin */
.admin-shell .sidebar { background: #050505; }
.admin-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 24px; }
.admin-stat {
  background: var(--bg-card); border: 1px solid var(--border-soft); border-radius: 16px; padding: 20px;
}
.admin-stat span { color: var(--text-muted); font-size: 13px; }
.admin-stat strong { display: block; font-size: 28px; margin-top: 6px; font-family: var(--font-display); }
.admin-login {
  min-height: 100vh; display: grid; place-items: center;
  background: radial-gradient(ellipse at center, rgba(80,40,0,.2), var(--bg));
}
.admin-login .box {
  width: min(420px, 92%); background: var(--bg-card); border: 1px solid var(--border);
  border-radius: 20px; padding: 32px;
}

/* ===== Admin modern UI ===== */
.admin-body {
  font-family: 'DM Sans', Inter, system-ui, sans-serif !important;
}
.admin-shell {
  background:
    radial-gradient(ellipse 60% 40% at 80% -10%, rgba(224,184,58,.08), transparent 55%),
    #0A0908;
}
.admin-menu-btn {
  display: none;
  position: fixed;
  top: 14px;
  left: 14px;
  z-index: 70;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  border: 1px solid rgba(224,184,58,.28);
  background: rgba(18,14,10,.92);
  color: #fff;
  cursor: pointer;
  place-items: center;
  padding: 0;
  backdrop-filter: blur(12px);
  box-shadow: 0 8px 28px rgba(0,0,0,.4);
}
.admin-overlay {
  position: fixed;
  inset: 0;
  z-index: 55;
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(4px);
  opacity: 0;
  pointer-events: none;
  transition: opacity .25s ease;
}
.admin-overlay.show {
  opacity: 1;
  pointer-events: auto;
}
.admin-brand {
  position: relative;
  justify-content: center;
  padding: 28px 20px 22px;
}
.admin-brand-logo {
  display: block;
  height: 72px;
  width: auto;
  max-width: 200px;
  object-fit: contain;
  margin: 0 auto;
}
.admin-sidebar-close {
  display: none;
  position: absolute;
  top: 14px;
  right: 12px;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.1);
  background: rgba(255,255,255,.04);
  color: #fff;
  cursor: pointer;
  place-items: center;
  padding: 0;
}
.admin-nav-logout {
  margin-top: 10px !important;
  color: rgba(255,120,100,.85) !important;
  border-top: 1px solid rgba(255,255,255,.06);
  padding-top: 14px !important;
  border-radius: 0 0 12px 12px !important;
}
.admin-nav-logout .nav-ico {
  color: rgba(255,120,100,.9) !important;
  border-color: rgba(255,100,80,.2) !important;
}
.admin-eyebrow {
  margin: 0 0 2px;
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(224,184,58,.8);
  font-weight: 600;
}
.admin-topbar {
  align-items: center;
  gap: 16px;
  border-bottom: 1px solid rgba(255,255,255,.06);
  background: linear-gradient(180deg, rgba(12,10,8,.9), transparent);
}
.admin-user-chip {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px 8px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
}
.admin-user-avatar {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: linear-gradient(145deg, #F0D78C, #B8860B);
  color: #fff;
  font-weight: 700;
  font-size: 13px;
}
.admin-user-chip strong {
  display: block;
  font-size: 13px;
  color: #fff;
  line-height: 1.2;
}
.admin-user-chip span {
  display: block;
  font-size: 11px;
  color: var(--text-muted);
}
.admin-content { max-width: 1180px; }

.admin-shell .admin-stats {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 14px;
  margin-bottom: 22px;
}
.admin-shell .admin-stat {
  position: relative;
  overflow: hidden;
  padding: 18px 18px 16px;
  background:
    linear-gradient(160deg, rgba(255,255,255,.04), rgba(255,255,255,.015));
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 18px;
  box-shadow: 0 10px 30px rgba(0,0,0,.18);
  transition: border-color .2s ease, transform .2s ease;
}
.admin-shell .admin-stat:hover {
  border-color: rgba(224,184,58,.28);
  transform: translateY(-1px);
}
.admin-stat-ico {
  width: 36px;
  height: 36px;
  border-radius: 11px;
  display: grid;
  place-items: center;
  margin-bottom: 14px;
  background: rgba(224,184,58,.1);
  border: 1px solid rgba(224,184,58,.22);
  color: #E8C547;
}
.admin-shell .admin-stat span {
  display: block;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .02em;
  color: rgba(255,255,255,.5);
}
.admin-shell .admin-stat strong {
  margin-top: 6px;
  font-size: 24px;
  letter-spacing: -.02em;
  color: #fff;
}
.admin-stat-warn .admin-stat-ico {
  background: rgba(239,68,68,.12);
  border-color: rgba(239,68,68,.3);
  color: #f87171;
}
.admin-stat-ok .admin-stat-ico {
  background: rgba(34,197,94,.12);
  border-color: rgba(34,197,94,.3);
  color: #4ade80;
}

.admin-panel {
  background: linear-gradient(160deg, rgba(255,255,255,.035), rgba(255,255,255,.015));
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 20px;
  padding: 22px;
  box-shadow: 0 12px 36px rgba(0,0,0,.18);
}
.admin-panel-head {
  margin-bottom: 16px;
}
.admin-panel-head h3 {
  margin: 0 0 4px;
  font-family: var(--font-display);
  font-size: 18px;
  color: #fff;
}
.admin-panel-head p {
  margin: 0;
  font-size: 13px;
  color: var(--text-muted);
}
.admin-shortcuts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
}
.admin-shortcut {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(0,0,0,.25);
  border: 1px solid rgba(255,255,255,.07);
  color: rgba(255,255,255,.8);
  font-size: 13px;
  font-weight: 550;
  transition: border-color .18s ease, background .18s ease, color .18s ease;
}
.admin-shortcut:hover {
  color: #fff;
  border-color: rgba(224,184,58,.35);
  background: rgba(224,184,58,.08);
}
.admin-shortcut .nav-ico {
  width: 32px;
  height: 32px;
  border-radius: 9px;
}

.admin-money-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.admin-shell .admin-money-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px;
}
.admin-money-card,
.admin-shell .admin-money-card {
  display: block;
  padding: 20px 22px;
  border-radius: 18px;
  background: linear-gradient(160deg, rgba(255,255,255,.05), rgba(255,255,255,.015));
  border: 1px solid rgba(255,255,255,.1);
  box-shadow: 0 10px 30px rgba(0,0,0,.2);
  box-sizing: border-box;
  min-width: 0;
}
.admin-money-card-accent,
.admin-shell .admin-money-card-accent {
  background: linear-gradient(145deg, rgba(224,184,58,.16), rgba(224,184,58,.04)) !important;
  border-color: rgba(224,184,58,.35) !important;
  box-shadow: 0 10px 32px rgba(224,184,58,.1);
}
.admin-money-card-paid,
.admin-shell .admin-money-card-paid {
  background: linear-gradient(145deg, rgba(34,197,94,.12), rgba(34,197,94,.03)) !important;
  border-color: rgba(34,197,94,.32) !important;
}
.admin-money-card-paid .admin-money-label,
.admin-shell .admin-money-card-paid .admin-money-label {
  color: #4ade80;
}
.admin-money-label,
.admin-shell .admin-money-label {
  display: block !important;
  font-size: 12px;
  color: var(--text-muted);
  margin-bottom: 10px;
  font-weight: 600;
  letter-spacing: .02em;
  text-transform: uppercase;
}
.admin-money-value,
.admin-shell .admin-money-value {
  display: block !important;
  font-size: 30px !important;
  font-family: var(--font-display);
  font-weight: 700;
  color: #fff !important;
  line-height: 1.15;
  letter-spacing: -.02em;
  margin: 0;
}
.admin-money-card small,
.admin-shell .admin-money-card small {
  display: block !important;
  margin-top: 10px;
  font-size: 12px;
  color: var(--text-muted);
  line-height: 1.45;
}

.admin-recent-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 16px;
}
.admin-panel-head-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.admin-recent-table {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
  border-radius: 0 !important;
}
.admin-recent-table table.data {
  margin: 0;
}
.admin-recent-table table.data th,
.admin-recent-table table.data td {
  font-size: 12px;
  padding: 10px 8px;
}
.admin-recent-table table.data th:first-child,
.admin-recent-table table.data td:first-child {
  padding-left: 0;
}
.admin-recent-table table.data th:last-child,
.admin-recent-table table.data td:last-child {
  padding-right: 0;
  text-align: right;
  white-space: nowrap;
}

@media (max-width: 1100px) {
  .admin-recent-grid {
    grid-template-columns: 1fr;
  }
}

.admin-shell .card,
.admin-shell .table-wrap,
.admin-shell .filters {
  background: linear-gradient(160deg, rgba(255,255,255,.035), rgba(255,255,255,.015));
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 18px;
  box-shadow: 0 10px 30px rgba(0,0,0,.15);
}
.admin-shell .filters {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  padding: 14px;
  margin-bottom: 16px;
  align-items: center;
}
.admin-shell .search-input,
.admin-shell .input,
.admin-shell .textarea,
.admin-shell select.input {
  background: rgba(0,0,0,.35) !important;
  border: 1px solid rgba(255,255,255,.1) !important;
  border-radius: 12px !important;
  color: #fff !important;
}
.admin-shell .table-wrap {
  overflow: auto;
  padding: 0;
}
.admin-shell table.data {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.admin-shell table.data th {
  text-align: left;
  padding: 14px 16px;
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(255,255,255,.42);
  border-bottom: 1px solid rgba(255,255,255,.06);
  background: rgba(0,0,0,.2);
  white-space: nowrap;
}
.admin-shell table.data td {
  padding: 14px 16px;
  border-bottom: 1px solid rgba(255,255,255,.05);
  color: rgba(255,255,255,.82);
  vertical-align: middle;
}
.admin-shell table.data tr:hover td {
  background: rgba(224,184,58,.04);
}
.admin-shell .card {
  padding: 22px;
  margin-bottom: 16px;
}
.admin-shell .card-title {
  margin: 0 0 16px;
  font-size: 16px;
  font-family: var(--font-display);
}
.admin-shell .btn-outline {
  border-color: rgba(224,184,58,.3);
  color: #F0D78C;
}
.admin-shell .btn-outline:hover {
  background: rgba(224,184,58,.1);
}
.admin-shell .form-grid {
  gap: 14px;
}
.admin-shell .form-group label {
  color: rgba(255,255,255,.55);
  font-size: 12px;
  margin-bottom: 6px;
}

/* ATLAS admin — form + nested tables */
.admin-atlas-form {
  max-width: 560px;
}
.admin-atlas-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-bottom: 8px;
}
.admin-atlas-grid .form-group {
  margin-bottom: 0;
}
.admin-atlas-grid .form-group.full {
  grid-column: 1 / -1;
}
.admin-atlas-form .btn {
  margin-top: 8px;
  width: 100%;
}
.admin-shell input[type="date"].input {
  color-scheme: dark;
  min-height: 48px;
}
.admin-panel .table-wrap.admin-panel-table {
  background: transparent;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 14px;
  box-shadow: none;
  margin: 0;
}
.admin-panel .admin-panel-table table.data {
  min-width: 640px;
}
.admin-panel .admin-panel-table table.data th,
.admin-panel .admin-panel-table table.data td {
  white-space: nowrap;
}
.admin-panel .admin-panel-table table.data td:first-child {
  white-space: normal;
  min-width: 140px;
}
@media (max-width: 640px) {
  .admin-atlas-grid {
    grid-template-columns: 1fr;
  }
}

.admin-login {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
  background:
    radial-gradient(ellipse 50% 40% at 50% 0%, rgba(224,184,58,.18), transparent 60%),
    #0A0908;
}
.admin-login .box {
  width: min(420px, 100%);
  background: linear-gradient(160deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  border: 1px solid rgba(224,184,58,.22);
  border-radius: 24px;
  padding: 36px 28px;
  box-shadow: 0 24px 60px rgba(0,0,0,.45);
}
.admin-login .box h1 {
  font-family: 'Space Grotesk', var(--font-display), sans-serif;
  letter-spacing: .04em;
}

@media (max-width: 1024px) {
  .admin-shell .sidebar {
    display: flex !important;
    transform: translateX(-105%);
    transition: transform .28s ease;
    z-index: 60;
    width: min(300px, 86vw);
    box-shadow: 20px 0 50px rgba(0,0,0,.5);
  }
  .admin-shell .sidebar.open { transform: translateX(0); }
  .admin-shell .main { margin-left: 0 !important; padding-bottom: 24px !important; }
  .admin-menu-btn { display: grid; }
  .admin-sidebar-close { display: grid; }
  .admin-shell .topbar {
    display: flex !important;
    padding-top: 18px;
    padding-left: 68px !important;
  }
  .admin-shell .content {
    padding: 8px 16px 28px !important;
  }
  .admin-user-chip span { display: none; }
  .admin-shell .admin-stats {
    grid-template-columns: repeat(2, 1fr);
  }
  .admin-shell .admin-stat strong { font-size: 20px; }
  body.admin-menu-open { overflow: hidden; }
}

@media (max-width: 560px) {
  .admin-shell .admin-stats { grid-template-columns: 1fr; }
  .admin-shortcuts { grid-template-columns: 1fr 1fr; }
  .admin-money-grid,
  .admin-shell .admin-money-grid { grid-template-columns: 1fr !important; }
  .admin-shell .admin-money-value { font-size: 24px !important; }
  .admin-shell table.data { min-width: 720px; }
}

.admin-top3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.admin-top3-card {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 14px;
  border-radius: 16px;
  background: rgba(0,0,0,.28);
  border: 1px solid rgba(255,255,255,.07);
  color: inherit;
  transition: border-color .18s ease, background .18s ease;
}
.admin-top3-card:hover {
  border-color: rgba(224,184,58,.35);
  background: rgba(224,184,58,.08);
}
.admin-top3-rank {
  width: 36px;
  height: 36px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  font-weight: 800;
  font-size: 13px;
  color: #1a0c00;
  background: linear-gradient(145deg, #F5E6B0, #E0B83A);
  flex-shrink: 0;
}
.admin-top3-card:nth-child(2) .admin-top3-rank {
  background: linear-gradient(145deg, #d4d4d8, #a1a1aa);
  color: #18181b;
}
.admin-top3-card:nth-child(3) .admin-top3-rank {
  background: linear-gradient(145deg, #d97706, #92400e);
  color: #fff;
}
.admin-top3-body strong {
  display: block;
  color: #fff;
  font-size: 14px;
  margin-bottom: 2px;
}
.admin-top3-body > span {
  display: block;
  font-size: 12px;
  color: var(--text-muted);
  margin-bottom: 8px;
}
.admin-top3-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  font-size: 12px;
  color: #F0D78C;
  font-weight: 600;
}
.admin-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  max-width: 280px;
}
.admin-edit-grid {
  display: grid;
  grid-template-columns: 1.2fr .9fr;
  gap: 16px;
  align-items: start;
}
.admin-wallet-list {
  display: grid;
  gap: 8px;
}
.admin-wallet-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(0,0,0,.25);
  border: 1px solid rgba(255,255,255,.06);
  font-size: 13px;
  color: var(--text-muted);
}
.admin-wallet-row strong { color: #fff; }
.admin-level-pill {
  display: inline-flex;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  color: #F0D78C;
  background: rgba(224,184,58,.12);
  border: 1px solid rgba(224,184,58,.25);
}
@media (max-width: 900px) {
  .admin-top3 { grid-template-columns: 1fr; }
  .admin-edit-grid { grid-template-columns: 1fr; }
  .admin-actions { max-width: none; }
}

.mobile-toggle {
  display: none; position: fixed; top: 14px; left: 14px; z-index: 60;
  width: 42px; height: 42px; border-radius: 12px; border: 1px solid var(--border);
  background: var(--bg-card); color: var(--text); cursor: pointer;
  place-items: center; padding: 0;
}

@media (max-width: 1024px) {
  .auth-page { grid-template-columns: 1fr; }
  .auth-right { display: none; }
  .hero-grid, .plans-grid, .plans-dash, .dash-grid, .founder, .footer-grid, .form-grid, .admin-stats, .quick-actions {
    grid-template-columns: 1fr;
  }
  .network-stats {
    grid-template-columns: repeat(var(--network-cols, 3), minmax(0, 1fr));
  }
  .quick-actions { grid-template-columns: repeat(3, 1fr); }
  .qa-row { gap: 12px; }
  .trading-media { grid-template-columns: 80px 1fr; }
  .sidebar {
    transform: translateX(-105%);
    transition: transform .28s ease;
  }
  .sidebar.open { transform: translateX(0); }
  .main { margin-left: 0; }
  .mobile-toggle { display: grid; place-items: center; }
  .nav-links { display: none; }
  .topbar, .content { padding-left: 16px; padding-right: 16px; }
}

.btn-primary {
  background: linear-gradient(180deg, #F0D78C 0%, #E0B83A 50%, #8B6914 100%) !important;
  color: #fff !important;
  box-shadow: 0 4px 24px rgba(224, 184, 58, .4) !important;
}
body {
  background: #0A0908 !important;
}
.avatar, .big-avatar, .rate-bar {
  background: linear-gradient(180deg, #F0D78C, #B8860B) !important;
  color: #fff !important;
}

/* ========== MOBILE APP SHELL ========== */
.m-header,
.m-balance,
.m-bottom-nav { display: none; }

@media (max-width: 900px) {
  body:not(.admin-body) .mobile-toggle { display: none !important; }
  body:not(.admin-body) .desk-only { display: none !important; }
  body:not(.admin-body) .sidebar { display: none !important; }
  body:not(.admin-body) .main {
    margin-left: 0 !important;
    padding-bottom: 0;
    padding-top: 0;
    min-height: 100dvh;
  }
  body:not(.admin-body) .topbar { display: none !important; }
  body:not(.admin-body) .content {
    padding: 4px 16px calc(120px + env(safe-area-inset-bottom, 0px)) !important;
    overflow-x: clip;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }

  .ref-box {
    grid-template-columns: 1fr auto;
    grid-template-areas:
      "code actions"
      "link link";
  }
  .ref-code { grid-area: code; }
  .ref-actions { grid-area: actions; align-self: center; }
  .ref-link { grid-area: link; font-size: 12px; }

  .reward-progress-stats {
    grid-template-columns: 1fr;
  }
  .reward-progress-head {
    flex-direction: column;
    align-items: stretch;
  }
  .reward-progress-head .btn { width: 100%; }
  .reward-modal {
    padding: 8px 8px max(8px, env(safe-area-inset-bottom));
    align-items: center;
  }
  .reward-modal-sheet {
    width: 100%;
    max-height: min(92vh, 100dvh - 16px);
    border-radius: 16px;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
  }
  .reward-modal-media {
    max-height: none;
    overflow: visible;
    background: #0a0908;
  }
  .reward-modal-media img {
    width: 100%;
    height: auto;
    max-height: none;
    object-fit: contain;
    object-position: center top;
    border-radius: 16px 16px 0 0;
  }
  .reward-modal-body {
    padding: 10px 12px 12px;
  }
  .reward-modal-body h3 {
    font-size: 15px;
    margin-bottom: 4px;
  }
  .reward-modal-sub {
    font-size: 11px;
    margin-bottom: 8px;
    line-height: 1.35;
  }
  .reward-modal-counters {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    margin-bottom: 10px;
  }
  .reward-modal-counters > div {
    padding: 6px 4px;
    border-radius: 10px;
  }
  .reward-modal-counters span {
    font-size: 9px;
    margin-bottom: 2px;
  }
  .reward-modal-counters strong {
    font-size: 13px;
  }
  .reward-modal-body .btn {
    min-height: 40px;
    font-size: 13px;
    padding: 10px 14px;
  }
  .reward-share-preview {
    font-size: 11px;
    padding: 8px 10px;
  }

  .network-table-desk { display: none !important; }
  .network-cards { display: grid; }
  .network-stats { gap: 8px; }
  .n-stat { padding: 12px 8px; }
  .n-stat strong { font-size: 20px; }
  .n-stat span { font-size: 11px; }
  .network-withdraw { flex-direction: column; align-items: stretch; }
  .network-withdraw .btn { width: 100%; justify-content: center; }

  .m-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px 10px;
    padding-top: calc(12px + env(safe-area-inset-top, 0px));
    position: sticky;
    top: 0;
    z-index: 50;
    background: #0A0908;
    border-bottom: 1px solid rgba(255,255,255,.04);
    box-sizing: border-box;
  }
  .m-user {
    display: flex;
    align-items: center;
    gap: 10px;
  }
  .m-avatar {
    width: 42px; height: 42px; border-radius: 50%;
    background: linear-gradient(180deg, #F0D78C, #B8860B);
    color: #fff; font-weight: 700; font-size: 16px;
    display: grid; place-items: center;
    box-shadow: 0 0 16px rgba(224,184,58,.35);
  }
  .m-brand-logo {
    display: inline-flex;
    align-items: center;
    height: 44px;
    max-width: 150px;
    flex-shrink: 0;
  }
  .m-brand-logo img {
    height: 44px;
    width: auto;
    max-width: 150px;
    object-fit: contain;
    display: block;
  }
  .m-avatar-logo {
    width: 52px;
    height: 52px;
    background: #12100E;
    border: 1px solid rgba(224,184,58,.4);
    padding: 2px;
    overflow: hidden;
  }
  .m-avatar-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
  }
  .m-username {
    font-weight: 700; font-size: 15px; color: #fff;
    max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    line-height: 1.2;
  }
  .m-username em {
    font-style: normal;
    font-weight: 500;
    color: var(--text-muted);
    margin-right: 4px;
  }
  .m-header-actions { display: flex; gap: 8px; }
  .m-round-btn {
    width: 42px; height: 42px; border-radius: 50%;
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(255,255,255,.08);
    color: #fff; display: grid; place-items: center;
    position: relative; cursor: pointer; font-size: 16px;
  }
  .m-round-btn .dot {
    position: absolute; top: 8px; right: 8px;
    width: 8px; height: 8px; border-radius: 50%; background: #ff4d4f;
  }

  .m-balance { display: block; padding: 0 0 16px; }
  .m-balance-panel {
    background: linear-gradient(165deg, #17140f 0%, #100e0c 100%);
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 18px;
    padding: 16px 16px 4px;
    box-shadow: 0 10px 28px rgba(0,0,0,.28);
  }
  .m-balance-hero {
    position: relative;
    padding: 2px 2px 14px;
  }
  .m-balance-hero::after {
    content: '';
    display: block;
    width: 28px;
    height: 2px;
    margin-top: 12px;
    border-radius: 2px;
    background: #E0B83A;
  }
  .m-balance-label {
    font-size: 12px; color: var(--text-muted); margin-bottom: 6px; font-weight: 500;
  }
  .m-balance-value {
    font-size: 34px; font-weight: 700; color: #fff;
    font-family: 'Space Grotesk', Inter, sans-serif;
    letter-spacing: -.04em;
    line-height: 1.05;
    background: linear-gradient(180deg, #fff 40%, #F0D78C);
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .m-balance-breakdown {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    margin: 0;
    border-top: 1px solid rgba(255,255,255,.07);
  }
  .m-balance-breakdown > div {
    padding: 12px 8px 12px 2px;
  }
  .m-balance-breakdown > div:nth-child(-n+2) {
    border-bottom: 1px solid rgba(255,255,255,.06);
  }
  .m-balance-breakdown > div:nth-child(odd) {
    padding-right: 12px;
    border-right: 1px solid rgba(255,255,255,.06);
  }
  .m-balance-breakdown > div:nth-child(even) {
    padding-left: 12px;
  }
  .m-balance-breakdown dt {
    font-size: 11px;
    color: var(--text-muted);
    margin-bottom: 4px;
    font-weight: 500;
  }
  .m-balance-breakdown dd {
    margin: 0;
    font-size: 15px;
    font-weight: 650;
    color: #fff;
    font-family: 'Space Grotesk', Inter, sans-serif;
    letter-spacing: -.02em;
    line-height: 1.2;
  }
  .m-balance-breakdown .is-comm { color: #4ade80; }
  .m-balance-row,
  .m-balance-card,
  .m-balance-sub,
  .m-balance-grid,
  .m-balance-tile { display: none !important; }
  .m-currency-toggle {
    width: 52px;
    border-radius: 999px;
    background: #12100E;
    border: 1px solid rgba(255,255,255,.08);
    display: flex; flex-direction: column; padding: 6px; gap: 4px;
  }
  .m-cur {
    flex: 1; border: none; border-radius: 999px;
    background: transparent; color: #8a8a8a;
    font-weight: 700; font-size: 15px; cursor: pointer;
  }
  .m-cur.active {
    background: linear-gradient(180deg, #F0D78C, #B8860B);
    color: #fff;
    box-shadow: 0 0 12px rgba(224,184,58,.35);
  }

  .people-strip { margin: 0 -4px 8px; padding-bottom: 14px; }
  .qa-actions {
    flex-direction: column;
    align-items: stretch;
    gap: 14px;
    margin: 2px 0 20px;
    width: 100%;
  }
  .qa-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
    width: 100%;
    margin: 0;
    padding: 0;
    overflow: visible;
    flex: none;
  }
  .qa-pill {
    width: 100%;
    max-width: 100%;
    height: 50px;
    padding: 0 16px;
    font-size: 14px;
    justify-content: center;
    border-radius: 14px;
  }
  .qa-circle {
    flex: initial;
    min-width: 0;
    width: 100%;
  }
  .qa-ci {
    width: 48px;
    height: 48px;
    border-radius: 14px;
  }

  .roadmap-card { padding: 14px; overflow: hidden; width: 100%; max-width: 100%; box-sizing: border-box; }
  .day-card { min-width: 136px; min-height: 136px; }
  .progress-meta {
    flex-wrap: wrap;
    gap: 6px 10px;
    font-size: 11px;
  }
  .days-row {
    margin: 0;
    width: 100%;
    max-width: 100%;
  }
  .promo-card {
    min-height: auto;
    padding: 20px 18px;
    text-align: left;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0;
    transform: none !important;
    box-sizing: border-box;
  }
  .promo-card:hover { transform: none !important; }
  .promo-card .trophy { margin-bottom: 4px; }
  .promo-card h3 { font-size: 22px; color: #fff; word-break: break-word; }
  .promo-card p { color: rgba(224,184,58,.85); margin-bottom: 10px; }

  .m-chart-card {
    min-height: 200px;
    border-radius: 20px !important;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
  .line-chart { height: 140px; max-width: 100%; }
  .trading-card { margin-bottom: 4px; width: 100%; max-width: 100%; box-sizing: border-box; }
  .trading-media {
    grid-template-columns: 72px 1fr;
    min-height: 140px;
  }
  .tm-thumb { min-height: 140px; }

  .dash-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 14px;
    width: 100%;
    max-width: 100%;
  }
  .dash-grid-top,
  .dash-grid-bottom {
    width: 100%;
    max-width: 100%;
  }
  .dash-grid-bottom { margin-bottom: 0; padding-bottom: 8px; }
  .page-title { display: none; }

  .m-bottom-nav {
    display: flex;
    position: fixed;
    left: 50%;
    bottom: calc(12px + env(safe-area-inset-bottom, 0px));
    transform: translateX(-50%);
    z-index: 90;
    width: min(360px, calc(100% - 28px));
    height: 62px;
    padding: 0 10px;
    align-items: center;
    justify-content: space-around;
    border-radius: 999px;
    background: rgba(18, 16, 14, .92);
    backdrop-filter: blur(18px) saturate(160%);
    -webkit-backdrop-filter: blur(18px) saturate(160%);
    border: 1px solid rgba(255,255,255,.08);
    box-shadow: 0 10px 40px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.06);
    overflow: visible;
    box-sizing: border-box;
  }
  .m-nav-item {
    width: 46px; height: 46px; border-radius: 50%;
    display: grid; place-items: center;
    color: #8a8a8a; transition: .2s;
    flex-shrink: 0;
  }
  .m-nav-item.active {
    color: #E0B83A;
    background: rgba(224,184,58,.12);
    box-shadow: 0 0 18px rgba(224,184,58,.28);
  }
  .m-nav-item .svg-icon { width: 22px; height: 22px; }
  .wa-fab,
  .support-fab {
    bottom: calc(88px + env(safe-area-inset-bottom, 0px)) !important;
    right: 16px !important;
    width: 50px !important;
    height: 50px !important;
    z-index: 85;
  }
  .wa-fab svg,
  .support-fab svg { width: 24px; height: 24px; }
}

@media (min-width: 901px) {
  .m-header, .m-balance, .m-bottom-nav { display: none !important; }
}

/* PWA standalone / iOS home screen — safe-area só via bottom/top, sem padding extra na pill */
@media (display-mode: standalone), (display-mode: fullscreen) {
  @media (max-width: 900px) {
    .m-header {
      display: flex !important;
      padding-top: calc(14px + env(safe-area-inset-top, 20px));
      background: #0A0908 !important;
    }
    .m-bottom-nav {
      /* NÃO somar safe-area no padding — já está no `bottom` */
      padding: 0 10px !important;
      height: 62px !important;
      bottom: calc(12px + env(safe-area-inset-bottom, 0px));
      align-items: center;
    }
  }
}
@supports (-webkit-touch-callout: none) {
  @media (max-width: 900px) {
    .m-header {
      padding-top: calc(12px + env(safe-area-inset-top, 0px));
    }
    .m-bottom-nav {
      padding: 0 10px;
      height: 62px;
      align-items: center;
    }
  }
}

html, body.app-body, body {
  overflow-x: clip;
  max-width: 100%;
}
.app-shell, .main {
  max-width: 100%;
  min-width: 0;
}
.content {
  max-width: 100%;
  min-width: 0;
  overflow-x: visible;
}
/* single modern scrollbar */
html {
  scrollbar-width: thin;
  scrollbar-color: #E0B83A #12100E;
}
html::-webkit-scrollbar { width: 8px; height: 8px; }
html::-webkit-scrollbar-track { background: #0A0908; }
html::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #F0D78C, #B8860B);
  border-radius: 8px;
}

/* Contract receipt modal (nota) */
.receipt-overlay {
  position: fixed; inset: 0; z-index: 9999;
  display: grid; place-items: center;
  padding: 20px 16px 110px;
  animation: receiptFade .28s ease;
}
.receipt-overlay.is-closing { opacity: 0; transition: opacity .2s ease; pointer-events: none; }
.receipt-backdrop {
  position: absolute; inset: 0;
  background: rgba(0,0,0,.72);
  backdrop-filter: blur(6px);
  z-index: 0;
  cursor: pointer;
}
.receipt-sheet {
  position: relative; z-index: 2;
  width: min(400px, 100%);
  max-height: min(90vh, 720px);
  overflow-y: auto;
  background:
    linear-gradient(180deg, #1a1612 0%, #110e0c 100%);
  border: 1px solid rgba(224,184,58,.35);
  border-radius: 18px;
  padding: 28px 24px 22px;
  box-shadow:
    0 30px 80px rgba(0,0,0,.55),
    0 0 0 1px rgba(255,255,255,.04) inset;
  animation: receiptPop .35s cubic-bezier(.2,.9,.3,1);
  -webkit-overflow-scrolling: touch;
}
#closeReceiptBtn {
  position: relative;
  z-index: 3;
  cursor: pointer;
  pointer-events: auto;
}
.receipt-perforation {
  position: absolute; left: 12px; right: 12px; top: 0;
  height: 10px;
  background:
    radial-gradient(circle at 8px 0, transparent 5px, #0A0908 6px) repeat-x;
  background-size: 16px 10px;
  opacity: .55;
  transform: translateY(-5px);
}
.receipt-head {
  display: flex; justify-content: space-between; align-items: center;
  gap: 12px; margin-bottom: 18px;
}
.receipt-brand {
  display: flex; align-items: center; gap: 12px;
}
.receipt-brand img {
  width: 42px; height: 42px; object-fit: contain;
  border-radius: 10px;
  background: rgba(224,184,58,.12);
  padding: 6px;
  border: 1px solid rgba(224,184,58,.25);
}
.receipt-brand strong {
  display: block; font-size: 14px; letter-spacing: .06em;
  font-family: var(--font-display);
}
.receipt-brand span {
  font-size: 11px; color: var(--text-muted); text-transform: uppercase; letter-spacing: .08em;
}
.receipt-stamp {
  font-size: 11px; font-weight: 800; letter-spacing: .14em;
  color: #22c55e;
  border: 2px solid #22c55e;
  border-radius: 6px;
  padding: 6px 10px;
  transform: rotate(-8deg);
  opacity: .95;
}
.receipt-check {
  width: 56px; height: 56px; margin: 8px auto 12px;
  border-radius: 50%;
  display: grid; place-items: center;
  background: rgba(224,184,58,.14);
  border: 1px solid rgba(224,184,58,.35);
  color: var(--green);
}
.receipt-title {
  text-align: center;
  font-family: var(--font-display);
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -.02em;
  margin: 0 0 6px;
}
.receipt-sub {
  text-align: center;
  color: var(--text-muted);
  font-size: 13px;
  margin: 0 0 18px;
}
.receipt-divider {
  display: flex; align-items: center; gap: 10px;
  margin: 0 0 16px;
  color: var(--text-muted);
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.receipt-divider::before,
.receipt-divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: repeating-linear-gradient(
    90deg,
    rgba(255,255,255,.18) 0 6px,
    transparent 6px 12px
  );
}
.receipt-rows {
  display: grid; gap: 10px;
  margin: 0 0 18px;
}
.receipt-rows > div {
  display: flex; justify-content: space-between; align-items: baseline; gap: 12px;
  font-size: 13px;
}
.receipt-rows dt { color: var(--text-muted); margin: 0; }
.receipt-rows dd { margin: 0; font-weight: 600; text-align: right; }
.receipt-money { color: #22c55e; font-size: 16px; font-family: var(--font-display); }
.receipt-footer-note {
  text-align: center;
  font-size: 12px;
  color: var(--text-muted);
  line-height: 1.45;
  margin-bottom: 16px;
  padding: 12px;
  border-radius: 12px;
  background: rgba(255,255,255,.03);
  border: 1px dashed rgba(255,255,255,.1);
}
@keyframes receiptFade {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes receiptPop {
  from { opacity: 0; transform: translateY(18px) scale(.96); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@media (max-width: 480px) {
  .receipt-sheet { padding: 24px 18px 18px; }
  .receipt-title { font-size: 22px; }
}

/* ===== Contratos trading (dashboard) ===== */
.ct-page { max-width: 1100px; }
.ct-page-head {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 16px; margin-bottom: 22px; flex-wrap: wrap;
}
.ct-page-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.ct-page-actions .btn {
  white-space: nowrap;
}
.ct-page-title {
  margin: 0 0 4px; font-family: var(--font-display);
  font-size: 26px; font-weight: 700; color: #fff;
}
.ct-page-sub { margin: 0; color: var(--text-muted); font-size: 14px; }
.ct-back {
  display: inline-flex; align-items: center; gap: 6px;
  color: var(--text-muted); font-size: 13px; margin-bottom: 10px;
}
.ct-back:hover { color: var(--green); }

.ct-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 16px;
}
.ct-card {
  background: linear-gradient(160deg, rgba(255,255,255,.045), rgba(255,255,255,.015));
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 22px;
  padding: 20px;
  box-shadow: 0 14px 40px rgba(0,0,0,.22);
}
.ct-card-top {
  display: flex; justify-content: space-between; gap: 14px;
  align-items: flex-start; margin-bottom: 18px;
}
.ct-card-top h3 {
  margin: 10px 0 4px; font-size: 20px; color: #fff;
  font-family: var(--font-display);
}
.ct-card-id { margin: 0; color: var(--text-muted); font-size: 12px; }
.ct-badge {
  display: inline-flex; align-items: center;
  padding: 4px 10px; border-radius: 999px; font-size: 11px; font-weight: 700;
  background: rgba(34,197,94,.14); color: #4ade80;
  border: 1px solid rgba(34,197,94,.28);
}
.ct-badge-muted {
  background: rgba(255,255,255,.06); color: rgba(255,255,255,.7);
  border-color: rgba(255,255,255,.1);
}
.ct-plan-tag {
  display: inline-flex; margin-left: 6px;
  padding: 4px 10px; border-radius: 999px; font-size: 11px; font-weight: 650;
  background: rgba(224,184,58,.14); color: #F0D78C;
  border: 1px solid rgba(224,184,58,.28);
}

.ct-ring {
  --p: 0;
  --ring-size: 84px;
  width: var(--ring-size);
  height: var(--ring-size);
  border-radius: 50%;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  position: relative;
  background:
    radial-gradient(circle at center, #0E0C0A 58%, transparent 59%),
    conic-gradient(
      #E0B83A 0 calc(var(--p) * 1%),
      rgba(224,184,58,.18) calc(var(--p) * 1%) 100%
    );
  box-shadow:
    0 0 0 1px rgba(224,184,58,.12),
    0 0 20px rgba(224,184,58,.12);
}
.ct-ring::before {
  content: "";
  position: absolute;
  inset: 7px;
  border-radius: 50%;
  background: linear-gradient(160deg, #1a1510, #0c0b0a);
  border: 1px solid rgba(255,255,255,.05);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
.ct-ring-inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  text-align: center;
  line-height: 1;
}
.ct-ring strong {
  font-size: 18px;
  font-family: var(--font-display);
  font-weight: 700;
  color: #fff;
  letter-spacing: -.02em;
}
.ct-ring small {
  font-size: 9px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: rgba(255,176,96,.85);
}
.ct-ring-lg {
  --ring-size: 120px;
}
.ct-ring-lg strong { font-size: 26px; }
.ct-ring-lg small { font-size: 10px; }

.ct-stats {
  display: grid; grid-template-columns: 1fr 1fr; gap: 10px;
  margin-bottom: 14px;
}
.ct-stats > div {
  background: rgba(0,0,0,.28);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 14px; padding: 10px 12px;
}
.ct-stats span, .ct-kpi span, .ct-progress-row span, .ct-mini-stats span {
  display: block; font-size: 11px; color: var(--text-muted); margin-bottom: 4px;
}
.ct-stats strong, .ct-kpi strong, .ct-progress-row strong { color: #fff; font-size: 14px; }
.ct-earn { color: #F0D78C !important; }

.ct-bar {
  height: 8px; border-radius: 999px; background: rgba(255,255,255,.06);
  overflow: hidden; margin-bottom: 10px;
}
.ct-bar i {
  display: block; height: 100%; border-radius: inherit;
  background: linear-gradient(90deg, #E0B83A, #F0D78C);
}
.ct-bar-lg { height: 12px; margin: 14px 0 18px; }
.ct-meta {
  display: flex; flex-wrap: wrap; gap: 8px 14px;
  font-size: 12px; color: var(--text-muted); margin-bottom: 16px;
}
.ct-view { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }

.ct-empty {
  text-align: center; padding: 56px 20px;
  border-radius: 22px; border: 1px dashed rgba(255,255,255,.12);
  background: rgba(255,255,255,.02);
}
.ct-empty-ico {
  width: 64px; height: 64px; margin: 0 auto 14px; border-radius: 18px;
  display: grid; place-items: center; color: var(--green);
  background: rgba(224,184,58,.1); border: 1px solid rgba(224,184,58,.22);
}
.ct-empty h3 { margin: 0 0 8px; color: #fff; }
.ct-empty p { margin: 0 0 18px; color: var(--text-muted); }

.ct-detail-hero {
  display: grid; grid-template-columns: 1.2fr .8fr; gap: 16px;
  margin-bottom: 16px;
}
.ct-detail-main {
  display: flex; align-items: center; gap: 22px;
  background: linear-gradient(145deg, rgba(224,184,58,.12), rgba(255,255,255,.02));
  border: 1px solid rgba(224,184,58,.22);
  border-radius: 24px; padding: 24px;
}
.ct-live-label {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 12px; color: #F0D78C; font-weight: 600; margin-bottom: 8px;
}
.ct-pulse {
  width: 8px; height: 8px; border-radius: 50%; background: #E0B83A;
  box-shadow: 0 0 0 0 rgba(224,184,58,.55);
  animation: ctPulse 1.6s infinite;
}
@keyframes ctPulse {
  0% { box-shadow: 0 0 0 0 rgba(224,184,58,.5); }
  70% { box-shadow: 0 0 0 10px rgba(224,184,58,0); }
  100% { box-shadow: 0 0 0 0 rgba(224,184,58,0); }
}
.ct-live-value {
  font-size: 36px; font-family: var(--font-display); font-weight: 700;
  color: #fff; letter-spacing: -.02em; line-height: 1.1;
}
.ct-detail-copy p { margin: 8px 0 0; color: var(--text-muted); font-size: 13px; }
.ct-detail-kpis {
  display: grid; grid-template-columns: 1fr 1fr; gap: 10px;
}
.ct-kpi {
  background: linear-gradient(160deg, rgba(255,255,255,.04), rgba(255,255,255,.015));
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px; padding: 14px;
}
.ct-detail-grid {
  display: grid; grid-template-columns: 1.1fr .9fr; gap: 16px;
  margin-bottom: 16px;
}
.ct-panel {
  background: linear-gradient(160deg, rgba(255,255,255,.04), rgba(255,255,255,.015));
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 22px; padding: 20px;
}
.ct-panel h3 {
  margin: 0 0 12px; font-size: 16px; color: #fff;
  font-family: var(--font-display);
}
.ct-progress-row {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px;
  margin-bottom: 16px;
}
.ct-progress-row > div {
  background: rgba(0,0,0,.25); border-radius: 12px; padding: 12px;
  border: 1px solid rgba(255,255,255,.05);
}
.ct-info-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.ct-info-list li {
  display: flex; justify-content: space-between; gap: 12px;
  font-size: 13px; padding-bottom: 10px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.ct-info-list li:last-child { border-bottom: 0; padding-bottom: 0; }
.ct-info-list span { color: var(--text-muted); }
.ct-info-list strong { color: #fff; }
.ct-plan-desc { color: var(--text-muted); font-size: 14px; line-height: 1.55; margin: 0 0 16px; }
.ct-mini-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ct-mini-stats > div {
  background: rgba(0,0,0,.25); border-radius: 12px; padding: 12px;
  border: 1px solid rgba(255,255,255,.05);
}
.ct-mini-stats strong { color: #fff; }

.ct-timeline-panel { margin-bottom: 8px; }
.ct-timeline-head { margin-bottom: 14px; }
.ct-timeline-head p { margin: 4px 0 0; color: var(--text-muted); font-size: 13px; }
.ct-timeline {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(92px, 1fr));
  gap: 10px;
  max-height: 340px; overflow: auto; padding-right: 4px;
}
.ct-day {
  border-radius: 14px; padding: 12px 10px; text-align: center;
  background: rgba(0,0,0,.28);
  border: 1px solid rgba(255,255,255,.06);
}
.ct-day.is-done {
  border-color: rgba(34,197,94,.28);
  background: rgba(34,197,94,.08);
}
.ct-day.is-today {
  border-color: rgba(224,184,58,.45);
  background: rgba(224,184,58,.12);
  box-shadow: 0 0 18px rgba(224,184,58,.12);
}
.ct-day-n { font-size: 12px; font-weight: 700; color: #fff; }
.ct-day-date { font-size: 11px; color: var(--text-muted); margin: 4px 0; }
.ct-day-earn { font-size: 12px; font-weight: 650; color: #F0D78C; }
.ct-day-state { font-size: 10px; color: var(--text-muted); margin-top: 6px; }
.ct-day.is-done .ct-day-state { color: #4ade80; }
.ct-day.is-today .ct-day-state { color: #F0D78C; }

@media (max-width: 900px) {
  .ct-detail-hero, .ct-detail-grid { grid-template-columns: 1fr; }
  .ct-detail-main { flex-direction: column; text-align: center; }
  .ct-live-label { justify-content: center; }
  .ct-card-top {
    flex-direction: column;
    align-items: stretch;
    gap: 16px;
  }
  .ct-card-top > div:first-child {
    text-align: left;
  }
  .ct-ring {
    --ring-size: 96px;
    align-self: center;
    margin: 4px auto 2px;
  }
  .ct-ring strong { font-size: 22px; }
  .ct-ring small { font-size: 10px; }
  .ct-ring-lg {
    --ring-size: 128px;
  }
  .ct-ring-lg strong { font-size: 28px; }
}
@media (max-width: 640px) {
  .ct-page-title { font-size: 22px; }
  .ct-page-head {
    flex-direction: column;
    align-items: stretch;
  }
  .ct-page-actions {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .ct-page-actions .btn {
    width: 100%;
    justify-content: center;
    text-align: center;
    padding-left: 10px;
    padding-right: 10px;
    font-size: 13px;
  }
  .ct-live-value { font-size: 28px; }
  .ct-stats { grid-template-columns: 1fr 1fr; }
  .ct-ring {
    --ring-size: 100px;
    box-shadow:
      0 0 0 1px rgba(224,184,58,.18),
      0 0 28px rgba(224,184,58,.18);
  }
  .ct-ring::before { inset: 8px; }
  .ct-ring strong { font-size: 24px; }
  .ct-ring small {
    font-size: 10px;
    letter-spacing: .08em;
  }
}

/* ===== Operações de trading ===== */
.op-page { max-width: 980px; }

.op-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}
.op-sum-card {
  background: linear-gradient(160deg, rgba(255,255,255,.045), rgba(255,255,255,.015));
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 18px;
  padding: 16px;
}
.op-sum-card.op-sum-money {
  background: linear-gradient(160deg, rgba(224,184,58,.14), rgba(224,184,58,.04));
  border-color: rgba(224,184,58,.32);
  box-shadow: 0 0 24px rgba(224,184,58,.1);
}
.op-sum-card span {
  display: block;
  font-size: 12px;
  color: var(--text-muted);
  margin-bottom: 6px;
}
.op-sum-card strong {
  display: block;
  font-size: 22px;
  color: #fff;
  font-family: var(--font-display);
  line-height: 1.15;
}
.op-sum-card.op-sum-money strong {
  font-size: 26px;
  letter-spacing: .01em;
}
.op-sum-card small {
  display: block;
  margin-top: 6px;
  font-size: 11px;
  color: var(--text-muted);
}
.op-compras-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.op-compras-total {
  text-align: right;
  padding: 10px 14px;
  border-radius: 14px;
  background: rgba(224,184,58,.08);
  border: 1px solid rgba(224,184,58,.2);
}
.op-compras-total span {
  display: block;
  font-size: 11px;
  color: var(--text-muted);
  margin-bottom: 4px;
}
.op-compras-total strong {
  font-size: 20px;
  color: #fff;
  font-family: var(--font-display);
}

.op-list { display: grid; gap: 14px; }
.op-item {
  display: grid;
  gap: 16px;
  padding: 18px 20px;
  border-radius: 20px;
  background: linear-gradient(165deg, rgba(255,255,255,.04), rgba(255,255,255,.012));
  border: 1px solid rgba(255,255,255,.08);
  transition: border-color .15s;
}
.op-item:hover { border-color: rgba(224,184,58,.28); }
.op-item.is-active {
  border-color: rgba(224,184,58,.28);
  background: linear-gradient(145deg, rgba(224,184,58,.1), rgba(255,255,255,.02));
  box-shadow: 0 0 28px rgba(224,184,58,.06);
}
.op-item.is-done { opacity: .92; }

.op-item-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}
.op-item-top { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
.op-item-main { min-width: 0; flex: 1; }
.op-item-main h3 {
  margin: 0 0 4px;
  color: #fff;
  font-size: 20px;
  font-family: var(--font-display);
  letter-spacing: -.02em;
}
.op-item-main p { margin: 0; color: var(--text-muted); font-size: 12px; }

.op-item-progress {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-shrink: 0;
}
.op-ring {
  --p: 0;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  display: grid;
  place-content: center;
  text-align: center;
  background:
    radial-gradient(circle at center, #0c0b0a 58%, transparent 59%),
    conic-gradient(#E0B83A calc(var(--p) * 1%), rgba(255,255,255,.08) 0);
  border: 1px solid rgba(255,255,255,.06);
}
.op-ring strong {
  display: block;
  font-size: 14px;
  color: #fff;
  font-family: var(--font-display);
  line-height: 1.1;
}
.op-ring small {
  display: block;
  font-size: 9px;
  color: var(--text-muted);
  margin-top: 2px;
}

.op-item-stats {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}
.op-item-stats > div {
  background: rgba(0,0,0,.28);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 14px;
  padding: 12px;
  min-width: 0;
}
.op-item-stats > div.op-stat-final {
  background: rgba(224,184,58,.08);
  border-color: rgba(224,184,58,.22);
}
.op-item-stats span {
  display: block;
  font-size: 11px;
  color: var(--text-muted);
  margin-bottom: 5px;
}
.op-item-stats strong {
  color: #fff;
  font-size: 15px;
  font-family: var(--font-display);
  letter-spacing: -.01em;
  word-break: break-word;
}
.op-item-bar .ct-bar { margin: 0; height: 6px; }

.op-daily {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.op-day {
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.06);
  background: rgba(0,0,0,.22);
  overflow: hidden;
  min-width: 0;
}
.op-day.is-today {
  border-color: rgba(224,184,58,.4);
  box-shadow: 0 0 22px rgba(224,184,58,.1);
  background: linear-gradient(160deg, rgba(224,184,58,.1), rgba(0,0,0,.22));
}
.op-day.is-future { opacity: .8; }
.op-day-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid rgba(255,255,255,.05);
  background: rgba(255,255,255,.02);
}
.op-day-head > div:first-child {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  min-width: 0;
}
.op-day-head strong { color: #fff; font-size: 13px; }
.op-day-total {
  font-weight: 700;
  font-size: 14px;
  color: #fff;
  font-family: var(--font-display);
  white-space: nowrap;
}
.op-day-items { display: grid; gap: 0; }
.op-day-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 11px 14px;
  border-top: 1px solid rgba(255,255,255,.04);
}
.op-day-row strong { display: block; color: #fff; font-size: 13px; }
.op-day-row small { display: block; color: var(--text-muted); font-size: 11px; margin-top: 3px; }
.op-day-right { text-align: right; flex-shrink: 0; }

@media (max-width: 980px) {
  .op-summary { grid-template-columns: 1fr 1fr; }
  .op-item-stats { grid-template-columns: 1fr 1fr; }
  .op-item-stats > div.op-stat-final { grid-column: 1 / -1; }
  .op-daily { grid-template-columns: 1fr; }
  .op-ring { width: 64px; height: 64px; }
}
@media (max-width: 640px) {
  .op-item-head { align-items: flex-start; }
  .op-item-progress {
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
  }
  .op-item-main h3 { font-size: 17px; }
  .op-item-stats strong { font-size: 13px; }
}
@media (max-width: 560px) {
  .op-summary { grid-template-columns: 1fr; }
  .op-item { padding: 14px; }
  .op-item-head {
    flex-direction: column;
    align-items: stretch;
  }
  .op-item-progress {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
  }
}

.ct-calc-box {
  background: rgba(0,0,0,.28);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 16px;
  padding: 14px;
}
.ct-calc-line {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 0;
  font-size: 14px;
  border-bottom: 1px solid rgba(255,255,255,.05);
}
.ct-calc-line span { color: var(--text-muted); }
.ct-calc-line strong { color: #fff; }
.ct-calc-total {
  border-bottom: 0;
  padding-top: 12px;
  font-size: 16px;
}
.ct-calc-note {
  margin: 12px 0 0;
  font-size: 13px;
  color: var(--text-muted);
  line-height: 1.5;
}

.ct-total-end {
  margin: 0 0 14px;
  padding: 12px 14px;
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(224,184,58,.14), rgba(224,184,58,.04));
  border: 1px solid rgba(224,184,58,.28);
}
.ct-total-end span {
  display: block;
  font-size: 11px;
  color: #F0D78C;
  font-weight: 600;
  margin-bottom: 4px;
}
.ct-total-end strong {
  display: block;
  font-size: 22px;
  font-family: var(--font-display);
  color: #fff;
  line-height: 1.15;
}
.ct-total-end small {
  display: block;
  margin-top: 6px;
  font-size: 11px;
  color: var(--text-muted);
}
.ct-detail-kpis {
  grid-template-columns: 1fr 1fr;
}

/* ===== Transações (feed moderno) ===== */
.tx-page { max-width: 920px; }
.tx-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}
.tx-title {
  margin: 0 0 6px;
  font-size: 28px;
  font-family: var(--font-display);
  color: #fff;
  letter-spacing: -.02em;
}
.tx-sub {
  margin: 0;
  color: var(--text-muted);
  font-size: 14px;
}
.tx-head-meta {
  font-size: 12px;
  color: var(--text-muted);
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
}

.tx-toolbar {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}
.tx-search {
  position: relative;
  flex: 1;
  min-width: 220px;
}
.tx-search-ico {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--green);
  display: grid;
  place-items: center;
  pointer-events: none;
}
.tx-search-input {
  width: 100%;
  height: 46px;
  padding: 0 14px 0 42px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.1);
  background: rgba(0,0,0,.35);
  color: #fff;
  outline: none;
  box-sizing: border-box;
}
.tx-search-input:focus {
  border-color: rgba(224,184,58,.45);
  box-shadow: 0 0 0 3px rgba(224,184,58,.12);
}
.tx-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 46px;
  padding: 0 16px;
  border-radius: 14px;
  border: 1px solid rgba(224,184,58,.35);
  background: linear-gradient(180deg, rgba(224,184,58,.18), rgba(224,184,58,.08));
  color: #fff;
  font-weight: 600;
  font-size: 13px;
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
}
.tx-btn:hover { border-color: var(--green); }
.tx-btn-ghost {
  background: rgba(255,255,255,.03);
  border-color: rgba(255,255,255,.1);
  color: var(--text-muted);
}

.tx-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 18px;
}
.tx-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.1);
  background: rgba(255,255,255,.03);
  color: var(--text-muted);
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  transition: .15s;
}
.tx-chip em {
  font-style: normal;
  font-size: 11px;
  padding: 2px 7px;
  border-radius: 999px;
  background: rgba(255,255,255,.06);
  color: #fff;
}
.tx-chip:hover { color: #fff; border-color: rgba(224,184,58,.3); }
.tx-chip.is-on {
  color: #fff;
  border-color: rgba(224,184,58,.4);
  background: rgba(224,184,58,.14);
}
.tx-chip.is-on em {
  background: rgba(224,184,58,.25);
  color: #F0D78C;
}

.tx-list { display: grid; gap: 10px; }
.tx-item {
  display: grid;
  grid-template-columns: 48px 1fr auto;
  gap: 14px;
  align-items: center;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.08);
  background: linear-gradient(160deg, rgba(255,255,255,.045), rgba(255,255,255,.015));
  transition: .15s;
}
.tx-item:hover {
  border-color: rgba(224,184,58,.22);
  background: linear-gradient(160deg, rgba(224,184,58,.08), rgba(255,255,255,.02));
}
.tx-ico {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  color: var(--green);
  background: rgba(224,184,58,.1);
  border: 1px solid rgba(224,184,58,.22);
  flex-shrink: 0;
}
.tx-item.is-out .tx-ico {
  color: #ff8a8a;
  background: rgba(255,77,79,.1);
  border-color: rgba(255,77,79,.22);
}
.tx-item.tx-type-earning .tx-ico,
.tx-item.tx-type-commission .tx-ico {
  color: #4ade80;
  background: rgba(34,197,94,.1);
  border-color: rgba(34,197,94,.25);
}
.tx-body { min-width: 0; }
.tx-row1 {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 4px;
}
.tx-row1 strong {
  color: #fff;
  font-size: 14px;
  font-weight: 700;
}
.tx-desc {
  margin: 0 0 6px;
  color: var(--text-muted);
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.tx-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  font-size: 11px;
  color: rgba(255,255,255,.38);
}
.tx-amount {
  font-family: var(--font-display);
  font-size: 16px;
  font-weight: 700;
  white-space: nowrap;
  text-align: right;
}
.tx-amount.in { color: #4ade80; }
.tx-amount.out { color: #ff8a8a; }

.tx-empty {
  text-align: center;
  padding: 56px 20px;
  border-radius: 22px;
  border: 1px dashed rgba(255,255,255,.12);
  background: rgba(255,255,255,.02);
}
.tx-empty-ico {
  width: 64px;
  height: 64px;
  margin: 0 auto 14px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  color: var(--green);
  background: rgba(224,184,58,.1);
  border: 1px solid rgba(224,184,58,.22);
}
.tx-empty h3 { margin: 0 0 8px; color: #fff; }
.tx-empty p { margin: 0; color: var(--text-muted); }

.tx-pager {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 18px;
  flex-wrap: wrap;
  font-size: 12px;
  color: var(--text-muted);
}
.tx-pager-btns {
  display: flex;
  align-items: center;
  gap: 8px;
}
.tx-pager-btns .tx-btn { height: 38px; padding: 0 12px; }

@media (max-width: 640px) {
  .tx-title { font-size: 24px; }
  .tx-item {
    grid-template-columns: 44px 1fr;
    grid-template-areas:
      "ico body"
      "ico amount";
    gap: 10px 12px;
  }
  .tx-ico { width: 44px; height: 44px; grid-area: ico; }
  .tx-body { grid-area: body; }
  .tx-amount {
    grid-area: amount;
    text-align: left;
    font-size: 15px;
    padding-left: 0;
  }
  .tx-desc { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
}



/* PWA push banner */
.push-banner {
  position: fixed;
  left: 12px;
  right: 12px;
  bottom: calc(78px + env(safe-area-inset-bottom, 0px));
  z-index: 80;
}
.push-banner[hidden] { display: none !important; }
.push-banner-inner {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 16px;
  background: linear-gradient(160deg, rgba(26,21,16,.98), rgba(12,11,10,.98));
  border: 1px solid rgba(224,184,58,.35);
  box-shadow: 0 12px 40px rgba(0,0,0,.55), 0 0 24px rgba(224,184,58,.12);
}
.push-banner-ico {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  color: var(--green);
  background: rgba(224,184,58,.12);
  border: 1px solid rgba(224,184,58,.25);
  flex-shrink: 0;
}
.push-banner-text { flex: 1; min-width: 0; }
.push-banner-text strong {
  display: block;
  color: #fff;
  font-size: 13px;
  margin-bottom: 2px;
}
.push-banner-text span {
  display: block;
  color: var(--text-muted);
  font-size: 11px;
  line-height: 1.35;
}
.push-banner-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}
.push-banner-x {
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 50%;
  background: rgba(255,255,255,.06);
  color: var(--text-muted);
  font-size: 18px;
  cursor: pointer;
  line-height: 1;
}
@media (min-width: 901px) {
  .push-banner {
    left: auto;
    right: 24px;
    bottom: 24px;
    width: 380px;
  }
}

.admin-body .admin-push-banner {
  bottom: calc(16px + env(safe-area-inset-bottom, 0px));
}
.admin-pwa-card .admin-pwa-hint {
  margin: 0;
  padding: 0 18px 16px;
  font-size: 13px;
  color: var(--text-muted);
  line-height: 1.45;
}
.admin-pwa-card .admin-panel-head {
  margin-bottom: 0;
}

/* ===== Dashboard financeiro estilo ATLAS ===== */
.wallet-page {
  width: 100%;
  max-width: 1180px;
  position: relative;
}
.wallet-page .buy-intro,
.wallet-page .ct-page-head,
.wallet-page .tx-head {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(ellipse at top right, rgba(224,184,58,.2), transparent 42%),
    linear-gradient(155deg, rgba(26,21,16,.96), rgba(12,11,10,.98));
  border: 1px solid rgba(224,184,58,.18);
  border-radius: 24px;
  padding: 24px;
  box-shadow: 0 24px 70px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.035);
}
.wallet-page .buy-intro::before,
.wallet-page .ct-page-head::before,
.wallet-page .tx-head::before {
  content: "";
  position: absolute;
  width: 180px;
  height: 180px;
  right: -60px;
  top: -80px;
  border-radius: 50%;
  background: rgba(224,184,58,.18);
  filter: blur(34px);
  pointer-events: none;
}
.wallet-page .buy-heading,
.wallet-page .ct-page-title,
.wallet-page .tx-title {
  font-size: clamp(28px, 3vw, 38px);
  line-height: 1.05;
  letter-spacing: -.04em;
}
.wallet-page .buy-sub,
.wallet-page .ct-page-sub,
.wallet-page .tx-sub {
  max-width: 660px;
  color: rgba(255,255,255,.58);
}
.wallet-page .btn-primary,
.wallet-page .tx-btn:not(.tx-btn-ghost) {
  min-height: 44px;
  border-radius: 999px;
  border: 1px solid rgba(255,190,110,.2);
  box-shadow: 0 12px 36px rgba(224,184,58,.28), inset 0 1px 0 rgba(255,255,255,.18) !important;
}
.wallet-page .btn-outline,
.wallet-page .tx-btn-ghost,
.wallet-page .tab {
  border-color: rgba(255,255,255,.1);
  background: rgba(255,255,255,.035);
  color: rgba(255,255,255,.7);
}
.wallet-page .btn-outline:hover,
.wallet-page .tx-btn-ghost:hover,
.wallet-page .tab:hover {
  border-color: rgba(224,184,58,.35);
  color: #E8C547;
  background: rgba(224,184,58,.08);
}
.wallet-page .ct-card,
.wallet-page .op-sum-card,
.wallet-page .op-item,
.wallet-page .op-day,
.wallet-page .ct-panel,
.wallet-page .ct-kpi,
.wallet-page .tx-item,
.wallet-page .checkout-card,
.wallet-page .buy-aside-card,
.wallet-page .info-box,
.wallet-page > .card,
.wallet-page .table-wrap {
  background:
    radial-gradient(ellipse at top right, rgba(224,184,58,.08), transparent 45%),
    linear-gradient(160deg, rgba(22,19,16,.92), rgba(9,9,9,.98));
  border: 1px solid rgba(255,255,255,.075);
  box-shadow: 0 18px 50px rgba(0,0,0,.3);
}
.wallet-page .ct-card:hover,
.wallet-page .op-item:hover,
.wallet-page .tx-item:hover,
.wallet-page .checkout-card:hover {
  border-color: rgba(224,184,58,.26);
}
.wallet-page .ct-empty,
.wallet-page .tx-empty,
.wallet-page .empty-state {
  background:
    radial-gradient(ellipse at center, rgba(224,184,58,.08), transparent 55%),
    rgba(255,255,255,.02);
  border-color: rgba(224,184,58,.18);
}
.wallet-page .tabs,
.wallet-page .wd-tabs,
.wallet-page .tx-chips {
  padding: 6px;
  border-radius: 999px;
  background: rgba(255,255,255,.035);
  border: 1px solid rgba(255,255,255,.07);
  width: fit-content;
  max-width: 100%;
}
.wallet-page .tab,
.wallet-page .tx-chip {
  text-decoration: none;
}
.wallet-page .tab.active,
.wallet-page .tx-chip.is-on {
  color: #fff;
  border-color: rgba(224,184,58,.38);
  background: linear-gradient(180deg, rgba(224,184,58,.22), rgba(224,184,58,.08));
}
.wd-total {
  margin: 0 0 14px;
  color: rgba(255,255,255,.62);
}
.wd-total strong { color: #4ade80; }
.wallet-page .table-wrap {
  border-radius: 20px;
  overflow: hidden;
}
.wallet-page table.data th {
  background: rgba(0,0,0,.22);
  color: rgba(255,255,255,.5);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.wallet-page table.data td {
  color: rgba(255,255,255,.82);
}
.wallet-page .buy-grid,
.wd-page .card {
  margin-top: 16px;
}

@media (min-width: 901px) {
  .contracts-page,
  .operations-page,
  .contract-detail-page,
  .tx-page.wallet-page,
  .buy-page.wallet-page,
  .wd-page.wallet-page {
    padding-top: 8px;
  }
  .contracts-page .ct-page-head,
  .operations-page .ct-page-head,
  .contract-detail-page .ct-page-head,
  .tx-page.wallet-page .tx-head,
  .buy-page.wallet-page .buy-intro,
  .wd-page.wallet-page .buy-intro {
    margin-bottom: 22px;
  }
  .dep-page .buy-grid {
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, .8fr) !important;
    gap: 18px;
  }
  .wd-page > .card {
    max-width: 720px;
    border-radius: 24px;
    padding: 24px;
  }
  .tx-page.wallet-page { max-width: 1040px; }
  .tx-list { gap: 12px; }
  .tx-item { padding: 16px 18px; border-radius: 20px; }
  .ct-grid { gap: 18px; }
  .op-summary { gap: 14px; }
}

@media (max-width: 640px) {
  .wallet-page .buy-intro,
  .wallet-page .ct-page-head,
  .wallet-page .tx-head {
    padding: 18px;
    border-radius: 20px;
  }
  .wallet-page .tabs,
  .wallet-page .wd-tabs,
  .wallet-page .tx-chips {
    width: 100%;
    border-radius: 18px;
    overflow-x: auto;
  }
  .dep-page {
    overflow-x: clip;
    max-width: 100%;
  }
  .dep-page .buy-grid {
    grid-template-columns: 1fr !important;
    gap: 12px;
  }
  .dep-page .buy-balance-banner {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }
  .dep-page .buy-balance-banner strong {
    font-size: 20px;
  }
  .dep-page .checkout-card {
    padding: 18px 16px;
    border-radius: 18px;
    min-width: 0;
  }
  .dep-page .buy-aside,
  .dep-page .buy-aside-card {
    min-width: 0;
  }
  .dep-page .amount-field .input {
    font-size: 16px; /* evita zoom no iOS */
  }
}


/* ===== ATLAS Trading ===== */
.trd-page {
  max-width: 1180px;
  width: 100%;
  box-sizing: border-box;
  overflow-x: clip;
}
.trd-top {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: center;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.trd-top-main {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
  flex: 1;
}
.trd-top-logo {
  width: 56px;
  height: 56px;
  object-fit: contain;
  flex-shrink: 0;
  border-radius: 14px;
  background: #050608;
  border: 1px solid rgba(0, 174, 239, .28);
  box-shadow: 0 0 20px rgba(0, 174, 239, .18);
}
.trd-top-copy { min-width: 0; }
.trd-kicker {
  margin: 0;
  color: var(--green);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.trd-title {
  margin: 4px 0 6px;
  font-family: 'Space Grotesk', Inter, sans-serif;
  font-size: 28px;
  color: #fff;
  line-height: 1.15;
}
.trd-sub { margin: 0; color: var(--text-muted); font-size: 13px; }
.trd-plan-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid rgba(224,184,58,.35);
  background: rgba(224,184,58,.1);
  color: #fff;
  font-weight: 700;
  font-size: 13px;
  flex-shrink: 0;
}
.trd-plan-pill strong { font-weight: 800; color: #fff; }
.trd-plan-pill-label { color: var(--text-muted); font-weight: 600; }
.trd-plan-pill-exp { color: var(--text-muted); font-weight: 500; font-size: 11px; }
.trd-plan-starter { border-color: rgba(34,197,94,.35); background: rgba(34,197,94,.1); }
.trd-plan-pro { border-color: rgba(59,130,246,.4); background: rgba(59,130,246,.12); }
.trd-plan-vip { border-color: rgba(168,85,247,.45); background: rgba(168,85,247,.12); }

.trd-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 12px;
  margin-bottom: 16px;
}
.trd-stat {
  background: linear-gradient(160deg, rgba(26,21,16,.95), rgba(12,11,10,.98));
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 16px;
  padding: 14px 16px;
  min-width: 0;
}
.trd-stat span {
  display: block;
  color: var(--text-muted);
  font-size: 11px;
  margin-bottom: 6px;
}
.trd-stat strong {
  display: block;
  color: #fff;
  font-size: 20px;
  font-family: 'Space Grotesk', Inter, sans-serif;
  line-height: 1.2;
  word-break: break-word;
}
.trd-stat em {
  display: block;
  margin-top: 4px;
  font-style: normal;
  color: var(--text-muted);
  font-size: 11px;
}

.trd-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(280px, .9fr);
  gap: 16px;
  align-items: start;
}
.trd-chart-card {
  background: #0c0b0a;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 18px 50px rgba(0,0,0,.35);
}
.trd-chart-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.trd-assets { display: flex; gap: 8px; }
.trd-asset {
  padding: 7px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.08);
  color: var(--text-muted);
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
}
.trd-asset.active {
  color: #fff;
  border-color: rgba(224,184,58,.45);
  background: rgba(224,184,58,.14);
}
.trd-hud-price { text-align: right; }
.trd-hud-price strong {
  display: block;
  color: #fff;
  font-size: 18px;
  font-family: 'Space Grotesk', Inter, sans-serif;
}
.trd-hud-price span { font-size: 12px; font-weight: 700; }

.trd-chart-wrap {
  position: relative;
  min-height: 300px;
  background: #0c0b0a;
}
.trd-tv { width: 100%; height: 360px; }
/* Esconde logo / atribuição do Lightweight Charts (TradingView) */
.trd-tv a[href*="tradingview"],
.trd-chart-wrap a[href*="tradingview"],
#tvChart a[href*="tradingview"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.trd-overlay {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}
.trd-candle-expiry {
  position: absolute;
  left: 0;
  top: 0;
  width: 0;
  height: 0;
  z-index: 3;
  pointer-events: none;
}
.trd-candle-expiry-line {
  display: none;
}
.trd-candle-expiry-cd {
  position: absolute;
  top: 0;
  left: 0;
  transform: translate(-50%, -50%);
  padding: 2px 5px;
  border-radius: 4px;
  background: rgba(12, 11, 10, 0.94);
  border: 1px solid rgba(224, 184, 58, 0.55);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.03em;
  line-height: 1.2;
  white-space: nowrap;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
}
.trd-entry-badge {
  position: absolute;
  left: 0;
  top: 0;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 10px;
  background: rgba(15,23,42,.92);
  border: 1px solid rgba(96,165,250,.5);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
  transform: translate(-50%, -120%);
  box-shadow: 0 8px 24px rgba(0,0,0,.45);
}
.trd-entry-badge.is-call { border-color: rgba(34,197,94,.55); }
.trd-entry-badge.is-put { border-color: rgba(239,68,68,.55); }
.trd-entry-dir {
  width: 22px;
  height: 22px;
  border-radius: 7px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,.08);
}
.trd-result-toast {
  position: absolute;
  left: 50%;
  top: 18px;
  transform: translateX(-50%);
  padding: 10px 16px;
  border-radius: 12px;
  font-weight: 800;
  font-size: 14px;
  letter-spacing: .02em;
  box-shadow: 0 12px 30px rgba(0,0,0,.45);
}
.trd-result-toast.is-win { background: rgba(34,197,94,.95); color: #052e16; }
.trd-result-toast.is-loss { background: rgba(239,68,68,.95); color: #fff; }
.trd-result-toast.is-push { background: rgba(148,163,184,.95); color: #0f172a; }

.trd-tradebar {
  padding: 14px;
  border-top: 1px solid rgba(255,255,255,.06);
  background: linear-gradient(180deg, rgba(18,16,14,.9), rgba(10,9,8,.98));
}
.trd-trade-fields {
  display: flex;
  gap: 10px;
  align-items: end;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.trd-trade-fields label {
  display: grid;
  gap: 6px;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 600;
}
.trd-trade-fields input {
  min-width: 110px;
  height: 42px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.1);
  background: rgba(255,255,255,.04);
  color: #fff;
  padding: 0 12px;
  font-weight: 600;
}
.trd-tempo-label { min-width: 0; }
.trd-tempo {
  display: inline-flex;
  gap: 6px;
  flex-wrap: wrap;
}
.trd-tempo-btn {
  height: 42px;
  min-width: 52px;
  padding: 0 12px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  color: #fff;
  font-weight: 800;
  font-size: 13px;
  cursor: pointer;
}
.trd-tempo-btn.active {
  border-color: rgba(224,184,58,.55);
  background: rgba(224,184,58,.18);
  color: #ffb86a;
  box-shadow: 0 0 0 1px rgba(224,184,58,.2);
}
.trd-payout-chip {
  margin-left: auto;
  height: 42px;
  display: inline-flex;
  align-items: center;
  padding: 0 14px;
  border-radius: 12px;
  background: rgba(34,197,94,.12);
  border: 1px solid rgba(34,197,94,.3);
  color: #4ade80;
  font-weight: 800;
}
.trd-live {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 10px 0 0;
  padding: 10px 14px;
  border-radius: 12px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
}
.trd-live-label {
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.trd-live strong {
  font-size: 18px;
  font-family: 'Space Grotesk', Inter, sans-serif;
}
.trd-live strong.is-win { color: #4ade80; }
.trd-live strong.is-loss { color: #f87171; }
.trd-live strong.is-push { color: #94a3b8; }
.trd-live em {
  margin-left: auto;
  font-style: normal;
  color: #fff;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.trd-trade-btns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.trd-btn {
  height: 48px;
  border: 0;
  border-radius: 14px;
  font-weight: 800;
  font-size: 15px;
  cursor: pointer;
  letter-spacing: .03em;
}
.trd-btn-call {
  background: linear-gradient(180deg, #22c55e, #16a34a);
  color: #052e16;
  box-shadow: 0 8px 24px rgba(34,197,94,.25);
}
.trd-btn-put {
  background: linear-gradient(180deg, #ef4444, #dc2626);
  color: #fff;
  box-shadow: 0 8px 24px rgba(239,68,68,.25);
}
.trd-btn:disabled { opacity: .55; cursor: not-allowed; }
.trd-hint {
  margin: 10px 0 0;
  color: var(--text-muted);
  font-size: 12px;
}

.trd-side { display: grid; gap: 14px; }
.trd-side-card .card-title { margin-bottom: 10px; }
.trd-bank-now {
  margin: 0 0 10px;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(34,197,94,.08);
  border: 1px solid rgba(34,197,94,.25);
}
.trd-bank-now span {
  display: block;
  color: var(--text-muted);
  font-size: 11px;
  margin-bottom: 4px;
}
.trd-bank-now strong {
  display: block;
  color: #4ade80;
  font-size: 22px;
  font-family: 'Space Grotesk', Inter, sans-serif;
}
.trd-muted { color: var(--text-muted); font-size: 12px; margin: 0 0 8px; }
.trd-muted strong { color: #fff; font-weight: 600; }
.trd-form { margin-top: 8px; }
.trd-form-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
}
.trd-form-row input {
  height: 40px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.1);
  background: rgba(255,255,255,.04);
  color: #fff;
  padding: 0 12px;
}

.trd-plans { display: grid; gap: 10px; }
.trd-plans-section {
  margin-top: 16px;
}
.trd-plans-section .card-title { margin-bottom: 12px; }
.trd-plans-row {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
}
.trd-plans-row .trd-plan {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.trd-plans-row .trd-plan form,
.trd-plans-row .trd-plan .btn,
.trd-plans-row .trd-current {
  margin-top: auto;
}
.trd-ops-all-btn {
  margin-top: 12px;
}
.trd-plan {
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.08);
  padding: 12px;
  background: rgba(255,255,255,.02);
}
.trd-plan.is-current { outline: 1px solid rgba(224,184,58,.45); }
.trd-plan-top {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
  color: #fff;
}
.trd-plan-conversion {
  margin: -2px 0 9px;
  padding: 7px 9px;
  border-radius: 9px;
  background: rgba(224,184,58,.08);
  color: #ffb86a;
  font-size: 12px;
  font-weight: 700;
}
.trd-plan-conversion small {
  display: block;
  margin-top: 2px;
  color: var(--text-muted);
  font-size: 10px;
  font-weight: 500;
}
.trd-plan ul {
  margin: 0 0 10px;
  padding-left: 16px;
  color: var(--text-muted);
  font-size: 12px;
  line-height: 1.5;
}
.trd-plan-insufficient {
  margin: 0 0 8px;
  color: #fca5a5;
  font-size: 11px;
  line-height: 1.4;
}
.trd-current {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  color: var(--green);
}

.trd-ops { display: grid; gap: 8px; }
.trd-ops-full { gap: 10px; }
.trd-ops-full .trd-op { padding: 12px 14px; }
.trd-op {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 10px;
  border-radius: 12px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.05);
}
.trd-op strong { display: block; color: #fff; font-size: 12px; }
.trd-op span { color: var(--text-muted); font-size: 11px; }
.trd-op-right { text-align: right; }
.trd-op-st {
  display: block;
  text-transform: uppercase;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .04em;
}
.trd-op-win .trd-op-st, .trd-op-win em { color: #4ade80; }
.trd-op-loss .trd-op-st, .trd-op-loss em { color: #f87171; }
.trd-op-pending .trd-op-st { color: #60a5fa; }
.trd-op-push .trd-op-st { color: #94a3b8; }
.trd-op em { font-style: normal; font-weight: 700; font-size: 12px; }

.trd-ref-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 10px;
}
.trd-ref-grid > div {
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.07);
  padding: 12px;
  text-align: center;
  background: rgba(255,255,255,.02);
}
.trd-ref-grid strong { display: block; color: #fff; margin-bottom: 4px; }
.trd-ref-grid span { color: var(--green); font-weight: 800; font-size: 18px; }

@media (max-width: 980px) {
  .trd-layout { grid-template-columns: 1fr; }
  .trd-stats { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .trd-title { font-size: 22px; }
  .trd-payout-chip { margin-left: 0; }
}
@media (max-width: 720px) {
  .trd-plans-row { grid-template-columns: 1fr; }

  .trd-top {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    margin-bottom: 12px;
    padding: 12px;
    border-radius: 18px;
    border: 1px solid rgba(255, 255, 255, .06);
    background:
      radial-gradient(ellipse at 0% 0%, rgba(0, 174, 239, .14), transparent 55%),
      linear-gradient(160deg, rgba(16, 14, 12, .98), rgba(8, 8, 9, .98));
  }
  .trd-top-main { gap: 12px; }
  .trd-top-logo {
    width: 48px;
    height: 48px;
    border-radius: 12px;
  }
  .trd-kicker {
    font-size: 10px;
    letter-spacing: .1em;
  }
  .trd-title {
    margin: 2px 0 4px;
    font-size: 18px;
  }
  .trd-sub {
    font-size: 11px;
    line-height: 1.35;
  }
  .trd-plan-pill {
    width: 100%;
    justify-content: center;
    padding: 9px 12px;
    font-size: 12px;
    box-sizing: border-box;
  }

  .trd-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 12px;
    padding: 8px;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, .05);
    background: rgba(255, 255, 255, .02);
  }
  .trd-stat {
    padding: 10px 11px;
    border-radius: 12px;
    background: rgba(12, 11, 10, .9);
    border-color: rgba(255, 255, 255, .05);
  }
  .trd-stat span {
    font-size: 10px;
    margin-bottom: 4px;
    letter-spacing: .02em;
  }
  .trd-stat strong {
    font-size: 15px;
  }
  .trd-stat em {
    font-size: 9px;
    margin-top: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
@media (max-width: 560px) {
  .trd-ref-grid { grid-template-columns: 1fr; }
  .trd-tv { height: 280px; }
}

/* ATLAS auto robot */
.trd-auto-banner {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 18px;
  align-items: center;
  margin-bottom: 16px;
  padding: 16px 18px;
  border-radius: 20px;
  border: 1px solid rgba(0, 174, 239, .28);
  background:
    linear-gradient(145deg, rgba(8, 18, 28, .98) 0%, rgba(10, 10, 12, .98) 55%, rgba(18, 12, 8, .95) 100%);
  overflow: hidden;
  box-shadow:
    0 18px 40px rgba(0, 0, 0, .35),
    inset 0 1px 0 rgba(255, 255, 255, .04);
}
.trd-auto-banner-glow {
  position: absolute;
  inset: -40% auto auto -10%;
  width: 280px;
  height: 220px;
  background: radial-gradient(circle, rgba(0, 174, 239, .22) 0%, transparent 68%);
  pointer-events: none;
  filter: blur(2px);
}
.trd-auto-banner.is-running .trd-auto-banner-glow {
  background: radial-gradient(circle, rgba(34, 197, 94, .22) 0%, transparent 68%);
}
.trd-auto-banner.is-warn .trd-auto-banner-glow {
  background: radial-gradient(circle, rgba(239, 68, 68, .18) 0%, transparent 68%);
}
.trd-auto-logo-wrap {
  position: relative;
  z-index: 1;
  width: 84px;
  height: 84px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at 35% 30%, rgba(0, 174, 239, .25), transparent 55%),
    linear-gradient(160deg, #11161c, #050608);
  border: 1px solid rgba(0, 174, 239, .35);
  box-shadow:
    0 0 0 4px rgba(0, 174, 239, .06),
    0 10px 28px rgba(0, 0, 0, .4);
  flex-shrink: 0;
}
.trd-auto-logo {
  width: 72px;
  height: 72px;
  object-fit: contain;
  display: block;
  filter: drop-shadow(0 0 10px rgba(0, 174, 239, .35));
}
.trd-auto-live {
  position: absolute;
  top: -3px;
  right: -3px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #22c55e;
  border: 2px solid #0a0b0d;
  box-shadow: 0 0 0 0 rgba(34, 197, 94, .55);
  animation: trdPulse 1.8s infinite;
}
.trd-auto-banner.is-wait .trd-auto-live,
.trd-auto-banner.is-done .trd-auto-live {
  background: #ff7a00;
  box-shadow: 0 0 0 0 rgba(224, 184, 58, .5);
  animation: trdPulseOrange 1.8s infinite;
}
.trd-auto-banner.is-warn .trd-auto-live {
  background: #ef4444;
  animation: none;
}
.trd-auto-banner.is-done .trd-auto-live {
  background: #94a3b8;
  animation: none;
}
@keyframes trdPulse {
  0% { box-shadow: 0 0 0 0 rgba(34, 197, 94, .55); }
  70% { box-shadow: 0 0 0 10px rgba(34, 197, 94, 0); }
  100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0); }
}
@keyframes trdPulseOrange {
  0% { box-shadow: 0 0 0 0 rgba(224, 184, 58, .5); }
  70% { box-shadow: 0 0 0 10px rgba(224, 184, 58, 0); }
  100% { box-shadow: 0 0 0 0 rgba(224, 184, 58, 0); }
}
.trd-auto-body {
  position: relative;
  z-index: 1;
  min-width: 0;
}
.trd-auto-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 6px;
  flex-wrap: wrap;
}
.trd-auto-kicker {
  margin: 0 0 2px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #00aeef;
}
.trd-auto-title {
  display: block;
  margin: 0;
  color: #fff;
  font-size: 18px;
  font-family: 'Space Grotesk', Inter, sans-serif;
  font-weight: 700;
  letter-spacing: -.01em;
}
.trd-auto-desc {
  margin: 0 0 12px;
  color: var(--text-muted);
  font-size: 13px;
  line-height: 1.45;
}
.trd-auto-desc strong {
  color: #fff;
  font-weight: 700;
}
.trd-auto-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.trd-auto-metric {
  padding: 8px 10px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, .06);
  background: rgba(255, 255, 255, .03);
  min-width: 0;
}
.trd-auto-metric span {
  display: block;
  font-size: 10px;
  color: var(--text-muted);
  margin-bottom: 3px;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-weight: 600;
}
.trd-auto-metric strong {
  display: block;
  color: #fff;
  font-size: 14px;
  font-weight: 800;
  font-family: 'Space Grotesk', Inter, sans-serif;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.trd-auto-metric.is-win strong { color: #4ade80; }
.trd-auto-metric.is-loss strong { color: #f87171; }
.trd-auto-metric.is-meta strong { color: #7dd3fc; }
.trd-auto-metric.is-stake strong { color: #ffb86a; }
.trd-auto-win { color: #4ade80; font-weight: 700; }
.trd-auto-loss { color: #f87171; font-weight: 700; }
.trd-auto-status {
  padding: 7px 12px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
  border: 1px solid transparent;
  flex-shrink: 0;
}
.trd-auto-status.is-running {
  background: rgba(34, 197, 94, .12);
  border-color: rgba(34, 197, 94, .3);
  color: #4ade80;
}
.trd-auto-status.is-ready {
  background: rgba(0, 174, 239, .12);
  border-color: rgba(0, 174, 239, .35);
  color: #7dd3fc;
}
.trd-auto-status.is-done {
  background: rgba(148, 163, 184, .12);
  border-color: rgba(148, 163, 184, .25);
  color: #cbd5e1;
}
.trd-auto-status.is-warn {
  background: rgba(239, 68, 68, .12);
  border-color: rgba(239, 68, 68, .3);
  color: #fca5a5;
}
.trd-auto-status.is-wait {
  background: rgba(224, 184, 58, .1);
  border-color: rgba(224, 184, 58, .3);
  color: #ffb86a;
}
.trd-auto-panel {
  padding: 4px 0;
}
.trd-auto-panel-title {
  margin: 0 0 6px;
  color: #fff;
  font-weight: 700;
}
.trd-auto-active {
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(0, 174, 239, .35);
  background: rgba(0, 174, 239, .08);
  display: flex;
  justify-content: space-between;
  gap: 10px;
  color: #fff;
  font-size: 12px;
}
.trd-auto-active strong { color: #7dd3fc; }

@media (max-width: 720px) {
  .trd-auto-banner {
    grid-template-columns: 64px 1fr;
    gap: 12px;
    padding: 12px;
    border-radius: 16px;
  }
  .trd-auto-logo-wrap {
    width: 64px;
    height: 64px;
    border-radius: 14px;
  }
  .trd-auto-logo {
    width: 54px;
    height: 54px;
  }
  .trd-auto-title { font-size: 15px; }
  .trd-auto-kicker { font-size: 10px; }
  .trd-auto-desc {
    font-size: 12px;
    margin-bottom: 10px;
  }
  .trd-auto-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
  }
  .trd-auto-metric { padding: 7px 8px; }
  .trd-auto-metric strong { font-size: 13px; }
  .trd-auto-status {
    font-size: 10px;
    padding: 5px 9px;
  }
  .trd-auto-head {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }

  .trd-trade-fields {
    flex-direction: column;
    align-items: stretch;
  }
  .trd-trade-btns {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .trd-tempo {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
  }
  .trd-chart-card { border-radius: 16px; }
}

.trd-ref-link-box {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  padding: 12px;
  border-radius: 14px;
  border: 1px solid rgba(224,184,58,.25);
  background: rgba(224,184,58,.06);
}
.trd-ref-link-box > div { flex: 1; min-width: 180px; }
.trd-ref-link-label {
  display: block;
  color: var(--text-muted);
  font-size: 11px;
  margin-bottom: 4px;
}
.trd-ref-link {
  display: block;
  color: #fff;
  font-size: 12px;
  word-break: break-all;
  background: transparent;
  padding: 0;
}

.trd-robot-activate { padding: 4px 0 2px; }
.trd-robot-form {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: end;
  margin-top: 12px;
}
.trd-robot-form label {
  display: grid;
  gap: 6px;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 600;
}
.trd-robot-form input {
  height: 48px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.05);
  color: #fff;
  padding: 0 14px;
  font-weight: 700;
  font-size: 16px;
}
.trd-robot-form .trd-btn {
  min-width: 160px;
  height: 48px;
}
.trd-robot-stop { margin-top: 12px; }
@media (max-width: 560px) {
  .trd-robot-form { grid-template-columns: 1fr; }
}

.trd-stat-profit { color: #4ade80 !important; }
.trd-robot-form-simple {
  grid-template-columns: 1fr;
  margin-top: 8px;
}
.trd-robot-form-simple .trd-btn {
  width: 100%;
  min-width: 0;
}

/* Trading arena — UI moderna */
.atl-simple {
  max-width: 640px;
  margin: 0 auto;
  padding-bottom: 28px;
}
.atl-desk-side {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-bottom: 22px;
}
.atl-hero {
  position: relative;
  overflow: hidden;
  border-radius: 22px;
  padding: 22px 20px 20px;
  margin-bottom: 0;
  background:
    linear-gradient(145deg, rgba(224,184,58,.14) 0%, rgba(18,22,30,.95) 42%, #0c0f14 100%);
  border: 1px solid rgba(255,255,255,.07);
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.atl-hero-glow {
  position: absolute;
  inset: -40% auto auto -20%;
  width: 220px;
  height: 220px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(224,184,58,.28), transparent 68%);
  pointer-events: none;
}
.atl-hero-brand {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}
.atl-hero-logo {
  width: 72px;
  height: 72px;
  object-fit: contain;
  border-radius: 18px;
  flex-shrink: 0;
  background: rgba(0,0,0,.25);
  box-shadow: 0 8px 28px rgba(0,0,0,.35), 0 0 0 1px rgba(224,184,58,.18);
}
.atl-hero-inner { position: relative; z-index: 1; min-width: 0; }
.atl-eyebrow {
  margin: 0 0 6px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #F0D78C;
}
.atl-hero-title {
  margin: 0;
  font-size: 32px;
  line-height: 1.05;
  font-weight: 800;
  color: #fff;
  letter-spacing: -0.03em;
}
.atl-hero-sub {
  margin: 8px 0 0;
  color: var(--text-muted);
  font-size: 13px;
}
.atl-status-pill {
  position: relative;
  z-index: 1;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(0,0,0,.28);
  color: var(--text-muted);
}
.atl-status-pill.is-on {
  color: #4ade80;
  border-color: rgba(74,222,128,.28);
  background: rgba(74,222,128,.08);
}
.atl-status-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #64748b;
}
.atl-status-pill.is-on .atl-status-dot {
  background: #4ade80;
  box-shadow: 0 0 0 4px rgba(74,222,128,.18);
  animation: atlPulse 1.6s ease-in-out infinite;
}
@keyframes atlPulse {
  0%, 100% { box-shadow: 0 0 0 3px rgba(74,222,128,.15); }
  50% { box-shadow: 0 0 0 6px rgba(74,222,128,.06); }
}

.atl-control {
  border-radius: 18px;
  padding: 16px;
  margin-bottom: 0;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.06);
}
.atl-control-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 14px;
}
.atl-stat {
  flex: 1;
  min-width: 100px;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(0,0,0,.28);
  border: 1px solid rgba(255,255,255,.05);
}
.atl-stat span {
  display: block;
  font-size: 11px;
  color: var(--text-muted);
  margin-bottom: 4px;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.atl-stat strong {
  display: block;
  color: #fff;
  font-size: 16px;
  font-weight: 800;
}
.atl-stat strong.pos { color: #4ade80; }
.atl-stat strong.neg { color: #f87171; }
.atl-control-actions {
  display: grid;
  gap: 8px;
}
.atl-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 48px;
  border-radius: 14px;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  border: 1px solid transparent;
  cursor: pointer;
  transition: transform .15s ease, background .15s ease, border-color .15s ease;
}
.atl-btn:active { transform: scale(.98); }
.atl-btn-primary {
  background: linear-gradient(135deg, #ff8a1f, #ff6a00);
  color: #111;
  border: none;
}
.atl-btn-ghost {
  background: transparent;
  color: #F0D78C;
  border-color: rgba(224,184,58,.45);
}

.atl-ops-section { margin-top: 4px; }
.atl-ops-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.atl-ops-title {
  font-size: 17px;
  font-weight: 750;
  color: #fff;
  margin: 0;
}
.atl-ops-count {
  font-size: 11px;
  font-weight: 700;
  color: var(--text-muted);
  padding: 3px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.06);
}
.atl-ops-actions {
  margin-left: auto;
}
.atl-ops-hist-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .02em;
  color: var(--text-muted);
  text-decoration: none;
  padding: 5px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.1);
  background: rgba(255,255,255,.04);
  transition: color .15s ease, border-color .15s ease, background .15s ease;
}
.atl-ops-hist-btn:hover {
  color: #fff;
  border-color: rgba(255,154,61,.45);
  background: rgba(255,154,61,.12);
}
.atl-ops-empty {
  padding: 32px 18px;
  text-align: center;
  color: var(--text-muted);
  border-radius: 16px;
  background: rgba(255,255,255,.03);
  border: 1px dashed rgba(255,255,255,.08);
}
.atl-ops-empty a { color: #F0D78C; font-weight: 700; }
.atl-ops-list {
  display: grid;
  gap: 8px;
}
.atl-op {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 13px 14px;
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.02));
  border: 1px solid rgba(255,255,255,.06);
  transition: border-color .15s ease, background .15s ease;
}
.atl-op:hover {
  border-color: rgba(255,255,255,.1);
  background: rgba(255,255,255,.05);
}
.atl-op-flags {
  position: relative;
  width: 46px;
  height: 34px;
  flex-shrink: 0;
}
.atl-flag {
  position: absolute;
  top: 0;
  left: 0;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid #0b0e13;
  background: #1a2230;
  box-shadow: 0 2px 8px rgba(0,0,0,.35);
}
.atl-flag-2 {
  left: 16px;
  top: 6px;
  z-index: 1;
}
.atl-op-body {
  flex: 1;
  min-width: 0;
  display: grid;
  gap: 2px;
}
.atl-op-pair {
  color: #fff;
  font-size: 15px;
  font-weight: 750;
  letter-spacing: .01em;
}
.atl-op-time,
.atl-op-type {
  color: var(--text-muted);
  font-size: 12px;
  line-height: 1.35;
}
.atl-op-pnl {
  text-align: right;
  flex-shrink: 0;
}
.atl-op-pnl strong {
  display: block;
  font-size: 15px;
  font-weight: 800;
}
.atl-op-pnl em {
  display: block;
  font-style: normal;
  font-size: 12px;
  margin-top: 2px;
  font-weight: 650;
}
.atl-op.is-win .atl-op-pnl strong,
.atl-op.is-win .atl-op-pnl em { color: #4ade80; }
.atl-op.is-loss .atl-op-pnl strong,
.atl-op.is-loss .atl-op-pnl em { color: #f87171; }

/* Desktop: painel lateral + lista larga */
@media (min-width: 980px) {
  .atl-simple {
    max-width: none;
    width: 100%;
    margin: 0;
    display: grid;
    grid-template-columns: minmax(300px, 360px) minmax(0, 1fr);
    gap: 28px;
    align-items: start;
    padding-bottom: 40px;
  }
  .atl-desk-side {
    position: sticky;
    top: 18px;
    margin-bottom: 0;
    gap: 16px;
  }
  .atl-hero {
    flex-direction: column;
    align-items: stretch;
    padding: 24px;
    min-height: 210px;
  }
  .atl-hero-brand {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  .atl-hero-logo {
    width: 88px;
    height: 88px;
    border-radius: 22px;
  }
  .atl-hero-title {
    font-size: 28px;
  }
  .atl-status-pill {
    align-self: flex-start;
    margin-top: 4px;
  }
  .atl-control {
    padding: 18px;
  }
  .atl-control-stats {
    flex-direction: column;
    margin-bottom: 16px;
  }
  .atl-stat {
    min-width: 0;
    padding: 14px 16px;
  }
  .atl-stat strong {
    font-size: 20px;
  }
  .atl-ops-section {
    margin-top: 0;
    padding: 6px 0 0;
  }
  .atl-ops-head {
    margin-bottom: 16px;
  }
  .atl-ops-title {
    font-size: 20px;
  }
  .atl-ops-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
  .atl-op {
    padding: 15px 16px;
    min-height: 84px;
  }
}

@media (min-width: 1280px) {
  .atl-simple {
    grid-template-columns: minmax(320px, 400px) minmax(0, 1fr);
    gap: 32px;
  }
  .atl-ops-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 520px) {
  .atl-hero {
    flex-direction: column;
    align-items: stretch;
  }
  .atl-hero-logo { width: 64px; height: 64px; border-radius: 16px; }
  .atl-hero-title { font-size: 24px; }
  .atl-status-pill { align-self: flex-start; }
  .atl-control-stats { gap: 8px; }
  .atl-stat { min-width: calc(50% - 4px); }
}

/* Gráfico: seletor completo de mercados */
.trd-graph-page { max-width: 1280px; margin: 0 auto; }
.trd-graph-top { margin-bottom: 14px; }
.trd-assets-all {
  flex: 1;
  flex-wrap: wrap;
  gap: 7px;
}
.trd-assets-all .trd-asset {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  white-space: nowrap;
  padding: 8px 12px;
}
.trd-asset-icon {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  background: rgba(255,255,255,.06);
}
.trd-asset-flags {
  position: relative;
  display: inline-block;
  width: 28px;
  height: 20px;
  flex-shrink: 0;
}
.trd-asset-flags img {
  position: absolute;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  object-fit: cover;
  border: 1px solid #0b0e13;
}
.trd-asset-flags img:first-child { left: 0; top: 0; }
.trd-asset-flags img:last-child { left: 10px; top: 3px; }
@media (max-width: 720px) {
  .trd-chart-head { align-items: flex-start; }
  .trd-assets-all {
    display: flex;
    width: 100%;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 5px;
    scrollbar-width: none;
  }
  .trd-assets-all::-webkit-scrollbar { display: none; }
  .trd-assets-all .trd-asset { flex: 0 0 auto; }
}

/* Modo suporte (admin impersonation) */
.support-mode-bar {
  position: sticky;
  top: 0;
  z-index: 10050;
  background: linear-gradient(90deg, #7c2d12, #b45309);
  color: #fff7ed;
  box-shadow: 0 4px 18px rgba(0,0,0,.35);
}
.support-mode-bar-inner {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 10px 16px;
  max-width: 1400px;
  margin: 0 auto;
}
.support-mode-bar strong {
  font-size: 13px;
  letter-spacing: .04em;
  text-transform: uppercase;
  background: rgba(0,0,0,.2);
  padding: 4px 10px;
  border-radius: 999px;
}
.support-mode-bar span {
  flex: 1;
  font-size: 13px;
  min-width: 180px;
}
.support-mode-exit {
  background: #fff !important;
  color: #7c2d12 !important;
  border: none !important;
  font-weight: 700 !important;
}
@media (max-width: 900px) {
  .support-mode-bar-inner {
    padding: 10px 12px;
    gap: 8px;
  }
  .support-mode-bar span { font-size: 12px; }
}
