/* Escopo: não resetar margin/padding global (quebraria Bootstrap e a landing). */
.dash-scope-isolated,
.dash-scope-isolated *,
.dash-scope-isolated *::before,
.dash-scope-isolated *::after {
  box-sizing: border-box;
}

    :root {
      --sidebar-w: 260px;
      --gold: #d4af37;
      --gold-light: #f2d57a;
      --navy: #1f395c;
      --navy-dark: #10213d;
      --green: #2bb6a8;
      --red: #ef4444;
      --muted: #9fb0cc;
      --card-bg: rgba(31, 57, 92, 0.84);
      --card-border: rgba(212, 175, 55, 0.18);
      --radius: 16px;
      --trans: 0.25s ease;
    }

    .dash-scope-isolated {
      font-family: 'Inter', sans-serif;
      background: var(--navy-dark);
      color: #f5f7fb;
      min-height: 100vh;
      overflow-x: hidden;
      width: 100%;
      position: relative;
      isolation: isolate;
    }

    .gold-text {
      background: linear-gradient(135deg, #d4af37 0%, #f2d57a 50%, #c8922e 100%);
      -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
    }

    /* Scrollbar (só dentro do painel) */
    .dash-scope-isolated ::-webkit-scrollbar { width: 4px; height: 4px; }
    .dash-scope-isolated ::-webkit-scrollbar-track { background: rgba(16,33,61,.4); }
    .dash-scope-isolated ::-webkit-scrollbar-thumb { background: var(--gold); border-radius: 99px; }

    /* �"?�"?�"? SIDEBAR (desktop only) �"?�"?�"? */
    .dash-sidebar {
      position: fixed; top: 0; left: 0; bottom: 0;
      width: var(--sidebar-w);
      background: rgba(16,33,61,0.96);
      border-right: 1px solid rgba(212,175,55,.18);
      backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
      display: flex; flex-direction: column; z-index: 100;
    }
    .sb-logo { padding: 22px 20px 18px; border-bottom: 1px solid rgba(212,175,55,.1); }
    .sb-logo img { height: 56px; width: auto; max-width: 100%; object-fit: contain; display: block; }
    .sb-user { padding: 14px 20px; border-bottom: 1px solid rgba(212,175,55,.1); display: flex; align-items: center; gap: 12px; }
    .sb-avatar {
      width: 38px; height: 38px; border-radius: 50%; flex-shrink: 0;
      background: linear-gradient(135deg, var(--gold), var(--gold-light));
      display: flex; align-items: center; justify-content: center;
      font-family: 'Cinzel', serif; font-weight: 700; font-size: 15px;
      color: var(--navy-dark); border: 2px solid rgba(212,175,55,.3);
    }
    .sb-user-name { font-size: 13px; font-weight: 600; }
    .sb-user-role { font-size: 11px; color: var(--muted); margin-top: 1px; }
    .sb-nav { flex: 1; padding: 14px 10px; overflow-y: auto; }
    .sb-section { margin-bottom: 18px; }
    .sb-section-label { font-size: 10px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); padding: 0 10px 8px; }
    .sb-link {
      display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 10px;
      color: var(--muted); text-decoration: none; font-size: 13px; font-weight: 500;
      transition: all var(--trans); border: 1px solid transparent; margin-bottom: 2px;
    }
    .sb-link:hover { background: rgba(43,182,168,.1); color: #f5f7fb; border-color: rgba(43,182,168,.12); }
    .sb-link.active { background: rgba(212,175,55,.12); color: var(--gold-light); border-color: rgba(242,213,122,.24); }
    .sb-dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: .4; flex-shrink: 0; }
    .sb-link.active .sb-dot { opacity: 1; }
    .sb-logout-wrap { padding: 14px 10px; border-top: 1px solid rgba(212,175,55,.1); }
    .sb-logout {
      display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 10px;
      color: var(--muted); font-size: 13px; cursor: pointer; transition: all var(--trans);
    }
    .sb-logout:hover { background: rgba(239,68,68,.1); color: #ef4444; }

    /* �"?�"?�"? LAYOUT �"?�"?�"? */
    .dash-wrapper { display: block; min-height: 100vh; }
    .dash-main { margin-left: var(--sidebar-w); display: flex; flex-direction: column; min-height: 100vh; }

    /* �"?�"?�"? TOPBAR (desktop) �"?�"?�"? */
    .dash-topbar {
      display: block;
      padding: 16px 28px; background: rgba(16,33,61,.84);
      border-bottom: 1px solid rgba(212,175,55,.16);
      backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
      position: sticky; top: 0; z-index: 50;
    }
    .topbar-row-a {
      display: grid;
      grid-template-columns: minmax(220px, 1fr) auto minmax(220px, 1fr);
      align-items: center;
      gap: 20px;
      width: 100%;
    }
    .topbar-row-a > :first-child { justify-self: start; }
    .topbar-portfolio-center { justify-self: center; }
    .topbar-right {
      display: flex;
      align-items: center;
      justify-self: end;
      gap: 12px;
    }
    .topbar-title { font-family: 'Cinzel', serif; font-size: 18px; font-weight: 700; letter-spacing: .04em; }
    .topbar-subtitle { font-size: 12px; color: var(--muted); margin-top: 2px; }
    .portfolio-total {
      font-family: 'Orbitron', sans-serif; font-size: 26px; font-weight: 900;
      background: linear-gradient(135deg, #f2d57a 0%, #d4af37 60%);
      -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
      line-height: 1;
    }
    .portfolio-lbl { font-size: 11px; color: var(--muted); margin-top: 3px; text-transform: uppercase; letter-spacing: .06em; }
    .portfolio-chg { font-size: 13px; font-weight: 700; color: var(--green); margin-top: 3px; }

    .live-badge { display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 700; color: var(--green); text-transform: uppercase; letter-spacing: .08em; }
    .live-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--green); animation: livePulse 1.2s ease-in-out infinite; }
    @keyframes livePulse { 0%,100% { opacity:1; transform:scale(1); } 50% { opacity:.4; transform:scale(.7); } }

    .lang-btn {
      display: flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 20px;
      background: rgba(26,47,77,.64); border: 1px solid rgba(212,175,55,.18);
      color: #f5f7fb; font-size: 13px; font-weight: 600; cursor: pointer; transition: all var(--trans);
    }
    .lang-btn:hover { border-color: var(--gold); color: var(--gold); }

    /* �"?�"?�"? HAMBURGER (mobile only) �"?�"?�"? */
    .hamburger {
      display: none; flex-direction: column; gap: 5px; cursor: pointer;
      padding: 9px; border-radius: 10px;
      background: rgba(26,47,77,.62); border: 1px solid rgba(212,175,55,.18);
      transition: all var(--trans);
    }
    .hamburger:hover { background: rgba(43,182,168,.12); border-color: rgba(43,182,168,.24); }
    .hamburger span { display: block; width: 20px; height: 2px; background: var(--gold); border-radius: 2px; }

    /* �"?�"?�"? CONTENT �"?�"?�"? */
    .dash-content { padding: 22px 26px 40px; flex: 1; }

    /* �"?�"?�"? CARDS �"?�"?�"? */
    .g-card {
      background: var(--card-bg);
      border: 1px solid var(--card-border);
      border-radius: var(--radius);
      backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
      padding: 20px 22px;
      transition: border-color var(--trans);
    }
    .g-card:hover { border-color: rgba(242,213,122,.28); box-shadow: 0 18px 36px rgba(0,0,0,.22); }

    .card-hdr { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 14px; flex-wrap: wrap; }
    .card-title { font-family: 'Cinzel', serif; font-size: 14px; font-weight: 700; }
    .card-sub { font-family: 'Inter'; font-size: 12px; color: var(--muted); font-weight: 400; margin-top: 3px; }

    /* Overview 4-col */
    .overview-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; margin-bottom: 20px; }
    .ov-card {
      background: var(--card-bg); border: 1px solid var(--card-border);
      border-radius: var(--radius); backdrop-filter: blur(12px);
      padding: 18px 16px; position: relative; overflow: hidden;
      transition: all var(--trans);
    }
    .ov-card:hover { border-color: rgba(242,213,122,.32); box-shadow: 0 10px 28px rgba(0,0,0,.2); }
    .ov-card::before {
      content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px;
      background: var(--ov-accent, var(--gold)); border-radius: var(--radius) var(--radius) 0 0;
    }
    .ov-lbl { font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); margin-bottom: 8px; }
    .ov-val { font-family: 'Orbitron', sans-serif; font-size: 20px; font-weight: 700; margin-bottom: 6px; line-height: 1.1; }
    .ov-trend { font-size: 11px; font-weight: 700; display: flex; align-items: center; gap: 4px; }
    .ov-trend.up { color: var(--green); }
    .ov-trend.down { color: var(--red); }
    .ov-trend.muted { color: var(--muted); }

    /* Mid 2-col */
    .mid-grid { display: grid; grid-template-columns: 1fr 340px; gap: 18px; margin-bottom: 20px; }

    /* Chart controls row */
    .chart-controls {
      display: flex; align-items: center; justify-content: space-between;
      gap: 10px; margin-bottom: 14px;
      overflow-x: auto; padding-bottom: 2px;
    }
    .chart-controls::-webkit-scrollbar { display: none; }
    .asset-tabs { display: flex; gap: 6px; flex-shrink: 0; }
    .asset-tab {
      padding: 6px 14px; border-radius: 8px;
      border: 1px solid rgba(212,175,55,.2);
      background: rgba(255,255,255,.02); color: var(--muted);
      font-size: 13px; font-weight: 600; cursor: pointer;
      transition: all var(--trans); white-space: nowrap;
    }
    .asset-tab:hover { border-color: var(--gold); color: #fff; }
    .asset-tab.active { background: var(--gold); border-color: var(--gold); color: var(--navy-dark); font-weight: 700; box-shadow: 0 0 14px rgba(212,175,55,.28); }

    .period-btns { display: flex; gap: 4px; flex-shrink: 0; }
    .period-btn {
      padding: 5px 10px; border-radius: 6px;
      border: 1px solid rgba(212,175,55,.2);
      background: rgba(255,255,255,.02); color: var(--muted);
      font-size: 11px; font-weight: 600; cursor: pointer; transition: all var(--trans);
    }
    .period-btn.active { background: rgba(212,175,55,.15); border-color: var(--gold); color: var(--gold); }

    .chart-wrap { position: relative; height: 250px; }
    .chart-wrap canvas { width: 100% !important; height: 100% !important; }

    /* Transaction list */
    .tx-list { display: flex; flex-direction: column; gap: 8px; }
    .tx-item {
      display: flex; align-items: center; justify-content: space-between;
      padding: 11px 14px; background: rgba(26,47,77,.56);
      border-radius: 10px; border: 1px solid rgba(255,255,255,.04);
      transition: border-color var(--trans);
    }
    .tx-item:hover { border-color: rgba(212,175,55,.18); }
    .tx-name { font-size: 13px; font-weight: 600; }
    .tx-meta { font-size: 11px; color: var(--muted); margin-top: 2px; }
    .tx-amount { font-family: 'Orbitron', sans-serif; font-size: 12px; font-weight: 700; text-align: right; }
    .tx-amount.buy { color: var(--green); }
    .tx-amount.sell { color: var(--red); }
    .tx-badge {
      display: inline-block; padding: 2px 7px; border-radius: 20px;
      font-size: 10px; font-weight: 700; letter-spacing: .05em;
      text-transform: uppercase; margin-top: 3px;
    }
    .tx-badge.buy { background: rgba(34,197,94,.15); color: var(--green); }
    .tx-badge.sell { background: rgba(239,68,68,.15); color: var(--red); }
    .tx-badge.pending { background: rgba(245,158,11,.15); color: #f59e0b; }

    /* Crypto table */
    .crypto-table-wrap { overflow-x: auto; margin-top: 4px; }
    .crypto-table { width: 100%; border-collapse: separate; border-spacing: 0 5px; }
    .crypto-table thead th { font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); padding: 0 12px 8px; text-align: left; white-space: nowrap; }
    .crypto-table thead th:last-child { text-align: right; }
    .crypto-table tbody tr { background: rgba(26,47,77,.56); transition: background var(--trans); cursor: pointer; }
    .crypto-table tbody tr:hover { background: rgba(212,175,55,.06); }
    .crypto-table tbody td { padding: 11px 12px; font-size: 13px; font-weight: 500; white-space: nowrap; vertical-align: middle; }
    .crypto-table tbody td:first-child { border-radius: 10px 0 0 10px; }
    .crypto-table tbody td:last-child { border-radius: 0 10px 10px 0; text-align: right; }
    .ct-name { font-weight: 700; }
    .ct-sym { font-size: 10px; color: var(--muted); margin-top: 1px; }
    .ct-price { font-family: 'Orbitron', sans-serif; font-size: 12px; }
    .badge-chg {
      display: inline-flex; align-items: center; padding: 2px 8px;
      border-radius: 6px; font-size: 11px; font-weight: 700;
    }
    .badge-chg.up { background: rgba(34,197,94,.15); color: var(--green); }
    .badge-chg.down { background: rgba(239,68,68,.15); color: var(--red); }
    .btn-mini { padding: 5px 10px; border-radius: 8px; background: linear-gradient(135deg,var(--gold),var(--gold-light),#c8922e); color: var(--navy-dark); font-size: 11px; font-weight: 700; border: none; cursor: pointer; transition: all var(--trans); }
    .btn-mini:hover { box-shadow: 0 8px 18px rgba(212,175,55,.28); transform: translateY(-1px); }

    /* Price flash */
    @keyframes flashGreen { 0% { color: var(--green); } 100% { color: inherit; } }
    @keyframes flashRed { 0% { color: var(--red); } 100% { color: inherit; } }
    .flash-up { animation: flashGreen .7s ease-out forwards; }
    .flash-down { animation: flashRed .7s ease-out forwards; }

    /* Fade-in */
    @keyframes fadeInUp { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:translateY(0); } }
    .anim { animation: fadeInUp .5s ease both; }

    /* �"?�"?�"? MOBILE DRAWER �"?�"?�"? */
    .mob-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.75); backdrop-filter: blur(4px); z-index: 200; }
    .mob-overlay.open { display: block; }
    .mob-drawer {
      position: fixed; top: 0; left: 0; bottom: 0; width: 280px;
      background: rgba(11,20,36,.98);
      border-right: 1px solid rgba(212,175,55,.18);
      backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
      z-index: 300; overflow-y: auto;
      transform: translateX(-100%);
      transition: transform 0.3s cubic-bezier(.4,0,.2,1);
      display: flex; flex-direction: column;
    }
    .mob-drawer.open { transform: translateX(0); }
    .mob-drw-hdr { display: flex; align-items: center; justify-content: space-between; padding: 18px 18px 14px; border-bottom: 1px solid rgba(212,175,55,.1); }
    .mob-drw-hdr img { height: 48px; width: auto; max-width: min(220px, 70vw); object-fit: contain; }
    .mob-close { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); color: #fff; width: 34px; height: 34px; border-radius: 8px; font-size: 20px; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all var(--trans); }
    .mob-close:hover { background: rgba(212,175,55,.15); border-color: var(--gold); color: var(--gold); }
    .mob-drw-user { display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-bottom: 1px solid rgba(212,175,55,.1); }
    .mob-drw-nav { padding: 10px; flex: 1; }
    .mob-section-lbl { font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #64748b; padding: 0 10px 8px; margin-top: 12px; display: block; }
    .mob-link {
      display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 10px;
      color: var(--muted); text-decoration: none; font-size: 13px; font-weight: 500;
      transition: all var(--trans); margin-bottom: 2px; border: 1px solid transparent;
    }
    .mob-link:hover { background: rgba(212,175,55,.08); color: #fff; }
    .mob-link.active { background: rgba(212,175,55,.14); color: var(--gold); }
    .mob-dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: .4; flex-shrink: 0; }
    .mob-link.active .mob-dot { opacity: 1; }
    .mob-drw-footer { padding: 14px; border-top: 1px solid rgba(212,175,55,.1); }
    .mob-logout-btn { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 10px; color: var(--muted); font-size: 13px; cursor: pointer; transition: all var(--trans); }
    .mob-logout-btn:hover { background: rgba(239,68,68,.1); color: #ef4444; }

    /* �"?�"?�"? FOOTER �"?�"?�"? */
    .dash-footer { background: rgba(22,48,85,.78); border-top: 1px solid rgba(212,175,55,.16); padding: 48px 0 36px; }
    .footer-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 40px; max-width: 1100px; margin: 0 auto; padding: 0 28px 36px; }
    .footer-bottom { max-width: 1100px; margin: 0 auto; padding: 18px 28px 0; border-top: 1px solid rgba(212,175,55,.1); display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px; font-size: 13px; color: var(--muted); }
    .footer-links a { color: var(--muted); text-decoration: none; margin-left: 20px; transition: color var(--trans); }
    .footer-links a:hover { color: var(--gold); }
    .footer-lang-wrap { max-width: 1100px; margin: 0 auto; padding: 24px 28px 0; text-align: center; }
    .footer-lang-btns { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-top: 10px; }
    .footer-lang-btn { background: rgba(255,255,255,.05); border: 1px solid rgba(183,194,217,.12); color: #f5f7fb; padding: 7px 14px; border-radius: 8px; font-size: 13px; cursor: pointer; transition: all var(--trans); }
    .footer-lang-btn:hover { background: rgba(212,175,55,.15); border-color: var(--gold); color: var(--gold); }
    .footer-lang-btn.active { background: rgba(212,175,55,.15); border-color: var(--gold); color: var(--gold); }
    .dash-footer h4 { font-family: 'Cinzel', serif; font-size: 15px; font-weight: 700; color: var(--gold); margin-bottom: 18px; }
    .dash-footer ul { list-style: none; margin: 0; padding: 0; }
    .dash-footer ul li { margin-bottom: 10px; }
    .dash-footer ul li a { color: var(--muted); text-decoration: none; font-size: 13px; transition: color var(--trans); }
    .dash-footer ul li a:hover { color: var(--gold); }

    /* Language Modal */
    .lang-modal { display: none; position: fixed; inset: 0; z-index: 10000; align-items: center; justify-content: center; }
    .lang-modal.active { display: flex; }
    .lang-modal-overlay { position: absolute; inset: 0; background: rgba(0,0,0,.85); backdrop-filter: blur(8px); }
    .lang-modal-box { position: relative; background: #163055; border: 1px solid rgba(212,175,55,.22); border-radius: 2rem; width: 90%; max-width: 780px; max-height: 80vh; overflow-y: auto; padding: 2rem; box-shadow: 0 24px 60px rgba(0,0,0,.38); }
    .lang-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(140px,1fr)); gap: .75rem; margin-top: 1.5rem; }
    .lang-item { background: rgba(255,255,255,.05); border: 1px solid rgba(183,194,217,.12); color: #f5f7fb; padding: .65rem 1rem; border-radius: .75rem; text-align: left; transition: all .2s; font-size: .85rem; cursor: pointer; }
    .lang-item:hover { background: rgba(212,175,55,.15); border-color: var(--gold); color: var(--gold); }
    .lang-item.active { background: rgba(212,175,55,.15); border-color: var(--gold); color: var(--gold); }
    .lang-search { width: 100%; background: rgba(11,24,48,.82); border: 1px solid rgba(212,175,55,.18); border-radius: 1rem; padding: .85rem 1rem; color: #f5f7fb; margin-bottom: 1.5rem; outline: none; }

    /* �"?�"?�"? RESPONSIVE �"?�"?�"? */
    @media (max-width: 1200px) { .overview-grid { grid-template-columns: repeat(2,1fr); } }
    @media (max-width: 1100px) { .mid-grid { grid-template-columns: 1fr; } }
    @media (max-width: 600px) { .overview-grid { grid-template-columns: 1fr 1fr; } }

    @media (max-width: 900px) {
      .dash-wrapper { display: flex; }
      /* Hide desktop sidebar */
      .dash-sidebar { display: none; }
      .dash-main { margin-left: 0; flex: 1; min-width: 0; }
      .hamburger { display: flex; }

      /* Mobile topbar: 2 rows */
      .dash-topbar {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        padding: 0;
        gap: 0;
      }
      .topbar-row-a {
        display: flex; align-items: center; justify-content: space-between;
        padding: 12px 16px;
        border-bottom: 1px solid rgba(212,175,55,.07);
      }
      .topbar-row-b {
        display: flex; align-items: center; justify-content: space-between;
        padding: 10px 16px 12px; gap: 12px;
        background: rgba(212,175,55,.04);
      }
      .portfolio-total { font-size: 20px; }
      .portfolio-lbl { font-size: 10px; }
      .portfolio-chg { font-size: 12px; }
      .topbar-right { gap: 8px; }
      .dash-content { padding: 12px 12px 28px; }
      .overview-grid { gap: 10px; margin-bottom: 14px; }
      .ov-val { font-size: 17px; }
      .ov-card { padding: 14px; }
      .mid-grid { gap: 12px; margin-bottom: 14px; }
      .g-card { padding: 14px; }
      .chart-wrap { height: 200px; }
      .footer-grid { grid-template-columns: 1fr; gap: 28px; }
    }

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