:root{
  --bg:#0b0f14;
  --card:#111827;
  --muted:#93a4c7;
  --text:#e8eef7;
  --line:#223049;
  --blue:#2563eb;
}
*{ box-sizing:border-box; }
body{ margin:0; font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial; background:var(--bg); color:var(--text); }
.wrap{ max-width: 980px; margin: 0 auto; padding: 16px; padding-bottom: 90px; }
.hidden{ display:none !important; }

.topbar{
  display:flex; justify-content:space-between; align-items:center;
  gap:12px; padding: 14px 16px; border-bottom:1px solid var(--line);
  position: sticky; top:0; background:rgba(11,15,20,.92); backdrop-filter: blur(6px);
}
.brand__title{ font-size:20px; font-weight:800; }
.brand__sub{ font-size:12px; color:var(--muted); margin-top:2px; }
.topbar__right{ display:flex; align-items:center; gap:10px; }

.pill{ font-size:12px; padding:6px 10px; border:1px solid var(--line); border-radius:999px; color:var(--muted); }

.card{
  background:var(--card); border:1px solid var(--line); border-radius: 14px;
  padding: 16px; margin: 12px 0;
}
.row{ display:flex; gap:12px; flex-wrap:wrap; }
.col{ flex:1 1 260px; }
label{ display:block; font-size:12px; color:var(--muted); margin-bottom:6px; }
input, select, textarea{
  width:100%; padding:10px; border-radius:10px; border:1px solid #2a3b5a;
  background:#0b1220; color:var(--text);
}
textarea{ min-height: 80px; }

.btn{ width:100%; padding:10px; border-radius:10px; border:1px solid #2a3b5a; background:#0b1220; color:var(--text); font-weight:700; cursor:pointer; }
.btn-primary{ background:var(--blue); border-color:var(--blue); }
.btn-ghost{ background:transparent; }

.muted{ color:var(--muted); font-size:13px; }

.bottomnav{
  position:fixed; left:0; right:0; bottom:0;
  display:flex; gap:8px; padding: 10px; background:rgba(11,15,20,.92);
  border-top:1px solid var(--line);
}
.bottomnav a{
  flex:1; text-align:center; padding:10px; border-radius:12px;
  border:1px solid var(--line); color:var(--muted); text-decoration:none; font-weight:700; font-size:13px;
}
.bottomnav a.active{ color:var(--text); border-color:#3a517a; }

/* ============================
   Ações do formulário (Create)
   ============================ */

.actions{
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 12px;
}

/* Botão secundário */
.btn-secondary{
  width:100%;
  padding:10px;
  border-radius:10px;
  border:1px dashed #3a517a;
  background:transparent;
  color:var(--muted);
  font-weight:700;
  cursor:pointer;
}

/* Estados desabilitados */
button:disabled,
.btn-secondary:disabled{
  opacity: 0.45;
  cursor: not-allowed;
}

/* Feedback de carregamento */
button:disabled{
  filter: saturate(0.8);
}

/* Texto de ajuda abaixo dos botões */
.hint{
  font-size:12px;
  color:var(--muted);
  min-height: 16px;
}

/* Em telas maiores, botões lado a lado */
@media (min-width: 640px){
  .actions{
    flex-direction: row;
  }
  .actions button{
    flex:1;
  }
}