:root{--bg-base: #0d0f14;--bg-surface: #151821;--bg-elevated: #1c2030;--bg-hover: #232844;--border-subtle: #1e2535;--border-normal: #2a3350;--border-accent: #4f6ef7;--text-primary: #e8eaf0;--text-secondary: #8892a4;--text-muted: #4a5568;--text-link: #7c9ef5;--accent-primary: #4f6ef7;--accent-hover: #6b85ff;--accent-glow: rgba(79, 110, 247, .25);--color-success: #3ecf8e;--color-warning: #f5a623;--color-error: #ff5f5f;--color-info: #7c9ef5;--log-info: #7c9ef5;--log-success: #3ecf8e;--log-warning: #f5a623;--log-error: #ff5f5f;--log-stdout: #e8eaf0;--panel-left-width: 320px;--panel-right-width: 300px;--panel-bottom-height: 200px;--header-height: 50px;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;--font-mono: "JetBrains Mono", "Fira Code", "Cascadia Code", monospace;--transition-fast: .15s ease;--transition-normal: .25s ease;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .4);--shadow-md: 0 4px 16px rgba(0, 0, 0, .5);--shadow-glow: 0 0 20px var(--accent-glow)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;overflow:hidden;background-color:var(--bg-base);color:var(--text-primary);font-family:var(--font-sans);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}#root{height:100%;display:flex;flex-direction:column}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg-surface)}::-webkit-scrollbar-thumb{background:var(--border-normal);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--border-accent)}.ide-header{height:var(--header-height);background:var(--bg-surface);border-bottom:1px solid var(--border-subtle);display:flex;align-items:center;justify-content:space-between;padding:0 16px;flex-shrink:0;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.ide-header__logo{display:flex;align-items:center;gap:10px}.ide-header__logo-icon{width:28px;height:28px;background:linear-gradient(135deg,var(--accent-primary),#9b59f5);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-size:16px;box-shadow:var(--shadow-glow)}.ide-header__title{font-size:15px;font-weight:700;background:linear-gradient(135deg,#e8eaf0,var(--accent-hover));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.3px}.ide-header__subtitle{font-size:11px;color:var(--text-muted);margin-left:4px}.ide-header__status{display:flex;align-items:center;gap:12px}.status-badge{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text-secondary);padding:4px 10px;background:var(--bg-elevated);border:1px solid var(--border-subtle);border-radius:var(--radius-sm)}.status-badge__dot{width:7px;height:7px;border-radius:50%;background:var(--text-muted);transition:background var(--transition-fast)}.status-badge__dot--connected{background:var(--color-success);box-shadow:0 0 6px var(--color-success)}.status-badge__dot--running{background:var(--color-warning);box-shadow:0 0 6px var(--color-warning);animation:pulse-dot 1s infinite}.status-badge__dot--error{background:var(--color-error)}@keyframes pulse-dot{0%,to{opacity:1}50%{opacity:.4}}.ide-layout{flex:1;display:grid;grid-template-columns:var(--panel-left-width) 1fr var(--panel-right-width);grid-template-rows:1fr var(--panel-bottom-height);grid-template-areas:"left  center right" "bottom bottom bottom";overflow:hidden;min-height:0}.panel{display:flex;flex-direction:column;overflow:hidden;background:var(--bg-surface)}.panel--left{grid-area:left;border-right:1px solid var(--border-subtle)}.panel--center{grid-area:center;background:var(--bg-base)}.panel--right{grid-area:right;border-left:1px solid var(--border-subtle)}.panel--bottom{grid-area:bottom;border-top:1px solid var(--border-subtle)}.panel__header{height:36px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;border-bottom:1px solid var(--border-subtle);background:var(--bg-elevated);flex-shrink:0;gap:8px}.panel__title{font-size:11px;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.8px;display:flex;align-items:center;gap:6px}.panel__title-icon{font-size:13px}.panel__body{flex:1;overflow:auto;min-height:0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:5px 12px;border:none;border-radius:var(--radius-sm);font-family:var(--font-sans);font-size:12px;font-weight:500;cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;-webkit-user-select:none;user-select:none}.btn:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}.btn--primary{background:var(--accent-primary);color:#fff}.btn--primary:hover{background:var(--accent-hover);box-shadow:var(--shadow-glow)}.btn--danger{background:#ff5f5f26;color:var(--color-error);border:1px solid rgba(255,95,95,.3)}.btn--danger:hover{background:#ff5f5f40}.btn--ghost{background:transparent;color:var(--text-secondary);border:1px solid var(--border-normal)}.btn--ghost:hover{background:var(--bg-hover);color:var(--text-primary)}.btn--icon{padding:5px;border-radius:var(--radius-sm);background:transparent;color:var(--text-secondary);border:none}.btn--icon:hover{background:var(--bg-hover);color:var(--text-primary)}.btn:disabled{opacity:.4;cursor:not-allowed}.device-list{padding:8px;display:flex;flex-direction:column;gap:4px}.device-item{padding:10px 12px;border-radius:var(--radius-md);border:1px solid var(--border-subtle);background:var(--bg-elevated);cursor:pointer;transition:all var(--transition-fast);display:flex;align-items:center;gap:10px}.device-item:hover{border-color:var(--border-accent);background:var(--bg-hover)}.device-item--active{border-color:var(--accent-primary);background:#4f6ef71a}.device-item__icon{font-size:20px;flex-shrink:0}.device-item__info{flex:1;min-width:0}.device-item__model{font-size:13px;font-weight:500;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.device-item__serial{font-size:11px;color:var(--text-muted);font-family:var(--font-mono)}.device-item__state{font-size:10px;padding:2px 6px;border-radius:3px;font-weight:600;text-transform:uppercase}.state--device{background:#3ecf8e26;color:var(--color-success)}.state--offline{background:#ff5f5f26;color:var(--color-error)}.state--unauthorized{background:#f5a62326;color:var(--color-warning)}.mirror-container{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:12px;gap:8px;background:var(--bg-base);min-height:0}.mirror-canvas{max-width:100%;max-height:100%;border-radius:var(--radius-md);border:1px solid var(--border-normal);cursor:crosshair;object-fit:contain;background:#000;box-shadow:var(--shadow-md)}.mirror-placeholder{display:flex;flex-direction:column;align-items:center;gap:12px;color:var(--text-muted);text-align:center;padding:24px}.mirror-placeholder__icon{font-size:48px;opacity:.3}.mirror-placeholder__text{font-size:13px;line-height:1.6}.editor-toolbar{display:flex;align-items:center;gap:6px;padding:6px 12px;border-bottom:1px solid var(--border-subtle);background:var(--bg-elevated);flex-shrink:0;flex-wrap:wrap}.editor-divider{width:1px;height:18px;background:var(--border-normal);margin:0 2px}.test-case-list{border-bottom:1px solid var(--border-subtle);overflow-y:auto;max-height:160px;flex-shrink:0}.test-case-item{display:flex;align-items:center;gap:8px;padding:7px 12px;border-bottom:1px solid var(--border-subtle);cursor:pointer;transition:background var(--transition-fast);font-size:12.5px}.test-case-item:hover{background:var(--bg-hover)}.test-case-item:last-child{border-bottom:none}.test-case-item input[type=checkbox]{accent-color:var(--accent-primary);width:14px;height:14px;cursor:pointer}.test-case-item__name{flex:1;color:var(--text-primary);font-family:var(--font-mono);font-size:12px}.test-case-item__status{font-size:11px;padding:1px 6px;border-radius:3px;font-weight:500}.test-status--pass{background:#3ecf8e26;color:var(--color-success)}.test-status--fail{background:#ff5f5f26;color:var(--color-error)}.test-status--pending{background:#4a55684d;color:var(--text-muted)}.test-status--running{background:#f5a62326;color:var(--color-warning)}.editor-wrapper{flex:1;min-height:0;overflow:hidden}.tree-container{padding:6px}.tree-node{-webkit-user-select:none;user-select:none}.tree-node__row{display:flex;align-items:center;gap:4px;padding:3px 6px;border-radius:var(--radius-sm);cursor:pointer;transition:background var(--transition-fast);font-size:12.5px;font-family:var(--font-mono);min-height:26px}.tree-node__row:hover{background:var(--bg-hover)}.tree-node__row--selected{background:#4f6ef733;border:1px solid rgba(79,110,247,.4)}.tree-node__toggle{width:14px;height:14px;display:flex;align-items:center;justify-content:center;color:var(--text-muted);font-size:10px;transition:transform var(--transition-fast);flex-shrink:0}.tree-node__toggle--expanded{transform:rotate(90deg)}.tree-node__toggle--leaf{opacity:0}.tree-node__type-icon{font-size:12px;flex-shrink:0}.tree-node__name{color:var(--text-link);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tree-node__type{color:var(--text-muted);font-size:10px;margin-left:4px}.tree-node__children{display:none;padding-left:16px;border-left:1px solid var(--border-subtle);margin-left:9px}.tree-node__children--expanded{display:block}.inspector-panel{padding:10px}.inspector-empty{display:flex;align-items:center;justify-content:center;height:80px;color:var(--text-muted);font-size:12px;text-align:center}.inspector-table{width:100%;border-collapse:collapse;font-size:12px}.inspector-table tr{border-bottom:1px solid var(--border-subtle)}.inspector-table tr:last-child{border-bottom:none}.inspector-table td{padding:5px 6px;vertical-align:top}.inspector-table td:first-child{color:var(--text-muted);font-weight:500;width:70px;flex-shrink:0}.inspector-table td:last-child{color:var(--text-primary);font-family:var(--font-mono);font-size:11.5px;word-break:break-all}.inspector-codegen{margin-top:10px;padding:8px;background:var(--bg-elevated);border-radius:var(--radius-sm);border:1px solid var(--border-subtle)}.inspector-codegen__label{font-size:10px;color:var(--text-muted);font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px}.inspector-codegen__code{font-family:var(--font-mono);font-size:11.5px;color:var(--color-info);word-break:break-all;margin-bottom:8px;line-height:1.6}.log-console{font-family:var(--font-mono);font-size:12px;padding:6px 4px;display:flex;flex-direction:column;gap:1px}.log-entry{display:flex;align-items:flex-start;gap:8px;padding:2px 8px;border-radius:2px;line-height:1.5;animation:log-slide-in .2s ease}@keyframes log-slide-in{0%{opacity:0;transform:translate(-4px)}to{opacity:1;transform:translate(0)}}.log-entry:hover{background:var(--bg-elevated)}.log-entry__time{color:var(--text-muted);font-size:10.5px;flex-shrink:0;padding-top:1px}.log-entry__level{font-size:10px;font-weight:700;text-transform:uppercase;flex-shrink:0;min-width:48px;padding-top:1px}.log-entry__message{flex:1;word-break:break-word;white-space:pre-wrap}.log-level--info .log-entry__level,.log-level--info .log-entry__message{color:var(--log-info)}.log-level--success .log-entry__level,.log-level--success .log-entry__message{color:var(--log-success)}.log-level--warning .log-entry__level,.log-level--warning .log-entry__message{color:var(--log-warning)}.log-level--error .log-entry__level,.log-level--error .log-entry__message{color:var(--log-error)}.log-level--stdout .log-entry__message{color:var(--log-stdout)}.log-level--stdout .log-entry__level{color:var(--text-muted)}.log-console--empty{display:flex;align-items:center;justify-content:center;height:100%;color:var(--text-muted);font-size:12px}.flex-center{display:flex;align-items:center;justify-content:center}.flex-gap-4{display:flex;align-items:center;gap:4px}.flex-gap-8{display:flex;align-items:center;gap:8px}.flex-1{flex:1}.text-muted{color:var(--text-muted)}.text-xs{font-size:11px}.ml-auto{margin-left:auto}.resize-handle{background:transparent;transition:background var(--transition-fast);z-index:10}.resize-handle:hover,.resize-handle--active{background:var(--accent-primary);opacity:.5}.resize-handle--vertical{cursor:col-resize;width:3px}.resize-handle--horizontal{cursor:row-resize;height:3px}.collapsible-section{border-bottom:1px solid var(--border-subtle)}.collapsible-section__header{display:flex;align-items:center;gap:6px;padding:6px 12px;font-size:11px;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.7px;cursor:pointer;transition:background var(--transition-fast);-webkit-user-select:none;user-select:none}.collapsible-section__header:hover{background:var(--bg-hover)}.collapsible-section__content{overflow:hidden}