@charset "UTF-8";
/* ============================================================================
   KIVO — Design System
   Tecnologia de arbitragem quantitativa
   ----------------------------------------------------------------------------
   Arquivo unico, sem build step. Unica dependencia externa: Google Fonts.
   Ordem: tokens -> reset -> tipografia -> layout -> componentes -> utilitarios.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;700&display=swap');

/* ==========================================================================
   1. TOKENS
   ========================================================================== */

:root{
  /* --- Base preta ------------------------------------------------------- */
  --k-black:        #070708;
  --k-bg:           #08090A;
  --k-surface-1:    #0D0F10;
  --k-surface-2:    #131517;
  --k-surface-3:    #1A1D1F;
  --k-surface-hi:   #212528;

  /* --- Verde KIVO ------------------------------------------------------- */
  --k-lime:         #86F13F;
  --k-lime-bright:  #A8FF6B;
  --k-lime-dim:     #5FBF28;
  --k-lime-deep:    #3E8C15;
  --k-lime-ink:     #0A1A02;
  --k-lime-a12:     rgba(134,241,63,.12);
  --k-lime-a20:     rgba(134,241,63,.20);
  --k-lime-a35:     rgba(134,241,63,.35);
  --k-lime-a60:     rgba(134,241,63,.60);

  /* --- Texto ------------------------------------------------------------ */
  --k-text:         #F2F5F0;
  --k-text-2:       #9AA29B;
  --k-text-3:       #676E68;
  --k-text-4:       #454B46;

  /* --- Linhas ----------------------------------------------------------- */
  --k-line:         rgba(255,255,255,.075);
  --k-line-2:       rgba(255,255,255,.13);
  --k-line-3:       rgba(255,255,255,.22);

  /* --- Semantica -------------------------------------------------------- */
  --k-up:           #86F13F;
  --k-down:         #FF5257;
  --k-warn:         #FFB020;
  --k-info:         #4DD4FF;
  --k-violet:       #9B6BFF;

  --k-up-a:         rgba(134,241,63,.14);
  --k-down-a:       rgba(255,82,87,.14);
  --k-warn-a:       rgba(255,176,32,.14);
  --k-info-a:       rgba(77,212,255,.14);

  /* --- Tipografia ------------------------------------------------------- */
  --k-font:         "Archivo", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --k-mono:         "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --k-fs-display:   clamp(2.25rem, 1.4rem + 3.6vw, 4rem);
  --k-fs-h1:        clamp(1.75rem, 1.3rem + 1.9vw, 2.5rem);
  --k-fs-h2:        clamp(1.375rem, 1.15rem + 1vw, 1.75rem);
  --k-fs-h3:        1.125rem;
  --k-fs-body:      0.9375rem;
  --k-fs-sm:        0.8125rem;
  --k-fs-xs:        0.6875rem;

  /* --- Espacamento ------------------------------------------------------ */
  --k-1:  4px;
  --k-2:  8px;
  --k-3:  12px;
  --k-4:  16px;
  --k-5:  20px;
  --k-6:  24px;
  --k-7:  32px;
  --k-8:  40px;
  --k-9:  56px;
  --k-10: 72px;

  /* --- Raios ------------------------------------------------------------ */
  --k-r-xs:   6px;
  --k-r-sm:   10px;
  --k-r:      14px;
  --k-r-lg:   18px;
  --k-r-xl:   24px;
  --k-r-pill: 999px;

  /* --- Sombra ----------------------------------------------------------- */
  --k-shadow-1: 0 1px 2px rgba(0,0,0,.6);
  --k-shadow-2: 0 8px 24px rgba(0,0,0,.45);
  --k-shadow-3: 0 24px 64px rgba(0,0,0,.55);
  --k-glow:     0 0 0 1px var(--k-lime-a35), 0 8px 32px rgba(134,241,63,.18);

  /* --- Layout ----------------------------------------------------------- */
  --k-sidebar:      264px;
  --k-sidebar-mini: 76px;
  --k-topbar:       64px;
  --k-bottomnav:    68px;
  --k-maxw:         1400px;
  --k-gutter:       clamp(16px, 1rem + 1vw, 32px);

  /* --- Motion ----------------------------------------------------------- */
  --k-ease:     cubic-bezier(.22,.61,.36,1);
  --k-ease-out: cubic-bezier(.16,1,.3,1);
  --k-fast:     .14s;
  --k-med:      .26s;
  --k-slow:     .45s;

  --k-z-nav:    100;
  --k-z-drawer: 200;
  --k-z-modal:  300;
  --k-z-toast:  400;
}

/* ==========================================================================
   2. RESET
   ========================================================================== */

*,*::before,*::after{ box-sizing:border-box; }

html{
  color-scheme: dark;
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
}

body{
  margin:0;
  min-height:100dvh;
  background:var(--k-bg);
  color:var(--k-text);
  font-family:var(--k-font);
  font-size:var(--k-fs-body);
  line-height:1.5;
  font-weight:450;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
  font-variant-numeric:tabular-nums;
}

/* Grid de fundo — assinatura KIVO, quase invisivel */
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.014) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.014) 1px, transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:radial-gradient(ellipse 120% 80% at 50% 0%, #000 20%, transparent 78%);
  mask-image:radial-gradient(ellipse 120% 80% at 50% 0%, #000 20%, transparent 78%);
}

img,svg,video,canvas{ display:block; max-width:100%; }
img{ height:auto; }

a{ color:inherit; text-decoration:none; }

button,input,select,textarea{ font:inherit; color:inherit; }
button{ background:none; border:0; cursor:pointer; padding:0; }

ul,ol{ margin:0; padding:0; list-style:none; }

h1,h2,h3,h4,h5,h6,p,figure{ margin:0; }

table{ border-collapse:collapse; width:100%; }

hr{ border:0; border-top:1px solid var(--k-line); margin:var(--k-6) 0; }

::selection{ background:var(--k-lime); color:var(--k-lime-ink); }

:focus-visible{
  outline:2px solid var(--k-lime);
  outline-offset:2px;
  border-radius:var(--k-r-xs);
}

*{ scrollbar-width:thin; scrollbar-color:var(--k-surface-hi) transparent; }
::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-track{ background:transparent; }
::-webkit-scrollbar-thumb{
  background:var(--k-surface-hi);
  border-radius:99px;
  border:3px solid var(--k-bg);
}
::-webkit-scrollbar-thumb:hover{ background:#2C3134; }

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
}

/* ==========================================================================
   3. TIPOGRAFIA
   ========================================================================== */

.k-display{
  font-size:var(--k-fs-display);
  font-weight:800;
  line-height:1.02;
  letter-spacing:-.035em;
}
.k-h1{ font-size:var(--k-fs-h1); font-weight:800; line-height:1.08; letter-spacing:-.03em; }
.k-h2{ font-size:var(--k-fs-h2); font-weight:700; line-height:1.15; letter-spacing:-.022em; }
.k-h3{ font-size:var(--k-fs-h3); font-weight:700; line-height:1.25; letter-spacing:-.015em; }

.k-lead{ font-size:1.0625rem; color:var(--k-text-2); line-height:1.6; font-weight:450; }
.k-body{ font-size:var(--k-fs-body); color:var(--k-text-2); }
.k-sm{ font-size:var(--k-fs-sm); color:var(--k-text-2); }
.k-xs{ font-size:var(--k-fs-xs); color:var(--k-text-3); }

/* Eyebrow — rotulo mono caixa-alta, assinatura da marca */
.k-eyebrow{
  font-family:var(--k-mono);
  font-size:var(--k-fs-xs);
  font-weight:500;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--k-text-3);
}
.k-eyebrow--lime{ color:var(--k-lime); }

