/* ==========================================================================
   Base
   ========================================================================== */

* {
  box-sizing: border-box;
}

html {
  overflow-x: hidden;
  max-width: 100%;
}

body {
  font-family: system-ui, sans-serif;
  max-width: 640px;
  margin: 0 auto;
  padding: 1rem;
  overflow-x: hidden;
  max-width: 100%;
  overflow-wrap: break-word;
  background: var(--md-sys-color-surface);
  color: var(--md-sys-color-on-surface);
  font-size: var(--md-sys-typescale-body-large-size);
  line-height: var(--md-sys-typescale-body-large-line-height);
  letter-spacing: var(--md-sys-typescale-body-large-tracking);
}

h1 {
  font-size: var(--page-title-size);
  line-height: var(--page-title-line-height);
  font-weight: var(--page-title-weight);
  color: var(--md-sys-color-on-surface);
  margin: 0 0 0.25rem;
}

h2 {
  font-size: var(--section-head-size);
  line-height: var(--section-head-line-height);
  font-weight: var(--section-head-weight);
  color: var(--md-sys-color-on-surface);
  margin: 0 0 0.5rem;
}

h3 {
  font-size: var(--md-sys-typescale-body-large-size);
  line-height: var(--md-sys-typescale-body-large-line-height);
  font-weight: var(--meta-strong-weight);
  letter-spacing: var(--md-sys-typescale-body-large-tracking);
  color: var(--md-sys-color-on-surface);
  margin: 0 0 0.5rem;
}

a {
  color: var(--md-sys-color-primary);
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ==========================================================================
   #123 Training Venues groundwork: [hidden] reliability, side-by-side date
   fields, and an end-pushed destructive-action group.
   ========================================================================== */

/* .profile-form/.emails-filters (display: grid) and .form-actions
   (display: flex) are author-styled, which beats the UA's own
   [hidden] { display: none } rule — every button-gated reveal and
   confirm-step swap added by #123 relies on toggling the hidden
   attribute, so it must always win. This only restores the UA default;
   it cannot un-hide anything that wasn't already meant to hide. */
[hidden] {
  display: none !important;
}