.dt-design-tool{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,460px);gap:18px}.dt-design-card{background:var(--card);border:1px solid var(--border);border-radius:8px;padding:18px;box-shadow:var(--shadow-soft)}.dt-design-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.dt-design-controls label{display:grid;gap:6px;color:var(--muted);font-size:12px;font-weight:800}.dt-design-controls input,.dt-design-controls select{width:100%;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--text);padding:9px 10px;font:inherit}.dt-design-preview{min-height:260px;border:1px dashed var(--border);border-radius:8px;background:var(--surface);display:grid;place-items:center;padding:18px;overflow:hidden}.dt-design-code{white-space:pre-wrap;border:1px solid var(--border);border-radius:8px;background:var(--surface);padding:12px;font:12px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--text)}.dt-design-sample{width:150px;height:110px;background:#fff;border:1px solid var(--border)}.dt-design-row{display:flex;gap:10px;flex-wrap:wrap}.dt-design-chip{width:44px;height:44px;border-radius:8px;background:#3b82f6;color:#fff;display:grid;place-items:center;font-weight:800}.dt-design-grid{display:grid;width:220px;height:180px;background:#eef2ff}.dt-design-grid span{background:#3b82f6;border-radius:6px}.dt-design-favicon{width:128px;height:128px;border-radius:24px;display:grid;place-items:center;color:#fff;font-size:56px;font-weight:900}@media(max-width:760px){.dt-design-tool,.dt-design-controls{grid-template-columns:1fr}}