.k-mono{ font-family:var(--k-mono); font-variant-numeric:tabular-nums; }

/* Numeros financeiros — sempre tabulares para nao dancar */
.k-num{
  font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum" 1,"zero" 1;
  letter-spacing:-.02em;
}
.k-num--xl{ font-size:clamp(2.5rem,1.6rem+3.4vw,3.75rem); font-weight:800; line-height:1; letter-spacing:-.04em; }
.k-num--lg{ font-size:1.75rem; font-weight:800; line-height:1.1; letter-spacing:-.03em; }
.k-num--md{ font-size:1.25rem; font-weight:700; line-height:1.2; letter-spacing:-.02em; }

.k-up{ color:var(--k-up); }
.k-down{ color:var(--k-down); }
.k-warn{ color:var(--k-warn); }
.k-muted{ color:var(--k-text-2); }
.k-dim{ color:var(--k-text-3); }
.k-lime,.k-hl{ color:var(--k-lime); }

/* ==========================================================================
   4. LOGO
   ========================================================================== */

.k-logo{
  display:inline-flex;
  align-items:center;
  gap:2px;
  font-weight:900;
  letter-spacing:-.045em;
  line-height:1;
  color:var(--k-text);
  font-size:1.5rem;
  user-select:none;
}
.k-logo__kiwi{
  width:.86em;height:.86em;
  flex:0 0 auto;
  margin:0 .02em;
  transform:translateY(.01em);
}
.k-logo--sm{ font-size:1.125rem; }
.k-logo--lg{ font-size:2.25rem; }

/* ==========================================================================
   5. SHELL / LAYOUT
   ========================================================================== */

.k-shell{
  position:relative;
  z-index:1;
  min-height:100dvh;
  display:flex;
  flex-direction:column;
}

.k-main{
  flex:1 1 auto;
  width:100%;
  max-width:var(--k-maxw);
  margin-inline:auto;
  padding:var(--k-5) var(--k-gutter) calc(var(--k-bottomnav) + var(--k-8));
}

.k-page-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:var(--k-4);
  margin-bottom:var(--k-6);
  flex-wrap:wrap;
}
.k-page-head__text{ min-width:0; }
.k-page-head__title{ font-size:var(--k-fs-h1); font-weight:800; letter-spacing:-.03em; line-height:1.1; }
.k-page-head__sub{ color:var(--k-text-2); font-size:var(--k-fs-sm); margin-top:var(--k-1); }

.k-section{ margin-bottom:var(--k-7); }
.k-section__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--k-3);
  margin-bottom:var(--k-4);
}
.k-section__title{ font-size:var(--k-fs-h3); font-weight:700; letter-spacing:-.015em; }

/* Grid utilitario */
.k-grid{ display:grid; gap:var(--k-4); }
.k-grid--2{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.k-grid--3{ grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); }
.k-grid--4{ grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); }
.k-grid--main{ grid-template-columns:minmax(0,1fr); }

.k-stack{ display:flex; flex-direction:column; gap:var(--k-4); }
.k-row{ display:flex; align-items:center; gap:var(--k-3); }
.k-row--between{ justify-content:space-between; }
.k-row--wrap{ flex-wrap:wrap; }

/* ==========================================================================
   6. TOPBAR (mobile + desktop)
   ========================================================================== */

.k-topbar{
  position:sticky;
  top:0;
  z-index:var(--k-z-nav);
  height:var(--k-topbar);
  display:flex;
  align-items:center;
  gap:var(--k-3);
  padding:0 var(--k-gutter);
  background:rgba(8,9,10,.82);
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  border-bottom:1px solid var(--k-line);
}
.k-topbar__inner{
  width:100%;
  max-width:var(--k-maxw);
  margin-inline:auto;
  display:flex;
  align-items:center;
  gap:var(--k-3);
}
.k-topbar__spacer{ flex:1 1 auto; }

/* Chip de saldo do topo */
.k-balance-chip{
  display:inline-flex;
  align-items:center;
  gap:var(--k-2);
  height:40px;
  padding:0 var(--k-1) 0 var(--k-3);
  border:1px solid var(--k-line-2);
  border-radius:var(--k-r-pill);
  background:var(--k-surface-2);
  transition:border-color var(--k-fast) var(--k-ease), background var(--k-fast) var(--k-ease);
}
.k-balance-chip:hover{ border-color:var(--k-lime-a35); }
.k-balance-chip__icon{ color:var(--k-text-2); display:flex; }
.k-balance-chip__value{
  font-weight:700;
  font-size:var(--k-fs-sm);
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
}
.k-balance-chip__add{
  width:28px;height:28px;
  display:grid;place-items:center;
  border-radius:var(--k-r-pill);
  background:var(--k-lime);
  color:var(--k-lime-ink);
  flex:0 0 auto;
  transition:transform var(--k-fast) var(--k-ease), background var(--k-fast) var(--k-ease);
}
.k-balance-chip__add:hover{ background:var(--k-lime-bright); transform:scale(1.06); }

/* Botao icone */
.k-iconbtn{
  width:40px;height:40px;
  display:grid;place-items:center;
  border-radius:var(--k-r-sm);
  border:1px solid var(--k-line-2);
  background:var(--k-surface-2);
  color:var(--k-text);
  flex:0 0 auto;
  transition:background var(--k-fast) var(--k-ease), border-color var(--k-fast) var(--k-ease), color var(--k-fast) var(--k-ease);
}
.k-iconbtn:hover{ background:var(--k-surface-3); border-color:var(--k-line-3); }
.k-iconbtn--ghost{ border-color:transparent; background:transparent; }
.k-iconbtn--ghost:hover{ background:var(--k-surface-2); }

