*,*:before,*:after{box-sizing:border-box}.js-plotly-plot,.js-plotly-plot *,.plotly,.plotly *,.plot-container,.plot-container *,.svg-container,.svg-container *{box-sizing:content-box!important;line-height:normal!important}.js-plotly-plot text,.js-plotly-plot tspan,.plotly text,.plotly tspan{font-family:Open Sans,verdana,arial,sans-serif!important}.js-plotly-plot .main-svg,.js-plotly-plot .gl-container{position:absolute!important;top:0!important;left:0!important}.modebar-btn,.modebar-btn *{box-sizing:content-box!important;padding:0!important;border:none!important;border-radius:0!important;font-size:inherit!important;font-weight:inherit!important}body{font-family:system-ui,-apple-system,sans-serif;margin:0;padding:0;background:#f5f5f5;color:#333;line-height:1.5}.modal-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000}.modal-overlay.hidden{display:none}.modal-box{background:#fff;border-radius:0;padding:12px;max-width:400px;width:90%;border:1px solid #ccc}.modal-box h2{margin:0 0 8px;font-size:20px}.modal-box .hint{color:#666;font-size:13px;margin-bottom:12px}.modal-box input{width:100%;padding:8px;border:1px solid #ddd;border-radius:0;font-size:14px;margin-bottom:12px}.modal-box input:focus{outline:none;border-color:#007bff}.tab-nav{background:#fff;border-bottom:1px solid #e0e0e0;padding:0 10px;display:flex;gap:2px;position:sticky;top:0;z-index:100}.tab-btn{padding:10px 14px;border:none;background:none;font-size:13px;font-weight:500;color:#666;cursor:pointer;border-bottom:3px solid transparent;border-radius:0;margin-bottom:-1px}.tab-btn:hover{color:#333}.tab-btn.active{color:#007bff;border-bottom:3px solid #007bff}.logout-btn{margin-left:auto;padding:10px 14px;border:none;background:none;color:#dc3545;font-size:13px;font-weight:500;border-bottom:3px solid transparent;border-radius:0;cursor:pointer}.logout-btn:hover{background:#dc3545;color:#fff}.tab-content{display:none;padding:12px}.tab-content.active{display:block}.container{max-width:1200px;margin:0 auto}h1{margin:0 0 5px}.subtitle{color:#666;margin-bottom:12px;font-size:14px}.card{background:#fff;border-radius:4px;padding:12px;margin-bottom:12px;border:1px solid #e0e0e0}.card h3{margin:0 0 10px;font-size:14px;font-weight:600}.form-grid{display:grid;grid-template-columns:120px 1fr;gap:8px;align-items:center}.form-grid label{font-size:12px;color:#666}.form-grid input,.form-grid select{padding:6px 8px;border:1px solid #ddd;border-radius:0;font-size:13px}.form-grid input:focus,.form-grid select:focus{outline:none;border-color:#007bff}.btn-row{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap;align-items:center}button:not(.modebar-btn):not([data-title]){padding:6px 12px;border:none;border-radius:0;cursor:pointer;font-size:12px;font-weight:500}button:not(.modebar-btn):not([data-title]):disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:#007bff;color:#fff}.btn-primary:hover:not(:disabled){background:#0056b3}.btn-secondary{background:#e9ecef;color:#333}.btn-secondary:hover:not(:disabled){background:#dee2e6}.btn-success{background:#28a745;color:#fff}.btn-success:hover:not(:disabled){background:#1e7e34}.btn-danger{background:#dc3545;color:#fff}.btn-danger:hover:not(:disabled){background:#c82333}.help{font-size:11px;color:#999;margin-top:4px}.checkbox-label{display:flex;align-items:center;gap:4px;font-size:12px;color:#666;cursor:pointer}.checkbox-label input{margin:0;cursor:pointer}.main-grid{display:grid;grid-template-columns:260px 1fr;gap:12px}@media(max-width:800px){.main-grid{grid-template-columns:1fr}}.sidebar{background:#fff;border-radius:0;border:1px solid #e0e0e0;overflow:hidden;display:flex;flex-direction:column;max-height:calc(100vh - 200px)}.sidebar-header{padding:10px 12px;background:#f8f9fa;border-bottom:1px solid #eee;font-weight:600;font-size:13px}.sidebar-search{padding:8px 12px;border-bottom:1px solid #eee}.sidebar-search input{width:100%;padding:6px 10px;border:1px solid #ddd;border-radius:0;font-size:12px}.device-list{flex:1;overflow-y:auto;min-height:0}.device-group{border-bottom:1px solid #eee}.device-group:last-child{border-bottom:none}.device-name{padding:8px 12px;font-weight:500;font-size:13px;background:#fafafa;cursor:pointer;display:flex;justify-content:space-between;align-items:center}.device-name:hover{background:#f0f0f0}.date-list{display:none;padding:0;background:#fff;max-height:200px;overflow-y:auto}.date-list.open{display:block}.date-item{padding:6px 12px 6px 24px;font-size:12px;color:#555;cursor:pointer;border-top:1px solid #f0f0f0}.date-item:hover{background:#f8f9fa}.date-item.selected{background:#e7f1ff;color:#007bff;font-weight:500}.chart-area{background:#fff;border-radius:0;border:1px solid #e0e0e0;padding:12px}.chart-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;flex-wrap:wrap;gap:8px}.chart-title{font-size:16px;font-weight:600}.chart-title span{color:#666;font-weight:400;font-size:13px}.stats-row{display:flex;gap:16px;margin-top:12px;flex-wrap:wrap}.stat{background:#f8f9fa;padding:6px 10px;border-radius:0;font-size:12px}.stat-label{color:#666}.stat-value{font-weight:600;margin-left:4px}.download-section{background:#fff;border-radius:0;border:1px solid #e0e0e0;padding:12px;margin-top:12px}.download-buttons{display:flex;gap:6px;flex-wrap:wrap}.download-buttons button{padding:6px 10px;border:1px solid #ddd;border-radius:0;background:#fff;cursor:pointer;font-size:12px}.download-buttons button:hover{background:#f8f9fa}.empty-state{text-align:center;padding:40px 16px;color:#999}.empty-state h3{margin:0 0 8px;color:#666}.output{margin-top:12px;background:#1e1e1e;color:#d4d4d4;padding:10px;border-radius:0;font-family:Consolas,monospace;font-size:11px;max-height:200px;overflow:auto;white-space:pre-wrap;word-break:break-all;display:none}.output.show{display:block}.output .info{color:#6a9955}.output .error{color:#f48771}.output .url{color:#ce9178}.keys-table{width:100%;border-collapse:collapse;font-size:13px}.keys-table th,.keys-table td{padding:10px 12px;text-align:left;border-bottom:1px solid #eee}.keys-table th{background:#f8f9fa;font-weight:600;font-size:12px;color:#666}.keys-table tr:hover td{background:#f8f9fa}.key-value{font-family:monospace;font-size:12px}.key-masked{color:#999}.key-actions{display:flex;gap:6px}.key-actions button{padding:4px 10px;font-size:11px}.perm-badge{font-size:11px;padding:2px 8px;border-radius:0;font-weight:500}.perm-badge.upload{background:#fff3e0;color:#e65100}.perm-badge.query{background:#e3f2fd;color:#1565c0}.method{font-size:11px;padding:2px 6px;border-radius:0;font-weight:600}.method.get{background:#e7f5e7;color:#1b7a1b}.method.post{background:#fff3e0;color:#e65100}.method.put{background:#e3f2fd;color:#1565c0}.method.delete{background:#ffebee;color:#c62828}.view-results{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:12px}.view-result-card{background:#f8f9fa;padding:12px;border-radius:0;text-align:center}.view-result-card .label{font-size:11px;color:#666;margin-bottom:4px}.view-result-card .value{font-size:28px;font-weight:600;color:#333}.view-result-card .unit{font-size:12px;color:#999;font-weight:400}.view-result-card.highlight{background:#e7f1ff;border:1px solid #007bff}.view-result-card.highlight .value{color:#007bff}@media(max-width:640px){.tab-nav{padding:0 8px;overflow-x:auto;-webkit-overflow-scrolling:touch}.tab-btn{padding:12px;font-size:12px;white-space:nowrap;flex-shrink:0}.main-grid{gap:12px}.sidebar{max-height:250px}.card{padding:10px;margin-bottom:10px}.keys-table{font-size:12px;min-width:500px}}