:root{--bg-main: #2d2a2e;--bg-inset: #221f22;--border-color: #4a464d;--text-primary: #fcfcfa;--text-secondary: #9ca0a5;--text-muted: #69676c;--accent-pink: #ff6188;--accent-green: #a9dc76;--accent-orange: #fc9867;--accent-yellow: #ffd866;--accent-cyan: #78dce8;--accent-purple: #ab9df2;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono: "Fira Code", monospace}*{box-sizing:border-box;margin:0;padding:0;scrollbar-width:thin;scrollbar-color:var(--border-color) var(--bg-inset)}html{font-size:16px}body{font-family:var(--font-sans);background-color:var(--bg-main);color:var(--text-primary);overflow:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.container{display:flex;height:100vh;width:100vw;justify-content:space-between}.stream-panel{flex-grow:1;display:flex;background-color:var(--bg-inset)}.stream-container{flex-grow:1;display:flex;flex-direction:column;padding:2rem;gap:1.5rem;background-color:var(--bg-inset);position:relative}.stream-header{font-size:1.5rem;font-weight:500;color:var(--text-primary);display:flex;align-items:center;gap:.75rem}.stream-header .fa-satellite-dish{color:var(--accent-cyan)}.stream-view{flex-grow:1;display:flex;justify-content:center;align-items:center;background-color:#000;border-radius:8px;overflow:hidden;border:1px solid #000;transition:box-shadow .3s ease;min-height:0;position:relative}.stream-view.active-typing{box-shadow:0 0 0 3px var(--accent-cyan),0 0 15px var(--accent-cyan)}.stream-view.active-recording{box-shadow:0 0 0 3px var(--accent-pink),0 0 15px var(--accent-pink)}#screen-stream{pointer-events:auto;width:100%;height:100%;object-fit:contain;cursor:crosshair;-webkit-user-select:none;user-select:none}.stream-stopped-container{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;background-color:#000;pointer-events:none;z-index:2}.stream-stopped-container svg{width:100px;height:100px;opacity:.6;filter:grayscale(100%);animation:pulse-slow 4s infinite ease-in-out}@keyframes pulse-slow{0%,to{transform:scale(1);opacity:.6}50%{transform:scale(1.05);opacity:.8}}#annotation-overlay{position:absolute;pointer-events:none;z-index:5;transition:all .1s linear}.annotation-box{position:absolute;border:1px solid var(--accent-orange);background-color:#fc986733}.annotation-box .annotation-label{position:absolute;top:0;transform:translateY(-100%);left:-1px;background-color:var(--accent-orange);color:var(--bg-inset);padding:1px 4px;font-size:10px;font-family:var(--font-mono);white-space:nowrap;border-radius:3px 3px 0 0}.live-type-overlay{position:absolute;bottom:1.5rem;left:50%;transform:translate(-50%);background-color:#221f22cc;color:var(--text-primary);padding:.5rem 1.5rem;border-radius:6px;font-size:.9rem;pointer-events:none;opacity:0;transition:all .3s ease;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid var(--border-color)}.live-type-overlay.visible{opacity:1;bottom:1rem}#verification-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#2d2a2eb3;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:10;cursor:crosshair;display:flex;flex-direction:column;justify-content:center;align-items:center;color:var(--text-primary);text-align:center;font-size:1.2rem;transition:opacity .3s ease}#verification-overlay.selecting{background-color:#2d2a2e1a;-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px)}#verification-overlay .fa-solid{font-size:2.5rem;margin-bottom:1rem;color:var(--accent-yellow)}#selection-box{position:absolute;border:2px dashed var(--accent-yellow);background-color:#ffd86633;pointer-events:none;display:none}.controls-panel{width:480px;min-width:420px;background-color:var(--bg-main);border-left:1px solid #000;display:flex;flex-direction:column}.panel-header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--accent-pink);padding:1.5rem;flex-shrink:0}.panel-header h1{font-size:1.5rem;font-weight:600;display:flex;align-items:center;gap:.75rem}.panel-header h1 .fa-robot{color:var(--accent-cyan)}.logout-button{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background-color:transparent;color:var(--text-secondary);border:1px solid var(--border-color);border-radius:6px;text-decoration:none;font-size:.9rem;font-weight:500;cursor:pointer;transition:all .2s ease}.logout-button:hover{background-color:var(--accent-pink);color:#fff;border-color:var(--accent-pink)}.controls-scroll-area{flex-grow:1;overflow-y:auto;min-height:0;padding:1.5rem;display:flex;flex-direction:column;gap:1rem}.control-group{border:1px solid var(--border-color);border-radius:8px;padding:1.25rem;background-color:var(--bg-main)}.collapsible-header{font-size:.8rem;font-weight:600;display:flex;align-items:center;justify-content:space-between;gap:.5rem;color:var(--accent-purple);text-transform:uppercase;letter-spacing:.05em;margin:0;cursor:pointer;-webkit-user-select:none;user-select:none}.collapsible-header .expand-icon{color:var(--text-muted);transition:transform .3s ease}.control-group.collapsed .expand-icon{transform:rotate(-90deg)}.control-group-content{display:grid;gap:1rem;padding-top:1.25rem;overflow:hidden;max-height:1000px;opacity:1;transition:max-height .35s ease-out,padding-top .35s ease-out,opacity .2s ease-out;word-wrap:break-word;white-space:normal;overflow-wrap:break-word}.control-group.collapsed .control-group-content{max-height:0;padding-top:0;opacity:0;pointer-events:none}.control-button,.example-select,.script-area,.ai-task-input{width:100%;padding:.75rem 1rem;background-color:var(--bg-inset);color:var(--text-primary);border:1px solid var(--border-color);border-radius:6px;font-size:.95rem;font-family:var(--font-sans);transition:all .2s ease}.control-button:focus,.example-select:focus,.script-area:focus,.script-input:focus,.ai-task-input:focus{outline:none;border-color:var(--accent-pink);box-shadow:0 0 0 2px #ff61884d}.button-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.control-button{display:flex;justify-content:center;align-items:center;gap:.75rem;font-weight:500;cursor:pointer}.control-button:hover{background-color:#3c383e;border-color:#5f5a63}.control-button:disabled{cursor:not-allowed;background-color:var(--bg-inset);color:var(--text-muted);opacity:.6}.control-button.active{color:#fff}.btn-cyan.active{background-color:var(--accent-cyan);border-color:var(--accent-cyan);color:#000}.btn-pink.active{background-color:var(--accent-pink);border-color:var(--accent-pink);color:#fff}.btn-yellow.active{background-color:var(--accent-yellow);border-color:var(--accent-yellow);color:#000}.btn-green{background-color:var(--accent-green);border-color:var(--accent-green);color:var(--bg-inset)}.btn-green:hover{background-color:#b9e78c;border-color:#b9e78c}.btn-red{background-color:var(--accent-pink);border-color:var(--accent-pink);color:var(--bg-inset)}.btn-red:hover{background-color:#ff4a7a;border-color:#ff4a7a}.btn-pink.active .fa-solid{animation:pulse 1.5s infinite ease-in-out}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.script-area,.script-input,.ai-task-input{font-family:var(--font-mono);font-size:.9rem;resize:vertical;line-height:1.6}.script-area,.script-input{min-height:200px}.ai-task-input{min-height:80px}.run-button{font-weight:600;color:var(--bg-inset);background-color:var(--accent-green);border-color:var(--accent-green)}.run-button:hover{background-color:#b9e78c}.run-button.loading{background-color:var(--accent-yellow);border-color:var(--accent-yellow);cursor:not-allowed;position:relative}.run-button.loading:hover{background-color:var(--accent-yellow)}.run-button.loading .fa-spinner{animation:fa-spin 1s infinite linear;margin-right:.5rem}.ai-submit{background-color:var(--accent-cyan);border-color:var(--accent-cyan);color:var(--bg-inset);font-weight:600}.ai-submit.cancel{background-color:var(--accent-pink);border-color:var(--accent-pink)}.header-controls{display:flex;align-items:center;gap:.5rem}.icon-button{background:none;border:none;color:var(--text-secondary);cursor:pointer;font-size:1rem;padding:.25rem;line-height:1;border-radius:4px}.icon-button:hover{color:var(--accent-yellow);background-color:var(--bg-inset)}.icon-only{justify-content:center;padding:.75rem;min-width:auto}.icon-only .fa-solid{margin:0}.log-container{min-height:150px;max-height:300px;background-color:var(--bg-inset);border-radius:6px;padding:.75rem 1rem;border:1px solid var(--border-color);overflow-y:auto;font-family:var(--font-mono);font-size:.85rem;color:var(--text-secondary);white-space:pre-wrap;word-wrap:break-word;line-height:1.6;display:flex;flex-direction:column;gap:.5rem}.log-entry{display:flex;flex-direction:column;gap:.5rem;padding:.5rem;border-radius:4px;background-color:#0000001a;border:1px solid transparent}.log-entry:hover{background-color:#0003;border-color:var(--border-color)}.log-header{display:flex;align-items:flex-start;gap:.75rem}.log-entry .log-time{color:var(--accent-cyan);margin-right:.75rem}.log-entry .log-error{color:var(--accent-pink)}.log-entry .log-success{color:var(--accent-green)}.log-entry .is-rec{color:var(--accent-yellow)}.log-icon{flex-shrink:0;width:16px;text-align:center;color:var(--text-muted)}.log-icon .fa-info-circle{color:var(--accent-cyan)}.log-icon .fa-check-circle{color:var(--accent-green)}.log-icon .fa-triangle-exclamation{color:var(--accent-pink)}.log-icon .fa-exclamation-triangle{color:var(--accent-yellow)}.log-message{flex:1;word-wrap:break-word;white-space:pre-wrap;font-size:.85rem}.log-expand-btn{background:none;border:none;color:var(--text-muted);cursor:pointer;font-size:.7rem;padding:.25rem;border-radius:3px;transition:all .2s ease;flex-shrink:0}.log-expand-btn:hover{color:var(--accent-cyan);background-color:var(--bg-inset)}.log-details-container{margin-top:.5rem;margin-left:1.5rem;border-left:2px solid var(--border-color);padding-left:.75rem}.log-details{background-color:var(--bg-inset);border:1px solid var(--border-color);border-radius:4px;padding:.75rem;font-family:var(--font-mono);font-size:.8rem;color:var(--text-secondary);white-space:pre-wrap;word-wrap:break-word;line-height:1.4;max-height:200px;overflow-y:auto;margin:0}.log-details::-webkit-scrollbar{width:6px}.log-details::-webkit-scrollbar-track{background:var(--bg-inset)}.log-details::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:3px}.log-details::-webkit-scrollbar-thumb:hover{background:var(--accent-cyan)}.ai-log-entry{padding:.75rem 1rem;border-radius:6px;border:1px solid var(--border-color)}.ai-log-status{background-color:#2d2a2e;color:var(--text-muted);text-align:center;font-style:italic}.ai-log-thought{background-color:#ab9df21a;border-color:var(--accent-purple)}.ai-log-code{background-color:#a9dc761a;border-color:var(--accent-green)}.ai-log-response{background-color:#40b4e91a;border-color:var(--accent-cyan)}.ai-log-error{background-color:#ff61881a;border-color:var(--accent-pink);color:var(--accent-pink)}.ai-log-entry .log-header-row{display:flex;justify-content:space-between;align-items:center;gap:.75rem}.ai-log-entry .log-label{display:flex;align-items:center;gap:.5rem;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;font-weight:600}.ai-log-thought .log-label{color:var(--accent-purple)}.ai-log-code .log-label{color:var(--accent-green)}.ai-log-response .log-label{color:var(--accent-cyan)}.ai-log-error .log-label{color:var(--accent-pink)}.ai-log-content{margin-top:.75rem;padding:0 .75rem;background-color:var(--bg-main);border-radius:4px;border-left:3px solid currentColor;font-family:var(--font-mono);font-size:.85rem;color:var(--text-secondary);max-height:300px;overflow-y:auto}.ai-log-content pre{margin:0;white-space:pre-wrap;word-wrap:break-word;word-break:break-word;line-height:1.5}.ai-log-preview{margin:0 .75rem;padding:0 .25rem;background:transparent;font-family:var(--font-mono);font-size:.85rem;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1 1 auto}.ai-log-preview .empty-preview{color:var(--text-muted);font-style:italic}.ai-log-raw summary{cursor:pointer;color:var(--accent-cyan);margin-bottom:.5rem}.ai-log-raw pre{background:var(--bg-inset);border:1px solid var(--border-color);padding:.5rem;border-radius:6px;max-height:240px;overflow:auto;font-family:var(--font-mono);font-size:.8rem}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--bg-inset)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:5px}::-webkit-scrollbar-thumb:hover{background:var(--accent-pink)}.login-container{display:flex;justify-content:center;align-items:center;height:100vh;width:100vw;background-color:var(--bg-main)}.login-form{background-color:var(--bg-inset);border:1px solid var(--border-color);border-radius:12px;padding:2.5rem;width:100%;max-width:400px;box-shadow:0 10px 30px #0000004d}.login-form h1{text-align:center;margin-bottom:2rem;font-size:1.75rem;font-weight:600;color:var(--text-primary)}.form-group{margin-bottom:1.5rem}.form-group label{display:block;margin-bottom:.5rem;font-size:.9rem;font-weight:500;color:var(--text-secondary)}.form-group input{width:100%;padding:.75rem 1rem;background-color:var(--bg-main);color:var(--text-primary);border:1px solid var(--border-color);border-radius:6px;font-size:.95rem;font-family:var(--font-sans);transition:all .2s ease}.form-group input:focus{outline:none;border-color:var(--accent-pink);box-shadow:0 0 0 2px #ff61884d}.form-group input:disabled{cursor:not-allowed;background-color:var(--bg-inset);color:var(--text-muted);opacity:.6}.login-button{width:100%;padding:.75rem 1rem;background-color:var(--accent-pink);color:#fff;border:1px solid var(--accent-pink);border-radius:6px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease}.login-button:hover:not(:disabled){background-color:#ff4a7a;border-color:#ff4a7a}.login-button:disabled{cursor:not-allowed;background-color:var(--text-muted);border-color:var(--text-muted);opacity:.6}.flash-error{margin-top:1rem;padding:.75rem 1rem;background-color:#ff61881a;border:1px solid var(--accent-pink);border-radius:6px;color:var(--accent-pink);font-size:.9rem;text-align:center}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000b3;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-dialog{background-color:var(--bg-inset);border:1px solid var(--border-color);border-radius:12px;padding:2rem;width:90%;max-width:500px;max-height:90vh;overflow-y:auto}.modal-dialog h3{font-size:1.25rem;font-weight:600;margin-bottom:1.5rem;display:flex;align-items:center;gap:.75rem;color:var(--text-primary)}.save-options{display:flex;flex-direction:column;gap:1rem;margin-bottom:1.5rem}.save-options label{display:flex;align-items:center;gap:.75rem;cursor:pointer;color:var(--text-primary)}.save-options input[type=radio]{margin:0}.dialog-actions{display:flex;gap:1rem;justify-content:flex-end;margin-top:1.5rem}.dialog-actions .control-button{width:auto;min-width:100px}.error-message{background-color:#ff61881a;border:1px solid var(--accent-pink);border-radius:6px;padding:.75rem 1rem;color:var(--accent-pink);font-size:.9rem;margin-top:1rem}.full-page-loading{display:flex;flex-direction:column;justify-content:center;align-items:center;height:100vh;width:100vw;background-color:var(--bg-main);color:var(--text-primary)}.spinner{width:40px;height:40px;border:4px solid var(--border-color);border-left:4px solid var(--accent-pink);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:1rem}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.fa-spin{animation:fa-spin 2s infinite linear}@keyframes fa-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.select-wrapper{position:relative;width:100%}.select-wrapper.disabled{opacity:.6;pointer-events:none}.select-trigger{width:100%;padding:.75rem 1rem;background-color:var(--bg-inset);color:var(--text-primary);border:1px solid var(--border-color);border-radius:8px;font-size:.95rem;font-family:var(--font-sans);cursor:pointer;display:flex;justify-content:space-between;align-items:center;transition:all .3s cubic-bezier(.4,0,.2,1);-webkit-user-select:none;user-select:none;position:relative;overflow:hidden}.select-trigger:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,rgba(255,97,136,.1),rgba(120,220,232,.1));opacity:0;transition:opacity .3s ease}.select-trigger:hover:not(.disabled){background-color:#3c383e;border-color:var(--accent-cyan);transform:translateY(-1px);box-shadow:0 4px 12px #0003}.select-trigger:hover:not(.disabled):before{opacity:1}.select-trigger.open{border-color:var(--accent-cyan);box-shadow:0 0 0 3px #78dce84d,0 4px 12px #0003;border-radius:8px 8px 0 0}.select-trigger:focus{outline:none;border-color:var(--accent-cyan);box-shadow:0 0 0 3px #78dce84d}.select-trigger.disabled{cursor:not-allowed;background-color:var(--bg-inset);color:var(--text-muted);opacity:.6}.select-value{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;position:relative;z-index:1}.select-arrow{color:var(--text-muted);transition:transform .3s cubic-bezier(.4,0,.2,1);font-size:.8rem;position:relative;z-index:1}.select-arrow.open{transform:rotate(180deg);color:var(--accent-cyan)}.select-dropdown{position:absolute;top:100%;left:0;right:0;background-color:var(--bg-inset);border:1px solid var(--border-color);border-top:none;border-radius:0 0 8px 8px;max-height:250px;overflow-y:auto;z-index:100;box-shadow:0 8px 24px #0006;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:dropdownSlideIn .2s ease-out}@keyframes dropdownSlideIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.select-option{padding:.75rem 1rem;cursor:pointer;transition:all .2s ease;color:var(--text-primary);border-bottom:1px solid var(--border-color);display:flex;justify-content:space-between;align-items:center;position:relative;overflow:hidden}.select-option:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(120,220,232,.2),transparent);transition:left .3s ease}.select-option:hover:before{left:100%}.select-option:last-child{border-bottom:none}.select-option:hover{background-color:#78dce81a;color:var(--accent-cyan);transform:translate(4px)}.select-option.selected{background-color:#78dce826;color:var(--accent-cyan);font-weight:500}.select-option.selected:hover{background-color:#78dce840;color:var(--accent-cyan)}.select-option.disabled{opacity:.4;cursor:not-allowed;background-color:transparent;color:var(--text-muted)}.select-option.disabled:hover{background-color:transparent;color:var(--text-muted);transform:none}.select-option.disabled:before{display:none}.select-checkmark{color:var(--accent-cyan);font-size:.8rem;margin-left:.5rem;opacity:0;transition:opacity .2s ease}.select-option.selected .select-checkmark{opacity:1}.select-dropdown::-webkit-scrollbar{width:6px}.select-dropdown::-webkit-scrollbar-track{background:var(--bg-inset);border-radius:3px}.select-dropdown::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:3px}.select-dropdown::-webkit-scrollbar-thumb:hover{background:var(--accent-cyan)}.prompt-modal-overlay{z-index:2000}.prompt-modal{max-width:450px;width:90%}.modal-header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border-color);padding-bottom:1rem;margin-bottom:1.5rem}.modal-header h3{margin:0;font-size:1.3rem;display:flex;align-items:center;gap:.75rem}.modal-header h3 .fa-keyboard{color:var(--accent-cyan)}.close-button{background:none;border:none;color:var(--text-secondary);cursor:pointer;font-size:1.2rem;padding:.25rem;line-height:1;border-radius:4px;transition:all .2s ease}.close-button:hover{color:var(--accent-pink);background-color:var(--bg-inset)}.modal-content{display:flex;flex-direction:column;gap:1.5rem}.prompt-message{color:var(--text-secondary);font-size:1rem;line-height:1.5;margin:0}.prompt-form{display:flex;flex-direction:column;gap:1.5rem}.prompt-input,.prompt-textarea{width:100%;padding:.75rem 1rem;background-color:var(--bg-main);color:var(--text-primary);border:1px solid var(--border-color);border-radius:6px;font-size:.95rem;font-family:var(--font-sans);transition:all .2s ease}.prompt-input:focus,.prompt-textarea:focus{outline:none;border-color:var(--accent-cyan);box-shadow:0 0 0 2px #78dce84d}.prompt-input::placeholder,.prompt-textarea::placeholder{color:var(--text-muted)}.prompt-textarea{resize:vertical;min-height:120px;line-height:1.6;font-family:var(--font-mono);font-size:.9rem}.prompt-actions{display:flex;gap:1rem;justify-content:flex-end}.prompt-actions .control-button{min-width:100px}.prompt-actions .run-button:disabled{background-color:var(--text-muted);border-color:var(--text-muted);cursor:not-allowed}.prompt-actions .run-button:disabled:hover{background-color:var(--text-muted);border-color:var(--text-muted)}.shortcuts-modal{max-width:700px;width:90%}.shortcut-tabs{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem;padding:.5rem;background-color:var(--bg-inset);border-radius:8px;border:1px solid var(--border-color)}.tab-button{flex:1;min-width:120px;padding:.75rem 1rem;background-color:var(--bg-main);color:var(--text-primary);border:1px solid var(--border-color);border-radius:6px;font-size:.85rem;font-weight:500;cursor:pointer;transition:all .2s ease}.tab-button:hover{background-color:var(--accent-purple);border-color:var(--accent-purple);color:#fff}.tab-button.active{background-color:var(--accent-purple);border-color:var(--accent-purple);color:#fff;box-shadow:0 2px 8px #ab9df24d}.shortcuts-grid-modal{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.75rem;margin:1.5rem 0}.shortcut-button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;padding:1rem .75rem;background-color:var(--bg-main);color:var(--text-primary);border:1px solid var(--border-color);border-radius:8px;font-size:.85rem;font-weight:500;cursor:pointer;transition:all .2s ease;min-height:80px}.shortcut-button:hover{background-color:var(--accent-purple);border-color:var(--accent-purple);color:#fff;transform:translateY(-2px);box-shadow:0 4px 12px #ab9df24d}.shortcut-button .fa-solid{font-size:1.5rem;color:var(--accent-cyan)}.shortcut-button:hover .fa-solid{color:#fff}.shortcuts-modal .dialog-actions{justify-content:center;margin-top:2rem}.client-capture-preview{padding:1rem;background-color:var(--bg-inset);border-radius:6px;border:1px solid var(--border-color);margin-top:.5rem}.client-capture-preview h4{font-size:.8rem;color:var(--accent-orange);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.75rem;font-weight:600}#preview-canvas{width:100%;height:auto;border:1px dashed var(--accent-orange);border-radius:4px;background-color:#000;margin-bottom:.75rem}.preview-modal{max-width:600px;width:90%}.preview-image{width:100%;height:auto;max-height:400px;object-fit:contain;border:1px solid var(--border-color);border-radius:6px;background-color:#000}.log-actions{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem}.search-container{display:flex;gap:.5rem;align-items:center;flex:1;max-width:300px}.search-container .control-button{padding:.75rem 1rem;min-height:44px;box-sizing:border-box}.search-input{flex:1;padding:.75rem 1rem;background-color:var(--bg-inset);color:var(--text-primary);border:1px solid var(--border-color);border-radius:6px;font-size:.85rem;font-family:var(--font-sans);transition:all .2s ease;height:auto;min-height:44px;box-sizing:border-box}.search-input:focus{outline:none;border-color:var(--accent-cyan);box-shadow:0 0 0 2px #78dce84d}.search-input:disabled{cursor:not-allowed;background-color:var(--bg-inset);color:var(--text-muted);opacity:.6}.search-input::placeholder{color:var(--text-muted)}.server-logs-container{min-height:150px;max-height:400px;background-color:var(--bg-inset);border-radius:6px;padding:.75rem 1rem;border:1px solid var(--border-color);overflow-y:auto;font-family:var(--font-mono);font-size:.8rem;color:var(--text-secondary);white-space:pre-wrap;word-wrap:break-word;line-height:1.4;display:flex;flex-direction:column;gap:.25rem}.server-log-entry{padding:.25rem .5rem;border-radius:3px;background-color:#0000001a;border-left:2px solid transparent;transition:all .2s ease}.server-log-entry:hover{background-color:#0003}.server-log-entry.info{border-left-color:var(--accent-cyan)}.server-log-entry.warning{border-left-color:var(--accent-yellow)}.server-log-entry.error{border-left-color:var(--accent-pink)}.server-log-entry.debug{border-left-color:var(--accent-purple)}.server-log-time{color:var(--accent-cyan);font-weight:500;margin-right:.5rem}.server-log-level{font-weight:600;margin-right:.5rem;text-transform:uppercase;font-size:.7rem}.server-log-level.info{color:var(--accent-cyan)}.server-log-level.warning{color:var(--accent-yellow)}.server-log-level.error{color:var(--accent-pink)}.server-log-level.debug{color:var(--accent-purple)}.server-log-message{color:var(--text-secondary)}.server-logs-controls{display:flex;justify-content:space-between;align-items:center;margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--border-color)}.server-logs-controls .control-button{width:auto;min-width:120px;font-size:.8rem;padding:.5rem 1rem}.server-logs-loading{text-align:center;color:var(--text-muted);font-style:italic;padding:1rem}.server-logs-error{text-align:center;color:var(--accent-pink);padding:1rem;background-color:#ff61881a;border:1px solid var(--accent-pink);border-radius:4px;margin:.5rem 0}.server-logs-empty{text-align:center;color:var(--text-muted);font-style:italic;padding:1rem}