/* ==========================================================================
   7. SIDEBAR (desktop)
   ========================================================================== */

.k-sidebar{
  display:none;
  position:fixed;
  inset:0 auto 0 0;
  width:var(--k-sidebar);
  z-index:var(--k-z-nav);
  background:var(--k-surface-1);
  border-right:1px solid var(--k-line);
  flex-direction:column;
  padding:var(--k-5) var(--k-4);
  overflow-y:auto;
  overscroll-behavior:contain;
}
.k-sidebar__brand{
  display:flex;
  align-items:center;
  gap:var(--k-2);
  padding:0 var(--k-2) var(--k-5);
  margin-bottom:var(--k-2);
  border-bottom:1px solid var(--k-line);
}
.k-sidebar__group{ margin-bottom:var(--k-5); }
.k-sidebar__label{
  font-family:var(--k-mono);
  font-size:var(--k-fs-xs);
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--k-text-4);
  padding:0 var(--k-3);
  margin-bottom:var(--k-2);
  display:block;
}
.k-sidebar__foot{ margin-top:auto; padding-top:var(--k-5); }

.k-navitem{
  display:flex;
  align-items:center;
  gap:var(--k-3);
  height:42px;
  padding:0 var(--k-3);
  border-radius:var(--k-r-sm);
  color:var(--k-text-2);
  font-size:var(--k-fs-sm);
  font-weight:550;
  position:relative;
  transition:background var(--k-fast) var(--k-ease), color var(--k-fast) var(--k-ease);
}
.k-navitem svg{ flex:0 0 auto; width:19px; height:19px; }
.k-navitem:hover{ background:var(--k-surface-2); color:var(--k-text); }
.k-navitem.is-active{
  background:var(--k-lime-a12);
  color:var(--k-lime);
  font-weight:650;
}
.k-navitem.is-active::before{
  content:"";
  position:absolute;
  left:calc(var(--k-4) * -1 - 1px);
  top:50%;
  transform:translateY(-50%);
  width:3px;height:20px;
  border-radius:0 3px 3px 0;
  background:var(--k-lime);
}
.k-navitem__badge{
  margin-left:auto;
  font-family:var(--k-mono);
  font-size:var(--k-fs-xs);
  padding:2px 7px;
  border-radius:var(--k-r-pill);
  background:var(--k-surface-3);
  color:var(--k-text-2);
}

/* ==========================================================================
   8. BOTTOM NAV (mobile)
   ========================================================================== */

.k-bottomnav{
  position:fixed;
  left:0;right:0;bottom:0;
  z-index:var(--k-z-nav);
  height:calc(var(--k-bottomnav) + env(safe-area-inset-bottom));
  padding-bottom:env(safe-area-inset-bottom);
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:1fr;
  background:rgba(8,9,10,.9);
  backdrop-filter:blur(20px) saturate(140%);
  -webkit-backdrop-filter:blur(20px) saturate(140%);
  border-top:1px solid var(--k-line);
}
.k-bottomnav__item{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  color:var(--k-text-3);
  font-size:.625rem;
  font-weight:600;
  letter-spacing:.01em;
  position:relative;
  padding-top:3px;
  transition:color var(--k-fast) var(--k-ease);
}
.k-bottomnav__item svg{ width:22px; height:22px; }
.k-bottomnav__item.is-active{ color:var(--k-lime); }
.k-bottomnav__item.is-active::after{
  content:"";
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  width:26px;height:2px;
  border-radius:0 0 3px 3px;
  background:var(--k-lime);
}
.k-bottomnav__avatar{
  width:24px;height:24px;
  border-radius:var(--k-r-pill);
  display:grid;place-items:center;
  background:var(--k-surface-3);
  border:1.5px solid var(--k-line-2);
  font-size:.5625rem;
  font-weight:800;
  color:var(--k-text);
  letter-spacing:0;
  position:relative;
}
.k-bottomnav__item.is-active .k-bottomnav__avatar{ border-color:var(--k-lime); }
.k-bottomnav__dot{
  position:absolute;
  top:-1px;right:-1px;
  width:8px;height:8px;
  border-radius:99px;
  background:var(--k-lime);
  border:1.5px solid var(--k-bg);
}

/* ==========================================================================
   9. DRAWER (menu mobile)
   ========================================================================== */

.k-drawer{
  position:fixed;
  inset:0;
  z-index:var(--k-z-drawer);
  visibility:hidden;
  pointer-events:none;
}
.k-drawer.is-open{ visibility:visible; pointer-events:auto; }
.k-drawer__scrim{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.65);
  opacity:0;
  transition:opacity var(--k-med) var(--k-ease);
  backdrop-filter:blur(2px);
}
.k-drawer.is-open .k-drawer__scrim{ opacity:1; }
.k-drawer__panel{
  position:absolute;
  inset:0 0 0 auto;
  width:min(86vw,340px);
  background:var(--k-surface-1);
  border-left:1px solid var(--k-line);
  display:flex;
  flex-direction:column;
  padding:var(--k-5) var(--k-4) calc(var(--k-6) + env(safe-area-inset-bottom));
  transform:translateX(100%);
  transition:transform var(--k-med) var(--k-ease-out);
  overflow-y:auto;
  overscroll-behavior:contain;
}
.k-drawer.is-open .k-drawer__panel{ transform:translateX(0); }
.k-drawer__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding-bottom:var(--k-5);
  margin-bottom:var(--k-4);
  border-bottom:1px solid var(--k-line);
}

/* ==========================================================================
   10. CARD
   ========================================================================== */

.k-card{
  position:relative;
  background:var(--k-surface-1);
  border:1px solid var(--k-line);
  border-radius:var(--k-r-lg);
  padding:var(--k-5);
  overflow:hidden;
}
.k-card--flush{ padding:0; }
.k-card--tight{ padding:var(--k-4); }
.k-card--hover{ transition:border-color var(--k-fast) var(--k-ease), transform var(--k-fast) var(--k-ease); }
.k-card--hover:hover{ border-color:var(--k-line-2); transform:translateY(-1px); }

/* Card com brilho verde no topo — destaque contido */
.k-card--glow::before{
  content:"";
  position:absolute;
  top:0;left:0;right:0;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--k-lime-a60),transparent);
}

/* Card promo com borda em gradiente — usar com parcimonia */
.k-card--promo{
  background:
    linear-gradient(var(--k-surface-1),var(--k-surface-1)) padding-box,
    linear-gradient(115deg,var(--k-lime),#22D3EE 45%,var(--k-violet)) border-box;
  border:1.5px solid transparent;
}

.k-card__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--k-3);
  margin-bottom:var(--k-4);
}
.k-card__title{ font-size:var(--k-fs-sm); font-weight:650; color:var(--k-text); }
.k-card__body{ min-width:0; }

