/* ============================================================
   VIBRA CITY EXPANSION ENGINE — CSS v1.0
   PR #50 — Auto-bootstrap cities: input → full urban stack
   ============================================================ */

/* ─── Panel ─────────────────────────────────────────────── */
#vce-panel {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 200;
  background: #06040f;
  flex-direction: column;
  overflow: hidden;
}
#vce-panel.vce-open { display: flex; }

/* ─── Header ─────────────────────────────────────────────── */
.vce-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .9rem 1rem .7rem;
  border-bottom: 1px solid rgba(138,87,255,.2);
  flex-shrink: 0;
  background: rgba(9,6,18,.98);
}
.vce-header-left { display: flex; align-items: center; gap: .7rem; }
.vce-icon { font-size: 1.4rem; }
.vce-title {
  font-family: 'Syne', sans-serif;
  font-size: 1.05rem;
  font-weight: 800;
  background: linear-gradient(135deg, #8a57ff, #00d4ff, #00e676);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.vce-subtitle {
  font-family: 'DM Mono', monospace;
  font-size: .55rem;
  color: rgba(240,235,255,.4);
  letter-spacing: .08em;
}
.vce-close-btn {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 8px;
  color: rgba(240,235,255,.7);
  width: 32px; height: 32px;
  font-size: .9rem;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}

/* ─── Global Status Bar ──────────────────────────────────── */
.vce-status-bar {
  display: flex;
  gap: .5rem;
  padding: .65rem 1rem;
  background: rgba(138,87,255,.06);
  border-bottom: 1px solid rgba(138,87,255,.12);
  flex-shrink: 0;
  overflow-x: auto;
}
.vce-stat-chip {
  display: flex;
  align-items: center;
  gap: .4rem;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 20px;
  padding: .3rem .7rem;
  white-space: nowrap;
  flex-shrink: 0;
}
.vce-stat-chip .sc-val {
  font-family: 'DM Mono', monospace;
  font-size: .75rem;
  font-weight: 500;
  color: #8a57ff;
}
.vce-stat-chip .sc-label {
  font-family: 'DM Mono', monospace;
  font-size: .55rem;
  color: rgba(240,235,255,.4);
  letter-spacing: .06em;
}

/* ─── Tabs ───────────────────────────────────────────────── */
.vce-tabs {
  display: flex;
  border-bottom: 1px solid rgba(138,87,255,.15);
  background: rgba(9,6,18,.95);
  flex-shrink: 0;
}
.vce-tab {
  flex: 1;
  padding: .75rem .5rem;
  font-family: 'DM Mono', monospace;
  font-size: .6rem;
  letter-spacing: .08em;
  color: rgba(240,235,255,.4);
  background: none;
  border: none;
  cursor: pointer;
  transition: color .2s, border-color .2s;
  border-bottom: 2px solid transparent;
  text-transform: uppercase;
}
.vce-tab.active {
  color: #8a57ff;
  border-color: #8a57ff;
}

/* ─── Tab Content ────────────────────────────────────────── */
.vce-content { flex: 1; overflow-y: auto; }
.vce-tab-pane { display: none; padding: 1rem; }
.vce-tab-pane.active { display: block; }

/* ─── Section Label ──────────────────────────────────────── */
.vce-section-label {
  font-family: 'DM Mono', monospace;
  font-size: .55rem;
  letter-spacing: .12em;
  color: rgba(240,235,255,.35);
  text-transform: uppercase;
  margin-bottom: .75rem;
}

/* ─── City Cards Grid ────────────────────────────────────── */
.vce-cities-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .75rem;
  margin-bottom: 1.25rem;
}
.vce-city-card {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  padding: .9rem;
  cursor: pointer;
  transition: border-color .2s, transform .15s;
  position: relative;
  overflow: hidden;
}
.vce-city-card:hover { border-color: rgba(138,87,255,.4); transform: translateY(-2px); }
.vce-city-card.status-active { border-color: rgba(0,230,118,.2); }
.vce-city-card.status-bootstrapping { border-color: rgba(255,196,0,.2); }
.vce-city-card.status-planned { border-color: rgba(255,255,255,.06); }

