/* Shared mobile proportions across the shell and service journeys. */
:root {
  --title-size:22px;
  --section-size:16px;
  --card-radius:16px;
  --card-padding:14px;
}
.page-heading,.xp-heading {margin-bottom:16px}
.page-heading h1,.xp-page h1 {font-size:var(--title-size);line-height:1.55;letter-spacing:0}
.page-heading p,.xp-heading p {font-size:14px;line-height:1.8;margin-top:4px}
.xp-page h2,.xp-summary h2,.xp-section>h2 {font-size:var(--section-size);line-height:1.7}
.xp-page h3 {font-size:14px;line-height:1.7}
.xp-page p,.content-card p,.place-card p,dialog p {line-height:1.8}
.xp-page p {margin-block:4px}
.xp-page .xp-meta,.xp-page small {font-size:12px;line-height:1.75}
.xp-page {overflow-wrap:break-word}
.xp-card,.xp-order,.content-card,.place-card {border-radius:var(--card-radius);padding:var(--card-padding)}
.xp-card,.xp-order {margin-block:10px}
.xp-list {gap:10px;margin-block:14px}
.xp-list>.xp-card,.xp-list>.xp-order,.xp-grid>.xp-card {margin:0}
.xp-grid {gap:12px;align-items:stretch}
.xp-grid>.xp-card>.xp-copy {padding:12px;gap:4px}
.xp-grid>.xp-card h2,.xp-grid>.xp-card h3 {font-size:14px;line-height:1.65}
.xp-grid>.xp-card .xp-copy>p {line-height:1.75}
.xp-media {height:80px;min-height:72px;border-radius:12px}
.xp-media>svg {width:34px;height:34px}
.xp-icon {width:40px;height:40px;min-width:40px;border-radius:12px}
.xp-icon>svg {width:21px;height:21px}
.xp-place-heading {display:flex;align-items:center;gap:10px;margin-bottom:8px;min-width:0}
.xp-place-heading>div:not(.xp-icon) {min-width:0;flex:1}
.xp-place-heading h2 {margin:0;font-size:16px;line-height:1.65}
.xp-page .xp-place-heading p {margin-block:2px 0}
/* Descriptive places need the full mobile width; products stay in a grid. */
.xp-grid.xp-directory {grid-template-columns:minmax(0,1fr);gap:10px}
.xp-grid.xp-directory>.xp-card {display:block;padding:var(--card-padding);border-radius:var(--card-radius)}
.xp-directory>.xp-card>h2,.xp-directory>.xp-card>h3,.xp-directory>.xp-card>p,
.xp-directory>.xp-card>.xp-row,.xp-directory>.xp-card>.xp-meta {margin-inline:0}
.xp-directory>.xp-card h2 {font-size:16px}
.xp-directory>.xp-card>.xp-row:last-child,.xp-card>.xp-copy>.xp-row:last-child {margin-bottom:0}
.xp-directory>.xp-card>.xp-row>.xp-button {width:auto;flex:1}
.xp-directory>.xp-card>.xp-row>.xp-secondary {flex:0 1 auto}
.xp-button,.xp-secondary,.xp-light {min-height:44px;padding:8px 12px;border-radius:12px;font-size:14px;line-height:1.75}
.xp-quiet {min-height:44px;padding-block:8px}
.xp-row {margin-block:6px}
.xp-toolbar {align-items:flex-end;margin-block:12px 14px;gap:8px}
.xp-toolbar>.xp-field {flex:1;min-width:0}
.xp-toolbar>.xp-secondary {min-height:48px}
.xp-toolbar .xp-search {min-width:0}
.xp-chips {margin-bottom:12px;gap:6px}
.xp-chip {padding:7px 12px}
.xp-form {gap:12px}
.xp-field {gap:5px}
.xp-field input,.xp-field select,.xp-field textarea {padding:10px 12px;min-height:48px}
.xp-section {margin-block:20px 12px}
.xp-section>h2 {margin-bottom:10px}
.xp-summary {border-radius:var(--card-radius);padding:14px;margin-block:14px}
.xp-card .xp-summary {padding:12px;margin-block:12px}
.xp-summary dd {margin:0;min-width:0;max-width:100%;overflow-wrap:anywhere}
.xp-summary dt {color:var(--muted);font-size:12px}
.xp-total {padding-top:10px;margin-top:10px}
.xp-total strong {font-size:17px}
.xp-menu {min-height:64px;padding:10px 12px;gap:10px;border-radius:var(--card-radius)}
.xp-menu .xp-icon {width:36px;height:36px;min-width:36px;border-radius:11px}
.xp-stat {padding:12px;border-radius:var(--card-radius)}
.xp-stat strong {font-size:21px}
.xp-wallet-card {padding:18px;border-radius:18px;gap:8px}
.xp-wallet-card>strong {font-size:24px;line-height:1.65;overflow-wrap:anywhere}
.xp-ticket {padding:18px 16px;border-radius:18px}
.xp-ticket-seal {width:44px;height:44px;margin-bottom:10px}
.xp-ticket-seal svg {width:24px;height:24px}
.xp-ticket h2 {margin-block:10px 6px}
.xp-reference {font-size:17px;letter-spacing:1px;margin-block:10px;overflow-wrap:anywhere}
.xp-ticket-total {font-size:22px;margin-top:12px}
.xp-empty {padding:22px 14px;border-radius:var(--card-radius)}
.xp-empty p {margin:6px 0 14px}
.xp-timeline {padding-inline-start:14px}
.xp-timeline>li {padding-inline:12px;padding-bottom:18px}
.xp-timeline>.xp-step {margin-bottom:0}
.xp-page progress {accent-color:var(--green);height:8px}
.trip-stat {gap:10px;margin-bottom:14px}
.trip-stat>div {padding:10px 12px;border-radius:var(--card-radius)}
.trip-item {gap:10px;padding:12px;border-radius:var(--card-radius)}
.trip-number {flex:none}
.primary-button,.secondary-button {font-size:14px;line-height:1.75}
.language-picker button {min-height:64px;padding:10px 14px}
.language-option-copy strong {font-size:16px}
dialog {padding-inline:18px;border-start-start-radius:20px;border-start-end-radius:20px}
dialog h2 {font-size:18px;line-height:1.7}
/* Larger text is a deliberate preference, not an accidental per-screen scale. */
.large-text .page-heading h1,.large-text .xp-page h1 {font-size:26px}
.large-text .page-heading p,.large-text .xp-page p {font-size:16px;line-height:1.85}
.large-text .xp-page h2,.large-text .xp-page h3,.large-text .xp-place-heading h2 {font-size:18px}
.large-text .xp-page .xp-meta,.large-text .xp-page small {font-size:14px}
.large-text .xp-wallet-card>strong {font-size:27px}
.large-text .xp-ticket-total {font-size:25px}
.large-text .xp-stat strong {font-size:24px}
.large-text .xp-directory>.xp-card>.xp-row {align-items:stretch}
.large-text .xp-directory>.xp-card>.xp-row>.xp-button {flex-basis:100%}
@media(max-width:359px) {
  :root {--title-size:20px;--card-padding:12px}
  .page-heading,.xp-heading {margin-bottom:14px}
  .xp-grid {gap:10px}
  .xp-grid>.xp-card>.xp-copy {padding:10px}
  .xp-wallet-card {padding:16px}
  .xp-wallet-card>strong {font-size:22px}
  .xp-directory .xp-secondary {font-size:14px;padding:8px 10px}
  .large-text .xp-page h1,.large-text .page-heading h1 {font-size:24px}
}

/* Travel stops use the same compact information and action rows. */
.trip-item {display:grid;grid-template-columns:32px minmax(0,1fr) 44px;align-items:center}
.trip-item-actions {grid-column:1 / -1;display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.trip-item-actions .text-button {font-size:12px}
.trip-item-actions .xp-trip-order {margin:0}
.large-text .trip-item-actions .text-button {font-size:14px}