/* Feel-better polish · Taste civic dossier · optical alignment + interaction states */
:root {
  --feel-focus: var(--taste-red);
  --feel-ease: cubic-bezier(.2, 0, 0, 1);
}

html,
body {
  overflow-x: clip !important;
  -webkit-font-smoothing: antialiased;
}

body {
  text-wrap: pretty;
}

h1,
h2,
h3,
h4,
p {
  min-width: 0;
}

h1,
h2,
h3,
h4 {
  text-wrap: balance;
  overflow-wrap: normal;
  word-break: normal;
}

header > div,
nav > div,
header > div > a,
section#email-action > div,
section#email-action input,
section#email-action textarea,
body:not(:has(#email-action)) main input,
body:not(:has(#email-action)) main textarea {
  min-width: 0;
}

/* Nested header navs should not create a second full-width underline. */
header > div > nav {
  border-bottom: 0 !important;
}

nav a,
nav button,
header a,
header button,
main a,
main button,
footer a {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}

button,
a,
input,
textarea {
  transition-property: background-color, border-color, color, box-shadow, transform;
  transition-duration: .16s;
  transition-timing-function: var(--feel-ease);
}

button:active,
a.btn:active,
a[href="#email-action"]:active {
  transform: scale(.96);
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--feel-focus) !important;
  outline-offset: 2px;
}

button:disabled,
[aria-disabled="true"] {
  opacity: .55;
  cursor: not-allowed;
}

section#email-action [class*="sm:flex-row"] {
  align-items: center;
}

section#email-action input,
section#email-action textarea,
body:not(:has(#email-action)) main input,
body:not(:has(#email-action)) main textarea {
  min-height: 46px;
  line-height: 1.55;
}

section#email-action textarea,
body:not(:has(#email-action)) main textarea {
  min-height: 320px;
}

body > header > div > a.text-primary {
  color: #fff !important;
}

/* Shared civic chrome: keep the brand and active route legible on navy. */
.site-shell-logo,
nav a.text-primary,
header a.text-primary,
nav a[class*="border-primary"],
header a[class*="border-primary"],
nav li[class*="border-primary"] > a,
header li[class*="border-primary"] > a {
  color: #fff !important;
  opacity: 1 !important;
}

/* Canonical top navigation: one geometry and one active treatment on all pages. */
.site-shell {
  position: sticky !important;
  top: 0;
  z-index: 50;
  width: 100%;
  background: var(--taste-ink) !important;
  border-bottom: 1px solid rgba(255, 255, 255, .2) !important;
  box-shadow: 0 8px 24px rgba(11, 31, 51, .12) !important;
}

.site-shell > .site-shell-inner {
  display: grid !important;
  grid-template-columns: minmax(0, auto) minmax(0, 1fr) auto;
  align-items: center;
  gap: 1rem;
  width: 100%;
  max-width: 1200px;
  min-height: 72px !important;
  height: 72px;
  margin: 0 auto;
  padding: 0 1.5rem;
}

.site-shell-logo {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  min-height: 44px;
  color: #fff !important;
  font-family: "Noto Sans", sans-serif !important;
  font-size: 1.125rem !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
  letter-spacing: -.02em !important;
  text-decoration: none;
  white-space: nowrap;
}

.site-shell-nav {
  display: none;
  align-items: center;
  justify-content: flex-end;
  gap: clamp(.75rem, 1.6vw, 1.5rem);
  min-width: 0;
  height: 100%;
}

.site-shell-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 !important;
  border: 0 !important;
  color: #d9e5ee !important;
  font-family: "Noto Sans", sans-serif !important;
  font-size: .875rem !important;
  line-height: 1.25rem !important;
  font-weight: 700 !important;
  letter-spacing: .025em !important;
  text-decoration: none;
  white-space: nowrap;
  transition-property: color, opacity !important;
  transition-duration: .16s !important;
}

.site-shell-link::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 2px;
  background: transparent;
}

.site-shell-link:hover,
.site-shell-link.is-active {
  color: #fff !important;
}

.site-shell .site-shell-nav .site-shell-link.is-active::after,
.site-shell .site-shell-nav .site-shell-link[aria-current="page"]::after {
  display: block !important;
  background: var(--taste-line) !important;
  opacity: 1 !important;
}

.site-shell-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.site-shell-language {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 60px;
  min-height: 44px;
  padding: 0 .75rem !important;
  border: 1px solid rgba(255, 255, 255, .55) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #fff !important;
  font-family: "Noto Sans", sans-serif !important;
  font-size: .875rem !important;
  line-height: 1.25rem !important;
  font-weight: 800 !important;
  letter-spacing: .025em !important;
}

.site-shell-language:hover {
  background: rgba(255, 255, 255, .1) !important;
}

@media (min-width: 768px) {
  .site-shell-logo {
    font-size: 1.5rem !important;
  }
}

@media (min-width: 1024px) {
  .site-shell-logo {
    font-size: 2rem !important;
  }

  .site-shell-nav {
    display: flex;
  }
}

/* Content headers are not the dark site chrome. Restore the paper/ink contrast. */
main header {
  min-height: 0 !important;
  background: transparent !important;
  color: var(--taste-ink) !important;
  border-bottom: 0 !important;
}

main header h1,
main header h2,
main header h3 {
  color: var(--taste-ink) !important;
}

main header p,
main header span {
  color: var(--taste-muted) !important;
}

/* Shared action-page title block, based on the established s.131 treatment. */
.taste-page-title {
  display: block;
  width: 100%;
  max-width: 1200px;
  margin-bottom: 2.5rem !important;
}

.taste-step-label {
  display: inline-block;
  margin-bottom: .5rem;
  color: var(--taste-muted) !important;
  font-size: .875rem;
  line-height: 1.25rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.taste-page-title h1 {
  margin-bottom: 1rem !important;
  border-left: 6px solid var(--taste-red) !important;
  padding-left: 20px !important;
  color: var(--taste-ink) !important;
  font-weight: 900 !important;
  text-wrap: balance;
}

.taste-page-title h1 span {
  color: inherit !important;
  font: inherit;
}

.taste-page-title p {
  max-width: 48rem;
  margin: 0;
  line-height: 1.75;
}

/* Shared action guide, using the s.131 card as the canonical treatment. */
.taste-action-guide {
  width: 100%;
  height: auto !important;
  padding: 1.5rem !important;
  background: var(--taste-panel) !important;
  border: 1px solid var(--taste-line) !important;
  border-top: 4px solid var(--taste-red) !important;
  border-radius: 0 !important;
  box-shadow: var(--taste-shadow) !important;
}

.taste-guide-title {
  display: flex !important;
  width: 100%;
  align-items: center;
  gap: .75rem;
  margin: 0 0 1.5rem !important;
  padding: 0 0 1rem !important;
  border-bottom: 1px solid var(--taste-line) !important;
  color: var(--taste-ink) !important;
  font-size: 1.5rem !important;
  line-height: 1.35 !important;
  font-weight: 900 !important;
}

.taste-guide-title .material-symbols-outlined {
  color: var(--taste-ink) !important;
  font-size: 1.75rem !important;
  flex: 0 0 auto;
}

.taste-guide-list {
  position: relative;
  display: flex !important;
  flex-direction: column !important;
  gap: 2rem !important;
  margin: 0 0 0 .75rem !important;
  padding: 0 0 0 1.5rem !important;
  border-left: 1px solid var(--taste-line) !important;
  list-style: none !important;
}

.taste-guide-list > .taste-guide-decorative-line {
  display: none !important;
}

.taste-guide-step {
  position: relative;
  display: block !important;
  min-width: 0;
  margin: 0 !important;
  padding: 0 0 0 1.5rem !important;
}

.taste-guide-number {
  position: absolute !important;
  left: -0.75rem !important;
  top: 0;
  z-index: 1;
  width: 1.5rem !important;
  height: 1.5rem !important;
  min-height: 1.5rem !important;
  flex: 0 0 1.5rem !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  padding: 0 !important;
  border: 0 !important;
  border-top: 4px solid var(--taste-red) !important;
  border-radius: 0 !important;
  background: var(--taste-panel) !important;
  color: var(--taste-ink) !important;
  font-size: 1rem !important;
  line-height: 1.5rem !important;
  box-shadow: 0 0 0 4px var(--taste-panel);
}

.taste-guide-copy {
  min-width: 0;
  padding: 0 !important;
}

.taste-guide-step-title,
.taste-guide-step > h3,
.taste-guide-step > h4 {
  display: block;
  margin: 0 0 .25rem !important;
  color: var(--taste-ink) !important;
  font-size: 1rem !important;
  line-height: 1.4 !important;
  font-weight: 800 !important;
}

.taste-guide-step-description,
.taste-guide-step > p,
.taste-guide-copy > p {
  margin: 0 !important;
  color: var(--taste-muted) !important;
  font-size: 1rem !important;
  line-height: 1.7 !important;
  text-wrap: pretty;
}

.taste-guide-step-description:empty {
  display: none;
}

@media (min-width: 1024px) {
  .delegation-layout .delegation-content-host {
    display: contents;
  }

  .delegation-layout .delegation-guide-card {
    grid-column: 1 / span 4;
    grid-row: 1;
  }

  .delegation-layout .delegation-template-card {
    grid-column: 5 / -1;
    grid-row: 1 / span 2;
  }

  .delegation-layout .delegation-advice-column {
    grid-column: 1 / span 4;
    grid-row: 2;
  }

  .foi-flow-layout {
    display: grid !important;
    grid-template-columns: minmax(0, .82fr) minmax(0, 1.55fr);
    gap: 1.5rem;
    align-items: start;
  }

  .foi-flow-layout > .foi-context-image {
    grid-column: 2;
    grid-row: 1;
  }

  .foi-flow-layout > .taste-action-guide {
    grid-column: 1;
    grid-row: 1 / span 2;
  }
}

@media (max-width: 1023px) {
  .foi-flow-layout > .foi-context-image {
    order: 0;
  }

  .foi-flow-layout > .taste-action-guide {
    order: 1;
  }
}

.page-shell {
  width: 100%;
  max-width: 1200px !important;
  margin-inline: auto;
}

/* SHARED SHARE BAR CANONICAL
   One geometry and one interaction language across all seven pages. */
.site-share-bar.site-share-bar-canonical {
  position: relative;
  left: 50%;
  width: min(1200px, calc(100vw - 3rem)) !important;
  max-width: none !important;
  margin: 2rem 0 0 !important;
  padding: 2rem 0 0 !important;
  transform: translateX(-50%);
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 2rem;
  box-sizing: border-box;
  border-top: 1px solid var(--taste-line) !important;
}

.site-share-copy {
  min-width: 0;
  min-height: 3.75rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.site-share-copy h4 {
  margin: 0 0 .25rem !important;
  color: var(--taste-ink) !important;
  font-size: 1.5rem !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  text-wrap: balance;
}

.site-share-copy p {
  margin: 0 !important;
  color: var(--taste-muted) !important;
  font-size: 1rem !important;
  line-height: 1.6 !important;
  text-wrap: pretty;
}

.site-share-return {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 1.5rem;
  flex-wrap: wrap;
}

.site-share-return > a {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

.site-share-kicker {
  color: var(--taste-muted) !important;
  font-weight: 700;
}

.site-share-actions {
  width: auto !important;
  min-width: 0;
  margin: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(2, 12.5rem);
  align-items: stretch;
  justify-content: end;
  gap: 1rem !important;
}

.site-share-button {
  width: 12.5rem !important;
  min-width: 12.5rem !important;
  height: 3.5rem;
  min-height: 3.5rem;
  padding: 0 1.25rem !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: .625rem !important;
  border: 1px solid var(--taste-line) !important;
  border-radius: 0 !important;
  background: var(--taste-paper) !important;
  color: var(--taste-ink) !important;
  box-shadow: none !important;
  font-family: "Noto Sans", sans-serif !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  white-space: nowrap;
  cursor: pointer;
  transition-property: background-color, border-color, color, transform !important;
  transition-duration: 140ms !important;
  transition-timing-function: ease-out !important;
}

.site-share-button:hover {
  border-color: var(--taste-ink) !important;
  background: var(--taste-panel) !important;
}

.site-share-button:focus-visible {
  outline: 3px solid var(--taste-red) !important;
  outline-offset: 3px;
}

.site-share-button:active {
  transform: scale(.96);
}

.site-share-button:disabled {
  opacity: .52;
  cursor: not-allowed;
}

.site-share-button .share-icon {
  flex: 0 0 auto;
  color: currentColor;
  font-size: 1.25rem !important;
  line-height: 1 !important;
}

.site-next-step {
  width: 100%;
  display: flex;
  justify-content: flex-end;
  margin-top: 1.5rem;
}

.site-next-step > a {
  width: auto;
  max-width: 100%;
  min-height: 5.375rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.5rem !important;
  border: 1px solid var(--taste-line) !important;
  border-radius: 0 !important;
  background: var(--taste-paper) !important;
  color: var(--taste-ink) !important;
  text-align: right;
  transition-property: background-color, border-color, box-shadow, color !important;
  transition-duration: .2s !important;
  transition-timing-function: ease !important;
}

.site-next-step > a:hover {
  border-color: var(--taste-ink) !important;
  background: var(--taste-panel) !important;
  box-shadow: 0 4px 12px rgba(4, 22, 50, .05) !important;
}

.site-next-step > a > div:first-child:not(.absolute) {
  min-width: 0;
}

.site-next-step > a > div:last-child,
.site-next-step > a > .material-symbols-outlined {
  width: 3rem !important;
  height: 3rem !important;
  flex: 0 0 3rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0 !important;
  background: #e8edf2 !important;
  color: var(--taste-ink) !important;
}

.site-next-step > a > div:last-child .material-symbols-outlined {
  width: auto !important;
  height: auto !important;
  background: transparent !important;
  color: inherit !important;
  font-size: 1.75rem !important;
}

.site-next-step > a > .material-symbols-outlined {
  font-size: 1.75rem !important;
}

/* s.82 keeps privacy/instructions in the rail while the petition remains the focus. */
.petition-layout {
  display: flex;
  flex-direction: column;
  gap: 3rem;
}

@media (min-width: 1024px) {
  .petition-layout {
    display: grid;
    grid-template-columns: minmax(0, .82fr) minmax(0, 1.55fr);
    column-gap: 2rem;
    row-gap: 2rem;
  }

  .petition-layout > header,
  .petition-layout > .site-share-bar,
  .petition-layout > .site-next-step {
    grid-column: 1 / -1;
  }

  .petition-layout > header {
    grid-row: 1;
  }

  .petition-layout > .petition-info-grid {
    display: contents !important;
  }

  .petition-privacy-card {
    grid-column: 1;
    grid-row: 2;
  }

  .petition-instructions-card {
    grid-column: 1;
    grid-row: 3;
  }

  .petition-template-area {
    grid-column: 2;
    grid-row: 2 / span 2;
    max-width: none !important;
    margin-inline: 0 !important;
  }
}

main > section:nth-of-type(2) > div > div:focus-within,
body:not(:has(#email-action)) main > section:nth-of-type(2) > div > div:focus-within {
  box-shadow: 0 0 0 2px rgba(184, 59, 50, .22), var(--taste-shadow) !important;
}

main > section:nth-of-type(2) span.material-symbols-outlined,
main button span.material-symbols-outlined,
main a span.material-symbols-outlined {
  line-height: 1;
  transform: translateY(1px);
}

@media (max-width: 767px) {
  nav[class~="!flex"] > div {
    height: auto !important;
    flex-wrap: wrap;
    row-gap: 4px;
  }

  nav[class~="!flex"] > div > div[class~="hidden"],
  nav[class~="!flex"] > div > ul[class~="hidden"] {
    display: flex !important;
    order: 3;
    flex-basis: 100%;
    justify-content: flex-start;
    gap: 14px;
    min-width: 0;
    max-width: 100%;
    overflow-x: auto;
    padding: 2px 0 3px;
    scrollbar-width: none;
  }

  nav[class~="!flex"] > div > div[class~="hidden"]::-webkit-scrollbar,
  nav[class~="!flex"] > div > ul[class~="hidden"]::-webkit-scrollbar {
    display: none;
  }

  body:not(:has([data-mobile-menu])) > nav > div,
  body:not(:has([data-mobile-menu])) > header > div {
    height: auto !important;
    flex-wrap: wrap;
    row-gap: 4px;
    padding-top: 8px;
    padding-bottom: 8px;
  }

  body:not(:has([data-mobile-menu])) > nav > div > div:first-child,
  body:not(:has([data-mobile-menu])) > header > div > div:first-child {
    font-size: 24px !important;
    line-height: 1.1 !important;
  }

  body:not(:has([data-mobile-menu])) > nav > div > div[class~="hidden"],
  body:not(:has([data-mobile-menu])) > header > div > nav[class~="hidden"] {
    display: flex !important;
    order: 3;
    flex-basis: 100%;
    justify-content: flex-start;
    gap: 14px;
    min-width: 0;
    max-width: 100%;
    overflow-x: auto;
    padding: 2px 0 3px;
    scrollbar-width: none;
  }

  body:not(:has([data-mobile-menu])) > nav > div > div[class~="hidden"]::-webkit-scrollbar,
  body:not(:has([data-mobile-menu])) > header > div > nav[class~="hidden"]::-webkit-scrollbar {
    display: none;
  }

  nav a,
  nav button,
  header a,
  header button {
    min-height: 40px;
  }

  main a,
  main button,
  footer a {
    white-space: nowrap;
  }

  .foi-submit-link a {
    white-space: normal;
  }

  .page-shell {
    padding-inline: 16px !important;
  }

  .site-share-bar.site-share-bar-canonical {
    width: calc(100vw - 2rem) !important;
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
    gap: 1.25rem;
    padding-top: 1.5rem !important;
  }

  .site-share-actions {
    width: 100% !important;
    justify-content: stretch;
  }

  .site-share-button {
    width: 100% !important;
    min-width: 0 !important;
  }

  .site-next-step {
    justify-content: stretch;
  }

  .site-next-step > a {
    width: 100%;
    justify-content: space-between;
    white-space: normal;
  }

  .petition-info-grid {
    grid-template-columns: 1fr !important;
  }

  .taste-page-title {
    margin-bottom: 2rem !important;
  }

  .taste-page-title h1 {
    border-left-width: 4px !important;
    padding-left: 14px !important;
  }
}

/* Rescind page: keep the title and working area visually connected. */
.rescind-page {
  gap: 1.5rem !important;
}

.rescind-page > .taste-page-title {
  margin-bottom: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.rescind-page .taste-email-recipient {
  flex: 1 1 auto;
  width: 100%;
  min-height: 2.75rem;
  padding: .65rem .8rem;
  border: 1px solid var(--taste-line);
  border-radius: 0;
  background: var(--taste-panel);
  color: var(--taste-ink);
  font: 500 .95rem/1.4 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

.rescind-page .taste-email-recipient::placeholder {
  color: var(--taste-muted);
  opacity: 1;
}

.rescind-page .taste-email-recipient:focus-visible {
  outline: 3px solid rgba(191, 61, 54, .24);
  outline-offset: 2px;
  border-color: var(--taste-red);
}

.rescind-page .taste-email-placeholder {
  display: inline-block;
  padding: .08rem .35rem;
  background: #f7b6b1;
  color: var(--taste-ink);
  font-weight: 800;
}

/* Email signature reminders use the S.131 treatment on every template. */
.taste-email-signature-reminder {
  margin: .75rem 0 0;
  padding: .55rem .75rem;
  border-left: 4px solid var(--taste-red);
  background: #f7b6b1;
  color: var(--taste-ink);
  font: 800 .875rem/1.5 ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* Delegation page: do not stretch the template across the advice row. */
.delegation-template-card {
  align-self: start !important;
  height: auto !important;
  min-height: 0 !important;
}

@media (min-width: 1024px) {
  .delegation-layout .delegation-template-card {
    grid-row: 1 !important;
  }
}

/* FOI page: keep the strategy and submission flow in the left rail while
   the request template occupies the right column. */
.foi-page .foi-template-card {
  align-self: start !important;
  height: auto !important;
  min-height: 0 !important;
}

.foi-page #copyBtn {
  cursor: pointer;
  transition: background-color .18s ease, color .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.foi-page #copyBtn:hover {
  background: var(--taste-ink) !important;
  border-color: var(--taste-ink) !important;
  color: #fff !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(4, 22, 50, .12);
}

.foi-page #copyBtn:active {
  transform: translateY(1px);
  box-shadow: none;
}

.foi-page #copyBtn.bg-on-tertiary-container {
  background: #dbece2 !important;
  border-color: #8bb39a !important;
  color: var(--taste-ink) !important;
}

@media (min-width: 1024px) {
  .foi-page {
    display: grid !important;
    grid-template-columns: minmax(0, .82fr) minmax(0, 1.55fr);
    gap: 1.5rem;
    align-items: start;
  }

  .foi-page > .taste-page-title,
  .foi-page > .site-share-bar {
    grid-column: 1 / -1;
  }

  .foi-page > .taste-page-title {
    grid-row: 1;
  }

  .foi-page > .foi-advisory-panel {
    grid-column: 1;
    grid-row: 2;
    margin: 0 !important;
  }

  .foi-page > .foi-content-layout {
    display: contents;
  }

  .foi-page .foi-template-card {
    grid-column: 2;
    grid-row: 2 / span 2;
  }

  .foi-page .foi-flow-layout {
    display: flex !important;
    grid-column: 1;
    grid-row: 3;
    flex-direction: column !important;
    gap: 1.5rem !important;
    margin: 0 !important;
  }

  .foi-page > .site-share-bar {
    grid-row: 4;
    margin: 0 !important;
  }
}

/* Petition-specific structure: keep the page title on the paper surface. */
main header.taste-page-title {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.petition-privacy-card {
  width: 100% !important;
  min-width: 0;
  max-width: none !important;
  overflow: hidden;
}

.petition-privacy-card > div:last-child {
  margin-top: 0 !important;
}

.petition-privacy-card > p,
.petition-privacy-card > div:last-child,
.petition-privacy-card > div:last-child p {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.petition-template-area {
  align-self: start !important;
  height: auto !important;
  min-height: 0 !important;
}

.taste-petition-letterhead,
.taste-petition-subject,
.taste-petition-body-copy {
  min-width: 0;
  border: 1px solid var(--taste-line) !important;
  background: var(--taste-panel) !important;
}

.taste-petition-letterhead {
  padding: 1rem 1.25rem;
  border-left: 4px solid var(--taste-ink) !important;
}

.taste-petition-letterhead p {
  margin: 0;
  overflow-wrap: anywhere;
}

.taste-petition-letterhead p:first-child {
  margin-bottom: .5rem;
  color: var(--taste-muted) !important;
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.taste-petition-subject {
  padding: 1rem 1.25rem !important;
  border-left: 4px solid var(--taste-red) !important;
  overflow-wrap: anywhere;
}

.taste-petition-subject p {
  margin: 0;
}

.taste-petition-subject strong {
  display: inline-block;
  min-width: 5rem;
  color: var(--taste-ink) !important;
}

.taste-petition-body-copy {
  padding: 1rem 1.25rem;
}

.taste-petition-body-copy > p {
  overflow-wrap: anywhere;
}

.taste-petition-body-copy > p:last-child {
  margin-bottom: 0;
}

.taste-petition-signatory {
  min-width: 0;
}

.taste-petition-signatory form {
  min-width: 0;
  padding: 1rem;
  border: 1px solid var(--taste-line);
  background: var(--taste-paper);
}

.taste-petition-signatory input {
  min-width: 0;
  width: 100%;
  background: var(--taste-panel) !important;
  border-radius: 0 !important;
}

.site-share-actions > button {
  display: inline-flex !important;
  align-items: center;
  gap: .5rem;
}

.site-share-actions > button .share-icon {
  flex: 0 0 auto;
  font-size: 1.25rem !important;
  line-height: 1 !important;
}

@media (max-width: 599px) {
  .site-share-actions {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (prefers-reduced-motion: reduce) {
  .site-share-button {
    transition-duration: 0.01ms !important;
  }

  .site-share-button:active {
    transform: none;
  }
}

@media (min-width: 1024px) {
  .petition-privacy-card,
  .petition-instructions-card {
    width: 100% !important;
    min-width: 0;
  }
}

/* S.82: keep the left rail wide enough for its privacy and instruction copy
   at desktop widths instead of allowing the fractional track to collapse. */
@media (min-width: 1024px) {
  .petition-layout {
    grid-template-columns: minmax(22rem, .95fr) minmax(0, 1.55fr) !important;
  }

  .petition-layout .petition-info-grid {
    min-width: 0;
  }

  .petition-layout .petition-privacy-card,
  .petition-layout .petition-instructions-card {
    width: 100% !important;
    max-width: none !important;
    min-width: 0;
    box-sizing: border-box;
  }

  /* S.82: let the privacy card size to its content instead of stretching
     to the taller template row; the warning should follow the copy. */
  .petition-layout .petition-privacy-card {
    align-self: start !important;
  }

}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Email and document templates share the delegation page treatment. */
.taste-email-template {
  width: 100%;
  min-width: 0;
  padding: 0 !important;
  background: var(--taste-panel) !important;
  border: 1px solid var(--taste-line) !important;
  border-top: 1px solid var(--taste-line) !important;
  border-radius: 0 !important;
  box-shadow: var(--taste-shadow) !important;
  overflow: hidden;
}

.taste-email-template-header {
  background: var(--taste-paper) !important;
  border-bottom: 1px solid var(--taste-line) !important;
  border-radius: 0 !important;
  padding: 1.5rem !important;
}

.taste-email-template-meta {
  background: var(--taste-paper) !important;
  border-bottom: 1px solid var(--taste-line) !important;
  padding: 1.5rem !important;
}

.taste-email-meta-row {
  min-width: 0;
  align-items: center !important;
  gap: 1rem !important;
  min-height: 3.4375rem;
  border-bottom: 1px solid var(--taste-line) !important;
  padding-bottom: .5rem;
}

.taste-email-meta-row:last-child {
  border-bottom: 0 !important;
  padding-bottom: 0;
}

.taste-email-meta-label {
  flex: 0 0 6rem;
  min-width: 0;
}

.taste-email-meta-value,
.taste-email-recipient {
  display: flex !important;
  align-items: center;
  flex: 1 1 auto;
  width: 100% !important;
  min-width: 0;
  min-height: 2.875rem;
  overflow-wrap: anywhere;
  background: var(--taste-panel) !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: .65rem 1rem !important;
  color: var(--taste-ink) !important;
  font-family: "Noto Sans", system-ui, sans-serif !important;
  font-size: 1rem !important;
  line-height: 1.55 !important;
}

.taste-email-body {
  display: flex;
  flex-direction: column;
  gap: .75rem;
  min-width: 0;
  padding: 1.5rem !important;
  background: var(--taste-panel) !important;
}

.taste-email-message,
.taste-email-editor {
  display: block;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  border: 1px solid var(--taste-line) !important;
  border-radius: 0 !important;
  background: var(--taste-panel) !important;
  color: var(--taste-ink) !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important;
  font-size: .875rem !important;
  line-height: 1.7 !important;
  text-wrap: pretty;
}

.taste-email-message {
  padding: 1rem !important;
  max-height: none !important;
  overflow-y: visible !important;
}

.taste-email-editor {
  width: 100%;
  min-height: 20rem;
  padding: 1rem !important;
  overflow-y: hidden !important;
  resize: none;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  cursor: text;
}

.taste-email-placeholder,
.taste-email-signature-marker {
  display: inline-block;
  padding: .08rem .35rem;
  border-radius: 0 !important;
  background: #f7b6b1 !important;
  color: var(--taste-ink) !important;
  font-weight: 800 !important;
}

.taste-email-signature-reminder {
  margin: .75rem 0 0;
  padding: .25rem 0;
  border-left: 0;
  background: transparent;
  color: var(--taste-red);
  font: 800 .875rem/1.5 ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.taste-email-signature-reminder .taste-email-signature-marker {
  display: inline;
  margin-right: 0;
  padding: 0;
  background: transparent !important;
  color: inherit !important;
  font-weight: inherit !important;
}

.taste-email-meta-value:focus,
.taste-email-editor:focus,
.taste-email-editor[contenteditable="true"]:focus {
  outline: 2px solid rgba(184, 59, 50, .25) !important;
  outline-offset: 1px;
}

.taste-email-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 1rem;
  min-width: 0;
  background: var(--taste-paper) !important;
  border-top: 1px solid var(--taste-line) !important;
  padding: 1rem 1.5rem !important;
}

.taste-email-actions button {
  min-width: 10rem;
  min-height: 3.5rem;
  border-radius: 0 !important;
  font-family: inherit;
  transition-property: background-color, border-color, color, box-shadow, transform !important;
  transition-duration: .18s !important;
  transition-timing-function: ease-out !important;
}

.taste-email-actions button:hover {
  transform: translateY(-1px);
}

.taste-email-copy {
  background: transparent !important;
  border: 1px solid var(--taste-ink) !important;
  color: var(--taste-ink) !important;
}

.taste-email-send {
  background: var(--taste-ink) !important;
  border-color: var(--taste-ink) !important;
  color: #fff !important;
}

body main .taste-email-template .taste-email-copy.taste-email-copy {
  border: 1px solid var(--taste-ink) !important;
  border-top: 1px solid var(--taste-ink) !important;
}

.taste-email-template-title {
  position: static !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 1.25rem 1.5rem !important;
  overflow: visible !important;
  clip: auto !important;
  clip-path: none !important;
  white-space: normal !important;
  background: var(--taste-paper) !important;
  border-bottom: 1px solid var(--taste-line) !important;
  color: var(--taste-ink) !important;
  font-size: 1.25rem !important;
  line-height: 1.35 !important;
  font-weight: 800 !important;
}

.taste-email-accent {
  display: none !important;
}

body:not(:has(#email-action)) main > section:nth-child(2) .taste-email-template.taste-email-template {
  border-top: 1px solid var(--taste-line) !important;
}

.petition-template-area > .taste-email-body {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important;
  font-size: .875rem !important;
  line-height: 1.7 !important;
}

@media (max-width: 767px) {
  .taste-email-template-meta,
  .taste-email-body,
  .taste-email-actions {
    padding: 1rem !important;
  }

  .taste-email-meta-row {
    flex-direction: column !important;
    gap: .35rem !important;
  }

  .taste-email-meta-label {
    flex-basis: auto;
    width: auto !important;
  }

  .taste-email-meta-value {
    width: 100% !important;
  }

  .taste-email-recipient {
    width: 100% !important;
  }

  .taste-email-actions button {
    width: 100% !important;
    min-width: 0;
  }
}

/* Homepage roadmap: each step has an explicit, keyboard-accessible guide link
   and both desktop rows share one calm, even rhythm. */
.homepage-action-card {
  height: 100%;
}

.homepage-action-link {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  align-self: flex-end;
  width: fit-content;
  margin-left: auto;
  margin-top: auto;
  padding-top: .5rem;
  color: var(--taste-ink);
  font-size: .9rem;
  font-weight: 800;
  text-decoration: none;
  border-bottom: 1px solid currentColor;
}

.homepage-action-link:hover {
  color: var(--taste-red);
}

.homepage-action-link:focus-visible {
  outline: 3px solid rgba(191, 61, 54, .28);
  outline-offset: 3px;
}

@media (min-width: 1024px) {
  .homepage-action-grid {
    grid-template-rows: repeat(2, minmax(0, 1fr));
  }
}

/* Keep the exact placeholder named in send warnings visually consistent. */
.taste-email-signature-marker {
  margin-right: .25rem;
}

/* S.82: keep the two left-rail cards in a single content-sized stack.  A
   spanning template previously caused the grid to distribute its height into
   the two rail rows, leaving a large artificial gap between these cards. */
@media (min-width: 1024px) {
  .petition-layout > .petition-info-grid {
    display: flex !important;
    grid-column: 1;
    grid-row: 2;
    align-self: start;
    flex-direction: column;
    gap: 1.5rem !important;
  }

  .petition-layout .petition-privacy-card,
  .petition-layout .petition-instructions-card {
    grid-column: auto;
    grid-row: auto;
    margin: 0 !important;
  }

  .petition-layout .petition-template-area {
    grid-column: 2;
    grid-row: 2;
  }
}

/* Delegation: the guide and speaking advice form the left rail; the complete
   registration template stays visible in the right column. */
@media (min-width: 1024px) {
  .delegation-layout .delegation-guide-card {
    grid-column: 1 / span 4;
    grid-row: 1;
    align-self: start;
  }

  .delegation-layout .delegation-advice-column {
    grid-column: 1 / span 4;
    grid-row: 2;
  }

  .delegation-layout .delegation-template-card {
    grid-column: 5 / -1;
    grid-row: 1 / span 2 !important;
  }
}

.delegation-advice-column > div {
  background: var(--taste-panel) !important;
}

/* Footer navigation: a consistent two-row civic footer, without flex shrink. */
footer {
  padding: 0 !important;
}

footer > div {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.25rem !important;
  width: min(100%, 1280px) !important;
  max-width: 1280px !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  padding: 2.5rem clamp(1.5rem, 4vw, 4rem) !important;
  border-bottom: 0 !important;
}

footer .site-footer-brand {
  min-width: 0;
}

footer .site-footer-brand,
footer .site-footer-brand *,
footer .site-footer-links,
footer .site-footer-links * {
  font-family: "Noto Sans", sans-serif !important;
}

footer .site-footer-links {
  display: flex !important;
  align-items: center;
  justify-content: flex-start;
  gap: 2rem !important;
  width: 100%;
  margin: 0 !important;
  padding: .75rem 0 0 !important;
  border-top: 1px solid rgba(255, 255, 255, .24);
  border-right: 0 !important;
  border-bottom: 0 !important;
  border-left: 0 !important;
  box-shadow: none !important;
}

footer .site-footer-links::after {
  display: none !important;
  content: none !important;
}

footer .site-footer-links a {
  color: rgba(255, 255, 255, .88) !important;
  font-family: inherit;
  font-size: .9375rem !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  text-decoration: none !important;
  transition: color .18s ease-out, opacity .18s ease-out !important;
}

footer .site-footer-links a:hover {
  color: #fff !important;
  opacity: .72;
}

footer .site-footer-links a:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 4px;
}

@media (max-width: 767px) {
  footer > div {
    padding-block: 2rem !important;
    text-align: center;
  }

  footer .site-footer-brand {
    text-align: center !important;
  }

  footer .site-footer-links {
    justify-content: center;
    column-gap: 1.5rem !important;
    row-gap: .75rem !important;
  }
}