/* ==========================================================================
   11. CARD DE SALDO (hero)
   ========================================================================== */

.k-balance{
  position:relative;
  background:var(--k-surface-1);
  border:1px solid var(--k-line);
  border-radius:var(--k-r-xl);
  padding:var(--k-5);
  overflow:hidden;
}
.k-balance__spark{
  position:absolute;
  inset:auto 0 auto auto;
  top:0;
  width:62%;
  height:100%;
  opacity:.9;
  pointer-events:none;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 42%);
  mask-image:linear-gradient(90deg,transparent,#000 42%);
}
.k-balance__label{
  font-size:var(--k-fs-sm);
  color:var(--k-text-2);
  margin-bottom:var(--k-2);
  position:relative;
}
.k-balance__value{
  font-size:clamp(2.5rem,1.5rem+4vw,3.5rem);
  font-weight:800;
  letter-spacing:-.045em;
  line-height:1;
  position:relative;
  font-variant-numeric:tabular-nums;
}
.k-balance__split{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:var(--k-3);
  margin-top:var(--k-5);
  position:relative;
}
.k-balance__cell{
  background:var(--k-surface-2);
  border:1px solid var(--k-line);
  border-radius:var(--k-r);
  padding:var(--k-3) var(--k-4);
}
.k-balance__cell-label{
  display:flex;
  align-items:center;
  gap:var(--k-2);
  font-size:var(--k-fs-sm);
  color:var(--k-text-2);
  margin-bottom:var(--k-1);
}
.k-balance__cell-value{
  font-size:1.25rem;
  font-weight:700;
  letter-spacing:-.025em;
  font-variant-numeric:tabular-nums;
}
.k-dot{ width:8px;height:8px;border-radius:99px;flex:0 0 auto; background:var(--k-text-3); }
.k-dot--lime{ background:var(--k-lime); box-shadow:0 0 8px var(--k-lime-a60); }
.k-dot--down{ background:var(--k-down); }
.k-dot--warn{ background:var(--k-warn); }

/* ==========================================================================
   12. BOTOES
   ========================================================================== */

.k-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:var(--k-2);
  height:48px;
  padding:0 var(--k-5);
  border-radius:var(--k-r);
  font-size:var(--k-fs-body);
  font-weight:700;
  letter-spacing:-.01em;
  border:1px solid transparent;
  white-space:nowrap;
  transition:background var(--k-fast) var(--k-ease),
             border-color var(--k-fast) var(--k-ease),
             color var(--k-fast) var(--k-ease),
             transform var(--k-fast) var(--k-ease),
             opacity var(--k-fast) var(--k-ease);
  user-select:none;
}
.k-btn svg{ width:18px;height:18px;flex:0 0 auto; }
.k-btn:active{ transform:translateY(1px); }
.k-btn:disabled,.k-btn.is-disabled{ opacity:.42; pointer-events:none; }

.k-btn--primary{ background:var(--k-lime); color:var(--k-lime-ink); }
.k-btn--primary:hover{ background:var(--k-lime-bright); }

.k-btn--outline{ background:transparent; border-color:var(--k-lime-a35); color:var(--k-lime); }
.k-btn--outline:hover{ border-color:var(--k-lime); background:var(--k-lime-a12); }

.k-btn--ghost{ background:var(--k-surface-2); border-color:var(--k-line-2); color:var(--k-text); }
.k-btn--ghost:hover{ background:var(--k-surface-3); border-color:var(--k-line-3); }

.k-btn--danger{ background:var(--k-down); color:#fff; }
.k-btn--danger:hover{ filter:brightness(1.08); }

.k-btn--block{ width:100%; }
.k-btn--sm{ height:38px; padding:0 var(--k-4); font-size:var(--k-fs-sm); border-radius:var(--k-r-sm); }
.k-btn--lg{ height:56px; padding:0 var(--k-6); font-size:1.0625rem; }

/* Botao com estado de carregamento */
.k-btn.is-loading{ pointer-events:none; position:relative; color:transparent !important; }
.k-btn.is-loading::after{
  content:"";
  position:absolute;
  width:18px;height:18px;
  border:2px solid currentColor;
  border-top-color:transparent;
  border-radius:99px;
  animation:k-spin .6s linear infinite;
  color:var(--k-lime-ink);
}
.k-btn--outline.is-loading::after,
.k-btn--ghost.is-loading::after{ color:var(--k-text); }

@keyframes k-spin{ to{ transform:rotate(360deg); } }

/* Atalho rapido (pill com seta) */
.k-quick{
  display:flex;
  align-items:center;
  gap:var(--k-2);
  height:48px;
  padding:0 var(--k-3);
  border:1px solid var(--k-line-2);
  border-radius:var(--k-r);
  background:var(--k-surface-1);
  font-size:var(--k-fs-sm);
  font-weight:600;
  color:var(--k-text);
  transition:border-color var(--k-fast) var(--k-ease), background var(--k-fast) var(--k-ease);
}
.k-quick:hover{ border-color:var(--k-lime-a35); background:var(--k-surface-2); }
.k-quick__icon{ color:var(--k-lime); display:flex; flex:0 0 auto; }
.k-quick__chev{ margin-left:auto; color:var(--k-text-3); display:flex; }

/* ==========================================================================
   13. PILLS / BADGES / TAGS
   ========================================================================== */

.k-pill{
  display:inline-flex;
  align-items:center;
  gap:var(--k-2);
  height:30px;
  padding:0 var(--k-3);
  border-radius:var(--k-r-pill);
  border:1px solid var(--k-line-2);
  font-family:var(--k-mono);
  font-size:var(--k-fs-xs);
  font-weight:500;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--k-text-2);
  background:transparent;
}
.k-pill--lime{ border-color:var(--k-lime-a35); color:var(--k-lime); }
.k-pill--solid{ background:var(--k-lime); border-color:var(--k-lime); color:var(--k-lime-ink); font-weight:700; }

.k-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  height:24px;
  padding:0 var(--k-2);
  border-radius:var(--k-r-xs);
  font-size:var(--k-fs-xs);
  font-weight:700;
  letter-spacing:.02em;
  text-transform:uppercase;
  background:var(--k-surface-3);
  color:var(--k-text-2);
}
.k-badge--up{ background:var(--k-up-a); color:var(--k-up); }
.k-badge--down{ background:var(--k-down-a); color:var(--k-down); }
.k-badge--warn{ background:var(--k-warn-a); color:var(--k-warn); }
.k-badge--info{ background:var(--k-info-a); color:var(--k-info); }

/* ==========================================================================
   14. LISTA / ITEM
   ========================================================================== */

