*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{width:100%;height:100%;overflow:hidden}body{color:#e0e0e0;background:#1a1a1a;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.app{background:#1a1a1a;flex-direction:column;height:100%;display:flex}.topbar{background:#111;border-bottom:1px solid #2a2a2a;flex-shrink:0;align-items:center;gap:4px;height:42px;padding:0 12px;display:flex}.topbar-tabs{flex:1;gap:4px;display:flex}.tab-btn{color:#888;cursor:pointer;letter-spacing:.3px;background:0 0;border:none;border-radius:6px;padding:5px 16px;font-family:inherit;font-size:13px;transition:color .15s,background .15s}.tab-btn:hover{color:#ccc;background:#222}.tab-btn.active{color:#fff;background:#2a2a2a}.layout-btn{color:#666;cursor:pointer;background:0 0;border:none;border-radius:6px;align-items:center;padding:5px 8px;transition:color .15s,background .15s;display:flex}.layout-btn:hover{color:#ccc;background:#222}.workspace{flex:1;display:flex;overflow:hidden}.workspace.row{flex-direction:row}.workspace.column{flex-direction:column}.is-dragging-row{cursor:col-resize!important}.is-dragging-column{cursor:row-resize!important}.is-dragging-row iframe,.is-dragging-column iframe{pointer-events:none}.divider{z-index:5;background:#232323;flex-shrink:0;justify-content:center;align-items:center;transition:background .15s;display:flex;position:relative}.divider--row{cursor:col-resize;width:5px}.divider--row:after{content:"";cursor:col-resize;position:absolute;inset:0 -4px}.divider--column{cursor:row-resize;height:5px}.divider--column:after{content:"";cursor:row-resize;position:absolute;inset:-4px 0}.divider__grip{pointer-events:none;opacity:.35;gap:3px;transition:opacity .15s;display:flex}.divider--row .divider__grip{flex-direction:column}.divider--column .divider__grip{flex-direction:row}.divider__grip span{background:#fff;border-radius:50%;width:3px;height:3px;display:block}.divider:hover,.divider:active{background:#4f46e5}.divider:hover .divider__grip,.divider:active .divider__grip{opacity:.9}.editor-panel{flex-direction:column;flex-shrink:0;display:flex;overflow:hidden}.workspace.row .editor-panel{min-width:80px}.workspace.column .editor-panel{flex-direction:row;width:100%;min-height:60px}.editor-panel>div:first-child{flex-direction:column;flex:1;min-height:0;display:flex;overflow:hidden}.editor-panel .cm-editor{flex:1;font-size:13.5px;overflow:hidden}.editor-panel .cm-editor.cm-focused{outline:none}.editor-panel .cm-scroller{font-family:JetBrains Mono,Fira Code,Cascadia Code,Consolas,monospace;line-height:1.6;overflow:auto!important}.console-panel{background:#111;flex-direction:column;flex-shrink:0;display:flex;overflow:hidden}.console-panel--row{border-top:1px solid #2a2a2a;height:180px}.console-panel--row.console-panel--collapsed{height:32px}.console-panel--column{border-left:1px solid #2a2a2a;width:260px}.console-panel--column.console-panel--collapsed{width:32px}.console-header{background:#161616;border-bottom:1px solid #222;flex-shrink:0;align-items:center;gap:6px;height:32px;padding:0 8px 0 10px;display:flex}.console-title{color:#666;letter-spacing:.6px;text-transform:uppercase;flex:1;font-size:11px;font-weight:600}.console-badge{border-radius:999px;padding:1px 5px;font-size:10px;font-weight:600;line-height:1.6}.console-badge--error{color:#f87171;background:#f8717126}.console-badge--warn{color:#f59e0b;background:#f59e0b26}.console-header-actions{align-items:center;gap:2px;margin-left:auto;display:flex}.console-panel--column.console-panel--collapsed .console-header{border-bottom:none;border-right:1px solid #222;flex-direction:column-reverse;gap:10px;width:32px;height:100%;padding:8px 0}.console-panel--column.console-panel--collapsed .console-title{writing-mode:vertical-rl;text-align:center;flex:1;transform:rotate(180deg)}.console-panel--column.console-panel--collapsed .console-header-actions{margin-top:0;margin-left:0}.console-icon-btn{color:#555;cursor:pointer;background:0 0;border:none;border-radius:5px;flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;transition:color .15s,background .15s;display:flex}.console-icon-btn:hover{color:#ccc;background:#222}.console-body{flex:1;padding:4px 0;overflow:hidden auto}.console-empty{color:#444;padding:10px 12px;font-family:JetBrains Mono,Fira Code,Consolas,monospace;font-size:12px}.console-entry{border-bottom:1px solid #0000;align-items:baseline;gap:10px;min-height:24px;padding:3px 12px;display:flex}.console-entry--warn{background:#f59e0b0f;border-bottom-color:#f59e0b1a}.console-entry--error{background:#f871710f;border-bottom-color:#f871711a}.console-entry__tag{text-transform:uppercase;letter-spacing:.4px;color:#444;flex-shrink:0;width:38px;font-size:10px;font-weight:600}.console-entry--warn .console-entry__tag{color:#f59e0b}.console-entry--error .console-entry__tag{color:#f87171}.console-entry--info .console-entry__tag{color:#60a5fa}.console-entry__text{white-space:pre-wrap;word-break:break-all;font-family:JetBrains Mono,Fira Code,Consolas,monospace;font-size:12px;line-height:1.6}@keyframes backdropIn{0%{opacity:0}to{opacity:1}}@keyframes dialogIn{0%{opacity:0;transform:scale(.95)translateY(6px)}to{opacity:1;transform:scale(1)translateY(0)}}.dialog-backdrop--fixed{z-index:200;background:#0009;position:fixed}.dialog-backdrop{z-index:100;background:#0000008c;justify-content:center;align-items:center;animation:.15s backdropIn;display:flex;position:absolute;inset:0}.dialog{text-align:center;background:#1e1e1e;border:1px solid #333;border-radius:12px;flex-direction:column;align-items:center;gap:10px;width:380px;padding:32px 28px 24px;animation:.2s cubic-bezier(.16,1,.3,1) dialogIn;display:flex;box-shadow:0 20px 60px #00000080}.dialog-icon{color:#f59e0b;margin-bottom:4px}.dialog h2{color:#f0f0f0;margin:0;font-size:16px;font-weight:600}.dialog p{color:#888;margin:0;font-size:13px;line-height:1.6}.dialog-actions{gap:8px;width:100%;margin-top:8px;display:flex}.dialog-btn{cursor:pointer;border:none;border-radius:7px;flex:1;padding:8px 0;font-family:inherit;font-size:13px;font-weight:500;transition:opacity .15s}.dialog-btn:hover{opacity:.85}.dialog-btn.deny{color:#aaa;background:#2a2a2a}.dialog-btn.allow{color:#fff;background:#6366f1}.share-url-row{flex-direction:column;gap:8px;width:100%;margin-top:4px;display:flex}.share-url-text{color:#ccc;text-align:left;word-break:break-all;background:#111;border:1px solid #333;border-radius:7px;margin:0;padding:8px 10px;font-family:JetBrains Mono,Fira Code,Consolas,monospace;font-size:12px;line-height:1.6}.share-copy-btn{flex:none;justify-content:center;align-items:center;padding:7px 10px;display:flex}.preview-panel{background:#fff;flex:1;position:relative;overflow:hidden}.preview-spinner{z-index:10;pointer-events:none;background:#00000073;justify-content:center;align-items:center;animation:.15s backdropIn;display:flex;position:absolute;inset:0}.preview-spinner__badge{background:#1a1a1a;border:1px solid #333;border-radius:999px;align-items:center;gap:9px;padding:9px 18px 9px 14px;display:flex;box-shadow:0 4px 20px #0006}.preview-spinner__label{color:#ccc;letter-spacing:.2px;white-space:nowrap;font-size:13px;font-weight:500}.spinner{border:2px solid #ffffff26;border-top-color:#aaa;border-radius:50%;flex-shrink:0;width:14px;height:14px;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.preview-panel iframe{border:none;width:100%;height:100%;display:block}