/** Top toolbar: File/Edit/View/Design/AI menus + Save/Export, iOS-style translucent bar. */
.eps-toolbar {
  height: 56px;
  display: flex;
  align-items: center;
  gap: var(--eps-space-4);
  padding: 0 var(--eps-space-4);
  background: var(--eps-surface-translucent);
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  border-bottom: 1px solid var(--eps-border);
}

.eps-toolbar__brand {
  font-weight: 700;
  font-size: 15px;
  letter-spacing: -0.01em;
  color: var(--eps-text-primary);
  white-space: nowrap;
}

.eps-toolbar__back {
  font-family: var(--eps-font);
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  color: var(--eps-text-secondary);
  white-space: nowrap;
  padding: 6px 10px;
  border-radius: var(--eps-radius-pill);
  transition: background var(--eps-duration-fast) var(--eps-ease), color var(--eps-duration-fast) var(--eps-ease);
}
.eps-toolbar__back:hover {
  background: var(--eps-surface-sunken);
  color: var(--eps-text-primary);
}

.eps-toolbar__name-input {
  font-family: var(--eps-font);
  font-size: 14px;
  font-weight: 600;
  color: var(--eps-text-primary);
  background: transparent;
  border: 1px solid transparent;
  border-radius: var(--eps-radius-sm);
  padding: 6px 10px;
  min-width: 80px;
  max-width: 260px;
  width: 20ch;
  transition: background var(--eps-duration-fast) var(--eps-ease), border-color var(--eps-duration-fast) var(--eps-ease);
}
.eps-toolbar__name-input:hover {
  background: var(--eps-surface-sunken);
}
.eps-toolbar__name-input:focus {
  outline: none;
  background: var(--eps-surface);
  border-color: var(--eps-accent);
  box-shadow: 0 0 0 3px var(--eps-accent-soft);
}
.eps-toolbar__name-input::placeholder {
  color: var(--eps-text-tertiary);
  font-weight: 500;
}

.eps-toolbar__menu {
  display: flex;
  gap: var(--eps-space-1);
}

.eps-menu-item {
  background: transparent;
  border: none;
  font-family: var(--eps-font);
  font-size: 13px;
  font-weight: 500;
  color: var(--eps-text-secondary);
  padding: var(--eps-space-1) var(--eps-space-2);
  border-radius: var(--eps-radius-sm);
  cursor: pointer;
  transition: background var(--eps-duration-fast) var(--eps-ease), color var(--eps-duration-fast) var(--eps-ease);
}
.eps-menu-item:hover { background: var(--eps-surface-sunken); color: var(--eps-text-primary); }

.eps-toolbar__spacer { flex: 1; }

.eps-toolbar__status {
  font-size: 12px;
  color: var(--eps-text-tertiary);
  white-space: nowrap;
}
.eps-toolbar__status.is-pending { color: var(--eps-warning); }
.eps-toolbar__status.is-synced { color: var(--eps-success); }

.eps-btn {
  font-family: var(--eps-font);
  font-size: 13px;
  font-weight: 600;
  border-radius: var(--eps-radius-pill);
  padding: 8px 16px;
  border: 1px solid var(--eps-border);
  background: var(--eps-surface);
  color: var(--eps-text-primary);
  cursor: pointer;
  transition: transform var(--eps-duration-fast) var(--eps-ease), background var(--eps-duration-fast) var(--eps-ease), box-shadow var(--eps-duration-fast) var(--eps-ease);
}
.eps-btn:hover { background: var(--eps-surface-sunken); }
.eps-btn:active { transform: scale(0.97); }
.eps-btn--primary { background: var(--eps-accent); border-color: var(--eps-accent); color: var(--eps-text-on-accent); }
.eps-btn--primary:hover { background: var(--eps-accent-strong); }
.eps-btn--icon { padding: 8px; border-radius: var(--eps-radius-sm); }
.eps-btn[disabled] { opacity: 0.4; cursor: not-allowed; }