*{box-sizing:border-box;margin:0;padding:0}:root{--bg-primary:#0f0f1a;--bg-secondary:#1a1a2e;--bg-tertiary:#25253e;--text-primary:#e0e0f0;--text-secondary:#88a;--accent:#6c63ff;--accent-hover:#5a52e0;--danger:#e74c3c;--border:#335;--panel-width:260px}body{background:var(--bg-primary);color:var(--text-primary);width:100vw;height:100vh;font-family:Segoe UI,system-ui,-apple-system,sans-serif;overflow:hidden}#root{width:100vw;height:100vh}button{cursor:pointer;border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-primary);border-radius:6px;padding:8px 16px;font-size:14px;transition:background .15s}button:hover{background:var(--accent)}button.primary{background:var(--accent);border-color:var(--accent)}button.primary:hover{background:var(--accent-hover)}button.danger{border-color:var(--danger)}button.danger:hover{background:var(--danger)}button.small{padding:4px 10px;font-size:12px}input,select{background:var(--bg-primary);border:1px solid var(--border);color:var(--text-primary);border-radius:4px;outline:none;padding:6px 10px;font-size:13px}input:focus,select:focus{border-color:var(--accent)}input[type=color]{cursor:pointer;width:40px;height:30px;padding:2px}label{color:var(--text-secondary);margin-bottom:3px;font-size:12px;display:block}.home{flex-direction:column;justify-content:center;align-items:center;gap:24px;height:100vh;display:flex}.home h1{letter-spacing:4px;font-size:48px;font-weight:300}.home h1 span{color:var(--accent)}.home p{color:var(--text-secondary);font-size:16px}.home-actions{gap:12px;margin-top:8px;display:flex}.recent-projects{width:400px;max-width:90vw;margin-top:24px}.recent-projects h3{color:var(--text-secondary);text-transform:uppercase;letter-spacing:1px;margin-bottom:8px;font-size:13px}.recent-item{background:var(--bg-secondary);cursor:pointer;border-radius:6px;justify-content:space-between;align-items:center;margin-bottom:6px;padding:10px 14px;transition:background .15s;display:flex}.recent-item:hover{background:var(--bg-tertiary)}.recent-item .name{font-weight:500}.recent-item .date{color:var(--text-secondary);font-size:12px}.recent-item .actions{gap:6px;display:flex}.canvas-wrapper{width:100%;height:100%;position:relative;overflow:hidden}.canvas-wrapper svg{-webkit-user-select:none;user-select:none;display:block}.canvas-wrapper{-webkit-user-select:none;user-select:none}.floating-toolbar{background:var(--bg-secondary);border:1px solid var(--border);z-index:10;border-radius:8px;gap:6px;padding:6px 12px;display:flex;position:absolute;top:12px;left:50%;transform:translate(-50%)}.floating-toolbar-left{z-index:10;gap:6px;display:flex;position:absolute;top:12px;left:12px}.floating-toolbar-right{z-index:10;gap:6px;display:flex;position:absolute;top:12px;right:12px}.editor-layout{width:100vw;height:100vh;display:flex}.panel{width:var(--panel-width);background:var(--bg-secondary);border-right:1px solid var(--border);flex-direction:column;flex-shrink:0;display:flex;overflow-y:auto}.panel-right{border-right:none;border-left:1px solid var(--border)}.project-name-label{cursor:pointer;flex:1}.project-name-label:hover{color:var(--accent)}.panel-header{border-bottom:1px solid var(--border);text-transform:uppercase;letter-spacing:.5px;color:var(--text-secondary);justify-content:space-between;align-items:center;padding:12px 14px;font-size:13px;font-weight:600;display:flex}.panel-content{flex:1;padding:10px}.scene-item{cursor:pointer;border-radius:4px;justify-content:space-between;align-items:center;margin-bottom:4px;padding:8px 10px;font-size:13px;display:flex}.scene-item:hover{background:var(--bg-tertiary)}.scene-item.active{background:var(--accent)}.scene-item.default:before{content:"★";color:gold;margin-right:6px}.prop-group{margin-bottom:14px}.prop-group h4{text-transform:uppercase;color:var(--text-secondary);letter-spacing:.5px;margin-bottom:6px;font-size:11px}.prop-row{align-items:center;gap:8px;margin-bottom:6px;display:flex}.prop-row label{min-width:28px;margin-bottom:0}.prop-row input,.prop-row select{flex:1;min-width:0}.element-item{cursor:pointer;border-radius:4px;justify-content:space-between;align-items:center;margin-bottom:3px;padding:6px 10px;font-size:12px;display:flex}.element-item:hover{background:var(--bg-tertiary)}.element-item.selected{background:var(--accent)}.editor-canvas{flex:1;min-width:0}.portal-rect{cursor:pointer}.selection-highlight{fill:none;stroke:#0f8;stroke-width:2px;stroke-dasharray:6 3;pointer-events:none}.new-object-menu{background:var(--bg-secondary);border:1px solid var(--border);z-index:20;border-radius:6px;min-width:160px;margin-top:4px;padding:4px;position:absolute;top:100%;right:0;box-shadow:0 4px 12px #0006}.menu-title{text-transform:uppercase;letter-spacing:.5px;color:var(--text-secondary);padding:4px 10px;font-size:11px}.menu-subtitle{color:var(--text-secondary);padding:4px 10px;font-size:10px}.menu-item{text-align:left;width:100%;color:var(--text-primary);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:6px 10px;font-size:13px;display:block}.menu-item:hover{background:var(--accent)}.menu-item-with-preview{align-items:center;gap:8px;display:flex}.menu-arrow{float:right;opacity:.5}.menu-back{text-align:left;width:100%;color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:4px 10px;font-size:12px;display:block}.menu-back:hover{background:var(--bg-tertiary)}.menu-divider{background:var(--border);height:1px;margin:4px 6px}.floating-new-menu{z-index:25;position:absolute}.modal-backdrop{z-index:50;background:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{background:var(--bg-secondary);border:1px solid var(--border);border-radius:10px;max-width:90vw;max-height:80vh;overflow-y:auto;box-shadow:0 8px 32px #00000080}.modal-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:14px 18px;font-size:15px;font-weight:600;display:flex}.modal-body{padding:18px}.modal-actions{justify-content:flex-end;gap:8px;margin-top:16px;display:flex}.shortcut-list{flex-direction:column;gap:2px;display:flex}.shortcut-section{text-transform:uppercase;letter-spacing:.5px;color:var(--text-secondary);margin-top:10px;margin-bottom:2px;font-size:11px}.shortcut-section:first-child{margin-top:0}.shortcut-row{justify-content:space-between;align-items:center;padding:4px 0;font-size:13px;display:flex}.shortcut-row kbd{background:var(--bg-tertiary);border:1px solid var(--border);text-align:center;border-radius:4px;min-width:60px;padding:2px 8px;font-family:monospace;font-size:12px}.context-menu{background:var(--bg-secondary);border:1px solid var(--border);z-index:30;border-radius:6px;min-width:180px;padding:4px;position:fixed;box-shadow:0 4px 16px #00000080}.context-menu-item{text-align:left;width:100%;color:var(--text-primary);cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:space-between;align-items:center;padding:6px 10px;font-size:13px;display:flex}.context-menu-item:hover:not(:disabled){background:var(--accent)}.context-menu-item:disabled{opacity:.35;cursor:default}.context-menu-item.danger{color:var(--danger)}.context-menu-item.danger:hover:not(:disabled){background:var(--danger);color:#fff}.context-menu-shortcut{color:var(--text-secondary);opacity:.7;margin-left:16px;font-size:11px}.gradient-editor{background:var(--bg-primary);border:1px solid var(--border);border-radius:4px;margin:6px 0 10px;padding:8px}.drop-overlay{border:3px dashed var(--accent);color:var(--accent);z-index:20;pointer-events:none;background:#6c63ff26;border-radius:8px;justify-content:center;align-items:center;font-size:18px;font-weight:500;display:flex;position:absolute;inset:0}.scene-label{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-primary);z-index:10;pointer-events:none;white-space:nowrap;text-overflow:ellipsis;border-radius:4px;max-width:60vw;padding:4px 14px;font-size:13px;position:absolute;bottom:12px;left:50%;overflow:hidden;transform:translate(-50%)}.zoom-indicator{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-secondary);z-index:10;pointer-events:none;border-radius:4px;padding:4px 10px;font-family:monospace;font-size:12px;position:absolute;bottom:12px;right:12px}.toast{background:var(--accent);color:#fff;z-index:100;border-radius:6px;padding:8px 20px;font-size:14px;font-weight:500;animation:.2s ease-out toast-in;position:fixed;bottom:24px;left:50%;transform:translate(-50%)}@keyframes toast-in{0%{opacity:0;transform:translate(-50%)translateY(10px)}to{opacity:1;transform:translate(-50%)translateY(0)}}