
      body{
        max-width:none;
        margin:0;
        padding:0;
        background:
          radial-gradient(circle at top left, rgba(19,214,255,.16), transparent 34%),
          radial-gradient(circle at 80% 15%, rgba(124,92,255,.18), transparent 28%),
          linear-gradient(135deg, #071018 0%, #0b1220 52%, #090d17 100%);
        color:#e8eefc;
        font-family:Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      }

      a{color:#13d6ff}
      .agentShell{min-height:100vh;display:grid;grid-template-columns:280px 1fr}
      .sidebar{
        position:sticky;
        top:0;
        height:100vh;
        box-sizing:border-box;
        padding:22px;
        background:rgba(7,16,24,.78);
        border-right:1px solid rgba(255,255,255,.08);
        backdrop-filter:blur(18px);
      }
      .brand{display:flex;align-items:center;gap:12px;margin-bottom:28px}
      .brand svg{width:46px;height:46px;flex:0 0 auto}
      .brand b{display:block;font-size:17px;letter-spacing:-.02em}
      .brand span{display:block;color:#8ea0bd;font-size:12px;margin-top:2px}

      .nav{display:grid;gap:8px}
      .nav a{
        display:flex;
        align-items:center;
        gap:10px;
        color:#cdd8ee;
        text-decoration:none;
        padding:11px 12px;
        border-radius:14px;
        background:transparent;
        border:1px solid transparent;
        font-weight:700;
      }
      .nav a:hover{
        background:rgba(255,255,255,.06);
        border-color:rgba(255,255,255,.09);
      }
      .nav svg{
  width:20px;
  height:20px;
  min-width:20px;
  flex:0 0 20px;
  display:block;
  fill:#13d6ff;
}

.navLabel{
  display:inline;
  white-space:nowrap;
}

      .agentMain{padding:28px;max-width:1280px;width:100%;box-sizing:border-box}
      .hero{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:16px;
        margin-bottom:18px;
      }
      .hero h1{font-size:28px;margin:0;letter-spacing:-.04em}
      .hero p{margin:6px 0 0;color:#8ea0bd}

      .panelSection{
        display:none;
        margin:18px 0 28px;
      }

      .panelSection.activeSection{
        display:block;
      }

      .nav a.activeNav{
        background:linear-gradient(135deg, rgba(19,214,255,.18), rgba(25,242,138,.10));
        border-color:rgba(19,214,255,.35);
        color:#ffffff;
        box-shadow:0 10px 30px rgba(19,214,255,.08);
      }

      .nav a.activeNav svg{
        fill:#19f28a;
      }

      .sectionTitle{
        display:flex;
        align-items:center;
        gap:10px;
        margin:0 0 12px;
      }
      .sectionTitle svg{width:24px;height:24px;fill:#13d6ff}
      .sectionTitle h2{margin:0;font-size:20px;letter-spacing:-.03em}

      .cardGrid{display:grid;grid-template-columns:1.15fr .85fr;gap:16px}
      .neoCard,.remesaCard{
        background:rgba(18,27,46,.82);
        border:1px solid rgba(255,255,255,.09);
        border-radius:22px;
        padding:18px;
        box-shadow:0 18px 60px rgba(0,0,0,.26);
      }

      .statsGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:16px 0}
      .statBox,.infoBox,.dataBox{
        background:rgba(15,22,39,.9);
        border:1px solid rgba(255,255,255,.08);
        border-radius:16px;
        padding:13px;
      }
      .statBox span,.infoBox span,.dataBox span,.eyebrow{
        display:block;
        color:#8ea0bd;
        font-size:12px;
        font-weight:800;
        text-transform:uppercase;
        letter-spacing:.08em;
        margin-bottom:6px;
      }
      .statBox b,.infoBox b{font-size:18px}

      .statusPill{
        display:inline-flex;
        align-items:center;
        padding:6px 10px;
        border-radius:999px;
        font-size:12px;
        font-weight:800;
        border:1px solid rgba(255,255,255,.1);
      }
      .statusAvailable{background:rgba(25,242,138,.12);color:#19f28a}
      .statusUnavailable{background:rgba(255,78,102,.13);color:#ff8fa0}
      .statusOffered{background:rgba(19,214,255,.12);color:#13d6ff}
      .statusAccepted{background:rgba(255,190,64,.14);color:#ffd18a}
      .statusCompleted{background:rgba(25,242,138,.12);color:#19f28a}

      .availabilityGrid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:12px
}

.availabilityGrid form{
  width:100%;
  height:100%;
  display:flex;
}

.availabilityGrid button{
  width:100%;
  height:100%;
  min-height:58px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  line-height:1.15;
  text-align:center;
}

      .availabilityGrid button svg{
        width:18px;
        height:18px;
        fill:currentColor;
        flex:0 0 auto;
      }

      form{margin:0}
      input,button,select,textarea{
        font-family:Inter, system-ui, sans-serif;
      }
      input{
        width:100%;
        box-sizing:border-box;
        background:rgba(8,13,24,.92);
        border:1px solid rgba(255,255,255,.12);
        color:#e8eefc;
        border-radius:14px;
        padding:12px;
      }
      label{display:block;color:#8ea0bd;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin:0 0 8px}
      button{
        border:0;
        border-radius:14px;
        padding:11px 14px;
        color:#071018;
        font-weight:900;
        cursor:pointer;
      }
      button:disabled{opacity:.48;cursor:not-allowed}
      .primaryBtn{background:linear-gradient(135deg,#13d6ff,#19f28a)}
      .secondaryBtn{background:#2d6bff;color:white}
      .dangerBtn{background:#ff4e66;color:white}
      .ghostBtn{background:rgba(255,255,255,.08);color:#e8eefc;border:1px solid rgba(255,255,255,.1)}
      .logoutBtn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:#ff4e66;color:white;width:100%;margin-top:12px}
      .logoutBtn svg{width:18px;height:18px;fill:white}

      .walletInput{
        font-family:"JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
        font-size:13px;
      }
      .withdrawHelp{color:#8ea0bd;font-size:13px;margin:10px 0 0;line-height:1.45}

      .remesaList{display:grid;gap:14px}
      .remesaTop{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:14px}
      .remesaTop h3{margin:0;font-size:20px;letter-spacing:-.03em}
      .infoGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:12px 0}
      .secureGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:12px 0}

      code,.mono{
        font-family:"JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
        color:#f8fbff;
        background:rgba(8,13,24,.94);
        border:1px solid rgba(255,255,255,.12);
        border-radius:12px;
        padding:9px 10px;
        word-break:break-all;
        overflow-wrap:anywhere;
        display:inline-block;
        line-height:1.35;
      }

      .copyLine code{
        flex:1;
        min-width:0;
      }

      .dataBox code{
        width:100%;
        box-sizing:border-box;
      }

      .tableCopy code{
        width:320px;
        max-width:320px;
        min-width:320px;
        background:rgba(8,13,24,.94);
        color:#f8fbff;
        white-space:normal;
        word-break:break-word;
        overflow-wrap:anywhere;
        line-height:1.35;
        max-height:calc(1.35em * 3);
        overflow:hidden;
      }

      .copyLine{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:8px;
      }
      .copyBtn{
        flex:0 0 auto;
        width:36px;
        height:36px;
        padding:0;
        display:inline-flex;
        align-items:center;
        justify-content:center;
        border-radius:12px;
        background:rgba(19,214,255,.12);
        border:1px solid rgba(19,214,255,.2);
        color:#13d6ff;
      }
      .copyBtn svg{
  width:18px;
  height:18px;
  fill:#13d6ff;
  transition:transform .16s ease, fill .16s ease;
}

.copyBtn.copied{
  background:rgba(25,242,138,.14);
  border-color:rgba(25,242,138,.34);
  box-shadow:0 0 0 4px rgba(25,242,138,.08);
}

.copyBtn.copied svg{
  fill:#19f28a;
  transform:scale(1.08);
}

.copyBtn.copyError{
  background:rgba(255,78,102,.14);
  border-color:rgba(255,78,102,.34);
}

.copyBtn.copyError svg{
  fill:#ff8fa0;
}
      .dataBox small{display:block;color:#8ea0bd;margin-top:6px}
      .mutedNote,.mutedMini{color:#8ea0bd;font-size:13px;line-height:1.45}
      .actionRow{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
      .actionRow form{display:inline-flex}
      .formsGrid{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:10px;margin-top:14px}
      .formsGrid form{
        background:rgba(15,22,39,.9);
        border:1px solid rgba(255,255,255,.08);
        border-radius:16px;
        padding:13px;
      }
      .formsGrid input{margin-bottom:8px}
      .formsGrid button{width:100%}
      .formsGrid small{display:block;color:#8ea0bd;margin-top:7px}
      .proofOk{
        margin-top:12px;
        padding:12px;
        border-radius:16px;
        background:rgba(25,242,138,.1);
        border:1px solid rgba(25,242,138,.22);
        color:#bffff0;
      }
      .completedBox{
        margin-top:12px;
        padding:12px;
        border-radius:16px;
        background:rgba(25,242,138,.1);
        border:1px solid rgba(25,242,138,.22);
      }
      .completedBox span{display:block;color:#8ea0bd;margin-top:5px}

      .emptyState{
        background:rgba(18,27,46,.55);
        border:1px dashed rgba(255,255,255,.16);
        border-radius:20px;
        padding:24px;
        color:#8ea0bd;
      }
      .emptyState b{display:block;color:#e8eefc;margin-bottom:6px}

      .tableWrap{
        overflow-x:auto;
        background:rgba(18,27,46,.82);
        border:1px solid rgba(255,255,255,.09);
        border-radius:22px;
      }

      table{
        width:100%;
        border-collapse:collapse;
      }

      .withdrawalsTable{
        min-width:1180px;
      }
      th,td{padding:14px;border-bottom:1px solid rgba(255,255,255,.07);text-align:left;vertical-align:top}
      th{color:#8ea0bd;font-size:12px;text-transform:uppercase;letter-spacing:.08em}
      td{font-size:13px}
      .tableCopy code{max-width:240px;display:inline-block}

      @media(max-width:980px){
  .agentShell{grid-template-columns:1fr}
  .sidebar{position:relative;height:auto}
  .nav{grid-template-columns:repeat(2,minmax(0,1fr))}
  .agentMain{padding:18px}
  .cardGrid,.statsGrid,.infoGrid,.secureGrid,.formsGrid{grid-template-columns:1fr}
  .availabilityGrid{align-items:stretch}
  .hero{display:block}
}

:root{color-scheme:dark}
*{box-sizing:border-box}
[hidden]{display:none!important}
.loginShell{min-height:100vh;display:grid;place-items:center;padding:24px}
.loginCard{width:min(100%,440px);padding:28px;background:rgba(18,27,46,.9);border:1px solid rgba(255,255,255,.1);border-radius:22px;box-shadow:0 18px 60px rgba(0,0,0,.26)}
.loginCard h1{font-size:27px;margin:0 0 8px}
.loginCard p{color:#8ea0bd;line-height:1.5;margin:0 0 24px}
.loginCard label{margin-top:16px}
.loginCard input{font-size:16px}
.loginButton{width:100%;margin-top:20px}
.brand [data-icon] svg{width:46px;height:46px;display:block}
.agentEmail{font-size:14px!important;word-break:break-all}
.agentMain .neoCard h2{margin:0}
.withdrawAmount{margin:6px 0 16px!important}
.withdrawButton{width:100%;margin-top:12px}
.utilityGrid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.utilityGrid button{width:100%}
.message{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);max-width:min(90vw,540px);padding:12px 18px;border-radius:14px;background:#203650;color:white;box-shadow:0 10px 35px #0009;z-index:100;display:none}
.message.show{display:block}
.remesaCard h3{overflow-wrap:anywhere}
.remesaList{min-height:60px}
.dataBox code{min-height:39px}
.formsGrid > div{background:rgba(15,22,39,.9);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:13px}
.proofForm .selectedFile{display:block;margin:4px 0 8px;color:#8ea0bd;font-size:12px;overflow-wrap:anywhere}
.proofForm .compressStatus{display:block;color:#19f28a;font-size:12px;line-height:1.4;min-height:17px;margin:2px 0 8px}
.proofForm input[type=file]{font-size:14px}
.noticeCard{display:flex;justify-content:space-between;gap:12px;align-items:center}
.noticeCard p{margin:4px 0;color:#8ea0bd}
.noticeCard .statusPill{margin-top:8px}
.withdrawalCard{margin-bottom:12px}
.withdrawalCard .copyLine{margin-top:6px}
.walletLine{margin-top:12px}
.walletLine code{width:100%}
.actionRow button{min-width:110px}
.actionRow button,.formsGrid button{min-height:42px}
.copyBtn{min-width:36px}
.copyBtn svg{display:block}
.brand svg,.sectionTitle svg{fill:currentColor}
.statusPill{white-space:nowrap}
.errorText{color:#ff8fa0}
@media(max-width:980px){
  .sidebar{padding:18px}
  .brand{margin-bottom:16px}
  .nav{gap:6px}
  .nav a{padding:10px;font-size:13px}
  .nav .navLabel{white-space:normal}
  .agentMain{padding:18px 16px 60px}
  .hero{display:flex;align-items:center}
  .formsGrid{grid-template-columns:1fr}
}
@media(max-width:600px){
  .hero h1{font-size:23px}
  .nav{grid-template-columns:repeat(2,minmax(0,1fr))}
  .noticeCard{display:block}
  .actionRow form,.actionRow button{width:100%}
  .remesaTop h3{font-size:17px}
  .statsGrid{grid-template-columns:1fr}
}

/* Header del agente: identidad, estado y navegación permanecen juntos. */
.agentShell{grid-template-columns:320px minmax(0,1fr)}
.brandBar{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0}
.brandBar .brand{margin:0;gap:8px;min-width:0}
.brandBar .brand [data-icon] svg{width:40px;height:40px}
.brandBar .brand b{font-size:15px;white-space:nowrap}
.brandBar .brand span{font-size:11px;white-space:nowrap}
.brandBar .statusPill{flex:0 0 auto;white-space:nowrap;font-size:10px;padding:6px 8px}
.sidebar .nav{margin-top:22px}
.statsGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
.utilityGrid button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;line-height:1.15}
.utilityGrid button [data-icon] svg{display:block;width:18px;height:18px;fill:currentColor;flex:0 0 18px}
.utilityGrid .notificationsActive{background:rgba(25,242,138,.14);border-color:rgba(25,242,138,.38);color:#adf7d2}
.utilityGrid .notificationsActive:hover{background:rgba(25,242,138,.22)}
.utilityGrid .refreshIcon{display:inline-flex}
.utilityGrid .isRefreshing .refreshIcon svg{animation:agentRefreshSpin .75s linear infinite;transform-origin:50% 50%}
@keyframes agentRefreshSpin{to{transform:rotate(360deg)}}

.filterArea{margin:0 0 16px}
.filterToggle{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);color:#e8eefc}
.filterToggle:hover,.filterToggle.hasFilters{border-color:rgba(19,214,255,.48);background:rgba(19,214,255,.13)}
.filterToggle svg{width:18px;height:18px;fill:currentColor}
.filterPanel{margin-top:10px;padding:15px;background:rgba(18,27,46,.94);border:1px solid rgba(255,255,255,.12);border-radius:18px}
.filterFields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:12px}
.filterFields label{margin:0}
.filterFields input,.filterFields select{display:block;width:100%;margin-top:7px;min-height:43px;background:#0a1120;color:#e8eefc;border:1px solid rgba(255,255,255,.18);border-radius:12px;padding:9px 11px;font-size:16px;color-scheme:dark}
.filterPanel .ghostBtn{min-height:40px}

.compactCard{padding:0;overflow:hidden}
.compactSummary{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) auto;align-items:center;gap:14px;list-style:none;cursor:pointer;padding:17px 42px 17px 18px;min-height:75px}
.compactSummary::-webkit-details-marker{display:none}
.compactSummary::after{content:"";position:absolute;right:19px;top:calc(50% - 5px);width:8px;height:8px;border-right:2px solid #13d6ff;border-bottom:2px solid #13d6ff;transform:rotate(45deg);transition:transform .18s ease}
.compactCard[open] .compactSummary::after{transform:rotate(225deg)}
.compactSummary:hover{background:rgba(255,255,255,.04)}
.compactSummary b{display:block;overflow-wrap:anywhere}
.compactSummary small{display:block;color:#8ea0bd;font-size:12px;line-height:1.35;margin-top:4px}
.compactSummary .summaryMeta b{font-size:13px;line-height:1.35}
.compactSummary time{font-size:12px;color:#aebbd0;white-space:nowrap}
.detailBody{border-top:1px solid rgba(255,255,255,.09);padding:15px 18px 18px;display:grid;gap:12px}
.detailRow{display:grid;grid-template-columns:minmax(105px,28%) minmax(0,1fr);align-items:start;gap:10px;font-size:13px}
.detailRow>span{color:#8ea0bd;font-weight:800}
.detailRow>b{overflow-wrap:anywhere}
.detailRow .copyLine{min-width:0}
.proofViewButton{justify-self:start;margin-top:2px}
.mobileWithdrawals{display:none;width:100%;min-width:0}
.withdrawalCard{width:100%;min-width:0}

@media(max-width:980px){
  .agentShell{display:block}
  .sidebar{position:sticky;top:0;z-index:50;height:auto;padding:12px 14px 10px;background:#071018;border-right:0;border-bottom:1px solid rgba(255,255,255,.14);backdrop-filter:none;box-shadow:0 9px 20px rgba(0,0,0,.28)}
  .sidebar .nav{margin-top:10px;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .sidebar .nav a{display:flex;flex-direction:column;justify-content:center;gap:4px;min-height:53px;padding:6px 4px;text-align:center;font-size:11px;line-height:1.12}
  .sidebar .nav svg{width:17px;height:17px;min-width:17px;flex:0 0 17px}
  .sidebar .navLabel{white-space:normal;overflow-wrap:anywhere}
  .agentMain{max-width:none;padding:16px 14px 56px}
  .desktopWithdrawals{display:none}
  .mobileWithdrawals{display:grid;gap:12px}
  .statsGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:600px){
  .sidebar{padding:max(10px, env(safe-area-inset-top)) 10px 9px}
  .brandBar .brand [data-icon] svg{width:36px;height:36px}
  .brandBar .brand b{font-size:14px}
  .brandBar .brand span{font-size:10px}
  .brandBar .statusPill{font-size:10px}
  .sidebar .nav a{min-height:57px}
  .cardGrid{grid-template-columns:1fr}
  .compactSummary{grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:15px 38px 15px 15px}
  .compactSummary .summaryMeta{grid-column:1/-1;grid-row:2}
  .compactSummary time{grid-column:2;grid-row:1;white-space:normal;text-align:right;max-width:108px}
  .withdrawalSummary .statusPill{grid-column:2;grid-row:1;justify-self:end}
  .withdrawalSummary time{grid-column:1/-1;grid-row:2;text-align:left;max-width:none}
  .detailBody{padding:14px}
  .detailRow{grid-template-columns:1fr;gap:5px}
  .filterFields{grid-template-columns:repeat(2,minmax(0,1fr))}
  #completedFilters .filterFields label:last-child{grid-column:1/-1}
  .utilityGrid button{font-size:12px;padding:10px 7px}
}
    
