body.proposal-page {
  scroll-padding-block: 1rem 7rem;
  min-height: 100vh;
  margin: 0;
  background: radial-gradient(circle at top, rgba(49, 98, 112, 0.22), transparent 42%), #071013;
  color: #f4f7f4;
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  overflow-x: hidden;
  overflow-y: auto;
  /* We use overscroll-behavior-y: contain to prevent pull-to-refresh and scroll chaining, without altering the natural scroll model via height: 100% or inner scrollers. */
  overscroll-behavior-y: contain;
  -webkit-overflow-scrolling: touch;
}

html:has(body.proposal-page) {
  scroll-padding-block: 1rem 7rem;
}

.proposal-page main {
  width: min(54rem, calc(100% - 2rem));
  margin: 0 auto;
  padding: max(2rem, env(safe-area-inset-top)) 0 max(4rem, env(safe-area-inset-bottom));
  overflow-wrap: anywhere;
  hyphens: auto;
}

.proposal-page a { color: #b8e5dd; }
.proposal-page h1 { max-width: 16ch; font-size: clamp(2.15rem, 7vw, 4.5rem); line-height: 0.98; margin: 0.25rem 0 1rem; }
.proposal-page h2 { margin-top: 0; }
.proposal-page .kicker { letter-spacing: 0.16em; text-transform: uppercase; font-size: 0.76rem; color: #9fb9b4; }

.proposal-intro,
.proposal-form fieldset,
.proposal-contracts {
  margin: 1.25rem 0;
  padding: clamp(1rem, 3vw, 1.5rem);
  border: 1px solid rgba(203, 234, 227, 0.2);
  border-radius: 1rem;
  background: rgba(7, 22, 25, 0.86);
  box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.18);
}

.proposal-form { display: grid; gap: 0.25rem; }
.proposal-criteria { margin: 1.25rem 0; padding: 0; border: 1px solid rgba(203, 234, 227, 0.2); border-radius: 1rem; background: rgba(7, 22, 25, 0.86); }
.proposal-criteria > summary { min-height: 3rem; padding: 1rem 1.25rem; display: flex; align-items: center; font-weight: 750; cursor: pointer; }
.proposal-criteria[open] > summary { border-bottom: 1px solid rgba(203, 234, 227, 0.16); }
.proposal-criteria > p { margin: 1rem 1.25rem 0; color: #c8d8d5; line-height: 1.55; }
.proposal-dimensions { padding: 0 1.25rem 1.25rem; }
.proposal-form .proposal-dimension { margin: 1rem 0 0; padding: 1rem; background: #0a181b; box-shadow: none; }
.proposal-dimension > p { margin: 0; color: #c8d8d5; line-height: 1.5; }
.proposal-dimension-grid { display: grid; grid-template-columns: minmax(10rem, 0.7fr) minmax(0, 1.3fr); gap: 0.9rem; }
.proposal-source-refs { display: grid; gap: 0.55rem; }
.proposal-source-refs-label { font-weight: 650; }
.proposal-source-ref-options { display: grid; grid-template-columns: repeat(auto-fit, minmax(7rem, 1fr)); gap: 0.5rem; }
.proposal-source-ref-options .check-row { min-height: 2.75rem; padding: 0.45rem 0.55rem; border: 1px solid rgba(213, 237, 232, 0.2); border-radius: 0.65rem; align-items: center; }
.proposal-form fieldset { display: grid; gap: 1rem; min-width: 0; }
.proposal-form legend { max-inline-size: 100%; padding: 0 0.5rem; font-weight: 700; font-size: 1.2rem; }
.proposal-form label { display: grid; gap: 0.4rem; min-width: 0; }
.proposal-form label > span:first-child { font-weight: 650; }
.proposal-form input,
.proposal-form textarea,
.proposal-form select {
  box-sizing: border-box;
  width: 100%;
  min-height: 2.9rem;
  padding: 0.72rem 0.82rem;
  border: 1px solid rgba(213, 237, 232, 0.28);
  border-radius: 0.7rem;
  background: #0b1b1e;
  color: inherit;
  font: inherit;
}
.proposal-form textarea { resize: vertical; }
.proposal-form input,
.proposal-form textarea,
.proposal-form select,
.proposal-form button,
.proposal-page a { scroll-margin-block: 1rem; }
.proposal-form input:focus-visible,
.proposal-form textarea:focus-visible,
.proposal-form select:focus-visible,
.proposal-form button:focus-visible,
.proposal-page a:focus-visible {
  outline: 3px solid #b8e5dd;
  outline-offset: 3px;
}
.proposal-form small { color: #b7c9c6; line-height: 1.45; }
.proposal-form [data-disabled] { opacity: 0.58; }
.proposal-form input:disabled { cursor: not-allowed; }
.proposal-grid,
.proposal-action-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0.9rem; }
.proposal-action-row { padding-top: 0.85rem; border-top: 1px solid rgba(203, 234, 227, 0.12); }
.proposal-form .presence-fieldset {
  min-width: 0;
  margin: 0;
  padding: 0.72rem 0.82rem;
  border: 1px solid rgba(213, 237, 232, 0.28);
  border-radius: 0.7rem;
  background: #0b1b1e;
  box-shadow: none;
  gap: 0.35rem;
}
.proposal-form .presence-fieldset legend { padding-inline: 0.3rem; font-size: 0.95rem; }
.proposal-form .presence-options { display: flex; flex-wrap: wrap; gap: 0.65rem 1rem; align-items: center; }
.proposal-form .presence-options .check-row { flex: 1 1 8rem; }
.proposal-form .presence-help { display: block; margin-top: 0.35rem; }
.proposal-form .check-row { grid-template-columns: 1.4rem minmax(0, 1fr); align-items: start; }
.proposal-form .check-row input { width: 1.2rem; min-height: 1.2rem; margin-top: 0.15rem; }
.proposal-controls { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: center; }
.proposal-controls button {
  min-height: 3rem;
  padding: 0.72rem 1rem;
  border: 1px solid rgba(213, 237, 232, 0.35);
  border-radius: 999px;
  font: inherit;
  font-weight: 700;
  max-inline-size: 100%;
  overflow-wrap: anywhere;
  cursor: pointer;
}
.proposal-primary { background: #d8eee8; color: #071013; }
.proposal-page .quiet-button { background: #0b1b1e; color: inherit; }
.proposal-errors { padding: 1rem; border: 2px solid #ffb4a7; border-radius: 0.8rem; background: rgba(104, 24, 20, 0.42); }
.proposal-errors ul { margin-bottom: 0; }
.proposal-status { min-height: 1.6em; font-weight: 650; }
.proposal-fallback { padding: 0.85rem 1rem; border-left: 4px solid #b8e5dd; background: rgba(184, 229, 221, 0.08); }
.proposal-contracts ul { display: grid; gap: 0.5rem; padding-left: 1.2rem; }
.proposal-contracts a { display: flex; align-items: center; min-block-size: var(--minimum-touch-target, 44px); padding: 0.45rem 0.35rem; overflow-wrap: anywhere; }
.honeypot { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; clip-path: inset(50%) !important; white-space: nowrap !important; border: 0 !important; }

@media (max-width: 42rem) {
  .proposal-grid,
  .proposal-action-row,
  .proposal-dimension-grid { grid-template-columns: 1fr; }
  .proposal-page main { width: min(100% - 1rem, 54rem); }
  .proposal-intro,
  .proposal-form fieldset,
  .proposal-criteria,
  .proposal-contracts { border-radius: 0.75rem; }
}

@media (prefers-reduced-motion: reduce) {
  .proposal-page *, .proposal-page *::before, .proposal-page *::after { scroll-behavior: auto !important; transition: none !important; animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; }
}

/* Proposal accessibility modes contract: T016 */
@media (prefers-contrast: more) {
  .proposal-intro,
  .proposal-form fieldset,
  .proposal-criteria,
  .proposal-contracts,
  .proposal-form input,
  .proposal-form textarea,
  .proposal-form select,
  .proposal-controls button,
  .proposal-errors {
    border-width: 2px;
  }

  .proposal-form input:focus-visible,
  .proposal-form textarea:focus-visible,
  .proposal-form select:focus-visible,
  .proposal-form button:focus-visible,
  .proposal-page a:focus-visible,
  .proposal-errors:focus-visible {
    outline: 4px solid #b8e5dd;
  }

  .proposal-form input:checked {
    outline: 2px solid currentColor;
    outline-offset: 2px;
  }
}

@media (forced-colors: active) {
  body.proposal-page,
  .proposal-page main,
  .proposal-intro,
  .proposal-form fieldset,
  .proposal-criteria,
  .proposal-contracts,
  .proposal-fallback {
    background: Canvas;
    color: CanvasText;
    border-color: CanvasText;
    box-shadow: none;
  }

  .proposal-page a {
    color: LinkText;
  }

  .proposal-form input,
  .proposal-form textarea,
  .proposal-form select {
    border: 2px solid FieldText;
    background: Field;
    color: FieldText;
  }

  .proposal-controls button {
    border: 2px solid ButtonText;
    background: ButtonFace;
    color: ButtonText;
  }

  .proposal-form input:focus-visible,
  .proposal-form textarea:focus-visible,
  .proposal-form select:focus-visible,
  .proposal-form button:focus-visible,
  .proposal-page a:focus-visible,
  .proposal-errors:focus-visible {
    outline: 3px solid Highlight;
    outline-offset: 3px;
  }

  .proposal-form input:checked {
    outline: 3px solid Highlight;
    outline-offset: 2px;
  }

  .proposal-form [data-disabled],
  .proposal-form :disabled {
    border-color: GrayText;
    color: GrayText;
    opacity: 1;
  }

  .proposal-errors {
    border: 3px double CanvasText;
    background: Canvas;
    color: CanvasText;
  }

  .proposal-status,
  .proposal-form small,
  .proposal-page .kicker {
    color: CanvasText;
  }
}