.molecule-viewer-container{background:#fff;border:1px solid rgba(226,232,240,.8);border-radius:16px;padding:0;margin-bottom:24px;box-shadow:0 10px 30px -10px #00000014;overflow:hidden;display:flex;flex-direction:column;height:100%}.molecule-header{display:flex;justify-content:space-between;align-items:center;padding:16px 24px;background:#fff;border-bottom:1px solid #f1f5f9;z-index:2;position:relative}.molecule-title{font-size:.95rem;font-weight:700;color:#64748b;text-transform:capitalize;letter-spacing:.05em;margin:0;display:flex;align-items:center}.molecule-title:before{content:"";display:inline-block;width:8px;height:8px;background:#3b82f6;border-radius:50%;margin-right:8px;box-shadow:0 0 0 2px #3b82f633}.molecule-controls{display:flex;gap:10px}.toggle-btn{padding:6px 16px;border:1px solid #e2e8f0;border-radius:20px;background:#f8fafc;color:#64748b;font-weight:600;font-size:.8rem;cursor:pointer;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;gap:6px}.toggle-btn:hover{background:#eff6ff;color:#3b82f6;border-color:#bfdbfe;transform:translateY(-1px)}.toggle-btn:active{transform:translateY(0)}.toggle-btn.active{background:#3b82f6;color:#fff;border-color:#3b82f6;box-shadow:0 4px 12px #3b82f64d}.molecule-2d-view{background-color:#f8fafc;background-image:radial-gradient(#cbd5e1 1.5px,transparent 1.5px);background-size:24px 24px;padding:40px;text-align:center;min-height:400px;display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;box-shadow:inset 0 0 40px #00000005}.smiles-visualization{border:none!important;border-radius:12px;filter:drop-shadow(0 8px 24px rgba(0,0,0,.08));max-width:90%;height:auto;background:transparent;transition:transform .3s ease}.molecule-2d-view:hover .smiles-visualization{transform:scale(1.02)}.molecule-3d-wrapper{width:100%;height:400px;border:none;background:#fff;position:relative}.molecule-3d-canvas-container{width:100%;height:100%}.molecule-loading{font-weight:600;color:#3b82f6;background:#ffffffe6;padding:12px 24px;border-radius:30px;box-shadow:0 4px 12px #0000001a;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.molecule-error{margin:16px;color:#e11d48;font-size:.85rem;padding:12px;background:#fff1f2;border-radius:8px;border:1px dashed #fecdd3;text-align:center}.molecule-placeholder{width:100%;height:400px;background:#f8fafc;display:flex;align-items:center;justify-content:center;color:#94a3b8;font-style:italic;background-image:radial-gradient(#e2e8f0 1px,transparent 1px);background-size:20px 20px}@media(max-width:768px){.molecule-viewer-container{border-radius:8px}.molecule-header{padding:12px 16px}.molecule-2d-view,.molecule-3d-wrapper{height:300px;min-height:300px}}:root{--kg-drug-color: #10b981;--kg-drug-color-stroke: #059669;--kg-drug-selected: #f43f5e;--kg-drug-selected-stroke: #e11d48;--kg-target-color: #a78bfa;--kg-target-color-stroke: #7c3aed;--kg-dti-color: #f59e0b;--kg-ddi-color: #84cc16;--kg-highlight: #3b82f6;--kg-edge-default: #cbd5e1}.kg-container-card{display:flex;flex-direction:column;width:100%;height:100%;min-height:550px;background:#fff;border:1px solid #e2e8f0;border-radius:12px;overflow:hidden;box-shadow:0 4px 6px -1px #0000000d}.kg-toolbar{height:48px;background-color:#fff;border-bottom:1px solid #f1f5f9;display:flex;align-items:center;justify-content:space-between;padding:0 20px;flex-shrink:0}.kg-toolbar-left{display:flex;align-items:center;gap:12px}.kg-toolbar-title{font-weight:700;color:#1e293b;font-size:.95rem}.kg-toolbar-divider{color:#e2e8f0}.kg-toolbar-hint{font-size:.8rem;color:#64748b;display:flex;align-items:center;gap:6px}.kg-algo-badge{font-size:.75rem;font-weight:600;color:#3b82f6;background:#eff6ff;padding:4px 10px;border-radius:20px;border:1px solid #dbeafe}.kg-canvas-wrapper{flex:1;position:relative;background-color:#f8fafc;background-image:radial-gradient(#cbd5e1 1.5px,transparent 1.5px);background-size:24px 24px;overflow:hidden}.kg-g6-canvas{width:100%;height:100%;outline:none;cursor:grab}.kg-g6-canvas:active{cursor:grabbing}.kg-floating-legend{position:absolute;bottom:12px;left:50%;transform:translate(-50%);right:auto;background:#ffffffe6;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);padding:8px 16px;border-radius:20px;border:1px solid rgba(226,232,240,.8);box-shadow:0 4px 12px #00000014;display:flex;flex-direction:row;align-items:center;gap:14px;z-index:10;pointer-events:none;min-width:auto;white-space:nowrap}.legend-row{display:flex;align-items:center;gap:6px;margin:0}.legend-label{font-size:.75rem;color:#64748b;font-weight:600}.legend-dot{width:10px;height:10px;border-radius:50%;border:2px solid transparent}.legend-dot.target{background:var(--kg-target-color);border-color:var(--kg-target-color-stroke)}.legend-dot.drug{background:var(--kg-drug-color);border-color:var(--kg-drug-color-stroke)}.legend-dot.current{background:var(--kg-drug-selected);border-color:var(--kg-drug-selected-stroke)}.legend-separator{width:1px;height:12px;background:#cbd5e1;margin:0 4px}.legend-line{width:24px;height:3px;border-radius:2px}.legend-line.ddi{background:var(--kg-ddi-color)}.legend-line.dti{background:var(--kg-dti-color)}.kg-tooltip{position:fixed;z-index:9999;background:#0f172af2;color:#fff;border-radius:6px;padding:8px 12px;font-size:.8rem;line-height:1.5;box-shadow:0 4px 6px #0003;pointer-events:none;border:1px solid rgba(255,255,255,.1);transform:translate(10px,10px)}.kg-tooltip strong{font-weight:600;color:#fff}.visualization-container{display:flex;flex-direction:column;gap:32px;width:100%;margin:0 0 40px}.overview-chart-wrapper{width:100%;min-height:400px;background:#fff;border-radius:16px;border:1px solid #e2e8f0;padding:24px;box-sizing:border-box;box-shadow:0 4px 20px #0000000d;flex:1;transition:all .3s ease}.detail-grid-container{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;width:100%}.detail-chart-card{width:100%;min-height:300px;background:#fff;border-radius:16px;border:1px solid #e2e8f0;padding:24px;box-sizing:border-box;box-shadow:0 4px 20px #0000000d;transition:all .3s cubic-bezier(.4,0,.2,1)}.overview-chart-wrapper>div,.detail-chart-card>div{width:100%;height:100%;background:#fff;border-radius:12px;border:1px solid #e2e8f0;padding:20px;box-sizing:border-box;transition:all .3s ease;display:flex;flex-direction:column;justify-content:center}.detail-chart-card:hover{box-shadow:0 8px 30px #00000014;transform:translateY(-4px);border-color:#bfdbfe}.visualization-placeholder{width:100%;height:300px;display:flex;align-items:center;justify-content:center;background:#f8fafc;border-radius:12px;color:#94a3b8;font-size:16px;font-weight:500;border:1px solid #e2e8f0}@media(max-width:1024px){.overview-chart-wrapper{min-height:350px;padding:20px}.detail-chart-card{min-height:260px;padding:20px}.detail-grid-container{gap:20px}}@media(max-width:768px){.visualization-container{gap:20px}.overview-chart-wrapper{min-height:300px;padding:16px}.detail-grid-container{grid-template-columns:1fr;gap:20px}.detail-chart-card{min-height:240px;padding:16px}}.drug-visualization-container{display:grid;grid-template-columns:1.6fr 1fr;gap:28px;width:100%;padding:28px;background:linear-gradient(135deg,#f8f9fc,#f0f3f8);border-radius:12px;border:1px solid #e2e8f0;box-shadow:0 2px 8px #00000008;box-sizing:border-box;min-height:500px}.drug-chart-left{display:flex;flex-direction:column;min-height:450px;background:#fff;border-radius:12px;border:1px solid #dbeafe;padding:24px;box-sizing:border-box;box-shadow:0 2px 6px #00000005;transition:all .3s ease;flex:1}.drug-chart-left:hover{box-shadow:0 4px 12px #0000000f;border-color:#60a5fa}.drug-charts-right{display:grid;grid-template-rows:1fr 1fr;gap:24px;flex:1}.drug-chart-top-right{display:flex;flex-direction:column;min-height:200px;background:#fff;border-radius:12px;border:1px solid #dcfce7;padding:22px;box-sizing:border-box;box-shadow:0 2px 6px #00000005;transition:all .3s ease;flex:1}.drug-chart-top-right:hover{box-shadow:0 4px 12px #0000000f;border-color:#22c55e}.drug-chart-bottom-right{display:flex;flex-direction:column;min-height:200px;background:#fff;border-radius:12px;border:1px solid #f3e8ff;padding:22px;box-sizing:border-box;box-shadow:0 2px 6px #00000005;transition:all .3s ease;flex:1}.drug-chart-bottom-right:hover{box-shadow:0 4px 12px #0000000f;border-color:#d946ef}@media(max-width:1200px){.drug-visualization-container{grid-template-columns:1fr;gap:20px;padding:20px;min-height:450px}.drug-chart-left{min-height:380px}.drug-charts-right{grid-template-columns:1fr 1fr;grid-template-rows:auto;gap:20px}.drug-chart-top-right,.drug-chart-bottom-right{min-height:170px}}@media(max-width:768px){.drug-visualization-container{grid-template-columns:1fr;gap:16px;padding:16px;border-radius:8px;min-height:auto}.drug-chart-left{min-height:300px;padding:16px}.drug-charts-right{grid-template-columns:1fr;gap:16px}.drug-chart-top-right,.drug-chart-bottom-right{min-height:250px;padding:16px}}@media(max-width:480px){.drug-visualization-container{grid-template-columns:1fr;gap:12px;padding:12px;min-height:auto}.drug-chart-left{min-height:250px;padding:12px}.drug-charts-right{grid-template-columns:1fr;gap:12px}.drug-chart-top-right,.drug-chart-bottom-right{min-height:200px;padding:12px}}.drug-chart-left>div,.drug-chart-top-right>div,.drug-chart-bottom-right>div{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.drug-visualization-container .echarts-tooltip{pointer-events:auto!important}