body { margin: 0; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background-color: #1e1e1e; color: white; overflow: hidden; }
#cy { width: 100vw; height: 100vh; display: block; }

/* UI Panels */
.panel { position: absolute; background: rgba(0,0,0,0.85); padding: 15px; border-radius: 8px; border: 1px solid #444; z-index: 10; backdrop-filter: blur(5px); }
#topbar { top: 20px; left: 20px; display: flex; gap: 15px; align-items: center;}
#action-menu { display: none; bottom: 20px; left: 20px; min-width: 200px; }

button { background: #0078D7; color: white; border: none; padding: 8px 15px; border-radius: 4px; cursor: pointer; font-weight: bold; }
button:hover { background: #005a9e; }
button.danger { background: #E81123; }
button.danger:hover { background: #ba0d1b; }

input[type="text"] { background: #333; border: 1px solid #555; color: white; padding: 6px; border-radius: 4px; width: 200px; }
.control-group { display: flex; align-items: center; gap: 10px; margin-top: 10px; }

/* Drawer */
#timeline-drawer {
    position: fixed; top: 0; right: -450px; width: 400px; height: 100vh; background: #252526;
    border-left: 1px solid #444; transition: right 0.3s ease; overflow-y: auto; padding: 20px; z-index: 100;
}
#timeline-drawer.open { right: 0; }
.close-btn { float: right; cursor: pointer; color: #888; font-size: 20px; }

/* Live Scan HUD */
#live-scan-hud {
    display: none; /* Hidden until a scan starts */
    bottom: 20px;
    right: 20px;
    width: 320px;
    border-top: 3px solid #0078D7; /* Blue accent bar */
}