/* =========================================================
   convert.css - GLB para prop FiveM
   ========================================================= */
.cv-hero{padding-bottom:10px}
.cv-body{padding:26px 0 10px}
.cv-hero h1{max-width:19ch}

/* ---------- dropzone ---------- */
.drop{
  position:relative;border:1.5px dashed rgba(255,174,31,.34);border-radius:20px;
  background:
    radial-gradient(120% 140% at 50% 0%, rgba(255,174,31,.07), transparent 60%),
    rgba(255,255,255,.022);
  padding:34px 20px;cursor:pointer;transition:.18s;text-align:center;
}
.drop:hover,.drop.over{border-color:#FFAE1F;background:rgba(255,174,31,.07)}
.drop.has{border-style:solid;border-color:rgba(255,174,31,.55);padding:22px 20px}
.drop-in{display:flex;flex-direction:column;align-items:center;gap:6px}
.drop-ic{
  width:46px;height:46px;border-radius:13px;display:grid;place-items:center;
  background:rgba(255,174,31,.12);color:#FFC46B;margin-bottom:4px;
}
.drop-ic svg{width:22px;height:22px}
.drop b{font-size:17px;font-family:var(--font-head)}
.drop .small{font-size:12.5px}
.drop.has .drop-ic{width:38px;height:38px}

/* ---------- estados ---------- */
.cv-empty{padding:26px 0 0}
.cv-empty .card h3{font-size:15.5px;margin-bottom:8px}
.cv-empty .card p{color:var(--muted);font-size:14px;line-height:1.6;margin:0}
.cv-empty .card b{color:var(--text);font-weight:600}

/* ---------- grelha de trabalho ---------- */
.cv-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:18px;margin-top:22px}
.cv-left,.cv-right{display:flex;flex-direction:column;gap:16px;min-width:0}

.panel{
  border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.024);
  padding:16px;min-width:0;
}
.panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.panel-head h3{font-size:14px;letter-spacing:.02em;text-transform:uppercase;color:var(--muted-2);margin:0;font-weight:600}
.hash{
  font-family:'JetBrains Mono',monospace;font-size:12px;color:#FFC46B;
  background:rgba(255,174,31,.1);border-radius:7px;padding:3px 8px;max-width:60%;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}

#cvPrev{
  width:100%;height:340px;display:block;border-radius:12px;
  background:radial-gradient(circle at 50% 30%, rgba(255,174,31,.06), rgba(5,10,26,.6));
  border:1px solid rgba(255,255,255,.05);cursor:grab;touch-action:none;
}
#cvPrev:active{cursor:grabbing}

