:root{font-family:JetBrains Mono,Fira Code,SF Mono,Cascadia Code,monospace;line-height:1.4;font-weight:400;color:var(--color-text);background-color:var(--color-bg);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{margin:0;padding:0;box-sizing:border-box}body{margin:0;min-width:960px;min-height:100vh;overflow:hidden}#root{width:100vw;height:100vh;display:flex;flex-direction:column}button{border-radius:6px;border:1px solid transparent;padding:.4em .8em;font-size:.85em;font-weight:500;font-family:inherit;cursor:pointer;transition:all .2s ease}select{font-family:inherit;font-size:.85em;background:var(--color-surface);color:var(--color-text);border:1px solid var(--color-border);border-radius:6px;padding:.4em .6em;cursor:pointer}select:focus{outline:1px solid var(--color-accent)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--color-scrollbar-track)}::-webkit-scrollbar-thumb{background:var(--color-scrollbar-thumb);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--color-scrollbar-thumb-hover)}:root{--color-bg: #faf9f7;--color-surface: #f1eeeb;--color-surface-raised: #e7e3df;--color-surface-editor: #f5f3f0;--color-border: #dbd6d0;--color-border-subtle: #eae6e2;--color-text: #2c2c2e;--color-text-secondary: #6b6b70;--color-text-tertiary: #9b9ba0;--color-text-inverse: #faf9f7;--color-accent: #3d9b8f;--color-accent-hover: #338a7f;--color-accent-subtle: rgba(61, 155, 143, .1);--color-secondary: #d08c60;--color-secondary-hover: #c07c50;--color-secondary-subtle: rgba(208, 140, 96, .1);--color-error: #c75050;--color-error-subtle: rgba(199, 80, 80, .08);--color-warning: #c49a3c;--color-warning-subtle: rgba(196, 154, 60, .08);--color-info: #5088b5;--color-info-subtle: rgba(80, 136, 181, .08);--color-success: #3d9b8f;--color-scrollbar-track: #eeebe8;--color-scrollbar-thumb: #d5d0cb;--color-scrollbar-thumb-hover: #c0bab4;--shadow-sm: 0 1px 2px rgba(44, 44, 46, .06);--shadow-md: 0 2px 8px rgba(44, 44, 46, .08)}.global-nav{position:fixed;top:0;left:0;right:0;z-index:200;display:flex;align-items:center;justify-content:space-between;height:48px;padding:0 1.5rem;background:#faf9f7eb;backdrop-filter:blur(8px);border-bottom:1px solid var(--color-border, #dbd6d0)}.global-nav-brand{display:inline-flex;align-items:center;gap:.5rem;font-weight:700;font-size:1.1rem;color:var(--color-accent, #3d9b8f);text-decoration:none}.global-nav-logo{display:block;width:28px;height:28px;object-fit:contain}.global-nav-links{display:flex;gap:1.5rem}.global-nav-links a{color:var(--color-text-secondary, #6b6b70);text-decoration:none;font-size:.875rem;font-weight:500;transition:color .2s}.global-nav-links a:hover{color:var(--color-text, #2c2c2e)}.global-nav-links .global-nav-active{color:var(--color-accent, #3d9b8f)}.global-nav-left{display:flex;align-items:center;gap:12px}@media(max-width:768px){.global-nav-links{gap:1rem}.global-nav-links a{font-size:.8rem}}@media(max-width:480px){.global-nav-links a:not(.global-nav-active){display:none}}.app{display:flex;flex-direction:column;height:calc(100vh - 48px);margin-top:48px;background:var(--color-bg)}.header{display:flex;align-items:center;justify-content:space-between;padding:.25rem 1rem;background:var(--color-surface);border-bottom:1px solid var(--color-border);flex-shrink:0}.header-left{display:flex;align-items:center;gap:1rem}.header-right{display:flex;align-items:center;gap:.75rem}.panels{display:grid;grid-template-columns:1fr 1fr 1.2fr;flex:1;overflow:hidden;gap:1px;background:var(--color-border)}.panel{display:flex;flex-direction:column;background:var(--color-surface);overflow:hidden}.panel-header{display:flex;align-items:center;justify-content:space-between;padding:.4rem .75rem;background:var(--color-surface-raised);border-bottom:1px solid var(--color-bg);flex-shrink:0;min-height:36px}.panel-header h2{font-size:.8em;font-weight:500;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:1px}.panel-content{flex:1;overflow:auto;position:relative}.tab-bar{display:flex;gap:0;flex-shrink:0}.tab{padding:.35rem .75rem;font-size:.75em;color:var(--color-text-secondary);background:transparent;border:none;border-bottom:2px solid transparent;border-radius:0;cursor:pointer;transition:all .2s ease;white-space:nowrap}.tab:hover{color:var(--color-text-secondary);background:#2c2c2e08}.tab.active{color:var(--color-text);border-bottom-color:var(--color-accent);background:var(--color-accent-subtle)}.btn-primary{background:var(--color-accent);color:var(--color-text-inverse);border:1px solid var(--color-accent)}.btn-primary:hover{background:var(--color-accent-hover);color:var(--color-text-inverse)}.btn-primary:disabled{background:var(--color-border);border-color:var(--color-border);color:var(--color-text-secondary);cursor:not-allowed}.editor-container{flex:1;overflow:hidden}.editor-container .cm-editor{height:100%}.editor-container .cm-editor .cm-scroller{font-family:JetBrains Mono,Fira Code,SF Mono,monospace;font-size:13px}.json-viewer{padding:.75rem;font-size:12px;white-space:pre-wrap;word-break:break-word;color:var(--color-text-secondary);font-family:JetBrains Mono,Fira Code,monospace}.graph-container{width:100%;height:100%;background:var(--color-surface)}.placeholder{display:flex;align-items:center;justify-content:center;height:100%;color:var(--color-text-tertiary);font-size:.9em;text-align:center;padding:2rem}.placeholder p{max-width:280px;line-height:1.6}.status-bar{display:flex;align-items:center;justify-content:space-between;padding:.25rem 1rem;background:var(--color-surface-raised);border-top:1px solid var(--color-surface);flex-shrink:0;font-size:.75em;color:var(--color-text-secondary)}.status-indicator{display:flex;align-items:center;gap:.5rem}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--color-text-tertiary)}.status-dot.idle{background:var(--color-text-tertiary)}.status-dot.compiling,.status-dot.parsing,.status-dot.converting,.status-dot.analyzing{background:var(--color-warning);animation:pulse 1s infinite}.status-dot.ready{background:var(--color-success)}.status-dot.error{background:var(--color-error)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.header-tabs{display:flex;gap:0;border:1px solid var(--color-border);border-radius:4px;overflow:hidden}.header-tab{padding:.3rem .7rem;font-size:.75em;color:var(--color-text-secondary);background:transparent;border:none;border-right:1px solid var(--color-border);cursor:pointer;transition:all .15s ease}.header-tab:last-child{border-right:none}.header-tab:hover{color:var(--color-text-secondary);background:#2c2c2e0d}.header-tab.active{color:var(--color-text);background:var(--color-accent-subtle)}.spec-viewer{display:flex;height:100%;overflow:hidden}.spec-sidebar{width:180px;min-width:180px;border-right:1px solid var(--color-bg);overflow-y:auto;background:var(--color-surface)}.spec-categories{padding:.25rem 0}.spec-category-group{margin:0}.spec-category{display:flex;align-items:center;gap:.4rem;width:100%;padding:.4rem .6rem;font-size:.8em;color:var(--color-text-secondary);background:transparent;border:none;cursor:pointer;text-align:left;transition:background .15s ease;font-weight:500}.spec-category:hover{background:#2c2c2e0d}.spec-category.active{color:var(--color-text);background:var(--color-accent-subtle)}.spec-category-arrow{font-size:.7em;color:var(--color-text-secondary);width:10px}.spec-count{margin-left:auto;font-size:.85em;color:var(--color-text-tertiary)}.spec-list{padding:0 0 .25rem}.spec-item{display:block;width:100%;padding:.3rem .6rem .3rem 1.6rem;font-size:.75em;color:var(--color-text-secondary);background:transparent;border:none;cursor:pointer;text-align:left;transition:all .15s ease}.spec-item:hover{color:var(--color-text-secondary);background:#2c2c2e08}.spec-item.active{color:var(--color-text);background:var(--color-accent-subtle)}.spec-content{flex:1;overflow:auto}.spec-yaml-view{height:100%;display:flex;flex-direction:column}.spec-yaml-header{padding:.4rem .75rem;font-size:.75em;color:var(--color-accent);background:var(--color-accent-subtle);border-bottom:1px solid var(--color-bg);font-weight:500}.spec-yaml{flex:1;padding:.75rem;margin:0;font-size:12px;color:var(--color-text-secondary);font-family:JetBrains Mono,Fira Code,monospace;line-height:1.6;white-space:pre-wrap;word-break:break-word;overflow:auto}.spec-error{padding:1rem;color:var(--color-error);font-size:.85em}.config-bar{display:flex;align-items:center;gap:1.25rem;padding:.35rem 1rem;background:var(--color-surface);border-bottom:1px solid var(--color-bg);flex-shrink:0}.config-field{display:flex;align-items:center;gap:.4rem}.config-label{font-size:.72em;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.5px;white-space:nowrap}.config-field select,.config-field input[type=number]{padding:.2rem .4rem;font-size:.75em;background:var(--color-bg);color:var(--color-text);border:1px solid var(--color-border);border-radius:3px;outline:none}.config-field select{cursor:pointer}.config-field input[type=number]{width:72px}.config-field select:focus,.config-field input[type=number]:focus{border-color:var(--color-accent)}.config-checkbox{gap:.3rem}.config-checkbox input[type=checkbox]{accent-color:var(--color-accent);cursor:pointer}.btn-config{padding:.3rem .6rem;font-size:.75em;color:var(--color-text-secondary);background:transparent;border:1px solid var(--color-border);border-radius:4px;cursor:pointer;transition:all .15s ease}.btn-config:hover{color:var(--color-text-secondary);background:#2c2c2e0d}.btn-config.active{color:var(--color-text);border-color:var(--color-accent);background:var(--color-accent-subtle)}.error-banner{padding:.5rem .75rem;background:#c4645426;border-bottom:1px solid rgba(196,100,84,.3);color:var(--color-error);font-size:.8em;max-height:120px;overflow-y:auto;white-space:pre-wrap;word-break:break-word}.tutorial-bar{flex-shrink:0}.app.embed{height:100vh;margin-top:0}.app.embed .panels{grid-template-columns:1fr}.app.embed.split .panels{grid-template-columns:1fr 1fr}.analyzer-panel{display:flex;flex-direction:column;height:100%;min-height:0;min-width:0;background:var(--color-surface)}.analyzer-toolbar{display:flex;align-items:center;gap:.75rem;padding:.4rem .75rem;background:var(--color-surface-raised);border-bottom:1px solid var(--color-bg);flex-shrink:0}.analyzer-toolbar select{padding:.2rem .4rem;font-size:.75em;background:var(--color-bg);color:var(--color-text);border:1px solid var(--color-border);border-radius:3px;outline:none;cursor:pointer}.analyzer-toolbar select:focus{border-color:var(--color-accent)}.btn-run{padding:.3rem .75rem;font-size:.75em;font-weight:500;color:var(--color-text-inverse);background:var(--color-accent);border:1px solid var(--color-accent);border-radius:4px;cursor:pointer;transition:all .15s ease}.btn-run:hover{background:var(--color-accent-hover);color:var(--color-text-inverse)}.btn-run:disabled{background:var(--color-border);border-color:var(--color-border);color:var(--color-text-secondary);cursor:not-allowed}.btn-help{width:22px;height:22px;padding:0;font-size:.75em;font-weight:700;line-height:1;color:var(--color-text-secondary);background:transparent;border:1px solid var(--color-border);border-radius:50%;cursor:pointer;transition:all .15s ease;flex-shrink:0}.btn-help:hover{color:var(--color-text);border-color:var(--color-accent);background:var(--color-accent-subtle)}.help-popover{position:relative;background:var(--color-bg);border:1px solid var(--color-border);border-bottom:1px solid var(--color-bg);padding:.6rem .75rem;font-size:.75em;color:var(--color-text-secondary);flex-shrink:0}.help-popover-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem;font-weight:600;color:var(--color-text);font-size:1.05em}.help-popover-close{background:none;border:none;color:var(--color-text-secondary);font-size:1.3em;cursor:pointer;padding:0 .2rem;line-height:1}.help-popover-close:hover{color:var(--color-text)}.help-popover-table{width:100%;border-collapse:collapse}.help-popover-table td{padding:.2rem 0}.help-popover-table td:first-child{white-space:nowrap;padding-right:1.5rem;color:var(--color-text)}.help-popover-table td:last-child{color:var(--color-text-secondary)}.help-popover-table kbd{display:inline-block;padding:.1rem .35rem;font-family:JetBrains Mono,Fira Code,monospace;font-size:.9em;color:var(--color-text);background:var(--color-border);border:1px solid var(--color-border);border-radius:3px;line-height:1.4}.help-popover-hint{margin-top:.5rem;padding-top:.4rem;border-top:1px solid var(--color-border);color:var(--color-text-secondary);line-height:1.5}.help-popover-hint code{padding:.1rem .3rem;font-family:JetBrains Mono,Fira Code,monospace;font-size:.9em;background:var(--color-border);border-radius:2px;color:var(--color-accent)}.help-popover-hint strong{color:var(--color-text-secondary)}.pyodide-status{margin-left:auto;font-size:.7em;display:flex;align-items:center;gap:.35rem}.pyodide-dot{width:7px;height:7px;border-radius:50%}.pyodide-dot.loading{background:var(--color-warning);animation:pulse 1s infinite}.pyodide-dot.ready{background:var(--color-success)}.pyodide-dot.idle{background:var(--color-text-tertiary)}.pyodide-status-text{color:var(--color-text-secondary)}.analyzer-editor{flex:1 1 0%;overflow:hidden;min-height:0}.analyzer-editor .cm-editor{height:100%}.analyzer-editor .cm-editor .cm-scroller{font-family:JetBrains Mono,Fira Code,SF Mono,monospace;font-size:13px}.analyzer-output{height:200px;flex-shrink:0;display:flex;flex-direction:column;border-top:1px solid var(--color-bg);overflow:hidden}.analyzer-output-tabs{display:flex;gap:0;flex-shrink:0;background:var(--color-surface-raised);border-bottom:1px solid var(--color-bg)}.analyzer-output-tab{padding:.3rem .7rem;font-size:.72em;color:var(--color-text-secondary);background:transparent;border:none;border-bottom:2px solid transparent;cursor:pointer;transition:all .15s ease}.analyzer-output-tab:hover{color:var(--color-text-secondary);background:#2c2c2e08}.analyzer-output-tab.active{color:var(--color-text);border-bottom-color:var(--color-accent);background:var(--color-accent-subtle)}.analyzer-output-content{flex:1;overflow:auto;padding:.5rem .75rem;font-family:JetBrains Mono,Fira Code,monospace;font-size:12px;color:var(--color-text-secondary);white-space:pre-wrap;word-break:break-word}.analyzer-output-content .error-text{color:var(--color-error)}.analyzer-output-placeholder{color:var(--color-text-tertiary);font-style:italic}.findings-list{display:flex;flex-direction:column;gap:.4rem}.finding-card{padding:.5rem .75rem;border-radius:4px;border-left:3px solid;background:#2c2c2e08}.finding-card.severity-critical,.finding-card.severity-high{border-left-color:var(--color-error);background:#c4645414}.finding-card.severity-medium{border-left-color:var(--color-warning);background:#c4a56114}.finding-card.severity-low,.finding-card.severity-info{border-left-color:var(--color-info);background:#84a3a114}.finding-severity{font-size:.7em;font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-bottom:.2rem}.severity-critical .finding-severity,.severity-high .finding-severity{color:var(--color-error)}.severity-medium .finding-severity{color:var(--color-warning)}.severity-low .finding-severity,.severity-info .finding-severity{color:var(--color-info)}.finding-message{font-size:.8em;color:var(--color-text);line-height:1.4}.finding-node{font-size:.68em;color:var(--color-text-tertiary);margin-top:.2rem;font-family:JetBrains Mono,Fira Code,monospace}.query-panel{display:flex;flex-direction:column;height:100%;min-height:0;min-width:0;background:var(--color-surface)}.query-tabs{display:flex;gap:0;flex-shrink:0;background:var(--color-surface-raised);border-bottom:1px solid var(--color-bg)}.query-tab{padding:.35rem .75rem;font-size:.75em;color:var(--color-text-secondary);background:transparent;border:none;border-bottom:2px solid transparent;cursor:pointer;transition:all .15s ease}.query-tab:hover{color:var(--color-text-secondary);background:#2c2c2e08}.query-tab.active{color:var(--color-text);border-bottom-color:var(--color-accent);background:var(--color-accent-subtle)}.query-checks{flex:1;display:flex;flex-direction:column;overflow:hidden}.query-controls{display:flex;align-items:center;gap:.75rem;padding:.5rem .75rem;background:var(--color-surface);border-bottom:1px solid var(--color-bg);flex-shrink:0}.query-controls select{flex:1;padding:.3rem .5rem;font-size:.75em;background:var(--color-bg);color:var(--color-text);border:1px solid var(--color-border);border-radius:3px;outline:none;cursor:pointer}.query-controls select:focus{border-color:var(--color-accent)}.query-btn{padding:.3rem .75rem;font-size:.75em;font-weight:500;color:var(--color-text-inverse);background:var(--color-accent);border:1px solid var(--color-accent);border-radius:4px;cursor:pointer;transition:all .15s ease;white-space:nowrap}.query-btn:hover{background:var(--color-accent-hover);color:var(--color-text-inverse)}.query-btn:disabled{background:var(--color-border);border-color:var(--color-border);color:var(--color-text-secondary);cursor:not-allowed}.query-btn-secondary{background:transparent;border-color:var(--color-border);color:var(--color-text-secondary)}.query-btn-secondary:hover{background:#2c2c2e0d;border-color:var(--color-accent);color:var(--color-text)}.query-check-info{padding:.5rem .75rem;background:var(--color-accent-subtle);border-bottom:1px solid var(--color-bg);flex-shrink:0}.query-check-meta{display:flex;align-items:center;gap:.5rem;margin-bottom:.25rem}.query-check-description{font-size:.75em;color:var(--color-text-secondary);line-height:1.4}.query-badge{display:inline-block;padding:.1rem .4rem;font-size:.65em;font-weight:600;text-transform:uppercase;letter-spacing:.5px;border-radius:3px}.query-badge-cwe{background:#84a3a126;color:var(--color-info);border:1px solid rgba(132,163,161,.3)}.query-badge-severity{border:1px solid}.query-badge-severity.error{background:#c464541f;color:var(--color-error);border-color:#c464544d}.query-badge-severity.warning{background:#c4a5611f;color:var(--color-warning);border-color:#c4a5614d}.query-badge-severity.info{background:#84a3a11f;color:var(--color-info);border-color:#84a3a14d}.query-badge-category{background:var(--color-accent-subtle);color:var(--color-accent);border:1px solid rgba(61,155,143,.25)}.query-findings{flex:1;overflow:auto;padding:.5rem .75rem}.query-findings-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.query-findings-title{font-size:.72em;font-weight:500;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.5px}.query-findings-count{font-size:.7em;color:var(--color-text-secondary)}.query-findings-elapsed{font-size:.65em;color:var(--color-text-tertiary)}.query-finding-list{display:flex;flex-direction:column;gap:.4rem}.query-finding-card{padding:.5rem .75rem;border-radius:4px;border-left:3px solid;background:#2c2c2e08}.query-finding-card.severity-error{border-left-color:var(--color-error);background:#c4645414}.query-finding-card.severity-warning{border-left-color:var(--color-warning);background:#c4a56114}.query-finding-card.severity-info{border-left-color:var(--color-info);background:#84a3a114}.query-finding-top{display:flex;align-items:center;gap:.5rem;margin-bottom:.25rem}.query-finding-severity{font-size:.65em;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.severity-error .query-finding-severity{color:var(--color-error)}.severity-warning .query-finding-severity{color:var(--color-warning)}.severity-info .query-finding-severity{color:var(--color-info)}.query-finding-check{font-size:.65em;color:var(--color-text-tertiary);font-family:JetBrains Mono,Fira Code,monospace}.query-finding-cwe{margin-left:auto;font-size:.6em;color:var(--color-info);font-family:JetBrains Mono,Fira Code,monospace}.query-finding-message{font-size:.8em;color:var(--color-text);line-height:1.4}.query-finding-object{font-size:.6em;font-family:JetBrains Mono,Fira Code,monospace;background:var(--color-accent-subtle);color:var(--color-accent);padding:.05rem .35rem;border-radius:3px;border:1px solid rgba(61,155,143,.3)}.query-finding-path{margin-top:.4rem;padding-left:.5rem;border-left:2px solid var(--color-border);display:flex;flex-direction:column;gap:.2rem}.query-finding-path-event{display:flex;align-items:baseline;gap:.4rem;font-size:.7em}.query-path-marker{flex-shrink:0;font-weight:600;font-size:.9em;text-transform:uppercase;letter-spacing:.3px}.query-finding-path-event:first-child .query-path-marker{color:var(--color-info)}.query-finding-path-event:not(:first-child) .query-path-marker{color:var(--color-error)}.query-path-location{font-family:JetBrains Mono,Fira Code,monospace;font-size:.9em;color:var(--color-text-secondary)}.query-placeholder{display:flex;align-items:center;justify-content:center;height:100%;color:var(--color-text-tertiary);font-size:.85em;text-align:center;padding:2rem}.query-placeholder p{max-width:280px;line-height:1.6}.query-raw{flex:1;display:flex;flex-direction:column;overflow:hidden}.query-raw-input{flex:1;display:flex;flex-direction:column;padding:.5rem .75rem;gap:.4rem;border-bottom:1px solid var(--color-bg);min-height:0;overflow:hidden}.query-raw-presets{display:flex;align-items:center;gap:.5rem}.query-raw-presets select{flex:1;padding:.3rem .5rem;font-size:.75em;background:var(--color-bg);color:var(--color-text);border:1px solid var(--color-border);border-radius:3px;outline:none;cursor:pointer}.query-raw-presets select:focus{border-color:var(--color-accent)}.query-raw-validity{font-size:.65em;font-weight:600;white-space:nowrap;flex-shrink:0;text-transform:uppercase;letter-spacing:.3px}.query-raw-validity.valid{color:var(--color-success)}.query-raw-validity.invalid{color:var(--color-error)}.query-raw-editor{flex:1;min-height:0;border:1px solid var(--color-border);border-radius:4px;overflow:hidden}.query-raw-editor .cm-editor{height:100%}.query-raw-editor .cm-editor.cm-focused{outline:none}.query-raw-editor .cm-scroller{font-family:JetBrains Mono,Fira Code,monospace;font-size:12px}.query-raw-json-error{font-size:.65em;color:var(--color-error);padding:.15rem 0;line-height:1.3}.query-raw-actions{display:flex;gap:.5rem}.query-raw-output{flex:1;overflow:auto;padding:.5rem .75rem}.query-raw-output pre{margin:0;font-family:JetBrains Mono,Fira Code,monospace;font-size:12px;color:var(--color-text-secondary);white-space:pre-wrap;word-break:break-word;line-height:1.5}.query-raw-output .error-text{color:var(--color-error)}.query-unsupported-notice .query-findings-header{margin-bottom:.25rem}.query-unsupported-detail{font-size:.75em;color:var(--color-text-secondary);line-height:1.5;margin:0}.query-unsupported-detail code{font-family:JetBrains Mono,Fira Code,monospace;font-size:.9em;background:var(--color-accent-subtle);color:var(--color-accent);padding:.1rem .3rem;border-radius:3px}.query-spinner{display:inline-block;width:12px;height:12px;border:2px solid var(--color-border);border-top-color:var(--color-accent);border-radius:50%;animation:query-spin .6s linear infinite;margin-right:.3rem;vertical-align:middle}@keyframes query-spin{to{transform:rotate(360deg)}}.tutorial-panel{display:flex;flex-direction:column;height:160px;background:var(--color-surface);border-bottom:1px solid var(--color-bg);flex-shrink:0;overflow:hidden}.tutorial-header{display:flex;align-items:center;justify-content:space-between;padding:.4rem .75rem;background:var(--color-surface-raised);border-bottom:1px solid var(--color-bg)}.tutorial-title{font-size:.85em;font-weight:600;color:var(--color-text)}.tutorial-exit{padding:.2rem .5rem;font-size:.7em;color:var(--color-text-secondary);background:transparent;border:1px solid var(--color-border);border-radius:3px;cursor:pointer;transition:all .15s ease}.tutorial-exit:hover{color:var(--color-text);border-color:var(--color-error);background:#c464541a}.tutorial-body{flex:1;padding:.4rem .75rem;overflow-y:auto}.tutorial-step-counter{font-size:.7em;color:var(--color-text-secondary);margin-bottom:.2rem;text-transform:uppercase;letter-spacing:.5px}.tutorial-step-title{font-size:.8em;font-weight:600;color:var(--color-text);margin-bottom:.3rem}.tutorial-step-text{font-size:.75em;color:var(--color-text-secondary);line-height:1.5}.tutorial-prompt{margin-top:.3rem;padding:.3rem .5rem;font-size:.72em;color:var(--color-accent);background:var(--color-accent-subtle);border-left:3px solid var(--color-accent);border-radius:0 3px 3px 0;line-height:1.4}.tutorial-nav{display:flex;justify-content:space-between;padding:.3rem .75rem;border-top:1px solid var(--color-bg);gap:.5rem}.tutorial-nav .btn-primary{font-size:.72em;padding:.25rem .6rem}