/* Compositor 3D — tema integrado ao Surface Studio */
#c3d-overlay{
  position:fixed; inset:0; z-index:9999; display:none;
  background:#18191c;
}
#c3d-stage{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  background:#0a0b0d;
}
#c3d-out{ max-width:100%; max-height:100%; display:block; }
#c3d-gl{ position:absolute; top:-99999px; left:-99999px; width:1024px; height:1024px; }

#c3d-panel{
  position:absolute; top:16px; left:16px; width:312px; max-height:calc(100vh - 32px);
  overflow:auto; z-index:2;
  background:#1e1f22; border:1px solid #3a3d42; border-radius:14px;
  box-shadow:0 12px 40px rgba(0,0,0,.55);
  font-family:system-ui,'Segoe UI',sans-serif; color:#e2e8f0;
}
.c3d-head{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 16px; border-bottom:1px solid #2b2d31;
  background:linear-gradient(135deg,#6366f1,#8b5cf6);
  border-radius:14px 14px 0 0;
}
.c3d-title{ font-size:14px; font-weight:700; color:#fff; letter-spacing:.2px; }
.c3d-x{
  background:rgba(255,255,255,.18); border:none; color:#fff; cursor:pointer;
  width:26px; height:26px; border-radius:7px; font-size:13px; line-height:1;
  transition:background .15s;
}
.c3d-x:hover{ background:rgba(255,255,255,.34); }

.c3d-status{
  margin:14px 16px; padding:10px 12px; border-radius:8px;
  background:#25272a; border:1px solid #3a3d42;
  font-size:12px; color:#fbbf24; text-align:center;
}
.c3d-ctrls{ padding:6px 16px 18px; }
.c3d-step{
  font-size:11px; color:#a78bfa; text-transform:uppercase; letter-spacing:.6px;
  font-weight:700; margin:10px 0 10px;
}
.c3d-row{ margin:11px 0; }
.c3d-row label{
  display:block; font-size:11px; color:#94a3b8; margin-bottom:5px;
  text-transform:uppercase; letter-spacing:.4px;
}
.c3d-val{ float:right; color:#a78bfa; font-weight:600; }
.c3d-row input[type=range]{
  width:100%; height:5px; border-radius:4px; -webkit-appearance:none;
  background:#3a3d42; outline:none; cursor:pointer;
}
.c3d-row input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none; width:16px; height:16px; border-radius:50%;
  background:linear-gradient(135deg,#6366f1,#8b5cf6); cursor:pointer;
  box-shadow:0 1px 4px rgba(0,0,0,.4);
}
.c3d-row input[type=range]::-moz-range-thumb{
  width:16px; height:16px; border:none; border-radius:50%;
  background:#7c3aed; cursor:pointer;
}
.c3d-btn-alt, .c3d-btn-dl{
  width:100%; padding:11px; border:none; border-radius:9px; cursor:pointer;
  font-size:12px; font-weight:600; margin-top:9px; transition:filter .15s, background .15s;
}
.c3d-btn-alt{ background:#2a2d31; border:1px solid #3a3d42; color:#e2e8f0; }
.c3d-btn-alt:hover{ background:#34373c; }
.c3d-btn-dl{ background:linear-gradient(135deg,#6366f1,#8b5cf6); color:#fff; }
.c3d-btn-dl:hover{ filter:brightness(1.08); }

@media(max-width:640px){
  #c3d-panel{ width:calc(100vw - 24px); left:12px; top:12px; max-height:46vh; }
}
.c3d-btn-ia{
  width:100%; padding:11px; border:none; border-radius:9px; cursor:pointer;
  font-size:12px; font-weight:600; margin-top:9px; transition:filter .15s;
  background:linear-gradient(135deg,#f59e0b,#ec4899); color:#fff;
}
.c3d-btn-ia:hover{ filter:brightness(1.08); }
.c3d-btn-ia:disabled{ opacity:.7; cursor:not-allowed; }