:root{--bg:#f1f5f9;--panel:#fff;--ink:#0f172a;--muted:#64748b;--line:#e2e8f0;--accent:#7c3aed;font-family:Inter,system-ui,-apple-system,sans-serif}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--ink);margin:0}#app{flex-direction:column;height:100vh;display:flex}.topbar{background:var(--panel);border-bottom:1px solid var(--line);flex-wrap:wrap;align-items:center;gap:10px 16px;padding:10px 16px;display:flex}.brand{align-items:center;gap:10px;display:flex}.logo{flex:none;width:40px;height:40px}.brand h1{margin:0;font-size:16px}.tagline{color:var(--muted);margin:2px 0 0;font-size:11.5px}.level-control{align-items:center;gap:10px;display:flex}.level-label{color:var(--muted);text-transform:uppercase;letter-spacing:.04em;font-size:11px}#level{width:120px;accent-color:var(--accent)}.level-name{color:var(--accent);min-width:215px;font-size:12.5px;font-weight:600}.layer-toggles{gap:5px;margin-left:auto;display:flex}.toggle{border:1px solid var(--line);cursor:pointer;-webkit-user-select:none;user-select:none;background:#fff;border-radius:999px;align-items:center;gap:5px;padding:4px 8px;font-size:11.5px;display:inline-flex}.toggle input{accent-color:var(--accent);margin:0}.workspace{flex:1;min-height:0;display:flex}.editor-pane{border-right:1px solid var(--line);background:var(--panel);flex-direction:column;width:480px;min-width:320px;display:flex}.pane-head{color:var(--muted);border-bottom:1px solid var(--line);text-transform:uppercase;letter-spacing:.04em;justify-content:space-between;align-items:center;padding:8px 14px;font-size:12px;font-weight:600;display:flex}.pane-actions{gap:6px;display:flex}.demo-pick{text-transform:uppercase;letter-spacing:.04em;color:var(--muted);align-items:center;gap:6px;font-size:10px;display:inline-flex}.demo-pick select{text-transform:none;letter-spacing:0;border:1px solid var(--line);color:var(--ink);cursor:pointer;background:#fff;border-radius:6px;max-width:200px;padding:3px 6px;font-size:11.5px}.ghost-btn{border:1px solid var(--line);color:var(--muted);cursor:pointer;text-transform:none;letter-spacing:0;background:#fff;border-radius:6px;padding:3px 9px;font-size:11px}.ghost-btn:hover{color:var(--ink);background:#f8fafc}.editor-stack{flex:1;min-height:0;position:relative}.editor-stack>pre.hl,.editor-stack>#dsl{tab-size:2;white-space:pre-wrap;word-break:break-word;overflow-wrap:break-word;border:0;margin:0;padding:14px;font-family:JetBrains Mono,ui-monospace,Menlo,monospace;font-size:12.5px;line-height:1.55;position:absolute;inset:0;overflow:auto}.editor-stack>pre.hl{pointer-events:none;z-index:0;color:#1e293b;background:#fff}.editor-stack>#dsl{z-index:1;resize:none;color:#0000;caret-color:#1e293b;background:0 0;outline:none}.editor-stack>#dsl::selection{background:#c7d2fe}.hl-cm{color:#94a3b8;font-style:italic}.hl-st{color:#15803d}.hl-kw{color:#7c3aed;font-weight:600}.hl-va{color:#0891b2}.hl-op{color:#db2777;font-weight:600}.hl-pn{color:#64748b}.hl-nu{color:#c2410c}.hl-id{color:#1e293b}.hl-po{color:#0d9488;font-weight:700}.parse-status{border-top:1px solid var(--line);padding:7px 14px;font-family:ui-monospace,monospace;font-size:11.5px}.parse-status.ok{color:#16a34a}.parse-status.error{color:#dc2626}.map-pane{flex-direction:column;flex:1;min-width:0;display:flex;position:relative}.map-body{flex:1;min-height:0;display:flex}.canvas-wrap{background:radial-gradient(circle at 1px 1px,#dbe2ea 1px,#0000 0) 0 0/22px 22px;flex:1;grid-template:minmax(0,1fr)/minmax(0,1fr);place-items:center;padding:24px;display:grid;overflow:auto}.canvas-wrap svg{max-width:100%;max-height:100%;display:block}.canvas-wrap svg g.has-tip{cursor:help}.svg-tip{z-index:1000;pointer-events:none;color:#fff;white-space:pre-line;background:#0f172a;border-radius:6px;max-width:340px;padding:5px 9px;font-size:11.5px;line-height:1.4;display:none;position:fixed;box-shadow:0 4px 14px #0f172a47}.insight-panel{border-left:1px solid var(--line);background:var(--panel);width:300px;min-width:300px;padding:8px 0;overflow:auto}.insight-panel.collapsed{display:none}.insight-block{border-bottom:1px solid var(--line);padding:10px 16px}.insight-block h3{text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:4px 0 8px;font-size:11px}.insight-block ul{margin:0;padding:0;list-style:none}.insight-block li{color:#334155;margin-bottom:9px;font-size:12px;line-height:1.5}.insight-block ul.sub{border-left:2px solid var(--line);margin:3px 0 0 12px;padding-left:8px}.insight-block ul.sub li{margin-bottom:2px;font-size:11px}.muted{color:var(--muted)}.pad{padding:16px}.score{float:right;color:#0f172a;font-weight:700}.risk-dot{vertical-align:middle;border-radius:50%;width:9px;height:9px;margin-right:6px;display:inline-block}.risk-dot.low{background:#16a34a}.risk-dot.medium{background:#d97706}.risk-dot.high{background:#dc2626}