.index-module__3XyjJG__panel{gap:18px;display:grid}.index-module__3XyjJG__controls,.index-module__3XyjJG__previewSection,.index-module__3XyjJG__codeSection{border:1px solid var(--border);background:var(--surface);border-radius:8px;gap:18px;padding:18px;display:grid}.index-module__3XyjJG__header,.index-module__3XyjJG__previewHeader{justify-content:space-between;align-items:flex-start;gap:16px;display:flex}.index-module__3XyjJG__title,.index-module__3XyjJG__sectionTitle{margin:0;font-size:18px;font-weight:650}.index-module__3XyjJG__meta{color:var(--text-muted);margin:4px 0 0;font-size:13px;line-height:1.45}.index-module__3XyjJG__controlGrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;display:grid}.index-module__3XyjJG__field{gap:8px;min-width:0;display:grid}.index-module__3XyjJG__label{color:var(--text-muted);font-size:13px;font-weight:650}.index-module__3XyjJG__select{border:1px solid var(--border);background:var(--surface);width:100%;min-height:40px;color:var(--text);font:inherit;border-radius:8px;padding:8px 34px 8px 12px}.index-module__3XyjJG__range{width:100%;min-width:0}.index-module__3XyjJG__value,.index-module__3XyjJG__colorValue{color:var(--text-muted);font-size:12px}.index-module__3XyjJG__colorRow{align-items:center;gap:10px;display:flex}.index-module__3XyjJG__colorInput{border:1px solid var(--border);background:var(--surface);border-radius:8px;width:44px;height:40px;padding:0}.index-module__3XyjJG__switchField{border:1px solid var(--border);background:var(--surface-subtle);border-radius:8px;justify-content:space-between;align-items:center;gap:14px;min-width:0;padding:12px;display:flex}.index-module__3XyjJG__actions{flex-wrap:wrap;justify-content:flex-end;gap:10px;display:flex}.index-module__3XyjJG__error{color:var(--error);background:var(--error-bg);border:1px solid #dc26262e;border-radius:8px;padding:10px 12px;font-size:13px}.index-module__3XyjJG__previewFrame{border:1px solid var(--border-strong);background:linear-gradient(45deg,#0f172a0d 25%,#0000 25%),linear-gradient(-45deg,#0f172a0d 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#0f172a0d 75%),linear-gradient(-45deg,#0000 75%,#0f172a0d 75%);background-color:var(--surface-subtle);background-position:0 0,0 10px,10px -10px,-10px 0;background-size:20px 20px;border-radius:8px;place-items:center;min-height:360px;padding:18px;display:grid;overflow:hidden}.index-module__3XyjJG__svgPreview{aspect-ratio:1;border:1px solid var(--border-strong);background:#fff;border-radius:8px;width:min(100%,720px);overflow:hidden;box-shadow:0 14px 42px #0f172a1f}.index-module__3XyjJG__svgPreview svg{width:100%;height:100%;display:block}.index-module__3XyjJG__code{border:1px solid var(--border-strong);background:var(--surface-subtle);width:100%;min-height:220px;color:var(--text);resize:vertical;border-radius:8px;padding:14px;font-family:SFMono-Regular,Consolas,monospace;font-size:12px;line-height:1.5}@media (max-width:900px){.index-module__3XyjJG__header,.index-module__3XyjJG__previewHeader{display:grid}.index-module__3XyjJG__controlGrid{grid-template-columns:1fr}.index-module__3XyjJG__actions{justify-content:flex-start}}