:root{--widget-color-bg: #1f2937;--widget-color-border: #374151;--widget-color-text-primary: #f9fafb;--widget-color-text-secondary: #9ca3af;--widget-color-text-value: #ffffff;--widget-color-state-success: #10b981;--widget-color-state-error: #ef4444;--widget-color-state-pending: #f59e0b;--widget-color-state-selected-glow: #f59e0b;--widget-color-indicator-on: var(--widget-color-state-success);--widget-color-indicator-off: #4b5563;--widget-color-toggle-on-bg: var(--widget-color-state-success);--widget-color-toggle-off-bg: #4b5563;--widget-color-overlay-bg: rgba(17, 24, 39, .7);--widget-sizing-padding: 1.5rem;--widget-sizing-radius: .75rem;--widget-sizing-gap: 1rem;--widget-sizing-indicator-size: 60px;--widget-sizing-edit-button-size: 50px;--widget-font-family-primary: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--widget-font-family-monospace: "Fira Code", "Courier New", monospace;--widget-font-size-title: 1.1rem;--widget-font-size-address: .8rem;--widget-font-size-value: 3rem;--widget-font-weight-title: 600;--widget-font-weight-value: 700;--widget-effect-shadow: 0 4px 10px rgba(0, 0, 0, .1);--widget-effect-transition-duration: .2s;--widget-effect-selected-shadow: 0 0 0 3px var(--widget-color-state-selected-glow)}.widget{background-color:var(--widget-color-bg, #1f2937);border:1px solid var(--widget-color-border, #374151);border-radius:var(--widget-sizing-radius, .75rem);padding:var(--widget-sizing-padding, 1.5rem);display:flex;flex-direction:column;color:var(--widget-color-text-primary, #f9fafb);position:relative;overflow:visible;box-shadow:var(--widget-effect-shadow, 0 4px 10px rgba(0, 0, 0, .1));transition:all var(--widget-effect-transition-duration, .2s) ease-in-out}.widget__header{display:flex;justify-content:space-between;align-items:flex-start;flex-shrink:0;padding:6px}.widget__title{font-family:var(--widget-font-family-primary);font-size:var(--widget-font-size-title, 1.1rem);font-weight:var(--widget-font-weight-title, 600);line-height:1.2}.widget__address{font-family:var(--monospace-font);font-size:var(--widget-font-size-address, .8rem);color:var(--widget-color-text-secondary, #9ca3af);margin-top:4px}.widget__body{flex-grow:1;display:flex;align-items:center;justify-content:center;min-height:50px}.widget__footer{display:flex;justify-content:flex-end;gap:calc(var(--widget-sizing-gap) / 2);width:100%;margin-top:var(--widget-sizing-gap);flex-shrink:0}.widget__value{font-family:var(--monospace-font);font-size:var(--widget-font-size-value, 3rem);font-weight:var(--widget-font-weight-value, 700);color:var(--widget-color-text-value, #ffffff)}@keyframes pulse-pending{50%{box-shadow:0 0 16px 2px var(--widget-color-state-pending)}}@keyframes shake{25%{transform:translate(-5px)}75%{transform:translate(5px)}}.widget.is-pending{opacity:.7;cursor:wait;box-shadow:0 0 8px var(--widget-color-state-pending);animation:pulse-pending 1.5s infinite}.widget.is-pending *{pointer-events:none}.widget.is-error{border-color:var(--widget-color-state-error);box-shadow:0 0 15px var(--widget-color-state-error);animation:shake .5s}.widget.is-success{border-color:var(--widget-color-state-success);box-shadow:0 0 15px var(--widget-color-state-success)}.widget.is-selected{box-shadow:var(--widget-effect-selected-shadow, 0 0 0 3px #f59e0b)!important;border-color:var(--widget-color-state-selected-glow, #f59e0b)!important}body.widget-edit-mode .widget:hover{border-color:var(--widget-color-text-secondary)}body.widget-edit-mode .widget.is-selected:hover{border-color:var(--widget-color-state-selected-glow, #f59e0b)!important}.widget--indicator .widget__value{width:var(--widget-sizing-indicator-size, 60px);height:var(--widget-sizing-indicator-size, 60px);border-radius:50%;transition:all var(--widget-effect-transition-duration) ease}.widget--indicator .widget__value.on{background-color:var(--widget-color-indicator-on, #10b981);box-shadow:0 0 15px var(--widget-color-indicator-on, #10b981)}.widget--indicator .widget__value.off{background-color:var(--widget-color-indicator-off, #4b5563)}.numeric-input-widget{display:flex;align-items:center;gap:.75rem;width:100%}.widget-value-input{width:120px;font-size:1.875rem;font-weight:700;text-align:right;background-color:var(--bg-primary);color:var(--text-primary);border:1px solid var(--border-color);border-radius:6px;padding:.5rem}.widget-unit-label{font-size:1.25rem;color:var(--text-secondary)}.widget-send-btn{background-color:var(--accent)!important;color:var(--bg-primary)!important;border-radius:6px;padding:.75rem;border:none;cursor:pointer}.widget-toggle-button{width:100%;padding:1rem;font-size:1.2rem;font-weight:700;border:none;border-radius:8px;cursor:pointer;transition:all .3s ease;text-transform:uppercase;box-shadow:0 4px 6px #0000001a}.widget-toggle-button.off{background-color:#4b5563;color:#e5e7eb}.widget-toggle-button.off:hover{background-color:#374151}.widget-toggle-button.on{background-color:#10b981;color:#fff;box-shadow:0 0 15px #10b98166}.widget-toggle-button.on:hover{background-color:#059669}.widget--toggle-button .widget-toggle-button.on{background-color:var(--widget-color-toggle-on-bg)!important;box-shadow:0 0 15px var(--widget-color-toggle-on-bg)}.widget--toggle-button .widget-toggle-button.off{background-color:var(--widget-color-toggle-off-bg)!important}.widget--gauge .widget__body{position:relative}.widget--gauge canvas{width:100%;height:100%}.widget-gauge-value{position:absolute;bottom:10%;font-size:1.8rem;font-weight:700;font-family:var(--monospace-font);text-shadow:0 0 5px rgba(0,0,0,.5)}.widget-recipe-table-container{width:100%;max-height:250px;overflow-y:auto;border:1px solid var(--bg-card);border-radius:4px;margin-bottom:1rem}.widget-recipe-table{width:100%;border-collapse:collapse}.widget-recipe-table th,.widget-recipe-table td{padding:8px 12px;text-align:right}.widget-recipe-table th{background-color:var(--bg-card);position:sticky;top:0}.widget-recipe-table td:first-child,.widget-recipe-table th:first-child{text-align:left;font-weight:700}.widget-recipe-table input{width:100%;background:transparent;border:1px solid transparent;color:var(--text-primary);text-align:right;padding:4px;border-radius:4px}.widget-recipe-table input:not([readonly]){background-color:var(--bg-primary);border-color:var(--border-color)}.widget__footer button{padding:8px 16px;border-radius:6px;border:none;cursor:pointer;font-weight:700}.widget-btn-edit{background-color:var(--accent);color:var(--bg-primary)}.widget-btn-cancel{background-color:var(--bg-card);color:var(--text-primary)}.widget-btn-save.success{background-color:var(--green);color:#fff}.vfd-status-display{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.vfd-speed-display{text-align:center;font-family:var(--monospace-font);font-size:2.5rem;font-weight:700}.vfd-speed-display .unit{font-size:1rem;color:var(--text-secondary)}.vfd-slider{-webkit-appearance:none;appearance:none;width:100%;height:10px;background:var(--bg-primary);border-radius:5px;outline:none;border:1px solid var(--border-color)}.vfd-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:24px;height:24px;background:var(--accent);border-radius:50%;cursor:pointer}.fermenter-main-display{text-align:center}.fermenter-temp-value{font-size:3.5rem;line-height:1}.fermenter-setpoint-value{font-size:1rem;color:var(--text-secondary)}.fermenter-details{display:flex;justify-content:space-between;align-items:center;margin-top:1.5rem;padding-top:1rem;border-top:1px solid var(--bg-card)}.fermenter-time,.fermenter-valve{display:flex;align-items:center;gap:.5rem}.valve-toggle-btn{background-color:transparent!important;padding:0!important}.valve-toggle-btn .indicator-dot.on{background-color:var(--green)}.valve-toggle-btn .indicator-dot.off{background-color:var(--bg-card)}.template-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;width:100%}.template-item,.template-item-full{display:flex;flex-direction:column;text-align:center}.template-item-full{grid-column:1 / -1}.template-item label,.template-item-full label{font-size:.9rem;color:var(--text-secondary);margin-bottom:.5rem}.template-item .value{font-size:2rem;font-weight:700;font-family:var(--monospace-font)}.indicator-row{display:flex;justify-content:center;gap:2rem}.indicator-row .on{color:var(--green);font-weight:700}.indicator-row .off{color:var(--text-secondary)}.validation-widget{display:flex;align-items:center;gap:1.5rem}.validation-status-icon svg{width:48px;height:48px}.validation-status-icon.status-ok{color:var(--green)}.validation-status-icon.status-error{color:var(--red);animation:shake .5s}.validation-status-icon.status-idle{color:var(--text-secondary)}.validation-message{font-weight:700;font-size:1.2rem}.validation-data{font-family:var(--monospace-font);color:var(--text-secondary)}.widget-process-state{text-align:center}.process-state-icon svg{width:48px;height:48px;margin:auto;color:var(--accent)}.process-state-message{font-size:1.8rem;font-weight:700}.process-state-details{font-size:1rem;color:var(--text-secondary);font-family:var(--monospace-font);margin-top:.5rem}.widget.alarm-banner{padding:.75rem 1.5rem}.widget.alarm-banner .widget__body{flex-direction:row}.widget.alarm-banner .widget__value{font-size:1.2rem;text-transform:uppercase}.widget__action-bar{position:absolute;top:0;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:8px;background-color:var(--bg-card);border:1px solid var(--border-color);border-radius:99px;padding:6px 8px;box-shadow:0 4px 10px #0000004d;opacity:0;visibility:hidden;transform:translate(-50%,-20px);transition:opacity .2s ease,visibility .2s,transform .2s ease;z-index:10}body.widget-edit-mode .widget:hover .widget__action-bar,body.widget-edit-mode .widget.is-selected .widget__action-bar{opacity:1;visibility:visible;transform:translate(-50%,-50%)}.widget__action-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;border:none;cursor:pointer;color:#fff;transition:transform .2s}.widget__action-btn:hover{transform:scale(1.1)}.widget__action-btn i{width:20px;height:20px}.widget__remove-btn{background-color:var(--widget-color-state-error)!important}.widget__drag-handle{display:flex;align-items:center;color:var(--text-secondary);cursor:move;padding:0 8px}.widget__drag-handle i{width:20px;height:20px}.gridstack-view-container.grid-stack{background:transparent}body.widget-edit-mode .gridstack-view-container.grid-stack{background-image:linear-gradient(rgba(128,128,128,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(128,128,128,.1) 1px,transparent 1px);background-size:calc(100% / 12) 20px}.gridstack-view-container .grid-stack-item-content.widget{position:absolute;inset:0;width:100%;height:100%}.native-grid-container{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem;grid-auto-rows:minmax(180px,auto);grid-auto-flow:dense}@media(max-width:640px){.native-grid-container{gap:.75rem;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}}#agent-config-form{display:flex;flex-direction:column;gap:1rem}.config-section details{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:8px;overflow:hidden}.config-section summary{padding:1rem;font-weight:700;cursor:pointer;background-color:var(--bg-card);display:flex;justify-content:space-between}.config-section summary:after{content:"▼";transition:transform .2s}.config-section details[open] summary:after{transform:rotate(180deg)}.config-section-body{padding:1.5rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem}.config-form-group{display:flex;flex-direction:column;gap:.5rem}.config-form-group.switch-group{flex-direction:row;justify-content:space-between;align-items:center;background:var(--bg-primary);padding:.75rem;border-radius:6px}#ac-json-editor{width:100%;background-color:#111827;color:#d1d5db;border:1px solid var(--border-color);border-radius:6px;font-family:var(--monospace-font);font-size:.9rem}.command-palette-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0009;display:none;justify-content:center;align-items:flex-start;z-index:1000;padding-top:15vh}.command-palette-overlay.show{display:flex}.command-palette{background-color:var(--bg-dark);border-radius:8px;width:90%;max-width:600px;box-shadow:0 10px 30px #0000004d;border:1px solid var(--border-color);overflow:hidden}.command-palette input{width:100%;padding:16px;background-color:transparent;border:none;border-bottom:1px solid var(--border-color);color:var(--text-primary);font-size:1.1rem}.command-palette input:focus{outline:none;border-bottom-color:var(--primary-color)}.command-palette ul{list-style:none;margin:0;padding:0;max-height:400px;overflow-y:auto}.command-palette ul li{padding:12px 16px;cursor:pointer;border-bottom:1px solid var(--border-color-light);display:flex;justify-content:space-between;align-items:center}.command-palette ul li:last-child{border-bottom:none}.command-palette ul li:hover,.command-palette ul li.selected{background-color:var(--primary-color-dark)}.command-palette .keybind{font-size:.8em;color:var(--text-secondary);background-color:var(--bg-card);padding:2px 6px;border-radius:4px;border:1px solid var(--border-color)}#bottom-panels-container{position:fixed;bottom:0;left:0;right:0;height:40vh;background-color:var(--bg-secondary);border-top:1px solid var(--border-color);display:flex;flex-direction:column;z-index:1000;transform:translateY(100%);transition:transform .3s ease-in-out}#bottom-panels-container.visible{transform:translateY(0)}.bottom-panel-tab-bar{display:flex;flex-shrink:0;border-bottom:1px solid var(--border-color);background-color:var(--bg-main)}.bottom-panel-tab-button{padding:.6rem 1rem;background-color:transparent;border:none;border-bottom:2px solid transparent;color:var(--text-secondary);cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:.5rem}.bottom-panel-tab-button:hover{background-color:var(--bg-hover);color:var(--text-primary)}.bottom-panel-tab-button.active{color:var(--primary-color);border-bottom-color:var(--primary-color)}.bottom-panel-content-wrapper{flex-grow:1;position:relative;overflow:hidden}.bottom-panel-content{display:none;flex-direction:column;height:100%;width:100%;position:absolute}.bottom-panel-content.active{display:flex}.panel-controls{display:flex;justify-content:space-between;align-items:center;padding:.5rem;background-color:var(--bg-main);border-bottom:1px solid var(--border-color);flex-shrink:0}#log-filters{display:flex;align-items:center;gap:1rem;font-size:.8rem}#log-filters label{display:flex;align-items:center;gap:.3rem;cursor:pointer}#log-search-input{margin-left:auto;background-color:var(--bg-input);border:1px solid var(--border-color);color:var(--text-primary);padding:.25rem .5rem;border-radius:4px;font-size:.8rem}.log-panel{flex-grow:1;overflow-y:auto;padding:.5rem;font-family:Courier New,Courier,monospace;font-size:13px;color:var(--text-secondary);background-color:var(--bg-main)}#traffic-log .traffic-frame{display:flex;align-items:center;gap:1rem;padding:.2rem 0;white-space:nowrap}#traffic-log .traffic-direction{font-weight:700;font-size:1.2em}#traffic-log .traffic-direction.request{color:var(--blue)}#traffic-log .traffic-direction.response{color:var(--green)}#traffic-log .hex-byte{padding:2px;border-radius:3px;margin:0 1px}#traffic-log .byte-id{background-color:#4a4a88}#traffic-log .byte-func{background-color:#884a88}#traffic-log .byte-addr{background-color:#4a884a}#traffic-log .byte-qty{background-color:#88884a}#traffic-log .byte-count{background-color:sienna}#traffic-log .byte-data{background-color:#555}#traffic-log .byte-crc{background-color:#884a4a}#traffic-log .byte-error{background-color:var(--red)}#status-log .log-entry{padding:2px 0;border-bottom:1px solid var(--bg-card);display:flex;gap:1rem}#status-log .log-timestamp{color:#888}#status-log .log-context{font-weight:700}#status-log .log-level-info{color:var(--text-secondary)}#status-log .log-level-success{color:var(--green)}#status-log .log-level-warn{color:var(--yellow)}#status-log .log-level-error{color:var(--red)}.log-entry{display:flex;gap:12px;font-family:SF Mono,Consolas,monospace;font-size:.8rem;padding:2px 0}.log-timestamp{color:var(--text-secondary)}.log-source{font-weight:700}.log-entry.log-warn .log-message{color:var(--yellow)}.log-entry.log-error .log-message{color:var(--red)}#traffic-log{font-family:var(--monospace-font)}.traffic-frame{display:flex;align-items:center;gap:10px;margin-bottom:8px}.traffic-direction{font-weight:700}.traffic-direction.request{color:#9cdcfe}.traffic-direction.response{color:#b5cea8}.traffic-frame .icon-button{width:28px;height:28px;flex-shrink:0}.traffic-frame .icon-button i{height:14px}.hex-byte{display:inline-block;padding:2px 5px;border-radius:3px;margin:1px;font-weight:700;min-width:22px;text-align:center;font-size:.8rem}.byte-id{background-color:#ce9178;color:#1e1e1e}.byte-func{background-color:#9cdcfe;color:#1e1e1e}.byte-addr{background-color:#b5cea8;color:#1e1e1e}.byte-qty{background-color:#d7ba7d;color:#1e1e1e}.byte-count{background-color:#d16969;color:#fff}.byte-data{background-color:#6a9955;color:#fff}.byte-crc{background-color:#c586c0;color:#1e1e1e}#traffic-panel .panel-controls{justify-content:center;align-items:center;gap:2rem;padding:1rem 0;background-color:transparent;border-bottom:none}#traffic-panel .panel-controls .icon-button{width:120px;height:56px;background-color:var(--bg-card);border:1px solid var(--border-color);border-radius:9999px;color:var(--text-secondary);transition:all .2s ease}#traffic-panel .panel-controls .icon-button:hover{border-color:var(--primary-color);color:var(--primary-color);transform:translateY(-2px)}#traffic-panel .panel-controls .icon-button i{width:24px;height:24px}#log-filters{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1.5rem}.log-filter-group{display:contents}.log-filter-group-label{font-weight:700;color:var(--accent);font-size:.8rem;margin-right:-.5rem}#log-filters label{display:flex;align-items:center;gap:.4rem;cursor:pointer;font-size:.8rem}#log-subscribe-btn.active{color:var(--green);box-shadow:0 0 8px var(--green)}.spin{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}#agent-logs-content{white-space:pre-wrap;word-break:break-all}.fab-container{position:fixed;bottom:calc(var(--bottom-panels-height-collapsed) + 20px);right:20px;z-index:998;transition:bottom .3s ease}body.bottom-panels-open .fab-container{bottom:calc(var(--bottom-panels-height-open) + 20px)}.fab-main{width:56px;height:56px;border-radius:50%;background-color:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 8px #0000004d}.fab-actions{position:absolute;bottom:65px;right:5px;display:flex;flex-direction:column;gap:1rem;opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s}.fab-container.open .fab-actions{opacity:1;visibility:visible}.fab-action{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:.8rem;color:#fff;box-shadow:0 2px 5px #0003}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000b3;z-index:1002;display:none;align-items:center;justify-content:center}.modal-overlay.visible{display:flex}.modal-content{background:var(--bg-secondary);padding:2rem;border-radius:8px;min-width:300px}#system-variables-section .section-header{display:flex;justify-content:space-between;align-items:center}#system-variables-section .section-header h2{margin:0;font-size:1rem;color:var(--accent)}#system-variables-section .icon-button{height:32px;background-color:var(--bg-card)}#system-variables-section .icon-button:hover{background-color:var(--bg-secondary)}#system-variables-section .icon-button i{height:16px}.system-variables-list{display:flex;flex-direction:column;gap:8px;max-height:450px;overflow-y:auto;padding-right:5px}.sys-var-item{display:grid;grid-template-columns:1fr auto;align-items:center;gap:16px;padding:6px 10px;background-color:transparent;border:1px solid var(--bg-card);border-radius:6px}.sys-var-label{font-size:.75rem;color:#8a9bb1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:default}.sys-var-controls{display:flex;align-items:center;gap:8px}.sys-var-controls .icon-button{width:28px;height:28px}.sys-var-controls .icon-button i{width:14px;height:14px}.sys-var-input{width:70px;padding:4px 8px;font-size:.9rem;background-color:var(--bg-primary);color:var(--text-primary);border:1px solid var(--bg-card);border-radius:4px;text-align:right}.sys-var-type-label{font-size:.8rem;color:var(--text-secondary);font-style:italic}.profile-manager{padding-bottom:16px;margin-bottom:16px;border-bottom:1px solid var(--bg-card)}.profile-manager .button-group{margin-top:1rem;display:flex;gap:8px}.profile-manager button{padding:8px 12px;font-size:.8rem}.variable-filter{margin-bottom:16px}#variable-search-input{width:100%;padding:10px 14px;font-size:.9rem;background-color:var(--bg-primary);color:var(--text-primary);border:1px solid var(--bg-card);border-radius:6px}.form-group{display:flex;flex-direction:column;gap:.5rem}.panel-header,.mobile-header{display:flex;justify-content:space-between;align-items:center;padding:1rem;border-bottom:1px solid var(--bg-card)}.mobile-header-title{display:flex;align-items:center;gap:.8rem}.mobile-header-title h1{font-size:1.4rem}.icon-button{background-color:var(--bg-card);border:1px solid var(--bg-card);color:var(--text-primary);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .2s}.icon-button:hover{background-color:var(--accent-hover);color:#fff}.icon-button.success{background-color:var(--green-dark)}.icon-button.success:hover{background-color:var(--green)}.icon-button.danger{background-color:var(--red-dark)}.icon-button.danger:hover{background-color:var(--red)}.button-group{display:flex;gap:.5rem;margin-top:1rem}.switch{position:relative;display:inline-block;width:50px;height:28px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;inset:0;background-color:var(--bg-card);transition:.4s;height:100%!important}.slider:before{position:absolute;content:"";height:20px;width:20px;left:4px;bottom:4px;background-color:#fff;transition:.4s}input:checked+.slider{background-color:var(--green);box-shadow:0 0 5px var(--green)}input:focus+.slider{box-shadow:0 0 1px var(--green)}input:checked+.slider:before{transform:translate(22px)}.slider.round{border-radius:28px}.slider.round:before{border-radius:50%}#toast-container{position:fixed;bottom:20px;right:20px;z-index:2000;display:flex;flex-direction:column;align-items:flex-end;gap:10px}.toast{background-color:var(--bg-card);color:var(--text-primary);padding:15px 20px;border-radius:8px;box-shadow:0 4px 12px #0003;border:1px solid var(--border-color);opacity:0;transform:translate(100%);transition:all .4s cubic-bezier(.215,.61,.355,1);display:flex;align-items:center;gap:10px;min-width:250px;max-width:350px}.toast.show{opacity:1;transform:translate(0)}.toast-icon{font-size:1.2em}.toast.success{border-left:4px solid var(--green)}.toast.success .toast-icon{color:var(--green)}.toast.error{border-left:4px solid var(--red)}.toast.error .toast-icon{color:var(--red)}.toast.info{border-left:4px solid var(--blue)}.toast.info .toast-icon{color:var(--blue)}.dashboard-main{display:grid;grid-template-columns:1fr;gap:1.5rem}@media(min-width:1024px){.dashboard-main{grid-template-columns:repeat(3,1fr)}.dashboard-col-span-1{grid-column:span 1 / span 1}.dashboard-col-span-2{grid-column:span 2 / span 2}}.dashboard-card{background-color:var(--bg-secondary);border-radius:.5rem;padding:1.5rem;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a}.dashboard-card h3,.dashboard-card h2{font-size:1.25rem;font-weight:600;color:var(--text-primary);margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.dashboard-card h3 i,.dashboard-card h2 i{color:var(--accent)}.indicator-dot{width:1rem;height:1rem;border-radius:9999px;transition:all .3s ease}.indicator-dot.off{background-color:var(--bg-card)}.indicator-dot.on{background-color:var(--green);box-shadow:0 0 8px var(--green)}.indicator-dot.alarm{background-color:var(--red);box-shadow:0 0 8px var(--red);animation:pulse 1.5s infinite}@keyframes pulse{50%{opacity:.7}}.slider{-webkit-appearance:none;appearance:none;width:100%;height:8px;background:var(--bg-card);border-radius:5px;outline:none}.slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;background:var(--accent);border-radius:50%;cursor:pointer;border:2px solid var(--bg-secondary)}.slider::-moz-range-thumb{width:20px;height:20px;background:var(--accent);border-radius:50%;cursor:pointer;border:2px solid var(--bg-secondary)}.vfd-card.selected{border:2px solid var(--accent)!important}.vfd-button{width:100%;color:var(--text-primary);font-weight:500;border-radius:.5rem;font-size:.875rem;padding:.75rem 1.25rem;text-align:center;transition:background-color .2s;border:none;cursor:pointer}.vfd-button.start{background-color:#2563eb}.vfd-button.start:hover{background-color:#1d4ed8}.vfd-button.stop{background-color:var(--red)}.vfd-button.stop:hover{background-color:#b91c1c}.recipe-editor-container{padding:1rem}.recipe-selector{display:flex;align-items:center;gap:1rem;margin-bottom:2rem}.recipe-selector label{font-weight:600}.recipe-selector select{width:300px}.recipe-columns{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}.recipe-column{display:flex;flex-direction:column;gap:.8rem}.recipe-day-row{display:flex;align-items:center;justify-content:space-between;gap:1rem}.recipe-day-row label{color:var(--text-secondary)}.recipe-day-row input{width:100px;text-align:right}.recipe-calendar-container{display:flex;flex-direction:column;gap:1.5rem}.recipe-calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:.5rem;border:1px solid var(--border-color);padding:.5rem;border-radius:8px;background-color:var(--bg-primary)}.calendar-header{display:grid;grid-template-columns:repeat(7,1fr);gap:.5rem;padding:0 .5rem}.calendar-header-day{text-align:center;font-weight:700;color:var(--text-secondary);padding-bottom:.5rem}.calendar-day{background-color:var(--bg-card);border:1px solid var(--border-color);border-radius:6px;padding:.75rem;aspect-ratio:1 / 1;display:flex;flex-direction:column;justify-content:space-between;cursor:pointer;transition:all .2s ease}.calendar-day:hover{border-color:var(--accent)}.calendar-day.editing{border-color:var(--accent);box-shadow:0 0 10px var(--accent)}.day-number{font-weight:700;color:var(--text-secondary)}.day-value{text-align:center}.day-value input{font-size:1.5rem;font-weight:700;color:var(--text-primary);background-color:transparent;border:none;width:100%;text-align:center;padding:0;pointer-events:none}.calendar-day.editing .day-value input{background-color:var(--bg-primary);border:1px solid var(--accent);border-radius:4px;pointer-events:all}.day-actions{display:none;justify-content:flex-end;gap:.5rem;margin-top:.5rem}.calendar-day.editing .day-actions{display:flex}.day-actions button{padding:4px 8px;font-size:.8rem}@media(max-width:768px){.recipe-calendar-container{padding:.75rem}.recipe-calendar-grid{gap:.25rem;padding:.25rem}.calendar-day{padding:.5rem;min-height:80px;aspect-ratio:unset}.day-number{font-size:.8rem}.day-value input{font-size:1.2rem}.calendar-day.editing{position:relative;z-index:10;transform:scale(1.05)}.day-actions{flex-direction:column}.calendar-header-day{font-size:.8rem}.recipe-selector{flex-direction:column;align-items:stretch}}@media(max-width:480px){.calendar-header-day{font-size:.7rem}.day-value input{font-size:1rem}}.fermenters-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.5rem}.fermenter-card{border:2px solid var(--bg-card);transition:border-color .3s,box-shadow .3s}.fermenter-card.active{border-color:var(--green);box-shadow:0 0 15px #10b9814d}.fermenter-card h4{font-size:1.5rem;color:var(--text-primary);margin-bottom:.5rem}.fermenter-status{font-weight:700;color:var(--text-secondary);margin-bottom:1.5rem}.fermenter-card.active .fermenter-status{color:var(--green)}.fermenter-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;text-align:center;margin-bottom:1.5rem}.fermenter-metrics strong{display:block;font-size:1.8rem;color:var(--text-primary)}.fermenter-metrics span{font-size:.8rem;color:var(--text-secondary)}.fermenter-actions h5{font-size:.8rem;text-transform:uppercase;color:var(--text-secondary);margin-bottom:.8rem;text-align:center}.recipe-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}.recipe-buttons button{padding:.5rem;font-size:.8rem;background-color:var(--bg-primary);color:var(--text-secondary);border:1px solid var(--bg-card)}.recipe-buttons button:hover{background-color:var(--accent);color:#111;border-color:var(--accent)}#agent-control-center-modal .modal-body{background-color:var(--bg-primary)}#agent-status-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(380px,1fr));gap:1.5rem}.agent-card{background:var(--bg-secondary);border-radius:8px;border:1px solid var(--border-color);display:flex;flex-direction:column;transition:all .2s ease-in-out}.agent-card.focused{border-color:var(--accent);box-shadow:0 0 15px #f59e0b66}.agent-card .card-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;border-bottom:1px solid var(--border-color)}.status-line{display:flex;align-items:center;gap:.5rem;font-weight:700;margin-bottom:1rem}.status-line .icon-online{color:var(--green)}.status-line .icon-offline{color:var(--red)}.agent-details{display:flex;justify-content:space-between;font-size:.8rem;color:var(--text-secondary);margin-bottom:1rem}.agent-card .card-footer{padding:1rem 1.5rem;background-color:var(--bg-card);border-top:1px solid var(--border-color);text-align:right}.agent-card .btn.focus-btn{background-color:var(--accent);color:var(--bg-primary);border:none;padding:.5rem 1rem}.agent-card .btn.focus-btn:disabled{background-color:#4b5563;color:var(--text-secondary);cursor:not-allowed;opacity:1}@media(max-width:768px){.category-panel,#debug-drawer{width:100%;--drawer-right-width: 100%}.header .mode-controls{display:none}.header h2{font-size:1.1rem}#view-content{padding:.75rem}.widget{--widget-sizing-padding: 1rem}.widget__title{--widget-font-size-title: 1rem}.widget__value{--widget-font-size-value: 2.2rem}.fermenter-metrics{grid-template-columns:1fr;gap:.75rem;text-align:left}.fermenter-metrics>div{display:flex;justify-content:space-between;align-items:baseline;border-bottom:1px solid var(--bg-card);padding-bottom:.5rem}.fermenter-metrics strong{font-size:1.5rem}.thermocouple-grid{grid-template-columns:repeat(2,1fr)}.recipe-columns{grid-template-columns:1fr}}@media(max-width:768px){body.view-manual .native-grid-container{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.75rem}body.view-manual .widget{background-color:#151d30;border:none;padding:0;box-shadow:none}body.view-manual .widget__header{font-size:xx-small}body.view-manual .widget__body{padding:0;height:100%}body.view-manual .widget--toggle-button .widget-toggle-button{width:100%;height:100%;min-height:80px;font-size:1rem;padding:.5rem;display:flex;align-items:center;justify-content:center;text-align:center}}#tab-mapping-inspector .inspector-container{display:flex;flex-direction:column;gap:1rem;height:100%}#tab-mapping-inspector .inspector-section{background-color:var(--bg-secondary);padding:1rem;border-radius:8px;border:1px solid var(--border-color)}#tab-mapping-inspector .input-group{display:flex;align-items:center;gap:10px}#tab-mapping-inspector .input-group input{flex-grow:1}#tab-mapping-inspector .input-group button{width:auto}#tab-mapping-inspector .results-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem}#tab-mapping-inspector .results-grid div{background:var(--bg-primary);padding:.75rem;border-radius:4px}#tab-mapping-inspector .results-grid div span{font-weight:700;color:var(--accent);font-family:var(--monospace-font)}#tab-mapping-inspector .value-box{display:inline-block;background-color:var(--bg-card);padding:5px 10px;border-radius:4px;font-family:var(--monospace-font);font-weight:700;margin:0 10px;min-width:50px;text-align:center}#tab-mapping-inspector #inspector-run-audit-btn{display:flex;align-items:center;gap:.5rem;background-color:var(--green);color:#fff}#tab-mapping-inspector .error-message{color:var(--red);font-weight:700;margin-top:1rem}#tab-mapping-inspector .hidden{display:none}#tab-mapping-inspector .audit-table-container{max-height:400px;overflow-y:auto;margin-top:1rem;border:1px solid var(--border-color);border-radius:6px}#tab-mapping-inspector table{width:100%;border-collapse:collapse}#tab-mapping-inspector th,#tab-mapping-inspector td{padding:8px;text-align:left;border-bottom:1px solid var(--border-color)}#tab-mapping-inspector th{background-color:var(--bg-card);position:sticky;top:0}#tab-mapping-inspector .mismatch{background-color:#ef444433}#tab-mapping-inspector .match{background-color:#10b9811a}.widget--live-array-viewer .widget__body{padding:0;align-items:stretch}.live-array-viewer-container{width:100%;height:100%;overflow-y:auto}.live-array-viewer-container table{width:100%;border-collapse:collapse}.live-array-viewer-container th,.live-array-viewer-container td{padding:6px 12px;border-bottom:1px solid var(--border-color);font-size:.9rem}.live-array-viewer-container th{background-color:var(--bg-card);position:sticky;top:0}.live-array-viewer-container .monospace{font-family:var(--monospace-font)}.grid-stack{position:relative}.grid-stack-rtl{direction:ltr}.grid-stack-rtl>.grid-stack-item{direction:rtl}.grid-stack-placeholder>.placeholder-content{background-color:#0000001a;margin:0;position:absolute;width:auto;z-index:0!important}.grid-stack>.grid-stack-item{position:absolute;padding:0;top:0;left:0;width:var(--gs-column-width);height:var(--gs-cell-height)}.grid-stack>.grid-stack-item>.grid-stack-item-content{margin:0;position:absolute;width:auto;overflow-x:hidden;overflow-y:auto}.grid-stack>.grid-stack-item.size-to-content:not(.size-to-content-max)>.grid-stack-item-content{overflow-y:hidden}.grid-stack>.grid-stack-item>.grid-stack-item-content,.grid-stack>.grid-stack-placeholder>.placeholder-content{top:var(--gs-item-margin-top);right:var(--gs-item-margin-right);bottom:var(--gs-item-margin-bottom);left:var(--gs-item-margin-left)}.grid-stack-item>.ui-resizable-handle{position:absolute;font-size:.1px;display:block;-ms-touch-action:none;touch-action:none}.grid-stack-item.ui-resizable-autohide>.ui-resizable-handle,.grid-stack-item.ui-resizable-disabled>.ui-resizable-handle{display:none}.grid-stack-item>.ui-resizable-ne,.grid-stack-item>.ui-resizable-nw,.grid-stack-item>.ui-resizable-se,.grid-stack-item>.ui-resizable-sw{background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="%23666" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 20 20"><path d="m10 3 2 2H8l2-2v14l-2-2h4l-2 2"/></svg>');background-repeat:no-repeat;background-position:center}.grid-stack-item>.ui-resizable-ne{transform:rotate(45deg)}.grid-stack-item>.ui-resizable-sw{transform:rotate(45deg)}.grid-stack-item>.ui-resizable-nw{transform:rotate(-45deg)}.grid-stack-item>.ui-resizable-se{transform:rotate(-45deg)}.grid-stack-item>.ui-resizable-nw{cursor:nw-resize;width:20px;height:20px;top:var(--gs-item-margin-top);left:var(--gs-item-margin-left)}.grid-stack-item>.ui-resizable-n{cursor:n-resize;height:10px;top:var(--gs-item-margin-top);left:25px;right:25px}.grid-stack-item>.ui-resizable-ne{cursor:ne-resize;width:20px;height:20px;top:var(--gs-item-margin-top);right:var(--gs-item-margin-right)}.grid-stack-item>.ui-resizable-e{cursor:e-resize;width:10px;top:15px;bottom:15px;right:var(--gs-item-margin-right)}.grid-stack-item>.ui-resizable-se{cursor:se-resize;width:20px;height:20px;bottom:var(--gs-item-margin-bottom);right:var(--gs-item-margin-right)}.grid-stack-item>.ui-resizable-s{cursor:s-resize;height:10px;left:25px;bottom:var(--gs-item-margin-bottom);right:25px}.grid-stack-item>.ui-resizable-sw{cursor:sw-resize;width:20px;height:20px;bottom:var(--gs-item-margin-bottom);left:var(--gs-item-margin-left)}.grid-stack-item>.ui-resizable-w{cursor:w-resize;width:10px;top:15px;bottom:15px;left:var(--gs-item-margin-left)}.grid-stack-item.ui-draggable-dragging>.ui-resizable-handle{display:none!important}.grid-stack-item.ui-draggable-dragging{will-change:left,top}.grid-stack-item.ui-resizable-resizing{will-change:width,height}.ui-draggable-dragging,.ui-resizable-resizing{z-index:10000}.ui-draggable-dragging>.grid-stack-item-content,.ui-resizable-resizing>.grid-stack-item-content{box-shadow:1px 4px 6px #0003;opacity:.8}.grid-stack-animate,.grid-stack-animate .grid-stack-item{transition:left .3s,top .3s,height .3s,width .3s}.grid-stack-animate .grid-stack-item.grid-stack-placeholder,.grid-stack-animate .grid-stack-item.ui-draggable-dragging,.grid-stack-animate .grid-stack-item.ui-resizable-resizing{transition:left 0s,top 0s,height 0s,width 0s}.grid-stack>.grid-stack-item[gs-y="0"]{top:0}.grid-stack>.grid-stack-item[gs-x="0"]{left:0}