.k-list{ display:flex; flex-direction:column; }
.k-list__item{
  display:flex;
  align-items:center;
  gap:var(--k-3);
  padding:var(--k-4) 0;
  border-bottom:1px solid var(--k-line);
}
.k-list__item:last-child{ border-bottom:0; }
.k-list--boxed .k-list__item{ padding-inline:var(--k-5); }

.k-list__icon{
  width:40px;height:40px;
  flex:0 0 auto;
  display:grid;place-items:center;
  border-radius:var(--k-r-sm);
  background:var(--k-surface-2);
  border:1px solid var(--k-line);
  color:var(--k-text-2);
}
.k-list__icon--up{ background:var(--k-up-a); border-color:transparent; color:var(--k-up); }
.k-list__icon--down{ background:var(--k-down-a); border-color:transparent; color:var(--k-down); }

.k-list__main{ flex:1 1 auto; min-width:0; }
.k-list__title{
  font-size:var(--k-fs-body);
  font-weight:600;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.k-list__sub{
  font-size:var(--k-fs-sm);
  color:var(--k-text-3);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.k-list__end{ text-align:right; flex:0 0 auto; }
.k-list__amount{ font-weight:700; font-variant-numeric:tabular-nums; letter-spacing:-.02em; }

/* Linha de feature com icone linear — padrao do deck */
.k-feature{
  display:flex;
  align-items:flex-start;
  gap:var(--k-4);
  padding:var(--k-4) 0;
  border-bottom:1px solid var(--k-line);
}
.k-feature:last-child{ border-bottom:0; }
.k-feature__icon{ color:var(--k-lime); flex:0 0 auto; margin-top:2px; }
.k-feature__title{ font-weight:700; font-size:var(--k-fs-body); margin-bottom:2px; }
.k-feature__desc{ font-size:var(--k-fs-sm); color:var(--k-text-2); line-height:1.5; }

/* ==========================================================================
   15. STAT / KPI
   ========================================================================== */

.k-stat{
  background:var(--k-surface-1);
  border:1px solid var(--k-line);
  border-radius:var(--k-r);
  padding:var(--k-4);
}
.k-stat__label{
  font-family:var(--k-mono);
  font-size:var(--k-fs-xs);
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--k-text-3);
  margin-bottom:var(--k-2);
  display:block;
}
.k-stat__value{
  font-size:1.375rem;
  font-weight:800;
  letter-spacing:-.03em;
  line-height:1.1;
  font-variant-numeric:tabular-nums;
}
.k-stat__delta{ font-size:var(--k-fs-sm); font-weight:600; margin-top:var(--k-1); }

/* Stat com linha superior (estilo rodape do deck) */
.k-stat--rule{
  border:0;
  border-top:1px solid var(--k-line-2);
  border-radius:0;
  background:transparent;
  padding:var(--k-4) 0 0;
}

/* ==========================================================================
   16. PROGRESSO
   ========================================================================== */

.k-progress{
  height:6px;
  border-radius:99px;
  background:var(--k-surface-3);
  overflow:hidden;
}
.k-progress__bar{
  height:100%;
  border-radius:99px;
  background:var(--k-lime);
  transition:width var(--k-slow) var(--k-ease-out);
}

/* Progresso em segmentos — usado no card "Iniciante" */
.k-steps{ display:flex; gap:5px; }
.k-steps__seg{
  height:5px;
  flex:1 1 0;
  border-radius:99px;
  background:var(--k-surface-3);
}
.k-steps__seg.is-done{ background:var(--k-lime); }

/* Anel de progresso */
.k-ring{ position:relative; width:56px; height:56px; flex:0 0 auto; }
.k-ring svg{ transform:rotate(-90deg); }
.k-ring__track{ stroke:var(--k-surface-3); }
.k-ring__bar{ stroke:var(--k-lime); stroke-linecap:round; transition:stroke-dashoffset var(--k-slow) var(--k-ease-out); }
.k-ring__center{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  color:var(--k-lime);
}

/* ==========================================================================
   17. FORMULARIOS
   ========================================================================== */

.k-field{ display:block; margin-bottom:var(--k-4); }
.k-field__label{
  display:block;
  font-size:var(--k-fs-sm);
  font-weight:600;
  color:var(--k-text-2);
  margin-bottom:var(--k-2);
}
.k-field__hint{ font-size:var(--k-fs-sm); color:var(--k-text-3); margin-top:var(--k-2); }
.k-field__error{ font-size:var(--k-fs-sm); color:var(--k-down); margin-top:var(--k-2); }

.k-input,.k-select,.k-textarea{
  width:100%;
  height:52px;
  padding:0 var(--k-4);
  background:var(--k-surface-2);
  border:1px solid var(--k-line-2);
  border-radius:var(--k-r);
  color:var(--k-text);
  font-size:var(--k-fs-body);
  transition:border-color var(--k-fast) var(--k-ease), background var(--k-fast) var(--k-ease);
  appearance:none;
}
.k-textarea{ height:auto; min-height:120px; padding:var(--k-3) var(--k-4); resize:vertical; line-height:1.5; }
.k-input::placeholder,.k-textarea::placeholder{ color:var(--k-text-4); }
.k-input:hover,.k-select:hover,.k-textarea:hover{ border-color:var(--k-line-3); }
.k-input:focus,.k-select:focus,.k-textarea:focus{
  outline:none;
  border-color:var(--k-lime);
  background:var(--k-surface-1);
  box-shadow:0 0 0 3px var(--k-lime-a12);
}
.k-input.is-invalid,.k-select.is-invalid{ border-color:var(--k-down); }

.k-select{
  padding-right:var(--k-8);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%239AA29B' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right var(--k-4) center;
}

/* Input com sufixo/prefixo */
.k-inputgroup{ position:relative; display:flex; align-items:center; }
.k-inputgroup .k-input{ padding-right:88px; }
.k-inputgroup__suffix{
  position:absolute;
  right:var(--k-2);
  display:flex;
  align-items:center;
  gap:var(--k-2);
}
.k-inputgroup__unit{
  font-family:var(--k-mono);
  font-size:var(--k-fs-sm);
  color:var(--k-text-3);
  padding-right:var(--k-2);
}

/* Campo de valor grande (deposito/saque/aporte) */
.k-amount{
  background:var(--k-surface-2);
  border:1px solid var(--k-line-2);
  border-radius:var(--k-r-lg);
  padding:var(--k-5);
  transition:border-color var(--k-fast) var(--k-ease);
}
.k-amount:focus-within{ border-color:var(--k-lime); box-shadow:0 0 0 3px var(--k-lime-a12); }
.k-amount__head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:var(--k-2); }
.k-amount__input{
  width:100%;
  border:0;
  background:transparent;
  font-size:2.25rem;
  font-weight:800;
  letter-spacing:-.04em;
  color:var(--k-text);
  padding:0;
  font-variant-numeric:tabular-nums;
}
.k-amount__input:focus{ outline:none; }
.k-amount__input::placeholder{ color:var(--k-text-4); }
.k-amount__foot{ display:flex; justify-content:space-between; align-items:center; margin-top:var(--k-2); gap:var(--k-3); }

