* {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
      font-family: Arial, Helvetica, sans-serif;
    }

    :root {
      --navy: #06111f;
      --midnight: #020817;
      --blue: #2962ff;
      --red: #b91c1c;
      --gold: #d4af37;
      --green: #16a34a;
      --soft: #f3f6fb;
      --line: #e5e7eb;
      --text: #101828;
      --muted: #667085;
      --white: #ffffff;
      --orange-bg: #fff7ed;
      --orange-border: #fed7aa;
      --orange-text: #7c2d12;
    }

    body {
      background: var(--soft);
      color: var(--text);
    }

    button,
    input,
    select {
      font: inherit;
    }

    button {
      cursor: pointer;
    }

    .hidden {
      display: none !important;
    }

    .btn {
      border: 0;
      border-radius: 13px;
      padding: 11px 14px;
      font-weight: 950;
      background: #e5e7eb;
      color: #111827;
      transition: 0.2s;
    }

    .btn:hover {
      transform: translateY(-1px);
      filter: brightness(0.98);
    }

    .btn.primary {
      background: var(--blue);
      color: white;
    }

    .btn.green {
      background: var(--green);
      color: white;
    }

    .btn.red {
      background: var(--red);
      color: white;
    }

    .btn.gold {
      background: var(--gold);
      color: #111827;
    }

    .btn.dark {
      background: var(--midnight);
      color: white;
    }

    label {
      display: block;
      color: #344054;
      font-weight: 850;
      font-size: 13px;
      margin-bottom: 12px;
    }

    input,
    select {
      width: 100%;
      margin-top: 7px;
      border: 1px solid #cbd5e1;
      border-radius: 13px;
      padding: 11px 12px;
      outline: none;
      background: white;
    }

    input:focus,
    select:focus {
      border-color: var(--blue);
      box-shadow: 0 0 0 4px rgba(41, 98, 255, 0.1);
    }

    .form-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 12px;
    }

    .full {
      grid-column: 1 / -1;
    }

    .auth-screen {
      min-height: 100vh;
      display: grid;
      place-items: center;
      padding: 20px;
      background:
        radial-gradient(circle at top left, rgba(212, 175, 55, .22), transparent 32%),
        var(--soft);
    }

    .auth-card {
      width: min(980px, 100%);
      background: white;
      border: 1px solid var(--line);
      border-radius: 28px;
      overflow: hidden;
      box-shadow: 0 28px 80px rgba(15, 23, 42, .12);
      display: grid;
      grid-template-columns: 1fr 1fr;
    }

    .auth-intro {
      background: linear-gradient(160deg, #071426, #020817);
      color: white;
      padding: 38px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 18px;
    }

    .auth-intro h1 {
      font-size: 38px;
      line-height: 1.05;
      letter-spacing: -1.2px;
    }

    .auth-intro p {
      color: #cbd5e1;
      line-height: 1.65;
    }

    .auth-badge {
      display: inline-block;
      width: max-content;
      background: rgba(212, 175, 55, .16);
      border: 1px solid rgba(212, 175, 55, .35);
      color: #fde68a;
      padding: 9px 12px;
      border-radius: 999px;
      font-weight: 950;
      font-size: 12px;
    }

    .auth-forms {
      padding: 30px;
    }

    .auth-toggle {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 8px;
      margin-bottom: 18px;
    }

    .auth-toggle button {
      border: 0;
      border-radius: 13px;
      padding: 11px 14px;
      font-weight: 950;
      background: #e5e7eb;
      color: #111827;
    }

    .auth-toggle button.active {
      background: var(--blue);
      color: white;
    }

    .top-notice {
      background: linear-gradient(90deg, #06111f, #0f172a, #06111f);
      color: #e5e7eb;
      text-align: center;
      padding: 9px 14px;
      font-size: 13px;
      font-weight: 900;
      letter-spacing: .2px;
    }

    .dashboard {
      min-height: 100vh;
      display: grid;
      grid-template-columns: 285px 1fr;
    }

    .sidebar {
      background:
        radial-gradient(circle at top, rgba(212, 175, 55, .18), transparent 34%),
        linear-gradient(180deg, #071426, #030712);
      color: white;
      padding: 22px 18px;
      position: sticky;
      top: 0;
      height: 100vh;
      overflow-y: auto;
      border-right: 1px solid rgba(255, 255, 255, .08);
    }

    .brand-box {
      text-align: center;
      padding: 12px 8px 22px;
      border-bottom: 1px solid rgba(255, 255, 255, .10);
      margin-bottom: 22px;
    }

    .brand-logo {
      width: 112px;
      height: 112px;
      border-radius: 25px;
      display: grid;
      place-items: center;
      margin: 0 auto 12px;
      background: linear-gradient(135deg, #0b1220, #1d4ed8, #d4af37);
      color: white;
      font-size: 32px;
      font-weight: 950;
      box-shadow: 0 18px 45px rgba(0, 0, 0, .28);
    }
    
  .logo-img-box img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: transparent;
}
    .brand-logo,
.logo-img-box {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}
    
    .logo-text {
      font-size: 24px;
      font-weight: 950;
      letter-spacing: .2px;
      line-height: 1.05;
    }

    .logo-text span {
      color: var(--gold);
      display: block;
      font-size: 14px;
      letter-spacing: 6px;
      margin-top: 7px;
      text-transform: uppercase;
    }
.sidebar .logo-text {
  font-size: 24px;
  font-weight: 950;
  letter-spacing: .2px;
  line-height: 1.05;
  color: white;
  text-align: center;
}

.sidebar .logo-text span {
  color: var(--gold);
  display: block;
  font-size: 14px;
  letter-spacing: 6px;
  margin-top: 7px;
  text-transform: uppercase;
}

.sidebar .logo-img-box {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  overflow: visible !important;
  padding: 0 !important;
}

.sidebar .logo-img-box img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
    .profile {
      background: rgba(255, 255, 255, .08);
      border: 1px solid rgba(255, 255, 255, .12);
      border-radius: 20px;
      padding: 18px;
      margin-bottom: 22px;
    }

    .avatar {
      width: 56px;
      height: 56px;
      border-radius: 18px;
      background: linear-gradient(135deg, var(--blue), var(--red));
      display: grid;
      place-items: center;
      font-size: 23px;
      font-weight: 950;
      margin-bottom: 12px;
      border: 1px solid rgba(212, 175, 55, .55);
    }

    .profile strong {
      display: block;
      font-size: 17px;
      margin-bottom: 5px;
    }

    .profile span {
      display: block;
      color: #cbd5e1;
      font-size: 12px;
      line-height: 1.55;
    }

    .menu {
      display: grid;
      gap: 7px;
    }

    .menu button {
      color: #dbeafe;
      text-decoration: none;
      padding: 13px 14px;
      border-radius: 14px;
      font-weight: 900;
      font-size: 14px;
      display: flex;
      align-items: center;
      gap: 10px;
      background: transparent;
      border: 0;
      text-align: left;
    }

    .menu button:hover,
    .menu button.active {
      background: rgba(212, 175, 55, .16);
      color: white;
    }

    .side-note {
      margin-top: 18px;
      color: #cbd5e1;
      font-size: 12px;
      line-height: 1.5;
      background: rgba(255, 255, 255, .07);
      border: 1px solid rgba(255, 255, 255, .1);
      border-radius: 18px;
      padding: 14px;
    }

    .main {
      padding: 24px;
      min-width: 0;
    }

    .topbar {
      background: white;
      border: 1px solid var(--line);
      border-radius: 24px;
      padding: 18px 22px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 18px;
      margin-bottom: 22px;
      box-shadow: 0 10px 26px rgba(15, 23, 42, .05);
      position: relative;
      overflow: hidden;
    }

    .topbar:before {
      content: '';
      position: absolute;
      left: 0;
      top: 0;
      bottom: 0;
      width: 7px;
      background: linear-gradient(180deg, var(--blue), var(--red));
    }

    .topbar-left {
      display: flex;
      align-items: center;
      gap: 15px;
    }

    .top-logo {
      width: 58px;
      height: 58px;
      border-radius: 16px;
      display: grid;
      place-items: center;
      background: linear-gradient(135deg, #06111f, #1d4ed8);
      color: white;
      font-weight: 950;
      border: 1px solid #e5e7eb;
    }

    .topbar h1 {
      font-size: 27px;
      letter-spacing: -.9px;
      margin-bottom: 4px;
    }

    .topbar p {
      color: var(--muted);
      font-size: 14px;
    }

    .status-pill {
      background: #eff6ff;
      color: #1d4ed8;
      border: 1px solid #bfdbfe;
      padding: 10px 14px;
      border-radius: 999px;
      font-size: 13px;
      font-weight: 950;
      white-space: nowrap;
    }

    .live-dot {
      display: inline-block;
      width: 9px;
      height: 9px;
      background: #22c55e;
      border-radius: 50%;
      animation: pulse 1.3s infinite;
      margin-right: 6px;
    }

    @keyframes pulse {
      0% {
        box-shadow: 0 0 0 0 rgba(34, 197, 94, .65);
      }
      70% {
        box-shadow: 0 0 0 10px rgba(34, 197, 94, 0);
      }
      100% {
        box-shadow: 0 0 0 0 rgba(34, 197, 94, 0);
      }
    }

    .account-switch {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 14px;
      margin-bottom: 22px;
    }

    .switch-card {
      background: white;
      border: 1px solid var(--line);
      border-radius: 22px;
      padding: 18px;
      box-shadow: 0 8px 22px rgba(15, 23, 42, .04);
      text-align: left;
    }

    .switch-card.active {
      border-color: var(--gold);
      box-shadow:
        0 0 0 4px rgba(212, 175, 55, .16),
        0 10px 26px rgba(15, 23, 42, .06);
    }

    .switch-card strong {
      display: block;
      font-size: 18px;
      margin-bottom: 5px;
    }

    .switch-card span {
      color: var(--muted);
      font-size: 13px;
      line-height: 1.45;
    }

    .summary-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 16px;
      margin-bottom: 22px;
    }

    .summary-card {
      background: white;
      border: 1px solid var(--line);
      border-radius: 22px;
      padding: 20px;
      box-shadow: 0 8px 22px rgba(15, 23, 42, .04);
      position: relative;
      overflow: hidden;
    }

    .summary-card:after {
      content: '';
      position: absolute;
      right: -28px;
      bottom: -28px;
      width: 90px;
      height: 90px;
      border-radius: 50%;
      background: rgba(29, 78, 216, .08);
    }

    .summary-card:nth-child(2):after {
      background: rgba(185, 28, 28, .08);
    }

    .summary-card:nth-child(3):after {
      background: rgba(212, 175, 55, .16);
    }

    .summary-card:nth-child(4):after {
      background: rgba(22, 163, 74, .10);
    }

    .summary-card span {
      color: var(--muted);
      font-size: 13px;
      font-weight: 800;
    }

    .summary-card h2 {
      margin-top: 10px;
      font-size: 28px;
      letter-spacing: -1px;
    }

    .summary-card small {
      display: block;
      margin-top: 7px;
      color: #475467;
      font-weight: 900;
      font-size: 12px;
    }

    .panel {
      background: white;
      border: 1px solid var(--line);
      border-radius: 24px;
      padding: 22px;
      box-shadow: 0 8px 22px rgba(15, 23, 42, .04);
      margin-bottom: 22px;
    }

    .panel-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 14px;
      margin-bottom: 18px;
    }

    .panel-header h2 {
      font-size: 21px;
      letter-spacing: -.5px;
    }

    .panel-header span {
      color: var(--blue);
      font-size: 13px;
      font-weight: 900;
    }

    .chart-toolbar-row {
      display: flex;
      align-items: center;
      gap: 8px;
      flex-wrap: wrap;
      justify-content: flex-end;
    }

    .chart-toolbar-row select {
      width: auto;
      min-width: 132px;
      margin-top: 0;
      padding: 9px 11px;
      border-radius: 10px;
      font-size: 13px;
      font-weight: 900;
    }

    .chart-style-pill {
      background: #f8fafc;
      border: 1px solid #e5e7eb;
      border-radius: 999px;
      padding: 8px 11px;
      font-size: 12px;
      color: #475467;
      font-weight: 950;
    }

    .chart-shell {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 82px;
      border: 1px solid #d9dee8;
      border-radius: 20px;
      overflow: hidden;
      background: white;
      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .7);
    }

    .chart-box {
      height: 520px;
      background: white;
      position: relative;
      overflow: hidden;
      background-image:
        linear-gradient(rgba(15, 23, 42, .05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(15, 23, 42, .045) 1px, transparent 1px);
      background-size: 70px 48px;
    }

    .chart-label {
      position: absolute;
      top: 14px;
      left: 14px;
      color: #111827;
      z-index: 9;
      font-size: 13px;
      font-weight: 950;
      background: rgba(255, 255, 255, .92);
      padding: 8px 10px;
      border-radius: 999px;
      border: 1px solid #e5e7eb;
      box-shadow: 0 6px 18px rgba(15, 23, 42, .08);
    }

    .watermark-pair {
      position: absolute;
      left: 50%;
      top: 54%;
      transform: translate(-50%, -50%);
      font-size: clamp(38px, 8vw, 88px);
      font-weight: 950;
      letter-spacing: -2px;
      color: rgba(15, 23, 42, .055);
      z-index: 0;
      pointer-events: none;
      white-space: nowrap;
    }

    .price-line {
      position: absolute;
      right: 0;
      left: 0;
      top: 58%;
      border-top: 1px dashed rgba(41, 98, 255, .65);
      z-index: 3;
    }

    .price-badge {
      position: absolute;
      right: 8px;
      top: calc(58% - 15px);
      background: var(--blue);
      color: white;
      padding: 6px 9px;
      border-radius: 6px;
      font-size: 12px;
      font-weight: 950;
      z-index: 8;
      box-shadow: 0 6px 16px rgba(41, 98, 255, .25);
    }

    .current-dot {
      position: absolute;
      width: 12px;
      height: 12px;
      border-radius: 50%;
      background: var(--blue);
      right: 16px;
      top: 57%;
      z-index: 8;
      box-shadow: 0 0 0 6px rgba(41, 98, 255, .12);
    }

    .tv-crosshair-v,
    .tv-crosshair-h {
      position: absolute;
      pointer-events: none;
      z-index: 3;
      opacity: .65;
    }

    .tv-crosshair-v {
      top: 0;
      bottom: 0;
      left: 50%;
      border-left: 1px dashed #94a3b8;
    }

    .tv-crosshair-h {
      left: 0;
      right: 0;
      top: 50%;
      border-top: 1px dashed #94a3b8;
    }

    .entry-line {
      position: absolute;
      left: 0;
      right: 0;
      display: none;
      border-top: 2px solid var(--green);
      z-index: 5;
    }

    .entry-badge {
      position: absolute;
      right: 8px;
      display: none;
      transform: translateY(-50%);
      color: white;
      padding: 7px 10px;
      border-radius: 7px;
      font-size: 12px;
      font-weight: 950;
      z-index: 8;
      box-shadow: 0 8px 18px rgba(0, 0, 0, .16);
    }

    .area-chart-svg,
    .volume-layer {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      z-index: 2;
    }

    .volume-layer {
      top: auto;
      height: 26%;
      bottom: 0;
      z-index: 1;
      opacity: .78;
      pointer-events: none;
    }

    .price-axis {
      background: white;
      border-left: 1px solid #e5e7eb;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      padding: 12px 8px;
      color: #475467;
      font-size: 11px;
      font-weight: 800;
      text-align: right;
    }

    .time-axis {
      height: 38px;
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      align-items: center;
      color: #667085;
      font-size: 10.5px;
      font-weight: 850;
      padding: 0 90px 0 16px;
      background: white;
      border: 1px solid #e5e7eb;
      border-top: none;
      border-radius: 0 0 18px 18px;
      overflow: hidden;
    }

    .time-axis span {
      white-space: nowrap;
      text-align: center;
      border-left: 1px solid rgba(15, 23, 42, .055);
      padding-left: 5px;
    }

    .entry-status {
      margin-top: 12px;
      padding: 12px;
      background: #f8fafc;
      border: 1px dashed #cbd5e1;
      border-radius: 14px;
      color: #344054;
      font-size: 13px;
      font-weight: 800;
    }

    .layout-2 {
      display: grid;
      grid-template-columns: .85fr 1.15fr;
      gap: 18px;
    }

    .pl-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 14px;
    }

    .pl-card {
      border: 1px solid var(--line);
      border-radius: 18px;
      padding: 18px;
      background: #f8fafc;
    }

    .pl-card span {
      color: var(--muted);
      font-size: 12px;
      font-weight: 900;
      text-transform: uppercase;
    }

    .pl-card h2 {
      margin-top: 9px;
      font-size: 26px;
      letter-spacing: -1px;
    }

    .positive h2 {
      color: var(--green);
    }

    .negative h2 {
      color: var(--red);
    }

    .neutral h2 {
      color: var(--blue);
    }

    .bot-card {
      background:
        radial-gradient(circle at right top, rgba(212, 175, 55, .24), transparent 32%),
        linear-gradient(135deg, #071426, #111827);
      color: white;
      border-radius: 22px;
      padding: 20px;
      border: 1px solid rgba(212, 175, 55, .18);
      margin-bottom: 22px;
    }

    .bot-card h3 {
      font-size: 22px;
      margin-bottom: 8px;
    }

    .bot-card p {
      color: #cbd5e1;
      line-height: 1.6;
      font-size: 14px;
      margin-bottom: 14px;
    }

    .bot-status {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 10px;
    }

    .bot-status div {
      background: rgba(255, 255, 255, .1);
      padding: 12px;
      border-radius: 14px;
      border: 1px solid rgba(255, 255, 255, .12);
    }

    .bot-status span {
      color: #e5e7eb;
      font-size: 12px;
      font-weight: 800;
      display: block;
      margin-top: 6px;
    }

    .trade-feed {
      display: grid;
      gap: 10px;
      max-height: 275px;
      overflow: auto;
      padding-right: 5px;
    }

    .trade-item {
      display: flex;
      justify-content: space-between;
      gap: 12px;
      align-items: center;
      background: #f8fafc;
      border: 1px solid var(--line);
      border-radius: 15px;
      padding: 12px;
      font-size: 13px;
    }

    .trade-item strong {
      display: block;
      margin-bottom: 3px;
    }

    .trade-item span {
      color: var(--muted);
      font-size: 12px;
      font-weight: 700;
    }

    .profit {
      color: var(--green);
      font-weight: 950;
      white-space: nowrap;
    }

    .loss {
      color: var(--red);
      font-weight: 950;
      white-space: nowrap;
    }

    .control-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 12px;
    }

    .control-grid .btn {
      width: 100%;
    }

    .notice {
      background: var(--orange-bg);
      border: 1px solid var(--orange-border);
      color: var(--orange-text);
      border-radius: 18px;
      padding: 14px 16px;
      font-size: 13px;
      line-height: 1.6;
      font-weight: 700;
    }

    table {
      width: 100%;
      border-collapse: collapse;
      font-size: 13px;
    }

    th {
      text-align: left;
      color: var(--muted);
      background: #f8fafc;
      padding: 12px;
      font-size: 12px;
      text-transform: uppercase;
    }

    td {
      padding: 14px 12px;
      border-bottom: 1px solid var(--line);
      color: #344054;
      font-weight: 700;
    }

    .modal-backdrop {
      position: fixed;
      inset: 0;
      background: rgba(2, 8, 23, .55);
      display: none;
      align-items: center;
      justify-content: center;
      padding: 18px;
      z-index: 50;
    }

    .modal-backdrop.show {
      display: flex;
    }

    .modal {
      width: min(560px, 100%);
      background: white;
      border-radius: 24px;
      overflow: hidden;
      box-shadow: 0 30px 90px rgba(0, 0, 0, .35);
    }

    .modal-header {
      padding: 17px 20px;
      border-bottom: 1px solid var(--line);
      display: flex;
      align-items: center;
      justify-content: space-between;
    }

    .modal-body {
      padding: 20px;
    }

    .kes-live {
      margin-top: 8px;
      padding: 10px;
      border-radius: 12px;
      background: #ecfdf5;
      border: 1px solid #bbf7d0;
      color: #166534;
      font-weight: 950;
    }

    .danger-box {
      background: var(--orange-bg);
      border: 1px solid var(--orange-border);
      color: var(--orange-text);
      border-radius: 18px;
      padding: 16px;
      line-height: 1.65;
      font-weight: 850;
    }

    .simulation-watermark {
      position: fixed;
      inset: auto 18px 18px auto;
      background: rgba(6, 17, 31, .94);
      color: white;
      padding: 12px 15px;
      border-radius: 999px;
      font-size: 12px;
      font-weight: 950;
      z-index: 30;
      box-shadow: 0 10px 24px rgba(0, 0, 0, .18);
      border: 1px solid rgba(212, 175, 55, .28);
    }

    .section {
      display: none;
    }

    .section.active {
      display: block;
    }


    .auth-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
    .auth-actions .btn{padding:10px 13px;border-radius:999px;font-size:13px}
    .guest-pill{background:#f8fafc;border:1px solid #e5e7eb;color:#475467;padding:10px 13px;border-radius:999px;font-size:13px;font-weight:950;white-space:nowrap}
    .modal-auth{position:fixed;inset:0;z-index:80;background:rgba(2,8,23,.62);min-height:100vh}
    .modal-auth .auth-card{width:min(880px,96vw);max-height:92vh;overflow-y:auto}
    .auth-close-row{display:flex;justify-content:flex-end;margin-bottom:10px}
    .faq-grid,.review-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
    .faq-card,.review-card{background:#f8fafc;border:1px solid var(--line);border-radius:18px;padding:16px;line-height:1.55}
    .faq-card strong,.review-card strong{display:block;margin-bottom:7px;color:#111827;font-size:14px}
    .faq-card p,.review-card p{color:var(--muted);font-size:13px;font-weight:700}
    .stars{color:var(--gold);font-weight:950;margin-bottom:7px;display:block}
    @media(max-width:760px){.faq-grid,.review-grid{grid-template-columns:1fr}}


    .quick-trade-row,
    .compact-trade-row {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 12px;
      margin: 0 0 22px;
      align-items: stretch;
    }

    .quick-trade-row .quick-card,
    .compact-trade-card {
      background: white;
      border: 1px solid var(--line);
      border-radius: 20px;
      padding: 14px;
      box-shadow: 0 8px 22px rgba(15, 23, 42, .04);
      min-width: 0;
    }

    .compact-title {
      font-size: 15px;
      font-weight: 950;
      color: #111827;
      margin-bottom: 10px;
    }

    .compact-form-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
    }

    .compact-form-grid label,
    .quick-card label {
      margin-bottom: 0;
      font-size: 11px;
    }

    .compact-form-grid input {
      padding: 8px 9px;
      border-radius: 10px;
      font-size: 12px;
      margin-top: 5px;
    }

    .compact-form-grid .btn {
      padding: 9px 10px;
      border-radius: 11px;
      font-size: 12px;
    }

    .compact-status {
      margin-top: 8px;
      color: #667085;
      font-weight: 800;
      font-size: 11px;
    }

    .compact-table-wrap {
      max-height: 174px;
      overflow: auto;
      border: 1px solid #eef2f7;
      border-radius: 14px;
    }

    .compact-open-trades table {
      font-size: 11px;
      min-width: 0;
    }

    .compact-open-trades th,
    .compact-open-trades td {
      padding: 8px 9px;
      white-space: nowrap;
    }

    .quick-buttons {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 8px;
    }

    .status-tag {
      display: inline-block;
      padding: 6px 9px;
      border-radius: 999px;
      font-size: 11px;
      font-weight: 950;
      border: 1px solid #e5e7eb;
      background: #f8fafc;
    }

    .status-tag.win {
      color: #166534;
      background: #ecfdf5;
      border-color: #bbf7d0;
    }

    .status-tag.loss {
      color: #991b1b;
      background: #fef2f2;
      border-color: #fecaca;
    }

    .status-tag.pending {
      color: #92400e;
      background: #fffbeb;
      border-color: #fde68a;
    }


    #createAccountBtn:disabled {
      background: #cbd5e1;
      color: #64748b;
      cursor: not-allowed;
      transform: none;
      filter: none;
    }

    #createAccountBtn.ready {
      background: var(--green);
      color: white;
      cursor: pointer;
    }



    .admin-only { display: none !important; }
    body.admin-active .admin-only { display: flex !important; }
    .admin-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 18px; }
    .admin-card { background: #f8fafc; border: 1px solid var(--line); border-radius: 18px; padding: 17px; }
    .admin-card span { color: var(--muted); font-size: 12px; font-weight: 950; text-transform: uppercase; }
    .admin-card h2 { margin-top: 8px; font-size: 25px; letter-spacing: -1px; }
    .admin-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; }
    .admin-tabs .btn { padding: 9px 12px; border-radius: 999px; font-size: 12px; }
    .admin-section { display: none; }
    .admin-section.active { display: block; }
    .admin-badge { display: inline-block; padding: 6px 9px; border-radius: 999px; font-size: 11px; font-weight: 950; background: #ecfdf5; color: #166534; border: 1px solid #bbf7d0; }
    .admin-badge.pending { background: #fffbeb; color: #92400e; border-color: #fde68a; }
    .admin-badge.rejected { background: #fef2f2; color: #991b1b; border-color: #fecaca; }
    @media(max-width:1120px){.admin-grid{grid-template-columns:repeat(2,1fr)}}
    @media(max-width:760px){.admin-grid{grid-template-columns:1fr}.admin-tabs{display:grid;grid-template-columns:1fr 1fr}}

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

      .sidebar {
        position: static;
        height: auto;
      }

      .menu {
        grid-template-columns: repeat(3, 1fr);
      }

      .summary-grid {
        grid-template-columns: repeat(2, 1fr);
      }

      .pl-grid {
        grid-template-columns: repeat(2, 1fr);
      }

      .layout-2 {
        grid-template-columns: 1fr;
      }

      .quick-trade-row,
      .compact-trade-row {
        grid-template-columns: 1fr;
      }
    }

    @media(max-width:760px) {
      .auth-card {
        grid-template-columns: 1fr;
      }

      .main {
        padding: 14px;
      }

      .topbar {
        flex-direction: column;
        align-items: flex-start;
      }

      .summary-grid,
      .pl-grid,
      .account-switch,
      .control-grid,
      .quick-trade-row,
      .compact-trade-row,
      .compact-form-grid {
        grid-template-columns: 1fr;
      }

      .menu {
        grid-template-columns: 1fr;
      }

      .panel {
        overflow-x: auto;
      }

      .chart-shell,
      .time-axis {
        min-width: 880px;
      }

      table {
        min-width: 760px;
      }
    }

    /* ===== PROFESSIONAL ADD-ONS ===== */
    .session-ribbon{
      display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;
      background:linear-gradient(90deg,#020817,#06111f,#111827);
      color:#e5e7eb;padding:10px 14px;font-size:13px;font-weight:950;letter-spacing:.2px;
      border-bottom:1px solid rgba(212,175,55,.25);
    }
    .session-ribbon b{color:#fde68a}
    .market-ticker{
      background:white;border:1px solid var(--line);border-radius:22px;padding:12px 14px;
      margin-bottom:22px;box-shadow:0 8px 22px rgba(15,23,42,.04);overflow:hidden;
    }
    .ticker-track{display:flex;gap:12px;animation:tickerMove 34s linear infinite;width:max-content}
    .ticker-item{
      display:flex;align-items:center;gap:8px;min-width:max-content;background:#f8fafc;
      border:1px solid #e5e7eb;border-radius:999px;padding:9px 12px;font-size:12px;font-weight:950;
    }
    .ticker-symbol{color:#111827}.ticker-price{color:var(--blue)}.ticker-up{color:var(--green)}.ticker-down{color:var(--red)}
    @keyframes tickerMove{from{transform:translateX(0)}to{transform:translateX(-50%)}}
    .landing-stats{
      display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:22px;
    }
    .stat-card{
      color:white;border-radius:24px;padding:22px;border:1px solid rgba(212,175,55,.22);
      background:radial-gradient(circle at top right,rgba(212,175,55,.26),transparent 34%),linear-gradient(135deg,#06111f,#111827);
      box-shadow:0 14px 34px rgba(15,23,42,.10);
    }
    .stat-card span{display:block;color:#cbd5e1;font-size:12px;font-weight:950;text-transform:uppercase;letter-spacing:.5px}
    .stat-card h2{font-size:33px;margin:8px 0 4px;letter-spacing:-1px}
    .stat-card small{color:#fde68a;font-weight:900}
    .pro-dashboard-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
    .pro-box{background:#f8fafc;border:1px solid var(--line);border-radius:18px;padding:16px}
    .pro-box span{display:block;color:var(--muted);font-size:12px;font-weight:950;text-transform:uppercase}
    .pro-box strong{display:block;margin-top:8px;font-size:20px;color:#111827}
    .portal-grid,.academy-grid,.calendar-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
    .portal-card,.academy-card,.calendar-card{
      background:#f8fafc;border:1px solid var(--line);border-radius:18px;padding:17px;line-height:1.55;
    }
    .portal-card strong,.academy-card strong,.calendar-card strong{display:block;margin-bottom:7px;color:#111827}
    .portal-card p,.academy-card p,.calendar-card p{color:var(--muted);font-size:13px;font-weight:750;margin-bottom:12px}
    .academy-card button,.portal-card button{width:100%}
    .impact-high{color:#991b1b;background:#fef2f2;border-color:#fecaca}
    .impact-medium{color:#92400e;background:#fffbeb;border-color:#fde68a}
    .impact-low{color:#166534;background:#ecfdf5;border-color:#bbf7d0}
    .impact-pill{display:inline-block;border:1px solid;border-radius:999px;padding:6px 9px;font-size:11px;font-weight:950;margin-top:8px}
    .tv-widget-frame{height:620px;border:1px solid #d9dee8;border-radius:20px;overflow:hidden;background:#0f172a}
    .tv-widget-frame iframe{width:100%;height:100%;border:0}
    .lesson-modal-content{max-height:68vh;overflow:auto;line-height:1.7;color:#344054;font-weight:750}
    .lesson-modal-content h4{color:#111827;margin:12px 0 6px}
    @media(max-width:1120px){
      .landing-stats,.pro-dashboard-grid,.portal-grid,.academy-grid,.calendar-grid{grid-template-columns:repeat(2,1fr)}
    }
    @media(max-width:760px){
      .landing-stats,.pro-dashboard-grid,.portal-grid,.academy-grid,.calendar-grid{grid-template-columns:1fr}
      .tv-widget-frame{height:520px;min-width:880px}
    }


    /* Compact typography: reduce website text by 20%, keep chart size unchanged */
    body:not(.chart-preserve) { font-size: 80%; }
    body *:not(.chart-box):not(.chart-box *):not(.chart-shell):not(.chart-shell *):not(.time-axis):not(.time-axis *):not(.price-axis):not(.price-axis *) {
      font-size: 0.8rem;
    }
    .chart-box, .chart-box *, .chart-shell, .chart-shell *, .time-axis, .time-axis *, .price-axis, .price-axis * {
      font-size: revert;
    }
    /* Keep money/amount figures readable even while normal text stays compact */
    .summary-card h2,
    .pl-card h2,
    .stat-card h2,
    .admin-card h2,
    #balanceValue,
    #equityValue,
    #floatingValue,
    #winRateValue,
    #sessionPL,
    #todayProfit,
    #todayLoss,
    #netResult,
    #dashBalance,
    #dashEquity,
    #dashFreeMargin,
    #dashOpenPositions {
      font-size: 1.45rem !important;
      line-height: 1.15;
    }

    /* Requested: make main amount figures 30% larger */
    #balanceValue,
    #equityValue,
    #floatingValue,
    #winRateValue,
    #sessionPL,
    #todayProfit,
    #todayLoss,
    #netResult {
      font-size: 1.885rem !important;
      line-height: 1.12;
    }

    .stat-card h2 {
      font-size: 1.8rem !important;
    }

    .admin-card h2 {
      font-size: 1.55rem !important;
    }


    /* ===== PROMO, STATEMENTS, SPONSORS & LEGAL FOOTER ===== */
    .promo-hero{
      background:radial-gradient(circle at top right,rgba(212,175,55,.35),transparent 34%),linear-gradient(135deg,#06111f,#0f172a 58%,#111827);
      color:white;border:1px solid rgba(212,175,55,.28);border-radius:26px;padding:22px;margin-bottom:22px;
      box-shadow:0 18px 42px rgba(15,23,42,.14);display:flex;align-items:center;justify-content:space-between;gap:18px;overflow:hidden;position:relative;
    }
    .promo-hero:after{content:'30%';position:absolute;right:22px;bottom:-22px;font-size:90px;font-weight:950;color:rgba(255,255,255,.06);letter-spacing:-4px;pointer-events:none}
    .promo-badge{display:inline-flex;align-items:center;gap:7px;background:rgba(212,175,55,.16);border:1px solid rgba(212,175,55,.36);color:#fde68a;border-radius:999px;padding:8px 12px;font-size:12px;font-weight:950;margin-bottom:10px}
    .promo-hero h2{font-size:25px;letter-spacing:-.7px;margin-bottom:7px}.promo-hero p{color:#cbd5e1;font-weight:800;line-height:1.55}.promo-actions{display:flex;gap:10px;flex-wrap:wrap;z-index:2}
    .statements-page{background:transparent;border:0;box-shadow:none;padding:0}.statement-head{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;margin-bottom:18px}.statement-head h2{font-size:25px;margin-bottom:5px}.statement-head p{color:var(--muted);font-weight:750}.statement-controls{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.statement-tabs{display:flex;gap:22px;border-bottom:1px solid var(--line);margin-bottom:22px}.statement-tabs button{border:0;background:transparent;padding:13px 3px;font-weight:950;color:#344054;position:relative}.statement-tabs button.active{color:var(--blue)}.statement-tabs button.active:after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:3px;background:var(--blue);border-radius:999px}.statement-card-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:22px}.statement-metric{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px;text-align:center;box-shadow:0 8px 22px rgba(15,23,42,.04)}.statement-metric span{color:#344054;font-weight:950;font-size:12px}.statement-metric h3{font-size:24px;margin:11px 0 5px;letter-spacing:-.7px}.statement-metric small{color:var(--muted);font-weight:850}.statement-chart{height:300px;background:white;border:1px solid var(--line);border-radius:20px;padding:18px;position:relative;overflow:hidden;margin-bottom:18px}.statement-chart svg{width:100%;height:100%}.statement-summary{background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px;margin-bottom:18px}.summary-line{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:11px 0;border-bottom:1px solid #f1f5f9;font-weight:850}.summary-line:last-child{border-bottom:0}.summary-left{display:flex;align-items:center;gap:12px}.summary-icon{width:31px;height:31px;border-radius:10px;display:grid;place-items:center;background:#eff6ff}.statement-tab-panel{display:none}.statement-tab-panel.active{display:block}.tag{display:inline-block;padding:6px 10px;border-radius:999px;font-size:11px;font-weight:950}.tag.deposit{background:#dbeafe;color:#1d4ed8}.tag.trade{background:#dcfce7;color:#166534}.tag.loss{background:#fee2e2;color:#991b1b}.tag.commission{background:#ffedd5;color:#9a3412}.sponsor-footer{margin-top:26px;background:white;border-top:1px solid var(--line);padding:26px 18px;text-align:center}.sponsor-footer h3{margin-bottom:18px;font-size:18px}.sponsor-row{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;align-items:center;margin-bottom:22px}.sponsor-logo{background:#fff;border:1px solid #eef2f7;border-radius:18px;padding:18px 10px;font-weight:950;font-size:20px;color:#111827;box-shadow:0 8px 18px rgba(15,23,42,.035)}.sponsor-logo.emirates{color:#b91c1c}.sponsor-logo.microsoft{color:#64748b}.sponsor-logo.fed{font-size:14px;color:#344054}.legal-links{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:18px;color:#667085;font-weight:850}.legal-links button{border:0;background:transparent;color:#1d4ed8;font-weight:950}.modal-list{line-height:1.7;color:#344054;font-weight:750}.modal-list p{margin-bottom:10px}.modal-list strong{color:#111827}.wide-table{overflow:auto}.wide-table table{min-width:860px}
    @media(max-width:1120px){.statement-card-grid,.sponsor-row{grid-template-columns:repeat(2,1fr)}.promo-hero{align-items:flex-start;flex-direction:column}}
    @media(max-width:760px){.statement-card-grid,.sponsor-row{grid-template-columns:1fr}.statement-head{align-items:flex-start;flex-direction:column}.statement-tabs{gap:10px;overflow-x:auto}.statement-tabs button{white-space:nowrap}.promo-hero h2{font-size:20px}}


    /* ===== FCM LOGO + POLISHED CLIENT UI UPDATES ===== */
    .brand-logo,
    .brand-logo.logo-img-box,
    .top-logo.logo-img-box,
    .logo-img-box{
      background: transparent !important;
      border: 0 !important;
      box-shadow: none !important;
      padding: 0 !important;
      overflow: visible !important;
    }

    .logo-img-box img{
      width: 100%;
      height: 100%;
      object-fit: contain !important;
      display: block;
      background: transparent !important;
      border: 0 !important;
      box-shadow: none !important;
      border-radius: 0 !important;
    }

    .brand-logo.logo-img-box{width:132px;height:132px;border-radius:0!important}
    .top-logo.logo-img-box{width:64px;height:64px;border-radius:0!important}
    .sponsor-logo{min-height:74px;display:flex;align-items:center;justify-content:center;gap:8px}
    .sponsor-logo.uber{font-size:25px;letter-spacing:-1px}
    .sponsor-logo.sony{font-size:25px;letter-spacing:2px;font-family:Georgia,serif}
    .sponsor-logo.emirates{font-size:19px}
    .sponsor-logo.microsoft:before{content:'■';color:#f25022;text-shadow:16px 0 #7fba00,0 16px #00a4ef,16px 16px #ffb900;font-size:15px;margin-right:23px;line-height:0}
    .sponsor-logo.fed{font-size:13px;text-transform:uppercase;letter-spacing:.6px}
    .client-response{background:#eff6ff;border:1px solid #bfdbfe;color:#1e3a8a;border-radius:16px;padding:14px;line-height:1.65;font-weight:850;margin-top:12px}
    .admin-refresh-note{background:#f8fafc;border:1px dashed #cbd5e1;border-radius:16px;padding:12px;margin-bottom:14px;color:#475467;font-weight:850;line-height:1.55}


    /* ===== TRADINGVIEW-STYLE LIGHTWEIGHT CHART ===== */
    .chart-shell.tv-pro-chart-shell {
      display: block;
      border: 1px solid #172033;
      background: #0b1220;
      border-radius: 20px 20px 0 0;
      overflow: hidden;
      box-shadow: 0 18px 42px rgba(15, 23, 42, .18);
    }
    .tv-chart-wrap {
      height: 600px;
      width: 100%;
      position: relative;
      background: #0b1220;
    }
    #tvLightweightChart {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
    }
    .tv-symbol-badge {
      position: absolute;
      top: 14px;
      left: 14px;
      z-index: 6;
      background: rgba(2, 8, 23, .82);
      color: #e5e7eb;
      border: 1px solid rgba(148, 163, 184, .28);
      border-radius: 12px;
      padding: 9px 11px;
      font-size: 12px;
      font-weight: 950;
      box-shadow: 0 10px 24px rgba(0,0,0,.24);
      backdrop-filter: blur(8px);
    }
    .tv-status-badge {
      position: absolute;
      right: 14px;
      top: 14px;
      z-index: 6;
      background: rgba(22, 163, 74, .16);
      color: #bbf7d0;
      border: 1px solid rgba(34, 197, 94, .28);
      border-radius: 999px;
      padding: 8px 11px;
      font-size: 12px;
      font-weight: 950;
      backdrop-filter: blur(8px);
    }
    .tv-watermark {
      position: absolute;
      inset: 0;
      display: grid;
      place-items: center;
      z-index: 1;
      pointer-events: none;
      font-size: clamp(44px, 8vw, 96px);
      font-weight: 950;
      color: rgba(255,255,255,.045);
      letter-spacing: -2px;
      white-space: nowrap;
    }
    @media(max-width:760px){
      .tv-pro-chart-shell,.time-axis{min-width:880px}
      .tv-chart-wrap{height:540px}
    }


    /* ===== FCM CHART FULLSCREEN + PRO CONTROLS ===== */
    .chart-fullscreen-btn{padding:9px 12px!important;border-radius:10px!important;font-size:12px!important;white-space:nowrap}
    .tv-chart-wrap.fullscreen-chart{
      position:fixed!important;
      inset:10px!important;
      width:calc(100vw - 20px)!important;
      height:calc(100vh - 20px)!important;
      z-index:999999!important;
      border:1px solid rgba(212,175,55,.35)!important;
      border-radius:18px!important;
      box-shadow:0 30px 90px rgba(0,0,0,.65)!important;
      background:#0b1220!important;
    }
    body.chart-fullscreen-active{overflow:hidden!important}
    body.chart-fullscreen-active .tv-chart-wrap.fullscreen-chart:after{
      content:'Press Full Screen again or ESC to close';
      position:absolute;left:14px;bottom:12px;z-index:10;
      color:#94a3b8;background:rgba(2,8,23,.72);border:1px solid rgba(148,163,184,.20);
      border-radius:999px;padding:7px 10px;font-size:11px;font-weight:900;pointer-events:none;
    }

    /* =========================
   MOBILE TOPBAR
========================= */

.mobile-topbar{
    display:none;
    position:fixed;
    top:0;
    left:0;
    right:0;
    height:60px;
    background:#0f172a;
    color:#fff;
    z-index:9999;
    padding:0 15px;
    align-items:center;
    justify-content:space-between;
    box-shadow:0 2px 15px rgba(0,0,0,.25);
}

.mobile-topbar .topbar-left{
    display:flex;
    align-items:center;
    gap:10px;
}

.mobile-topbar img{
    width:34px;
    height:34px;
    object-fit:contain;
}

.mobile-topbar span{
    font-size:14px;
    font-weight:700;
}

#menuToggle{
    border:none;
    background:none;
    color:white;
    font-size:28px;
    cursor:pointer;
}

/* =========================
   MOBILE MENU
========================= */

.mobile-menu{
    position:fixed;
    top:0;
    right:-320px;
    width:300px;
    height:100vh;
    background:#111827;
    z-index:10000;
    overflow-y:auto;
    transition:.3s ease;
    padding-top:70px;
    box-shadow:-5px 0 25px rgba(0,0,0,.35);
}

.mobile-menu.active{
    right:0;
}

.mobile-menu a{
    display:block;
    padding:15px 22px;
    color:white;
    text-decoration:none;
    border-bottom:1px solid rgba(255,255,255,.08);
    font-weight:600;
    transition:.2s;
}

.mobile-menu a:hover{
    background:#1f2937;
}

.menu-overlay{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.45);
    opacity:0;
    visibility:hidden;
    z-index:9998;
    transition:.3s;
}

.menu-overlay.active{
    opacity:1;
    visibility:visible;
}

/* =========================
   MOBILE MODE
========================= */

@media (max-width: 768px){

    .sidebar{
        display:none !important;
    }

    .mobile-topbar{
        display:flex;
    }

    .main{
        width:100%;
        margin-left:0;
        padding-top:75px;
    }

    .topbar{
        display:none;
    }

    .dashboard{
        display:block;
    }

    .summary-grid,
    .landing-stats,
    .pl-grid,
    .portal-grid,
    .academy-grid,
    .review-grid,
    .statement-card-grid{
        grid-template-columns:1fr !important;
    }

    .compact-trade-row{
        flex-direction:column;
    }

    .chart-toolbar-row{
        flex-direction:column;
        align-items:stretch;
    }

    .chart-toolbar-row select,
    .chart-toolbar-row button{
        width:100%;
    }

    table{
        font-size:12px;
    }

   /* =========================
   BOTTOM NAVIGATION
========================= */

.bottom-nav{
    position:fixed;
    bottom:0;
    left:0;
    width:100%;
    height:65px;
    background:#ffffff;
    border-top:1px solid #e5e7eb;
    display:none;
    justify-content:space-around;
    align-items:center;
    z-index:9999;
    box-shadow:0 -3px 15px rgba(0,0,0,.08);
}

.bottom-nav-item{
    border:none;
    background:none;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:3px;
    color:#6b7280;
    font-size:11px;
    font-weight:700;
}

.bottom-nav-item span{
    font-size:20px;
}

.bottom-nav-item.active{
    color:#2962ff;
}

@media (max-width:768px){

    .bottom-nav{
        display:flex;
    }

    .main{
        padding-bottom:85px;
    }

}

}

/* =========================
   BOTTOM NAVIGATION
========================= */

.bottom-nav{
    position:fixed;
    bottom:0;
    left:0;
    width:100%;
    height:65px;
    background:#ffffff;
    border-top:1px solid #e5e7eb;
    display:none;
    justify-content:space-around;
    align-items:center;
    z-index:9999;
    box-shadow:0 -3px 15px rgba(0,0,0,.08);
}

.bottom-nav-item{
    border:none;
    background:none;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:3px;
    color:#6b7280;
    font-size:11px;
    font-weight:700;
}

.bottom-nav-item span{
    font-size:20px;
}

.bottom-nav-item.active{
    color:#2962ff;
}

@media (max-width:768px){

    .bottom-nav{
        display:flex;
    }

    .main{
        padding-bottom:85px;
    }
   
/* =========================
   MOBILE LANDING PAGE V2
========================= */

@media (max-width:768px){

    .summary-grid,
    .landing-stats{
        display:flex !important;
        overflow-x:auto;
        gap:12px;
        padding-bottom:10px;
        scroll-snap-type:x mandatory;
    }

    .summary-card,
    .stat-card{
        min-width:250px;
        scroll-snap-align:start;
    }

    .tv-chart-wrap{
        height:320px !important;
    }

    .pro-dashboard-grid{
        display:none !important;
    }
   
}
   
   /* Mobile fit */
html,
body{
    width:100%;
    max-width:100%;
    overflow-x:hidden;
}

*{
    box-sizing:border-box;
}

img,
video,
iframe{
    max-width:100%;
    height:auto;
}

@media (max-width:768px){

    .container,
    .dashboard-container,
    .main-content,
    .content-wrapper{
        width:100% !important;
        max-width:100% !important;
        padding-left:12px !important;
        padding-right:12px !important;
    }

    .summary-grid,
    .pro-dashboard-grid,
    .pl-grid{
        grid-template-columns:1fr !important;
    }

    table{
        display:block;
        overflow-x:auto;
        white-space:nowrap;
    }

    .chart-container,
    #tvLightweightChart{
        width:100% !important;
        max-width:100% !important;
    }
}
   @media (max-width: 768px) {
    body {
        min-width: 1280px;
        overflow-x: auto;
    }
}