:root{
  --verde:#15803d; --verde-2:#166534; --bg:#f7f7f5; --card:#ffffff;
  --texto:#1c1c1c; --suave:#6b7280; --borda:#e5e7eb; --perigo:#dc2626;
  --sombra:0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.04);
  --raio:16px;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  background:var(--bg); color:var(--texto);
  -webkit-font-smoothing:antialiased;
  padding-bottom:calc(env(safe-area-inset-bottom) + 90px);
}
.hidden{display:none !important;}

.topbar{
  background:var(--verde); color:#fff;
  padding:calc(env(safe-area-inset-top) + 16px) 20px 16px;
  position:sticky; top:0; z-index:10;
}
.topbar h1{margin:0; font-size:1.5rem; letter-spacing:-.02em;}
.topbar__sub{margin:.2rem 0 0; font-size:.85rem; opacity:.85;}

.lista{padding:16px; display:flex; flex-direction:column; gap:12px;}

.card{
  background:var(--card); border-radius:var(--raio); box-shadow:var(--sombra);
  display:flex; overflow:hidden; align-items:stretch; cursor:pointer;
  transition:transform .08s ease;
}
.card:active{transform:scale(.99);}
.card__img{width:92px; height:92px; object-fit:cover; background:#eef2f0; flex:0 0 auto;}
.card__img--vazia{display:flex; align-items:center; justify-content:center; font-size:1.9rem;}
.card__body{padding:12px 14px; flex:1; min-width:0; display:flex; flex-direction:column; justify-content:center;}
.card__titulo{font-weight:600; font-size:1.05rem; margin:0 0 3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.card__meta{color:var(--suave); font-size:.88rem;}
.card__valor{margin-top:4px; font-size:.95rem;}
.card__valor b{color:var(--verde-2);}
.card__peca{color:var(--suave); font-size:.82rem;}

.fab{
  position:fixed; right:20px; bottom:calc(env(safe-area-inset-bottom) + 20px);
  width:60px; height:60px; border-radius:50%; border:none;
  background:var(--verde); color:#fff; font-size:2rem; line-height:1;
  box-shadow:0 6px 16px rgba(21,128,61,.4); z-index:20; cursor:pointer;
}
.fab:active{transform:scale(.94);}

.vazio{padding:56px 32px; text-align:center; color:var(--suave);}
.vazio__emoji{font-size:3rem;}
.vazio__dica{font-size:.9rem; line-height:1.5;}

/* Painel do formulário */
.painel{
  position:fixed; inset:0; background:var(--bg); z-index:30;
  display:flex; flex-direction:column; overflow-y:auto;
  animation:sobe .18s ease;
}
@keyframes sobe{from{transform:translateY(24px); opacity:.4;} to{transform:none; opacity:1;}}
.painel__head{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:calc(env(safe-area-inset-top) + 12px) 12px 12px;
  background:var(--card); border-bottom:1px solid var(--borda);
  position:sticky; top:0; z-index:2;
}
.painel__head h2{font-size:1.05rem; margin:0; text-align:center; flex:1;}
.btn-texto{background:none; border:none; font-size:1rem; color:var(--suave); padding:6px 8px; cursor:pointer; white-space:nowrap;}
.btn-texto--forte{color:var(--verde); font-weight:600;}
.btn-texto:disabled{opacity:.5;}

.form{padding:16px; display:flex; flex-direction:column; gap:16px; max-width:560px; width:100%; margin:0 auto;}
.foto{
  display:block; border:2px dashed var(--borda); border-radius:var(--raio);
  background:var(--card); aspect-ratio:4/3; overflow:hidden; position:relative; cursor:pointer;
}
.foto__img{width:100%; height:100%; object-fit:cover; display:block;}
.foto__placeholder{
  position:absolute; inset:0; display:flex; flex-direction:column; gap:8px;
  align-items:center; justify-content:center; color:var(--suave);
}
.foto__icon{font-size:2.4rem;}

.campo{display:flex; flex-direction:column; gap:6px; font-size:.9rem; color:var(--suave);}
.campo input, .campo select{
  font-size:1.05rem; color:var(--texto); padding:12px 14px;
  border:1px solid var(--borda); border-radius:12px; background:var(--card); width:100%;
  -webkit-appearance:none; appearance:none;
}
.campo input:focus, .campo select:focus{outline:2px solid var(--verde); border-color:transparent;}
.linha{display:grid; grid-template-columns:1fr 1fr; gap:12px;}
.linha3{display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px; margin-top:12px;}
.por-peca{margin:-6px 2px 0; font-size:.85rem; color:var(--verde-2); min-height:1.1em; font-weight:500;}

.dimensoes{background:var(--card); border:1px solid var(--borda); border-radius:12px; padding:12px 14px;}
.dimensoes summary{cursor:pointer; color:var(--suave); font-size:.9rem;}

.btn-eliminar{
  margin-top:8px; background:none; border:1px solid var(--perigo); color:var(--perigo);
  padding:12px; border-radius:12px; font-size:1rem; cursor:pointer;
}
.btn-eliminar:active{background:rgba(220,38,38,.06);}

.toast{
  position:fixed; left:50%; bottom:96px; transform:translateX(-50%);
  background:#111; color:#fff; padding:10px 18px; border-radius:999px;
  font-size:.9rem; z-index:50; box-shadow:var(--sombra); max-width:90%; text-align:center;
}