:root {
  --growth-bg: #070b15;
  --growth-panel: rgba(15, 21, 36, .86);
  --growth-panel-strong: rgba(17, 24, 42, .96);
  --growth-border: rgba(255,255,255,.085);
  --growth-text: #f6f8ff;
  --growth-muted: #8898b7;
  --growth-blue: #56a8ff;
  --growth-violet: #9c6cff;
  --growth-cyan: #45d2e9;
  --growth-green: #4cda98;
  --growth-orange: #ffad58;
  --growth-pink: #f06cb2;
}

body.growth-body {
  min-height: 100vh;
  background:
    radial-gradient(circle at 12% 0%, rgba(93,77,255,.16), transparent 30%),
    radial-gradient(circle at 88% 8%, rgba(48,166,255,.10), transparent 26%),
    linear-gradient(180deg, #080d1a 0%, #070b15 52%, #060a12 100%);
}

.growth-main {
  position: relative;
  overflow: hidden;
  min-height: calc(100vh - 72px);
  padding: 54px 0 90px;
}

.growth-main::before,
.growth-main::after {
  content: "";
  position: absolute;
  pointer-events: none;
  border-radius: 999px;
  filter: blur(100px);
  opacity: .30;
}

.growth-main::before {
  width: 460px;
  height: 460px;
  left: -230px;
  top: 230px;
  background: rgba(99,73,255,.30);
}

.growth-main::after {
  width: 420px;
  height: 420px;
  right: -240px;
  top: 640px;
  background: rgba(50,160,255,.16);
}

.growth-shell {
  position: relative;
  z-index: 1;
  width: min(1180px, calc(100% - 34px));
  margin: 0 auto;
}

.growth-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 28px;
  align-items: end;
  margin-bottom: 34px;
}

.growth-kicker {
  margin-bottom: 12px;
  color: var(--growth-blue);
  font-size: 11px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.growth-hero h1 {
  margin: 0;
  color: var(--growth-text);
  font-size: clamp(42px, 6vw, 74px);
  line-height: .98;
  letter-spacing: -.055em;
}

.growth-hero p {
  max-width: 760px;
  margin: 18px 0 0;
  color: #9caac4;
  font-size: 16px;
  line-height: 1.65;
}

.growth-live-badge {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid rgba(76,218,152,.22);
  border-radius: 999px;
  background: rgba(76,218,152,.075);
  color: #79e9b3;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  white-space: nowrap;
}

.growth-live-badge i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #4cda98;
  box-shadow: 0 0 16px rgba(76,218,152,.6);
}

.growth-card {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--growth-border);
  border-radius: 22px;
  background:
    linear-gradient(145deg, rgba(255,255,255,.035), rgba(255,255,255,.012)),
    var(--growth-panel);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.025),
    0 20px 50px rgba(0,0,0,.16);
}

.growth-card::after {
  content: "";
  position: absolute;
  width: 180px;
  height: 180px;
  right: -70px;
  top: -90px;
  border-radius: 50%;
  background: rgba(100,84,255,.12);
  filter: blur(45px);
  pointer-events: none;
}

.growth-stat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}

.growth-stat {
  min-height: 150px;
  padding: 19px;
}

.growth-stat-top {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}

.growth-stat-icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(86,168,255,.20);
  border-radius: 13px;
  background: rgba(86,168,255,.07);
  color: var(--growth-blue);
  font-size: 18px;
  font-weight: 900;
}

.growth-stat small {
  color: #71809d;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.growth-stat strong {
  display: block;
  margin-top: 18px;
  color: #fff;
  font-size: 33px;
  line-height: 1;
  letter-spacing: -.04em;
}

.growth-stat span {
  display: block;
  margin-top: 9px;
  color: #8391ad;
  font-size: 11px;
  line-height: 1.45;
}

.growth-grid-2 {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(300px, .75fr);
  gap: 14px;
}

.growth-section {
  padding: 22px;
}

.growth-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 20px;
}

.growth-section-head h2,
.growth-section h2 {
  margin: 0;
  color: #fff;
  font-size: 20px;
  letter-spacing: -.025em;
}

.growth-section-head p,
.growth-section > p {
  margin: 6px 0 0;
  color: #7f8daa;
  font-size: 12px;
  line-height: 1.55;
}

