.demo-page.svelte-1ps7f0n{max-width:100%}.mode-bar.svelte-1ps7f0n{display:flex;align-items:center;gap:16px;padding:10px 0;margin-bottom:16px;border-bottom:1px solid var(--border);font-size:13px}.mode-label.svelte-1ps7f0n{display:flex;align-items:center;gap:6px;cursor:pointer;color:var(--text)}.mode-label.svelte-1ps7f0n select:where(.svelte-1ps7f0n){padding:4px 8px;border-radius:4px;border:1px solid var(--border);background:var(--bg-input);color:var(--text);font-size:13px}.demo-header.svelte-1ps7f0n{background:#2c5282;color:#fff;padding:16px 24px;margin:-20px -20px 24px;border-radius:8px}.demo-header.svelte-1ps7f0n h1:where(.svelte-1ps7f0n){font-size:20px;font-weight:700;display:flex;align-items:center;gap:10px}.demo-badge.svelte-1ps7f0n{font-size:11px;background:#fff3;padding:2px 8px;border-radius:4px;font-weight:600;letter-spacing:.05em}.demo-subtitle.svelte-1ps7f0n{font-size:13px;opacity:.8;margin-top:4px}.demo-content.svelte-1ps7f0n{display:flex;flex-direction:column;gap:20px}.demo-card.svelte-1ps7f0n{background:var(--bg-card);border:1px solid var(--border);border-radius:8px;padding:20px}.demo-card.svelte-1ps7f0n h2:where(.svelte-1ps7f0n){font-size:16px;font-weight:600;color:var(--text-bright);margin-bottom:12px;border-bottom:1px solid var(--border);padding-bottom:8px}.desc.svelte-1ps7f0n{font-size:13px;color:var(--text-dim);margin-bottom:16px}.btn-row.svelte-1ps7f0n{margin-top:16px;display:flex;gap:10px}.btn.svelte-1ps7f0n{padding:8px 16px;border-radius:6px;border:1px solid var(--border);background:var(--bg-input);color:var(--text);font-size:13px;cursor:pointer}.btn.svelte-1ps7f0n:hover{background:var(--bg-card-hover)}.btn-save.svelte-1ps7f0n{background:var(--accent);color:#fff;border-color:var(--accent)}.btn-save.svelte-1ps7f0n:hover{opacity:.9}.result-card.svelte-1ps7f0n{margin-top:16px;padding:12px 16px;border-radius:6px;background:#48bb781a;border:1px solid rgba(72,187,120,.3)}.result-card.svelte-1ps7f0n strong:where(.svelte-1ps7f0n){color:var(--green);font-size:14px}.result-card.svelte-1ps7f0n pre:where(.svelte-1ps7f0n){margin-top:8px;font-size:12px;background:var(--bg-input);padding:12px;border-radius:4px;white-space:pre-wrap;color:var(--text);font-family:var(--font-mono)}.code-block.svelte-1ps7f0n{background:var(--bg-input);padding:16px;border-radius:6px;font-size:12px;line-height:1.7;white-space:pre-wrap;word-break:break-all;overflow-x:auto}.code-block.svelte-1ps7f0n code:where(.svelte-1ps7f0n){font-family:var(--font-mono);color:var(--text)}