:root{--primary: #8b5cf6;--primary-hover: #7c3aed;--primary-glow: rgba(139, 92, 246, .4);--primary-light: rgba(139, 92, 246, .15);--bg-main: #0a0a0a;--bg-sidebar: #111111;--bg-card: #171717;--bg-surface: #262626;--bg-topbar: rgba(10, 10, 10, .7);--btn-secondary-hover: #333333;--table-th-bg: rgba(0, 0, 0, .2);--input-focus-bg: #1a1a1a;--text-main: #f8fafc;--text-muted: #94a3b8;--text-dark: #334155;--border-color: rgba(255, 255, 255, .08);--border-light: rgba(255, 255, 255, .04);--border-active: rgba(139, 92, 246, .5);--shadow-card: 0 4px 20px rgba(0, 0, 0, .3);--shadow-neon: 0 0 15px var(--primary-glow);--success: #10b981;--success-glow: rgba(16, 185, 129, .4);--danger: #ef4444;--danger-glow: rgba(239, 68, 68, .4);--warning: #f59e0b;--warning-glow: rgba(245, 158, 11, .4);--offline: #64748b;--sidebar-collapsed: 72px;--sidebar-expanded: 240px;--header-height: 64px;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px}[data-theme=light]{--bg-main: #f1f5f9;--bg-sidebar: #ffffff;--bg-card: #ffffff;--bg-surface: #e2e8f0;--bg-topbar: rgba(255, 255, 255, .8);--btn-secondary-hover: #cbd5e1;--table-th-bg: #f8fafc;--input-focus-bg: #ffffff;--text-main: #0f172a;--text-muted: #475569;--text-dark: #334155;--border-color: #cbd5e1;--border-light: #e2e8f0;--border-active: rgba(139, 92, 246, .5);--shadow-card: 0 4px 12px rgba(0, 0, 0, .05);--shadow-neon: 0 4px 15px rgba(139, 92, 246, .2)}*{box-sizing:border-box;margin:0;padding:0;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;scrollbar-width:thin;scrollbar-color:var(--bg-surface) var(--bg-main)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-main)}::-webkit-scrollbar-thumb{background:var(--bg-surface);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--primary-light)}body{background-color:var(--bg-main);color:var(--text-main);min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:400;letter-spacing:-.01em}.app-container{display:flex;min-height:100vh}.sidebar{width:var(--sidebar-collapsed);background-color:var(--bg-sidebar);border-right:1px solid var(--border-color);display:flex;flex-direction:column;flex-shrink:0;-webkit-user-select:none;user-select:none;height:100vh;position:sticky;top:0;z-index:50;transition:width .3s cubic-bezier(.2,.8,.2,1);overflow:hidden}.sidebar:hover{width:var(--sidebar-expanded);box-shadow:10px 0 30px #00000080}.sidebar-logo{height:var(--header-height);padding:0 16px;display:flex;align-items:center;gap:16px;border-bottom:1px solid var(--border-light);min-width:var(--sidebar-expanded)}.logo-icon{width:40px;height:40px;background:linear-gradient(135deg,var(--primary),#d946ef);border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:20px;box-shadow:var(--shadow-neon);flex-shrink:0}.logo-text-group{display:flex;flex-direction:column;opacity:0;transform:translate(-10px);transition:all .3s ease;white-space:nowrap}.sidebar:hover .logo-text-group{opacity:1;transform:translate(0)}.logo-title{font-size:18px;font-weight:700;color:var(--text-main);letter-spacing:-.5px}.logo-sub{font-size:10px;text-transform:uppercase;color:var(--primary);font-weight:600;letter-spacing:1px}.sidebar-nav{padding:16px 0;display:flex;flex-direction:column;gap:4px;flex:1;overflow-y:auto;overflow-x:hidden}.nav-section{display:flex;flex-direction:column;margin-bottom:8px}.nav-divider{height:1px;background-color:var(--border-light);margin:12px 16px}.nav-item{display:flex;align-items:center;gap:16px;padding:12px 16px;color:var(--text-muted);text-decoration:none;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;position:relative;min-width:var(--sidebar-expanded)}.nav-item:hover{background-color:var(--primary-light);color:var(--text-main)}.nav-item.active{color:var(--text-main);background-color:var(--primary-light)}.nav-item.active .nav-icon{color:var(--primary);filter:drop-shadow(0 0 5px var(--primary-glow))}.nav-item.active:before{content:"";position:absolute;left:0;top:10%;bottom:10%;width:4px;background-color:var(--primary);border-radius:0 4px 4px 0;box-shadow:var(--shadow-neon)}.nav-icon{font-size:20px;width:40px;display:flex;align-items:center;justify-content:center;color:var(--text-muted);flex-shrink:0;transition:all .2s}.main-wrapper{flex:1;display:flex;flex-direction:column;min-width:0}.topbar{height:var(--header-height);background:var(--bg-topbar);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--border-color);padding:0 32px;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:20}.topbar-title{font-size:18px;font-weight:600;color:var(--text-main)}.topbar-right{display:flex;align-items:center;gap:16px}.live-clock{font-size:13px;color:var(--text-muted);font-variant-numeric:tabular-nums;background-color:var(--bg-card);border:1px solid var(--border-color);padding:6px 12px;border-radius:var(--radius-sm)}.btn-primary{background-color:var(--primary);color:#fff;border:1px solid rgba(255,255,255,.1);padding:8px 16px;border-radius:var(--radius-md);font-size:13.5px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:8px;transition:all .2s ease;box-shadow:0 4px 15px #8b5cf64d}.btn-primary:hover{background-color:var(--primary-hover);transform:translateY(-2px);box-shadow:0 6px 20px #8b5cf666}.btn-secondary{background-color:var(--bg-surface);color:var(--text-main);border:1px solid var(--border-color);padding:8px 16px;border-radius:var(--radius-md);font-size:13.5px;font-weight:500;cursor:pointer;transition:all .2s}.btn-secondary:hover{background-color:var(--btn-secondary-hover);border-color:var(--primary)}.page-content{padding:32px;display:flex;flex-direction:column;gap:24px}.status-cards-row{display:flex;gap:20px;flex-wrap:wrap}.status-card{flex:1;min-width:180px;background-color:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:20px;display:flex;align-items:center;justify-content:space-between;box-shadow:var(--shadow-card);cursor:pointer;transition:all .2s ease;position:relative;overflow:hidden}.status-card:after{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:transparent;transition:background .3s}.status-card:hover{transform:translateY(-2px);border-color:#ffffff26}.status-card.selected{background-color:#8b5cf60d;border-color:var(--primary);box-shadow:0 0 20px #8b5cf61a}.status-card.selected:after{background:var(--primary)}.status-label-group{display:flex;flex-direction:column;gap:4px}.status-card-label{font-size:12px;font-weight:600;color:var(--text-muted);letter-spacing:.5px;text-transform:uppercase}.status-card-count{font-size:28px;font-weight:700;color:var(--text-main);line-height:1}.status-icon-box{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:20px;box-shadow:inset 0 2px 5px #ffffff1a}.status-icon-box.ativada{background-color:#8b5cf633;color:var(--primary);border:1px solid rgba(139,92,246,.3)}.status-icon-box.desativada{background-color:#64748b1a;color:var(--text-muted);border:1px solid rgba(100,116,139,.2)}.status-icon-box.online{background-color:#10b98126;color:var(--success);border:1px solid rgba(16,185,129,.3);box-shadow:0 0 15px #10b98133}.status-icon-box.offline{background-color:#ef444426;color:var(--danger);border:1px solid rgba(239,68,68,.3);box-shadow:0 0 15px #ef444433}.metrics-card{background-color:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-card)}.metrics-table{width:100%;border-collapse:collapse;text-align:left}.metrics-table th{padding:16px 20px;font-size:13px;font-weight:600;color:var(--text-muted);background-color:#0003;border-bottom:1px solid var(--border-color)}.metrics-table td{padding:16px 20px;font-size:14px;color:var(--text-main);border-bottom:1px solid var(--border-light);vertical-align:middle}.pill-badge{display:inline-flex;align-items:center;justify-content:center;padding:4px 12px;border-radius:20px;font-size:12px;font-weight:600;background-color:var(--bg-surface);border:1px solid var(--border-color);color:var(--text-main)}.pill-badge.teal{background-color:#0d948826;color:#2dd4bf;border-color:#0d94884d}.pill-badge.excellent{background-color:#10b98126;color:var(--success);border-color:#10b9814d}.network-stat{display:inline-flex;align-items:center;gap:8px;font-family:JetBrains Mono,monospace;font-size:13px}.arrow-down{color:var(--primary)}.arrow-up{color:var(--success)}.table-container-card{background-color:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-card)}.table-toolbar{padding:20px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--border-color);background-color:transparent}.search-input-wrapper{position:relative;flex:1;max-width:400px}.search-input-wrapper input{width:100%;padding:10px 16px 10px 40px;background-color:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-main);font-size:14px;outline:none;transition:all .2s}.search-input-wrapper input:focus{border-color:var(--primary);background-color:var(--input-focus-bg);box-shadow:0 0 0 2px #8b5cf633}.search-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--text-muted);font-size:16px}.cameras-table{width:100%;border-collapse:collapse}.cameras-table th{padding:14px 20px;font-size:12px;font-weight:600;text-transform:uppercase;color:var(--text-muted);background-color:var(--table-th-bg);border-bottom:1px solid var(--border-color);letter-spacing:.5px}.cameras-table td{padding:16px 20px;font-size:14px;color:var(--text-main);border-bottom:1px solid var(--border-light);vertical-align:middle}.cameras-table tbody tr:hover{background-color:#ffffff05}.cam-name-cell{display:flex;align-items:center;gap:12px;font-weight:500}.status-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}.status-dot.online{background-color:var(--success);box-shadow:0 0 10px var(--success-glow)}.status-dot.offline{background-color:var(--danger);box-shadow:0 0 10px var(--danger-glow)}.storage-pill,.sla-pill,.cam-type-badge{background-color:var(--bg-surface);color:var(--text-muted);border:1px solid var(--border-light);font-size:12px;padding:4px 12px;border-radius:20px;display:inline-block}.row-actions-group{display:flex;align-items:center;gap:8px}.btn-icon-action{width:34px;height:34px;border-radius:8px;background-color:transparent;border:1px solid transparent;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text-muted);transition:all .2s}.btn-icon-action:hover{background-color:var(--bg-surface);border-color:var(--border-color);color:var(--text-main)}.btn-icon-action.delete:hover{color:var(--danger);background-color:#ef44441a;border-color:#ef44444d}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:#000c;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.wizard-modal,.token-modal{background-color:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);width:100%;max-width:800px;max-height:calc(100vh - 40px);box-shadow:0 20px 50px #00000080;display:flex;flex-direction:column;overflow:hidden}.wizard-header{padding:24px 32px;border-bottom:1px solid var(--border-color);background:#0003}.wizard-main-title{font-size:20px;color:var(--text-main);font-weight:600}.wizard-sub-title{color:var(--text-muted);font-size:14px}.wizard-steps-bar{padding:16px 32px;background-color:var(--bg-surface);display:flex;gap:12px;border-bottom:1px solid var(--border-color)}.step-pill{background-color:#0000004d;color:var(--text-muted);border:1px solid var(--border-light);padding:6px 16px;border-radius:20px;font-size:13px}.step-pill.active{background-color:var(--primary-light);color:var(--primary);border-color:var(--primary)}.step-pill.completed{color:var(--success)}.wizard-body{padding:32px;overflow-y:auto;flex:1;min-height:0}.form-label{color:var(--text-muted);font-size:13px;font-weight:500;margin-bottom:8px;display:block}.form-control{width:100%;padding:12px 16px;background-color:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-main);font-size:14px}.form-control:focus{border-color:var(--primary);outline:none;box-shadow:0 0 0 2px #8b5cf633}.conn-type-card{border:2px solid var(--border-color);background-color:var(--bg-surface);border-radius:var(--radius-md);padding:16px;color:var(--text-muted);cursor:pointer}.conn-type-card.selected{border-color:var(--primary);background-color:var(--primary-light);color:var(--text-main);box-shadow:inset 0 0 10px #8b5cf61a}.wizard-footer{padding:16px 32px;border-top:1px solid var(--border-color);display:flex;justify-content:flex-end;gap:12px;background:#0003;flex-shrink:0}.empty-state{text-align:center;padding:60px 20px;color:var(--text-muted)}.empty-icon{font-size:48px;margin-bottom:16px;opacity:.5}.dvr-player-container{background-color:#000;border-radius:var(--radius-md);overflow:hidden;border:1px solid var(--border-color)}.mosaic-grid{display:grid;gap:4px;background-color:var(--bg-card);padding:4px}.mosaic-cell{background-color:#000;aspect-ratio:16/9;position:relative;border:1px solid var(--border-color);border-radius:4px;overflow:hidden}.my-cameras-view{height:calc(100vh - var(--header-height) - 32px);overflow:hidden}.mycam-layout{display:flex;height:100%;gap:0;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--border-color);background-color:var(--bg-card)}.mycam-main{flex:1;display:flex;flex-direction:column;overflow:hidden}.mycam-player-wrapper{display:flex;flex-direction:column;height:100%}.mycam-player{flex:1;position:relative;background:#000;min-height:300px}.mycam-player-content{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.mycam-player-content iframe{width:100%;height:100%}.mycam-player-loading{text-align:center;color:#94a3b8}.mycam-player-overlay{position:absolute;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:linear-gradient(transparent,#000c);z-index:5}.mycam-player-overlay-left,.mycam-player-overlay-right{display:flex;align-items:center;gap:8px}.mycam-ctrl-btn{background:#ffffff1a;border:1px solid rgba(255,255,255,.15);color:#fff;width:36px;height:36px;border-radius:8px;font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s}.mycam-ctrl-btn:hover{background:#fff3;border-color:#ffffff4d}.mycam-live-pill{background:#dc2626;color:#fff;font-size:12px;font-weight:700;padding:4px 12px;border-radius:20px;letter-spacing:.5px}.mycam-info-bar{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;border-top:1px solid var(--border-color);background-color:var(--bg-card)}.mycam-info-title h2{font-size:15px;font-weight:700;color:var(--text-main);margin:0}.mycam-info-group{font-size:11px;color:var(--text-muted)}.mycam-info-details{display:flex;gap:6px}.mycam-info-chip{font-size:11px;font-weight:600;padding:3px 10px;border-radius:12px;background-color:var(--bg-surface);color:var(--text-muted);border:1px solid var(--border-color)}.mycam-info-chip.online{color:var(--success);background-color:#10b9811a;border-color:#10b9814d}.mycam-info-chip.offline{color:var(--danger);background-color:#ef44441a;border-color:#ef44444d}.mycam-timeline-bar{display:flex;align-items:center;justify-content:space-between;padding:8px 20px;border-top:1px solid var(--border-color);background-color:var(--bg-card)}.mycam-timeline-ranges{display:flex;gap:4px}.mycam-range-btn{background:transparent;border:1px solid var(--border-color);color:var(--text-muted);font-size:11px;padding:4px 12px;border-radius:16px;cursor:pointer;transition:all .15s}.mycam-range-btn:hover{border-color:var(--primary);color:var(--text-main)}.mycam-range-btn.active{background:var(--primary);border-color:var(--primary);color:#fff;font-weight:600}.mycam-timeline-date{display:flex;align-items:center;gap:12px;font-size:12px;color:var(--text-muted)}.mycam-timeline-clock{background:#dc2626;color:#fff;font-weight:700;font-family:JetBrains Mono,monospace;font-size:12px;padding:3px 10px;border-radius:12px}.mycam-timeline-ruler{padding:8px 20px 12px;border-top:1px solid var(--border-color);background-color:var(--bg-card)}.mycam-timeline-track{height:8px;background:var(--bg-surface);border-radius:4px;position:relative;overflow:hidden}.mycam-timeline-filled{height:100%;background:linear-gradient(90deg,var(--primary),#06b6d4);border-radius:4px}.mycam-timeline-cursor{position:absolute;top:-3px;width:3px;height:14px;background:#dc2626;border-radius:2px;transform:translate(-1px)}.mycam-timeline-labels{display:flex;justify-content:space-between;margin-top:4px;font-size:9px;font-family:JetBrains Mono,monospace;color:var(--text-muted)}.mycam-sidebar{width:280px;min-width:280px;border-left:1px solid var(--border-color);display:flex;flex-direction:column;background-color:var(--bg-card);overflow:hidden}.mycam-sidebar-header{padding:16px;border-bottom:1px solid var(--border-color)}.mycam-sidebar-count{font-size:14px;font-weight:700;color:var(--text-main)}.mycam-search-wrapper{padding:8px 12px;border-bottom:1px solid var(--border-color)}.mycam-search-input{width:100%;padding:8px 12px;background:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-main);font-size:13px;outline:none;transition:border-color .2s}.mycam-search-input:focus{border-color:var(--primary)}.mycam-search-input::placeholder{color:var(--text-muted)}.mycam-list{flex:1;overflow-y:auto;padding:4px 0}.mycam-list-item{display:flex;align-items:center;gap:10px;padding:10px 14px;cursor:pointer;transition:all .15s;border-left:3px solid transparent}.mycam-list-item:hover{background-color:var(--bg-surface)}.mycam-list-item.selected{background-color:var(--primary-light);border-left-color:var(--primary)}.mycam-thumb{position:relative;width:56px;height:36px;flex-shrink:0}.mycam-thumb-inner{width:100%;height:100%;border-radius:6px;background:var(--bg-surface);display:flex;align-items:center;justify-content:center;border:1px solid var(--border-color)}.mycam-thumb-inner.online{border-color:#10b9814d}.mycam-thumb-icon{font-size:18px;opacity:.5}.mycam-thumb-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#0009;color:#fff;font-size:10px;width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center}.mycam-list-info{display:flex;flex-direction:column;gap:2px;overflow:hidden}.mycam-list-name{font-size:12px;font-weight:600;color:var(--text-main);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mycam-list-meta{font-size:11px;color:var(--text-muted);display:flex;align-items:center;gap:4px}.mycam-status-dot{width:6px;height:6px;border-radius:50%;display:inline-block}.mycam-status-dot.online{background:var(--success);box-shadow:0 0 4px var(--success)}.mycam-status-dot.offline{background:#64748b}.mycam-list-empty{padding:40px 20px;text-align:center;color:var(--text-muted);font-size:13px}.mycam-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;text-align:center;color:var(--text-muted);padding:40px}.mycam-empty h3{font-size:18px;color:var(--text-main);margin:0 0 8px}.mycam-empty p{font-size:13px;line-height:1.6}.cam-settings-output-row{margin-bottom:14px}.cam-settings-output-label{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:500;color:var(--text-main);margin-bottom:6px}.cam-settings-output-badge{font-size:10px;font-weight:700;padding:2px 8px;border-radius:4px;text-transform:uppercase;letter-spacing:.5px}.cam-settings-output-badge.webrtc{background:#06b6d426;color:#06b6d4;border:1px solid rgba(6,182,212,.3)}.cam-settings-output-badge.rtsp{background:#8b5cf626;color:#8b5cf6;border:1px solid rgba(139,92,246,.3)}.cam-settings-output-badge.rtmp{background:#f59e0b26;color:#f59e0b;border:1px solid rgba(245,158,11,.3)}.cam-settings-output-url-row{display:flex;gap:6px}.cam-settings-url-input{flex:1;font-family:JetBrains Mono,monospace;font-size:12px!important;padding:8px 12px!important;cursor:text;-webkit-user-select:all;user-select:all}.cam-settings-copy-btn{padding:0 12px!important;min-width:40px;font-size:16px!important}.toggle-switch{position:relative;display:inline-block;width:48px;height:26px;flex-shrink:0}.toggle-switch input{opacity:0;width:0;height:0}.toggle-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#475569;border-radius:26px;transition:all .3s}.toggle-slider:before{content:"";position:absolute;height:20px;width:20px;left:3px;bottom:3px;background-color:#fff;border-radius:50%;transition:all .3s;box-shadow:0 1px 3px #0000004d}.toggle-switch input:checked+.toggle-slider{background-color:#10b981}.toggle-switch input:checked+.toggle-slider:before{transform:translate(22px)}.plan-cards-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:20px}.plan-selection-card{display:flex;align-items:center;gap:12px;padding:16px;border:2px solid var(--border-color);border-radius:var(--radius-lg);background-color:var(--bg-surface);cursor:pointer;transition:all .2s;position:relative}.plan-selection-card:hover{border-color:var(--primary);background-color:var(--primary-light)}.plan-selection-card.selected{border-color:var(--primary);background-color:var(--primary-light);box-shadow:0 0 0 1px var(--primary),0 4px 12px var(--primary-glow)}.plan-card-icon{font-size:28px;width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--bg-card);border-radius:var(--radius-md);flex-shrink:0}.plan-card-content{flex:1}.plan-card-title{font-size:14px;font-weight:700;color:var(--text-main);margin-bottom:2px}.plan-card-desc{font-size:11px;color:var(--text-muted);line-height:1.4}.plan-card-check{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:#fff;flex-shrink:0}.plan-selection-card.selected .plan-card-check{background:var(--primary)}.retention-days-card{background-color:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:16px 20px;margin-bottom:16px}.retention-label{font-size:11px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.retention-input-row{display:flex;align-items:center;gap:8px;margin-top:8px}.retention-number-input{width:80px;padding:8px 12px;background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-main);font-size:16px;font-weight:700;text-align:center;outline:none}.retention-number-input:focus{border-color:var(--primary)}.retention-unit{font-size:14px;color:var(--text-muted)}.retention-subtext{font-size:11px;color:var(--text-muted);margin-top:6px;display:block}.consumption-forecast{padding:12px 16px;background-color:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:13px;color:var(--text-muted)}.consumption-forecast strong{color:var(--primary);font-size:15px}.dual-listbox-section{margin-top:20px}.dual-lb-panel{border:1px solid var(--border-color);border-radius:var(--radius-md);background-color:var(--bg-card);overflow:hidden}.dual-lb-panel.selected{border-color:#10b9814d}.dual-lb-header{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background-color:var(--bg-surface);border-bottom:1px solid var(--border-color);gap:8px}.dual-lb-panel.selected .dual-lb-header{background-color:#10b98114}.dual-lb-title{font-size:12px;font-weight:700;color:var(--text-muted);white-space:nowrap}.dual-lb-search{flex:1;max-width:200px;padding:4px 10px;border:1px solid var(--border-color);border-radius:var(--radius-sm);background:var(--bg-card);color:var(--text-main);font-size:12px;outline:none}.dual-lb-search:focus{border-color:var(--primary)}.dual-lb-search::placeholder{color:var(--text-muted)}.dual-lb-list{max-height:140px;min-height:60px;overflow-y:auto;padding:4px}.dual-lb-item{display:flex;align-items:center;padding:6px 10px;font-size:13px;color:var(--text-main);border-radius:var(--radius-sm);cursor:pointer;transition:all .12s;-webkit-user-select:none;user-select:none}.dual-lb-item:hover{background-color:var(--bg-surface)}.dual-lb-item.active{background-color:var(--primary-light);border-left:3px solid var(--primary);font-weight:600}.dual-lb-empty{padding:20px;text-align:center;color:var(--text-muted);font-size:12px}.dual-lb-arrows{display:flex;align-items:center;justify-content:center;gap:8px;padding:8px 0}.dual-lb-arrow-btn{width:36px;height:30px;display:flex;align-items:center;justify-content:center;border:1px solid var(--border-color);border-radius:var(--radius-sm);background-color:var(--bg-surface);color:var(--text-muted);font-size:12px;cursor:pointer;transition:all .15s}.dual-lb-arrow-btn:hover{border-color:var(--primary);color:var(--primary);background-color:var(--primary-light)}.dual-lb-arrow-btn.primary{background-color:var(--primary);color:#fff;border-color:var(--primary)}.dual-lb-arrow-btn.primary:hover{background-color:var(--primary-hover)}