.growth-chart {
  height: 250px;
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 10px;
  align-items: end;
  padding-top: 12px;
}

.growth-chart-col {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
}

.growth-chart-value {
  color: #9faed0;
  font-size: 10px;
  font-weight: 800;
}

.growth-chart-bar-wrap {
  position: relative;
  width: 100%;
  height: 185px;
  display: flex;
  align-items: end;
  padding: 0 5px;
}

.growth-chart-bar {
  width: 100%;
  min-height: 7px;
  border-radius: 9px 9px 4px 4px;
  background:
    linear-gradient(180deg, #8c70ff 0%, #4c8dff 58%, #315ed6 100%);
  box-shadow: 0 10px 28px rgba(75,101,255,.20);
  transition: height .45s ease;
}

.growth-chart-label {
  color: #697995;
  font-size: 10px;
}

.growth-breakdown {
  display: grid;
  gap: 17px;
  margin-top: 20px;
}

.growth-progress-row {
  display: grid;
  gap: 8px;
}

.growth-progress-label {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  color: #94a3bf;
  font-size: 11px;
}

.growth-progress-track {
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255,255,255,.055);
}

.growth-progress-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #6f5dff, #4ba8ff);
}

.growth-event-list,
.growth-ref-list,
.growth-ticket-list {
  display: grid;
  gap: 8px;
}

.growth-event,
.growth-ref-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 58px;
  padding: 12px 13px;
  border: 1px solid rgba(255,255,255,.055);
  border-radius: 14px;
  background: rgba(255,255,255,.018);
}

.growth-event strong,
.growth-ref-row strong {
  color: #eaf0ff;
  font-size: 11px;
}

.growth-event small,
.growth-ref-row small {
  display: block;
  margin-top: 4px;
  color: #6f7e99;
  font-size: 9px;
}

.growth-empty {
  min-height: 150px;
  display: grid;
  place-items: center;
  padding: 26px;
  border: 1px dashed rgba(255,255,255,.08);
  border-radius: 17px;
  color: #73809a;
  text-align: center;
  font-size: 12px;
}

.growth-ref-hero {
  padding: 28px;
  margin-bottom: 14px;
  background:
    radial-gradient(circle at 90% 10%, rgba(69,210,233,.10), transparent 28%),
    linear-gradient(135deg, rgba(58,83,145,.10), rgba(142,85,255,.055)),
    var(--growth-panel-strong);
}

.growth-link-box {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  margin-top: 20px;
}

.growth-input,
.growth-textarea,
.growth-select {
  width: 100%;
  border: 1px solid rgba(255,255,255,.085);
  border-radius: 13px;
  background: rgba(5,9,17,.75);
  color: #eef3ff;
  outline: none;
  font: inherit;
  transition: border-color .18s ease, box-shadow .18s ease;
}

.growth-input,
.growth-select {
  min-height: 46px;
  padding: 0 13px;
}

.growth-textarea {
  min-height: 120px;
  resize: vertical;
  padding: 13px;
  line-height: 1.5;
}

.growth-input:focus,
.growth-textarea:focus,
.growth-select:focus {
  border-color: rgba(111,104,255,.48);
  box-shadow: 0 0 0 3px rgba(111,104,255,.08);
}

.growth-btn {
  min-height: 44px;
  padding: 0 16px;
  border: 1px solid rgba(132,100,255,.34);
  border-radius: 13px;
  background: linear-gradient(135deg, rgba(117,83,255,.24), rgba(72,106,255,.16));
  color: #fff;
  font-weight: 850;
  cursor: pointer;
}

.growth-btn:hover {
  border-color: rgba(147,118,255,.55);
  background: linear-gradient(135deg, rgba(117,83,255,.32), rgba(72,106,255,.21));
}

.growth-btn.secondary {
  border-color: rgba(255,255,255,.09);
  background: rgba(255,255,255,.035);
  color: #aebbd3;
}

.growth-btn.danger {
  border-color: rgba(255,95,113,.26);
  background: rgba(255,76,100,.065);
  color: #ff8494;
}

.growth-btn:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.growth-how-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 18px;
}

