*,:before,:after{box-sizing:border-box}html,body{color:#cdd6f4;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#13131f;height:100%;margin:0;padding:0;font-family:Segoe UI,system-ui,-apple-system,sans-serif;overflow:hidden}#root{height:100%}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;overflow:hidden}.app{--bg:#13131f;--bg-surface:#1e1e2e;--bg-elevated:#313244;--bg-hover:#45475a;--border:#313244;--border-btn:#45475a;--border-btn-hover:#7f849c;--text:#cdd6f4;--text-muted:#7f849c;--text-title:#cba6f7;--badge-error-bg:#f38ba833;--badge-error-fg:#f38ba8;--badge-error-border:#f38ba866;--badge-warn-bg:#f9e2af33;--badge-warn-fg:#f9e2af;--badge-warn-border:#f9e2af66;--badge-ok-bg:#a6e3a133;--badge-ok-fg:#a6e3a1;--badge-ok-border:#a6e3a166;--diag-error-bg:#f38ba814;--diag-error-border:#f38ba8;--diag-warn-bg:#f9e2af14;--diag-warn-border:#f9e2af;--diag-severity-error:#f38ba8;--diag-severity-warn:#f9e2af;--diag-location:#7f849c;--diag-message:#cdd6f4;--status-error-bg:#3b1a1a;--status-error-fg:#f38ba8;--tooltip-bg:#1e1e2e;--tooltip-border:#45475a;--tooltip-text:#cdd6f4}.app[data-theme=light]{--bg:#f4f4f8;--bg-surface:#fff;--bg-elevated:#e8e8f0;--bg-hover:#d8d8e4;--border:#e0e0ea;--border-btn:#c4c4d0;--border-btn-hover:#9090a0;--text:#1e1e2e;--text-muted:#6c6c80;--text-title:#6d28d9;--badge-error-bg:#b91c1c1a;--badge-error-fg:#b91c1c;--badge-error-border:#b91c1c4d;--badge-warn-bg:#b4780a1a;--badge-warn-fg:#92600a;--badge-warn-border:#b4780a4d;--badge-ok-bg:#15803d1a;--badge-ok-fg:#15803d;--badge-ok-border:#15803d4d;--diag-error-bg:#b91c1c0f;--diag-error-border:#b91c1c;--diag-warn-bg:#b4780a0f;--diag-warn-border:#92600a;--diag-severity-error:#b91c1c;--diag-severity-warn:#92600a;--diag-location:#6c6c80;--diag-message:#1e1e2e;--status-error-bg:#fef2f2;--status-error-fg:#b91c1c;--tooltip-bg:#fff;--tooltip-border:#c4c4d0;--tooltip-text:#1e1e2e}.app{background:var(--bg);height:100vh;color:var(--text);flex-direction:column;font-family:Segoe UI,system-ui,-apple-system,sans-serif;font-size:14px;display:flex}.toolbar{background:var(--bg-surface);border-bottom:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:center;height:48px;padding:0 16px;display:flex}.toolbar-left{align-items:center;gap:8px;display:flex}.toolbar-right{align-items:center;gap:6px;display:flex}.app-title{color:var(--text-title);letter-spacing:.02em;white-space:nowrap;margin-right:4px;font-size:15px;font-weight:700}.toolbar-select{background:var(--bg-elevated);color:var(--text);border:1px solid var(--border-btn);cursor:pointer;border-radius:6px;outline:none;height:28px;padding:4px 8px;font-size:12px}.toolbar-select:hover{border-color:var(--border-btn-hover)}.toolbar-divider{background:var(--border);flex-shrink:0;width:1px;height:20px;margin:0 2px}.scale-select{color:#cdd6f4;cursor:pointer;background:#313244;border:1px solid #45475a;border-radius:6px;outline:none;padding:4px 8px;font-size:13px}.scale-select:hover{border-color:#cba6f7}.btn{background:var(--bg-elevated);color:var(--text);border:1px solid var(--border-btn);cursor:pointer;white-space:nowrap;border-radius:6px;align-items:center;height:28px;padding:4px 10px;font-size:12px;transition:background .15s,border-color .15s;display:inline-flex}.btn:hover{background:var(--bg-hover);border-color:var(--border-btn-hover)}.btn:disabled{opacity:.4;cursor:default}.btn-theme{justify-content:center;min-width:52px}.status-bar{border-bottom:1px solid var(--border);flex-shrink:0;align-items:center;gap:8px;height:28px;padding:4px 16px;font-size:12px;display:flex}.status-bar.loading{background:var(--bg-surface);color:var(--text-muted)}.status-bar.status-error{background:var(--status-error-bg);color:var(--status-error-fg)}.status-bar.ready{background:var(--bg-surface)}.badge{border-radius:10px;align-items:center;padding:1px 8px;font-size:11px;font-weight:600;display:inline-flex}.badge-error{background:var(--badge-error-bg);color:var(--badge-error-fg);border:1px solid var(--badge-error-border)}.badge-warn{background:var(--badge-warn-bg);color:var(--badge-warn-fg);border:1px solid var(--badge-warn-border)}.badge-ok{background:var(--badge-ok-bg);color:var(--badge-ok-fg);border:1px solid var(--badge-ok-border)}.main{flex:1;min-height:0;display:flex;overflow:hidden}.editor-pane{border-right:1px solid var(--border);flex-direction:column;width:50%;min-width:0;display:flex;overflow:hidden}.editor-pane .cm-editor{height:100%;font-size:var(--editor-font-size,13px)}.editor-pane>div{height:100%}.preview-pane{background:#fff;justify-content:flex-start;align-items:flex-start;width:50%;min-width:0;display:flex;overflow:auto}.svg-container{min-width:100%;padding:16px;display:inline-block}.svg-container svg{display:block}.svg-container .tdsl-lane-band-even{fill:#fff}.svg-container .tdsl-lane-band-odd{fill:#f5f5f7}.svg-container .tdsl-axis-baseline{stroke:#888;stroke-width:1px}.svg-container .tdsl-axis-tick{stroke:#e0e0e0;stroke-width:1px}.svg-container .tdsl-axis-text{fill:#666;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:11px}.svg-container .tdsl-lane-label{fill:#333;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:13px;font-weight:500}.svg-container .tdsl-item-label{fill:#fff;pointer-events:none;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:11px}.svg-container .tdsl-event-stem{stroke:#666;stroke-width:1.5px}.svg-container .tdsl-event-hit{fill:#0000}.svg-container .tdsl-span{fill-opacity:.78;stroke-width:1px;cursor:pointer;transition:fill-opacity .15s}.svg-container .tdsl-span:hover{fill-opacity:1}.svg-container .tdsl-event-range{fill-opacity:.75;stroke-width:1px;cursor:pointer;transition:fill-opacity .15s}.svg-container .tdsl-event-range:hover{fill-opacity:1}.svg-container .tdsl-event-dot{stroke:#fff;stroke-width:1px;cursor:pointer}.preview-placeholder{color:#888;justify-content:center;align-items:center;width:100%;height:100%;font-size:14px;display:flex}.diagnostics-panel{background:var(--bg-surface);border-top:1px solid var(--border);flex-shrink:0;height:200px;overflow:auto}.diagnostics-header{background:var(--bg-surface);border-bottom:1px solid var(--border);color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;z-index:1;padding:6px 16px;font-size:12px;font-weight:600;position:sticky;top:0}.diagnostics-list{padding:4px 0;list-style:none}.diagnostic-item{border-left:3px solid #0000;align-items:baseline;gap:8px;padding:5px 16px;font-family:JetBrains Mono,Fira Code,Cascadia Code,monospace;font-size:13px;line-height:1.4;display:flex}.diagnostic-item.error{background:var(--diag-error-bg);border-left-color:var(--diag-error-border)}.diagnostic-item.warning{background:var(--diag-warn-bg);border-left-color:var(--diag-warn-border)}.diag-severity{min-width:42px;font-size:11px;font-weight:700}.diagnostic-item.error .diag-severity{color:var(--diag-severity-error)}.diagnostic-item.warning .diag-severity{color:var(--diag-severity-warn)}.diag-location{color:var(--diag-location);min-width:48px;font-size:11px}.diag-message{color:var(--diag-message);word-break:break-word;flex:1}.tdsl-tooltip{z-index:1000;pointer-events:none;background:var(--tooltip-bg);color:var(--tooltip-text);border:1px solid var(--tooltip-border);white-space:pre-line;border-radius:6px;max-width:280px;padding:8px 10px;font-family:JetBrains Mono,Fira Code,Cascadia Code,monospace;font-size:12px;line-height:1.6;position:fixed;box-shadow:0 4px 12px #0006}
