.vx-shell {
  position:relative;
  z-index:1;
  max-width:1180px;
  margin:30px auto 56px;
  padding:24px;
  color:#f8fafc;
  background:radial-gradient(circle at 12% 4%, rgba(20,184,166,.24), transparent 30%),radial-gradient(circle at 88% 15%, rgba(59,130,246,.28), transparent 34%),#071426;
  border:1px solid #27436b;
  border-radius:22px;
  box-shadow:0 22px 55px rgba(2,6,23,.4);
}

.vx-stage { max-width:1040px; margin:auto; }
.vx-stage-head,.vx-result-head,.vx-result-actions,.vx-inline-actions { display:flex; align-items:center; gap:12px; }
.vx-stage-head { justify-content:space-between; margin-bottom:14px; }
.vx-kicker { margin:0 0 6px; color:#67e8f9; font-size:12px; font-weight:800; letter-spacing:.15em; }
.vx-shell h1,.vx-shell h2 { margin:0; color:#fff; font-weight:800; }
.vx-shell h1 { font-size:clamp(28px,5vw,44px); letter-spacing:-.04em; }
.vx-shell h2 { font-size:20px; }
.vx-intro,.vx-notice,.vx-status,.vx-shell small { color:#cbd5e1; line-height:1.6; }
.vx-intro { margin:8px 0 0; }
.vx-notice { margin:0 0 20px; padding:11px 14px; color:#fde68a; background:#18233a; border-left:3px solid #facc15; }

.vx-grid { display:grid; grid-template-columns:minmax(260px,.9fr) minmax(320px,1.1fr); gap:22px; align-items:start; }
.vx-visual-column { display:grid; gap:22px; align-content:start; }
.vx-avatar-panel,.vx-controls,.vx-result { padding:20px; background:rgba(10,27,51,.9); border:1px solid #315783; border-radius:18px; }
.vx-avatar-panel { text-align:center; }
.vx-avatar-frame { display:grid; min-height:0; place-items:center; overflow:hidden; border:1px solid #3b6391; border-radius:14px; background:linear-gradient(145deg,#162d4f,#0a1b33); }
.vx-avatar-frame img { display:block; width:100%; max-width:340px; height:auto; }
.vx-visual-column:has(.vx-result[hidden]) .vx-avatar-frame img { max-width:440px; }
.vx-controls label { display:block; margin:0 0 7px; color:#e2e8f0; font-weight:700; }
.vx-controls textarea,.vx-controls select,.vx-controls input { width:100%; margin:0 0 14px; padding:10px 12px; color:#f8fafc; background:#0b1d36; border:1px solid #5679a7; border-radius:9px; }
.vx-controls textarea { resize:vertical; min-height:96px; }
.vx-controls select,.vx-controls input { min-height:40px; }
.vx-settings { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.vx-inline-actions { flex-wrap:wrap; margin:-2px 0 17px; }

.vx-shell button,.vx-shell a { min-height:40px; }
.vx-shell button { padding:9px 14px; font-weight:700; border-radius:9px; cursor:pointer; }
.vx-primary,.vx-download { display:inline-flex; align-items:center; justify-content:center; padding:9px 16px; color:#06202a!important; background:#67e8f9; border:1px solid #a5f3fc; font-weight:800; text-decoration:none!important; }
.vx-primary { width:100%; }
.vx-secondary,.vx-admin-link,.vx-back-link { color:#eff6ff!important; background:#12345d; border:1px solid #78a7db; text-decoration:none!important; }
.vx-admin-link,.vx-back-link { display:inline-flex; align-items:center; justify-content:center; padding:8px 13px; border-radius:9px; font-weight:700; }
.vx-shell button:hover,.vx-shell a:hover { filter:brightness(1.12); }
.vx-shell :focus-visible { outline:3px solid #facc15; outline-offset:3px; }

.vx-status { min-height:25px; margin:13px 0 0; font-weight:700; }
.vx-job-progress { margin-top:14px; padding:11px 13px; border:1px solid #315783; border-radius:10px; background:#0b1d36; }
.vx-job-progress-head,.vx-job-progress-steps { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.vx-job-progress-head { color:#dbeafe; font-size:13px; }
.vx-job-progress-head span { color:#93c5fd; font-variant-numeric:tabular-nums; white-space:nowrap; }
.vx-job-progress-track { height:5px; margin:10px 0; overflow:hidden; border-radius:999px; background:#27436b; }
.vx-job-progress-track span { display:block; width:34%; height:100%; border-radius:inherit; background:#67e8f9; animation:vx-job-progress 1.3s ease-in-out infinite; }
.vx-job-progress-steps { margin:0; padding:0; list-style:none; color:#7f97b8; font-size:12px; }
.vx-job-progress-steps li.is-done,.vx-job-progress-steps li.is-current { color:#a5f3fc; font-weight:700; }
.vx-job-progress-steps li.is-current::before { content:'● '; }
@keyframes vx-job-progress { 0% { transform:translateX(-110%); } 100% { transform:translateX(325%); } }
@media (prefers-reduced-motion:reduce) { .vx-job-progress-track span { width:100%; animation:none; } }
.vx-result { margin-top:22px; }
.vx-visual-column .vx-result { margin-top:0; }
.vx-result-head { justify-content:space-between; margin-bottom:12px; }
.vx-result-head span { color:#bae6fd; font-variant-numeric:tabular-nums; }
#vxResultWave { min-height:80px; padding:5px 0; border-top:1px solid #315783; border-bottom:1px solid #315783; }
.vx-result-actions { justify-content:space-between; margin-top:14px; }

.vx-admin { max-width:1450px; color:#f8fafc; }
.vx-admin .vx-stage { max-width:none; }
.vx-admin .table { color:#f8fafc; background:#0b1d36; border-color:#456991; }
.vx-admin .table { min-width:920px; width:100%; table-layout:fixed; margin-bottom:0; }
.vx-admin .table > thead > tr > th,.vx-admin .table > tbody > tr > td { border-color:#456991; white-space:normal; overflow-wrap:anywhere; vertical-align:top; }
.vx-admin .table > tbody > tr:hover > td { color:#fff; background:#12345d; }
.vx-admin-table-wrap { border:1px solid #456991; border-radius:12px; }
.vx-admin .table > thead > tr > th:nth-child(1),.vx-admin .table > tbody > tr > td:nth-child(1) { width:11%; }
.vx-admin .table > thead > tr > th:nth-child(2),.vx-admin .table > tbody > tr > td:nth-child(2) { width:20%; }
.vx-admin .table > thead > tr > th:nth-child(3),.vx-admin .table > tbody > tr > td:nth-child(3) { width:14%; }
.vx-admin .table > thead > tr > th:nth-child(4),.vx-admin .table > tbody > tr > td:nth-child(4) { width:36%; }
.vx-admin .table > thead > tr > th:nth-child(5),.vx-admin .table > tbody > tr > td:nth-child(5) { width:19%; }
.vx-admin-muted,.vx-admin-meta { color:#cbd5e1; font-size:12px; line-height:1.55; }
.vx-admin-content { line-height:1.55; }
.vx-admin-content + .vx-admin-content { margin-top:8px; padding-top:8px; border-top:1px solid #315783; }
.vx-admin-actions { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:4px; margin-top:8px; }
.vx-admin-actions .vx-secondary { display:flex; min-height:32px; align-items:center; justify-content:center; padding:4px 2px; font-size:13px; white-space:nowrap; }

@media (max-width:850px) {
  .vx-grid { grid-template-columns:1fr; }
}

@media (max-width:560px) {
  .vx-shell { margin:16px 10px 34px; padding:16px; border-radius:16px; }
  .vx-stage-head,.vx-result-actions { align-items:stretch; flex-direction:column; }
  .vx-settings { grid-template-columns:1fr; gap:0; }
  .vx-admin-link,.vx-download { width:100%; }
}