*{box-sizing:border-box}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,sans-serif;margin:0;color:#222;background:#f6f8fb}html,body,#app{height:100%}:root{--accent:#0b57d0;--accent-2:#3b82f6;--ok:#22c55e;--warn:#f97316;--danger:#ef4444;--sidebar-width: 232px;--sidebar-width-collapsed: 64px;--sidebar-bg-start:#f9fbff;--sidebar-bg-end:#eef3ff;--sidebar-border:#dbe3ff;--sidebar-text:#1f2a44;--sidebar-muted:#5b6b88;--sidebar-active:#e7efff;--sidebar-hover:#f2f6ff;--main-bg:#f6f8fb;--card-bg:#ffffff;--card-border:#e5e7eb;--shadow:0 6px 20px rgba(17,24,39,.08);--divider-offset: 0px;--toggle-width: 24px;--content-left-pad: 14px;--dv-font-ui: 14px;--dv-font-mono: 13px}body .tq-tree{scrollbar-width:thin;scrollbar-color:#94a3b8 transparent}body .tq-tree::-webkit-scrollbar{width:10px;height:10px}body .tq-tree::-webkit-scrollbar-track{background:transparent}body .tq-tree::-webkit-scrollbar-thumb{background:#94a3b8;border-radius:6px}body .tq-tree::-webkit-scrollbar-thumb:hover{background:#64748b}.app-layout{display:flex;height:100%;background:var(--main-bg);position:relative}.sidebar{width:var(--sidebar-width);flex:0 0 var(--sidebar-width);height:100%;background:linear-gradient(180deg,var(--sidebar-bg-start),var(--sidebar-bg-end));color:var(--sidebar-text);border-right:none;box-shadow:none;position:relative;z-index:4}.sidebar .brand{display:flex;align-items:center;gap:10px;padding:16px 14px;border-bottom:1px solid rgba(255,255,255,.06)}.sidebar .brand-logo{width:28px;height:28px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.2))}.sidebar .brand-name{font-weight:600;letter-spacing:.5px;color:#223b6a;text-shadow:0 1px 1px rgba(255,255,255,.7)}.sidebar nav{padding:8px 8px 16px}.sidebar nav ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:6px}.sidebar nav li{position:relative;display:flex;align-items:center;gap:10px;padding:12px;margin:0 8px;border-radius:10px;cursor:pointer;color:var(--sidebar-text);transition:all .18s ease;border:1px solid transparent}.sidebar nav li .mi{display:inline-flex;width:18px;height:18px;color:#2563eb}.sidebar nav li:before{content:"";position:absolute;left:-1px;top:8px;bottom:8px;width:3px;border-radius:2px;background:transparent;transition:all .18s ease}.sidebar nav li:hover{background:var(--sidebar-hover);border-color:#c7d2fe;box-shadow:0 2px 10px #3b82f614}.sidebar nav li:hover:before{background:#b7c7ff;opacity:.8}.sidebar nav li.active{background:var(--sidebar-active);color:#0b57d0;border-color:#a5b4fc;box-shadow:0 4px 14px #3b82f61f;font-weight:600}.sidebar nav li.active:before{background:#5b7cff}.sidebar nav li.active .mi{color:#2563eb}.sidebar nav li.group .group-title{display:flex;align-items:center;justify-content:space-between;padding:10px;margin:0 6px;border-radius:10px;color:var(--sidebar-text);cursor:pointer;background:transparent;border:1px solid transparent}.sidebar nav li.group .group-title:hover{background:var(--sidebar-hover);border-color:#c7d2fe}.sidebar nav li.group .mi-wrap{display:flex;align-items:center;gap:10px}.sidebar nav li.group .arrow{color:#9db5ff;transition:transform .18s ease}.sidebar nav li.group .arrow.open{transform:rotate(90deg);color:#6b8cff}.sidebar nav li .sub{margin:6px 10px 8px 34px;padding:6px 6px 6px 10px;border-left:2px solid #c7d2fe;display:flex;flex-direction:column;gap:4px;background:transparent;border-radius:8px;box-shadow:none}.sidebar nav li .sub li{padding:6px 8px;border-radius:6px;color:#1f3b66}.sidebar nav li .sub li:hover{background:#eef4ff}.sidebar nav li .sub li.active{background:#dfe9ff;color:#0b57d0;font-weight:600}.app-layout.collapsed .sidebar{width:var(--sidebar-width-collapsed);flex-basis:var(--sidebar-width-collapsed)}.app-layout.collapsed .sidebar .brand-name{display:none}.app-layout.collapsed .sidebar nav li span:not(.mi){display:none}.app-layout.collapsed .sidebar nav li{justify-content:center;padding:10px 8px}.app-layout.collapsed .sidebar nav li.group .group-title{justify-content:center}.app-layout.collapsed .sidebar nav li .sub{margin-left:16px}.preview{flex:1 1 auto;min-width:0;height:100%;display:flex;flex-direction:column;position:relative;z-index:1;border-left:none}.sidebar:after{content:"";position:absolute;top:0;bottom:0;right:calc(-1 * var(--divider-offset));width:1px;background:var(--sidebar-border);pointer-events:none;z-index:3}.top-info{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:10px 14px 10px var(--content-left-pad);background:linear-gradient(180deg,#fffd,#fffa);-webkit-backdrop-filter:saturate(180%) blur(4px);backdrop-filter:saturate(180%) blur(4px);border-bottom:1px solid #e6eaf5;position:sticky;top:0;z-index:6}.top-info .info-left,.top-info .info-center,.top-info .info-right{display:flex;align-items:center;gap:10px;color:#1f2a44}.tabs-bar{display:flex;align-items:center;gap:8px;padding:8px 10px 8px var(--content-left-pad);background:linear-gradient(180deg,#f8fbff,#f3f6fb);border-bottom:1px solid #e6eaf5}.tab-item{display:flex;align-items:center;gap:6px;padding:6px 10px;border-radius:8px;background:#fff;border:1px solid #e5e7eb;color:#334155;cursor:pointer;box-shadow:var(--shadow)}.tab-item.active{border-color:#c7d2fe;background:linear-gradient(180deg,#fff,#f8faff);color:#0b57d0}.tab-item .tab-close{opacity:.6}.tab-item:hover .tab-close{opacity:1}.container{padding:14px 14px 14px var(--content-left-pad)}.card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:12px;box-shadow:var(--shadow)}.section-title{font-size:18px;color:#0b57d0;margin:0 0 10px;font-weight:600}.app-layout main.preview{overflow-y:hidden}.dv-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;display:flex;align-items:stretch;justify-content:stretch}.dv-modal-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#0f172a73}.dv-modal-panel{position:relative;width:100vw;height:100vh;background:#fff;border-radius:0;box-shadow:none;display:flex;flex-direction:column;overflow:hidden}.dv-modal-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid #e5e7eb;background:#f8fafc}.dv-modal-panel .section-block{margin:12px 16px}.dv-modal-panel .tq-main{margin:0 16px 16px}.dv-modal-panel .tq-right{min-width:0}.dv-modal-panel .tq-result{height:100%}.tq-conn-readonly{min-width:240px;max-width:420px;padding:8px 10px;border:1px solid #e5e7eb;border-radius:8px;background:#f8fafc;color:#0f172a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tq-db-multi.disabled{opacity:.75;pointer-events:none}.app-layout .preview[data-v-7a7a37b1]{padding:0 20px 0 50px!important}.app-layout.collapsed .preview[data-v-7a7a37b1]{padding:0 20px!important}.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;border:1px solid #c9c9c9;background:#fff;color:#333;cursor:pointer}.icon-btn.add{background:#e8f0fe;border-color:#3b82f6;color:#0b57d0}.icon-btn.add:hover{background:#dbe8ff}.icon-btn.warn{background:#fee2e2;border-color:#ef4444;color:#b91c1c}.icon-btn.warn:hover{background:#fecaca}.toggle-btn{position:absolute;left:calc(var(--sidebar-width) - (var(--toggle-width) / 2))!important;top:50%;transform:translateY(-50%);z-index:5;width:var(--toggle-width);height:48px;border-radius:0 8px 8px 0;border:1px solid #c7d2fe;border-left:none;background:linear-gradient(180deg,#eef2ff,#e0e7ff);color:#0b57d0;cursor:pointer;box-shadow:2px 0 12px #0f172a26;box-sizing:border-box}.app-layout.collapsed .toggle-btn{left:0!important;border-radius:0 8px 8px 0}.toggle-btn .arrow-text{font-weight:700;font-size:14px}body .icon-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;border:1px solid #c9c9c9;background:#fff;color:#333;cursor:pointer;transition:background-color .15s ease,box-shadow .15s ease}body .icon-btn.sm{width:28px;height:28px}body .icon-btn:hover{background:#f5f7ff}body .icon-btn.info{border-color:#3b82f6;color:#0b57d0;background:#e8f0fe}body .icon-btn.info:hover{background:#dbe8ff}body .icon-btn.warn{border-color:#ef4444;color:#dc2626;background:#fff}body .icon-btn.warn:hover{background:#fee2e2}body .icon-btn.warn:active{background:#fde2e2}body .icon-btn.warn:focus-visible{outline:2px solid #fecaca;outline-offset:2px}body .icon-btn.test{border-color:#22c55e;color:#15803d;background:#eefdf3}body .icon-btn.test:hover{background:#dcfce7}body .icon-btn.console{border-color:#8b5cf6;color:#6d28d9;background:#f5f3ff}body .icon-btn.console:hover{background:#ede9fe}.modal .actions .icon-btn{width:36px;height:36px}.modal-header h2.with-icon{display:flex;align-items:center;gap:8px}.modal-header h2.with-icon svg{width:18px;height:18px;flex:0 0 18px}