:root{--bg: #14181d;--panel: #191f26;--panel2: #1f2630;--border: #29323e;--border2: #3a4655;--text: #dce4ee;--dim: #8b98a9;--faint: #5b6774;--accent: #d9913f;--track: #20262e;--danger: #d05a4e;--mono: ui-monospace, "JetBrainsMono Nerd Font", "JetBrains Mono", "Cascadia Code", "IBM Plex Mono", Menlo, Consolas, monospace}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:var(--mono);font-size:14px;overscroll-behavior:none}.app{height:100%;display:flex;flex-direction:column}.toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:7px;padding:6px 12px;min-height:52px;flex:none;background:var(--panel);border-bottom:1px solid var(--border)}.brand{font-size:11px;font-weight:700;letter-spacing:2.5px;color:var(--accent);padding:4px 9px 3px;border:1px solid color-mix(in srgb,var(--accent) 45%,transparent);border-radius:4px;-webkit-user-select:none;user-select:none;white-space:nowrap}.title-input{background:transparent;border:1px solid transparent;border-radius:5px;color:var(--text);font:inherit;font-size:14px;padding:6px 9px;width:clamp(160px,24vw,400px)}.title-input:hover{border-color:var(--border)}.title-input:focus{outline:none;border-color:var(--border2);background:var(--bg)}.tb-sep{width:1px;height:26px;background:var(--border);margin:0 4px;flex:none}.tb-spacer{flex:1}.tb-group{display:flex;gap:2px}.tb-btn{background:transparent;border:1px solid transparent;border-radius:6px;color:var(--dim);font-family:var(--mono);font-size:13px;padding:6px 10px;cursor:pointer;white-space:nowrap;line-height:1.3}.tb-btn:hover:not(:disabled){color:var(--text);background:var(--panel2);border-color:var(--border)}.tb-btn.active{color:var(--text);background:var(--panel2);border-color:var(--border2);box-shadow:inset 0 -2px color-mix(in srgb,var(--accent) 70%,transparent)}.tb-btn:disabled{opacity:.35;cursor:default}.tb-btn.icon{padding:6px 7px 4px}.tb-btn.lg{font-size:19px;padding:2px 13px;line-height:1.4}.tb-btn.danger:hover{color:#ffd7d2;border-color:var(--danger)}.tb-btn.primary{color:var(--text);border-color:var(--border2);background:var(--panel2)}.caret{font-size:9px;opacity:.7}.swatches{display:flex;gap:4px;align-items:center;flex-wrap:wrap}.swatch{border:1px solid;border-radius:4px;cursor:pointer;padding:0;flex:none}.swatch:hover{transform:scale(1.15)}.swatch.picked{outline:2px solid #e8eef6;outline-offset:1px}.menu-wrap{position:relative}.menu{position:absolute;top:calc(100% + 4px);right:0;z-index:60;background:var(--panel2);border:1px solid var(--border2);border-radius:7px;padding:4px;min-width:210px;box-shadow:0 10px 30px #00000080;display:flex;flex-direction:column}.menu button{background:none;border:none;border-radius:5px;color:var(--text);font-family:var(--mono);font-size:13px;text-align:left;padding:8px 11px;cursor:pointer}.menu button:hover{background:var(--border)}.popover-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50}.main{flex:1;display:flex;min-height:0}.canvas-scroll{flex:1;overflow:auto;scrollbar-width:thin;scrollbar-color:var(--border2) transparent}.canvas-grid{display:grid;width:max-content;min-width:100%;-webkit-user-select:none;user-select:none;padding-right:64px}.cg.corner{position:sticky;left:0;top:0;z-index:30;background:var(--bg)}.cg.header{position:sticky;top:0;z-index:20;background:var(--bg)}.cg.gutter{position:sticky;left:0;z-index:20;background:var(--bg)}.tl-gutter{display:flex;flex-direction:column;padding-right:4px}.gutter-row{position:relative;display:flex;align-items:center;border-radius:6px}.gutter-row:hover{background:var(--panel)}.gutter-row.reorder-target{outline:1px dashed var(--border2);outline-offset:-1px}.grab{width:20px;color:var(--faint);font-size:13px;text-align:center;cursor:grab;opacity:0;flex:none}.gutter-row:hover .grab{opacity:1}.labels{flex:1;min-width:0;text-align:right;padding-right:10px;cursor:text;line-height:1.2}.labels .lab{font-size:14px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.labels .sub{font-size:11px;color:var(--faint);white-space:pre-line}.ghost-lab{color:var(--faint);font-weight:400}.row-actions{position:absolute;left:calc(100% + 2px);top:50%;transform:translateY(-50%);display:none;gap:2px;background:var(--panel2);border:1px solid var(--border2);border-radius:7px;padding:3px;z-index:6;box-shadow:0 4px 14px #00000073}.gutter-row:hover .row-actions{display:flex}.row-actions button{background:none;border:none;color:var(--dim);font-family:var(--mono);font-size:14px;padding:5px 10px;cursor:pointer;border-radius:5px;line-height:1.2}.row-actions button:hover{color:var(--text);background:var(--border)}.add-row{margin:8px 10px 12px 20px;background:none;border:1px dashed var(--border);border-radius:6px;color:var(--faint);font-family:var(--mono);font-size:13px;padding:7px;cursor:pointer}.add-row:hover{color:var(--dim);border-color:var(--border2)}.row-edit-popover{position:absolute;left:8px;top:2px;z-index:55;width:210px;background:var(--panel2);border:1px solid var(--border2);border-radius:7px;padding:8px;display:flex;flex-direction:column;gap:6px;box-shadow:0 10px 30px #00000080}.row-edit-popover input,.row-edit-popover textarea{background:var(--bg);border:1px solid var(--border);border-radius:5px;color:var(--text);font-family:var(--mono);font-size:13px;padding:5px 7px;resize:vertical}.row-edit-popover .hint{font-size:10px;color:var(--faint)}.cg.body svg{cursor:crosshair}.slot-edit{position:absolute;z-index:40;background:#0a0d11eb;border:1px solid var(--border2);border-radius:5px;color:var(--text);font-family:var(--mono);font-size:13.5px;text-align:center;padding:0 6px}.slot-edit:focus{outline:none;border-color:var(--accent)}.tl-tooltip{position:fixed;z-index:80;max-width:380px;background:#0b0e12f5;border:1px solid var(--border2);border-radius:6px;padding:8px 11px;font-size:13px;color:var(--text);white-space:pre-wrap;pointer-events:none;box-shadow:0 8px 24px #00000080;opacity:0;animation:tip-in .12s ease-out .25s forwards}@keyframes tip-in{to{opacity:1}}.side{position:relative;flex:none;display:flex}.side.closed{width:0}.side-toggle{position:absolute;left:-17px;top:50%;transform:translateY(-50%);width:17px;height:56px;z-index:25;background:var(--panel);border:1px solid var(--border);border-right:none;border-radius:8px 0 0 8px;color:var(--dim);cursor:pointer;font-size:11px;padding:0}.side-toggle:hover{color:var(--text);background:var(--panel2);border-color:var(--border2)}.inspector{width:300px;flex:none;background:var(--panel);border-left:1px solid var(--border);overflow-y:auto;padding:14px;scrollbar-width:thin;scrollbar-color:var(--border2) transparent}.insp-head{font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--accent);margin-bottom:14px;display:flex;justify-content:space-between;align-items:baseline;gap:8px}.insp-loc{font-weight:400;letter-spacing:0;text-transform:none;color:var(--faint);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.field{margin-bottom:13px;display:flex;flex-direction:column;gap:6px}.field-label{font-size:10.5px;letter-spacing:1.2px;text-transform:uppercase;color:var(--faint)}.field input:not([type=checkbox]):not([type=range]),.field textarea{background:var(--bg);border:1px solid var(--border);border-radius:5px;color:var(--text);font-family:var(--mono);font-size:13px;padding:6px 8px;width:100%;resize:vertical}.field input:focus,.field textarea:focus{outline:none;border-color:var(--border2)}.field input.num{width:72px}.field input[type=range]{accent-color:var(--accent)}.style-row{display:flex;gap:2px;flex-wrap:wrap}.pos-row{display:flex;gap:6px;align-items:center;color:var(--faint);font-size:12px}.check{display:flex;gap:8px;align-items:center;color:var(--dim);font-size:12.5px;cursor:pointer}.check input{accent-color:var(--accent)}.insp-actions{display:flex;gap:6px;margin-top:14px;padding-top:12px;border-top:1px solid var(--border)}.insp-tips{margin-top:16px;padding-top:12px;border-top:1px solid var(--border);color:var(--faint);font-size:12px;line-height:1.8}.marker-panel{flex:none;background:var(--panel);border-top:1px solid var(--border);display:flex;flex-direction:column}.mp-head{display:flex;align-items:center;gap:12px;padding:4px 12px;min-height:34px}.mp-toggle{background:none;border:1px solid transparent;border-radius:5px;color:var(--dim);font-family:var(--mono);font-size:12px;padding:3px 8px;cursor:pointer}.mp-toggle:hover{color:var(--text);background:var(--panel2);border-color:var(--border)}.mp-title{font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--accent)}.mp-count{color:var(--faint);font-size:12px}.mp-status{margin-left:auto;display:flex;gap:16px;color:var(--faint);font-size:12px;white-space:nowrap}.flash{color:var(--accent)}.mp-body{max-height:200px;overflow-y:auto;padding:0 12px 12px;display:flex;flex-direction:column;gap:3px;scrollbar-width:thin;scrollbar-color:var(--border2) transparent}.mp-empty{color:var(--faint);font-size:12.5px;padding:6px}.mrow{display:flex;align-items:center;gap:12px;padding:3px 8px;border-radius:6px}.mrow:hover{background:var(--panel2)}.mrow.active{background:var(--panel2);outline:1px solid var(--border2);outline-offset:-1px}.mchip{flex:none;width:23px;height:23px;border-radius:50%;background:#333c49;border:1px solid #4a5665;color:#d6dfeb;font-family:var(--mono);font-size:11px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0}.mchip:hover{outline:1.5px solid #e8eef6}.mcol{flex:none;width:70px;background:none;border:none;color:var(--faint);font-family:var(--mono);font-size:12.5px;text-align:left;cursor:pointer;padding:0}.mcol:hover{color:var(--dim)}.mtime{flex:none;color:var(--dim);font-size:12.5px}.mrow input{flex:1;min-width:0;background:transparent;border:1px solid transparent;border-radius:5px;color:var(--dim);font-family:var(--mono);font-size:13px;padding:4px 8px}.mrow:hover input{border-color:var(--border);color:var(--text)}.mrow input:focus{outline:none;background:var(--bg);border-color:var(--border2);color:var(--text)}.mdel{flex:none;background:none;border:none;color:var(--faint);font-family:var(--mono);font-size:13px;padding:3px 7px;border-radius:5px;cursor:pointer;opacity:0}.mrow:hover .mdel{opacity:1}.mdel:hover{color:#ffd7d2;background:var(--panel2)}.ticks-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:8px;padding:8px 8px 0;border-top:1px dashed var(--border)}.ticks-label{font-size:10.5px;letter-spacing:1.2px;text-transform:uppercase;color:var(--faint);margin-right:4px}.tick{background:var(--bg);border:1px solid var(--border);border-radius:5px;color:var(--dim);font-family:var(--mono);font-size:12.5px;padding:3px 9px;cursor:pointer}.tick span{color:var(--faint);font-size:11px}.tick:hover{border-color:var(--border2);color:var(--text)}.tick.active{border-color:#e8eef6;color:var(--text)}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;background:#05070a99;display:flex;align-items:center;justify-content:center}.modal{background:var(--panel);border:1px solid var(--border2);border-radius:10px;padding:20px;width:min(600px,92vw);max-height:84vh;overflow-y:auto;box-shadow:0 24px 70px #0009}.modal-title{font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--accent);margin-bottom:14px}.help-table{width:100%;border-collapse:collapse;font-size:13px}.help-table td{padding:5px 8px 5px 0;vertical-align:top}.help-table td:first-child{color:var(--text);white-space:nowrap;padding-right:18px}.help-table td:last-child{color:var(--dim)}.modal-note{margin-top:14px;padding-top:12px;border-top:1px solid var(--border);color:var(--dim);font-size:12.5px;line-height:1.6}.modal-note code{color:var(--accent)}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}.paste-area{width:100%;height:280px;background:var(--bg);border:1px solid var(--border);border-radius:6px;color:var(--text);font-family:var(--mono);font-size:12.5px;padding:10px;resize:vertical}.paste-area:focus{outline:none;border-color:var(--border2)}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:var(--border);border-radius:5px;border:2px solid var(--bg)}::-webkit-scrollbar-corner{background:transparent}
