:root{--erte-font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--erte-color-border: #4c6177;--erte-color-accent: #d23f00;--erte-color-primary: #0e4678;--erte-color-surface: #ffffff;--erte-color-muted: #f9f9f9;--erte-radius: 4px;--erte-spacing: 8px}.erte-spinner-overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:#fff9;z-index:10000}.erte-spinner{width:40px;height:40px;border:4px solid #e6ecf1;border-top-color:var(--erte-color-primary);border-radius:50%;animation:erte-spin .8s linear infinite}@keyframes erte-spin{to{transform:rotate(360deg)}}.erte-resize-handle{--erte-grip-color: #b6bec8;background:#f7f8fa;transition:background-color .15s ease}.erte-resize-handle:hover{--erte-grip-color: #8a93a0;background:#eef0f3}.erte-resize-handle.is-active{--erte-grip-color: var(--erte-color-accent);background:#e9ecef}.erte-resize-handle--bottom{border-top:1px solid #e9ecef;box-shadow:inset 0 1px 2px #00000008}.erte-resize-handle--bottom:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:14px;height:5px;border-radius:1px;background:repeating-linear-gradient(to bottom,var(--erte-grip-color) 0 1px,transparent 1px 2px)}.erte-toast{position:fixed;top:20px;left:50%;transform:translate(-50%);z-index:10001;padding:10px 16px;background:var(--erte-color-surface);color:var(--erte-color-primary);border:1px solid var(--erte-color-primary);border-radius:var(--erte-radius);box-shadow:0 2px 8px #0000001f;font-family:var(--erte-font-family);font-size:14px}*,*:before,*:after{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}.playground{--pg-bg: #f4f6f9;--pg-surface: #ffffff;--pg-surface-alt: #f9fafb;--pg-border: #e3e8ef;--pg-text: #1f2a37;--pg-text-muted: #6b7280;--pg-primary: #0e4678;--pg-accent: #d23f00;--pg-shadow: 0 1px 3px rgba(16, 24, 40, .08), 0 1px 2px rgba(16, 24, 40, .04);display:flex;flex-direction:column;height:100%;background:var(--pg-bg);color:var(--pg-text)}.playground[data-theme=dark]{--pg-bg: #0d1117;--pg-surface: #161b22;--pg-surface-alt: #1c2330;--pg-border: #2a3140;--pg-text: #e6edf3;--pg-text-muted: #9aa7b5;--pg-primary: #4d8fd6;--pg-accent: #ff6a33;--pg-shadow: 0 1px 3px rgba(0, 0, 0, .4)}.pg-header{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;background:var(--pg-surface);border-bottom:1px solid var(--pg-border)}.pg-brand{display:flex;align-items:center;gap:12px}.pg-logo{font-size:24px}.pg-title{margin:0;font-size:16px;font-weight:600}.pg-subtitle{margin:2px 0 0;font-size:12px;color:var(--pg-text-muted)}.pg-header-actions{display:flex;align-items:center;gap:12px}.pg-badge{font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--pg-accent);border:1px solid var(--pg-accent);border-radius:999px;padding:2px 10px}.pg-btn{font:inherit;font-size:13px;cursor:pointer;padding:6px 14px;border-radius:8px;border:1px solid var(--pg-border);background:var(--pg-surface-alt);color:var(--pg-text);transition:background .15s ease}.pg-btn:hover{background:var(--pg-border)}.pg-body{flex:1;display:grid;grid-template-columns:65fr 35fr;min-height:0}.pg-controls{background:var(--pg-surface);padding:16px;overflow-y:auto;border-left:1px solid var(--pg-border)}@media(max-width:900px){.pg-body{grid-template-columns:1fr;grid-template-rows:auto auto;overflow-y:auto}.pg-controls{border-left:none;border-top:1px solid var(--pg-border)}}.pg-section-label{margin:0 0 12px;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--pg-text-muted)}.pg-nav{display:flex;flex-direction:column;gap:4px}.pg-nav-item{font:inherit;font-size:13px;text-align:left;cursor:pointer;padding:8px 10px;border-radius:8px;border:1px solid transparent;background:transparent;color:var(--pg-text)}.pg-nav-item--active{background:color-mix(in srgb,var(--pg-primary) 12%,transparent);border-color:color-mix(in srgb,var(--pg-primary) 30%,transparent);color:var(--pg-primary);font-weight:600}.pg-canvas{padding:32px;overflow:auto;background:radial-gradient(circle at 1px 1px,var(--pg-border) 1px,transparent 0) 0 0 / 22px 22px}.pg-canvas-inner{max-width:820px;margin:0 auto}.pg-stage .erte-resizable{box-shadow:var(--pg-shadow)}.pg-hint{margin:16px 0 0;font-size:12px;line-height:1.6;color:var(--pg-text-muted)}.pg-hint code{font-family:ui-monospace,SFMono-Regular,Cascadia Code,Consolas,monospace;font-size:11.5px;background:var(--pg-surface-alt);border:1px solid var(--pg-border);border-radius:5px;padding:1px 5px}.pg-control{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid var(--pg-border)}.pg-control--column{flex-direction:column;align-items:stretch}.pg-control-label{font-size:12.5px;font-weight:500;color:var(--pg-text-muted)}.pg-textarea{font-family:ui-monospace,SFMono-Regular,Cascadia Code,Consolas,monospace;font-size:12.5px;line-height:1.5;resize:vertical;padding:10px;border-radius:8px;border:1px solid var(--pg-border);background:var(--pg-surface-alt);color:var(--pg-text)}.pg-textarea:focus-visible,.pg-btn:focus-visible,.pg-nav-item:focus-visible{outline:2px solid var(--pg-primary);outline-offset:1px}