/* Chips de valor rapido */
.k-chips{ display:flex; gap:var(--k-2); flex-wrap:wrap; }
.k-chip{
  height:34px;
  padding:0 var(--k-3);
  border-radius:var(--k-r-pill);
  border:1px solid var(--k-line-2);
  background:var(--k-surface-2);
  font-size:var(--k-fs-sm);
  font-weight:600;
  color:var(--k-text-2);
  transition:all var(--k-fast) var(--k-ease);
}
.k-chip:hover{ border-color:var(--k-line-3); color:var(--k-text); }
.k-chip.is-active{ background:var(--k-lime); border-color:var(--k-lime); color:var(--k-lime-ink); }

/* Opcao selecionavel (rede, moeda, plano) */
.k-option{
  display:flex;
  align-items:center;
  gap:var(--k-3);
  width:100%;
  padding:var(--k-4);
  border:1px solid var(--k-line-2);
  border-radius:var(--k-r);
  background:var(--k-surface-1);
  text-align:left;
  transition:border-color var(--k-fast) var(--k-ease), background var(--k-fast) var(--k-ease);
  position:relative;
}
.k-option:hover{ border-color:var(--k-line-3); }
.k-option.is-active{ border-color:var(--k-lime); background:var(--k-lime-a12); }
.k-option__icon{ width:36px;height:36px;flex:0 0 auto;display:grid;place-items:center;border-radius:var(--k-r-sm);background:var(--k-surface-3); }
.k-option__main{ flex:1 1 auto; min-width:0; }
.k-option__title{ font-weight:700; font-size:var(--k-fs-body); }
.k-option__sub{ font-size:var(--k-fs-sm); color:var(--k-text-3); }
.k-option__check{ opacity:0; color:var(--k-lime); flex:0 0 auto; transition:opacity var(--k-fast) var(--k-ease); }
.k-option.is-active .k-option__check{ opacity:1; }

/* Checkbox / switch */
.k-check{ display:flex; align-items:flex-start; gap:var(--k-3); cursor:pointer; }
.k-check input{ position:absolute; opacity:0; width:0; height:0; }
.k-check__box{
  width:20px;height:20px;flex:0 0 auto;
  border:1.5px solid var(--k-line-3);
  border-radius:var(--k-r-xs);
  display:grid;place-items:center;
  margin-top:1px;
  transition:all var(--k-fast) var(--k-ease);
}
.k-check__box svg{ opacity:0; width:12px;height:12px; color:var(--k-lime-ink); }
.k-check input:checked + .k-check__box{ background:var(--k-lime); border-color:var(--k-lime); }
.k-check input:checked + .k-check__box svg{ opacity:1; }
.k-check input:focus-visible + .k-check__box{ outline:2px solid var(--k-lime); outline-offset:2px; }
.k-check__text{ font-size:var(--k-fs-sm); color:var(--k-text-2); }

/* ==========================================================================
   18. TABS
   ========================================================================== */

.k-tabs{
  display:flex;
  gap:var(--k-1);
  padding:var(--k-1);
  background:var(--k-surface-2);
  border:1px solid var(--k-line);
  border-radius:var(--k-r);
  overflow-x:auto;
  scrollbar-width:none;
}
.k-tabs::-webkit-scrollbar{ display:none; }
.k-tab{
  flex:1 1 auto;
  height:40px;
  padding:0 var(--k-4);
  border-radius:var(--k-r-sm);
  font-size:var(--k-fs-sm);
  font-weight:600;
  color:var(--k-text-2);
  white-space:nowrap;
  transition:background var(--k-fast) var(--k-ease), color var(--k-fast) var(--k-ease);
}
.k-tab:hover{ color:var(--k-text); }
.k-tab.is-active{ background:var(--k-surface-hi); color:var(--k-text); }

/* Tabs sublinhadas */
.k-tabs--line{ background:transparent; border:0; border-bottom:1px solid var(--k-line); border-radius:0; padding:0; gap:var(--k-5); }
.k-tabs--line .k-tab{ flex:0 0 auto; border-radius:0; padding:0; height:44px; position:relative; }
.k-tabs--line .k-tab.is-active{ background:transparent; color:var(--k-lime); }
.k-tabs--line .k-tab.is-active::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:-1px;
  height:2px;
  background:var(--k-lime);
}

/* ==========================================================================
   19. TABELA
   ========================================================================== */

.k-tablewrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.k-table{ min-width:640px; font-size:var(--k-fs-sm); }
.k-table th{
  text-align:left;
  font-family:var(--k-mono);
  font-size:var(--k-fs-xs);
  font-weight:500;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--k-text-3);
  padding:var(--k-3) var(--k-4);
  border-bottom:1px solid var(--k-line-2);
  white-space:nowrap;
}
.k-table td{
  padding:var(--k-4);
  border-bottom:1px solid var(--k-line);
  vertical-align:middle;
}
.k-table tbody tr{ transition:background var(--k-fast) var(--k-ease); }
.k-table tbody tr:hover{ background:var(--k-surface-2); }
.k-table td.k-t-num{ text-align:right; font-variant-numeric:tabular-nums; font-weight:600; }
.k-table th.k-t-num{ text-align:right; }

/* ==========================================================================
   20. ALERTAS
   ========================================================================== */

.k-alert{
  display:flex;
  gap:var(--k-3);
  padding:var(--k-4);
  border-radius:var(--k-r);
  border:1px solid var(--k-line-2);
  background:var(--k-surface-2);
  font-size:var(--k-fs-sm);
  line-height:1.5;
}
.k-alert__icon{ flex:0 0 auto; margin-top:1px; }
.k-alert__title{ font-weight:700; margin-bottom:2px; color:var(--k-text); }
.k-alert__body{ color:var(--k-text-2); }
.k-alert--up{ border-color:rgba(134,241,63,.28); background:var(--k-up-a); }
.k-alert--up .k-alert__icon{ color:var(--k-up); }
.k-alert--down{ border-color:rgba(255,82,87,.28); background:var(--k-down-a); }
.k-alert--down .k-alert__icon{ color:var(--k-down); }
.k-alert--warn{ border-color:rgba(255,176,32,.28); background:var(--k-warn-a); }
.k-alert--warn .k-alert__icon{ color:var(--k-warn); }
.k-alert--info{ border-color:rgba(77,212,255,.28); background:var(--k-info-a); }
.k-alert--info .k-alert__icon{ color:var(--k-info); }

