.code-sandbox.svelte-vsr3od{--sandbox-page: #F5EFD6;--sandbox-panel: #FDFAF0;--sandbox-panel-alt: #F8F1DA;--sandbox-hover: #FFF8E0;--sandbox-ink: #1A1A2E;--sandbox-ink-soft: #4A3F2C;--sandbox-muted: #6B6B85;--sandbox-stroke: #1A1A2E;--sandbox-shadow: rgba(26, 26, 46, .22);--sandbox-gold: #F5C518;--sandbox-green: #4A9B5E;min-height:calc(100vh - 64px);display:flex;flex-direction:column;gap:18px;padding:18px 24px 24px;background:linear-gradient(90deg,rgba(26,26,46,.035) 1px,transparent 1px),linear-gradient(0deg,rgba(26,26,46,.035) 1px,transparent 1px),var(--sandbox-page);background-size:32px 32px;color:var(--sandbox-ink)}.sandbox-header.svelte-vsr3od{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 22px;background:var(--sandbox-panel);border:2px solid var(--sandbox-stroke);border-radius:6px;box-shadow:4px 4px 0 var(--sandbox-shadow)}.header-content.svelte-vsr3od p:where(.svelte-vsr3od){color:var(--sandbox-ink-soft);font-size:.9rem;line-height:1.5}.header-badge.svelte-vsr3od{padding:8px 14px;background:linear-gradient(180deg,#FFD84A,var(--sandbox-gold));border:2px solid var(--sandbox-stroke);border-radius:6px;box-shadow:2px 2px 0 var(--sandbox-stroke);font-family:Fredoka,DM Sans,system-ui,sans-serif;font-size:.75rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--sandbox-ink)}.sandbox-layout.svelte-vsr3od{flex:1;display:grid;grid-template-columns:240px 1fr 280px;gap:12px;background:transparent;overflow:visible;min-height:680px}.examples-panel.svelte-vsr3od{background:var(--sandbox-panel);border:2px solid var(--sandbox-stroke);border-radius:6px;box-shadow:4px 4px 0 var(--sandbox-shadow);display:flex;flex-direction:column;min-width:0;overflow:hidden}.panel-header.svelte-vsr3od{padding:12px 14px;background:var(--sandbox-gold);border-bottom:2px solid var(--sandbox-stroke);font-family:Fredoka,DM Sans,system-ui,sans-serif;font-size:.85rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--sandbox-ink)}.examples-list.svelte-vsr3od{flex:1;padding:8px;overflow-y:auto}.example-btn.svelte-vsr3od{display:flex;align-items:flex-start;gap:12px;width:100%;padding:12px;background:var(--sandbox-panel-alt);border:2px solid transparent;border-radius:6px;text-align:left;color:var(--sandbox-ink);transition:all .15s ease;margin-bottom:8px;cursor:pointer}.example-btn.svelte-vsr3od:hover{background:var(--sandbox-hover);border-color:#1a1a2e52;transform:translate(-1px,-1px)}.example-btn.active.svelte-vsr3od{background:linear-gradient(180deg,#FFF6C2,var(--sandbox-panel-alt));border-color:var(--sandbox-stroke);box-shadow:2px 2px 0 var(--sandbox-stroke)}.example-icon.svelte-vsr3od{font-size:1.3rem}.example-info.svelte-vsr3od{display:flex;flex-direction:column;gap:2px}.example-title.svelte-vsr3od{font-family:Fredoka,DM Sans,system-ui,sans-serif;font-weight:800;font-size:.9rem;color:var(--sandbox-ink)}.example-desc.svelte-vsr3od{font-size:.75rem;color:var(--sandbox-muted);line-height:1.35}.editor-area.svelte-vsr3od{background:#0d1117;border:2px solid var(--sandbox-stroke);border-radius:6px;box-shadow:4px 4px 0 var(--sandbox-shadow);display:flex;flex-direction:column;overflow:hidden;min-width:0}.editor-toolbar.svelte-vsr3od{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 14px;background:#161b22;border-bottom:2px solid #30363D}.toolbar-left.svelte-vsr3od{display:flex;align-items:center;gap:8px}.file-icon.svelte-vsr3od{font-size:1rem}.file-name.svelte-vsr3od{font-family:var(--font-code);font-size:.85rem;color:#f5efd6}.file-badge.svelte-vsr3od{padding:2px 8px;background:#f5c51829;border:1px solid rgba(245,197,24,.36);color:var(--sandbox-gold);border-radius:4px;font-size:.7rem}.toolbar-btn.svelte-vsr3od{padding:6px 12px;background:#202838;border:1px solid rgba(216,207,175,.45);border-radius:6px;color:#f5efd6;font-size:.8rem;cursor:pointer;transition:all .15s ease}.toolbar-btn.svelte-vsr3od:hover{background:#2b3446;color:var(--sandbox-gold)}.editor-container.svelte-vsr3od{flex:1;overflow:auto}.editor-container.svelte-vsr3od .cm-editor{height:100%}.editor-container.svelte-vsr3od .cm-scroller{font-family:var(--font-code)!important;font-size:.85rem!important;line-height:1.6!important}.editor-footer.svelte-vsr3od{padding:8px 16px;background:#161b22;border-top:2px solid #30363D}.tip.svelte-vsr3od{font-size:.8rem;color:#c7b98f}.info-panel.svelte-vsr3od{background:var(--sandbox-panel);border:2px solid var(--sandbox-stroke);border-radius:6px;box-shadow:4px 4px 0 var(--sandbox-shadow);padding:20px;overflow-y:auto;min-width:0}.info-header.svelte-vsr3od{display:flex;align-items:center;gap:12px;margin-bottom:12px}.info-icon.svelte-vsr3od{font-size:2rem}.info-header.svelte-vsr3od h2:where(.svelte-vsr3od){font-family:Fredoka,DM Sans,system-ui,sans-serif;font-size:1.3rem;color:var(--sandbox-ink)}.info-desc.svelte-vsr3od{color:var(--sandbox-ink-soft);font-size:.9rem;margin-bottom:24px;line-height:1.55}.info-section.svelte-vsr3od h3:where(.svelte-vsr3od){font-family:Fredoka,DM Sans,system-ui,sans-serif;font-size:.8rem;color:var(--sandbox-muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:12px}.info-section.svelte-vsr3od ul:where(.svelte-vsr3od){list-style:none;padding:0;margin:0}.info-section.svelte-vsr3od li:where(.svelte-vsr3od){padding:8px 12px;background:var(--sandbox-panel-alt);border:1px solid rgba(26,26,46,.12);border-radius:6px;margin-bottom:6px;font-size:.85rem;color:var(--sandbox-ink-soft);line-height:1.5}.static-checks.svelte-vsr3od{margin-bottom:20px}.static-checks.svelte-vsr3od li:where(.svelte-vsr3od){display:flex;align-items:center;gap:8px}.static-checks.svelte-vsr3od li.pass:where(.svelte-vsr3od){color:#156c39;background:#4a9b5e24;border-color:#4a9b5e47}.check-dot.svelte-vsr3od{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:#4a9b5e24;font-size:.75rem;flex-shrink:0}.info-section.svelte-vsr3od code:where(.svelte-vsr3od){background:#f5c5182e;color:var(--sandbox-ink);padding:2px 6px;border-radius:4px;font-size:.8rem}[data-theme=dark] .code-sandbox.svelte-vsr3od{--sandbox-page: #0B0E14;--sandbox-panel: #141922;--sandbox-panel-alt: #1B2230;--sandbox-hover: #222B3A;--sandbox-ink: #F5EFD6;--sandbox-ink-soft: #C7B98F;--sandbox-muted: #D8CFAF;--sandbox-stroke: #D8CFAF;--sandbox-shadow: #05070B;background:radial-gradient(circle at 20px 20px,rgba(245,197,24,.08) 1px,transparent 1.5px),linear-gradient(90deg,rgba(245,239,214,.035) 1px,transparent 1px),linear-gradient(0deg,rgba(245,239,214,.035) 1px,transparent 1px),var(--sandbox-page);background-size:40px 40px,32px 32px,32px 32px,auto}[data-theme=dark] .header-badge.svelte-vsr3od,[data-theme=dark] .panel-header.svelte-vsr3od{color:var(--text-on-gold, #121728);text-shadow:none}[data-theme=dark] .example-btn.active.svelte-vsr3od{background:linear-gradient(180deg,#f5c5182e,#1b2230)}[data-theme=dark] .static-checks.svelte-vsr3od li.pass:where(.svelte-vsr3od){color:#62c77d;background:#62c77d24;border-color:#62c77d42}[data-theme=dark] .info-section.svelte-vsr3od code:where(.svelte-vsr3od){color:#ffd84a}@media(max-width:1000px){.sandbox-layout.svelte-vsr3od{grid-template-columns:220px 1fr}.info-panel.svelte-vsr3od{grid-column:1 / -1;max-height:360px;border-top:1px solid rgba(255,255,255,.05)}}@media(max-width:700px){.code-sandbox.svelte-vsr3od{min-height:100vh}.sandbox-header.svelte-vsr3od,.editor-toolbar.svelte-vsr3od{align-items:flex-start;flex-direction:column;gap:10px}.sandbox-layout.svelte-vsr3od{display:flex;flex-direction:column;overflow:visible}.examples-list.svelte-vsr3od{display:flex;gap:8px;overflow-x:auto}.example-btn.svelte-vsr3od{min-width:210px;margin-bottom:0}.editor-container.svelte-vsr3od{min-height:420px}}
