:root {
      --bg: #08131c;
      --panel: rgba(17, 32, 44, 0.9);
      --accent: #5cf0a4;
      --accent-2: #44c58a;
      --text: #e8f4ec;
      --muted: #b6c7bd;
      --border: rgba(255,255,255,0.15);
      --card: rgba(23, 42, 57, 0.9);
      font-family: 'Space Grotesk', system-ui, -apple-system, sans-serif;
    }
    * { box-sizing: border-box; }
    body { margin: 0; background: radial-gradient(circle at 15% 20%, rgba(92,240,164,0.18), transparent 30%), radial-gradient(circle at 80% 0%, rgba(68,197,138,0.16), transparent 28%), linear-gradient(135deg, #061018 0%, #081926 50%, #0a2130 100%); color: var(--text); min-height: 100vh; }
    a { color: var(--accent); text-decoration: none; }
    .layout { display: grid; grid-template-columns: 220px 1fr; min-height: 100vh; }
    .sidebar { padding: 18px; border-right: 1px solid var(--border); background: rgba(4,10,16,0.6); backdrop-filter: blur(10px); }
    .brand { display:flex;align-items:center;gap:10px;margin-bottom:16px; }
    .brand-badge { width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,var(--accent),var(--accent-2));display:grid;place-items:center;font-weight:800;color:#0b130e; }
    .nav button { width:100%; padding:12px; margin-bottom:8px; border-radius:10px; border:1px solid var(--border); background:rgba(255,255,255,0.04); color:var(--text); cursor:pointer; text-align:left; }
    .nav button.active { background:linear-gradient(135deg, rgba(92,240,164,0.2), rgba(68,197,138,0.2)); border-color:rgba(92,240,164,0.35); }
    .main { padding:22px; }
    .header { display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; }
    .pill { display:inline-flex; align-items:center; gap:8px; padding:8px 10px; border-radius:12px; border:1px solid var(--border); background:rgba(255,255,255,0.04); font-size:13px; }
    .card { background: var(--card); border:1px solid var(--border); border-radius:14px; padding:16px; box-shadow:0 10px 40px rgba(0,0,0,0.35); }
    .tabs { display:flex; gap:10px; margin-bottom:14px; flex-wrap:wrap; }
    .tabs button { padding:8px 12px; border-radius:10px; border:1px solid var(--border); background:rgba(255,255,255,0.05); color:var(--text); cursor:pointer; }
    .tabs button.active { background:linear-gradient(135deg, rgba(92,240,164,0.2), rgba(68,197,138,0.2)); border-color:rgba(92,240,164,0.35); }
    .grid { display:grid; gap:12px; }
    .grid.two { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
    .vm-card { border:1px solid var(--border); border-radius:14px; padding:14px; background: rgba(20,38,50,0.8); position:relative; }
    .vm-title { font-size:18px; font-weight:700; margin:0; }
    .vm-meta { color: var(--muted); font-size:13px; }
    .vm-meta-row { display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-top:6px; }
    .vm-specs { display:grid; grid-template-columns: repeat(auto-fit, minmax(160px,1fr)); gap:8px; margin-top:10px; }
    .vm-spec { border:1px solid rgba(255,255,255,0.1); border-radius:10px; padding:8px 10px; background:rgba(255,255,255,0.03); font-size:13px; }
    .vm-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; }
    .badge { display:inline-flex; align-items:center; padding:4px 8px; border-radius:999px; border:1px solid var(--border); font-size:12px; background:rgba(255,255,255,0.05); margin-right:6px; }
    .btn { padding:10px 12px; border:none; border-radius:10px; background:linear-gradient(135deg,var(--accent),var(--accent-2)); color:#0b130e; font-weight:700; cursor:pointer; }
    .btn.secondary { background: rgba(255,255,255,0.06); color: var(--text); border:1px solid var(--border); }
    .btn:disabled { opacity:0.55; cursor:not-allowed; }
    .floating-edit { position:absolute; top:10px; right:10px; }
    .parts { display:flex; gap:8px; flex-wrap:wrap; margin-top:8px; }
    .part { border:1px dashed var(--border); padding:8px 10px; border-radius:10px; background:rgba(255,255,255,0.03); font-size:13px; }
    .part.image-card { cursor:pointer; min-width:220px; }
    .part.image-card.active { border-color: var(--accent); box-shadow:0 0 0 1px rgba(92,240,164,0.5); }
    .editor { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:12px; }
    label { font-size:13px; color: var(--muted); display:block; margin-bottom:4px; }
    input, select, textarea { width:100%; padding:10px 12px; border-radius:10px; border:1px solid var(--border); background:rgba(9,20,28,0.9); color:var(--text); font-family:inherit; }
    select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%); background-position: calc(100% - 18px) calc(1em + 2px), calc(100% - 13px) calc(1em + 2px); background-size: 6px 6px, 6px 6px; background-repeat: no-repeat; padding-right: 32px; }
    select option { background: #0b1822; color: var(--text); }
    .overlay { position:fixed; inset:0; background:rgba(0,0,0,0.55); display:flex; align-items:center; justify-content:center; z-index:10; }
    .panel { background: var(--panel); border:1px solid var(--border); border-radius:16px; padding:18px; max-width:900px; width:94%; box-shadow:0 20px 60px rgba(0,0,0,0.55); }
    .panel.scrollable { max-height: 90vh; overflow:auto; scrollbar-width: thin; scrollbar-color: rgba(92,240,164,0.5) rgba(8,16,22,0.6); }
    .panel.scrollable::-webkit-scrollbar { width: 10px; }
    .panel.scrollable::-webkit-scrollbar-track { background: rgba(8,16,22,0.6); border-radius: 10px; }
    .panel.scrollable::-webkit-scrollbar-thumb { background: linear-gradient(180deg, rgba(92,240,164,0.7), rgba(68,197,138,0.7)); border-radius: 10px; }
    .step-card { margin-bottom: 12px; }
    .step-card .step-header { display:flex; justify-content:space-between; align-items:center; gap:12px; }
    .step-card .step-title { margin:0; font-size:16px; font-weight:700; }
    .step-card .step-body { display:none; margin-top:10px; }
    .step-card.active .step-body { display:block; }
    .step-label { font-size:12px; color: var(--muted); text-transform:uppercase; letter-spacing:0.08em; }
    .field-row { display:grid; grid-template-columns:140px 1fr; gap:10px; align-items:flex-start; margin-bottom:8px; }
    .field-row label { margin:0; }
    .field-row.compact { grid-template-columns:90px 1fr; margin-bottom:0; }
    .field-inline { display:flex; gap:8px; align-items:center; }
    .step-nav { display:flex; gap:8px; justify-content:flex-end; margin-top:12px; flex-wrap:wrap; }
    .section { border:1px dashed var(--border); border-radius:12px; padding:12px; margin-bottom:12px; background: rgba(255,255,255,0.02); }
    .section.account { border-color: rgba(92,240,164,0.35); }
    .section.resources { border-color: rgba(68,197,138,0.35); }
    .option-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap:10px; }
    .option-card { border:1px solid var(--border); border-radius:12px; padding:10px; background:rgba(255,255,255,0.03); cursor:pointer; display:grid; gap:4px; }
    .option-card input { margin-right:8px; }
    .option-card.active { border-color: var(--accent); box-shadow:0 0 0 1px rgba(92,240,164,0.4); }
    .cluster-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap:12px; }
    .cluster-card { text-align:left; border:1px solid var(--border); border-radius:14px; padding:12px; background:rgba(255,255,255,0.03); color:var(--text); cursor:pointer; }
    .cluster-card.active { border-color: var(--accent); box-shadow:0 0 0 1px rgba(92,240,164,0.4); }
    .cluster-card.disabled { opacity: 0.5; cursor: not-allowed; }
    .cluster-title { font-weight:700; font-size:15px; }
    .cluster-specs { display:grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap:8px; margin-top:8px; font-size:12px; }
    .option-title { font-weight:700; }
    .block { padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,0.08); }
    .block:last-child { border-bottom: none; }
    .split { display:grid; grid-template-columns: 1fr 1fr; gap:12px; }
    .resource-grid { display:grid; gap:10px; grid-template-columns:minmax(220px,1fr) 160px 160px 160px; align-items:center; }
    .table-wrap { overflow-x: auto; }
    .data-table { width: 100%; border-collapse: collapse; font-size: 13px; }
    .data-table th, .data-table td { padding: 10px; border-bottom: 1px solid rgba(255,255,255,0.08); text-align: left; vertical-align: top; }
    .data-table th { color: var(--muted); font-weight: 600; }
    .data-table tbody tr:hover { background: rgba(92,240,164,0.08); }
    .json-details summary { cursor: pointer; color: var(--accent); }
    .json-details pre { white-space: pre-wrap; max-height: 220px; overflow: auto; background: rgba(0,0,0,0.35); padding: 8px; border-radius: 8px; }
    .option-details { margin-top: 8px; }
    .option-details summary { cursor: pointer; color: var(--accent); }
    .progress { height: 8px; border-radius: 999px; background: rgba(255,255,255,0.08); overflow: hidden; margin-top: 8px; }
    .progress-bar { height: 100%; background: linear-gradient(90deg, rgba(92,240,164,0.9), rgba(68,197,138,0.9)); }
    @media (max-width: 900px){
      .split { grid-template-columns: 1fr; }
      .resource-grid { grid-template-columns: 1fr; }
    }
    @media (max-width: 720px){
      .field-row { grid-template-columns:1fr; }
      .field-row.compact { grid-template-columns:1fr; }
    }
    .muted { color: var(--muted); }