*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:#0f1319;color:#e6edf3;font-family:system-ui,-apple-system,Segoe UI,sans-serif}.app{height:100%;display:flex;flex-direction:column}.editor{flex:1;min-height:0;display:flex;flex-direction:column}.toolbar{display:flex;gap:6px;align-items:center;padding:8px 12px;background:#151b24;border-bottom:1px solid #232c3a}.toolbar button{background:#202938;color:#dbe4ee;border:1px solid #2f3b4d;border-radius:6px;padding:6px 12px;cursor:pointer}.toolbar button:hover{background:#2a3547}.toolbar button.active{background:#2f80ed;border-color:#2f80ed;color:#fff}.toolbar .spacer{flex:1}.canvas-host{position:relative;flex:1;min-width:0;min-height:0;overflow:hidden;cursor:crosshair}.statusbar{display:flex;gap:16px;padding:6px 12px;background:#151b24;border-top:1px solid #232c3a;color:#93a4b8;font-size:12px}.workspace{display:flex;flex:1;min-height:0}.layer-panel{width:220px;flex-shrink:0;background:#151b24;border-right:1px solid #232c3a;padding:8px;overflow:auto}.panel-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;color:#93a4b8;font-size:12px}.panel-title button,.layer-row button{background:#202938;border:1px solid #2f3b4d;color:#dbe4ee;border-radius:4px;cursor:pointer;padding:2px 6px;font-size:12px}.panel-title button:hover,.layer-row button:hover{background:#2a3547}.layer-row{display:flex;gap:4px;align-items:center;margin-bottom:6px;padding:2px;border-radius:4px}.layer-row.active{background:#1b2634;outline:1px solid #2f80ed}.layer-row input.layer-active{width:auto;margin:0;flex-shrink:0}.layer-row button.layer-move{flex-shrink:0}.layer-row button:disabled{opacity:.45;cursor:default}.layer-row input[type=color]{width:24px;height:24px;flex-shrink:0;padding:0;border:none;background:none;cursor:pointer}.layer-name{flex:1;min-width:0;background:#0f1319;border:1px solid #2f3b4d;color:#e6edf3;border-radius:4px;padding:3px 6px}.toolbar .divider{width:1px;height:22px;background:#2f3b4d;margin:0 4px}.toolbar .doc-name{max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}.toolbar .active-layer{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#93a4b8;font-size:12px}.toolbar button:disabled{opacity:.5;cursor:default}.canvas-host.dragging{cursor:copy;outline:2px dashed #2f80ed;outline-offset:-6px}.drop-hint,.import-hint{position:absolute;pointer-events:none;border-radius:8px;font-size:13px}.drop-hint{top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#2f80ed24;color:#dbe4ee;font-size:15px}.import-hint{right:12px;bottom:12px;padding:6px 10px;background:#151b24;border:1px solid #2f3b4d;color:#93a4b8}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;display:flex;align-items:center;justify-content:center;background:#0000008c}.modal{width:min(440px,calc(100vw - 32px));max-height:70vh;overflow:auto;padding:16px 20px;background:#151b24;border:1px solid #2f3b4d;border-radius:10px;box-shadow:0 12px 40px #00000080}.modal h3{margin:0 0 8px;font-size:16px}.modal p{margin:4px 0;color:#c7d3e1;font-size:13px;line-height:1.6;overflow-wrap:anywhere}.modal .modal-hint{color:#93a4b8;font-size:12px}.modal-actions{display:flex;justify-content:flex-end;margin-top:12px}.modal-actions button{background:#2f80ed;border:1px solid #2f80ed;color:#fff;border-radius:6px;padding:6px 14px;cursor:pointer}.modal-actions button:hover{background:#3b8bf5}.auth-page{min-height:100%;display:grid;place-items:center}.auth-card{width:340px;display:grid;gap:10px;padding:24px;background:#151b24;border:1px solid #232c3a;border-radius:12px}.auth-card h1{margin:0;font-size:20px}.auth-card input{padding:9px 10px;background:#0f1319;border:1px solid #2f3b4d;border-radius:6px;color:#e6edf3}.auth-tabs{display:flex;gap:8px}.auth-tabs button{flex:1;background:#202938;border:1px solid #2f3b4d;color:#dbe4ee;padding:6px 12px;border-radius:6px;cursor:pointer}.auth-tabs button.active{background:#2f80ed;border-color:#2f80ed;color:#fff}.docs-page{max-width:960px;margin:0 auto;padding:24px}.docs-page header{display:flex;justify-content:space-between;align-items:center}.docs-page header h1{font-size:20px;margin:0}.docs-page header div{display:flex;gap:8px}.docs-page table{width:100%;border-collapse:collapse;margin-top:16px}.docs-page th,.docs-page td{text-align:left;padding:10px;border-bottom:1px solid #232c3a}.docs-page td.actions{display:flex;gap:8px;justify-content:flex-end}.docs-page td.actions button{background:#202938;border:1px solid #2f3b4d;color:#dbe4ee;padding:4px 10px;border-radius:6px;cursor:pointer}.docs-page td.actions button:hover{background:#2a3547}.docs-page td.empty{color:#93a4b8;text-align:center;padding:32px 10px}.docs-page header button:not(.primary){background:#202938;border:1px solid #2f3b4d;color:#dbe4ee;padding:8px 14px;border-radius:6px;cursor:pointer}button.primary{background:#2f80ed;border:1px solid #2f80ed;color:#fff;padding:8px 14px;border-radius:6px;cursor:pointer}button.primary:hover{background:#3b8bf5}button.link{background:none;border:none;color:#8ec2ff;cursor:pointer;padding:0;font-size:inherit}.error{color:#ff7b72}.loading{display:grid;place-items:center;height:100%;color:#93a4b8}#root>.editor{height:100%}.modal-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.modal-actions button:not(.primary){background:#202938;border-color:#2f3b4d;color:#dbe4ee}.modal-actions button:not(.primary):hover{background:#2a3547}.save-badge{font-size:12px;color:#93a4b8;margin-left:8px}.save-badge.conflict{color:#ff7b72}.save-badge.offline{color:#d9a441}.fps{position:absolute;top:12px;right:12px;z-index:20;padding:4px 8px;background:#0f1319d1;border:1px solid #2f3b4d;border-radius:6px;color:#8ec2ff;font:12px ui-monospace,monospace;font-variant-numeric:tabular-nums;pointer-events:none}.sync-note{position:absolute;left:12px;top:12px;pointer-events:none;padding:6px 10px;border-radius:8px;background:#151b24;border:1px solid #2f3b4d;color:#d9a441;font-size:13px}.workspace{position:relative}.canvas-blocker{position:absolute;top:0;right:0;bottom:0;left:0;z-index:15;display:grid;place-items:center;background:#0f1319b8;cursor:wait}.canvas-blocker.error{cursor:default;background:#0f1319d6}.blocker-card{width:min(420px,calc(100vw - 48px));padding:20px;background:#151b24;border:1px solid #2f3b4d;border-radius:10px;box-shadow:0 12px 40px #00000080;color:#e6edf3;font-size:14px}.blocker-card h3{margin:0 0 8px;font-size:16px}.blocker-card p{margin:4px 0;color:#c7d3e1;font-size:13px;line-height:1.6;overflow-wrap:anywhere}.blocker-card .blocker-hint{color:#93a4b8;font-size:12px}.editor-banner{display:flex;align-items:center;gap:12px;margin:8px 12px 0;padding:8px 12px;background:#2a1b1d;border:1px solid #5a2a2a;border-radius:8px;color:#ffb4ae;font-size:13px}.editor-banner span{flex:1}.editor-banner .link{color:#ffb4ae}.modal.help{width:min(560px,calc(100vw - 32px))}.modal.help dl{display:grid;gap:8px;margin:12px 0 16px}.modal.help dl>div{display:grid;grid-template-columns:minmax(150px,210px) 1fr;gap:12px;align-items:baseline}.modal.help dt{color:#8ec2ff;font-size:13px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.modal.help dd{margin:0;color:#c7d3e1;font-size:13px}.modal.help>button{background:#202938;border:1px solid #2f3b4d;color:#dbe4ee;border-radius:6px;padding:6px 14px;cursor:pointer}.modal.help>button:hover{background:#2a3547}.text-inline-input{position:absolute;z-index:12;min-width:180px;padding:2px 6px;transform:translateY(-100%);background:#0f1319;color:#e6edf3;border:1px solid #2f80ed;border-radius:4px;outline:none;box-shadow:0 4px 16px #00000073}.text-props{margin-top:14px;padding-top:10px;border-top:1px solid #232c3a;display:grid;gap:8px}.text-preview{color:#93a4b8;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.text-field{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12px;color:#93a4b8}.text-field input{width:88px;background:#0f1319;border:1px solid #2f3b4d;color:#e6edf3;border-radius:4px;padding:4px 6px}.text-hint{margin:0;font-size:11px;color:#6f7f93}