wa-page::part(navigation) {
  max-width: 35ch;
}

.auth-card {
  inline-size: 100%;
  max-inline-size: 45ch;
  margin-inline: auto;
}

wa-page[view="mobile"] main {
  padding-inline: var(--wa-space-m);
}

body {
  background: var(--wa-color-surface-default);
}

main {
  min-width: 0;
}

main > * {
  max-inline-size: 100%;
}

.app-page-narrow {
  max-inline-size: 75ch;
  margin-inline: auto;
}

.app-full-height {
  min-block-size: 100%;
}

.app-mt-xs { margin-block-start: var(--wa-space-xs); }
.app-mt-s { margin-block-start: var(--wa-space-s); }
.app-mb-xs { margin-block-end: var(--wa-space-xs); }
.app-mb-s { margin-block-end: var(--wa-space-s); }
.app-my-s { margin-block: var(--wa-space-s); }
.app-ms-xs { margin-inline-start: var(--wa-space-xs); }
.app-me-xs { margin-inline-end: var(--wa-space-xs); }
.app-mx-s { margin-inline: var(--wa-space-s); }
.app-p-s { padding: var(--wa-space-s); }
.app-pt-xs { padding-block-start: var(--wa-space-xs); }
.app-px-0 { padding-inline: 0; }

.app-color-brand { color: var(--wa-color-brand-on-quiet); }
.app-color-success { color: var(--wa-color-success-on-quiet); }
.app-color-danger { color: var(--wa-color-danger-on-quiet); }
.app-overflow-hidden { overflow: hidden; }
.app-load-results {
  block-size: calc(100dvh - var(--wa-space-5xl) - var(--wa-space-5xl) - var(--wa-space-5xl) - var(--wa-space-l));
}

.app-content-scroll-s {
  max-block-size: calc(var(--wa-space-5xl) + var(--wa-space-5xl) + var(--wa-space-5xl) + var(--wa-space-4xl));
}

.app-content-scroll-m {
  max-block-size: calc(var(--wa-space-5xl) + var(--wa-space-5xl) + var(--wa-space-5xl) + var(--wa-space-5xl) + var(--wa-space-xl));
}

.app-content-scroll-l {
  max-block-size: calc(var(--wa-space-5xl) + var(--wa-space-5xl) + var(--wa-space-5xl) + var(--wa-space-5xl) + var(--wa-space-5xl) + var(--wa-space-5xl) + var(--wa-space-l));
}

.app-layer-interactive {
  position: relative;
  z-index: 2;
}

wa-card.app-border-brand {
  border-color: var(--wa-color-brand-border-loud);
}

wa-card.app-border-neutral {
  border-color: var(--wa-color-neutral-border-loud);
}

.app-border-bottom { border-block-end: var(--wa-border-width-s) solid var(--wa-color-surface-border); }

.app-icon-inline {
  margin-inline-end: var(--wa-space-2xs);
}

.app-icon-brand {
  color: var(--wa-color-brand-fill-loud);
}

.app-icon-success {
  color: var(--wa-color-success-fill-loud);
}

.app-icon-warning {
  color: var(--wa-color-warning-fill-loud);
}

.app-icon-danger {
  color: var(--wa-color-danger-fill-loud);
}

.app-icon-lg {
  font-size: var(--wa-font-size-3xl);
}

.app-icon-xl {
  font-size: var(--wa-font-size-4xl);
}

.app-icon-hero {
  font-size: calc(var(--wa-font-size-4xl) * 1.5);
}

wa-input.app-input-plain::part(base) {
  border-color: transparent;
  background: transparent;
}

.app-thumbnail {
  max-inline-size: 100%;
  border-radius: var(--wa-border-radius-m);
}

.app-stretched-link::after {
  position: absolute;
  inset: 0;
  content: "";
}

.app-load-marker {
  position: relative;
  display: inline-block;
  padding: var(--wa-space-xs);
  border: var(--wa-border-width-s) solid var(--wa-color-danger-border-loud);
  border-radius: var(--wa-border-radius-pill);
  background: var(--wa-color-danger-fill-loud);
  box-shadow: var(--wa-shadow-s);
  color: var(--wa-color-danger-on-loud);
  font-size: var(--wa-font-size-2xs);
  font-weight: var(--wa-font-weight-bold);
  pointer-events: auto;
  white-space: nowrap;
}

.app-load-marker::after {
  position: absolute;
  inset-block-start: 100%;
  inset-inline-start: calc(50% - var(--wa-space-2xs));
  border: var(--wa-space-2xs) solid transparent;
  border-block-start-color: var(--wa-color-danger-fill-loud);
  content: "";
}

.app-map-info {
  max-inline-size: calc(var(--wa-space-5xl) + var(--wa-space-5xl) + var(--wa-space-5xl) + var(--wa-space-s));
}

.app-map-info-title {
  font-size: var(--wa-font-size-m);
}

.gm-ui-hover-effect {
  display: none !important;
}

wa-scroller > table {
  min-width: 100%;
  width: max-content;
}

table {
  width: 100%;
  border-collapse: collapse;
}

th,
td {
  padding: var(--wa-space-s);
  text-align: start;
  vertical-align: middle;
  border-block-end: var(--wa-border-width-s) solid var(--wa-color-surface-border);
}

th {
  color: var(--wa-color-text-quiet);
  font-size: var(--wa-font-size-s);
  font-weight: var(--wa-font-weight-semibold);
}

input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]),
select,
textarea,
trix-editor {
  box-sizing: border-box;
  inline-size: 100%;
  min-block-size: var(--wa-form-control-height);
  padding: var(--wa-form-control-padding-block) var(--wa-form-control-padding-inline);
  border: var(--wa-form-control-border-width) var(--wa-form-control-border-style) var(--wa-form-control-border-color);
  border-radius: var(--wa-form-control-border-radius);
  background: var(--wa-form-control-background-color);
  color: var(--wa-form-control-value-color);
  font: inherit;
}

input:focus,
select:focus,
textarea:focus,
trix-editor:focus {
  border-color: var(--wa-form-control-activated-color);
  outline: var(--wa-focus-ring-width) solid var(--wa-color-focus);
  outline-offset: var(--wa-focus-ring-offset);
}

label {
  display: inline-block;
  margin-block-end: var(--wa-space-2xs);
  font-weight: var(--wa-form-control-label-font-weight);
}

.form-hint {
  color: var(--wa-color-text-quiet);
  font-size: var(--wa-font-size-s);
}

.map-frame,
.map-frame iframe {
  inline-size: 100%;
  block-size: 100%;
  min-block-size: 35vh;
  border: 0;
}

[class*="wa-frame"] > lite-youtube {
  inline-size: 100%;
  block-size: 100%;
}

.app-thumbnail-md {
  max-block-size: calc(var(--wa-space-5xl) + var(--wa-space-5xl) + var(--wa-space-5xl) + var(--wa-space-s));
  object-fit: cover;
}

.htmx-indicator {
  display: none;
}

.htmx-request .htmx-indicator,
.htmx-request.htmx-indicator {
  display: inline;
}

.htmx-request tr.htmx-indicator {
  display: table-row;
  opacity: 1;
}

[hidden] {
  display: none !important;
}

.trix-button--icon-link,
.trix-button--icon-code,
.trix-button--icon-attach,
.trix-button--icon-quote,
.trix-button--icon-heading-1,
.trix-button-group.trix-button-group--file-tools,
.trix-button-group.trix-button-group--history-tools {
  display: none;
}