/* Aviso de risco — obrigatorio nas telas de dinheiro */
.k-risk{
  display:flex;
  gap:var(--k-3);
  padding:var(--k-4) 0 0;
  margin-top:var(--k-4);
  border-top:1px solid var(--k-line);
  font-size:var(--k-fs-sm);
  color:var(--k-text-3);
  line-height:1.5;
}
.k-risk__icon{ flex:0 0 auto; color:var(--k-text-4); margin-top:2px; }

/* ==========================================================================
   21. MODAL
   ========================================================================== */

.k-modal{
  position:fixed;
  inset:0;
  z-index:var(--k-z-modal);
  display:grid;
  place-items:center;
  padding:var(--k-4);
  visibility:hidden;
  pointer-events:none;
}
.k-modal.is-open{ visibility:visible; pointer-events:auto; }
.k-modal__scrim{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.72);
  backdrop-filter:blur(4px);
  opacity:0;
  transition:opacity var(--k-med) var(--k-ease);
}
.k-modal.is-open .k-modal__scrim{ opacity:1; }
.k-modal__panel{
  position:relative;
  width:min(100%,480px);
  max-height:86dvh;
  overflow-y:auto;
  background:var(--k-surface-1);
  border:1px solid var(--k-line-2);
  border-radius:var(--k-r-xl);
  padding:var(--k-6);
  box-shadow:var(--k-shadow-3);
  transform:translateY(12px) scale(.98);
  opacity:0;
  transition:transform var(--k-med) var(--k-ease-out), opacity var(--k-med) var(--k-ease);
}
.k-modal.is-open .k-modal__panel{ transform:none; opacity:1; }
.k-modal__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:var(--k-3); margin-bottom:var(--k-4); }
.k-modal__title{ font-size:var(--k-fs-h3); font-weight:700; letter-spacing:-.02em; }
.k-modal__foot{ display:flex; gap:var(--k-3); margin-top:var(--k-6); }
.k-modal__foot .k-btn{ flex:1 1 0; }

/* Bottom sheet no mobile */
@media (max-width:639px){
  .k-modal{ place-items:end center; padding:0; }
  .k-modal__panel{
    width:100%;
    max-width:none;
    border-radius:var(--k-r-xl) var(--k-r-xl) 0 0;
    border-bottom:0;
    max-height:92dvh;
    padding-bottom:calc(var(--k-6) + env(safe-area-inset-bottom));
    transform:translateY(100%);
  }
  .k-modal.is-open .k-modal__panel{ transform:none; }
  .k-modal__panel::before{
    content:"";
    display:block;
    width:36px;height:4px;
    border-radius:99px;
    background:var(--k-line-3);
    margin:0 auto var(--k-5);
  }
}

/* ==========================================================================
   22. TOAST
   ========================================================================== */

.k-toasts{
  position:fixed;
  z-index:var(--k-z-toast);
  left:50%;
  bottom:calc(var(--k-bottomnav) + var(--k-4) + env(safe-area-inset-bottom));
  transform:translateX(-50%);
  display:flex;
  flex-direction:column;
  gap:var(--k-2);
  width:min(92vw,420px);
  pointer-events:none;
}
.k-toast{
  display:flex;
  align-items:center;
  gap:var(--k-3);
  padding:var(--k-3) var(--k-4);
  border-radius:var(--k-r);
  background:var(--k-surface-hi);
  border:1px solid var(--k-line-2);
  box-shadow:var(--k-shadow-3);
  font-size:var(--k-fs-sm);
  font-weight:550;
  pointer-events:auto;
  animation:k-toast-in var(--k-med) var(--k-ease-out);
}
.k-toast--up{ border-color:rgba(134,241,63,.4); }
.k-toast--up .k-toast__icon{ color:var(--k-up); }
.k-toast--down{ border-color:rgba(255,82,87,.4); }
.k-toast--down .k-toast__icon{ color:var(--k-down); }
.k-toast.is-leaving{ animation:k-toast-out var(--k-med) var(--k-ease) forwards; }

@keyframes k-toast-in{ from{ opacity:0; transform:translateY(10px) scale(.97); } }
@keyframes k-toast-out{ to{ opacity:0; transform:translateY(6px) scale(.98); } }

@media (min-width:1024px){
  .k-toasts{ left:auto; right:var(--k-6); bottom:var(--k-6); transform:none; }
}

/* ==========================================================================
   23. ESTADO VAZIO / SKELETON
   ========================================================================== */

.k-empty{
  text-align:center;
  padding:var(--k-9) var(--k-5);
}
.k-empty__art{
  width:96px;height:96px;
  margin:0 auto var(--k-5);
  display:grid;place-items:center;
  border-radius:var(--k-r-pill);
  background:var(--k-surface-2);
  border:1px solid var(--k-line);
  color:var(--k-text-4);
}
.k-empty__title{ font-size:var(--k-fs-h3); font-weight:700; margin-bottom:var(--k-2); }
.k-empty__desc{ color:var(--k-text-2); font-size:var(--k-fs-sm); max-width:36ch; margin:0 auto var(--k-5); line-height:1.55; }

.k-skel{
  background:linear-gradient(90deg,var(--k-surface-2) 25%,var(--k-surface-3) 37%,var(--k-surface-2) 63%);
  background-size:400% 100%;
  animation:k-shimmer 1.4s ease infinite;
  border-radius:var(--k-r-xs);
}
@keyframes k-shimmer{ 0%{ background-position:100% 50%; } 100%{ background-position:0 50%; } }

/* ==========================================================================
   24. CARROSSEL / SCROLLER
   ========================================================================== */

.k-scroller{
  display:flex;
  gap:var(--k-3);
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  padding-bottom:var(--k-1);
  margin-inline:calc(var(--k-gutter) * -1);
  padding-inline:var(--k-gutter);
}
.k-scroller::-webkit-scrollbar{ display:none; }
.k-scroller > *{ scroll-snap-align:start; flex:0 0 auto; }

/* ==========================================================================
   25. TOKEN / MOEDA
   ========================================================================== */

