/* Shared brand, registration and conversation layout. */
.brand {letter-spacing: -.045em; gap: 10px;}
.brand-dot {display: none;}
.mobile-brand img {vertical-align: middle; margin-right: 7px;}
.pedestrian-home {font-size: 14px; line-height: 1.7; margin-top: 18px;}
.pedestrian-home a {color: #b94628; text-underline-offset: 4px;}
.pedestrian-home .subtle-link {display: inline-block; margin-left: 8px; color: #596653;}
.account-options {border: 0; padding: 0; margin: 0; display: flex; gap: 12px; min-width: 0;}
.account-options legend {font-size: 13px; font-weight: 600; margin-bottom: 10px;}
.form-stack .account-options label {flex: 1; display: flex; flex-direction: row; align-items: center; gap: 8px; padding: 14px 12px; border: 1px solid #d7ddd1; border-radius: 12px; cursor: pointer;}
.account-options label:has(:checked) {border-color: #58735d; background: #eef3e9;}
.form-stack .account-options input {width: 17px; height: 17px; min-height: 17px; margin: 0; accent-color: #38563f;}
.driver-fields {border: 0; padding: 0; margin: 0; min-width: 0;}
.driver-fields > .hint {margin-top: 9px;}
[hidden] {display: none !important;}
.pedestrian-badge {display: inline-flex; align-items: center; gap: 8px; padding: 9px 12px; border-radius: 11px; background: #eaf0e4; color: #35483a; font: 600 15px/1.3 "Segoe UI", sans-serif; letter-spacing: 0; white-space: nowrap;}
.pedestrian-badge svg {width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;}
.onboarding-note {margin-bottom: 22px;}
.directory-layout {align-items: start; gap: 24px;}
#directory-result {margin-top: 20px;}
.directory-result-card {padding: 26px; display: flex; flex-direction: column; align-items: stretch; gap: 22px;}
.directory-result-card h2 {font-size: clamp(21px, 2.1vw, 26px); line-height: 1.25; margin: 0 0 10px; letter-spacing: -.025em;}
.directory-result-card p {margin: 0;}
.directory-result-card .hint {font-size: 14px; line-height: 1.6; color: #626d60;}
.directory-actions {display: flex; flex-wrap: wrap; align-items: stretch; gap: 12px;}
.directory-actions .button {white-space: normal; text-align: center; line-height: 1.4;}
.directory-result-card .plate-region-caption {padding-top: 18px; border-top: 1px solid var(--line); font-size: 14px; line-height: 1.8;}
.app-layout[data-section="chats"] .app-main {height: 100dvh; display: flex; flex-direction: column;}
.app-layout[data-section="chats"] .app-topbar {flex-shrink: 0;}
.app-layout[data-section="chats"] #main {flex: 1; min-height: 0; width: 100%; margin: 0 auto; display: flex; flex-direction: column; padding-top: 26px; padding-bottom: 24px;}
.app-layout[data-section="chats"] .page-heading {flex-shrink: 0; margin-bottom: 20px;}
.app-layout[data-section="chats"] #verification-alerts {flex-shrink: 0; width: 100%; max-height: 25dvh; overflow-y: auto; padding-block: 12px;}
.app-layout[data-section="chats"] .chat-layout {flex: 1; height: auto; min-height: 0; grid-template-columns: 300px minmax(0,1fr);}
.chat-pane, .chat-list, .messages {min-height: 0;}
.chat-head, .chat-compose, .chat-alert {flex-shrink: 0;}
.chat-head {padding: 16px 20px; gap: 12px;}
.chat-identities {display: flex; align-items: center; flex-wrap: wrap; gap: 10px 22px; min-width: 0;}
.chat-own-plate {margin: 0; gap: 8px;}
.chat-own-plate small {font-size: 12px;}
.chat-tools {flex-wrap: wrap;}
.chat-tools button {font-size: 12px; color: #626d60; padding: 4px;}
.chat-alert {font-size: 12px; line-height: 1.5; padding: 10px 20px;}
.messages {padding: 22px; gap: 12px; overscroll-behavior: contain;}
.message {font-size: 14px; line-height: 1.5; flex-shrink: 0;}
.message-meta, .message-day {font-size: 11px; color: #667461;}
.chat-compose {padding: 14px 18px;}
.chat-compose textarea {font-size: 16px;}
.chat-cost {font-size: 11px; color: #667461; flex-wrap: wrap; gap: 4px;}
.chat-list .inbox-row > .avatar {display: none;}
.inbox-summary {min-width: 0;}
.inbox-summary .pedestrian-badge {margin-bottom: 6px;}
.chat-list .inbox-summary p {max-width: 200px; font-size: 12px;}
@media(max-width: 760px) {
  .app-layout[data-section="chats"] .app-main {height: calc(100dvh - 67px);}
  .app-layout[data-section="chats"] #main {padding: 16px 12px 12px;}
  .app-layout[data-section="chats"] .page-heading {margin-bottom: 12px; gap: 10px;}
  .app-layout[data-section="chats"] .page-heading h1 {font-size: 23px; margin-bottom: 5px;}
  .app-layout[data-section="chats"] .page-heading p {font-size: 12px; line-height: 1.4;}
  .chat-head {padding: 10px 12px; gap: 8px;}
  .chat-identities {gap: 8px 12px; flex: 1;}
  .chat-own-plate .plate {font-size: 14px;}
  .chat-own-plate .plate-region {font-size: 15px; min-width: 32px;}
  .chat-own-plate .plate-main {padding: 4px 6px;}
  .chat-tools {width: 100%; justify-content: flex-end; gap: 16px !important;}
  .chat-tools button {min-height: 28px; font-size: 12px;}
  .chat-alert {padding: 8px 12px;}
  .messages {padding: 14px 12px;}
  .chat-compose {padding: 10px;}
  .chat-compose .button {min-width: 93px; font-size: 12px; padding-inline: 9px;}
  .chat-cost {font-size: 10px;}
  .directory-result-card {padding: 22px; gap: 20px;}
  .directory-actions {flex-direction: column;}
}
@media(max-height: 620px) {
  .app-layout[data-section="chats"] .page-heading p, .chat-compose .chat-quick {display: none;}
  .app-layout[data-section="chats"] #main {padding-block: 8px;}
  .chat-own-plate {display: none;}
}

.number-intro > .plate {margin-bottom: 22px;}

.chat-quick button {font-size: 11px; padding: 6px 8px;}
@media(max-width: 760px) {.app-layout[data-section="chats"] .page-heading > .button {flex-shrink: 0; width: 120px; font-size: 12px; line-height: 1.4;} .directory-layout > aside {display: flex; flex-direction: column; gap: 12px;}}