/* vis-network MicroSim Stylesheet
   Layout: 2/3 graph panel + 1/3 info panel. Click a node to see its details.
*/
* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { width: 100%; height: 100%; overflow: hidden; font-family: Arial, Helvetica, sans-serif; }

.container { display: flex; width: 100%; height: 100%; }

.graph-panel { position: relative; width: 66.67%; height: 100%; background: aliceblue; }
#network { width: 100%; height: 100%; }

.title {
    position: absolute; top: 6px; left: 0; right: 0;
    text-align: center; font-size: 15px; font-weight: bold;
    color: #1a3a5c; pointer-events: none; padding: 0 8px;
}

.info-panel {
    width: 33.33%; height: 100%; background: #f8f9fa;
    border-left: 1px solid #dee2e6; padding: 15px; overflow-y: auto;
}
.info-panel h3 {
    font-size: 18px; color: #333; margin-bottom: 10px;
    padding-bottom: 8px; border-bottom: 2px solid #2a9d8f;
}
.info-title { font-size: 16px; font-weight: bold; color: #21867a; margin-bottom: 8px; }
.info-content { font-size: 14px; line-height: 1.5; color: #444; }
.info-content .mini {
    display: block; margin-top: 8px; padding: 6px 8px;
    background: #eef6f5; border-left: 3px solid #2a9d8f; font-size: 13px; color: #2b2b2b;
}
.info-placeholder { color: #888; font-style: italic; font-size: 14px; }