.vcw-shell{
  position:fixed; top:0; right:0; width:min(760px,42vw); height:100vh;
  background:#0d0c0a; border-left:1px solid rgba(255,215,105,.28);
  box-shadow:-24px 0 60px rgba(0,0,0,.48); z-index:80;
  transform:translateX(105%); transition:transform .22s ease;
  display:flex; flex-direction:column; color:#f6e9b7;
}
.vcw-shell.open{transform:translateX(0)}
.vcw-head{height:54px; display:flex; align-items:center; justify-content:space-between; padding:0 14px 0 18px; border-bottom:1px solid rgba(255,215,105,.2); background:rgba(27,22,14,.95)}
.vcw-title{font-weight:800; letter-spacing:.03em}
.vcw-actions{display:flex; gap:8px; align-items:center}
.vcw-mode,.vcw-close{border:1px solid rgba(255,215,105,.32); background:#19150e; color:#f6e9b7; border-radius:10px; height:34px; min-width:38px; cursor:pointer; font-weight:800}
.vcw-mode.active{background:#f5d96d; color:#16120b}
.vcw-close{font-size:22px; line-height:1}
.vcw-body{position:relative; flex:1; overflow:hidden}
.vcw-preview{width:100%; height:100%; border:0; background:#fff}
.vcw-code{box-sizing:border-box; width:100%; height:100%; margin:0; overflow:auto; padding:18px; background:#050505; color:#e8e2ca; font-size:13px; line-height:1.55; white-space:pre-wrap}
.vcg-progress-card{display:inline-block; min-width:260px; padding:14px 18px; border:1px solid rgba(245,217,109,.22); background:rgba(28,24,16,.92); border-radius:16px; color:#e9d992; box-shadow:0 12px 30px rgba(0,0,0,.28)}
.vcg-step{opacity:.45; padding:4px 0; transition:opacity .2s ease, transform .2s ease}
.vcg-step.active{opacity:1; transform:translateX(3px); color:#fff2b0}
.vcg-step.done{opacity:1; color:#f5d96d}
.vcg-arrow{opacity:.5; padding-left:28px; line-height:1}
.vcg-download-card{margin-top:8px; display:inline-flex; gap:6px; align-items:center; padding:9px 12px; border-radius:12px; border:1px solid rgba(245,217,109,.28); background:rgba(24,20,14,.9); color:#f6e9b7; font-size:13px}
.vcg-download-card a{color:#ffe77a; font-weight:800; text-decoration:none}
.vcg-chat-summary{padding:2px 0;color:#f6e9b7}
@media(max-width:1100px){.vcw-shell{width:100vw}}


/* Valerie Option B real CodeGen progress */
.vcg-progress-title{
  font-weight:800;
  letter-spacing:.03em;
  color:#fff2b0;
  margin-bottom:10px;
}
.vcg-step{
  display:flex;
  align-items:center;
  gap:8px;
}
.vcg-dot{
  width:18px;
  display:inline-flex;
  justify-content:center;
  color:rgba(245,217,109,.55);
}
.vcg-step.done .vcg-dot{
  color:#7ee787;
}
.vcg-step.active .vcg-dot{
  color:#f5d96d;
}
.vcg-step.failed{
  color:#ffb2a4 !important;
}
.vcg-step.failed .vcg-dot{
  color:#ff6b6b;
}
.vcg-progress-detail{
  margin-top:10px;
  padding-top:10px;
  border-top:1px solid rgba(245,217,109,.14);
  color:rgba(246,233,183,.72);
  font-size:12px;
  line-height:1.45;
}


/* Compact CodeGen status: no big progress card */
.vcg-progress-row{
  width: fit-content;
  max-width: 520px;
}
.vcg-progress-row .vcg-progress-card,
.vcg-progress-row .vcg-step,
.vcg-progress-row .vcg-arrow,
.vcg-progress-row .vcg-progress-title{
  display:none !important;
}
.vcg-inline-status{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:22px;
  padding:7px 11px;
  border:1px solid rgba(212,175,55,.18);
  border-radius:999px;
  background:rgba(20,16,10,.72);
  color:#d8c276;
  font-size:12px;
  letter-spacing:.02em;
  box-shadow:0 0 20px rgba(212,175,55,.08);
}
.vcg-inline-status::before{
  content:"";
  width:6px;
  height:6px;
  border-radius:50%;
  background:#d8c276;
  box-shadow:0 0 10px rgba(216,194,118,.8);
  animation:vcgPulse 1.1s ease-in-out infinite;
}
.vcg-failed .vcg-inline-status{
  color:#ffb4a8;
  border-color:rgba(255,120,92,.35);
}
.vcg-failed .vcg-inline-status::before{
  background:#ff7860;
}
@keyframes vcgPulse{0%,100%{opacity:.35;transform:scale(.75)}50%{opacity:1;transform:scale(1)}}


/* V3 gaming scope: legacy CodeGen workspace/card must never surface. */
.vcw-shell,
.vcg-progress-card,
.vcg-download-card{
  display:none !important;
}