.vcc-status-dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  display: inline-block;
  margin-right: .4rem;
}
.status-active .vcc-status-dot { background: #00e676; box-shadow: 0 0 6px #00e676; }
.status-bootstrapping .vcc-status-dot { background: #ffc400; animation: vcePulse 1.2s infinite; }
.status-planned .vcc-status-dot { background: rgba(255,255,255,.25); }

@keyframes vcePulse {
  0%,100% { opacity: 1; }
  50% { opacity: .3; }
}

.vcc-header { display: flex; align-items: center; margin-bottom: .6rem; }
.vcc-flag { font-size: 1.4rem; margin-right: .5rem; }
.vcc-name {
  font-family: 'Syne', sans-serif;
  font-size: .85rem;
  font-weight: 800;
  color: rgba(240,235,255,.9);
}
.vcc-country {
  font-family: 'DM Mono', monospace;
  font-size: .52rem;
  color: rgba(240,235,255,.35);
  margin-top: .1rem;
}

.vcc-metrics { display: flex; flex-direction: column; gap: .3rem; margin-bottom: .7rem; }
.vcc-metric {
  display: flex;
  justify-content: space-between;
  font-family: 'DM Mono', monospace;
  font-size: .55rem;
}
.vcc-metric-label { color: rgba(240,235,255,.4); }
.vcc-metric-val { color: rgba(240,235,255,.85); }

.vcc-health-bar {
  height: 3px;
  background: rgba(255,255,255,.08);
  border-radius: 2px;
  overflow: hidden;
  margin-bottom: .6rem;
}
.vcc-health-fill { height: 100%; border-radius: 2px; transition: width .5s; }
.status-active .vcc-health-fill { background: linear-gradient(90deg, #8a57ff, #00e676); }
.status-bootstrapping .vcc-health-fill { background: #ffc400; }
.status-planned .vcc-health-fill { background: rgba(255,255,255,.2); }

.vcc-status-badge {
  font-family: 'DM Mono', monospace;
  font-size: .5rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: .2rem .5rem;
  border-radius: 20px;
  display: inline-block;
}
.status-active .vcc-status-badge { background: rgba(0,230,118,.15); color: #00e676; }
.status-bootstrapping .vcc-status-badge { background: rgba(255,196,0,.15); color: #ffc400; }
.status-planned .vcc-status-badge { background: rgba(255,255,255,.06); color: rgba(240,235,255,.4); }

/* ─── Expansion Readiness ────────────────────────────────── */
.vce-readiness-card {
  background: linear-gradient(135deg, rgba(138,87,255,.1), rgba(0,212,255,.05));
  border: 1px solid rgba(138,87,255,.25);
  border-radius: 16px;
  padding: 1rem;
  margin-bottom: 1.25rem;
}
.vce-readiness-title {
  font-family: 'Syne', sans-serif;
  font-size: .85rem;
  font-weight: 800;
  color: rgba(240,235,255,.9);
  margin-bottom: .2rem;
}
.vce-readiness-sub {
  font-family: 'DM Mono', monospace;
  font-size: .55rem;
  color: rgba(240,235,255,.4);
  margin-bottom: 1rem;
}
.vce-readiness-score {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: .75rem;
}
.vce-score-circle {
  width: 64px; height: 64px;
  border-radius: 50%;
  background: conic-gradient(#8a57ff 0deg, rgba(255,255,255,.08) 0deg);
  display: flex; align-items: center; justify-content: center;
  position: relative;
  flex-shrink: 0;
}
.vce-score-circle::before {
  content: '';
  position: absolute;
  inset: 5px;
  border-radius: 50%;
  background: #06040f;
}
.vce-score-num {
  position: relative;
  font-family: 'DM Mono', monospace;
  font-size: 1rem;
  font-weight: 700;
  color: #8a57ff;
}
.vce-readiness-items { flex: 1; display: flex; flex-direction: column; gap: .4rem; }
.vce-readiness-item {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-family: 'DM Mono', monospace;
  font-size: .57rem;
  color: rgba(240,235,255,.6);
}
.vce-readiness-item .ri-icon { font-size: .8rem; }
.vce-readiness-item.ri-ok { color: #00e676; }
.vce-readiness-item.ri-warn { color: #ffc400; }
.vce-readiness-item.ri-no { color: rgba(240,235,255,.3); }

.vce-expand-btn {
  width: 100%;
  padding: .8rem;
  background: linear-gradient(135deg, #8a57ff, #6633cc);
  border: none;
  border-radius: 12px;
  color: #fff;
  font-family: 'DM Mono', monospace;
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .08em;
  cursor: pointer;
  transition: opacity .2s, transform .15s;
  text-transform: uppercase;
}
.vce-expand-btn:hover { opacity: .9; transform: translateY(-1px); }
.vce-expand-btn:disabled { opacity: .4; cursor: not-allowed; transform: none; }

/* ─── Wizard ─────────────────────────────────────────────── */
.vce-wizard {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(138,87,255,.2);
  border-radius: 16px;
  overflow: hidden;
}
.vce-wizard-steps {
  display: flex;
  border-bottom: 1px solid rgba(138,87,255,.15);
  background: rgba(9,6,18,.6);
  overflow-x: auto;
}
.vce-wstep {
  flex: 1;
  min-width: 60px;
  padding: .6rem .3rem;
  text-align: center;
  font-family: 'DM Mono', monospace;
  font-size: .48rem;
  letter-spacing: .06em;
  color: rgba(240,235,255,.3);
  text-transform: uppercase;
  border-bottom: 2px solid transparent;
  transition: color .2s;
  position: relative;
}
.vce-wstep.active { color: #8a57ff; border-color: #8a57ff; }
.vce-wstep.done { color: #00e676; border-color: #00e676; }
.vce-wstep-num {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px; height: 20px;
  border-radius: 50%;
  border: 1px solid currentColor;
  margin: 0 auto .3rem;
  font-size: .6rem;
}
.vce-wstep.done .vce-wstep-num::after { content: '✓'; }

.vce-wizard-body { padding: 1.25rem; }
.vce-wizard-title {
  font-family: 'Syne', sans-serif;
  font-size: 1rem;
  font-weight: 800;
  color: rgba(240,235,255,.95);
  margin-bottom: .3rem;
}
.vce-wizard-desc {
  font-family: 'DM Mono', monospace;
  font-size: .58rem;
  color: rgba(240,235,255,.45);
  margin-bottom: 1rem;
  line-height: 1.6;
}

/* ─── City Search Input ──────────────────────────────────── */
.vce-city-search {
  width: 100%;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(138,87,255,.3);
  border-radius: 12px;
  padding: .85rem 1rem;
  color: rgba(240,235,255,.9);
  font-family: 'DM Mono', monospace;
  font-size: .85rem;
  outline: none;
  box-sizing: border-box;
  margin-bottom: .75rem;
}
.vce-city-search:focus { border-color: #8a57ff; }
.vce-city-search::placeholder { color: rgba(240,235,255,.3); }

/* City suggestions */
.vce-city-suggestions { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.vce-city-pill {
  background: rgba(138,87,255,.12);
  border: 1px solid rgba(138,87,255,.25);
  border-radius: 20px;
  padding: .35rem .75rem;
  font-family: 'DM Mono', monospace;
  font-size: .6rem;
  color: rgba(240,235,255,.7);
  cursor: pointer;
  transition: background .2s;
}
.vce-city-pill:hover { background: rgba(138,87,255,.25); color: #fff; }

/* ─── Bootstrap Progress ─────────────────────────────────── */
.vce-bootstrap-steps { display: flex; flex-direction: column; gap: .65rem; margin-bottom: 1rem; }
.vce-bs-step {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  padding: .75rem;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 10px;
  transition: border-color .3s;
}
.vce-bs-step.bs-active { border-color: rgba(138,87,255,.4); background: rgba(138,87,255,.06); }
.vce-bs-step.bs-done { border-color: rgba(0,230,118,.25); background: rgba(0,230,118,.04); }
.vce-bs-icon {
  font-size: 1.1rem;
  flex-shrink: 0;
  margin-top: .1rem;
}
.vce-bs-info { flex: 1; }
.vce-bs-title {
  font-family: 'DM Mono', monospace;
  font-size: .68rem;
  font-weight: 600;
  color: rgba(240,235,255,.85);
  margin-bottom: .2rem;
}
.vce-bs-detail {
  font-family: 'DM Mono', monospace;
  font-size: .55rem;
  color: rgba(240,235,255,.4);
  line-height: 1.5;
}
.vce-bs-check {
  font-size: .9rem;
  color: #00e676;
  flex-shrink: 0;
  opacity: 0;
  transition: opacity .3s;
}
.vce-bs-step.bs-done .vce-bs-check { opacity: 1; }

/* Progress bar */
.vce-progress-wrap { margin: 1rem 0; }
.vce-progress-label {
  display: flex;
  justify-content: space-between;
  font-family: 'DM Mono', monospace;
  font-size: .55rem;
  color: rgba(240,235,255,.4);
  margin-bottom: .4rem;
}
.vce-progress-bar {
  height: 6px;
  background: rgba(255,255,255,.08);
  border-radius: 4px;
  overflow: hidden;
}
.vce-progress-fill {
  height: 100%;
  background: linear-gradient(90deg, #8a57ff, #00d4ff);
  border-radius: 4px;
  transition: width .4s ease;
}

/* ─── Zone Preview Grid ──────────────────────────────────── */
.vce-zones-preview {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .5rem;
  margin-bottom: 1rem;
}
.vce-zone-chip {
  background: rgba(138,87,255,.08);
  border: 1px solid rgba(138,87,255,.18);
  border-radius: 10px;
  padding: .5rem .4rem;
  text-align: center;
}
.vzc-name {
  font-family: 'DM Mono', monospace;
  font-size: .55rem;
  color: rgba(240,235,255,.8);
  margin-bottom: .2rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.vzc-pop {
  font-family: 'DM Mono', monospace;
  font-size: .5rem;
  color: rgba(240,235,255,.35);
}
.vzc-energy {
  font-size: .7rem;
  margin-top: .15rem;
}

/* ─── Tribe Seed Cards ───────────────────────────────────── */
.vce-tribes-row { display: flex; gap: .6rem; margin-bottom: 1rem; overflow-x: auto; }
.vce-tribe-seed {
  flex-shrink: 0;
  width: 80px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 12px;
  padding: .6rem .4rem;
  text-align: center;
}
.vts-icon { font-size: 1.3rem; margin-bottom: .3rem; }
.vts-name {
  font-family: 'DM Mono', monospace;
  font-size: .5rem;
  color: rgba(240,235,255,.7);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.vts-members {
  font-family: 'DM Mono', monospace;
  font-size: .48rem;
  color: rgba(240,235,255,.35);
  margin-top: .15rem;
}

/* ─── Launch Card ────────────────────────────────────────── */
.vce-launch-card {
  background: linear-gradient(135deg, rgba(0,230,118,.08), rgba(138,87,255,.08));
  border: 1px solid rgba(0,230,118,.25);
  border-radius: 16px;
  padding: 1.25rem;
  text-align: center;
  margin-bottom: 1rem;
}
.vlc-icon { font-size: 2.5rem; margin-bottom: .5rem; }
.vlc-title {
  font-family: 'Syne', sans-serif;
  font-size: 1.1rem;
  font-weight: 800;
  color: #00e676;
  margin-bottom: .4rem;
}
.vlc-desc {
  font-family: 'DM Mono', monospace;
  font-size: .6rem;
  color: rgba(240,235,255,.55);
  line-height: 1.6;
  margin-bottom: 1rem;
}
.vlc-stats { display: flex; justify-content: center; gap: 1.5rem; margin-bottom: 1rem; }
.vlc-stat { text-align: center; }
.vlc-stat-val {
  font-family: 'DM Mono', monospace;
  font-size: 1.1rem;
  font-weight: 700;
  color: #00e676;
}
.vlc-stat-label {
  font-family: 'DM Mono', monospace;
  font-size: .5rem;
  color: rgba(240,235,255,.4);
}
.vce-launch-btn {
  background: linear-gradient(135deg, #00e676, #00b050);
  border: none;
  border-radius: 12px;
  padding: .85rem 2rem;
  color: #06040f;
  font-family: 'DM Mono', monospace;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .1em;
  cursor: pointer;
  text-transform: uppercase;
  transition: opacity .2s, transform .15s;
}
.vce-launch-btn:hover { opacity: .9; transform: translateY(-2px); }

/* ─── Registry Tab ───────────────────────────────────────── */
.vce-registry-list { display: flex; flex-direction: column; gap: .75rem; }
.vce-registry-item {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  padding: 1rem;
}
.vri-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: .7rem; }
.vri-left { display: flex; align-items: center; gap: .6rem; }
.vri-flag { font-size: 1.5rem; }
.vri-name {
  font-family: 'Syne', sans-serif;
  font-size: .9rem;
  font-weight: 800;
  color: rgba(240,235,255,.9);
}
.vri-meta {
  font-family: 'DM Mono', monospace;
  font-size: .52rem;
  color: rgba(240,235,255,.35);
}
.vri-badge {
  font-family: 'DM Mono', monospace;
  font-size: .5rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: .25rem .65rem;
  border-radius: 20px;
}
.badge-active { background: rgba(0,230,118,.15); color: #00e676; }
.badge-bootstrapping { background: rgba(255,196,0,.15); color: #ffc400; }
.badge-planned { background: rgba(255,255,255,.07); color: rgba(240,235,255,.4); }
.badge-paused { background: rgba(255,80,80,.1); color: #ff5050; }

.vri-metrics {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: .5rem;
  margin-bottom: .7rem;
}
.vri-metric { text-align: center; }
.vri-metric-val {
  font-family: 'DM Mono', monospace;
  font-size: .72rem;
  font-weight: 600;
  color: rgba(240,235,255,.85);
}
.vri-metric-label {
  font-family: 'DM Mono', monospace;
  font-size: .48rem;
  color: rgba(240,235,255,.35);
  margin-top: .1rem;
}

.vri-zone-bar { display: flex; height: 6px; border-radius: 4px; overflow: hidden; gap: 1px; margin-bottom: .6rem; }
.vzb-seg { flex: 1; border-radius: 2px; }

.vri-actions { display: flex; gap: .5rem; }
.vri-action-btn {
  flex: 1;
  padding: .45rem;
  border-radius: 8px;
  border: 1px solid rgba(138,87,255,.25);
  background: rgba(138,87,255,.08);
  color: rgba(240,235,255,.7);
  font-family: 'DM Mono', monospace;
  font-size: .55rem;
  cursor: pointer;
  letter-spacing: .06em;
  text-transform: uppercase;
  transition: background .2s;
}
.vri-action-btn:hover { background: rgba(138,87,255,.2); }
.vri-action-btn.primary { background: rgba(138,87,255,.25); color: #8a57ff; border-color: #8a57ff; }

/* ─── Metrics Tab ────────────────────────────────────────── */
.vce-metrics-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .75rem;
  margin-bottom: 1.25rem;
}
.vce-metric-card {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 12px;
  padding: .85rem;
}
.vmc-val {
  font-family: 'DM Mono', monospace;
  font-size: 1.3rem;
  font-weight: 700;
  color: #8a57ff;
  margin-bottom: .1rem;
}
.vmc-label {
  font-family: 'DM Mono', monospace;
  font-size: .52rem;
  color: rgba(240,235,255,.4);
  margin-bottom: .5rem;
}
.vmc-trend {
  font-family: 'DM Mono', monospace;
  font-size: .55rem;
  color: #00e676;
}
.vmc-sparkline { width: 100%; height: 28px; }

/* ─── NERHIA Brain Status ────────────────────────────────── */
.vce-brain-card {
  background: linear-gradient(135deg, rgba(0,212,255,.06), rgba(138,87,255,.06));
  border: 1px solid rgba(0,212,255,.2);
  border-radius: 16px;
  padding: 1rem;
  margin-bottom: 1rem;
}
.vbc-header { display: flex; align-items: center; gap: .7rem; margin-bottom: .75rem; }
.vbc-orb {
  width: 36px; height: 36px;
  border-radius: 50%;
  background: radial-gradient(circle, #00d4ff 0%, rgba(0,212,255,.1) 70%);
  animation: vceOrb 2s ease-in-out infinite alternate;
  flex-shrink: 0;
}
@keyframes vceOrb {
  from { box-shadow: 0 0 8px rgba(0,212,255,.3); }
  to { box-shadow: 0 0 20px rgba(0,212,255,.7); }
}
.vbc-title {
  font-family: 'DM Mono', monospace;
  font-size: .72rem;
  font-weight: 600;
  color: #00d4ff;
}
.vbc-sub {
  font-family: 'DM Mono', monospace;
  font-size: .52rem;
  color: rgba(240,235,255,.4);
}
.vbc-metrics { display: grid; grid-template-columns: repeat(3,1fr); gap: .6rem; }
.vbc-metric { text-align: center; }
.vbc-metric-val {
  font-family: 'DM Mono', monospace;
  font-size: .8rem;
  font-weight: 600;
  color: #00d4ff;
}
.vbc-metric-label {
  font-family: 'DM Mono', monospace;
  font-size: .48rem;
  color: rgba(240,235,255,.35);
}

/* ─── Expansion Timeline ─────────────────────────────────── */
.vce-timeline { position: relative; padding-left: 1.5rem; }
.vce-timeline::before {
  content: '';
  position: absolute;
  left: .5rem;
  top: 0; bottom: 0;
  width: 2px;
  background: linear-gradient(to bottom, #8a57ff, rgba(138,87,255,.1));
}
.vce-tl-item {
  position: relative;
  margin-bottom: 1rem;
  padding: .75rem;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 10px;
}
.vce-tl-item::before {
  content: '';
  position: absolute;
  left: -1.25rem;
  top: 50%;
  transform: translateY(-50%);
  width: 10px; height: 10px;
  border-radius: 50%;
  background: #8a57ff;
  border: 2px solid #06040f;
}
.vce-tl-item.tl-done::before { background: #00e676; }
.vce-tl-item.tl-active::before { background: #ffc400; animation: vcePulse 1.2s infinite; }
.vtl-date {
  font-family: 'DM Mono', monospace;
  font-size: .5rem;
  color: rgba(240,235,255,.3);
  margin-bottom: .3rem;
}
.vtl-title {
  font-family: 'DM Mono', monospace;
  font-size: .65rem;
  font-weight: 600;
  color: rgba(240,235,255,.85);
}
.vtl-detail {
  font-family: 'DM Mono', monospace;
  font-size: .55rem;
  color: rgba(240,235,255,.4);
  margin-top: .2rem;
}

/* ─── Wizard Nav ─────────────────────────────────────────── */
.vce-wizard-nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 1.25rem;
  gap: .75rem;
}
.vce-wiz-back {
  flex: 1;
  padding: .75rem;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 10px;
  color: rgba(240,235,255,.6);
  font-family: 'DM Mono', monospace;
  font-size: .65rem;
  cursor: pointer;
  letter-spacing: .06em;
}
.vce-wiz-next {
  flex: 2;
  padding: .75rem;
  background: linear-gradient(135deg, #8a57ff, #6633cc);
  border: none;
  border-radius: 10px;
  color: #fff;
  font-family: 'DM Mono', monospace;
  font-size: .65rem;
  font-weight: 600;
  cursor: pointer;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.vce-wiz-next:disabled { opacity: .4; cursor: not-allowed; }

/* ─── Scrollbar ──────────────────────────────────────────── */
.vce-content::-webkit-scrollbar { width: 3px; }
.vce-content::-webkit-scrollbar-track { background: transparent; }
.vce-content::-webkit-scrollbar-thumb { background: rgba(138,87,255,.3); border-radius: 2px; }