.growth-how {
  padding: 16px;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 15px;
  background: rgba(255,255,255,.018);
}

.growth-how b {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  margin-bottom: 13px;
  border-radius: 9px;
  background: rgba(113,89,255,.13);
  color: #ac9aff;
  font-size: 11px;
}

.growth-how strong {
  color: #eef2ff;
  font-size: 12px;
}

.growth-how p {
  margin: 7px 0 0;
  color: #74839f;
  font-size: 10px;
  line-height: 1.5;
}

.growth-support-layout {
  display: grid;
  grid-template-columns: 370px minmax(0, 1fr);
  gap: 14px;
  min-height: 650px;
}

.growth-support-sidebar,
.growth-support-chat {
  padding: 18px;
}

.growth-support-sidebar {
  align-self: start;
}

.growth-new-ticket {
  display: grid;
  gap: 9px;
  margin-bottom: 18px;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}

.growth-ticket {
  width: 100%;
  padding: 13px;
  border: 1px solid rgba(255,255,255,.055);
  border-radius: 14px;
  background: rgba(255,255,255,.018);
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.growth-ticket:hover,
.growth-ticket.active {
  border-color: rgba(116,96,255,.28);
  background: rgba(94,76,255,.065);
}

.growth-ticket-top {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
}

.growth-ticket strong {
  color: #eef2ff;
  font-size: 11px;
}

.growth-ticket p {
  overflow: hidden;
  margin: 7px 0 0;
  color: #72819d;
  font-size: 10px;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.growth-ticket-meta {
  margin-top: 8px;
  color: #5f6f8b;
  font-size: 9px;
}

.growth-status {
  display: inline-flex;
  align-items: center;
  min-height: 23px;
  padding: 0 8px;
  border: 1px solid rgba(86,168,255,.15);
  border-radius: 999px;
  background: rgba(86,168,255,.05);
  color: #7fbaff;
  font-size: 8px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.growth-status[data-status="in_progress"] {
  border-color: rgba(255,173,88,.18);
  background: rgba(255,173,88,.055);
  color: #ffc174;
}

.growth-status[data-status="resolved"] {
  border-color: rgba(76,218,152,.18);
  background: rgba(76,218,152,.055);
  color: #78e9b4;
}

.growth-status[data-status="closed"] {
  border-color: rgba(255,255,255,.08);
  background: rgba(255,255,255,.025);
  color: #7a879e;
}

.growth-chat-head {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: flex-start;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}

.growth-chat-head h2 {
  margin: 0;
  color: #fff;
  font-size: 18px;
}

.growth-chat-head p {
  margin: 6px 0 0;
  color: #6f7f9b;
  font-size: 10px;
}

.growth-chat-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.growth-messages {
  height: 450px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 18px 2px;
}

.growth-message {
  max-width: min(78%, 650px);
  padding: 12px 14px;
  border: 1px solid rgba(255,255,255,.065);
  border-radius: 15px 15px 15px 5px;
  background: rgba(255,255,255,.025);
}

.growth-message.admin {
  align-self: flex-end;
  border-color: rgba(111,94,255,.20);
  border-radius: 15px 15px 5px 15px;
  background: rgba(99,77,255,.075);
}

.growth-message.mine:not(.admin) {
  align-self: flex-end;
  border-color: rgba(72,166,255,.18);
  border-radius: 15px 15px 5px 15px;
  background: rgba(72,133,255,.055);
}

.growth-message strong {
  color: #dfe7ff;
  font-size: 10px;
}

.growth-message p {
  margin: 7px 0 0;
  color: #aab6ce;
  font-size: 12px;
  line-height: 1.55;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.growth-message small {
  display: block;
  margin-top: 8px;
  color: #60708d;
  font-size: 8px;
}

.growth-reply {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  padding-top: 14px;
  border-top: 1px solid rgba(255,255,255,.06);
}

.growth-reply .growth-textarea {
  min-height: 80px;
}

.growth-admin-note {
  display: none;
  margin-bottom: 12px;
  padding: 11px 13px;
  border: 1px solid rgba(255,173,88,.14);
  border-radius: 13px;
  background: rgba(255,173,88,.04);
  color: #b89a75;
  font-size: 10px;
}

.growth-admin-note.show {
  display: block;
}

.growth-toast {
  position: fixed;
  z-index: 1000;
  right: 22px;
  bottom: 22px;
  max-width: 360px;
  padding: 13px 15px;
  border: 1px solid rgba(76,218,152,.18);
  border-radius: 14px;
  background: rgba(12,20,32,.96);
  box-shadow: 0 18px 55px rgba(0,0,0,.3);
  color: #dff9ec;
  font-size: 11px;
  transform: translateY(16px);
  opacity: 0;
  pointer-events: none;
  transition: .2s ease;
}

.growth-toast.show {
  transform: translateY(0);
  opacity: 1;
}

.growth-error {
  color: #ff8597 !important;
}

.growth-catalog-open {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 0 11px;
  border: 1px solid rgba(var(--dev-accent), .28);
  border-radius: 9px;
  background: rgba(var(--dev-accent), .08);
  color: #fff !important;
  font-weight: 850;
}

@media (max-width: 980px) {
  .growth-stat-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .growth-grid-2 { grid-template-columns: 1fr; }
  .growth-support-layout { grid-template-columns: 1fr; }
  .growth-support-sidebar { order: 1; }
  .growth-support-chat { order: 2; }
}

@media (max-width: 700px) {
  .growth-main { padding-top: 34px; }
  .growth-hero { grid-template-columns: 1fr; align-items: start; }
  .growth-hero h1 { font-size: 44px; }
  .growth-stat-grid { grid-template-columns: 1fr 1fr; }
  .growth-stat { min-height: 132px; padding: 15px; }
  .growth-stat strong { font-size: 27px; }
  .growth-how-grid { grid-template-columns: 1fr; }
  .growth-link-box { grid-template-columns: 1fr; }
  .growth-chart { gap: 5px; }
  .growth-section { padding: 17px; }
  .growth-support-sidebar, .growth-support-chat { padding: 14px; }
  .growth-messages { height: 390px; }
  .growth-reply { grid-template-columns: 1fr; }
  .growth-message { max-width: 90%; }
}


/* TGSTOCK REFERRAL REWARDS V1 */
.growth-reward-hero{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:28px;padding:30px;background:linear-gradient(135deg,rgba(111,140,255,.14),rgba(139,92,246,.09) 48%,rgba(18,26,47,.92));border-color:rgba(126,145,255,.28)}
.growth-reward-hero:before{content:"";position:absolute;width:360px;height:360px;right:-150px;top:-180px;border-radius:50%;background:rgba(126,104,255,.18);filter:blur(2px);pointer-events:none}
.growth-reward-copy{position:relative;z-index:1;max-width:760px}.growth-reward-eyebrow{margin-bottom:10px;color:#92a7ff;font-size:11px;font-weight:900;letter-spacing:.14em}.growth-reward-copy h2{margin:0;font-size:clamp(26px,4vw,42px);letter-spacing:-.035em}.growth-reward-copy h2 span{color:#a993ff}.growth-reward-copy p{max-width:760px;margin:14px 0 0;color:#9eabc7;line-height:1.65}
.growth-reward-orb{position:relative;z-index:1;width:150px;height:150px;border-radius:42px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid rgba(160,137,255,.32);background:radial-gradient(circle at 30% 20%,rgba(136,115,255,.28),rgba(19,28,49,.92));box-shadow:0 24px 70px rgba(72,54,185,.22),inset 0 1px 0 rgba(255,255,255,.08)}.growth-reward-orb strong{font-size:43px;line-height:1;letter-spacing:-.05em}.growth-reward-orb span{margin-top:8px;color:#aebce0;font-size:12px;font-weight:800}
.growth-reward-stats{margin-top:14px}.growth-reward-history{margin-top:14px}.growth-reward-row .growth-reward-amount{display:flex;flex-direction:column;align-items:flex-end;color:#8fe0b9;font-weight:900}.growth-reward-row .growth-reward-amount small{margin-top:4px;color:#7f8da9;font-weight:600}
@media(max-width:720px){.growth-reward-hero{grid-template-columns:1fr}.growth-reward-orb{width:118px;height:118px;border-radius:34px}.growth-reward-orb strong{font-size:34px}}