.topbar-actions { display: flex; align-items: center; gap: 8px; }

.account-dialog { width: min(520px, calc(100vw - 32px)); border: 0; border-radius: var(--card-radius); padding: 28px; background: var(--paper); color: var(--ink); box-shadow: 0 24px 64px color-mix(in srgb, var(--ink) 35%, transparent); }
.account-dialog::backdrop { background: color-mix(in srgb, var(--ink) 55%, transparent); }
.account-close { float: right; }
.account-dialog form { display: grid; gap: 13px; }
.account-dialog h2 { font-size: 27px; }
.account-dialog h3 { font-size: 21px; }
.account-dialog p { color: var(--muted); }
.account-dialog label { display: grid; gap: 5px; font-weight: 700; }
.account-dialog input, .account-dialog select { width: 100%; border: 1px solid var(--line); border-radius: calc(var(--card-radius) * .6); padding: 10px; background: var(--paper); font: inherit; color: var(--ink); }
.account-session { display: flex; gap: 12px; justify-content: space-between; align-items: center; }
.select-trip { width: 100%; text-align: left; border: 1px solid var(--line); background: var(--paper); border-radius: calc(var(--card-radius) * .6); padding: 12px; cursor: pointer; color: var(--ink); }
.select-trip b, .select-trip small { display: block; }
.select-trip small { margin-top: 2px; color: var(--muted); }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.account-error { margin: 0; color: var(--brand-danger, #994535) !important; font-weight: 700; }

@media (max-width: 620px) {
  .topbar-actions { gap: 5px; }
  .topbar-actions .icon-button { padding: 7px; }
  .form-grid { grid-template-columns: 1fr; }
}
