:root{--bg: #0a0a0f;--bg2: #12121a;--bg3: #1a1a25;--border: #2a2a3a;--text: #e0e0e8;--text2: #8888a0;--accent: #6366f1;--accent2: #818cf8;--green: #34d399;--red: #f87171;--yellow: #fbbf24;--blue: #60a5fa}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,Segoe UI,system-ui,sans-serif;background:var(--bg);color:var(--text);height:100vh;overflow:hidden}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--bg3);border-radius:2px}#app{display:flex;height:100vh}#sidebar{width:180px;background:var(--bg2);border-right:1px solid var(--border);display:flex;flex-direction:column;flex-shrink:0}.nav-header{padding:16px;border-bottom:1px solid var(--border)}.nav-title{font-size:16px;font-weight:700;color:var(--accent2);display:block}.nav-sub{font-size:10px;color:var(--text2)}.nav-tabs{display:flex;flex-direction:column;padding:8px 0}.nav-tab{display:block;padding:10px 16px;color:var(--text2);text-decoration:none;font-size:13px;cursor:pointer;transition:all .15s;border-left:2px solid transparent}.nav-tab:hover{color:var(--text);background:var(--bg3)}.nav-tab.active{color:var(--text);background:var(--bg3);border-left-color:var(--accent)}#main{flex:1;overflow:hidden;position:relative}.view{display:none;height:100%;overflow:hidden}.view.active{display:flex}.split-list{width:320px;border-right:1px solid var(--border);display:flex;flex-direction:column;flex-shrink:0;background:var(--bg)}.split-detail{flex:1;overflow-y:auto;padding:24px;background:var(--bg)}.list-header{padding:12px 16px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:8px}.list-header h2{font-size:14px;font-weight:600;flex:1}.list-header .count{font-size:11px;color:var(--text2)}.list-actions{padding:8px 12px;border-bottom:1px solid var(--border);display:flex;gap:6px}.btn-sm{background:var(--bg3);border:1px solid var(--border);color:var(--text2);padding:4px 10px;border-radius:4px;font-size:11px;cursor:pointer;transition:all .15s}.btn-sm:hover{border-color:var(--accent);color:var(--text)}.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent2)}.btn-danger{color:var(--red)}.btn-danger:hover{border-color:var(--red);background:#f871711a}.list-scroll{flex:1;overflow-y:auto}.list-item{display:flex;align-items:center;gap:10px;padding:10px 16px;cursor:pointer;transition:all .1s;border-left:2px solid transparent}.list-item:hover{background:var(--bg3)}.list-item.selected{background:#6366f114;border-left-color:var(--accent)}.list-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.list-info{flex:1;min-width:0}.list-name{font-size:12px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.list-meta{font-size:10px;color:var(--text2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.detail-empty{display:flex;align-items:center;justify-content:center;height:100%;color:var(--text2);font-size:13px}.detail-header{margin-bottom:20px;display:flex;align-items:center;gap:10px}.detail-header h2{font-size:18px;font-weight:600;flex:1}.form-group{margin-bottom:16px}.form-group label{display:block;font-size:10px;color:var(--text2);text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}.form-input{width:100%;background:var(--bg2);border:1px solid var(--border);color:var(--text);padding:8px 10px;border-radius:5px;font-size:13px;font-family:inherit}.form-input:focus{outline:none;border-color:var(--accent)}.form-input::placeholder{color:var(--text2)}textarea.form-input{min-height:120px;resize:vertical;line-height:1.5}select.form-input{cursor:pointer}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-actions{display:flex;gap:8px;margin-top:20px;padding-top:16px;border-top:1px solid var(--border)}.form-actions .btn-sm{padding:6px 16px;font-size:12px}.toggle-wrap{display:flex;align-items:center;gap:8px}.toggle{width:36px;height:20px;background:var(--bg3);border:1px solid var(--border);border-radius:10px;cursor:pointer;position:relative;transition:all .2s}.toggle.on{background:var(--accent);border-color:var(--accent)}.toggle:after{content:"";width:14px;height:14px;background:#fff;border-radius:50%;position:absolute;top:2px;left:2px;transition:transform .2s}.toggle.on:after{transform:translate(16px)}.toggle-label{font-size:12px;color:var(--text2)}.filter-bar{padding:8px 12px;border-bottom:1px solid var(--border)}.filter-bar select{background:var(--bg3);border:1px solid var(--border);color:var(--text);padding:4px 8px;border-radius:4px;font-size:11px;width:100%}.filter-bar select:focus{outline:none;border-color:var(--accent)}.list-group{padding:6px 16px;font-size:10px;color:var(--text2);text-transform:uppercase;letter-spacing:.5px;background:var(--bg2);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:1}.badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:10px;font-weight:500}.badge-active{background:#34d39926;color:var(--green)}.badge-inactive{background:#f8717126;color:var(--red)}.badge-type{background:#6366f126;color:var(--accent2)}.info-row{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--border);font-size:13px}.info-row:last-child{border-bottom:none}.info-label{color:var(--text2)}.info-value{color:var(--text);text-align:right;max-width:60%;word-break:break-all}input[type=color]{width:36px;height:28px;border:1px solid var(--border);border-radius:4px;background:var(--bg2);cursor:pointer;padding:2px}input[type=color]::-webkit-color-swatch-wrapper{padding:0}input[type=color]::-webkit-color-swatch{border:none;border-radius:2px}.usage-count{font-size:11px;color:var(--accent2);margin-left:auto}