.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px}
.stat{
  border:1px solid var(--line);border-radius:11px;padding:9px 10px;
  background:rgba(255,255,255,.02);min-width:0;
}
.stat span{display:block;font-size:11px;color:var(--muted-2);text-transform:uppercase;letter-spacing:.04em}
.stat b{display:block;font-family:var(--font-head);font-size:14.5px;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---------- avisos ---------- */
.warns{display:flex;flex-direction:column;gap:8px}
.w{
  display:flex;gap:9px;align-items:flex-start;border-radius:11px;padding:10px 12px;
  border:1px solid var(--line);background:rgba(255,255,255,.02);font-size:13.3px;line-height:1.5;
}
.w b{font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;padding-top:2px;white-space:nowrap}
.w.erro{border-color:rgba(255,90,90,.4);background:rgba(255,90,90,.07)}
.w.erro b{color:#FF8A8A}
.w.aviso{border-color:rgba(255,174,31,.35);background:rgba(255,174,31,.06)}
.w.aviso b{color:#FFC46B}
.w.info b{color:#8FB6FF}
.w.ok{border-color:rgba(80,220,150,.35);background:rgba(80,220,150,.06)}
.w.ok b{color:#6FE3AC}
.w span{color:var(--muted)}

/* ---------- formulário ---------- */
.field{display:flex;flex-direction:column;gap:5px;margin-bottom:13px;min-width:0}
.field label{font-size:12.5px;color:var(--muted);font-weight:500}
.field label b{color:#FFC46B;font-family:'JetBrains Mono',monospace;font-weight:500}
.hint{font-size:12px;color:var(--muted-2);line-height:1.45}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.checks{display:flex;flex-direction:column;gap:8px;padding-top:4px}
.chk{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);cursor:pointer}
.chk input{accent-color:#FFAE1F;width:15px;height:15px}
.chk code{font-size:12px}

/* ---------- árvore de ficheiros ---------- */
.tree{
  font-family:'JetBrains Mono',monospace;font-size:12.5px;border:1px solid var(--line);
  border-radius:11px;padding:8px 4px;background:rgba(5,10,26,.5);margin-bottom:12px;
  max-height:210px;overflow:auto;
}
.frow{display:flex;align-items:center;gap:7px;padding:3px 8px;border-radius:6px}
.frow .fi{color:var(--muted-2);width:10px}
.frow .fn{color:var(--text);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.frow .fs{color:var(--muted-2);font-size:11px}
.frow.miss .fn{color:#FFC46B}
.frow.miss .fs{color:#FFAE1F}

.code-row{display:flex;gap:8px;align-items:center;margin-bottom:12px}
.code-row .code{flex:1;margin:0;overflow:auto;white-space:nowrap}
.btn.wide{width:100%;justify-content:center}
.tiny{font-size:11.5px;margin-top:9px;line-height:1.5}

/* ---------- passos ---------- */
.cv-steps{padding:46px 0 10px}
.sec-title{font-family:var(--font-head);font-size:clamp(21px,2.4vw,27px);margin:0 0 20px}
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.step{border:1px solid var(--line);border-radius:16px;padding:16px;background:rgba(255,255,255,.022)}
.step .num{font-family:'JetBrains Mono',monospace;font-size:12px;color:#FFAE1F;letter-spacing:.08em}
.step h3{font-size:15px;margin:6px 0 7px}
.step p{color:var(--muted);font-size:13.6px;line-height:1.6;margin:0}

.callout{
  margin-top:16px;border:1px solid rgba(255,174,31,.28);border-radius:16px;
  background:linear-gradient(180deg,rgba(255,174,31,.07),rgba(255,174,31,.02));padding:16px 18px;
}
.callout b{display:block;font-family:var(--font-head);font-size:14.5px;margin-bottom:6px}
.callout p{color:var(--muted);font-size:13.8px;line-height:1.65;margin:0}

/* ---------- faq ---------- */
.cv-faq{padding:40px 0 20px}

/* ---------- responsivo ---------- */
@media (max-width:980px){
  .cv-grid{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
  #cvPrev{height:280px}
}
@media (max-width:600px){
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .row2{grid-template-columns:1fr}
  .cv-hero h1{max-width:none}
  .panel{padding:13px}
}

/* ---- preview 3D do prop ---- */
.pv3d{position:relative;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:radial-gradient(circle at 50% 35%, #101a33 0%, #070d1f 72%)}
.pv3d:fullscreen{border-radius:0}
#cv3d{display:block;width:100%;height:360px;touch-action:none;cursor:grab}
#cv3d:active{cursor:grabbing}
.pv3d:fullscreen #cv3d{height:calc(100vh - 46px)}
.pv3d-bar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:7px 10px;border-bottom:1px solid rgba(255,255,255,.06);background:rgba(5,10,26,.5)}
.pv3d-tag{display:flex;align-items:center;gap:6px;font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:#FFC46B;font-weight:600}
.pv3d-tag svg{width:14px;height:14px}
.pv3d-btns{display:flex;gap:4px}
.pvbtn{width:24px;height:22px;border-radius:6px;border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--muted);font-size:11px;line-height:1;cursor:pointer;display:grid;place-items:center;padding:0}
.pvbtn:hover{border-color:rgba(255,174,31,.45);color:#FFC46B}
.pvbtn.on{background:rgba(255,174,31,.14);border-color:rgba(255,174,31,.55);color:#FFC46B}
.pv3d-hint{position:absolute;left:10px;bottom:8px;font-size:10.5px;color:var(--muted-2);pointer-events:none}