:root{--color-bg:#0e1116;--color-surface:#161b22;--color-border:#2a313c;--color-text:#e6edf3;--color-text-muted:#8b949e;--color-primary:#4c8dff;--color-success:#2ea043;--color-danger:#e5534b;--color-warning:#d29922;--font-sans:ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-mono:ui-monospace, "SF Mono", "JetBrains Mono", Menlo, monospace;--text-sm:.875rem;--text-base:1rem;--text-lg:1.25rem;--text-xl:2rem;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-6:1.5rem;--space-8:2rem;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--shadow-md:0 4px 16px #0006}*,:before,:after{box-sizing:border-box}html,body,#root{height:100%}body{font-family:var(--font-sans);font-size:var(--text-base);color:var(--color-text);background:var(--color-bg);-webkit-font-smoothing:antialiased;margin:0;line-height:1.5}.centered{height:100%;color:var(--color-text-muted);justify-content:center;align-items:center;display:flex}.sandbox{flex-direction:column;height:100vh;display:flex}.toolbar{align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-4);border-bottom:1px solid var(--color-border);background:var(--color-surface);display:flex}.toolbar__brand{color:var(--color-primary);font-weight:700}.toolbar__title{min-width:0;padding:var(--space-2) var(--space-3);color:var(--color-text);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--text-sm);flex:1}.toolbar__field{align-items:center;gap:var(--space-2);color:var(--color-text-muted);font-size:var(--text-sm);display:inline-flex}.toolbar__select{padding:var(--space-1) var(--space-2);color:var(--color-text);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--text-sm)}.btn{padding:var(--space-2) var(--space-3);color:var(--color-text);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--text-sm);cursor:pointer;white-space:nowrap}.btn:hover{border-color:var(--color-primary)}.btn:disabled{opacity:.5;cursor:default}.btn--primary{color:#fff;background:var(--color-primary);border-color:var(--color-primary)}.btn--active{border-color:var(--color-primary);color:var(--color-primary)}.toolbar__status{font-size:var(--text-sm);color:var(--color-text-muted);white-space:nowrap}.toolbar__embed{position:relative}.toolbar__embed-popover{top:calc(100% + var(--space-2));z-index:10;gap:var(--space-2);width:380px;max-width:90vw;padding:var(--space-3);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-md);flex-direction:column;display:flex;position:absolute;right:0}.toolbar__embed-popover-head{font-size:var(--text-sm);color:var(--color-text);justify-content:space-between;align-items:center;font-weight:600;display:flex}.toolbar__embed-close{color:var(--color-text-muted);font-size:var(--text-lg);cursor:pointer;background:0 0;border:0;line-height:1}.toolbar__embed-code{resize:vertical;width:100%;padding:var(--space-2);color:var(--color-text);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-family:var(--font-mono);font-size:var(--text-sm)}.toolbar__about{position:relative}.toolbar__about-popover{top:calc(100% + var(--space-2));z-index:10;gap:var(--space-2);width:240px;max-width:90vw;padding:var(--space-3);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-md);flex-direction:column;display:flex;position:absolute;right:0}.toolbar__about-list{gap:var(--space-1) var(--space-3);font-size:var(--text-sm);grid-template-columns:auto 1fr;margin:0;display:grid}.toolbar__about-list dt{color:var(--color-text-muted)}.toolbar__about-list dd{color:var(--color-text);font-family:var(--font-mono);word-break:break-all;margin:0}.toolbar__about-empty{font-size:var(--text-sm);color:var(--color-text-muted)}.sandbox__banner{align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-4);background:color-mix(in srgb, var(--color-warning) 18%, var(--color-surface));border-bottom:1px solid var(--color-border);color:var(--color-text);font-size:var(--text-sm);display:flex}.sandbox__banner-link{padding:var(--space-1) var(--space-3);color:#fff;background:var(--color-primary);border-radius:var(--radius-sm);font-size:var(--text-sm);cursor:pointer;border:0}.sandbox__banner-link:disabled{opacity:.5;cursor:default}.sandbox__split{flex:1;min-height:0;display:flex}.sandbox__editor{border-right:1px solid var(--color-border);flex:1;min-width:0;overflow:hidden}.sandbox__editor>*,.sandbox__editor .cm-editor{height:100%}.sandbox__preview{flex:1;min-width:0}.preview{height:100%;position:relative}.preview__frame{background:#fff;border:0;width:100%;height:100%}.preview__msg{height:100%;padding:var(--space-4);color:var(--color-text-muted);text-align:center;justify-content:center;align-items:center;display:flex}.preview__error{padding:var(--space-4);height:100%;color:var(--color-danger);background:var(--color-surface);font-family:var(--font-mono);font-size:var(--text-sm);white-space:pre-wrap;margin:0;overflow:auto}.history{border-left:1px solid var(--color-border);background:var(--color-surface);flex-direction:column;flex:none;width:340px;min-height:0;display:flex}.history__head{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;display:flex}.history__title{font-weight:600;font-size:var(--text-sm)}.history__close{color:var(--color-text-muted);font-size:var(--text-lg);cursor:pointer;background:0 0;border:0;line-height:1}.history__list{flex:1;min-height:0;overflow-y:auto}.history__row{justify-content:space-between;align-items:center;gap:var(--space-2);width:100%;padding:var(--space-3) var(--space-4);border:0;border-bottom:1px solid var(--color-border);color:var(--color-text);text-align:left;cursor:pointer;background:0 0;display:flex}.history__row:hover{background:var(--color-bg)}.history__row:disabled{cursor:default;opacity:.6}.history__row-main{gap:var(--space-1);flex-direction:column;min-width:0;display:flex}.history__row-title{font-size:var(--text-sm);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.history__row-time{font-size:var(--text-sm);color:var(--color-text-muted)}.history__row-files{font-size:var(--text-sm);color:var(--color-text-muted);flex:none}.history__empty{padding:var(--space-4);color:var(--color-text-muted);font-size:var(--text-sm)}.history__empty--error{color:var(--color-danger);font-family:var(--font-mono);white-space:pre-wrap}.history__detail{gap:var(--space-3);min-height:0;padding:var(--space-4);flex-direction:column;flex:1;display:flex}.history__back{align-self:flex-start}.history__meta{font-size:var(--text-sm);color:var(--color-text-muted)}.history__yaml{min-height:0;padding:var(--space-3);background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-family:var(--font-mono);font-size:var(--text-sm);white-space:pre;flex:1;margin:0;overflow:auto}.history__actions{gap:var(--space-2);display:flex}