*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}

body{
  background:var(--surface-app);
  color:var(--text-primary);
  font-family:var(--font-body);
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
}


.topbar{
  display:flex;align-items:center;gap:9px;
  height:58px;padding:0 20px;
  position:sticky;top:0;z-index:100;
  background:var(--surface-card);
  border-bottom:1px solid var(--border-subtle);
}
.topbar .logo-mark{width:24px;height:24px;display:block;flex-shrink:0}
.topbar .logo{flex:1}

.content{max-width:520px;margin:0 auto;padding:20px 20px 40px}


.tela-titulo{
  font:600 26px/1.15 var(--font-display);
  letter-spacing:var(--letter-display);
  color:var(--text-primary);
}
.tela-sub{
  font:var(--text-body-sm);color:var(--text-secondary);
  margin-top:6px;margin-bottom:20px;line-height:1.55;
}


.bloco{
  background:var(--surface-card);
  border:1px solid var(--border-subtle);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-card);
  padding:16px;margin-bottom:12px;
}
.bloco-titulo{
  font:var(--text-overline);letter-spacing:var(--letter-overline);
  text-transform:uppercase;color:var(--text-tertiary);
  margin-bottom:12px;
}

.linha{
  display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding:8px 0;border-bottom:1px solid var(--border-subtle);
  font:var(--text-body-sm);
}
.linha:last-child{border-bottom:none}
.linha-lbl{color:var(--text-tertiary)}
.linha-val{color:var(--text-primary);font-weight:600;text-align:right}


.status-pill{
  padding:4px 11px;border-radius:var(--radius-pill);
  font:var(--text-caption);font-weight:600;white-space:nowrap;
}
.status-TRIAL{background:var(--orange-tint-20);color:var(--text-accent-brand)}
.status-ATIVO{background:rgba(63,143,94,.18);color:var(--text-accent-success)}
.status-TRIAL_ESGOTADO,
.status-INADIMPLENTE{background:rgba(192,64,46,.18);color:var(--text-accent-danger)}
.status-CANCELADO{background:rgba(255,255,255,.08);color:var(--text-tertiary)}


.barra-wrap{
  background:var(--border-subtle);border-radius:var(--radius-pill);
  height:6px;margin:10px 0 5px;overflow:hidden;
}
.barra{height:6px;border-radius:var(--radius-pill);background:var(--accent-primary);transition:width .4s ease}
.barra.cheia{background:var(--danger)}
.barra-legenda{font:var(--text-caption);color:var(--text-tertiary);text-align:right}


.btn,.btn-sec,.btn-ghost{
  width:100%;display:block;cursor:pointer;
  border-radius:var(--radius-md);
  font:600 15px/1 var(--font-body);
  padding:15px;text-align:center;
  transition:background .15s,border-color .15s,color .15s;
}
.btn{
  background:var(--accent-primary);color:var(--text-on-accent);border:0;
  box-shadow:var(--shadow-glow-accent);
}
.btn:hover{background:var(--accent-primary-hover)}
.btn-sec{
  background:transparent;color:var(--text-accent-brand);
  border:1px solid var(--accent-primary);
}
.btn-sec:hover{background:var(--orange-tint-10)}
.btn-ghost{
  background:transparent;color:var(--text-tertiary);
  border:1px solid var(--border-default);
  font-weight:500;font-size:14px;
}
.btn-ghost:hover{color:var(--text-primary);border-color:var(--border-strong)}
.btn+.btn,.btn+.btn-sec,.btn+.btn-ghost,
.btn-sec+.btn,.btn-sec+.btn-sec,.btn-sec+.btn-ghost,
.btn-ghost+.btn,.btn-ghost+.btn-sec,.btn-ghost+.btn-ghost{margin-top:8px}
.btn:disabled,.btn-sec:disabled,.btn-ghost:disabled{opacity:.5;cursor:not-allowed}


.btn-lista{text-align:left;font-weight:500}


.tabs{display:flex;gap:6px;margin-bottom:18px}
.tab{
  flex:1;padding:10px 6px;cursor:pointer;
  border-radius:var(--radius-md);
  border:1px solid var(--border-subtle);
  background:var(--surface-card);color:var(--text-tertiary);
  font:600 12px/1.2 var(--font-body);
  transition:.15s;
}
.tab:hover{color:var(--text-secondary);border-color:var(--border-default)}
.tab.active{
  background:var(--orange-tint-10);
  border-color:var(--text-accent-brand);
  color:var(--text-accent-brand);
}


.sec-lbl{
  font:var(--text-overline);letter-spacing:var(--letter-overline);
  text-transform:uppercase;color:var(--text-tertiary);
  margin-bottom:10px;
}
.divider{height:1px;background:var(--border-subtle);margin:20px 0;border:0}
.empty,.loading{
  text-align:center;font:var(--text-body-sm);color:var(--text-tertiary);
  padding:24px 8px;line-height:1.6;
}
.erro{
  background:rgba(192,64,46,.14);border:1px solid rgba(192,64,46,.5);
  border-radius:var(--radius-md);color:var(--text-accent-danger);
  font:var(--text-body-sm);font-weight:600;
  padding:12px 14px;text-align:center;
}
.back-link{
  display:block;text-align:center;text-decoration:none;
  font:var(--text-body-sm);color:var(--text-tertiary);
  padding:10px;
}
.back-link:hover{color:var(--text-accent-brand)}
.assinatura{
  text-align:center;font:var(--text-caption);
  color:var(--text-disabled);margin-top:18px;
}