*{box-sizing:border-box;margin:0;padding:0}body{color:#1e293b;background:#f8fafc;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.app{max-width:1400px;margin:0 auto;padding:24px}.app-header{margin-bottom:24px}.app-header h1{font-size:24px;font-weight:700}.app-header p{color:#64748b;font-size:14px}.app-layout{gap:24px;display:flex}.sidebar{flex-direction:column;flex-shrink:0;gap:20px;width:320px;display:flex}.sidebar section{background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:16px}.sidebar h2{margin-bottom:12px;font-size:16px;font-weight:600}.main-content{background:#fff;border:1px solid #e2e8f0;border-radius:8px;flex:1;min-width:0;padding:20px}.search-bar{margin-bottom:12px;position:relative}.search-bar input{border:1px solid #d1d5db;border-radius:6px;outline:none;width:100%;padding:8px 12px;font-size:14px}.search-bar input:focus{border-color:#2563eb;box-shadow:0 0 0 2px #2563eb26}.search-spinner{color:#94a3b8;font-size:12px;position:absolute;top:10px;right:10px}.search-results{z-index:10;background:#fff;border:1px solid #d1d5db;border-radius:6px;max-height:300px;list-style:none;position:absolute;top:100%;left:0;right:0;overflow-y:auto;box-shadow:0 4px 12px #0000001a}.search-results li{cursor:pointer;border-bottom:1px solid #f1f5f9;flex-direction:column;gap:2px;padding:8px 12px;display:flex}.search-results li:hover{background:#f1f5f9}.search-results li strong{font-size:13px}.search-desc{color:#64748b;white-space:nowrap;text-overflow:ellipsis;font-size:12px;overflow:hidden}.package-list{flex-direction:column;gap:6px;list-style:none;display:flex}.package-list li{align-items:center;gap:8px;padding:6px 0;font-size:13px;display:flex}.pkg-name{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.color-dot{box-sizing:border-box;border:2px solid #0000;border-radius:50%;flex-shrink:0;width:10px;height:10px}.visibility-toggle{cursor:pointer;background:0 0;border:none;align-items:center;padding:0;display:flex}.dimmed{opacity:.4}.btn-remove{color:#94a3b8;cursor:pointer;background:0 0;border:none;padding:0 4px;font-size:18px;line-height:1}.btn-remove:hover{color:#ef4444}.empty-hint{color:#94a3b8;font-size:13px}.date-range-picker{align-items:center;gap:6px;display:flex}.date-range-picker input{border:1px solid #d1d5db;border-radius:6px;padding:4px 8px;font-size:13px}.date-range-sep{color:#94a3b8}.group-editor h3{margin-bottom:10px;font-size:15px;font-weight:600}.group-create{gap:8px;margin-bottom:12px;display:flex}.group-create input{border:1px solid #d1d5db;border-radius:6px;flex:1;padding:6px 10px;font-size:13px}.btn-primary{color:#fff;cursor:pointer;white-space:nowrap;background:#2563eb;border:none;border-radius:6px;padding:6px 14px;font-size:13px}.btn-primary:hover{background:#1d4ed8}.group-card{border:1px solid #e2e8f0;border-radius:6px;margin-bottom:8px;padding:10px}.group-header{align-items:center;gap:8px;margin-bottom:8px;display:flex}.group-header strong{flex:1;font-size:14px}.group-name-editable{cursor:pointer;border-bottom:1px dashed #0000}.group-name-editable:hover{border-bottom-color:#94a3b8}.group-rename-input{border:1px solid #2563eb;border-radius:4px;outline:none;flex:1;padding:0 4px;font-size:14px;font-weight:600}.group-pkg-list{flex-direction:column;gap:2px;margin-bottom:8px;list-style:none;display:flex}.group-pkg-list li{align-items:center;gap:6px;padding:3px 0;font-size:12px;display:flex}.group-pkg-list .pkg-name{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.group-pkg-list .btn-remove{font-size:14px}.chart-container{width:100%}.chart-controls{flex-wrap:wrap;gap:16px;margin-bottom:16px;display:flex}.toggle-group{align-items:center;gap:4px;display:flex}.toggle-label{color:#64748b;margin-right:4px;font-size:13px}.toggle-group button{cursor:pointer;color:#475569;background:#fff;border:1px solid #d1d5db;padding:4px 12px;font-size:13px}.toggle-group button:first-of-type{border-radius:6px 0 0 6px}.toggle-group button:last-child{border-radius:0 6px 6px 0}.toggle-group button.active{color:#fff;background:#2563eb;border-color:#2563eb}.btn-copy{cursor:pointer;color:#475569;background:#fff;border:1px solid #d1d5db;border-radius:6px;margin-left:auto;padding:4px 12px;font-size:13px}.btn-copy:hover{background:#f1f5f9}.chart-loading{text-align:center;color:#94a3b8;padding:40px;font-size:14px}.toast-error{z-index:1000;color:#fff;cursor:pointer;background:#ef4444;border-radius:8px;padding:12px 20px;font-size:14px;animation:.2s ease-out toast-in;position:fixed;top:20px;right:20px;box-shadow:0 4px 12px #00000026}@keyframes toast-in{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}