/* macOS-menyraden längs överkanten av en skrivbordsscen (efter mac-os-menu-bar.tsx: mörk och glasig) */
.mb-rad {
  position: absolute; z-index: 6; left: 0; right: 0; top: 0; height: 18px;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif; -webkit-font-smoothing: antialiased;
  display: flex; justify-content: space-between; align-items: center; padding: 0 12px;
  background: rgba(40,40,40,.65);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 1px 6px rgba(0,0,0,.15), inset 0 1px 0 rgba(255,255,255,.1);
  color: #fff; font-size: 9.5px; user-select: none; padding: 0 10px;
}
.mb-vanster, .mb-hoger { display: flex; align-items: center; gap: 11px; }
.mb-vanster b { font-weight: 600; }
.mb-hoger { gap: 8px; } .mb-tid { font-weight: 500; font-variant-numeric: tabular-nums; }
.mb-knapp { cursor: pointer; padding: 1px 4px; margin: 0 -4px; border-radius: 3px; transition: background .12s ease; }
.mb-knapp:hover { background: rgba(255,255,255,.12); }
.mb-knapp.aktiv { background: rgba(255,255,255,.2); }
.mb-apple { display: inline-flex; }
.mb-meny {
  position: absolute; top: 20px; min-width: 150px; padding: 4px 0;
  background: rgba(40,40,40,.75);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,.18); border-radius: 8px;
  box-shadow: 0 8px 32px rgba(0,0,0,.4), 0 2px 8px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.12);
  transform-origin: top left; animation: mb-in .15s cubic-bezier(.23,1,.32,1) both;
}
.mb-meny[hidden] { display: none; }
@keyframes mb-in { from { opacity: 0; transform: scale(.95) translateY(-5px); } }
.mb-post { display: flex; justify-content: space-between; gap: 16px; padding: 2px 10px; font-size: 9.5px; cursor: default; }
.mb-post:hover { background: rgba(255,255,255,.1); }
.mb-post em { font-style: normal; font-size: 9px; color: rgba(255,255,255,.6); }
.mb-avdel { display: block; height: 1px; background: rgba(255,255,255,.15); margin: 4px 8px; }
@media (prefers-reduced-motion: reduce) { .mb-meny { animation: none; } }

.mb-apple svg { width: 8.5px; height: 11px; }
.mb-hoger svg:first-child { width: 17px; height: 9px; } .mb-hoger svg:nth-child(2) { width: 12px; height: 9px; }