#status-bar {
  height: var(--statusbar-h);
  background: var(--bg-statusbar);
  color: var(--text-on-status);
  display: flex;
  align-items: center;
  padding: 0 10px;
  font-size: 11px;
  flex-shrink: 0;
  user-select: none;
  gap: 8px;
}
#status-left, #status-center, #status-right {
  display: flex;
  align-items: center;
  gap: 6px;
}
#status-left  { flex: 1; }
#status-center { flex: 0; white-space: nowrap; opacity: 0.8; }
#status-right  { flex: 1; justify-content: flex-end; gap: 4px; }

.status-sep { opacity: 0.4; }

.zoom-btn {
  width: 18px; height: 18px;
  border-radius: 2px;
  color: #fff;
  font-size: 14px;
  display: flex; align-items: center; justify-content: center;
  opacity: 0.8;
  transition: opacity var(--tr), background var(--tr);
}
.zoom-btn:hover { opacity: 1; background: rgba(255,255,255,0.15); }

#zoom-level { min-width: 36px; text-align: center; font-size: 11px; }

#zoom-slider {
  width: 80px;
  height: 3px;
  accent-color: #fff;
  cursor: pointer;
}

/* Context menu */
#context-menu {
  position: fixed;
  background: var(--bg-dialog);
  border: 1px solid var(--border-strong);
  border-radius: 5px;
  box-shadow: var(--shadow-popup);
  z-index: 3000;
  min-width: 160px;
  padding: 4px 0;
}
#context-menu.hidden { display: none; }
#context-menu-list li {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px;
  font-size: 12.5px;
  cursor: pointer;
  color: var(--text-primary);
}
#context-menu-list li:hover { background: var(--accent-light); }
#context-menu-list li.sep { height: 1px; background: var(--border); padding: 0; margin: 3px 0; cursor: default; }
#context-menu-list li.sep:hover { background: var(--border); }
#context-menu-list .ctx-shortcut { margin-left: auto; color: var(--text-muted); font-size: 11px; }
#context-menu-list li.disabled { opacity: 0.4; pointer-events: none; }
