*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:14px;color:#333;background:#f0f0f0}html,body{display:flex;flex-direction:column}#toolbar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;min-height:48px;background:#2d2d2d;padding:4px 8px;-webkit-user-select:none;user-select:none;gap:2px}#workspace{display:flex;flex:1;min-height:0}#viewport-container{flex:1;position:relative;overflow:hidden}#viewport{display:block;width:100%;height:100%}#primitives-panel{width:80px;background:#3a3a3a;border-right:1px solid #555;padding:8px 6px;display:flex;flex-direction:column;gap:6px;overflow-y:auto;-webkit-user-select:none;user-select:none}#primitives-panel h3{font-size:11px;color:#aaa;text-transform:uppercase;letter-spacing:.5px;text-align:center;margin-bottom:2px;padding-bottom:4px;border-bottom:1px solid #555}.prim-btn{display:flex;flex-direction:column;align-items:center;gap:3px;background:none;border:1px solid transparent;color:#ddd;padding:8px 4px;border-radius:6px;cursor:pointer;transition:background .15s,border-color .15s}.prim-btn:hover{background:#ffffff1f;border-color:#fff3}.prim-btn:active{background:#4a90d94d}.prim-icon{font-size:22px;line-height:1}.prim-label{font-size:11px;white-space:nowrap}#properties-panel{width:220px;background:#fff;border-left:1px solid #ccc;padding:12px;overflow-y:auto}#axis-indicator{position:absolute;left:8px;bottom:8px;width:120px;height:120px;pointer-events:none;z-index:10}#properties-panel h3{font-size:14px;color:#555;margin-bottom:10px;padding-bottom:6px;border-bottom:1px solid #ddd}.hint{color:#999;font-size:13px;font-style:italic}.prop-group{margin-bottom:12px}.prop-group>label{display:block;font-size:12px;color:#777;margin-bottom:4px}.prop-row{display:flex;align-items:center;gap:6px;margin-bottom:4px}.prop-row span{width:16px;font-size:12px;font-weight:700}.axis-x{color:#e74c3c}.axis-y{color:#27ae60}.axis-z{color:#2980b9}.prop-row input{flex:1;width:100%;padding:3px 6px;border:1px solid #ccc;border-radius:3px;font-size:13px}.prop-row input:focus{outline:none;border-color:#4a90d9}.color-row{gap:8px}.color-row input[type=color]{width:36px;height:28px;padding:2px;border:1px solid #ccc;border-radius:4px;cursor:pointer;background:none}.color-row input[type=color]::-webkit-color-swatch-wrapper{padding:2px}.color-row input[type=color]::-webkit-color-swatch{border:none;border-radius:2px}.color-value{font-size:12px;color:#777;font-family:monospace;width:auto!important}#statusbar{display:flex;justify-content:space-between;align-items:center;height:36px;background:#e8e8e8;border-top:1px solid #ccc;padding:0 12px;font-size:13px}.statusbar-left,.statusbar-center,.statusbar-right{display:flex;align-items:center;gap:6px}.statusbar-btn{background:none;border:1px solid transparent;padding:4px 10px;border-radius:3px;cursor:pointer;font-size:13px}.statusbar-btn:hover{background:#d0d0d0}.statusbar-btn.active{background:#4a90d9;color:#fff;border-color:#3a7cc0}.statusbar-btn kbd{display:inline-block;font-family:inherit;font-size:11px;background:#0000001f;border:1px solid rgba(0,0,0,.15);border-radius:3px;padding:0 4px;margin-left:3px;line-height:1.4}.statusbar-btn.active kbd{background:#fff3;border-color:#ffffff40}#grid-size{padding:2px 4px;border:1px solid #ccc;border-radius:3px;font-size:13px}.statusbar-separator{color:#bbb;margin:0 2px;font-size:11px}.statusbar-link{color:#4a90d9;text-decoration:none;font-size:12px;white-space:nowrap}.statusbar-link:hover{text-decoration:underline}.toolbar-left,.toolbar-right{display:flex;flex-wrap:wrap;align-items:center;gap:2px}.toolbar-brand{display:flex;align-items:center;gap:6px;text-decoration:none;color:#eee;padding:4px 8px;border-radius:4px;transition:background .15s}.toolbar-brand:hover{background:#ffffff1a}.brand-logo{flex-shrink:0}.brand-name{font-size:15px;font-weight:600;letter-spacing:.3px;white-space:nowrap}.toolbar-separator{width:1px;height:24px;background:#ffffff26;margin:0 4px}.toolbar-btn{display:flex;align-items:center;gap:4px;background:none;border:1px solid transparent;color:#eee;padding:6px 10px;border-radius:4px;cursor:pointer;font-size:13px;white-space:nowrap;min-height:36px;transition:background .15s,border-color .15s}.toolbar-btn:hover{background:#ffffff1a;border-color:#fff3}.toolbar-btn:active{background:#fff3}.toolbar-btn-danger:hover{background:#dc323240;border-color:#dc323266}.btn-icon{font-size:16px}.btn-label{font-size:13px}.toolbar-group{position:relative}.dropdown{display:none;position:absolute;top:100%;left:0;background:#2d2d2d;border:1px solid #555;border-radius:4px;min-width:140px;z-index:1000;box-shadow:0 4px 12px #0000004d}.dropdown.open{display:block}.dropdown-item{display:block;width:100%;padding:8px 16px;background:none;border:none;color:#eee;text-align:left;cursor:pointer;font-size:13px}.dropdown-item:hover{background:#4a90d9}@media(max-width:900px){.toolbar-btn .btn-label{display:none}.toolbar-btn{padding:6px 8px}.toolbar-separator{height:20px;margin:0 2px}#primitives-panel{width:60px;padding:6px 4px}.prim-icon{font-size:18px}.prim-label{font-size:10px}#properties-panel{width:180px}}@media(max-width:640px){.toolbar-btn .btn-label{display:none}.toolbar-btn{padding:4px 6px;min-height:30px}.btn-icon{font-size:14px}.brand-name{display:none}#properties-panel{width:150px;padding:8px}}.modal-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;z-index:2000;justify-content:center;align-items:center}.modal-overlay.open{display:flex}.modal{background:#fff;border-radius:8px;padding:24px;min-width:320px;box-shadow:0 8px 32px #0000004d}.modal h2{margin-bottom:16px;font-size:18px;color:#333}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}.modal-btn{padding:8px 16px;border:1px solid #ccc;border-radius:4px;cursor:pointer;font-size:14px}.modal-btn.primary{background:#4a90d9;color:#fff;border-color:#3a7cc0}.modal-btn.primary:hover{background:#3a7cc0}