.k-coin{
  width:36px;height:36px;
  border-radius:var(--k-r-pill);
  flex:0 0 auto;
  display:grid;place-items:center;
  font-size:.625rem;
  font-weight:800;
  letter-spacing:-.02em;
  background:var(--k-surface-3);
  color:var(--k-text);
  overflow:hidden;
}
.k-coin--lg{ width:44px;height:44px;font-size:.75rem; }
.k-coin--sm{ width:28px;height:28px;font-size:.5rem; }
.k-coin--usdt{ background:#26A17B; color:#fff; }
.k-coin--usdc{ background:#2775CA; color:#fff; }
.k-coin--bnb{ background:#F3BA2F; color:#141414; }
.k-coin--btc{ background:#F7931A; color:#fff; }
.k-coin--brl{ background:#009B3A; color:#fff; }
.k-coin--bonus{ background:var(--k-lime); color:var(--k-lime-ink); }
.k-coin--eth{ background:#627EEA; color:#fff; }
.k-coin--sol{ background:#14F195; color:#0A1A02; }
.k-coin--ltc{ background:#A6A9AA; color:#fff; }

/* Endereco de carteira / hash */
.k-addr{
  font-family:var(--k-mono);
  font-size:var(--k-fs-sm);
  word-break:break-all;
  line-height:1.6;
  color:var(--k-text);
  background:var(--k-surface-2);
  border:1px solid var(--k-line);
  border-radius:var(--k-r-sm);
  padding:var(--k-3) var(--k-4);
}

/* ==========================================================================
   26. STEPPER
   ========================================================================== */

.k-stepper{ display:flex; flex-direction:column; }
.k-step{ display:flex; gap:var(--k-4); position:relative; padding-bottom:var(--k-6); }
.k-step:last-child{ padding-bottom:0; }
.k-step__rail{ display:flex; flex-direction:column; align-items:center; flex:0 0 auto; }
.k-step__num{
  width:30px;height:30px;
  border-radius:var(--k-r-pill);
  display:grid;place-items:center;
  font-size:var(--k-fs-sm);
  font-weight:800;
  background:var(--k-surface-3);
  color:var(--k-text-2);
  border:1px solid var(--k-line-2);
  z-index:1;
}
.k-step.is-active .k-step__num{ background:var(--k-lime); color:var(--k-lime-ink); border-color:var(--k-lime); }
.k-step.is-done .k-step__num{ background:var(--k-lime-a20); color:var(--k-lime); border-color:var(--k-lime-a35); }
.k-step__line{ flex:1 1 auto; width:1px; background:var(--k-line-2); margin:var(--k-1) 0; }
.k-step:last-child .k-step__line{ display:none; }
.k-step__body{ flex:1 1 auto; min-width:0; padding-top:3px; }
.k-step__title{ font-weight:700; margin-bottom:var(--k-1); }
.k-step__desc{ font-size:var(--k-fs-sm); color:var(--k-text-2); line-height:1.5; }

/* ==========================================================================
   27. RODAPE (assinatura do deck)
   ========================================================================== */

.k-foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--k-4);
  padding:var(--k-5) 0 0;
  margin-top:var(--k-8);
  border-top:1px solid var(--k-line);
  font-family:var(--k-mono);
  font-size:var(--k-fs-xs);
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--k-text-4);
  flex-wrap:wrap;
}

/* ==========================================================================
   27b. MODO PRIVACIDADE (esconder saldos)
   ========================================================================== */

body.k-private .k-sensitive{
  filter:blur(9px);
  user-select:none;
  pointer-events:none;
  transition:filter var(--k-fast) var(--k-ease);
}
body.k-private .k-sensitive:hover{ filter:blur(6px); }

.k-privacy-btn .k-privacy-btn__on{ display:none; }
body.k-private .k-privacy-btn .k-privacy-btn__on{ display:block; }
body.k-private .k-privacy-btn .k-privacy-btn__off{ display:none; }

/* ==========================================================================
   28. UTILITARIOS
   ========================================================================== */

.k-hide{ display:none !important; }
.k-sr{
  position:absolute;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
.k-truncate{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0; }
.k-nowrap{ white-space:nowrap; }
.k-center{ text-align:center; }
.k-right{ text-align:right; }
.k-full{ width:100%; }
.k-mt-0{ margin-top:0 !important; }
.k-mt-2{ margin-top:var(--k-2); }
.k-mt-3{ margin-top:var(--k-3); }
.k-mt-4{ margin-top:var(--k-4); }
.k-mt-5{ margin-top:var(--k-5); }
.k-mt-6{ margin-top:var(--k-6); }
.k-mb-0{ margin-bottom:0 !important; }
.k-mb-2{ margin-bottom:var(--k-2); }
.k-mb-3{ margin-bottom:var(--k-3); }
.k-mb-4{ margin-bottom:var(--k-4); }
.k-mb-5{ margin-bottom:var(--k-5); }
.k-mb-6{ margin-bottom:var(--k-6); }
.k-gap-2{ gap:var(--k-2); }
.k-gap-3{ gap:var(--k-3); }
.k-gap-4{ gap:var(--k-4); }
.k-flex1{ flex:1 1 auto; min-width:0; }

/* ==========================================================================
   29. RESPONSIVO
   ========================================================================== */

/* Tablet */
@media (min-width:640px){
  .k-grid--main{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .k-balance__split{ gap:var(--k-4); }
}

/* Desktop — sidebar entra, bottom nav sai */
@media (min-width:1024px){
  :root{ --k-bottomnav:0px; }

  .k-sidebar{ display:flex; }
  .k-bottomnav{ display:none; }

  .k-shell{ padding-left:var(--k-sidebar); }

  .k-topbar{
    padding-left:var(--k-6);
    padding-right:var(--k-6);
  }
  .k-topbar__inner{ max-width:none; }
  .k-topbar__brand{ display:none; }
  .k-topbar__menu{ display:none; }

  .k-main{
    padding:var(--k-7) var(--k-6) var(--k-9);
    max-width:1180px;
    margin-inline:0;
  }

  .k-grid--main{
    grid-template-columns:minmax(0,1.55fr) minmax(320px,1fr);
    gap:var(--k-5);
    align-items:start;
  }
  .k-grid--main > .k-span-2{ grid-column:1 / -1; }

  .k-balance{ padding:var(--k-6); }
  .k-balance__split{ grid-template-columns:repeat(3,minmax(0,1fr)); }

  .k-scroller{ margin-inline:0; padding-inline:0; flex-wrap:wrap; overflow:visible; }
  .k-scroller > *{ flex:1 1 240px; }

  .k-modal__panel{ width:min(100%,520px); }
}

/* Desktop largo */
@media (min-width:1440px){
  .k-main{ max-width:1320px; }
  .k-grid--main{ gap:var(--k-6); }
}

/* Impressao */
@media print{
  .k-sidebar,.k-bottomnav,.k-topbar,.k-toasts,.k-drawer{ display:none !important; }
  .k-shell{ padding:0; }
  body{ background:#fff; color:#000; }
  body::before{ display:none; }
}