.ue-page {
    --ue-ink: #07172a;
    --ue-muted: #53657b;
    --ue-accent: #125ac2;
    --ue-link: #0b4d9b;
    --ue-line: #dfe7f0;
    --ue-soft: #f5f8fc;
    box-sizing: border-box;
    min-width: 0;
    max-width: 100%;
    margin: 0;
    padding: 0;
    color: var(--ue-ink);
    font-family: inherit;
    font-size: 1rem;
    line-height: 1.65;
    overflow-wrap: anywhere;
  }
  .ue-page *, .ue-page *::before, .ue-page *::after { box-sizing: inherit; }
  .ue-page h2, .ue-page h3, .ue-page a, .ue-page summary { font-family: inherit; }
  .ue-page h2 { margin: 28px 0 12px; font-size: 1.5em; line-height: 1.3; font-weight: 700; }
  .ue-page h3 { margin: 0 0 8px; font-size: 1.0625em; line-height: 1.4; font-weight: 700; }
  .ue-page .ue-intro-heading { max-width: 36ch; margin: 0 0 12px; font-size: clamp(1.5rem, 3vw, 2rem); line-height: 1.25; }
  .ue-page p { max-width: 75ch; margin: 0 0 16px; color: var(--ue-muted); }
  .ue-page .ue-lead { margin: 0 0 16px; color: var(--ue-ink); font-size: 1.125em; line-height: 1.6; }
  .ue-page .ue-context { margin: 0 0 16px; color: var(--ue-muted); }
  .ue-page ul { margin: 0 0 16px; padding-left: 20px; color: var(--ue-muted); }
  .ue-page li { margin: 6px 0; }
  .ue-page a {
    display: inline-flex;
    align-items: center;
    min-width: 44px;
    min-height: 44px;
    max-width: 100%;
    color: var(--ue-link);
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: .2em;
    vertical-align: middle;
  }
  .ue-page a:hover { color: var(--ue-accent); text-decoration-thickness: 2px; }
  .ue-page a:focus-visible, .ue-page summary:focus-visible {
    outline: 3px solid var(--ue-accent);
    outline-offset: 3px;
    border-radius: 3px;
  }
  .ue-page .ue-actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 20px 0 24px; }
  .ue-page .ue-button {
    justify-content: center;
    min-height: 44px;
    padding: 10px 16px;
    border: 1px solid var(--ue-accent);
    border-radius: 5px;
    background: var(--ue-accent);
    color: #fff;
    line-height: 1.4;
    text-align: center;
    text-decoration: none;
  }
  .ue-page .ue-button:hover { border-color: var(--ue-link); background: var(--ue-link); color: #fff; }
  .ue-page .ue-button.alt { background: transparent; color: var(--ue-link); }
  .ue-page .ue-button.alt:hover { background: var(--ue-soft); color: var(--ue-ink); }
  .ue-page .ue-related { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 28px; padding-top: 12px; border-top: 1px solid var(--ue-line); }
  .ue-page .ue-related a { padding: 8px 0; }
  .ue-page .ue-note, .ue-page .ue-alert { margin: 20px 0; padding: 16px; background: var(--ue-soft); color: var(--ue-ink); }
  .ue-page .ue-spaced { margin-top: 20px; }
  .ue-page ::selection { background: #d3e3f4; color: var(--ue-ink); }
  @media (max-width: 700px) {
    .ue-page { font-size: .9375rem; line-height: 1.6; }
    .ue-page h2 { margin-top: 20px; font-size: 1.375em; }
    .ue-page .ue-intro-heading { margin-top: 0; }
    .ue-page .ue-lead { font-size: 1.0625em; }
    .ue-page p { margin-bottom: 14px; }
    .ue-page .ue-actions { gap: 8px; margin: 16px 0 20px; }
    .ue-page .ue-actions .ue-button { flex: 1 1 100%; }
    .ue-page .ue-related { margin-top: 24px; gap: 8px 16px; }
  }
  .ue-page .ue-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 20px 0; }
  .ue-page .ue-step { min-width: 0; padding-top: 12px; border-top: 1px solid var(--ue-line); }
  .ue-page .ue-step strong { display: block; margin-bottom: 8px; color: var(--ue-link); }
  .ue-page .ue-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin: 20px 0; }
  .ue-page .ue-columns section { min-width: 0; padding-top: 12px; border-top: 1px solid var(--ue-line); }
  @media (max-width: 700px) { .ue-page .ue-steps, .ue-page .ue-columns { grid-template-columns: 1fr; gap: 16px; } }