@font-face {
  font-family: "Onest Workbench";
  src: url("/workbench/public/fonts/onest-latin-variable.woff2") format("woff2-variations");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

@font-face {
  font-family: "Newsreader Workbench";
  src: url("/workbench/public/fonts/newsreader-latin-variable.woff2") format("woff2-variations");
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
}

:root {
  color-scheme: light;
  --bg: #f3efe9;
  --paper: #fffdf9;
  --panel: #fff;
  --ink: #241b17;
  --muted: #746860;
  --line: #ded5cd;
  --line-soft: #ece6e0;
  --brown: #6b4436;
  --brown-dark: #432722;
  --brown-light: #a7735e;
  --clay: #c96c47;
  --cream: #f4e9dc;
  --green: #3f765d;
  --amber: #b87927;
  --red: #a7483f;
  --focus: rgba(107, 68, 54, .16);
  --shadow: 0 18px 48px rgba(57, 39, 31, .1);
  --font-body: "Onest Workbench", "Avenir Next", ui-sans-serif, sans-serif;
  --font-display: "Newsreader Workbench", Iowan Old Style, serif;
  font-family: var(--font-body);
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  min-width: 320px;
  background: var(--bg);
  color: var(--ink);
}

body {
  min-height: 100vh;
}

button,
input,
select {
  font: inherit;
}

button,
select {
  cursor: pointer;
}

button {
  color: inherit;
}

[hidden] {
  display: none !important;
}

h1,
h2,
h3,
p {
  margin: 0;
}

h1,
h2,
h3,
.tool-title strong,
.panel-heading h3,
.card-heading h3,
.advisor-heading h3,
.empty-compare span {
  font-family: var(--font-display);
  font-weight: 620;
}

button,
h1,
h2,
h3,
.tool-title strong,
.tool-link strong,
.input-section>.section-heading span,
.simulation-type b {
  text-transform: capitalize;
}

button {
  font-weight: 680;
  letter-spacing: -.01em;
}

svg {
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 1000;
  display: grid;
  grid-template-columns: minmax(220px, 1fr) max-content minmax(220px, 1fr);
  grid-template-rows: auto;
  gap: 3px 24px;
  align-items: start;
  padding: 13px clamp(16px, 3vw, 34px);
  border-bottom: 1px solid rgba(67, 39, 34, .16);
  background: rgba(255, 255, 255, .97);
  box-shadow: 0 9px 30px rgba(57, 39, 31, .07);
  backdrop-filter: blur(18px);
}

.brand-block {
  --brand-icon-layout-size: 42px;
  --brand-lockup-gap: 13px;
  position: relative;
  display: grid;
  grid-column: 1;
  grid-row: 1;
  grid-template-columns: max-content;
  align-content: start;
  align-items: start;
  justify-self: start;
  width: fit-content;
  gap: 5px;
  min-width: 0;
}

.brand-lockup {
  display: flex;
  align-items: center;
  gap: var(--brand-lockup-gap);
  min-width: 0;
}

.brand-icon {
  display: block;
  width: var(--brand-icon-layout-size);
  height: var(--brand-icon-layout-size);
  flex: 0 0 auto;
}

.brand-icon-link,
.brand-wordmark-link {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  text-decoration: none;
}

.brand-icon-link {
  display: flex;
  flex: 0 0 auto;
  width: fit-content;
  border-radius: 10px;
}

.brand-wordmark-link {
  display: block;
  width: fit-content;
  border-radius: 6px;
  font: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  text-transform: none;
}

.brand-icon-link:focus-visible,
.brand-wordmark-link:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 4px var(--focus);
}

.brand-wordmark {
  margin: 0;
  color: #102c2d;
  font-family: "Avenir Next", Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: clamp(29px, 1.35vw, 40px);
  font-weight: 850;
  letter-spacing: 0;
  line-height: 1;
  white-space: nowrap;
}

.brand-lockup-text {
  position: relative;
  display: grid;
  gap: 4px;
  min-width: 0;
}

.brand-tagline {
  color: var(--brown-light);
  font-family: "Avenir Next", Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: clamp(9px, .82vw, 11px);
  font-weight: 800;
  letter-spacing: .16em;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}

.app-switcher-placeholder {
  visibility: hidden;
}

.app-switcher {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 15;
  width: fit-content;
  line-height: 0;
}

.app-switcher summary {
  list-style: none;
}

.app-switcher summary::-webkit-details-marker {
  display: none;
}

.app-switcher-trigger {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  width: fit-content;
  border: 0;
  border-radius: 5px;
  cursor: pointer;
  user-select: none;
}

.app-switcher-trigger svg {
  width: 8px;
  height: 6px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  transition: transform 150ms ease;
}

.app-switcher-trigger:hover {
  color: var(--brown-dark);
}

.app-switcher-trigger:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 4px var(--focus);
}

.app-switcher[open] .app-switcher-trigger svg {
  transform: rotate(180deg);
}

.app-switcher-menu {
  position: absolute;
  top: calc(100% + 10px);
  left: calc(-1 * (var(--brand-icon-layout-size) + var(--brand-lockup-gap)));
  display: grid;
  width: min(360px, calc(100vw - 24px));
  gap: 4px;
  padding: 8px;
  border: 1px solid rgba(67, 39, 34, .14);
  border-radius: 14px;
  background: rgba(255, 255, 255, .98);
  box-shadow: 0 18px 48px rgba(57, 39, 31, .2), 0 4px 14px rgba(57, 39, 31, .08);
  line-height: 1.2;
  backdrop-filter: blur(18px) saturate(1.08);
}

.app-switcher-menu::before {
  position: absolute;
  top: -6px;
  left: 98px;
  width: 10px;
  height: 10px;
  border-top: 1px solid rgba(67, 39, 34, .14);
  border-left: 1px solid rgba(67, 39, 34, .14);
  background: rgba(255, 255, 255, .98);
  content: "";
  transform: translateX(-50%) rotate(45deg);
}

.app-switcher-option {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) 18px;
  align-items: center;
  gap: 10px;
  min-width: 0;
  padding: 8px;
  border-radius: 10px;
  color: var(--ink);
  text-decoration: none;
  transition: background 130ms ease, transform 130ms ease;
}

.app-switcher-option:hover,
.app-switcher-option:focus-visible {
  outline: 0;
  transform: translateX(2px);
}

.app-switcher-option-home {
  margin-bottom: 4px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(67, 39, 34, .09);
  border-radius: 10px 10px 5px 5px;
  background: #ececeb;
}

.app-switcher-option-home:hover,
.app-switcher-option-home:focus-visible {
  background: #e3e8e7;
}

.app-switcher-option-explore:hover,
.app-switcher-option-explore:focus-visible {
  background: #fff3c4;
}

.app-switcher-option-lantern:hover,
.app-switcher-option-lantern:focus-visible {
  background: #f6e9de;
}

.app-switcher-option-workbench:hover,
.app-switcher-option-workbench:focus-visible {
  background: #f3e6dd;
}

.app-switcher-option-cooking:hover,
.app-switcher-option-cooking:focus-visible {
  background: #fde9e6;
}

.app-switcher-option-story:hover,
.app-switcher-option-story:focus-visible {
  background: #e6f0f2;
}

.app-switcher-option-homebook:hover,
.app-switcher-option-homebook:focus-visible {
  background: #e9f0ea;
}

.app-switcher-option-labelwise:hover,
.app-switcher-option-labelwise:focus-visible {
  background: #efeaf2;
}

.app-switcher-option-tabletop:hover,
.app-switcher-option-tabletop:focus-visible {
  background: #f0f5df;
}

.app-switcher-option.is-active {
  background: #f3e6dd;
}

.app-switcher-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  overflow: hidden;
  border: 1px solid rgba(67, 39, 34, .09);
  border-radius: 11px;
  background: #fff;
  box-shadow: 0 3px 9px rgba(57, 39, 31, .06);
}

.app-switcher-icon img {
  display: block;
  width: 100%;
  height: 100%;
}

.app-switcher-icon-homebook {
  box-shadow: 0 3px 10px rgba(73, 112, 81, .13);
}

.app-switcher-icon-labelwise {
  box-shadow: 0 3px 10px rgba(111, 90, 125, .13);
}

.app-switcher-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.app-switcher-copy strong {
  color: var(--ink);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.15;
}

.app-switcher-copy small {
  overflow-wrap: anywhere;
  color: var(--muted);
  font-size: 11px;
  font-weight: 600;
  line-height: 1.2;
  white-space: normal;
}

.app-switcher-check,
.app-switcher-arrow {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
}

.app-switcher-check {
  color: var(--brown);
}

.app-switcher-arrow {
  color: #a7a1a8;
}

.partner-line {
  display: inline-flex;
  align-items: center;
  justify-self: center;
  width: fit-content;
  max-width: min(100%, 290px);
  margin: 0;
  padding: 4px 9px;
  border: 1px solid rgba(107, 68, 54, .2);
  border-radius: 6px;
  background: rgba(255, 255, 255, .58);
  box-shadow: 0 4px 12px rgba(57, 39, 31, .08);
  color: var(--clay);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 12px;
  font-weight: 750;
  letter-spacing: 0;
  line-height: 1.2;
  overflow-wrap: anywhere;
  text-align: center;
  text-decoration: none;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .42);
  white-space: normal;
  backdrop-filter: blur(8px) saturate(1.05);
  transition: background 140ms ease, border-color 140ms ease, box-shadow 140ms ease, color 140ms ease, transform 140ms ease;
}

.partner-line:hover,
.partner-line:focus-visible {
  border-color: rgba(201, 108, 71, .55);
  background: rgba(244, 233, 220, .92);
  box-shadow: 0 0 0 3px rgba(201, 108, 71, .14), 0 8px 20px rgba(57, 39, 31, .12);
  color: #9a4f34;
  outline: 0;
  transform: translateY(1px);
}

.topbar-partner {
  grid-column: 3;
  grid-row: 1;
  align-self: center;
  justify-self: end;
}

.top-actions {
  grid-column: 2;
  grid-row: 1;
  display: flex;
  align-items: center;
  justify-self: center;
  gap: 3px;
  padding: 4px;
  border: 1px solid rgba(107, 68, 54, .14);
  border-radius: 11px;
  background: #f4f0eb;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .72), 0 4px 14px rgba(57, 39, 31, .05);
}

.provider-top-actions { gap: 8px; padding: 5px 8px; }
.provider-top-actions label { display: grid; gap: 2px; min-width: 0; }
.provider-top-actions label>span {
  color: var(--muted); font-size: 8px; font-weight: 850;
  letter-spacing: .08em; text-transform: uppercase;
}
.provider-insurance-field {
  position: relative;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}
.provider-insurance-field legend {
  margin: 0 0 2px;
  padding: 0;
  color: var(--muted);
  font-size: 8px;
  font-weight: 850;
  letter-spacing: .08em;
  line-height: 1;
  text-transform: uppercase;
}
.provider-insurance-multiselect {
  position: relative;
  width: 236px;
}
.provider-insurance-multiselect summary {
  display: flex;
  width: 100%;
  height: 28px;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 0 9px;
  border: 1px solid rgba(107, 68, 54, .24);
  border-radius: 6px;
  outline: 0;
  background: #fff;
  color: var(--ink);
  cursor: pointer;
  font: 720 11px/1 Inter, ui-sans-serif, system-ui, sans-serif;
  list-style: none;
  white-space: nowrap;
}
.provider-insurance-multiselect summary::-webkit-details-marker { display: none; }
.provider-insurance-multiselect summary::after {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  content: "";
  transform: translateY(-2px) rotate(45deg);
}
.provider-insurance-multiselect[open] summary::after { transform: translateY(2px) rotate(225deg); }
.provider-insurance-multiselect summary:focus-visible {
  border-color: var(--brown-light);
  box-shadow: 0 0 0 3px var(--focus);
}
.provider-insurance-options {
  position: absolute;
  z-index: 30;
  top: calc(100% + 6px);
  left: 0;
  display: grid;
  width: 270px;
  gap: 2px;
  padding: 6px;
  border: 1px solid rgba(107, 68, 54, .22);
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(57, 39, 31, .16);
}
.provider-top-actions .provider-insurance-options label {
  display: flex;
  min-height: 34px;
  align-items: center;
  gap: 9px;
  padding: 6px 8px;
  border-radius: 6px;
  cursor: pointer;
  color: var(--ink);
  font-size: 12px;
  font-weight: 680;
  white-space: nowrap;
}
.provider-top-actions .provider-insurance-options label:hover { background: #f3f6f4; }
.provider-top-actions .provider-insurance-options input {
  width: 17px;
  height: 17px;
  margin: 0;
  padding: 0;
  accent-color: #326b58;
}
.provider-top-actions input,
.provider-top-actions select {
  min-width: 0; height: 28px; padding: 0 8px;
  border: 1px solid rgba(107, 68, 54, .24); border-radius: 6px;
  outline: 0; background: #fff; color: var(--ink);
  font: 720 11px/1 Inter, ui-sans-serif, system-ui, sans-serif;
}
.provider-top-actions input:focus-visible,
.provider-top-actions select:focus-visible {
  border-color: var(--brown-light); box-shadow: 0 0 0 3px var(--focus);
}
.provider-coverage-zip input { width: 76px; }
.provider-coverage-top-status {
  max-width: 120px; color: var(--muted); font-size: 9px;
  font-weight: 700; line-height: 1.25;
}
.scenario-name {
  display: flex;
  align-items: center;
  gap: 10px;
  height: 38px;
  padding: 0 4px 0 10px;
  border-radius: 7px;
  background: transparent;
  transition: background 140ms ease, box-shadow 140ms ease;
}

.scenario-name:focus-within {
  background: transparent;
  box-shadow: none;
}

.scenario-name span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.scenario-name input {
  width: 150px;
  min-width: 0;
  height: 30px;
  padding: 0 10px;
  border: 1px solid rgba(107, 68, 54, .26);
  border-radius: 6px;
  outline: 0;
  background: #fff;
  color: var(--ink);
  font-size: 12px;
  font-weight: 780;
  box-shadow: inset 0 1px 2px rgba(57, 39, 31, .05);
  transition: border-color 140ms ease, box-shadow 140ms ease;
}

.scenario-name input:hover {
  border-color: rgba(107, 68, 54, .42);
}

.scenario-name input:focus-visible {
  border-color: var(--brown-light);
  box-shadow: 0 0 0 3px var(--focus), inset 0 1px 2px rgba(57, 39, 31, .04);
}

.button {
  padding: 9px 12px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 850;
}

.button-primary {
  border: 1px solid var(--brown);
  background: var(--brown);
  color: #fff;
}

.button-secondary {
  border: 1px solid var(--line);
  background: #fff;
}

.button:hover {
  transform: translateY(-1px);
  box-shadow: 0 5px 14px rgba(57, 39, 31, .1);
}

#resetPlan,
#resetMortgage {
  border-color: #dfbbb5;
  background: #f7e5e2;
  color: #8b413a;
}

#resetPlan:hover,
#resetMortgage:hover {
  border-color: #d5a8a1;
  background: #f2d8d4;
  box-shadow: 0 5px 14px rgba(139, 65, 58, .12);
}

.top-actions .button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  height: 38px;
  padding: 0 11px;
  border-radius: 7px;
  white-space: nowrap;
}

.top-actions .button svg {
  width: 14px;
  height: 14px;
}

.top-actions .button-secondary {
  border-color: transparent;
  background: #cadad3;
  color: var(--brown-dark);
}

.top-actions .button-secondary:hover {
  border-color: rgba(107, 68, 54, .12);
  background: rgba(255, 255, 255, .78);
}

.top-actions .button-primary {
  border-color: var(--brown);
  box-shadow: 0 3px 9px rgba(67, 39, 34, .16);
}

.app-shell {
  display: grid;
  grid-template-columns: 226px minmax(0, 1fr);
  min-height: calc(100vh - 78px);
}

.tool-rail {
  position: sticky;
  top: 75px;
  height: calc(100vh - 75px);
  padding: 25px 15px;
  background: #beb4a8;
}

.tool-list {
  display: grid;
  gap: 5px;
}

.mobile-tool-select {
  display: none;
}

.tool-link {
  display: grid;
  grid-template-columns: 31px minmax(0, 1fr);
  gap: 9px;
  align-items: center;
  width: 100%;
  padding: 10px;
  border: 1px solid transparent;
  border-radius: 9px;
  background: transparent;
  text-align: left;
}

.tool-link:hover:not(:disabled) {
  background: rgba(255, 255, 255, .65);
}

.tool-link.active {
  border-color: rgba(107, 68, 54, .2);
  background: #fff;
  box-shadow: 0 6px 18px rgba(57, 39, 31, .08);
}

.tool-link:disabled {
  cursor: default;
  opacity: .58;
}

.tool-icon {
  display: grid;
  place-items: center;
  width: 31px;
  height: 31px;
  border-radius: 8px;
  background: #ddd2c8;
  color: var(--brown);
  font-weight: 900;
}

.tool-icon svg {
  width: 20px;
  height: 20px;
}

.active .tool-icon {
  background: var(--brown);
  color: #fff;
}

.workbench-home {
  min-width: 0;
  min-height: calc(100vh - 78px);
  overflow-y: auto;
  background: #f6f2ed;
}

.workbench-home-inner {
  width: min(1180px, 100%);
  margin: 0 auto;
  padding: clamp(22px, 3vw, 38px) clamp(24px, 5vw, 68px);
}

.workbench-home-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 18px;
}

.workbench-home-card {
  display: flex;
  min-height: 280px;
  flex-direction: column;
  align-items: flex-start;
  padding: clamp(22px, 2.6vw, 30px);
  border: 1px solid rgba(107, 68, 54, .14);
  border-radius: 14px;
  background: #eae4dd;
  box-shadow: 0 14px 34px rgba(57, 39, 31, .08);
  text-align: left;
  text-transform: none;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.workbench-home-card-mortgage {
  background: #e7eeea;
}

.workbench-home-card-debt {
  background: #e7ebed;
}

.workbench-home-card-government {
  background: #ebe7dc;
}

.workbench-home-card-weather {
  background: #e5eeed;
}

.workbench-home-card-news {
  background: #e7ebed;
}

.workbench-home-card-providers {
  background: #e6eeea;
}

.workbench-home-card-thinktank {
  background: #eee8df;
}

.workbench-home-card:hover {
  border-color: rgba(107, 68, 54, .3);
  box-shadow: 0 19px 42px rgba(57, 39, 31, .13);
  transform: translateY(-3px);
}

.workbench-home-card-icon {
  display: grid;
  width: 50px;
  height: 50px;
  place-items: center;
  border-radius: 12px;
  background: var(--brown);
  color: #fff;
  box-shadow: 0 7px 16px rgba(67, 39, 34, .15);
}

.workbench-home-card-mortgage .workbench-home-card-icon {
  background: #316b66;
}

.workbench-home-card-debt .workbench-home-card-icon {
  background: #405f71;
}

.workbench-home-card-government .workbench-home-card-icon {
  background: #59684f;
}

.workbench-home-card-weather .workbench-home-card-icon {
  background: #2e6d71;
}

.workbench-home-card-news .workbench-home-card-icon {
  background: #405f71;
}

.workbench-home-card-providers .workbench-home-card-icon {
  background: #326b58;
}

.workbench-home-card-thinktank .workbench-home-card-icon {
  background: #9b6825;
}

.workbench-home-card-icon svg {
  width: 27px;
  height: 27px;
}

.workbench-home-card-copy {
  display: block;
  margin-top: 25px;
}

.workbench-home-card-copy strong {
  display: flex;
  min-height: 2.1em;
  align-items: center;
  font-family: var(--font-display);
  font-size: clamp(24px, 2.3vw, 31px);
  font-variation-settings: "wght" 620;
  letter-spacing: -.025em;
  line-height: 1.05;
  text-transform: capitalize;
}

.workbench-home-card-copy p {
  margin: 12px 0 0;
  color: #675e57;
  font-size: 13px;
  font-weight: 480;
  line-height: 1.5;
}

.workbench-home-card-action {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: auto;
  padding-top: 24px;
  color: var(--brown-dark);
  font-size: 12px;
  font-weight: 800;
}

.workbench-home-card-action svg {
  width: 17px;
  height: 17px;
  transition: transform .18s ease;
}

.workbench-home-card:hover .workbench-home-card-action svg {
  transform: translateX(3px);
}

.tool-link strong,
.tool-link small {
  display: block;
}

.tool-link strong {
  font-size: 13px;
}

.tool-link small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
}

.planner {
  min-width: 0;
  padding: 0;
}

.planner-grid {
  display: grid;
  grid-template-columns: minmax(350px, .8fr) minmax(500px, 1.3fr);
  align-items: stretch;
  gap: 0;
  width: 100%;
  min-height: 100%;
}

.mobile-control-toggle {
  display: none;
}

/* Think Tank */
.think-tank {
  min-width: 0;
  height: 100%;
  overflow-y: auto;
  background: #f4efe7;
}

.think-tank-hero {
  position: sticky;
  z-index: 70;
  top: 0;
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: clamp(48px, 5vw, 96px);
  align-items: center;
  padding: 18px 32px 21px;
  color: #fff9f1;
  background: var(--brown);
  box-shadow: 0 1px 0 rgba(255,255,255,.08);
  transition: gap 180ms ease, padding 180ms ease, box-shadow 180ms ease;
}

.think-tank-hero.is-compact {
  gap: clamp(30px, 4vw, 64px);
  padding: 9px 32px 10px;
  box-shadow: 0 8px 20px rgba(42,27,21,.2);
}

.think-reasoning>span {
  color: #b67659;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.think-tank-hero h2 {
  margin: 0;
  font-family: Newsreader, Georgia, serif;
  font-size: clamp(29px, 3vw, 38px);
  font-weight: 500;
  letter-spacing: -.035em;
  transition: font-size 180ms ease;
}

.think-tank-hero.is-compact h2 { font-size: clamp(24px, 2.25vw, 31px); }

.think-question-field { display: grid; gap: 12px; min-width: 0; }
.think-question-field>label { color: #d9c6b9; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; }
.think-tank-hero.is-compact .think-question-field { gap: 0; }
.think-tank-hero.is-compact .think-question-field>label { display: none; }
.think-question-search-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; min-width: 0; }
.think-question-combobox { position: relative; min-width: 0; }
.think-question-search-icon { position: absolute; z-index: 2; top: 22px; left: 17px; width: 18px; height: 18px; fill: none; stroke: #8a7b72; stroke-width: 1.8; stroke-linecap: round; transform: translateY(-50%); pointer-events: none; }
.think-question-field textarea {
  display: block;
  box-sizing: border-box;
  width: 100%;
  height: 44px;
  min-height: 44px;
  max-height: 84px;
  padding: 10px 44px 9px 48px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 9px;
  color: #3b2722;
  background: #fffaf2;
  font-family: Newsreader, Georgia, serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.45;
  resize: none;
  overflow-y: hidden;
  transition: min-height 180ms ease, box-shadow 150ms ease, border-color 150ms ease;
}
.think-tank-hero.is-compact .think-question-field textarea { min-height: 40px; }
.think-question-field textarea:focus { outline: 0; border-color: #d7b39e; box-shadow: 0 0 0 3px rgba(255,250,242,.18); }
.think-question-clear { position: absolute; z-index: 3; top: 22px; right: 12px; display: grid; place-items: center; width: 24px; height: 24px; padding: 0; border: 0; border-radius: 50%; color: #8ca0bd; background: transparent; font-family: Arial, sans-serif; font-size: 22px; font-weight: 700; line-height: 1; transform: translateY(-50%); cursor: pointer; }
.think-question-clear:hover { color: var(--brown); background: rgba(107,68,54,.08); }
.think-question-clear[hidden] { display: none; }
.think-random-question { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 44px; padding: 0 15px; border: 1px solid rgba(255,255,255,.3); border-radius: 9px; color: #4d3028; background: #ead8c9; font-size: 12px; font-weight: 800; cursor: pointer; transition: min-height 180ms ease, transform 150ms ease, background 150ms ease, box-shadow 150ms ease; }
.think-random-question svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.think-random-question:hover { transform: translateY(-1px); background: #f3e5d9; box-shadow: 0 5px 12px rgba(42,27,21,.18); }
.think-random-question:focus-visible { outline: 0; box-shadow: 0 0 0 3px rgba(255,250,242,.24); }
.think-tank-hero.is-compact .think-random-question { min-height: 40px; }
.think-question-native { display: none; }
.think-question-results { position: absolute; z-index: 80; top: calc(100% + 8px); right: 0; left: 0; box-sizing: border-box; max-height: calc(100dvh - 16px); overflow-y: auto; padding: 7px; border: 1px solid #d8cbc1; border-radius: 12px; background: #fffdf9; box-shadow: 0 18px 40px rgba(42,27,21,.22); overscroll-behavior: contain; }
.think-question-results[hidden] { display: none; }
.think-question-results button { display: flex; align-items: center; justify-content: space-between; gap: 18px; width: 100%; padding: 12px 13px; border: 0; border-radius: 8px; color: #3b2722; background: transparent; font-family: Newsreader, Georgia, serif; font-size: 15px; font-weight: 600; line-height: 1.25; text-align: left; cursor: pointer; }
.think-question-results button:hover,.think-question-results button.is-active { background: #f1e8df; }
.think-question-results button[aria-selected="true"] { color: var(--brown); background: #f6eee7; }
.think-question-results button[aria-disabled="true"] { color: #978b83; cursor: default; }
.think-question-results button small { flex: 0 0 auto; color: #a16f57; font-family: var(--font-body); font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.think-question-no-results { margin: 0; padding: 15px 13px; color: #7c7068; font-size: 13px; font-weight: 650; }

.think-tank-layout {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  width: 100%;
  min-height: calc(100% - 210px);
}

.think-people-panel {
  padding: 28px 24px;
  border-right: 1px solid var(--line);
  background: #ede5da;
}

#thinkPersonGroups { display: grid; gap: 17px; }

.think-person-group { display: grid; gap: 4px; margin: 0; padding: 0; border: 0; }
.think-group-heading { display: flex; grid-column: 1 / -1; justify-content: space-between; gap: 8px; align-items: center; margin-bottom: 7px; }
.think-group-heading h4 { margin: 0; color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.think-group-actions { display: flex; gap: 3px; }
.think-group-actions button { padding: 3px 5px; border: 0; border-radius: 5px; color: var(--brown); background: transparent; font-size: 9px; font-weight: 800; }
.think-group-actions button:hover { background: rgba(255,255,255,.65); }
.think-person-group label { display: grid; grid-template-columns: 17px 1fr; gap: 9px; align-items: center; padding: 9px 8px; border-radius: 7px; }
.think-person-group label:hover { background: rgba(255,255,255,.55); }
.think-person-group input { accent-color: var(--brown); }
.think-person-group b,.think-person-group small { display: block; }
.think-person-group b { font-size: 12px; }
.think-person-group small { margin-top: 2px; color: var(--muted); font-size: 10px; }
.think-ai-answer-card .think-response-box { border-color: rgba(107, 68, 54, .34); background: #fffdfa; box-shadow: 0 5px 16px rgba(57,39,31,.08); }

.think-responses { padding: 30px 30px 38px 20px; }
.think-sentiment-comparison { position: relative; overflow: hidden; margin: 0 0 28px; padding: 20px 20px 16px; border: 1px solid var(--line); border-radius: 12px; background: #fffdfa; box-shadow: 0 5px 18px rgba(57,39,31,.05); }
.think-sentiment-comparison[hidden] { display: none; }
.think-sentiment-processing {
  position: absolute;
  z-index: 5;
  inset: 0;
  display: none;
  place-content: center;
  justify-items: center;
  gap: 9px;
  backdrop-filter: blur(1px);
}
.think-sentiment-comparison.is-processing .think-sentiment-processing { display: grid; }
.think-sentiment-processing span {
  width: 27px;
  height: 27px;
  border: 3px solid rgba(107, 68, 54, .18);
  border-top-color: #a66146;
  border-radius: 50%;
  animation: think-processing-spin .72s linear infinite;
}
.think-sentiment-processing b { font-size: 10px; letter-spacing: .09em; text-transform: uppercase; }
@keyframes think-processing-spin { to { transform: rotate(360deg); } }
.think-sentiment-heading { display: grid; grid-template-columns: minmax(0, 180px) minmax(220px, 1fr) 104px; column-gap: 16px; row-gap: 8px; align-items: end; margin-bottom: 15px; }
.think-sentiment-heading>div:first-child { grid-column: 1 / -1; }
.think-sentiment-heading h3 { margin: 0; color: var(--brown-dark); font-family: Newsreader, Georgia, serif; font-size: 21px; line-height: 1.05; white-space: nowrap; }
.think-sentiment-key { grid-column: 2; display: flex; justify-content: space-between; color: var(--muted); font-size: 8px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.think-sentiment-rows { display: grid; gap: 9px; }
.think-sentiment-row { display: grid; grid-template-columns: minmax(0, 180px) minmax(220px, 1fr) 104px; gap: 16px; align-items: center; min-height: 37px; }
.think-sentiment-category b,.think-sentiment-category small,.think-sentiment-result b,.think-sentiment-result small { display: block; }
.think-sentiment-category b { color: #3f302a; font-size: 11px; line-height: 1.18; }
.think-sentiment-category small { margin-top: 2px; color: var(--muted); font-size: 9px; }
.think-sentiment-plot { position: relative; height: 10px; border-radius: 999px; background: linear-gradient(90deg, rgba(200,29,37,.24), rgba(242,140,40,.17) 30%, rgba(244,200,66,.22) 50%, rgba(69,199,101,.17) 70%, rgba(10,143,56,.24)); box-shadow: inset 0 0 0 1px rgba(91,67,57,.13); }
.think-sentiment-plot::before { content: ''; position: absolute; top: -4px; bottom: -4px; left: 50%; border-left: 1px solid rgba(84,69,61,.34); }
.think-sentiment-plot i { position: absolute; top: 50%; left: var(--sentiment-position); width: 17px; height: 17px; border: 3px solid #fffdfa; border-radius: 50%; background: #f4c842; box-shadow: 0 1px 5px rgba(42,27,21,.32); transform: translate(-50%, -50%); transition: left 420ms cubic-bezier(.2,.75,.2,1), background-color 260ms ease, opacity 220ms ease; }
.think-sentiment-row.is-waiting .think-sentiment-plot i { opacity: .28; }
.think-sentiment-row.is-waiting .think-sentiment-result b,.think-sentiment-row.is-waiting .think-sentiment-result small { color: var(--muted); }
.think-sentiment-row[data-sentiment="strongly-negative"] .think-sentiment-plot i { background: #c81d25; }
.think-sentiment-row[data-sentiment="negative"] .think-sentiment-plot i { background: #f28c28; }
.think-sentiment-row[data-sentiment="positive"] .think-sentiment-plot i { background: #45c765; }
.think-sentiment-row[data-sentiment="strongly-positive"] .think-sentiment-plot i { background: #0a8f38; }
.think-sentiment-result b { color: #3f302a; font-size: 10px; line-height: 1.15; }
.think-sentiment-result small { margin-top: 2px; color: var(--muted); font-size: 9px; font-variant-numeric: tabular-nums; }
.think-answer-grid { display: grid; gap: 24px; }
.think-answer-card { display: grid; grid-template-columns: 110px minmax(0,1fr); gap: 14px; align-items: start; border: 0; border-radius: 0; background: transparent; box-shadow: none; overflow: visible; }
.think-answer-card>details { min-width: 0; }
.think-answer-card summary { display: block; padding: 0; cursor: pointer; list-style: none; }
.think-answer-card summary::-webkit-details-marker { display: none; }
.think-answer-meta { display: flex; flex-direction: column; gap: 5px; align-items: center; justify-content: center; min-width: 0; text-align: center; }
.think-bio-trigger { width: 100%; padding: 0; border: 0; border-radius: 14px; background: transparent; cursor: pointer; }
.think-bio-trigger:hover .think-person-portrait { transform: translateY(-2px); box-shadow: inset 0 0 0 1px rgba(57,39,31,.2), 0 7px 16px rgba(57,39,31,.13); }
.think-bio-trigger:hover .think-answer-copy b { color: #9e543d; }
.think-bio-trigger:focus-visible { outline: 0; box-shadow: 0 0 0 3px var(--focus); }
.think-answer-meta b { display: block; color: var(--brown); font-family: Newsreader, Georgia, serif; font-size: 13px; line-height: 1.05; }
.think-answer-copy { max-width: 105px; min-width: 0; }
.think-person-portrait { display: grid; place-items: end center; flex: 0 0 72px; width: 72px; height: 72px; overflow: hidden; border-radius: 14px; background: #e7e1da; box-shadow: inset 0 0 0 1px rgba(57,39,31,.16); transition: transform 150ms ease, box-shadow 150ms ease, background-color 240ms ease; }
.think-answer-card.is-sentiment-revealed[data-sentiment="strongly-negative"] .think-person-portrait { background: #c81d25; }
.think-answer-card.is-sentiment-revealed[data-sentiment="negative"] .think-person-portrait { background: #f28c28; }
.think-answer-card.is-sentiment-revealed[data-sentiment="neutral"] .think-person-portrait { background: #f4c842; }
.think-answer-card[data-sentiment="unknown"] .think-person-portrait,
.think-bio-card[data-sentiment="unknown"] .think-bio-portrait { background: #dedbd6; }
#thinkSentimentScope { max-width: 65ch; margin: .5rem 0 0; font-size: .875rem; line-height: 1.5; font-weight: 400; }
.think-answer-card.is-sentiment-revealed[data-sentiment="positive"] .think-person-portrait { background: #45c765; }
.think-answer-card.is-sentiment-revealed[data-sentiment="strongly-positive"] .think-person-portrait { background: #0a8f38; }
.think-person-portrait img { display: block; width: 78px; height: 78px; object-fit: contain; object-position: center bottom; }
.think-response-box { position: relative; align-self: start; display: block; padding: 12px 44px 12px 15px; border: 1px solid var(--line); border-radius: 9px; background: #fffdfa; box-shadow: 0 3px 10px rgba(57,39,31,.04); }
.think-response-box::after { content: '+'; position: absolute; right: 8px; bottom: 7px; display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; color: #123; background: #fff; font-family: Arial, sans-serif; font-size: 16px; font-weight: 700; line-height: 1; }
.think-answer-card details[open] .think-response-box::after { content: '−'; }
.think-answer-card summary:hover .think-response-box::after { background: #fff; }
.think-answer-card summary:focus-visible { outline: 0; }
.think-answer-card summary:focus-visible .think-response-box { box-shadow: 0 0 0 3px var(--focus), 0 3px 10px rgba(57,39,31,.04); }
.think-response-intro { color: #a66146; font-family: Newsreader, Georgia, serif; font-size: 15px; font-weight: 650; line-height: 1.32; white-space: normal; overflow-wrap: anywhere; }
.think-response-text { display: inline; font-family: Newsreader, Georgia, serif; font-size: 15px; font-weight: 400; line-height: 1.32; }
.think-response-box.is-thinking .think-response-intro { display: none; }
.think-response-box.is-thinking .think-response-text { color: var(--muted); font-style: italic; }
.think-response-box.is-thinking .think-response-text::after { content: '…'; animation: think-pulse .75s ease-in-out infinite alternate; }
.think-response-box.is-typing .think-response-text::after { content: ''; display: inline-block; height: .9em; margin-left: 2px; border-right: 2px solid #a66146; vertical-align: -.05em; animation: think-cursor .55s steps(1) infinite; }
@keyframes think-pulse { from { opacity: .25; } to { opacity: 1; } }
@keyframes think-cursor { 0%, 48% { opacity: 1; } 49%, 100% { opacity: 0; } }
.think-reasoning { margin: 6px 0 2px; padding: 12px 15px 14px; border: 1px solid var(--line-soft); border-radius: 8px; background: #f1e9df; }
.think-reasoning p { max-width: 820px; margin: 6px 0 0; color: #5f514b; font-family: Newsreader, Georgia, serif; font-size: 14px; line-height: 1.48; }
.think-answer-audit { max-width: 820px; margin-top: 11px; padding-top: 9px; border-top: 1px solid rgba(109, 75, 62, .16); }
.think-answer-audit span { color: #a66146; font-size: 9px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.think-answer-audit p { margin-top: 3px; font-family: Inter, Arial, sans-serif; font-size: 10px; line-height: 1.4; }
.think-sources { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; margin-top: 14px; }
.think-sources small { color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.think-sources a { color: var(--brown); font-size: 10px; font-weight: 800; text-underline-offset: 2px; }
.think-empty-panel { padding: 50px 20px; border: 1px dashed #cbb9aa; border-radius: 10px; text-align: center; }
.think-empty-panel span { color: var(--brown); font-family: Newsreader, Georgia, serif; font-size: 24px; font-weight: 700; }
.think-empty-panel p { margin: 7px 0 17px; color: var(--muted); font-size: 12px; }
.think-reconstruction-note { margin: 18px 0 0; padding-top: 12px; border-top: 1px solid var(--line-soft); color: var(--muted); font-size: 10px; text-align: center; }

.think-bio-dialog { width: min(820px, calc(100vw - 32px)); max-height: min(720px, calc(100vh - 32px)); padding: 0; border: 0; border-radius: 22px; background: transparent; box-shadow: 0 28px 80px rgba(35,21,17,.32); overflow: visible; }
.think-bio-dialog::backdrop { background: rgba(42,29,24,.62); backdrop-filter: blur(5px); }
.think-bio-card { position: relative; display: grid; grid-template-columns: minmax(230px, 310px) minmax(0,1fr); max-height: min(720px, calc(100vh - 32px)); overflow: auto; border: 1px solid rgba(107,68,54,.22); border-radius: 22px; background: #fffdfa; }
.think-bio-close { position: absolute; z-index: 2; top: 14px; right: 14px; display: grid; place-items: center; width: 34px; height: 34px; padding: 0; border: 1px solid rgba(107,68,54,.18); border-radius: 50%; background: rgba(255,253,250,.9); color: var(--brown); font-family: Arial, sans-serif; font-size: 24px; line-height: 1; box-shadow: 0 4px 12px rgba(57,39,31,.1); }
.think-bio-close:hover { background: #fff; transform: translateY(-1px); }
.think-bio-close:focus-visible { outline: 0; box-shadow: 0 0 0 3px var(--focus); }
.think-bio-visual { display: grid; place-items: center; min-height: 100%; padding: 42px 28px; background: #f1e8dc; }
.think-bio-portrait { display: grid; place-items: end center; width: min(260px, 100%); aspect-ratio: 1; overflow: hidden; border-radius: 28px; background: #f4c842; box-shadow: inset 0 0 0 1px rgba(57,39,31,.18), 0 18px 35px rgba(57,39,31,.16); }
.think-bio-card[data-sentiment="strongly-negative"] .think-bio-portrait { background: #c81d25; }
.think-bio-card[data-sentiment="negative"] .think-bio-portrait { background: #f28c28; }
.think-bio-card[data-sentiment="neutral"] .think-bio-portrait { background: #f4c842; }
.think-bio-card[data-sentiment="positive"] .think-bio-portrait { background: #45c765; }
.think-bio-card[data-sentiment="strongly-positive"] .think-bio-portrait { background: #0a8f38; }
.think-bio-portrait img { display: block; width: 108%; height: 108%; object-fit: contain; object-position: center bottom; }
.think-bio-content { align-self: center; padding: 52px 50px 50px 42px; }
.think-bio-content h2 { margin: 0 0 4px; color: var(--brown-dark); font-family: Newsreader, Georgia, serif; font-size: clamp(30px, 4vw, 42px); line-height: .98; }
.think-bio-meta { margin: 0 0 22px; color: var(--muted); font-size: 12px; font-weight: 700; }
.think-bio-text { display: grid; gap: 14px; }
.think-bio-text p { margin: 0; color: #4f433e; font-family: Newsreader, Georgia, serif; font-size: 16px; line-height: 1.55; }
.think-bio-links { display: flex; align-items: flex-start; gap: 22px; margin-top: 24px; padding-top: 20px; border-top: 1px solid rgba(107,68,54,.16); }
.think-bio-links[hidden] { display: none; }
.think-bio-reference { display: grid; justify-items: center; gap: 7px; min-width: 58px; color: var(--brown); text-decoration: none; }
.think-bio-reference-icon { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid rgba(107,68,54,.28); border-radius: 12px; background: #fffdfa; color: var(--brown); box-shadow: 0 5px 13px rgba(57,39,31,.1); transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease; }
.think-bio-reference-icon svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.think-bio-reference-wikipedia { font-family: Georgia, 'Times New Roman', serif; font-size: 25px; font-weight: 700; line-height: 1; }
.think-bio-reference-label { max-width: 90px; color: var(--muted); font-size: 10px; font-weight: 800; line-height: 1.15; text-align: center; }
.think-bio-reference:hover .think-bio-reference-icon { transform: translateY(-2px); border-color: rgba(107,68,54,.5); background: #f5ebdf; box-shadow: 0 8px 17px rgba(57,39,31,.14); }
.think-bio-reference:hover .think-bio-reference-label { color: var(--brown); }
.think-bio-reference:focus-visible { outline: 0; }
.think-bio-reference:focus-visible .think-bio-reference-icon { box-shadow: 0 0 0 3px var(--focus); }

@media (max-width: 950px) {
  .think-tank-hero { grid-template-columns: 1fr; gap: 12px; padding: 16px 24px; }
  .think-tank-layout { grid-template-columns: 1fr; }
  .think-people-panel { border-right: 0; border-bottom: 1px solid var(--line); }
  .think-person-group { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 1150px) {
  .think-tank-hero { grid-template-columns: 1fr; gap: 16px; padding: 18px 24px 22px; }
}

@media (max-width: 650px) {
  .think-tank-hero { gap: 12px; padding: 14px 18px 18px; }
  .think-tank-hero h2 { font-size: clamp(27px, 7.6vw, 30px); line-height: 1.02; }
  .think-question-field { gap: 9px; }
  .think-question-search-row { grid-template-columns: minmax(0, 1fr) 48px; gap: 8px; }
  .think-question-field textarea {
    height: 48px;
    min-height: 48px;
    padding: 11px 40px 9px 44px;
  }
  .think-question-field textarea::placeholder { white-space: nowrap; }
  .think-question-search-icon,
  .think-question-clear { top: 24px; }
  .think-random-question {
    width: 48px;
    min-height: 48px;
    padding: 0;
    border-radius: 10px;
  }
  .think-random-question span { display: none; }
  .think-tank-hero.has-open-results {
    gap: 0;
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .think-tank-hero.has-open-results>div:first-child,
  .think-tank-hero.has-open-results .think-question-field>label { display: none; }
  .think-tank-hero.has-open-results .think-question-field { gap: 0; }
  .think-tank-hero.has-open-results .think-question-results {
    right: auto;
    width: calc(100vw - 36px);
  }
  .think-tank-hero.has-open-results .think-question-results button {
    padding: 10px 12px;
    font-size: 14px;
    line-height: 1.2;
  }
  .think-tank-hero.is-compact { grid-template-columns: 1fr; gap: 8px; padding: 9px 18px 10px; }
  .think-tank-hero.is-compact .think-question-field textarea,
  .think-tank-hero.is-compact .think-random-question { min-height: 44px; }
  .think-tank-hero.is-compact .think-question-search-icon,
  .think-tank-hero.is-compact .think-question-clear { top: 22px; }
  .think-people-panel,.think-responses { padding: 22px 16px; }
  .think-sentiment-comparison { margin-bottom: 22px; padding: 16px 14px 14px; }
  .think-sentiment-heading { grid-template-columns: 1fr; gap: 10px; }
  .think-sentiment-key { grid-column: 1; }
  .think-sentiment-row { grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; padding: 4px 0; }
  .think-sentiment-plot { grid-column: 1 / -1; grid-row: 2; }
  .think-sentiment-result { text-align: right; }
  .think-person-group { grid-template-columns: 1fr; }
  .think-answer-card { grid-template-columns: 76px minmax(0,1fr); gap: 10px; }
  .think-person-portrait { flex-basis: 64px; width: 64px; height: 64px; }
  .think-person-portrait img { width: 70px; height: 70px; }
  .think-response-box { padding: 10px 40px 10px 12px; }
  .think-response-intro, .think-response-text { font-size: 14px; }
  .think-reasoning { margin: 5px 0 2px; padding: 11px 12px; }
  .think-bio-dialog { width: min(520px, calc(100vw - 20px)); max-height: calc(100vh - 20px); }
  .think-bio-card { grid-template-columns: 1fr; max-height: calc(100vh - 20px); }
  .think-bio-visual { min-height: 0; padding: 34px 62px 20px; }
  .think-bio-portrait { width: min(220px, 100%); border-radius: 24px; }
  .think-bio-content { padding: 22px 24px 34px; }
  .think-bio-content h2 { font-size: 32px; }
  .think-bio-text p { font-size: 15px; }
}

@media (prefers-reduced-motion: reduce) {
  .think-sentiment-processing span,
  .think-sentiment-plot i,
  .think-response-box.is-thinking .think-response-text::after,
  .think-response-box.is-typing .think-response-text::after { animation: none; }
  .think-sentiment-plot i { transition: none; }
}

.plan-panel,
.results-panel {
  min-width: 0;
  border: 0;
  border-radius: 0;
  background: var(--paper);
  box-shadow: none;
}

.plan-panel {
  overflow: hidden;
  border-right: 1px solid var(--line);
  background: #eae4dd;
}

.plan-panel .panel-heading {
  background: rgba(234, 228, 221, .97);
}

.results-panel {
  padding: 0 18px 20px;
}

.panel-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 58px;
  padding: 12px 16px;
}

.panel-heading>div:first-child {
  display: flex;
  align-items: center;
}

.panel-heading h3 {
  font-size: 19px;
  letter-spacing: -.01em;
}

.text-button {
  padding: 3px 0;
  border: 0;
  border-bottom: 1px solid currentColor;
  background: transparent;
  color: var(--brown);
  font-size: 12px;
  font-weight: 850;
}

.simulation-type {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  margin: 0px 14px 16px;
  padding: 0;
  border: 0;
}

.simulation-type legend {
  margin-bottom: 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 720;
  letter-spacing: .01em;
  text-transform: capitalize;
}

.simulation-type label {
  position: relative;
  min-width: 0;
}

.simulation-type input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.simulation-type span {
  display: grid;
  min-height: 44px;
  align-content: center;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  text-align: center;
}

.simulation-type b,
.simulation-type small {
  display: block;
}

.simulation-type b {
  font-size: 12px;
}

.simulation-type small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.25;
}

.simulation-type input:checked+span {
  border-color: var(--brown);
  background: var(--brown);
  color: #fff;
}

.simulation-type input:checked+span small {
  color: #dccbc2;
}

.input-section {
  padding-bottom: 24px;
  border-top: 5px solid rgba(107, 68, 54, .24);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .46);
}

#planForm .timeline-section {
  background: #f2e9df;
}

#planForm .spending-section {
  background: #dfcbb7;
}

.social-security-section { padding-bottom: 16px; }
#planForm .social-security-section { background: #e9daca; }
#planForm .input-section { border-top-color: #fff; }
#planForm .input-section>.section-heading { background: transparent; }
.optimizer-menu { position: relative; min-width: 0; }
.optimizer-menu summary { padding: 11px; cursor: pointer; font-size: 10px; font-weight: 750; white-space: nowrap; }
.optimizer-menu .optimizer-options { position: absolute; top: calc(100% + 6px); right: 0; z-index: 50; width: min(300px, calc(100vw - 32px)); padding: 16px; border: 1px solid #b79d85; border-radius: 8px; background: #fffaf5; box-shadow: 0 8px 24px #36251c26; display: grid; gap: 12px; }
.plan-heading-actions .optimizer-menu .optimizer-options label { display: flex; align-items: center; gap: 8px; padding: 0; border: 0; background: none; color: var(--ink); font-size: 14px; font-weight: 650; text-transform: none; letter-spacing: normal; white-space: normal; cursor: pointer; }
.optimizer-menu .optimizer-options select { height: 38px; border: 1px solid #b79d85; border-radius: 5px; font-size: 14px; }
.optimizer-options input { width: 18px; height: 18px; accent-color: #6b4436; }
.optimizer-options small { color: #4d3d31; line-height: 1.5; }
#optimizationStatus { margin: 0 0 16px; color: #4d3d31; line-height: 1.5; }
#optimizationStatus:empty { display: none; }
.optimization-progress { display: grid; gap: 10px; padding: 16px 20px; background: #f2e9df; border-radius: 10px; }
.optimization-progress progress { display: block; width: 100%; height: 10px; border: 0; border-radius: 5px; overflow: hidden; appearance: none; background: #dfd0c1; accent-color: #6b4436; }
.optimization-progress progress::-webkit-progress-bar { background: #dfd0c1; }
.optimization-progress progress::-webkit-progress-value { background: #6b4436; border-radius: 5px; }
.optimization-progress progress::-moz-progress-bar { background: #6b4436; border-radius: 5px; }
.optimization-summary { padding: 18px 20px; background: #f2e9df; border: 1px solid #d7c5b4; border-radius: 10px; }
.optimization-summary header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 12px; border-bottom: 1px solid #d7c5b4; }
.optimization-summary h4 { margin: 0; font-family: var(--font-body); font-size: 17px; }
.optimization-summary header span { font-size: 14px; font-weight: 700; color: #6b4436; }
.optimization-summary dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px 20px; margin: 16px 0 0; }
.optimization-summary dt { font-size: 13px; color: #635448; }
.optimization-summary dd { margin: 3px 0 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; }
.optimization-summary dd strong { font-size: 20px; color: var(--ink); }
.optimization-summary dd small { font-size: 12px; color: #635448; }
.summary-age-timeline { grid-column: 1 / -1; }
.optimization-summary .summary-age-timeline dd { display: block; margin-top: 8px; }
.summary-age-track { display: flex; height: 22px; background: #dfd0c1; border-radius: 5px; overflow: hidden; }
.summary-age-track>span { height: 100%; border-right: 2px solid #f2e9df; box-sizing: border-box; }
.summary-age-timeline .age-0 { background: #6b4436; }
.summary-age-timeline .age-1 { background: #477b68; }
.summary-age-timeline .age-2 { background: #ad8144; }
.summary-age-axis { position: relative; min-height: calc(var(--tick-offset, 0px) + 44px); margin-top: 4px; font-size: 12px; color: #635448; }
@media (max-width: 600px) { .summary-age-axis { min-height: calc(var(--tick-offset, 0px) + 76px); } }
.summary-age-axis>span { position: absolute; white-space: nowrap; }
.summary-age-tick { transform: translateX(-50%); width: 20%; text-align: center; white-space: normal !important; }
.summary-age-tick>b { font-size: 14px; }
.summary-age-tick>span { display: block; font-size: 12px; line-height: 1.3; margin-top: 2px; }
.summary-age-tick.near-end { transform: translateX(-100%); text-align: right; }
.summary-age-zero { left: 0; }
.summary-age-end { right: 0; }
.summary-allocation { grid-column: 1 / -1; padding: 12px 0px 0; border-top: 1px solid #d7c5b4; border-bottom: 1px solid #d7c5b4; }
.optimization-summary .summary-allocation dd { display: block; margin-top: 8px; }
.summary-allocation-bar { display: flex; height: 22px; width: 100%; overflow: hidden; border-radius: 5px; background: #ddd0c2; }
.summary-allocation-bar span { height: 100%; }
.summary-allocation .allocation-stocks { background: #6b4436; }
.summary-allocation .allocation-bonds { background: #477b68; }
.summary-allocation .allocation-cash { background: #c39851; }
.summary-allocation-labels { position: relative; margin-top: 4px; }
.summary-allocation-label { position: absolute; width: 20%; transform: translateX(-50%); text-align: center; }
.summary-allocation-label strong, .summary-allocation-label span, .summary-allocation-label small { display: block; }
.optimization-summary .summary-allocation-label strong { font-size: 14px; }
.summary-allocation-label span { font-size: 12px; line-height: 1.3; margin-top: 2px; }
@media (max-width: 600px) { .optimization-summary dl { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; } .optimization-summary { padding: 14px; } }
#planForm .input-field>span:first-child,
#planForm .input-field small,
#planForm #stressHint { color: #4d3d31; }
.social-security-section>.section-heading { align-items: center; justify-content: space-between; flex-wrap: wrap; }
.social-enable { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 650; }
.social-enable input { width: 18px; height: 18px; accent-color: #6b4436; }
.social-summary { margin: 12px 0 0; font-size: 15px; line-height: 1.45; font-weight: 700; color: #543627; }
.social-assumptions { margin-top: 10px; font-size: 13px; line-height: 1.5; }
.social-assumptions summary { cursor: pointer; padding: 5px 0; font-weight: 700; }
.social-assumptions .field-grid { margin-top: 10px; }
.social-assumptions p { margin: 10px 0; }
.social-assumptions a { color: #543627; text-underline-offset: 3px; }
.social-comparison { margin: 0 0 18px; border-bottom: 1px solid var(--line); padding: 0 0 12px; }
.social-comparison h3 { margin: 0; padding: 12px 0; font-size: 20px; font-weight: 750; color: #285b47; }
.social-comparison p { font-size: 13px; line-height: 1.5; color: var(--muted); }
.social-table-scroll { overflow-x: auto; }
.social-comparison table { width: 100%; border-collapse: collapse; font-size: 14px; text-align: left; }
.social-comparison caption { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.social-comparison th, .social-comparison td { padding: 12px 9px; border-bottom: 1px solid var(--line); vertical-align: top; }
.social-comparison thead th { font-size: 12px; color: var(--muted); }
.social-comparison td>span { display: block; margin-bottom: 8px; }
.social-comparison small { display: block; margin-top: 3px; font-size: 11px; font-weight: 500; color: var(--muted); }
.social-comparison .is-selected { background: #edf4ef; }
.social-comparison button { min-height: 40px; padding: 7px 10px; border: 1px solid #b5c9be; border-radius: 6px; background: #fff; color: #285b47; font-size: 13px; font-weight: 700; }
.social-comparison button[aria-pressed="true"] { background: #326b58; color: #fff; }
.social-comparison button:disabled { opacity: .65; cursor: default; }
@media (max-width: 520px) {
  .social-security-section .field-grid.two { grid-template-columns: 1fr; }
  .social-comparison thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .social-comparison table, .social-comparison tbody { display: block; }
  .social-comparison tr { display: grid; grid-template-columns: 1fr 1fr; padding: 12px 0; border-bottom: 1px solid var(--line); }
  .social-comparison th, .social-comparison td { border: 0; min-width: 0; }
  .social-comparison th { grid-column: 1 / -1; font-size: 18px; }
  .social-comparison th::before { content: 'Start at '; }
  .social-comparison td::before { content: attr(data-label); display: block; margin-bottom: 6px; color: var(--muted); font-size: 12px; font-weight: 700; }
  .social-comparison td:last-child { align-self: end; }
  .social-comparison button { width: 100%; }
  .portfolio-chart-heading { flex-direction: column; align-items: stretch; }
  .portfolio-chart-heading h3 { white-space: normal; }
  .portfolio-chart-controls { min-width: 0; width: 100%; max-width: 100%; }
  .portfolio-series-toggles { min-width: 0; }
  .portfolio-series-toggle { max-width: 100%; white-space: normal; }
}

#planForm .assumptions-section {
  background: #d5bca3;
}

#planForm #stressTestSection {
  background: #cbad90;
}

.input-section:last-child {
  border-bottom: 1px solid rgba(107, 68, 54, .24);
}

.input-section>.section-heading {
  display: flex;
  gap: 14px;
  padding: 15px 17px 10px;
  background: rgba(255, 255, 255, .13);
}

.input-section>.section-heading span {
  font-size: 14px;
  font-weight: 850;
}

.input-section> :not(.section-heading) {
  margin-right: 17px;
  margin-left: 17px;
}

.input-section> :last-child {
  margin-bottom: 0;
}

.field-grid {
  display: grid;
  gap: 9px;
}

.field-grid.three {
  grid-template-columns: repeat(3, 1fr);
}

.field-grid.two {
  grid-template-columns: repeat(2, 1fr);
}

.input-field {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.field-grid.three>.input-field {
  grid-template-rows: 30px auto auto;
  align-content: start;
}

.field-grid.three>.input-field>span:first-child {
  align-self: end;
}

.input-field>span:first-child,
.range-field>span:first-child {
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.input-field .field-label-note {
  display: block;
  margin-top: 2px;
  font-size: 9px;
  font-weight: 650;
  letter-spacing: 0;
  line-height: 1.15;
  text-transform: none;
}

.assumptions-grid>.input-field {
  grid-row: span 2;
  grid-template-rows: subgrid;
}

.input-field input,
.input-field select,
.input-wrap,
.suffix-wrap {
  min-width: 0;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
}

.input-field>input,
.input-field select {
  height: 41px;
  padding: 8px 9px;
  color: var(--ink);
  font-size: 14px;
  font-weight: 750;
}

.input-field small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.full {
  margin-top: 11px;
}

.portfolio-control {
  display: grid;
  grid-template-columns: minmax(210px, .85fr) minmax(150px, 1.15fr);
  align-items: end;
  gap: 16px;
}

.portfolio-slider-control,
.minimum-withdrawal-slider-control {
  display: flex;
  align-items: center;
  min-width: 0;
  min-height: 41px;
}

.portfolio-slider-control input,
.minimum-withdrawal-slider-control input {
  margin: 0;
}

.spending-mode {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5px;
  margin-top: 0;
  padding: 0;
  border: 0;
}

.spending-mode label {
  position: relative;
}

.spending-mode input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.spending-mode span {
  display: grid;
  place-items: center;
  min-height: 40px;
  padding: 7px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
  cursor: pointer;
}

.spending-mode input:checked+span {
  border-color: var(--brown);
  background: var(--brown);
  color: #fff;
}

.meaning-note {
  display: grid;
  gap: 2px;
  margin-top: 9px;
  padding: 9px 10px;
  border-radius: 7px;
  background: #f4eee8;
}

.meaning-note strong {
  color: var(--brown);
  font-size: 12px;
}

.meaning-note span {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}

#amountStrategyFields {
  margin-top: 10px;
}

.percent-spend-row {
  margin-top: 11px;
}

.input-wrap,
.suffix-wrap {
  display: flex;
  align-items: center;
  min-height: 39px;
  padding: 0 9px;
}

.input-wrap input,
.suffix-wrap input {
  min-width: 0;
  flex: 1;
  padding: 8px 5px;
  border: 0;
  outline: 0;
  background: transparent;
  font-size: 14px;
  font-weight: 800;
}

.input-wrap b,
.suffix-wrap b {
  color: var(--muted);
  font-size: 12px;
}

.input-wrap small {
  white-space: nowrap;
}

.withdrawal-percent {
  width: 100%;
}

.withdrawal-percent input {
  flex: 0 0 52px;
}

.withdrawal-percent b {
  margin-left: auto;
  white-space: nowrap;
}

.minimum-withdrawal {
  width: 100%;
}

.minimum-withdrawal-row {
  margin-top: 12px;
}

.minimum-withdrawal-slider-control {
  align-self: start;
  margin-top: 25px;
}

.input-wrap:focus-within,
.suffix-wrap:focus-within {
  border-color: var(--brown-light);
  box-shadow: 0 0 0 4px var(--focus);
}

.input-wrap input:focus-visible,
.suffix-wrap input:focus-visible {
  box-shadow: none;
}

.allocation-control {
  margin-top: 15px;
}

.allocation-labels {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-bottom: 7px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.allocation-labels span {
  display: flex;
  gap: 6px;
}

.allocation-labels b {
  color: var(--brown);
}

.allocation-labels .bonds-label {
  justify-content: center;
}

.allocation-labels .cash-label {
  justify-content: flex-end;
}

.allocation-slider {
  --stocks-position: 70%;
  --bonds-position: 95%;
  position: relative;
  height: 25px;
}

.allocation-track {
  position: absolute;
  top: 9px;
  right: 0;
  left: 0;
  height: 7px;
  overflow: hidden;
  border: 1px solid rgba(107, 68, 54, .25);
  border-radius: 999px;
  background: linear-gradient(to right, #704838 0 var(--stocks-position), #a7836f var(--stocks-position) var(--bonds-position), #d9d1c8 var(--bonds-position) 100%);
  box-shadow: inset 0 1px 2px rgba(57, 39, 31, .12);
}

.allocation-slider input[type="range"] {
  position: absolute;
  inset: 0;
  z-index: 2;
  width: 100%;
  height: 25px;
  margin: 0;
  appearance: none;
  pointer-events: none;
  background: transparent;
}

.allocation-slider input[type="range"]::-webkit-slider-runnable-track {
  height: 7px;
  background: transparent;
}

.allocation-slider input[type="range"]::-moz-range-track {
  height: 7px;
  background: transparent;
}

.allocation-slider input[type="range"]::-webkit-slider-thumb {
  width: 18px;
  height: 18px;
  margin-top: -6px;
  appearance: none;
  border: 2px solid #f7f2ed;
  border-radius: 50%;
  background: #704838;
  box-shadow: 0 1px 4px rgba(57, 39, 31, .28);
  pointer-events: auto;
  cursor: grab;
}

.allocation-slider input[type="range"]::-moz-range-thumb {
  width: 16px;
  height: 16px;
  border: 2px solid #f7f2ed;
  border-radius: 50%;
  background: #704838;
  box-shadow: 0 1px 4px rgba(57, 39, 31, .28);
  pointer-events: auto;
  cursor: grab;
}

.allocation-slider #allocationBoundary {
  z-index: 3;
}

.allocation-slider #allocationBoundary::-webkit-slider-thumb {
  background: #8f6a56;
}

.allocation-slider #allocationBoundary::-moz-range-thumb {
  background: #8f6a56;
}

.allocation-slider:focus-within .allocation-track {
  box-shadow: 0 0 0 4px var(--focus), inset 0 1px 2px rgba(57, 39, 31, .12);
}

.allocation-slider input[type="range"]:focus-visible {
  box-shadow: none;
}

input[type="range"] {
  width: 100%;
  accent-color: var(--brown);
}

.strategy-note {
  margin-top: 10px;
  padding: 10px 11px;
  border-left: 3px solid var(--brown-light);
  background: #f4eee8;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.strategy-note span {
  color: var(--brown);
  font-weight: 850;
}

.range-field {
  display: grid;
  gap: 5px;
  margin-top: 11px;
}

.range-field>span {
  display: flex;
  justify-content: space-between;
}

.range-field i {
  font-style: normal;
}

.range-field small {
  color: var(--muted);
  font-size: 11px;
}

.event-builder {
  margin-top: 14px;
}

.subheading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 6px;
}

.event-builder .subheading {
  justify-content: flex-start;
  gap: 9px;
}

.event-builder .subheading .text-button {
  padding: 2px 0;
  border-bottom: 0;
}

.subheading span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  text-transform: uppercase;
}

.cash-flow-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 24px;
  gap: 8px;
  margin-top: 8px;
  padding: 10px;
  border: 1px solid var(--line-soft);
  border-radius: 9px;
  background: rgba(255, 255, 255, .58);
}

.cash-flow-row label {
  display: grid;
  min-width: 0;
  gap: 4px;
}

.cash-flow-row label>span:first-child {
  color: var(--muted);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.cash-flow-row input,
.cash-flow-row select {
  width: 100%;
  min-width: 0;
  height: 34px;
  padding: 7px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  color: var(--ink);
  font-size: 12px;
}

.cash-flow-details {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: minmax(0, 1.35fr) 72px 72px;
  gap: 8px;
}

.cash-flow-money {
  display: flex;
  align-items: center;
  height: 34px;
  padding-left: 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}

.cash-flow-money b {
  color: var(--muted);
  font-size: 12px;
}

.cash-flow-money input {
  height: 32px;
  padding-left: 5px;
  border: 0;
  background: transparent;
}

.cash-flow-money input:focus-visible {
  box-shadow: none;
}

.cash-flow-end.is-disabled {
  opacity: .38;
}

.remove-flow {
  align-self: end;
  height: 34px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--red);
  font-size: 18px;
}

.stress-hint {
  margin: 0 0 7px;
  color: var(--muted);
  font-size: 11px;
}

.stress-options {
  display: grid;
  gap: 6px;
}

.stress-options label {
  display: grid;
  grid-template-columns: 17px 1fr;
  gap: 7px;
  align-items: center;
  padding: 9px;
  border: 1px solid var(--line-soft);
  border-radius: 7px;
  background: #fff;
}

.stress-options label:has(input:checked) {
  border-color: var(--brown-light);
  background: #f7f0ea;
  box-shadow: inset 3px 0 0 var(--brown);
}

.stress-options input {
  accent-color: var(--brown);
}

.stress-options b,
.stress-options small {
  display: block;
}

.stress-options b {
  font-size: 12px;
}

.stress-options small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.results-heading {
  margin: 0 -18px;
  padding-right: 18px;
  padding-left: 18px;
}

.results-heading-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
}

.plan-heading-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.plan-heading-actions .optimizer-control {
  grid-template-columns: minmax(88px, 1fr) 62px;
}

.plan-heading-actions .optimizer-control label {
  display: none;
}

.plan-heading-actions .optimizer-control button {
  min-width: 62px;
  padding-right: 8px;
  padding-left: 8px;
}

.optimizer-control {
  display: grid;
  grid-template-columns: auto minmax(112px, 1fr) auto;
  align-items: stretch;
  height: 38px;
  overflow: visible;
  border: 1px solid rgba(107, 68, 54, .2);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(62, 43, 35, .04);
}

.optimizer-control label {
  display: flex;
  align-items: center;
  padding: 0 11px;
  border-right: 1px solid rgba(107, 68, 54, .14);
  background: #f7f3ef;
  color: var(--muted);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .055em;
  text-transform: uppercase;
  white-space: nowrap;
}

.optimizer-control select {
  min-width: 0;
  height: 100%;
  padding: 0 31px 0 11px;
  border: 0;
  border-radius: 0;
  outline: 0;
  appearance: none;
  background-color: #fff;
  background-image: linear-gradient(45deg, transparent 50%, var(--brown) 50%), linear-gradient(135deg, var(--brown) 50%, transparent 50%);
  background-position: calc(100% - 14px) 16px, calc(100% - 9px) 16px;
  background-repeat: no-repeat;
  background-size: 5px 5px, 5px 5px;
  color: var(--ink);
  font-size: 10px;
  font-weight: 750;
}

.optimizer-control select:focus-visible {
  box-shadow: inset 0 0 0 2px rgba(108, 70, 55, .26);
}

.optimizer-control button {
  min-width: 68px;
  padding: 0 10px;
  border: 0;
  border-left: 1px solid rgba(107, 68, 54, .14);
  border-radius: 0;
  background: #3f765d;
  color: #fff;
  font-size: 9px;
  font-weight: 850;
}

.optimizer-control button:disabled {
  background: #e2dcd6;
  color: #91877f;
  cursor: default;
}

.optimizer-control button.is-loading {
  position: relative;
  background: #3f765d;
  color: transparent;
}

.optimizer-control button.is-loading::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 13px;
  height: 13px;
  margin: -7px 0 0 -7px;
  border: 2px solid rgba(255, 255, 255, .42);
  border-top-color: #fff;
  border-radius: 50%;
  content: "";
  animation: optimize-spin .7s linear infinite;
}

@keyframes optimize-spin {
  to { transform: rotate(360deg); }
}

.simulation-explainer {
  margin-top: 14px;
  padding: 10px 12px;
  border: 1px solid #e1d7cf;
  border-radius: 9px;
  background: #f5f0eb;
}

.simulation-explainer h3 {
  color: var(--brown);
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 850;
}

.simulation-explainer p {
  margin-top: 7px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.55;
}

.method-comparison {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 10px;
}

.method-comparison.single-method {
  grid-template-columns: 1fr;
}

.method-comparison article {
  padding: 11px 12px;
  border: 1px solid var(--line-soft);
  border-radius: 9px;
  background: #fff;
}

.method-comparison span,
.method-comparison strong,
.method-comparison small {
  display: block;
}

.method-comparison span {
  color: var(--brown-light);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.method-comparison strong {
  margin-top: 3px;
  font-family: var(--font-display);
  font-size: 25px;
  font-weight: 650;
}

.method-comparison small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}

.view-tabs {
  display: flex;
  padding: 3px;
  border-radius: 7px;
  background: #ede7e1;
}

.view-tabs button {
  padding: 7px 10px;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
}

.view-tabs button.active {
  background: #fff;
  color: var(--brown);
  box-shadow: 0 2px 7px rgba(57, 39, 31, .08);
}

.view-tabs i {
  display: inline-grid;
  place-items: center;
  min-width: 17px;
  height: 17px;
  border-radius: 9px;
  background: var(--brown);
  color: #fff;
  font-style: normal;
  font-size: 10px;
}

.score-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.score-card-grid.single-method.grouped-scenarios {
  grid-template-columns: 1fr;
}

.score-card {
  --method-accent: var(--brown);
  --status-accent: #3f765d;
  --card-surface: #e6f0e9;
  --card-track: #bdd6c6;
  --card-muted: #56685e;
  --card-line: rgba(63, 118, 93, .24);
  --card-shadow: rgba(63, 118, 93, .13);
  min-width: 0;
  padding: 16px;
  border: 1px solid var(--card-line);
  border-radius: 12px;
  background: var(--card-surface);
  color: var(--ink);
  box-shadow: 0 10px 26px var(--card-shadow);
  container-type: inline-size;
}

.method-score-card>.method-card-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 16px;
  min-height: 98px;
}

.method-heading-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
}

.method-heading-copy .status-pill {
  margin-top: 12px;
}

.method-historical {
  --method-accent: var(--clay);
}

.method-montecarlo {
  --method-accent: #1d6475;
}

.method-montecarlo.scenario-bear {
  --method-accent: #b23a32;
}

.method-montecarlo.scenario-inflation {
  --method-accent: #946400;
}

.tone-strong {
  --status-accent: #3f765d;
  --card-surface: #e4efe8;
  --card-track: #bad4c3;
  --card-muted: #53675b;
  --card-line: rgba(63, 118, 93, .25);
  --card-shadow: rgba(63, 118, 93, .14);
}

.tone-watch {
  --status-accent: #a06b21;
  --card-surface: #f4e8ce;
  --card-track: #e1c78f;
  --card-muted: #6d6048;
  --card-line: rgba(160, 107, 33, .26);
  --card-shadow: rgba(160, 107, 33, .14);
}

.tone-fragile {
  --status-accent: #a14b42;
  --card-surface: #f1ddda;
  --card-track: #dfb5af;
  --card-muted: #6f5754;
  --card-line: rgba(161, 75, 66, .26);
  --card-shadow: rgba(161, 75, 66, .14);
}

.method-card-heading {
  display: grid;
  gap: 3px;
  padding-bottom: 11px;
  border-bottom: 1px solid var(--card-line);
}

.method-card-heading>span,
.method-heading-copy>span:first-child {
  color: var(--method-accent);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.method-card-heading>small,
.method-heading-copy>small {
  color: var(--card-muted);
  font-size: 11px;
  font-weight: 650;
  line-height: 1.3;
}

.score-overview {
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr);
  align-items: center;
  gap: 13px;
  margin-top: 14px;
}

.score-gauge {
  position: relative;
  display: grid;
  place-items: center;
  width: 82px;
  height: 82px;
}

.score-gauge svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  transform: rotate(-90deg);
}

.gauge-track,
.gauge-value {
  fill: none;
  stroke-width: 6;
}

.gauge-track {
  stroke: color-mix(in srgb, var(--card-track), #fff 24%);
}

.gauge-value {
  stroke: var(--status-accent);
  stroke-linecap: round;
}

.score-gauge.is-complete .gauge-value {
  stroke-linecap: butt;
}

.score-gauge.is-empty .gauge-value {
  display: none;
}

.gauge-label {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  place-items: center;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .38);
  text-align: center;
}

.gauge-label strong {
  display: block;
  color: var(--status-accent);
  font-family: var(--font-body);
  font-size: 22px;
  font-variant-numeric: tabular-nums;
  font-weight: 850;
  letter-spacing: -.045em;
  line-height: 1;
}

.gauge-label span {
  display: block;
  margin-top: 5px;
  color: var(--card-muted);
  font-size: 6.5px;
  font-weight: 850;
  letter-spacing: .09em;
  line-height: 1;
  text-transform: uppercase;
}

.gauge-badge {
  position: absolute;
  right: 2px;
  bottom: 3px;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border: 2px solid var(--card-surface);
  border-radius: 50%;
  background: #3d7258;
  color: #fff;
  box-shadow: 0 2px 5px rgba(57,39,31,.18);
  font-size: 9px;
  font-weight: 900;
  line-height: 1;
}

.score-gauge.watch .gauge-badge {
  background: #9a6c24;
}

.score-gauge.fragile .gauge-badge {
  background: #98483f;
}

.score-copy {
  min-width: 0;
}

.status-pill {
  display: inline-flex;
  padding: 4px 7px;
  border: 1px solid #bcd8c7;
  border-radius: 999px;
  background: #d7e9de;
  color: #285b42;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.status-pill.watch {
  border-color: #dcc48f;
  background: #f1e2bf;
  color: #745218;
}

.status-pill.fragile {
  border-color: #ddb9b3;
  background: #efd6d2;
  color: #7b342e;
}

.score-metrics {
  display: grid;
  margin-top: 14px;
  overflow: hidden;
  border: 1px solid var(--card-line);
  border-radius: 9px;
  background: rgba(255, 255, 255, .76);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .85);
}

.score-metrics div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
  padding: 10px 11px;
  border-bottom: 1px solid var(--card-line);
}

.score-metrics div:last-child {
  border-bottom: 0;
}

.score-metrics span,
.score-metrics strong,
.score-metrics b,
.score-metrics small {
  display: block;
}

.score-metrics span {
  min-width: 0;
  color: var(--card-muted);
  line-height: 1.25;
}

.score-metrics b {
  color: var(--ink);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}

.score-metrics small {
  margin-top: 2px;
  font-size: 9px;
  line-height: 1.3;
}

.score-metrics strong {
  flex: 0 0 auto;
  color: var(--ink);
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 670;
  text-align: right;
  white-space: nowrap;
}

.montecarlo-group-card {
  --method-accent: #1d6475;
}

.montecarlo-scenario-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  margin-top: 12px;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.montecarlo-scenario {
  min-width: 0;
  padding: 0;
  background: color-mix(in srgb, var(--card-surface) 54%, transparent);
  text-align: center;
}

.montecarlo-scenario+.montecarlo-scenario {
  border-left: 1px solid rgba(49, 95, 112, .18);
}

.scenario-heading {
  display: grid;
  place-items: center;
  min-height: 28px;
  padding-bottom: 7px;
  border-bottom: 1px solid var(--card-line);
}

.scenario-heading span {
  color: var(--method-accent);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .045em;
  line-height: 1.15;
  text-transform: uppercase;
}

.scenario-bear .scenario-heading span {
  color: #b23a32;
}

.scenario-inflation .scenario-heading span {
  color: #946400;
}

.compact-scenario-status {
  display: grid;
  justify-items: center;
  gap: 5px;
  margin-top: 8px;
}

.montecarlo-scenario .score-gauge {
  width: 58px;
  height: 58px;
}

.montecarlo-scenario .gauge-label {
  width: 43px;
  height: 43px;
}

.montecarlo-scenario .gauge-label strong {
  font-size: 16px;
}

.montecarlo-scenario .gauge-label span {
  display: none;
}

.montecarlo-scenario .gauge-badge {
  right: -2px;
  bottom: 0;
  width: 16px;
  height: 16px;
  border-width: 2px;
  font-size: 8px;
}

.montecarlo-scenario .status-pill {
  padding: 3px 5px;
  font-size: 7px;
}

.compact-scenario-metrics {
  display: grid;
  gap: 0;
  margin-top: 7px;
  border-top: 1px solid var(--card-line);
}

.compact-scenario-metrics>span {
  display: grid;
  gap: 1px;
  padding: 6px 1px;
  border-bottom: 1px solid var(--card-line);
}

.compact-scenario-metrics>span:last-child {
  border-bottom: 0;
}

.compact-scenario-metrics small {
  color: var(--card-muted);
  font-size: 7px;
  font-weight: 800;
  letter-spacing: .03em;
  text-transform: uppercase;
}

.compact-scenario-metrics strong {
  color: var(--ink);
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 680;
  line-height: 1.05;
  white-space: nowrap;
}

@container (min-width: 440px) {
  .method-card-heading {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
  }

  .method-card-heading small {
    text-align: right;
  }

  .method-score-card>.method-card-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
  }

  .method-score-card>.method-card-heading small {
    text-align: left;
  }

  .score-overview {
    grid-template-columns: 96px minmax(0, 1fr);
  }

  .score-gauge {
    width: 86px;
    height: 86px;
  }

  .gauge-label {
    width: 62px;
    height: 62px;
  }

  .gauge-label strong {
    font-size: 23px;
  }

  .score-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .score-metrics div {
    display: block;
    padding: 12px;
    border-right: 1px solid var(--card-line);
    border-bottom: 0;
  }

  .score-metrics div:last-child {
    border-right: 0;
  }

  .score-metrics strong {
    margin-top: 7px;
    text-align: left;
  }
}

.chart-card,
.advisor-card {
  margin-top: 14px;
  padding: 16px;
  border: 1px solid var(--line-soft);
  border-radius: 11px;
  background: #fff;
}

.card-heading {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 15px;
}

.card-heading>div>span {
  color: var(--clay);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.card-heading h3 {
  margin-top: 3px;
  font-size: 19px;
}

.chart-key {
  display: flex;
  gap: 11px;
  color: var(--muted);
  font-size: 10px;
}

.chart-key span {
  display: flex;
  align-items: center;
  gap: 4px;
}

.chart-key i {
  display: inline-block;
  width: 15px;
  height: 6px;
}

.chart-key .band {
  background: rgba(167, 115, 94, .22);
}

.chart-key .line {
  height: 2px;
  background: var(--brown);
}

.portfolio-chart-heading>div:first-child {
  flex: 0 0 auto;
}

.portfolio-chart-heading h3 {
  white-space: nowrap;
}

.portfolio-chart-controls {
  display: grid;
  flex: 1 1 auto;
  min-width: 0;
  justify-items: end;
  gap: 7px;
}

.portfolio-series-toggles {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  width: 100%;
  gap: 6px;
}

.portfolio-series-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 31px;
  padding: 6px 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--muted);
  font-size: 10px;
  font-weight: 850;
}

.portfolio-series-toggle i {
  width: 18px;
  height: 3px;
  border-radius: 99px;
  background: currentColor;
}

.portfolio-toggle-historical {
  color: var(--clay);
}

.portfolio-toggle-montecarlo-normal {
  color: #1d6475;
}

.portfolio-toggle-montecarlo-bear {
  color: #b23a32;
}

.portfolio-toggle-montecarlo-inflation {
  color: #946400;
}

.portfolio-toggle-historical i,
.portfolio-toggle-montecarlo-inflation i {
  background: currentColor;
}

.portfolio-series-toggle[aria-pressed="true"] {
  background: color-mix(in srgb, currentColor 10%, white);
  border-color: color-mix(in srgb, currentColor 42%, white);
  box-shadow: 0 2px 8px rgba(57, 39, 31, .08);
}

.portfolio-series-toggle[aria-pressed="false"] {
  opacity: .48;
}

.portfolio-series-toggle[aria-pressed="false"] i {
  background: transparent;
  box-shadow: inset 0 0 0 1px currentColor;
}

.portfolio-combined-chart {
  margin-top: 12px;
}

.portfolio-chart-stage {
  position: relative;
  padding: 10px 10px 8px;
  border: 1px solid var(--line-soft);
  border-radius: 9px;
  background: #fbfaf8;
}

.portfolio-chart-stage .chart {
  height: 245px;
  margin-top: 0;
}

.portfolio-series-band {
  stroke: none;
}

.portfolio-series-band.portfolio-series-historical {
  fill: rgba(201, 108, 71, .12);
}

.portfolio-series-band.portfolio-series-montecarlo-normal {
  fill: rgba(29, 100, 117, .11);
}

.portfolio-series-band.portfolio-series-montecarlo-bear {
  fill: rgba(178, 58, 50, .10);
}

.portfolio-series-band.portfolio-series-montecarlo-inflation {
  fill: rgba(148, 100, 0, .10);
}

.portfolio-series-line {
  fill: none;
  stroke-width: 2.7;
}

.portfolio-series-line.portfolio-series-historical {
  stroke: var(--clay);
}

.portfolio-series-line.portfolio-series-montecarlo-normal {
  stroke: #1d6475;
}

.portfolio-series-line.portfolio-series-montecarlo-bear {
  stroke: #b23a32;
}

.portfolio-series-line.portfolio-series-montecarlo-inflation {
  stroke: #946400;
}

.portfolio-age-axis {
  position: relative;
  height: 20px;
  margin: -33px 1.3% 0 6.3%;
  border-top: 1px solid #d8cfc7;
}

.portfolio-age-axis span {
  position: absolute;
  top: 6px;
  color: #6f675f;
  font-size: 11px;
  font-weight: 600;
  line-height: 1;
  transform: translateX(-50%);
}

.portfolio-age-axis span::before {
  position: absolute;
  top: -7px;
  left: 50%;
  width: 1px;
  height: 4px;
  background: #c7bdb4;
  content: "";
}

.portfolio-axis-title {
  margin-top: 5px;
  color: #766e67;
  font-size: 11px;
  font-weight: 750;
  letter-spacing: .04em;
  text-align: center;
}

.portfolio-ss-marker {
  stroke: #fff;
  stroke-width: 2;
  cursor: help;
  filter: drop-shadow(0 1px 2px rgba(57, 39, 31, .24));
}

.portfolio-ss-historical { fill: var(--clay); }
.portfolio-ss-montecarlo-normal { fill: #1d6475; }
.portfolio-ss-montecarlo-bear { fill: #b23a32; }
.portfolio-ss-montecarlo-inflation { fill: #946400; }

.portfolio-chart-empty {
  position: absolute;
  inset: 50% 20px auto;
  color: var(--muted);
  font-size: 12px;
  text-align: center;
  transform: translateY(-50%);
}

.chart {
  position: relative;
  height: 205px;
  margin-top: 10px;
}

.chart svg {
  width: 100%;
  height: 100%;
  overflow: visible;
}

.chart-grid {
  stroke: #ebe5df;
  stroke-width: 1;
}

.chart-band {
  fill: var(--chart-band, rgba(167, 115, 94, .17));
  stroke: none;
}

.chart-median {
  fill: none;
  stroke: var(--chart-line, var(--brown));
  stroke-width: 2.2;
}

.chart-zero {
  stroke: var(--red);
  stroke-dasharray: 4 4;
  stroke-width: 1;
}

.chart-label {
  fill: var(--muted);
  stroke: none;
  font-size: 10px;
}

.chart-foot {
  display: flex;
  justify-content: space-between;
  color: var(--muted);
  font-size: 10px;
}

.historical-chart-card {
  background: #fbf8f4;
}

.historical-chart-note {
  margin-top: 8px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}

.historical-chart-note a {
  color: var(--brown);
  font-weight: 800;
}

.historical-chart {
  height: 230px;
}

.historical-line {
  fill: none;
  stroke: rgba(107, 68, 54, .45);
  stroke-width: 1.2;
}

.historical-point {
  fill: var(--brown);
  stroke: #fff;
  stroke-width: 1;
}

.historical-point.failure {
  fill: var(--red);
}

.withdrawal-chart-card {
  background: #f7faf8;
}

.withdrawal-chart-heading {
  align-items: center;
}

.withdrawal-chart-key {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px 14px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.withdrawal-chart-key span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.withdrawal-chart-key i {
  display: inline-block;
  width: 18px;
}

.withdrawal-chart-key .amount {
  height: 9px;
  border-radius: 2px;
  background: #79a391;
}

.withdrawal-chart-key .rate {
  height: 3px;
  border-radius: 99px;
  background: #6b4436;
}

.withdrawal-chart-note {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}

.withdrawal-chart {
  height: 250px;
}

.withdrawal-amount-bar {
  fill: #79a391;
  opacity: .78;
}

.withdrawal-amount-bar:hover {
  fill: #477b68;
  opacity: 1;
}

.withdrawal-rate-line {
  fill: none;
  stroke: #6b4436;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2.5;
}

.withdrawal-rate-point {
  fill: #6b4436;
  stroke: #fff;
  stroke-width: 1;
}

.withdrawal-social-marker {
  stroke: #ad8144;
  stroke-dasharray: 4 4;
  stroke-width: 1.5;
}

.withdrawal-social-label {
  fill: #8a642f;
  font-weight: 750;
}

@media (max-width: 600px) {
  .withdrawal-chart-heading {
    align-items: flex-start;
    flex-direction: column;
  }

  .withdrawal-chart-key {
    justify-content: flex-start;
  }

  .withdrawal-chart {
    height: 220px;
  }
}

.period-count {
  color: var(--brown);
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 620;
}

.advisor-card {
  background: #f1e9e2;
}

.advisor-heading {
  display: flex;
  gap: 9px;
  align-items: center;
}

.advisor-mark {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 9px;
  background: var(--brown);
  color: #fff;
  font-family: var(--font-display);
  font-size: 19px;
}

.advisor-heading div>span {
  color: var(--brown-light);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.advisor-heading h3 {
  margin-top: 2px;
  font-size: 18px;
}

.suggested-questions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 11px;
}

.suggested-questions button {
  padding: 6px 9px;
  border: 1px solid #d8cbc0;
  border-radius: 999px;
  background: rgba(255, 255, 255, .65);
  color: var(--brown);
  font-size: 11px;
  font-weight: 800;
}

.question-box {
  display: flex;
  margin-top: 9px;
  border: 1px solid #d1c1b5;
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
}

.question-box input {
  min-width: 0;
  flex: 1;
  padding: 11px;
  border: 0;
  outline: 0;
  font-size: 12px;
}

.question-box button {
  padding: 0 14px;
  border: 0;
  background: var(--brown);
  color: #fff;
  font-size: 11px;
  font-weight: 850;
}

.answer-box {
  margin-top: 9px;
  padding: 11px;
  border-left: 3px solid var(--brown);
  background: rgba(255, 255, 255, .65);
  font-size: 12px;
  line-height: 1.55;
}

.answer-box strong {
  color: var(--brown);
}

.disclaimer {
  margin-top: 14px;
  padding: 12px 2px 0;
  border-top: 1px solid var(--line-soft);
  color: var(--muted);
  font-size: 11px;
  line-height: 1.5;
  text-align: center;
}

.disclaimer span {
  display: block;
}

.disclaimer a {
  color: var(--brown);
  font-weight: 750;
  text-underline-offset: 2px;
}

.comparison-grid {
  display: grid;
  gap: 10px;
  padding-top: 18px;
}

.comparison-card {
  display: grid;
  grid-template-columns: minmax(100px, 1fr) repeat(5, minmax(70px, .7fr)) 24px;
  align-items: center;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--line-soft);
  border-radius: 9px;
  background: #fff;
  cursor: pointer;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.comparison-card:hover {
  border-color: rgba(107, 68, 54, .28);
  box-shadow: 0 7px 20px rgba(57, 39, 31, .08);
  transform: translateY(-1px);
}

.comparison-card:focus-visible {
  box-shadow: 0 0 0 4px var(--focus), 0 7px 20px rgba(57, 39, 31, .08);
}

.comparison-card span,
.comparison-card strong {
  display: block;
}

.comparison-card span {
  color: var(--muted);
  font-size: 10px;
  text-transform: uppercase;
}

.comparison-card strong {
  margin-top: 3px;
  font-size: 12px;
}

.comparison-card .comparison-success {
  font-weight: 850;
}

.comparison-success-strong {
  color: #2f6f52;
}

.comparison-success-watch {
  color: #976116;
}

.comparison-success-fragile {
  color: #a1433a;
}

.delete-scenario {
  border: 0;
  background: transparent;
  color: var(--red);
}

.empty-compare {
  padding: 80px 20px;
  text-align: center;
}

.empty-compare span {
  font-family: var(--font-display);
  font-size: 22px;
  font-weight: 600;
}

.empty-compare p {
  max-width: 390px;
  margin: 8px auto 0;
  color: var(--muted);
  font-size: 12px;
}

.toast {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 2000;
  padding: 10px 14px;
  border-radius: 8px;
  background: var(--brown-dark);
  color: #fff;
  box-shadow: var(--shadow);
  font-size: 11px;
  font-weight: 800;
}

/* Keep supporting copy readable without flattening the visual hierarchy. */
.method-comparison span,
.status-pill,
.score-metrics span,
.card-heading>div>span,
.chart-key,
.chart-label,
.chart-foot,
.advisor-heading div>span,
.disclaimer,
.comparison-card span {
  font-size: 11px;
}

:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 4px var(--focus);
}

@media (min-width: 1101px) {

  html,
  body {
    height: 100%;
  }

  body {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
  }

  .app-shell {
    min-height: 0;
  }

  .workbench-home {
    height: 100%;
    min-height: 0;
  }

  .think-tank:not([hidden]) {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    height: 100%;
    min-height: 0;
    overflow: hidden;
  }

  .think-tank-layout {
    height: 100%;
    min-height: 0;
    overflow: hidden;
  }

  .think-people-panel,
  .think-responses {
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
  }

  .tool-rail {
    top: 0;
    height: 100%;
    overflow-y: auto;
  }

  .planner,
  .planner-grid {
    height: 100%;
    min-height: 0;
  }

  .plan-panel,
  .results-panel {
    height: 100%;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
  }

  .panel-heading {
    position: sticky;
    top: 0;
    z-index: 20;
    background: rgba(255, 253, 249, .97);
    backdrop-filter: blur(12px);
  }
}

@media (min-width: 1101px) and (max-width: 1320px) {
  .topbar:has(.provider-top-actions:not([hidden])) {
    grid-template-columns: minmax(180px, 1fr) auto;
  }

  .topbar:has(.provider-top-actions:not([hidden])) .provider-top-actions {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .topbar:has(.provider-top-actions:not([hidden])) .topbar-partner {
    grid-column: 2;
    grid-row: 1;
  }
}

@media (max-width: 1100px) {
  .topbar {
    grid-template-columns: minmax(180px, 1fr) auto;
  }

  .top-actions {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .topbar-partner {
    grid-column: 2;
    grid-row: 1;
  }

  .planner-grid {
    grid-template-columns: 1fr;
  }

  .plan-panel {
    display: block;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .plan-panel>.panel-heading {
    grid-column: auto;
  }

  .input-section {
    border-right: 0;
  }

  .results-panel {
    max-width: none;
  }
}

@media (max-width: 980px) {
  .workbench-home-grid {
    grid-template-columns: 1fr;
  }

  .workbench-home-card {
    min-height: 230px;
  }
}

@media (max-width: 760px) {
  html,
  body {
    max-width: 100%;
    overflow-x: hidden;
  }

  .topbar {
    position: relative;
    grid-template-columns: minmax(0, 1fr) auto;
    padding-bottom: 0;
  }

  .topbar:has(.top-actions:not([hidden])) {
    padding-bottom: 13px;
  }

  .brand-block {
    grid-column: 1;
    grid-row: 1;
  }

  .top-actions {
    grid-column: 1 / -1;
    grid-row: 3;
    width: calc(100% - 24px);
    min-width: 0;
    flex-wrap: wrap;
    justify-self: stretch;
    margin-right: 12px;
    margin-left: 12px;
    margin-top: 8px;
  }

  #retirementTopActions .scenario-name {
    flex: 1 1 100%;
    width: 100%;
  }

  #retirementTopActions .button {
    flex: 1 1 0;
    min-width: 0;
  }

  #retirementTopActions .button span {
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .provider-top-actions {
    width: calc(100% - 24px);
    flex-wrap: wrap;
    justify-self: stretch;
    margin-inline: 12px;
  }
  .provider-insurance-field { flex: 1; }
  .provider-insurance-multiselect { width: 100%; }
  .provider-coverage-top-status { max-width: none; flex: 1 0 100%; }

  .scenario-name {
    min-width: 0;
    flex: 1;
  }

  .scenario-name input {
    width: auto;
    flex: 1;
  }

  .partner-line {
    display: block;
    max-width: 132px;
    padding: 4px 7px;
    font-size: 10px;
  }

  .topbar-partner {
    grid-column: 2;
    grid-row: 1;
    align-self: start;
    justify-self: end;
  }

  .results-heading {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .results-heading-actions {
    justify-content: space-between;
    width: 100%;
  }

  .app-shell {
    grid-template-columns: 1fr;
    min-height: 0;
    align-content: start;
  }

  .think-tank {
    height: auto;
    overflow: visible;
  }

  .think-tank-hero.is-compact {
    gap: 0;
  }

  .think-tank-hero.is-compact>div:first-child {
    display: none;
  }

  .tool-rail {
    position: relative;
    top: 0;
    width: 100%;
    height: auto;
    overflow: hidden;
    padding: 8px 10px;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .tool-list,
  .planner,
  .planner-grid,
  .plan-panel,
  .results-panel {
    width: 100%;
    min-width: 0;
  }

  .topbar>.tool-rail {
    grid-column: 1 / -1;
    grid-row: 2;
    width: auto;
    margin: 8px -16px 0;
  }

  .tool-rail.is-mobile-scroll-revealed {
    position: fixed;
    z-index: 1100;
    top: 0;
    right: 0;
    left: 0;
    width: 100%;
    margin: 0;
    box-shadow: 0 8px 20px rgba(42, 27, 21, .16);
    animation: mobile-tool-rail-in .16s ease-out;
  }

  .think-tank-hero.has-mobile-tool-rail {
    top: 67px;
  }

  @keyframes mobile-tool-rail-in {
    from { transform: translateY(-100%); }
    to { transform: translateY(0); }
  }

  .tool-link.soon {
    display: none;
  }

  .tool-list {
    display: none;
  }

  .mobile-tool-select {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    width: 100%;
    gap: 12px;
  }

  .mobile-tool-select>span {
    color: var(--brown-dark);
    font-size: 12px;
    font-weight: 850;
  }

  .mobile-tool-select select {
    width: 100%;
    min-width: 0;
    height: 42px;
    padding: 0 36px 0 12px;
    border: 1px solid rgba(107, 68, 54, .24);
    border-radius: 8px;
    background-color: #fff;
    color: var(--ink);
    font-size: 14px;
    font-weight: 750;
  }

  .tool-link {
    flex: 0 0 auto;
    grid-template-columns: 31px;
    justify-content: center;
    width: 44px;
    min-width: 44px;
    height: 44px;
    padding: 6px;
  }

  .tool-link>span:not(.tool-icon) {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
  }

  .workbench-home-inner {
    padding: 18px;
  }

  .planner-grid {
    display: block;
  }

  .mobile-control-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    min-height: 48px;
    padding: 12px 16px;
    border: 0;
    border-bottom: 1px solid var(--line);
    border-radius: 0;
    color: var(--brown-dark);
    background: #f6f1eb;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .02em;
    text-align: left;
    text-transform: none;
    cursor: pointer;
  }

  .mobile-control-toggle svg {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: transform .18s ease;
  }

  .mobile-control-toggle[aria-expanded="false"] svg {
    transform: rotate(-90deg);
  }

  .mobile-control-toggle:focus-visible {
    position: relative;
    z-index: 2;
    outline: 0;
    box-shadow: inset 0 0 0 3px var(--focus);
  }

  .plan-panel {
    display: block;
  }

  .plan-panel.is-mobile-collapsed,
  .debt-input-panel.is-mobile-collapsed,
  .think-people-panel.is-mobile-collapsed {
    display: none;
  }

  .plan-panel>.panel-heading {
    grid-column: auto;
    flex-wrap: wrap;
    gap: 10px;
  }

  .plan-panel>.panel-heading>div:first-child {
    flex: 1 1 auto;
    min-width: 0;
  }

  .plan-heading-actions {
    min-width: 0;
    max-width: 100%;
  }

  .field-grid.three,
  .field-grid.two {
    grid-template-columns: 1fr;
  }

  .portfolio-control,
  .percent-spend-row,
  .minimum-withdrawal-row {
    grid-template-columns: 1fr;
  }

  .simulation-type {
    grid-template-columns: 1fr;
  }

  .input-section> :not(.section-heading) {
    min-width: 0;
  }

  .results-panel {
    margin-top: 0;
  }

  .score-card-grid {
    grid-template-columns: 1fr;
  }

  .score-card {
    padding: 14px;
  }

  .score-metrics {
    grid-template-columns: 1fr;
  }

  .score-metrics div {
    border-right: 0;
    border-bottom: 1px solid var(--card-line);
  }

  .score-metrics div:last-child {
    border-bottom: 0;
  }

  .comparison-card {
    grid-template-columns: 1fr 1fr;
  }

  .chart-key {
    display: none;
  }
}

@media (max-width: 440px) {
  .top-actions .button-secondary {
    display: none;
  }

  .optimizer-control label {
    display: none;
  }

  .optimizer-control select {
    min-width: 78px;
  }

  .simulation-type {
    grid-template-columns: 1fr;
  }

  .simulation-type span {
    min-height: 46px;
  }

  .field-grid.three {
    grid-template-columns: 1fr;
  }

  .percent-spend-row,
  .minimum-withdrawal-row {
    grid-template-columns: 1fr;
  }

  .input-section> :not(.section-heading) {
    margin-right: 12px;
    margin-left: 12px;
  }

  .portfolio-control {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .score-metrics {
    text-align: left;
  }

  .method-comparison {
    grid-template-columns: 1fr;
  }
}

/* Mortgage calculator */
.mortgage-input-panel .panel-heading {
  background: rgba(234, 228, 221, .97);
}

.mortgage-homebook-link {
  text-decoration: none;
}

.mortgage-home-section {
  background: #eae4ddf7;
}

.mortgage-input-panel .field-grid>.input-field {
  grid-template-rows: 18px 41px auto;
  align-content: start;
}

.mortgage-loan-section {
  background: #ede8e2f7;
}

.mortgage-costs-section {
  min-height: calc(100% - 371px);
  background: #f1ede8f7;
}

#mortgagePmiField.is-not-applicable .suffix-wrap {
  background: rgba(255, 255, 255, .58);
}

#mortgagePmiField.is-not-applicable input,
#mortgagePmiField.is-not-applicable .suffix-wrap b {
  color: #8e877f;
}

.mortgage-slider-control {
  display: grid;
  gap: 8px;
  margin-top: 14px;
}

.mortgage-slider-control>span {
  display: flex;
  justify-content: space-between;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.mortgage-slider-control i {
  font-style: normal;
}

.mortgage-slider-control b {
  color: var(--brown);
}

.mortgage-extra-builder {
  margin-top: 17px;
}

.mortgage-extra-builder .subheading {
  justify-content: flex-start;
  gap: 9px;
  margin-bottom: 0;
}

.mortgage-extra-builder .text-button {
  padding: 2px 0;
  border-bottom: 0;
}

.mortgage-extra-row {
  display: grid;
  grid-template-columns: minmax(125px, .8fr) minmax(145px, 1fr) 28px;
  align-items: end;
  gap: 8px;
  margin-top: 8px;
  padding: 10px;
  border: 1px solid rgba(107, 68, 54, .14);
  border-radius: 8px;
  background: rgba(255, 255, 255, .58);
}

.mortgage-extra-row label {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.mortgage-extra-row label>span:first-child {
  color: var(--muted);
  font-size: 9px;
  font-weight: 820;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.mortgage-extra-row>label>input,
.mortgage-extra-row .cash-flow-money {
  width: 100%;
  height: 35px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}

.mortgage-extra-row>label>input {
  min-width: 0;
  padding: 7px 8px;
  color: var(--ink);
  font-size: 12px;
  font-weight: 700;
}

.mortgage-extra-row .cash-flow-money input {
  font-weight: 750;
}

.remove-mortgage-extra {
  display: grid;
  width: 28px;
  height: 35px;
  place-items: center;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--red);
  font-size: 18px;
}

.mortgage-payment-card {
  margin: 10px 0 14px;
  padding: 22px 24px;
  border: 1px solid rgba(63, 118, 93, .24);
  border-radius: 12px;
  background: #e7f0eb;
  box-shadow: 0 12px 28px rgba(63, 118, 93, .09);
}

.mortgage-payment-overview {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(330px, 420px);
  align-items: center;
  gap: 22px;
}

.mortgage-payment-copy {
  display: grid;
}

.mortgage-payment-copy>span:first-child {
  color: #3f6654;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.mortgage-payment-copy>strong {
  margin-top: 5px;
  color: #234c3b;
  font-family: var(--font-display);
  font-size: clamp(38px, 4.4vw, 58px);
  font-variation-settings: "wght" 620;
  line-height: 1;
  letter-spacing: -.035em;
}

.mortgage-payment-copy>small {
  margin-top: 9px;
  color: #5c6c63;
  font-size: 11px;
}

.mortgage-cost-bar {
  position: relative;
  width: 100%;
  height: 18px;
  margin-top: 38px;
  border: 2px solid rgba(255, 255, 255, .82);
  border-radius: 99px;
  background: var(--mortgage-bar, linear-gradient(to right, #6b4436 0 100%));
  box-shadow: 0 5px 14px rgba(52, 74, 64, .14);
  cursor: help;
}

.mortgage-cost-bar>span {
  position: absolute;
  z-index: 1;
  right: 0;
  bottom: calc(100% + 8px);
  left: 0;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  pointer-events: none;
}

.mortgage-cost-bar small {
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.mortgage-cost-bar strong {
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 760;
  letter-spacing: -.025em;
}

.mortgage-ring-tooltip {
  position: absolute;
  z-index: 4;
  top: -12px;
  left: 50%;
  width: max-content;
  max-width: 230px;
  padding: 7px 9px;
  border-radius: 6px;
  background: #332923;
  box-shadow: 0 7px 18px rgba(43, 32, 27, .22);
  color: #fff;
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 650;
  line-height: 1.25;
  pointer-events: none;
  text-align: center;
  transform: translate(-50%, -100%);
}

.mortgage-ring-tooltip[hidden] {
  display: none;
}

.mortgage-ring-summary {
  display: grid;
  width: 100%;
}

.mortgage-breakdown-card,
.mortgage-summary-card {
  margin-bottom: 14px;
  padding: 16px;
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  background: #fff;
}

.mortgage-breakdown-card .card-heading,
.mortgage-summary-card .card-heading {
  margin-bottom: 13px;
  padding: 0;
}

.mortgage-payment-breakdown {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid var(--line-soft);
  border-radius: 9px;
  background: rgba(255, 255, 255, .72);
}

.mortgage-payment-card .mortgage-payment-breakdown {
  margin-top: 19px;
  border-color: rgba(63, 118, 93, .2);
}

.mortgage-payment-breakdown>div {
  display: grid;
  grid-template-columns: 8px 1fr;
  gap: 2px 8px;
  min-width: 0;
  padding: 12px;
  border-right: 1px solid var(--line-soft);
}

.mortgage-payment-breakdown>div:nth-child(3n) {
  border-right: 0;
}

.mortgage-payment-breakdown i {
  grid-row: 1 / 3;
  align-self: stretch;
  width: 4px;
  border-radius: 99px;
  background: var(--breakdown-color);
}

.mortgage-payment-breakdown span {
  overflow: hidden;
  color: var(--muted);
  font-size: 10px;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mortgage-payment-breakdown strong {
  font-family: var(--font-display);
  font-size: 20px;
  line-height: 1.05;
}

.mortgage-payment-breakdown .mortgage-payoff-inline {
  grid-column: 3;
  border-right: 0;
}

.mortgage-payoff-inline strong {
  color: #2f6f52;
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 800;
}

.mortgage-chart-card {
  margin-bottom: 14px;
}

.mortgage-schedule-card {
  margin-bottom: 14px;
  padding: 16px;
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  background: #fff;
}

.mortgage-schedule-card .card-heading {
  margin-bottom: 13px;
  padding: 0;
}

.mortgage-schedule-scroll {
  max-height: 410px;
  overflow: auto;
  border: 1px solid var(--line-soft);
  border-radius: 9px;
  scrollbar-gutter: stable;
}

.mortgage-schedule-table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}

.mortgage-schedule-table thead {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #f3eee8;
  box-shadow: 0 1px 0 var(--line);
}

.mortgage-schedule-table th,
.mortgage-schedule-table td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--line-soft);
  text-align: right;
  white-space: nowrap;
}

.mortgage-schedule-table th:first-child,
.mortgage-schedule-table td:first-child {
  text-align: left;
}

.mortgage-schedule-table thead th {
  color: var(--muted);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.mortgage-schedule-table tbody th {
  color: var(--ink);
  font-weight: 750;
}

.mortgage-schedule-table tbody th small {
  color: var(--muted);
  font-size: 9px;
  font-weight: 600;
}

.mortgage-schedule-table tbody tr:nth-child(even) {
  background: #fcfaf7;
}

.mortgage-schedule-table tbody tr:last-child th,
.mortgage-schedule-table tbody tr:last-child td {
  border-bottom: 0;
}

.mortgage-schedule-table .mortgage-extra-cell {
  color: #2f6f52;
  font-weight: 750;
}

.mortgage-schedule-table tbody tr.mortgage-interest-dominant {
  background: rgb(178 58 50 / var(--heat-strong));
}

.mortgage-schedule-table tbody tr.mortgage-interest-dominant td:nth-child(3) {
  color: #953c34;
  font-weight: 800;
}

.mortgage-schedule-table tbody tr.mortgage-principal-dominant {
  background: linear-gradient(90deg, rgb(47 111 82 / var(--heat-strong)), rgb(63 118 93 / var(--heat-soft)));
}

.mortgage-schedule-table tbody tr.mortgage-principal-dominant td:nth-child(2) {
  color: #286849;
  font-weight: 800;
}

.mortgage-chart-key {
  color: #6b4436;
  font-size: 10px;
  font-weight: 750;
}

.mortgage-chart-key span {
  display: flex;
  align-items: center;
  gap: 6px;
}

.mortgage-chart-key i {
  width: 18px;
  height: 3px;
  border-radius: 99px;
  background: #6b4436;
}

.mortgage-balance-chart {
  margin-top: 8px;
}

.mortgage-balance-chart svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}

.mortgage-chart-grid {
  stroke: #ebe5df;
  stroke-width: 1;
}

.mortgage-chart-area {
  fill: rgba(201, 108, 71, .13);
  stroke: none;
}

.mortgage-chart-line {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 3;
}

.mortgage-chart-line-balance {
  stroke: #8b4f39;
}

.mortgage-chart-line-principal {
  stroke: #36765a;
}

.mortgage-chart-line-interest {
  stroke: #276b78;
}

.mortgage-balance-chart .mortgage-chart-point {
  stroke: #fff;
  stroke-width: 2;
  cursor: help;
}

.mortgage-chart-point-balance {
  fill: #8b4f39;
}

.mortgage-chart-point-principal {
  fill: #36765a;
}

.mortgage-chart-point-interest {
  fill: #276b78;
}

.mortgage-chart-toggles {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
  max-width: 62%;
}

.mortgage-chart-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 29px;
  padding: 5px 9px;
  border: 1px solid color-mix(in srgb, currentColor 34%, white);
  border-radius: 999px;
  background: color-mix(in srgb, currentColor 8%, white);
  font-size: 10px;
  font-weight: 800;
  white-space: nowrap;
}

.mortgage-chart-toggle i {
  width: 17px;
  height: 3px;
  border-radius: 99px;
  background: currentColor;
}

.mortgage-toggle-balance {
  color: #8b4f39;
}

.mortgage-toggle-principal {
  color: #36765a;
}

.mortgage-toggle-interest {
  color: #276b78;
}

.mortgage-chart-toggle[aria-pressed="false"] {
  opacity: .42;
  background: #fff;
}

.mortgage-chart-toggle[aria-pressed="false"] i {
  background: transparent;
  box-shadow: inset 0 0 0 1px currentColor;
}

.mortgage-chart-tick {
  stroke: #cfc5bc;
  stroke-width: 1;
}

.mortgage-chart-label,
.mortgage-chart-axis-title {
  fill: #716961;
  stroke: none;
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 560;
}

.mortgage-chart-axis-title {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.mortgage-summary-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid var(--line-soft);
  border-radius: 9px;
  background: #fbfaf8;
}

.mortgage-summary-grid>div {
  min-width: 0;
  padding: 16px 17px;
  border-right: 1px solid var(--line-soft);
}

.mortgage-summary-grid>div:nth-child(-n+4) {
  grid-column: span 3;
  border-bottom: 1px solid var(--line-soft);
}

.mortgage-summary-grid>div:nth-child(4),
.mortgage-summary-grid>div:nth-child(8) {
  border-right: 0;
}

.mortgage-summary-grid>div:last-child {
  grid-column: span 3;
  border-right: 0;
}

.mortgage-summary-grid>div:nth-child(n+5) {
  grid-column: span 3;
}

.mortgage-summary-grid span,
.mortgage-summary-grid strong {
  display: block;
}

.mortgage-summary-grid .mortgage-savings-value {
  color: #39745b;
}

.mortgage-summary-grid .mortgage-interest-value {
  color: var(--interest-color, #a6534b);
}

.mortgage-summary-grid span {
  color: #756e67;
  font-size: 9px;
  font-weight: 750;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.mortgage-summary-grid strong {
  margin-top: 7px;
  font-family: var(--font-body);
  font-size: clamp(16px, 1.3vw, 19px);
  font-weight: 720;
  letter-spacing: -.025em;
  line-height: 1.15;
}

.mortgage-disclaimer {
  padding-top: 4px;
}

.mortgage-home-grid {
  display: grid;
  gap: 10px;
  padding-top: 18px;
}

.mortgage-home-card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(105px, 1fr) repeat(5, minmax(76px, .72fr)) 24px;
  align-items: center;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--line-soft);
  border-radius: 9px;
  background: #fff;
  cursor: pointer;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.mortgage-home-card:hover {
  border-color: rgba(107, 68, 54, .28);
  box-shadow: 0 7px 20px rgba(57, 39, 31, .08);
  transform: translateY(-1px);
}

.mortgage-home-card:focus-visible {
  box-shadow: 0 0 0 4px var(--focus), 0 7px 20px rgba(57, 39, 31, .08);
}

.mortgage-home-card span,
.mortgage-home-card strong {
  display: block;
}

.mortgage-home-card span {
  color: var(--muted);
  font-size: 10px;
  text-transform: uppercase;
}

.mortgage-home-card strong {
  margin-top: 3px;
  font-size: 12px;
}

.mortgage-home-card .mortgage-home-interest {
  color: var(--interest-color, #a6534b);
}

.delete-mortgage-home {
  border: 0;
  background: transparent;
  color: var(--red);
  font-size: 17px;
}

@media (max-width: 1100px) {
  .mortgage-input-panel .mortgage-costs-section {
    min-height: 0;
    grid-column: 1 / 3;
  }
}

@media (max-width: 760px) {
  .mortgage-payment-card {
    padding: 18px;
  }

  .mortgage-payment-overview {
    grid-template-columns: minmax(0, 1fr) 220px;
  }

  .mortgage-chart-toggles {
    justify-content: flex-start;
    width: 100%;
    max-width: none;
  }

  .mortgage-payment-breakdown {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mortgage-summary-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .mortgage-summary-grid>div:nth-child(n) {
    border-right: 1px solid var(--line-soft);
    border-bottom: 1px solid var(--line-soft);
  }

  .mortgage-summary-grid>div:nth-child(-n+4) {
    grid-column: span 3;
  }

  .mortgage-summary-grid>div:nth-child(n+5) {
    grid-column: span 3;
  }

  .mortgage-payment-breakdown>div:nth-child(3n) {
    border-right: 1px solid var(--line-soft);
  }

  .mortgage-payment-breakdown>div:nth-child(2n) {
    border-right: 0;
  }

  .mortgage-summary-grid>div:nth-child(2),
  .mortgage-summary-grid>div:nth-child(4),
  .mortgage-summary-grid>div:nth-child(6),
  .mortgage-summary-grid>div:nth-child(8) {
    border-right: 0;
  }

  .mortgage-summary-grid>div:nth-child(n+7) {
    border-bottom: 0;
  }

  .mortgage-summary-grid>div:last-child {
    grid-column: span 3;
    border-right: 0;
    border-bottom: 0;
  }

  .mortgage-payment-breakdown .mortgage-payoff-inline {
    grid-column: auto;
  }

  .mortgage-home-card {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .delete-mortgage-home {
    position: absolute;
    top: 9px;
    right: 9px;
    justify-self: end;
  }
}

@media (max-width: 520px) {
  .mortgage-payment-overview {
    grid-template-columns: 1fr;
  }

  .mortgage-payment-breakdown,
  .mortgage-summary-grid {
    grid-template-columns: 1fr;
  }

  .mortgage-payment-breakdown>div,
  .mortgage-summary-grid>div {
    grid-column: auto;
    border-right: 0;
    border-bottom: 1px solid var(--line-soft);
  }

  .mortgage-payment-breakdown>div:last-child,
  .mortgage-summary-grid>div:last-child {
    grid-column: auto;
    border-bottom: 0;
  }

  .mortgage-extra-row {
    grid-template-columns: 1fr 28px;
  }

  .mortgage-extra-row label {
    grid-column: 1;
  }

  .remove-mortgage-extra {
    grid-row: 1 / 3;
    grid-column: 2;
    align-self: center;
  }
}

/* Government Dashboard */
.government-dashboard {
  --gov-ink: #2d2621;
  --gov-muted: #766e66;
  --gov-green: #59684f;
  --gov-blue: #405f71;
  --gov-rust: #a85e43;
  min-width: 0;
  min-height: calc(100vh - 78px);
  padding: clamp(14px, 2.2vw, 30px);
  overflow-x: hidden;
  overflow-y: auto;
  background: #f4f0e9;
  color: var(--gov-ink);
}

.gov-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  max-width: 1440px;
  margin: 0 auto 12px;
  min-height: 62px;
  padding: 10px 14px 10px 18px;
  border-radius: 12px;
  background: #3f5048;
  box-shadow: 0 18px 45px rgba(44, 46, 39, .17);
  color: #fffaf3;
}

.gov-report-status>span,
.gov-ledger-hero article>span,
.gov-card header span,
.gov-view-heading>div>span,
.gov-program-card>span,
.gov-defense-total>span,
.gov-security-assistance>span {
  display: block;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .105em;
  text-transform: uppercase;
}

.gov-hero h2 {
  max-width: 850px;
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(24px, 2.2vw, 30px);
  font-variation-settings: "wght" 610;
  letter-spacing: -.025em;
  line-height: 1.05;
}

.gov-hero-copy p {
  max-width: 820px;
  margin: 3px 0 0;
  color: #d7ddd7;
  font-size: 11px;
  line-height: 1.35;
}

@media (min-width: 1101px) {
  .gov-hero-copy p {
    font-size: 12.5px;
    white-space: nowrap;
  }
}

.gov-report-status {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  column-gap: 12px;
  padding: 7px 9px;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 9px;
  background: rgba(255, 255, 255, .08);
}

.gov-report-status>span { color: #c8d1c8; font-size: 10px; white-space: nowrap; }
.gov-report-status strong { margin: 5px 0 2px; font-size: 14px; white-space: nowrap; }
.gov-report-status small { color: #d7ddd7; font-size: 10px; line-height: 1.4; }

.gov-report-status button {
  grid-column: 2;
  grid-row: 1 / 4;
  align-self: center;
  justify-self: start;
  margin-top: 0;
  padding: 7px 10px;
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 8px;
  background: transparent;
  color: #fff;
  font-size: 11px;
}

.gov-report-status button:hover:not(:disabled) { background: rgba(255, 255, 255, .12); }
.gov-report-status button:disabled { opacity: .55; }
.government-dashboard[data-data-status="reference"] .gov-report-status { border-color: rgba(231, 189, 124, .65); }

@media (min-width: 1101px) {
  .gov-report-status {
    column-gap: 8px;
    row-gap: 4px;
    padding: 9px 10px;
  }

  .gov-report-status>span {
    grid-column: 1 / -1;
    grid-row: 1;
    font-size: 9px;
    white-space: nowrap;
  }

  .gov-report-status small { display: none; }
  .gov-report-status strong {
    grid-column: 1;
    grid-row: 2;
    margin: 0;
    font-size: 12px;
    white-space: nowrap;
  }

  .gov-report-status button {
    grid-column: 2;
    grid-row: 2;
    padding: 5px 7px;
    font-size: 9px;
    white-space: nowrap;
  }
}

.gov-loading,
.gov-error {
  max-width: 1440px;
  margin: 24px auto;
  padding: 70px 24px;
  border: 1px solid #d9d0c5;
  border-radius: 14px;
  background: #fffdf9;
  text-align: center;
}

.gov-loading span {
  display: inline-block;
  width: 28px;
  height: 28px;
  border: 3px solid #d5cec4;
  border-top-color: var(--gov-green);
  border-radius: 50%;
  animation: gov-spin .8s linear infinite;
}

.gov-loading p,
.gov-error p { margin: 12px 0 0; color: var(--gov-muted); }
.gov-error strong { font-family: var(--font-display); font-size: 25px; }
.gov-error button { margin-top: 18px; padding: 10px 16px; border: 0; border-radius: 8px; background: var(--gov-green); color: #fff; }
@keyframes gov-spin { to { transform: rotate(360deg); } }

.gov-content { max-width: 1440px; margin: 0 auto; }

.gov-summary-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.gov-ledger-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  width: 100%;
  gap: clamp(8px, 1vw, 14px);
  padding: 12px clamp(18px, 2vw, 28px);
  border: 1px solid #d8cfc4;
  border-radius: 15px;
  background: #fffdf9;
  box-shadow: 0 12px 32px rgba(67, 54, 45, .08);
}

.gov-ledger-hero article { min-width: 0; }
.gov-ledger-hero article>span { color: var(--gov-muted); font-size: 10px; }
.gov-ledger-hero article>strong { display: block; margin: 2px 0 1px; font-family: var(--font-display); font-size: clamp(27px, 2.8vw, 38px); font-variation-settings: "wght" 630; letter-spacing: -.04em; line-height: 1; white-space: nowrap; }
.gov-ledger-hero article>small { display: block; color: var(--gov-muted); font-size: 9px; line-height: 1.3; }
.gov-ledger-receipts>strong { color: #3f7665; }
.gov-ledger-outlays>strong { color: var(--gov-blue); }
.gov-ledger-deficit>strong { color: #aa4e43; }
.gov-ledger-equation { color: #b7aea4; font-family: var(--font-display); font-size: 22px; }

.gov-debt-summary {
  display: grid;
  grid-template-columns: minmax(165px, .82fr) minmax(0, 1.18fr);
  gap: 22px;
  align-items: center;
  padding: 15px clamp(18px, 2vw, 26px);
  border: 1px solid #355161;
  border-radius: 15px;
  background: linear-gradient(135deg, #3f6072 0%, #385665 100%);
  box-shadow: 0 12px 32px rgba(48, 68, 79, .14);
  color: #fffdf9;
}

.gov-debt-summary-copy { min-width: 0; padding-right: 22px; border-right: 1px solid rgba(255, 255, 255, .18); }
.gov-debt-summary-copy>span,
.gov-debt-composition span { display: block; color: #cbd9df; font-size: 9px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.gov-debt-summary-copy>span { font-size: 10px; }
.gov-debt-summary-copy>strong { display: block; margin: 2px 0 1px; font-family: var(--font-display); font-size: clamp(27px, 2.8vw, 38px); font-variation-settings: "wght" 630; font-variant-numeric: tabular-nums; letter-spacing: -.04em; line-height: 1; white-space: nowrap; }
.gov-debt-summary-copy>small { display: block; color: #d8e2e6; font-size: 9px; line-height: 1.3; }
.gov-debt-summary-detail { display: grid; gap: 8px; min-width: 0; }
.gov-debt-summary-heading { display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.gov-debt-summary-heading>span { color: #e1eaed; font-size: 9px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.gov-debt-summary-heading button { flex: 0 0 auto; padding: 5px 8px; border: 1px solid rgba(255, 255, 255, .28); border-radius: 999px; background: rgba(255, 255, 255, .07); color: #fff; font-size: 8px; font-weight: 800; text-transform: none; }
.gov-debt-summary-heading button:hover { background: rgba(255, 255, 255, .14); }
.gov-debt-summary-heading button span { margin-left: 2px; }
.gov-debt-composition-bar { display: grid; grid-template-columns: var(--gov-debt-public, 80%) var(--gov-debt-intragov, 20%); height: 7px; overflow: hidden; border-radius: 999px; background: rgba(255, 255, 255, .16); }
.gov-debt-composition-bar i:first-child { background: #d9e7ea; }
.gov-debt-composition-bar i:last-child { background: #d6a16f; }
.gov-debt-composition { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.gov-debt-composition>div { position: relative; padding-left: 11px; }
.gov-debt-composition>div::before { position: absolute; top: 3px; left: 0; width: 6px; height: 6px; border-radius: 50%; background: #d9e7ea; content: ""; }
.gov-debt-composition>div:last-child::before { background: #d6a16f; }
.gov-debt-composition strong { display: block; margin-top: 2px; font-size: 13px; font-variant-numeric: tabular-nums; white-space: nowrap; }

.gov-tabs {
  display: flex;
  gap: 7px;
  margin: 12px 0;
  padding: 0;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scrollbar-width: thin;
}

.gov-tabs button {
  flex: 0 0 auto;
  padding: 8px 12px;
  border: 1px solid #d4cabf;
  border-radius: 999px;
  background: #fffdf9;
  color: #625a52;
  font-size: 11px;
  text-transform: none;
}

.gov-tabs button:hover { border-color: #a4988c; }
.gov-tabs button[aria-selected="true"] { border-color: var(--gov-green); background: var(--gov-green); color: #fff; box-shadow: 0 6px 15px rgba(74, 91, 66, .2); }

.gov-panel { min-height: 360px; outline: 0; }
.gov-overview-grid { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(270px, .75fr); gap: 12px; }

.gov-card {
  min-width: 0;
  padding: clamp(16px, 1.8vw, 22px);
  border: 1px solid #ddd5cc;
  border-radius: 13px;
  background: #fffdf9;
  box-shadow: 0 9px 24px rgba(67, 54, 45, .065);
}

.gov-card>header { display: flex; justify-content: space-between; gap: 14px; align-items: flex-start; margin-bottom: 14px; }
.gov-card header span { color: #9b6048; }
.gov-card h3,
.gov-view-heading h3 { margin: 4px 0 0; font-family: var(--font-display); font-variation-settings: "wght" 610; letter-spacing: -.025em; line-height: 1.05; }
.gov-card h3 { font-size: clamp(21px, 2vw, 28px); }
.gov-card header button { border: 0; background: transparent; color: var(--gov-green); font-size: 11px; text-decoration: underline; text-underline-offset: 3px; text-transform: none; }

.gov-chart-key { display: grid; justify-items: end; gap: 7px; }
.gov-chart-key>small { color: var(--gov-muted); font-size: 9px; font-weight: 700; }
.gov-chart-legend { display: flex; gap: 16px; color: #4e4741; font-size: 11px; font-weight: 800; }
.gov-card .gov-chart-legend span { display: flex; align-items: center; gap: 8px; color: #4e4741; letter-spacing: 0; text-transform: none; white-space: nowrap; }
.gov-chart-legend i { position: relative; display: block; flex: 0 0 38px; width: 38px; height: 4px; border-radius: 3px; }
.gov-chart-legend i::after { position: absolute; top: 50%; left: 50%; width: 9px; height: 9px; border: 2px solid #fffdf9; border-radius: 50%; background: inherit; box-shadow: 0 0 0 1px currentColor; content: ""; transform: translate(-50%, -50%); }
.gov-chart-legend .is-receipts { background: #3f7665; }
.gov-chart-legend .is-outlays { background: #b36548; }
.gov-chart-shell { position: relative; min-width: 0; }
.gov-monthly-chart { display: block; width: 100%; height: auto; min-height: 220px; overflow: visible; }
.gov-chart-grid line { stroke: #dcd4cb; stroke-width: 1.25; }
.gov-chart-grid text { fill: #685f58; stroke: none; font-family: "Avenir Next", ui-sans-serif, system-ui, sans-serif; font-size: 11px; font-weight: 400; font-variation-settings: normal; letter-spacing: .01em; }
.gov-chart-line { fill: none; stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; }
.gov-chart-line.is-receipts { stroke: #3f7665; }
.gov-chart-line.is-outlays { stroke: #b36548; }
.gov-chart-dot { stroke: #fffdf9; stroke-width: 2; }
.gov-chart-dot.is-receipts { fill: #3f7665; }
.gov-chart-dot.is-outlays { fill: #b36548; }
.gov-chart-hit { fill: transparent; stroke: none; cursor: pointer; pointer-events: all; }
.gov-chart-point { outline: none; }
.gov-chart-point:focus .gov-chart-dot { stroke: #2d2621; stroke-width: 4; }
.gov-chart-tooltip { position: absolute; z-index: 5; display: grid; min-width: 190px; gap: 5px; padding: 10px 12px; border-radius: 9px; background: #2f3733; box-shadow: 0 8px 20px rgba(31, 31, 27, .25); color: #fffdf9; pointer-events: none; text-align: left; transform: translate(-50%, -100%); }
.gov-chart-tooltip::after { position: absolute; top: 100%; left: 50%; border: 6px solid transparent; border-top-color: #2f3733; content: ""; transform: translateX(-50%); }
.gov-chart-tooltip span { color: #cfd8d2; font-size: 9px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.gov-chart-tooltip strong { font-family: var(--font-display); font-size: 19px; line-height: 1.05; }
.gov-chart-tooltip small { color: #e8c795; font-size: 9px; font-weight: 800; }
.gov-chart-tooltip>div { display: grid; grid-template-columns: 62px auto; gap: 10px; align-items: baseline; }
.gov-chart-tooltip>div strong { font-size: 15px; text-align: right; white-space: nowrap; }
.gov-chart-tooltip small.is-receipts { color: #91c2ad; }
.gov-chart-tooltip small.is-outlays { color: #efae91; }
.gov-chart-tooltip[hidden] { display: none; }
.gov-chart-empty { display: grid; min-height: 220px; place-items: center; color: var(--gov-muted); }

.gov-pace-card { display: flex; flex-direction: column; }
.gov-calendar-gauge { display: grid; grid-template-columns: auto 1fr; gap: 4px 10px; align-items: center; margin: 0 0 12px; }
.gov-calendar-gauge i { grid-row: 1 / 3; width: 52px; height: 52px; border-radius: 50%; background: conic-gradient(var(--gov-green) var(--progress), #e6e0d8 0); box-shadow: inset 0 0 0 10px #fffdf9; }
.gov-calendar-gauge strong { align-self: end; font-size: 18px; }
.gov-calendar-gauge span { align-self: start; color: var(--gov-muted); font-size: 10px; }

.gov-budget-row { display: grid; gap: 7px; padding: 10px 0; border-top: 1px solid #e7e0d8; }
.gov-budget-row>div:first-child { display: flex; justify-content: space-between; gap: 15px; align-items: baseline; }
.gov-budget-row>div:first-child strong { font-size: 12px; }
.gov-budget-row>div:first-child span { color: var(--gov-muted); font-size: 10px; text-align: right; }
.gov-budget-track { position: relative; height: 9px; border-radius: 999px; background: #e8e2db; }
.gov-budget-track i { display: block; height: 100%; border-radius: inherit; background: var(--gov-blue); }
.gov-budget-track b { position: absolute; top: -3px; width: 2px; height: 15px; background: #342d28; transform: translateX(-1px); }
.gov-budget-row p { margin: 0; color: var(--gov-muted); font-size: 9px; line-height: 1.45; }
.gov-budget-row p strong { color: var(--gov-ink); }

.gov-spending-glance { grid-column: 1 / 2; }
.gov-tax-card { grid-column: 2 / 3; grid-row: 2 / 3; }
.gov-segmented-bar { display: flex; width: 100%; height: 24px; overflow: hidden; border: 2px solid #fff; border-radius: 999px; box-shadow: 0 0 0 1px #d7cec4; }
.gov-segmented-bar i { display: block; height: 100%; min-width: 1px; }
.gov-segment-key { display: flex; flex-wrap: wrap; gap: 7px 14px; margin-top: 12px; color: var(--gov-muted); font-size: 9px; }
.gov-segment-key span { display: flex; gap: 5px; align-items: center; }
.gov-segment-key i { width: 8px; height: 8px; border-radius: 2px; }
.gov-glance-ranks { display: grid; gap: 0; margin-top: 12px; }
.gov-glance-ranks>div { display: grid; grid-template-columns: minmax(0, 1fr) auto 52px; gap: 10px; padding: 7px 0; border-top: 1px solid #ece5de; font-size: 10px; }
.gov-glance-ranks span { min-width: 0; }
.gov-glance-ranks small { color: var(--gov-muted); text-align: right; }

.gov-tax-card>p { margin: -6px 0 18px; color: var(--gov-muted); font-size: 11px; line-height: 1.55; }
.gov-tax-card>label { display: flex; justify-content: space-between; gap: 12px; align-items: center; font-size: 11px; font-weight: 800; }
.gov-tax-card>label>span { display: flex; align-items: center; width: 125px; padding-left: 10px; border: 1px solid #d6ccc2; border-radius: 8px; background: #fff; color: var(--gov-muted); }
.gov-tax-card input { min-width: 0; width: 100%; padding: 9px 8px 9px 3px; border: 0; background: transparent; font-weight: 800; }
.gov-tax-card>small { display: block; margin-top: 6px; color: var(--gov-muted); font-size: 9px; }
.gov-tax-allocation { display: grid; gap: 8px; margin-top: 18px; }
.gov-tax-allocation>div { display: flex; justify-content: space-between; gap: 10px; align-items: center; font-size: 10px; }
.gov-tax-allocation span { display: flex; gap: 7px; align-items: center; }
.gov-tax-allocation i { width: 8px; height: 8px; border-radius: 2px; }

.gov-view-heading { display: flex; justify-content: space-between; gap: 24px; align-items: end; margin: 2px 0 13px; padding: 0 4px; }
.gov-view-heading>div>span { color: #9b6048; }
.gov-view-heading h3 { font-size: clamp(28px, 3.3vw, 42px); }
.gov-view-heading p { max-width: 760px; margin: 6px 0 0; color: var(--gov-muted); font-size: 11px; line-height: 1.45; }
.gov-view-heading>strong { flex: 0 0 auto; color: var(--gov-blue); font-family: var(--font-display); font-size: clamp(20px, 2.5vw, 30px); }
.gov-full-card { margin-bottom: 12px; }

.gov-bar-list { display: grid; gap: 13px; margin-top: 18px; }
.gov-bar-row { display: grid; gap: 7px; }
.gov-bar-row-copy,
.gov-bar-row-meta { display: flex; justify-content: space-between; gap: 14px; }
.gov-bar-row-copy { align-items: baseline; }
.gov-bar-row-copy strong { font-size: 12px; }
.gov-bar-row-copy span { font-family: var(--font-display); font-size: 18px; font-weight: 650; }
.gov-bar-track { height: 11px; border-radius: 999px; background: #e9e3dc; }
.gov-bar-track i { display: block; height: 100%; border-radius: inherit; }
.gov-bar-row-meta { color: var(--gov-muted); font-size: 9px; }

.gov-program-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.gov-program-card { display: flex; min-height: 215px; flex-direction: column; }
.gov-program-card>span { color: #9b6048; line-height: 1.35; }
.gov-program-card h3 { margin: 8px 0 7px; font-size: 24px; }
.gov-program-card>strong { color: var(--gov-blue); font-family: var(--font-display); font-size: clamp(27px, 3vw, 38px); letter-spacing: -.035em; }
.gov-program-card>small { margin-top: 4px; color: var(--gov-muted); font-size: 9px; line-height: 1.45; }
.gov-program-scale { height: 8px; margin-top: auto; border-radius: 999px; background: #e9e3dc; }
.gov-program-scale i { display: block; height: 100%; border-radius: inherit; background: var(--gov-green); }
.gov-program-card>p { margin: 9px 0 6px; color: var(--gov-muted); font-size: 9px; }
.gov-trend { margin-top: 4px; font-size: 9px; font-weight: 750; }
.gov-trend.is-up { color: #a54c42; }
.gov-trend.is-down { color: #3f7665; }
.gov-trend.is-flat,
.gov-trend.is-muted { color: var(--gov-muted); }

.gov-defense-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: 12px; margin-bottom: 12px; }
.gov-defense-total>strong,
.gov-security-assistance>strong { display: block; margin: 8px 0 6px; font-family: var(--font-display); font-size: clamp(30px, 3.6vw, 46px); letter-spacing: -.04em; }
.gov-defense-total>strong { color: var(--gov-blue); }
.gov-security-assistance>strong { color: #9b6825; }
.gov-defense-total>p,
.gov-security-assistance>p { margin: 0; color: var(--gov-muted); font-size: 11px; line-height: 1.55; }
.gov-defense-total .gov-budget-row { margin-top: 18px; }
.gov-security-assistance { background: #f3eadc; }
.gov-security-assistance a { display: inline-block; margin-top: 20px; color: #6b4436; font-size: 10px; font-weight: 800; }
.gov-method-warning { margin-bottom: 18px; padding: 18px 22px; border-left: 5px solid #9b6825; background: #e9e3d8; }
.gov-method-warning strong { font-size: 12px; }
.gov-method-warning p { margin: 6px 0 0; color: #665e56; font-size: 10px; line-height: 1.55; }

.gov-budget-card { display: grid; gap: 0; }
.gov-budget-key { display: flex; flex-wrap: wrap; gap: 15px; margin-bottom: 8px; color: var(--gov-muted); font-size: 9px; }
.gov-budget-key span { display: flex; gap: 6px; align-items: center; }
.gov-budget-key i { width: 18px; height: 7px; border-radius: 99px; background: var(--gov-blue); }
.gov-budget-key b { width: 2px; height: 13px; background: #342d28; }

.gov-history-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; }
.gov-history-ranges { display: flex; flex: 0 0 auto; gap: 6px; align-self: flex-end; padding: 4px; border: 1px solid #d6ccc1; border-radius: 999px; background: #fffdf9; }
.gov-history-ranges button { padding: 8px 11px; border: 0; border-radius: 999px; background: transparent; color: var(--gov-muted); font-size: 9px; text-transform: none; white-space: nowrap; }
.gov-history-ranges button[aria-pressed="true"] { background: var(--gov-green); color: #fff; }
.gov-history-controls { display: grid; flex: 0 0 auto; gap: 8px; justify-items: end; }
.gov-history-measures { display: flex; gap: 5px; padding: 4px; border: 1px solid #d6ccc1; border-radius: 11px; background: #fffdf9; }
.gov-history-measures button { padding: 8px 10px; border: 0; border-radius: 8px; background: transparent; color: var(--gov-muted); font-size: 9px; text-transform: none; white-space: nowrap; }
.gov-history-measures button[aria-pressed="true"] { background: #405f71; color: #fff; }
.gov-history-summary .gov-card { display: grid; align-content: start; gap: 7px; }
.gov-history-summary span { color: var(--gov-muted); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }
.gov-history-summary strong { color: var(--gov-blue); font-family: var(--font-display); font-size: clamp(25px, 3vw, 38px); letter-spacing: -.035em; line-height: 1; }
.gov-history-summary article:last-child strong { color: #a64f43; }
.gov-history-summary small { color: var(--gov-muted); font-size: 9px; line-height: 1.45; }
.gov-history-chart-card { margin-bottom: 12px; }
.gov-history-chart { min-height: 250px; }
.gov-history-chart .gov-chart-line { stroke-width: 3; }
.gov-chart-line.is-projection { stroke-dasharray: 10 9; opacity: .92; }
.gov-chart-point.is-forecast .gov-chart-dot { fill: #fffdf9; stroke-width: 2.5; }
.gov-chart-legend .is-projection { height: 0; border-top: 4px dashed #786e65; border-radius: 0; background: transparent; }
.gov-chart-legend .is-projection::after { display: none; }
.gov-chart-event line { stroke: #7d7369; stroke-width: 1; stroke-dasharray: 3 4; opacity: .7; }
.gov-chart-era rect { fill: #dbe8df; stroke: none; opacity: .62; }
.gov-chart-projection-boundary line { stroke: #405f71; stroke-width: 1.5; stroke-dasharray: 5 5; }
.gov-history-events { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 2px 0 12px; padding: 10px 12px; border-radius: 9px; background: #f2eee8; color: #675e56; font-size: 9px; line-height: 1.35; }
.gov-history-events span { display: flex; gap: 6px; align-items: center; }
.gov-history-events strong { color: #3d3732; font-weight: 750; }
.gov-history-events i { width: 12px; height: 12px; border-radius: 3px; background: #dbe8df; }
.gov-history-events i.is-crisis,
.gov-history-events i.is-pandemic { width: 2px; border-radius: 0; background: #8c837a; }
.gov-history-events i.is-pandemic { background: #6f625b; }
.gov-history-events i.is-outlook { width: 18px; height: 0; border-top: 2px dashed #405f71; border-radius: 0; background: transparent; }
.gov-composition-legend { display: flex; flex-wrap: wrap; gap: 8px 16px; margin: 4px 0 14px; color: var(--gov-muted); font-size: 9px; }
.gov-composition-legend span { display: flex; gap: 6px; align-items: center; }
.gov-composition-legend i { width: 11px; height: 11px; border-radius: 3px; }
.gov-composition-band { stroke: none; opacity: .88; }
.gov-composition-hit { fill: transparent; stroke: none; cursor: crosshair; outline: none; pointer-events: all; }
.gov-composition-hit:focus { fill: rgba(255,255,255,.18); stroke: #2d2621; stroke-width: 1; }
.gov-chart-tooltip-wide { min-width: 265px; }
.gov-chart-tooltip-wide>div { grid-template-columns: minmax(112px, 1fr) auto; }
.gov-chart-line.is-total-gap { stroke: #a64f43; }
.gov-chart-line.is-primary-gap { stroke: #405f71; stroke-dasharray: 8 7; }
.gov-chart-dot.is-total-gap { fill: #a64f43; }
.gov-chart-legend .is-total-gap { background: #a64f43; }
.gov-chart-legend .is-primary-gap { height: 0; border-top: 4px dashed #405f71; border-radius: 0; background: transparent; }
.gov-chart-legend .is-primary-gap::after { display: none; }
.gov-chart-grid line.is-zero { stroke: #8e8379; stroke-width: 1.5; }
.gov-history-deficits { margin-bottom: 15px; }
.gov-history-deficits>header>small { color: var(--gov-muted); font-size: 9px; }
.gov-deficit-list { display: grid; gap: 10px; }
.gov-deficit-list>div { display: grid; grid-template-columns: 58px minmax(120px, 1fr) 82px; gap: 12px; align-items: center; font-size: 10px; }
.gov-deficit-list>div>span { font-weight: 800; }
.gov-deficit-list>div>i { height: 9px; overflow: hidden; border-radius: 999px; background: #ece5dd; }
.gov-deficit-list>div>i>b { display: block; height: 100%; border-radius: inherit; background: #b36548; }
.gov-deficit-list>div>i>b.is-surplus { background: #3f7665; }
.gov-deficit-list>div>strong { text-align: right; }
.gov-history-table-wrap { margin-bottom: 15px; overflow-x: auto; border: 1px solid #ddd5cc; border-radius: 13px; background: #fffdf9; box-shadow: 0 9px 24px rgba(67, 54, 45, .065); }
.gov-history-table { width: 100%; min-width: 660px; border-collapse: collapse; font-size: 10px; }
.gov-history-table caption { padding: 20px 22px 12px; color: #9b6048; font-size: 10px; font-weight: 850; letter-spacing: .09em; text-align: left; text-transform: uppercase; }
.gov-history-table th,
.gov-history-table td { padding: 11px 22px; border-top: 1px solid #e9e2da; text-align: right; white-space: nowrap; }
.gov-history-table thead th { color: var(--gov-muted); font-size: 9px; text-transform: uppercase; letter-spacing: .06em; }
.gov-history-table thead { position: sticky; z-index: 2; top: 0; background: #fffdf9; box-shadow: 0 1px #e9e2da; }
.gov-history-table th:first-child { text-align: left; }
.gov-history-table tbody tr:last-child { background: #f1ece4; }
.gov-history-table tbody tr.is-projection { background: #f2f5f2; font-style: italic; }
.gov-history-note { margin: 0 4px 18px; color: var(--gov-muted); font-size: 9px; line-height: 1.5; }

.gov-sources {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 28px;
  align-items: end;
  margin-top: 15px;
  padding: 14px 4px 5px;
  border-top: 1px solid #d9d0c7;
  color: var(--gov-muted);
}

.gov-sources strong { color: #4d443d; font-size: 11px; }
.gov-sources p { max-width: 760px; margin: 5px 0 0; font-size: 9px; line-height: 1.55; }
.gov-source-links { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px 14px; }
.gov-source-links a { color: #536852; font-size: 9px; font-weight: 800; }

@media (min-width: 1101px) {
  .government-dashboard { height: 100%; min-height: 0; }
}

@media (max-width: 1180px) {
  .gov-ledger-hero article>strong { font-size: clamp(28px, 3.7vw, 44px); }
  .gov-program-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
  .gov-hero { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
  .gov-report-status { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
  .gov-report-status>span,
  .gov-report-status>small { grid-column: 1; }
  .gov-report-status button { grid-column: 2; grid-row: 1 / 4; margin: 0; }
  .gov-overview-grid { grid-template-columns: 1fr; }
  .gov-spending-glance,
  .gov-tax-card { grid-column: auto; grid-row: auto; }
  .gov-summary-row { grid-template-columns: 1fr; }
  .gov-history-summary { grid-template-columns: 1fr 1fr; }
  .gov-history-summary article:last-child { grid-column: 1 / 3; }
}

@media (max-width: 760px) {
  .government-dashboard { min-height: 0; padding: 14px; }
  .gov-hero { grid-template-columns: 1fr; gap: 8px; padding: 12px 14px; border-radius: 11px; }
  .gov-hero h2 { font-size: 24px; }
  .gov-hero-copy p { font-size: 10px; }
  .gov-ledger-hero { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 10px; }
  .gov-ledger-equation { display: none; }
  .gov-ledger-deficit { grid-column: 1 / 3; padding-top: 12px; border-top: 1px solid #e2dbd3; }
  .gov-ledger-hero article>strong { font-size: clamp(27px, 8vw, 36px); white-space: normal; }
  .gov-tabs { position: sticky; z-index: 30; top: 0; margin: 0 -14px 11px; padding: 7px 14px; background: rgba(244, 240, 233, .96); backdrop-filter: blur(10px); }
  .gov-card { padding: 16px; }
  .gov-card>header,
  .gov-view-heading { align-items: flex-start; flex-direction: column; }
  .gov-history-ranges { align-self: flex-start; }
  .gov-history-controls { width: 100%; justify-items: start; }
  .gov-history-measures { max-width: 100%; overflow-x: auto; }
  .gov-chart-key { width: 100%; justify-items: start; }
  .gov-chart-legend { width: 100%; }
  .gov-chart-shell { min-width: 610px; }
  .gov-monthly-chart { min-width: 0; }
  .gov-chart-card { overflow-x: auto; }
  .gov-chart-card>header { position: sticky; left: 0; }
  .gov-program-grid,
  .gov-defense-grid { grid-template-columns: 1fr; }
  .gov-program-card { min-height: 200px; }
  .gov-view-heading>strong { align-self: flex-start; }
  .gov-sources { grid-template-columns: 1fr; align-items: start; }
  .gov-source-links { justify-content: flex-start; }
}

@media (max-width: 520px) {
  .gov-report-status { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 10px; }
  .gov-report-status button { grid-column: 2; grid-row: 1 / 4; align-self: center; margin: 0; }
  .gov-ledger-hero { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gov-ledger-deficit { grid-column: 1 / 3; }
  .gov-debt-summary { grid-template-columns: 1fr; }
  .gov-debt-summary-copy { padding: 0 0 12px; border-right: 0; border-bottom: 1px solid rgba(255, 255, 255, .18); }
  .gov-tax-card>label { align-items: flex-start; flex-direction: column; }
  .gov-tax-card>label>span { width: 100%; }
  .gov-glance-ranks>div { grid-template-columns: minmax(0, 1fr) auto; }
  .gov-glance-ranks small { display: none; }
  .gov-bar-row-meta { display: grid; gap: 3px; }
  .gov-history-summary { grid-template-columns: 1fr; }
  .gov-history-summary article:last-child { grid-column: auto; }
  .gov-deficit-list>div { grid-template-columns: 50px minmax(80px, 1fr) 70px; gap: 8px; }
}

/* Provider Finder */
.provider-finder {
  min-width: 0;
  min-height: calc(100vh - 78px);
  padding: 0;
  overflow-x: hidden;
  overflow-y: auto;
  background: #f1f4f1;
}

.provider-finder-hero,
.provider-search-form,
.provider-finder-layout,
.provider-disclaimer {
  width: 100%;
  margin-inline: auto;
}

.provider-finder-hero {
  display: flex;
  align-items: baseline;
  margin-bottom: 0;
  padding: 24px 1px 12px 18px;
  background: var(--paper);
}

.provider-result-type,
.provider-detail-header>span,
.provider-location-list article>span,
.provider-coverage-card>span {
  color: #326b58;
  font-size: 11px;
  font-weight: 780;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.provider-finder-hero h2 {
  flex: 0 0 auto;
  margin: 0;
  font-family: var(--font-display);
  font-size: 19px;
  font-weight: 620;
  letter-spacing: -.01em;
  line-height: normal;
}

.provider-search-form {
  display: grid;
  grid-template-columns: minmax(210px, 1.45fr) minmax(180px, 1fr) minmax(150px, .8fr) 82px 110px max-content;
  gap: 10px;
  align-items: end;
  padding: 10px 18px;
  border: 0;
  border-bottom: 1px solid #d6ded9;
  border-radius: 0;
  background: var(--paper);
  box-shadow: none;
}

.provider-search-form label {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.provider-search-form label>span {
  color: #5d6d65;
  font-size: 11px;
  font-weight: 740;
}

.provider-search-form input,
.provider-search-form select {
  min-width: 0;
  max-width: 100%;
  width: 100%;
  min-height: 38px;
  padding: 0 11px;
  border: 1px solid #cdd7d1;
  border-radius: 8px;
  outline: 0;
  background: #fff;
  color: var(--ink);
}

.provider-search-form input:focus,
.provider-search-form select:focus {
  border-color: #326b58;
  box-shadow: 0 0 0 3px rgba(50, 107, 88, .14);
}

.provider-search-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: end;
}

.provider-search-actions button {
  min-height: 38px;
  padding: 0 17px;
  border: 1px solid #326b58;
  border-radius: 8px;
  white-space: nowrap;
}

.provider-search-actions #providerClearButton {
  border-color: #c9d3cd;
  background: #c76666;
  color: #fff;
}

.provider-search-actions #providerClearButton:hover {
  border-color: #326b58;
  background: #f5f8f6;
}

.provider-search-actions #providerSearchButton {
  background: #326b58;
  color: #fff;
}

.provider-search-actions #providerSearchButton:hover:not(:disabled) {
  background: #255343;
}

.provider-search-actions button:disabled {
  cursor: wait;
  opacity: .68;
}

.provider-directory-status {
  min-width: 0;
  margin-left: auto;
  padding: 0;
  color: #617169;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.3;
  text-align: right;
  white-space: nowrap;
}

.provider-finder-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  align-items: start;
}

.provider-results-panel,
.provider-detail {
  border: 1px solid #d6ded9;
  background: var(--paper);
}

.provider-results-panel {
  border-width: 0 0 1px;
  border-radius: 0;
  box-shadow: none;
}

.provider-detail {
  border-radius: 14px;
  box-shadow: 0 12px 30px rgba(42, 67, 56, .07);
}

.provider-results-panel {
  overflow: hidden;
}

.provider-results-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 15px;
  padding: 10px 16px;
  border-bottom: 1px solid #e3e8e5;
}

.provider-results-heading-copy {
  display: flex;
  width: 100%;
  min-width: 0;
  gap: 12px;
  align-items: baseline;
}

.provider-results-heading h3 {
  font-size: 17px;
}

.provider-results-heading span {
  color: var(--muted);
  font-size: 12px;
}

.provider-results-workspace {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  min-width: 0;
}

.provider-results-list-column {
  min-width: 0;
  border-right: 1px solid #dfe6e2;
}

.provider-results {
  display: grid;
  grid-auto-rows: max-content;
  align-content: start;
  container-type: inline-size;
  max-height: min(640px, calc(100vh - 310px));
  overflow-y: auto;
}

.provider-map-panel {
  background: #f7f9f7;
}

.provider-map {
  width: 100%;
  height: min(640px, calc(100vh - 310px));
  min-height: 390px;
  border-bottom: 1px solid #dfe6e2;
  background: #e8eeea;
}

.provider-map-panel>p {
  min-height: 30px;
  margin: 0;
  padding: 7px 15px;
  color: #627168;
  font-size: 10px;
  line-height: 1.45;
}

.provider-map .leaflet-control-attribution {
  color: #6f776f;
  font-size: 8px;
  max-width: calc(100% - 12px);
  white-space: normal;
  text-align: right;
}

.provider-map-popup {
  display: grid;
  gap: 4px;
  min-width: 170px;
  font-family: var(--font-body);
}

.provider-map-popup strong {
  color: var(--ink);
  font-family: var(--font-display);
  font-size: 15px;
}

.provider-map-popup>span {
  color: #326b58;
  font-size: 9px;
  font-weight: 760;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.provider-map-popup p {
  margin: 0;
  color: #625c57;
  font-size: 11px;
  line-height: 1.4;
}

.provider-map-popup-address {
  display: grid;
  gap: 1px;
  overflow-wrap: normal;
  word-break: normal;
}

.provider-map-popup-address span {
  display: block;
}

.provider-map-popup-address .provider-map-popup-locality {
  white-space: nowrap;
}

.provider-map .provider-map-tooltip {
  padding: 9px 11px;
  border: 1px solid #cbd8d1;
  border-radius: 8px;
  background: rgba(255, 255, 255, .97);
  box-shadow: 0 8px 20px rgba(42, 67, 56, .18);
  white-space: normal;
}

.provider-map .provider-map-tooltip::before {
  border-top-color: #cbd8d1;
}

.provider-map-tooltip .provider-map-popup {
  max-width: 240px;
}

.provider-result-card {
  display: grid;
  gap: 5px;
  width: 100%;
  padding: 17px 18px;
  border: 0;
  border-bottom: 1px solid #e7ebe8;
  border-left: 4px solid transparent;
  border-radius: 0;
  background: transparent;
  text-align: left;
  text-transform: none;
}

.provider-result-card:hover,
.provider-result-card.is-active {
  background: #f0f6f3;
}

.provider-result-card.is-active {
  border-left-color: #326b58;
}

.provider-result-card.has-specialty-image {
  grid-template-columns: 64px minmax(0, 1fr);
  grid-template-areas:
    "image type"
    "image name"
    "image specialty"
    "image insurance"
    "address address";
  column-gap: 13px;
}

.provider-result-image {
  grid-area: image;
  align-self: center;
  width: 64px;
  height: 64px;
  border-radius: 8px;
  object-fit: cover;
}

.provider-result-card.has-specialty-image>.provider-result-type { grid-area: type; }
.provider-result-card.has-specialty-image>strong { grid-area: name; }
.provider-result-card.has-specialty-image>.provider-result-specialty { grid-area: specialty; }
.provider-result-card.has-specialty-image>.provider-result-insurances { grid-area: insurance; }
.provider-result-card.has-specialty-image>.provider-result-address { grid-area: address; }

.provider-result-card>strong {
  font-family: var(--font-display);
  font-size: 21px;
  font-weight: 650;
  letter-spacing: -.015em;
}

.provider-result-specialty {
  color: #365c4d;
  font-size: 13px;
  font-weight: 680;
}

.provider-result-medicare {
  display: inline-flex;
  align-items: center;
  justify-self: start;
  gap: 5px;
  padding: 3px 8px;
  border-radius: 999px;
  background: #d9eee4;
  color: #255d49;
  font-size: 11px;
  font-weight: 780;
}

.provider-result-insurances {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.provider-result-address {
  display: grid;
  gap: 1px;
  color: #625c57;
  font-size: 12px;
  line-height: 1.45;
}

.provider-result-address>span {
  display: block;
}

@container (min-width: 520px) {
  .provider-result-card {
    grid-template-columns: minmax(0, 1fr) minmax(190px, auto);
    grid-template-areas:
      "type address"
      "name address"
      "specialty address"
      "insurance address";
    column-gap: 24px;
  }

  .provider-result-card.has-specialty-image {
    grid-template-columns: 64px minmax(0, 1fr) minmax(190px, auto);
    grid-template-areas:
      "image type address"
      "image name address"
      "image specialty address"
      "image insurance address";
    column-gap: 13px;
  }

  .provider-result-card>.provider-result-type { grid-area: type; }
  .provider-result-card>strong { grid-area: name; }
  .provider-result-card>.provider-result-specialty { grid-area: specialty; }
  .provider-result-card>.provider-result-insurances { grid-area: insurance; }

  .provider-result-card>.provider-result-address {
    grid-area: address;
    align-self: center;
    justify-self: end;
    max-width: 280px;
    text-align: right;
  }
}

.provider-empty-state,
.provider-error-state,
.provider-loading,
.provider-detail-placeholder {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  min-height: 260px;
  padding: 32px;
  color: var(--muted);
  text-align: center;
}

.provider-empty-state span,
.provider-error-state span,
.provider-detail-placeholder span {
  color: var(--ink);
  font-family: var(--font-display);
  font-size: 23px;
  font-weight: 630;
}

.provider-empty-state p,
.provider-error-state p,
.provider-detail-placeholder p,
.provider-loading p {
  max-width: 440px;
  font-size: 13px;
  line-height: 1.55;
}

.provider-error-state button {
  margin-top: 5px;
  padding: 8px 13px;
  border: 1px solid #cdd7d1;
  border-radius: 7px;
  background: #fff;
}

.provider-loading span {
  width: 24px;
  height: 24px;
  border: 3px solid #d5e2dc;
  border-top-color: #326b58;
  border-radius: 50%;
  animation: provider-spin .8s linear infinite;
}

@keyframes provider-spin { to { transform: rotate(360deg); } }

.provider-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 16px;
  border-top: 1px solid #e3e8e5;
  background: #e4ded7;
}

.provider-pagination button {
  padding: 7px 10px;
  border: 1px solid #cdd7d1;
  border-radius: 7px;
  background: #fff;
}

.provider-pagination span {
  color: var(--muted);
  font-size: 13px;
}

.provider-detail {
  width: min(980px, calc(100vw - 32px));
  max-width: none;
  max-height: min(900px, calc(100vh - 32px));
  margin: auto;
  padding: 0;
  overflow-x: hidden;
  overflow-y: auto;
  color: var(--ink);
}

.provider-detail::backdrop {
  background: rgba(35, 31, 28, .56);
  backdrop-filter: blur(3px);
}

.provider-detail-close {
  display: block;
  position: absolute;
  z-index: 3;
  top: 12px;
  right: 12px;
  width: 42px;
  height: 42px;
  border: 1px solid #d6ded9;
  border-radius: 50%;
  background: #fff;
  font-size: 25px;
}

.provider-detail-header {
  padding: 24px 38px 17px;
  border-bottom: 1px solid #e3e8e5;
  background: #e9f1ed;
}

.provider-detail-specialty-image {
  display: block;
  width: min(100%, 256px);
  height: auto;
  aspect-ratio: 1;
  margin-top: 22px;
  border-radius: 12px;
  object-fit: cover;
}

.provider-detail-title {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 18px;
  align-items: baseline;
  padding-right: 52px;
}

.provider-detail-header h3 {
  margin: 0;
  padding: 0;
  font-size: clamp(28px, 2.7vw, 32px);
  letter-spacing: -.03em;
  line-height: 1;
}

.provider-detail-header p {
  margin: 0;
  color: #52655c;
  font-size: 17px;
  white-space: nowrap;
}

.provider-detail-header>div:last-child {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  align-items: center;
  margin-top: 11px;
  color: #617169;
  font-size: 14px;
}

.provider-detail-header i {
  font-style: normal;
}

.provider-status-badge {
  padding: 6px 10px;
  border-radius: 999px;
  background: #d4e8dd;
  color: #245440;
  font-weight: 720;
}

.provider-detail-overview {
  display: grid;
  grid-template-columns: minmax(260px, .85fr) minmax(0, 1.45fr);
  border-bottom: 1px solid #e3e8e5;
}

.provider-detail-section {
  padding: 28px 38px;
}

.provider-detail-overview .provider-detail-section:first-child {
  border-right: 1px solid #e3e8e5;
}

.provider-detail-section h4,
.provider-coverage-card h4 {
  margin: 0 0 18px;
  font-family: var(--font-display);
  font-size: 25px;
  font-weight: 640;
}

.provider-detail-section>p {
  color: var(--muted);
  font-size: 15px;
}

.provider-taxonomy-list,
.provider-location-list {
  display: grid;
  gap: 12px;
}

.provider-taxonomy-list>div {
  display: grid;
  gap: 4px;
}

.provider-taxonomy-list strong {
  font-size: 16px;
  line-height: 1.3;
}

.provider-taxonomy-list span {
  color: #547264;
  font-size: 13px;
  font-weight: 720;
}

.provider-detail-section .provider-taxonomy-note {
  margin: 14px 0 0;
  padding-top: 12px;
  border-top: 1px solid #e3e8e5;
  color: #6a746e;
  font-size: 13px;
  line-height: 1.45;
}

.provider-taxonomy-note a {
  color: #28634f;
  font-weight: 720;
  white-space: nowrap;
  text-underline-offset: 2px;
}

.provider-location-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.provider-location-list article {
  display: grid;
  align-content: start;
  min-width: 0;
  border: 1px solid #dce4df;
  border-radius: 10px;
  background: #fbfcfb;
  overflow: hidden;
}

.provider-location-list article:only-child {
  grid-column: 1 / -1;
}

.provider-location-map {
  display: block;
  min-height: 142px;
  padding: 16px;
  color: inherit;
  text-decoration: none;
}

.provider-location-map:hover {
  background: #f0f6f3;
}

.provider-location-map:focus-visible {
  outline: 3px solid rgba(50, 107, 88, .28);
  outline-offset: -3px;
}

.provider-location-map span {
  display: block;
  color: #527064;
  font-size: 12px;
  font-weight: 780;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.provider-location-map strong,
.provider-location-map p {
  display: block;
  margin-top: 7px;
  overflow-wrap: anywhere;
  font-size: 16px;
  line-height: 1.4;
}

.provider-location-map p {
  color: var(--muted);
}

.provider-location-map em {
  display: block;
  margin-top: 12px;
  color: #326b58;
  font-size: 14px;
  font-style: normal;
  font-weight: 740;
}

.provider-location-phone {
  display: block;
  padding: 12px 16px;
  border-top: 1px solid #dce4df;
  color: #245c49;
  font-size: 15px;
  font-weight: 760;
  text-decoration: none;
}

.provider-enrichment-card {
  position: relative;
  margin: 26px 38px;
  padding: 24px;
  border: 1px solid #ccdcd4;
  border-radius: 10px;
  background: #f3f8f5;
}

.provider-enrichment-card>header {
  padding-right: 0;
}

.provider-medicare-indicator {
  position: absolute;
  top: 20px;
  right: 20px;
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 50%;
}

.provider-medicare-indicator svg {
  width: 27px;
  height: 27px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2.5;
}

.provider-medicare-indicator.is-found {
  background: #d9eee4;
  color: #246348;
}

.provider-medicare-indicator.is-not-found {
  background: #f3ded9;
  color: #9a3d32;
}

.provider-enrichment-card>header>span {
  color: #326b58;
  font-size: 12px;
  font-weight: 780;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.provider-enrichment-card h4 {
  margin: 4px 0 16px;
  font-family: var(--font-display);
  font-size: 26px;
  font-weight: 640;
}

.provider-enrichment-body>p,
.provider-enrichment-card>small,
.provider-enrichment-result>p,
.provider-web-insurance p,
.provider-enrichment-error p {
  color: #627168;
  font-size: 11px;
  line-height: 1.55;
}

.provider-enrichment-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 9px;
  align-items: end;
  margin-top: 15px;
}

.provider-enrichment-form label {
  display: grid;
  gap: 5px;
  min-width: 0;
  color: #58685f;
  font-size: 13px;
  font-weight: 740;
}

.provider-enrichment-form input {
  min-width: 0;
  width: 100%;
  min-height: 40px;
  padding: 0 10px;
  border: 1px solid #c6d4cd;
  border-radius: 7px;
  outline: 0;
  background: #fff;
  font-size: 16px;
}

.provider-enrichment-form input:focus {
  border-color: #326b58;
  box-shadow: 0 0 0 3px rgba(50, 107, 88, .13);
}

.provider-enrichment-form button {
  min-height: 40px;
  padding: 0 13px;
  border: 1px solid #326b58;
  border-radius: 7px;
  background: #326b58;
  color: #fff;
  font-size: 15px;
  font-weight: 760;
  white-space: nowrap;
}

.provider-enrichment-form button:disabled {
  cursor: wait;
  opacity: .65;
}

.provider-enrichment-card>small {
  display: block;
  margin-top: 9px;
}

.provider-enrichment-card a {
  color: #28634f;
  text-underline-offset: 2px;
}

.provider-enrichment-loading {
  display: flex;
  gap: 10px;
  align-items: center;
  min-height: 54px;
}

.provider-enrichment-loading span {
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  border: 3px solid #d5e2dc;
  border-top-color: #326b58;
  border-radius: 50%;
  animation: provider-spin .8s linear infinite;
}

.provider-enrichment-loading p {
  color: #5e6f66;
  font-size: 15px;
  line-height: 1.45;
}

.provider-enrichment-result {
  display: block;
}

.provider-enrichment-status {
  display: flex;
  flex-wrap: wrap;
  gap: 7px 10px;
  align-items: center;
}

.provider-enrichment-status>span {
  padding: 4px 7px;
  border-radius: 999px;
  background: #e8e5df;
  color: #665e57;
  font-size: 9px;
  font-weight: 780;
  text-transform: uppercase;
}

.provider-enrichment-status>span.is-verified { background: #d5e9df; color: #245440; }
.provider-enrichment-status>span.is-likely { background: #f2e6c9; color: #7b561e; }
.provider-enrichment-status small { color: #78847d; font-size: 9px; }
.provider-enrichment-result h5 { margin: 0; font-family: var(--font-display); font-size: 20px; }

.provider-verification-list,
.provider-enrichment-result details ul {
  margin: 0;
  padding-left: 17px;
  color: #58685f;
  font-size: 10px;
  line-height: 1.55;
}

.provider-web-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
  border: 1px solid #d6e1db;
  border-radius: 8px;
  background: rgba(255,255,255,.65);
}

.provider-web-facts>div {
  min-width: 0;
  padding: 11px;
  border-right: 1px solid #d6e1db;
  border-bottom: 1px solid #d6e1db;
}

.provider-web-facts>div:nth-child(2n) { border-right: 0; }
.provider-web-facts dt { color: #758179; font-size: 8px; font-weight: 780; letter-spacing: .07em; text-transform: uppercase; }
.provider-web-facts dd { margin: 4px 0 0; overflow-wrap: anywhere; font-size: 11px; line-height: 1.45; }

.provider-appointment-link {
  width: fit-content;
  font-size: 11px;
  font-weight: 760;
}

.provider-web-insurance {
  padding: 12px;
  border-left: 3px solid #b87927;
  border-radius: 6px;
  background: #fbf5e8;
}

.provider-web-insurance>strong { font-size: 11px; }
.provider-web-insurance>div { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0; }
.provider-web-insurance>div a { padding: 4px 7px; border: 1px solid #dccaa8; border-radius: 999px; background: #fffaf0; font-size: 9px; font-weight: 740; text-decoration: none; }
.provider-enrichment-result details { color: #66736c; font-size: 10px; }
.provider-enrichment-result summary { cursor: pointer; font-weight: 720; }
.provider-enrichment-result details ul { margin-top: 7px; }
.provider-enrichment-error { padding: 11px; border-radius: 7px; background: #f8ece8; }
.provider-enrichment-error strong { font-size: 12px; }
.provider-enrichment-error p { margin: 4px 0 7px; }
.provider-enrichment-error a { font-size: 10px; font-weight: 760; }
.provider-unverified-warning { padding: 12px; border-left: 3px solid #9b6c35; border-radius: 6px; background: #f7eee0; }
.provider-unverified-warning strong { font-size: 11px; }
.provider-unverified-warning p { margin: 4px 0 0; color: #6e6254; font-size: 10px; line-height: 1.5; }

.provider-medicare-result {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 8px 16px;
  align-items: start;
  padding: 20px;
  border: 2px solid #bfd9cc;
  border-radius: 12px;
  background: #fff;
}

.provider-medicare-result.is-accepts {
  border-color: #9bcab6;
  background: #f8fcfa;
}

.provider-medicare-result.is-maybe,
.provider-medicare-result.is-unconfirmed {
  border-color: #dcc58e;
  background: #fff3dc;
}

.provider-medicare-result.is-declined {
  border-color: #d99991;
  background: #fce9e6;
}

.provider-medicare-result.is-unknown {
  border-color: #d7d5cf;
  background: #fbfaf8;
}

.provider-medicare-status-icon {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border-radius: 50%;
  background: #d9eee4;
  color: #246348;
  font-size: 25px;
  font-weight: 820;
}

.provider-medicare-result.is-maybe .provider-medicare-status-icon,
.provider-medicare-result.is-unconfirmed .provider-medicare-status-icon {
  background: #f4e6bf;
  color: #76541f;
}

.provider-medicare-result.is-declined .provider-medicare-status-icon {
  background: #f2c7c1;
  color: #8d302b;
}

.provider-medicare-result.is-unknown .provider-medicare-status-icon {
  background: #ece9e3;
  color: #655f58;
}

.provider-medicare-status-copy {
  display: grid;
  gap: 4px;
}

.provider-medicare-status-copy>span {
  color: #245c49;
  font-size: 18px;
  font-weight: 800;
}

.provider-medicare-result.is-maybe .provider-medicare-status-copy>span,
.provider-medicare-result.is-unconfirmed .provider-medicare-status-copy>span { color: #76541f; }
.provider-medicare-result.is-declined .provider-medicare-status-copy>span { color: #8d302b; }
.provider-medicare-result.is-unknown .provider-medicare-status-copy>span { color: #5f5a54; }

.provider-medicare-status-copy>strong {
  font-size: 16px;
  line-height: 1.35;
}

.provider-medicare-status-copy>p,
.provider-medicare-caveat,
.provider-medicare-fact {
  margin: 3px 0 0;
  color: #5f6963;
  font-size: 14px;
  line-height: 1.5;
}

.provider-medicare-source {
  padding: 9px 11px;
  border: 1px solid #bdd1c7;
  border-radius: 8px;
  background: #fff;
  font-size: 13px;
  font-weight: 760;
  white-space: nowrap;
  text-decoration: none;
}

.provider-medicare-fact,
.provider-medicare-practices,
.provider-medicare-caveat {
  grid-column: 2 / -1;
}

.provider-medicare-caveat {
  padding-top: 10px;
  border-top: 1px solid #dce5e0;
}

.provider-medicare-practices {
  margin-top: 5px;
  color: #57645d;
}

.provider-medicare-practices summary {
  cursor: pointer;
  font-size: 14px;
  font-weight: 760;
}

.provider-medicare-practices>div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  margin-top: 10px;
}

.provider-medicare-practices article {
  min-width: 0;
  padding: 12px;
  border: 1px solid #e0e7e3;
  border-radius: 8px;
  background: #f8faf9;
}

.provider-medicare-practices article strong,
.provider-medicare-practices article p {
  display: block;
  overflow-wrap: anywhere;
  font-size: 13px;
  line-height: 1.45;
}

.provider-medicare-practices article p { margin: 5px 0; color: #67736c; }
.provider-medicare-practices article a { font-size: 13px; font-weight: 740; }

.provider-marketplace-card {
  margin: 26px 38px;
  padding: 24px;
  border: 1px solid #ccdcd4;
  border-radius: 10px;
  background: #f3f8f5;
}

.provider-marketplace-card>header>span {
  color: #326b58;
  font-size: 12px;
  font-weight: 780;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.provider-marketplace-card h4 {
  margin: 4px 0 16px;
  font-family: var(--font-display);
  font-size: 26px;
  font-weight: 640;
}

.provider-marketplace-card>p,
.provider-marketplace-card>small,
.provider-marketplace-message p,
.provider-marketplace-summary p {
  color: #627168;
  font-size: 14px;
  line-height: 1.55;
}

.provider-marketplace-card>p { margin: 0; }
.provider-marketplace-card>small { display: block; margin-top: 11px; }
.provider-marketplace-results:not(:empty) { margin-top: 15px; }

.provider-network-result {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 8px 16px;
  align-items: start;
  padding: 20px;
  border: 2px solid #bfd9cc;
  border-radius: 12px;
  background: #fff;
}

.provider-network-result.is-listed { border-color: #9bcab6; background: #f8fcfa; }
.provider-network-result.is-not-listed { border-color: #d99991; background: #fce9e6; }

.provider-network-indicator {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border-radius: 50%;
}
.provider-network-result.is-listed .provider-network-indicator { background: #d9eee4; color: #246348; }
.provider-network-result.is-not-listed .provider-network-indicator { background: #f2c7c1; color: #8d302b; }
.provider-network-indicator svg {
  width: 27px;
  height: 27px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2.5;
}

.provider-network-copy { display: grid; gap: 4px; min-width: 0; }
.provider-network-copy>span { color: #245c49; font-size: 18px; font-weight: 800; }
.provider-network-result.is-not-listed .provider-network-copy>span { color: #8d302b; }
.provider-network-copy>strong { font-size: 16px; line-height: 1.35; }
.provider-network-copy>p { margin: 3px 0 0; color: #5f6963; font-size: 14px; line-height: 1.5; }
.provider-network-copy>small { margin-top: 2px; color: #718078; font-size: 11px; font-weight: 720; }

.provider-network-source {
  padding: 9px 11px;
  border: 1px solid #bdd1c7;
  border-radius: 8px;
  background: #fff;
  color: #28634f;
  font-size: 13px;
  font-weight: 760;
  white-space: nowrap;
  text-decoration: none;
}

.provider-network-description,
.provider-network-caveat { grid-column: 2 / -1; margin: 3px 0 0; color: #5f6963; font-size: 14px; line-height: 1.5; }
.provider-network-caveat { padding-top: 10px; border-top: 1px solid #dce5e0; }

.provider-marketplace-message,
.provider-marketplace-summary {
  padding: 12px;
  border: 1px solid #d4e1db;
  border-radius: 8px;
  background: #f4f8f6;
}

.provider-marketplace-message.is-muted { border-color: #dedfdc; background: #f8f7f4; }
.provider-marketplace-message strong,
.provider-marketplace-summary strong { font-size: 15px; }
.provider-marketplace-message p,
.provider-marketplace-summary p { margin: 4px 0 0; }

.provider-marketplace-plan-groups {
  display: grid;
  grid-column: 2 / -1;
  gap: 8px;
  margin-top: 8px;
}

.provider-marketplace-issuer {
  overflow: hidden;
  border: 1px solid #d3e0da;
  border-radius: 9px;
  background: #fff;
}

.provider-marketplace-issuer>summary {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  padding: 13px 14px;
  cursor: pointer;
  color: #285f4d;
  font-size: 14px;
  font-weight: 780;
  list-style: none;
}

.provider-marketplace-issuer>summary::-webkit-details-marker { display: none; }
.provider-marketplace-issuer>summary::before { content: '▸'; color: #326b58; font-size: 15px; }
.provider-marketplace-issuer[open]>summary::before { transform: rotate(90deg); }
.provider-marketplace-issuer>summary span { flex: 1; }
.provider-marketplace-issuer>summary strong { color: #67756e; font-size: 12px; white-space: nowrap; }
.provider-marketplace-issuer[open]>summary { border-bottom: 1px solid #dce5e0; background: #f2f8f5; }

.provider-marketplace-plans {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 10px;
}

.provider-marketplace-plans article {
  min-width: 0;
  padding: 11px;
  border: 1px solid #dce4e0;
  border-radius: 8px;
  background: #fafcfb;
}

.provider-marketplace-plans article>div {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  align-items: center;
  justify-content: space-between;
}

.provider-marketplace-issuer .provider-marketplace-plans article>div { justify-content: flex-end; }

.provider-marketplace-plans article span,
.provider-marketplace-plans article i {
  color: #6c7972;
  font-size: 8px;
  font-style: normal;
  font-weight: 760;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.provider-marketplace-plans article i { color: #246348; }
.provider-marketplace-plans article>strong { display: block; margin-top: 7px; font-size: 14px; line-height: 1.4; }
.provider-marketplace-plans article>p,
.provider-marketplace-plans article>small { display: block; margin: 4px 0 0; color: #69766f; font-size: 12px; line-height: 1.4; }
.provider-marketplace-plans nav { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 9px; }
.provider-marketplace-plans a { color: #28634f; font-size: 13px; font-weight: 740; }

.provider-coverage-card {
  margin: 23px 30px;
  padding: 18px;
  border-left: 4px solid #b87927;
  border-radius: 8px;
  background: #fbf5e8;
}

.provider-coverage-card>span {
  color: #8a5a1d;
}

.provider-coverage-card h4 {
  margin-top: 4px;
  margin-bottom: 7px;
}

.provider-coverage-card p,
.provider-coverage-card strong {
  display: block;
  font-size: 12px;
  line-height: 1.55;
}

.provider-coverage-card p {
  color: #6c5c49;
}

.provider-coverage-card strong {
  margin-top: 10px;
}

.provider-record-dates {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid #e3e8e5;
}

.provider-record-dates>div {
  display: grid;
  gap: 4px;
  padding: 15px 18px;
  border-right: 1px solid #e3e8e5;
}

.provider-record-dates>div:last-child {
  border-right: 0;
}

.provider-record-dates span {
  color: var(--muted);
  font-size: 9px;
  text-transform: uppercase;
}

.provider-record-dates strong {
  font-size: 11px;
}

.provider-record-details {
  margin: 0 38px 28px;
  padding-top: 4px;
  color: #625f59;
  font-size: 14px;
}

.provider-record-details summary {
  width: fit-content;
  cursor: pointer;
  color: #4f5e56;
  font-weight: 740;
}

.provider-record-details>div {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 24px;
  align-items: center;
  margin-top: 13px;
  padding: 14px 16px;
  border: 1px solid #dce3df;
  border-radius: 9px;
  background: #f8faf9;
}

.provider-record-details a {
  color: #28634f;
  font-weight: 740;
}

.provider-disclaimer {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  gap: 14px;
  margin-top: 0;
  padding: 7px 18px;
  border-top: 1px solid #d6ded9;
  background: #bfb5a9;
  color: #6d776f;
  font-size: 8px;
  line-height: 1.35;
}

.provider-disclaimer a {
  color: #326b58;
}

@media (min-width: 1101px) {
  .provider-finder:not([hidden]) {
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    height: 100%;
    min-height: 0;
    overflow: hidden;
  }

  .provider-finder-layout,
  .provider-results-panel,
  .provider-results-workspace,
  .provider-results-list-column,
  .provider-map-panel {
    min-height: 0;
    height: 100%;
  }

  .provider-finder-layout {
    overflow: hidden;
  }

  .provider-results-list-column,
  .provider-map-panel {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    overflow: hidden;
  }

  .provider-results {
    max-height: none;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
  }

  .provider-map {
    height: 100%;
    min-height: 0;
  }
}

@media (max-width: 1400px) {
  .provider-search-form {
    grid-template-columns: 1.35fr 1fr 1fr 75px 105px;
  }

  .provider-search-actions {
    grid-column: 1 / -1;
    justify-content: flex-end;
  }
}

@media (max-width: 840px) {
  .provider-finder {
    padding: 0 0 24px;
  }

  .provider-finder-hero {
    display: grid;
    gap: 3px;
    padding: 11px 14px;
  }

  .provider-disclaimer {
    grid-template-columns: 1fr;
    padding: 12px 16px;
  }

  .provider-search-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .provider-search-name,
  .provider-search-actions {
    grid-column: 1 / -1;
  }

  .provider-finder-layout,
  .provider-results-workspace {
    grid-template-columns: 1fr;
  }

  .provider-results-list-column {
    border-right: 0;
    border-bottom: 1px solid #dfe6e2;
  }

  .provider-results {
    max-height: none;
  }

  .provider-detail {
    width: calc(100vw - 20px);
    max-height: calc(100vh - 20px);
    min-height: 0;
  }

  .provider-detail-overview {
    grid-template-columns: 1fr;
  }

  .provider-detail-overview .provider-detail-section:first-child {
    border-right: 0;
    border-bottom: 1px solid #e3e8e5;
  }

  .provider-medicare-result {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .provider-medicare-source,
  .provider-medicare-fact,
  .provider-medicare-practices,
  .provider-medicare-caveat {
    grid-column: 2;
  }

  .provider-network-result {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .provider-network-source,
  .provider-network-description,
  .provider-network-caveat {
    grid-column: 2;
  }
}

@media (max-width: 520px) {
  .provider-search-form {
    grid-template-columns: 1fr 1fr;
  }

  .provider-search-form label:not(.provider-state-field):not(.provider-zip-field) {
    grid-column: 1 / -1;
  }

  .provider-results-heading {
    align-items: flex-start;
  }

  .provider-results-heading-copy {
    display: grid;
    gap: 2px;
  }

  .provider-directory-status {
    justify-self: end;
    white-space: normal;
  }

  .provider-map {
    height: 430px;
    min-height: 0;
  }

  .provider-location-list,
  .provider-record-dates {
    grid-template-columns: 1fr;
  }

  .provider-record-dates>div {
    border-right: 0;
    border-bottom: 1px solid #e3e8e5;
  }

  .provider-detail-header,
  .provider-detail-section {
    padding-inline: 20px;
  }

  .provider-coverage-card {
    margin-inline: 20px;
  }

  .provider-enrichment-card {
    margin-inline: 20px;
  }

  .provider-marketplace-card {
    margin-inline: 20px;
  }

  .provider-record-details {
    margin-inline: 20px;
  }

  .provider-medicare-result {
    grid-template-columns: 1fr;
  }

  .provider-medicare-source,
  .provider-medicare-fact,
  .provider-medicare-practices,
  .provider-medicare-caveat {
    grid-column: 1;
  }

  .provider-medicare-status-icon {
    width: 42px;
    height: 42px;
  }

  .provider-network-result { grid-template-columns: 40px minmax(0, 1fr); padding: 12px; }
  .provider-network-indicator { width: 40px; height: 40px; }
  .provider-network-description,
  .provider-network-caveat,
  .provider-marketplace-plan-groups,
  .provider-network-result>a { grid-column: 1 / -1; }

  .provider-enrichment-form,
  .provider-web-facts {
    grid-template-columns: 1fr;
  }

  .provider-medicare-practices {
    grid-template-columns: 1fr;
  }

  .provider-marketplace-plans {
    grid-template-columns: 1fr;
  }

  .provider-web-facts>div {
    border-right: 0;
  }
}

/* Weather workbench */
.weather-workbench {
  --weather-font-ui: "Avenir Next", Inter, ui-sans-serif, system-ui, sans-serif;
  --font-display: var(--weather-font-ui);
  min-width: 0;
  height: calc(100vh - 78px);
  overflow-y: auto;
  padding: 30px clamp(26px, 4vw, 52px) clamp(30px, 4vw, 52px);
  background: #e9eff2;
  font-family: var(--weather-font-ui);
}

.weather-workbench-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: min(1440px, 100%);
  margin: 0 auto 14px;
}

.weather-saved-locations {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  overflow-x: auto;
  padding: 3px 1px;
  scrollbar-width: thin;
}

.weather-action-buttons { display: flex; align-items: center; flex: 0 0 auto; gap: 9px; }
.weather-temperature-unit {
  display: flex;
  overflow: hidden;
  padding: 3px;
  border: 1px solid #d4ccc3;
  border-radius: 9px;
  background: #e9e3dc;
}
.weather-temperature-unit button {
  min-width: 40px;
  min-height: 34px;
  padding: 0 10px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #786d65;
  cursor: pointer;
  font: 760 11px/1 var(--weather-font-ui);
}
.weather-temperature-unit button[aria-pressed="true"] {
  background: #fffdf9;
  color: #285e60;
  box-shadow: 0 2px 7px rgba(58, 48, 42, .1);
}

.weather-location-chip {
  display: flex;
  flex: 0 0 auto;
  overflow: hidden;
  border: 1px solid #d4ccc3;
  border-radius: 9px;
  background: #fffdf9;
}

.weather-location-chip.is-active {
  border-color: #376f70;
  background: #e2efec;
  box-shadow: 0 0 0 2px rgba(55, 111, 112, .1);
}

.weather-location-chip button {
  min-height: 36px;
  padding: 0 12px;
  border: 0;
  background: transparent;
  color: #675d56;
  font-size: 11px;
  font-weight: 720;
  white-space: nowrap;
}

.weather-location-chip.is-active button:first-child { color: #285e60; }

.weather-location-chip .weather-remove-location {
  width: 30px;
  padding: 0;
  border-left: 1px solid rgba(103, 93, 86, .13);
  color: #9b6355;
  font-size: 17px;
  line-height: 1;
}

.weather-location-chip .weather-remove-location:hover { background: rgba(167, 72, 63, .08); color: #943d35; }

.weather-change-location:disabled {
  cursor: default;
  opacity: .68;
}

.weather-location-copy>span,
.weather-card>header span {
  display: block;
  color: #a75f40;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.weather-change-location,
.weather-loading button {
  min-height: 42px;
  flex: 0 0 auto;
  padding: 0 17px;
  border: 1px solid rgba(45, 99, 102, .32);
  border-radius: 9px;
  background: #edf4f2;
  color: #285e60;
  font-size: 12px;
  font-weight: 780;
}

.weather-location-chooser {
  display: grid;
  grid-template-columns: minmax(240px, .85fr) minmax(360px, 1.25fr);
  gap: clamp(28px, 5vw, 70px);
  width: min(1050px, 100%);
  margin: clamp(8px, 3vh, 26px) auto;
  padding: clamp(28px, 4vw, 48px);
  border: 1px solid #cbdad6;
  border-radius: 16px;
  background: #e7efec;
  box-shadow: 0 18px 48px rgba(42, 74, 68, .09);
}

.weather-location-copy h3 {
  margin-top: 0;
  font-family: var(--weather-font-ui);
  font-size: clamp(30px, 4vw, 43px);
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: 1;
}

.weather-location-copy p {
  margin-top: 12px;
  color: #5c6b66;
  font-size: 14px;
  line-height: 1.5;
}

.weather-location-form>label {
  display: block;
  margin-bottom: 8px;
  color: #5e6c67;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.weather-location-form>div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
}

.weather-location-form input {
  min-width: 0;
  min-height: 52px;
  padding: 0 15px;
  border: 1px solid #c6d2ce;
  border-right: 0;
  border-radius: 9px 0 0 9px;
  outline: 0;
  background: #fffdf9;
  color: var(--ink);
  font-size: 15px;
  font-weight: 620;
}

.weather-location-form input:focus {
  border-color: #4a7b79;
  box-shadow: 0 0 0 3px rgba(55, 111, 109, .12);
}

.weather-location-form>div button {
  padding: 0 20px;
  border: 1px solid #2f6b6d;
  border-radius: 0 9px 9px 0;
  background: #2f6b6d;
  color: #fff;
  font-size: 12px;
  font-weight: 800;
}

.weather-use-location {
  margin-top: 11px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #386b68;
  font-size: 12px;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.weather-location-results {
  grid-column: 2;
  display: grid;
  gap: 6px;
  margin-top: -38px;
}

.weather-location-results:empty {
  display: none;
}

.weather-location-results button {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  width: 100%;
  padding: 11px 13px;
  border: 1px solid #d2ddd9;
  border-radius: 8px;
  background: rgba(255, 253, 249, .82);
  text-align: left;
}

.weather-location-results button:hover {
  border-color: #71918d;
  background: #fff;
}

.weather-location-results button span,
.weather-location-results p {
  color: var(--muted);
  font-size: 12px;
}

.weather-loading {
  display: grid;
  min-height: 320px;
  place-items: center;
  align-content: center;
  gap: 15px;
  color: var(--muted);
}

.weather-loading>span {
  width: 32px;
  height: 32px;
  border: 3px solid #c8d8d4;
  border-top-color: #2f6b6d;
  border-radius: 50%;
  animation: weather-spin .8s linear infinite;
}

@keyframes weather-spin { to { transform: rotate(360deg); } }

.weather-dashboard {
  --weather-accent: #b9dce5;
  display: grid;
  grid-template-columns: minmax(420px, .86fr) minmax(0, 1.5fr);
  grid-template-areas: "current hourly" "daily map" "alert alert" "history history" "videos videos";
  gap: 16px;
  width: min(1440px, 100%);
  margin: 0 auto;
}

.weather-dashboard.has-weather-advisory {
  grid-template-areas: "advisory advisory" "current hourly" "daily map" "alert alert" "history history" "videos videos";
}

.weather-dashboard.is-international {
  grid-template-areas: "current hourly" "daily daily" "history history";
}

.weather-advisory-bar {
  grid-area: advisory;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 13px;
  width: 100%;
  min-height: 46px;
  padding: 10px 14px;
  border: 1px solid #d79b94;
  border-radius: 10px;
  background: #e69f95;
  color: #6f2f2a;
  text-align: left;
  box-shadow: 0 8px 22px rgba(120, 47, 40, .08);
}

.weather-advisory-bar>span {
  padding: 5px 8px;
  border-radius: 5px;
  background: #a7483f;
  color: #fffaf2;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.weather-advisory-copy { display: flex; min-width: 0; align-items: baseline; flex-wrap: wrap; column-gap: 20px; row-gap: 3px; }
.weather-advisory-copy strong { font-size: 18px; line-height: 1.15; }
.weather-advisory-copy small { color: #793e38; font-size: 11px; font-weight: 750; line-height: 1.3; }
.weather-advisory-bar>small { color: #92433b; font-size: 10px; font-weight: 750; white-space: nowrap; }
.weather-advisory-bar:hover { border-color: #bd6d64; background: #e6b1aa; }

.weather-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid #cbd9df;
  border-radius: 16px;
  background: #f9fcfd;
  box-shadow: 0 12px 32px rgba(33, 58, 73, .07);
}

.weather-card>header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  padding: 18px 22px;
  border-bottom: 1px solid rgba(49, 81, 99, .13);
}

.weather-card>header h3 {
  margin-top: 3px;
  font-family: var(--weather-font-ui);
  font-size: 23px;
  font-weight: 700;
  letter-spacing: -.025em;
  line-height: 1.05;
}

.weather-card>header time,
.weather-card>header>small {
  color: #887d75;
  font-size: 10px;
  font-weight: 700;
}

.weather-current-card {
  grid-area: current;
  padding-bottom: 22px;
  background: #314a5e;
  color: #fffdfa;
  border-color: #314a5e;
}

.weather-dashboard[data-weather-mood="sun"] .weather-current-card { --weather-accent: #ffda8e; background: #4d6572; border-color: #4d6572; }
.weather-dashboard[data-weather-mood="cloud"] .weather-current-card { --weather-accent: #c9dbe1; background: #415766; border-color: #415766; }
.weather-dashboard[data-weather-mood="rain"] .weather-current-card { --weather-accent: #a8d5e2; background: #31566d; border-color: #31566d; }
.weather-dashboard[data-weather-mood="storm"] .weather-current-card { --weather-accent: #f1cd8b; background: #35495e; border-color: #35495e; }
.weather-dashboard[data-weather-mood="snow"] .weather-current-card { --weather-accent: #fff; background: #587688; border-color: #587688; }
.weather-dashboard[data-weather-mood="night"] .weather-current-card { --weather-accent: #e9c77d; background: #263f50; border-color: #263f50; }

.weather-current-card>header { border-bottom-color: rgba(255,255,255,.18); }
.weather-current-card>header span { color: var(--weather-accent); }
.weather-current-card>header h3 { margin-top: 7px; font-size: clamp(24px, 2.5vw, 32px); line-height: 1.1; }
.weather-current-card>header time { color: rgba(255,255,255,.65); }

.weather-current-main {
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr);
  align-items: center;
  gap: 18px;
  padding: 30px 24px 0;
}

.weather-current-symbol {
  display: grid;
  width: 68px;
  height: 68px;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--weather-accent) 75%, transparent);
  border-radius: 50%;
  color: var(--weather-accent);
  font-family: var(--font-display);
  font-size: 42px;
}

.weather-temperature-cluster {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr) auto;
  align-items: center;
  column-gap: 12px;
  row-gap: 10px;
  min-width: 0;
}

.weather-current-temperature {
  grid-column: 1;
  grid-row: 1;
  font-family: var(--weather-font-ui);
  font-size: clamp(62px, 7vw, 88px);
  font-weight: 700;
  letter-spacing: -.055em;
  line-height: .8;
}

.weather-current-temperature sup { margin-left: 2px; font-size: .26em; letter-spacing: 0; vertical-align: top; }
.weather-temperature-details { display: contents; }
.weather-feels-like { display: grid; grid-column: 2; grid-row: 1; justify-self: start; gap: 3px; text-align: left; }
.weather-feels-like small { color: var(--weather-accent); font-size: 8px; font-weight: 800; letter-spacing: .06em; line-height: 1; text-transform: uppercase; }
.weather-feels-like b { font-size: 24px; line-height: 1; }
.weather-condition-name { padding: 25px 24px 0; font-size: 19px; font-weight: 750; line-height: 1.25; }
.weather-current-range { display: grid; grid-column: 3; grid-row: 1; justify-self: end; gap: 10px; text-align: right; }
.weather-current-range span { display: flex; align-items: baseline; justify-content: flex-end; gap: 6px; }
.weather-current-range small { color: var(--weather-accent); font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.weather-current-range b { font-size: 20px; }
.weather-plain-summary { margin: 12px 24px 0; padding-left: 12px; border-left: 2px solid var(--weather-accent); color: rgba(255,255,255,.84); font-size: 13px; line-height: 1.45; }
.weather-current-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 24px 24px 0; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.2); }
.weather-current-facts span { display: grid; justify-items: center; gap: 4px; text-align: center; }
.weather-current-facts small { color: var(--weather-accent); font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.weather-current-facts b { font-size: 13px; }
.weather-precipitation-totals {
  display: grid;
  position: relative;
  box-sizing: border-box;
  width: calc(100% - 44px);
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
  margin: 15px 22px 0;
  padding: 13px 15px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 10px;
  background: rgba(255,255,255,.08);
  color: inherit;
  font: inherit;
}
.weather-precipitation-totals>span { display: grid; min-width: 0; justify-items: center; gap: 4px; text-align: center; }
button.weather-precipitation-totals { cursor: pointer; transition: background-color .16s ease, border-color .16s ease; }
button.weather-precipitation-totals:hover { border-color: rgba(255,255,255,.32); background: rgba(255,255,255,.13); }
button.weather-precipitation-totals:focus-visible { outline: 2px solid var(--weather-accent); outline-offset: 3px; }
.weather-precipitation-totals>i { position: absolute; top: 12px; right: 14px; color: var(--weather-accent); font-size: 9px; font-style: normal; }
.weather-precipitation-totals small { color: var(--weather-accent); font-size: 10px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.weather-precipitation-totals b { font-size: 13px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.weather-precipitation-modal {
  width: min(680px, calc(100vw - 28px));
  max-width: none;
  max-height: calc(100vh - 28px);
  padding: 0;
  border: 1px solid #bdafa2;
  border-radius: 16px;
  background: #fffdf9;
  color: #302925;
  box-shadow: 0 28px 80px rgba(31,25,22,.32);
}
.weather-precipitation-modal::backdrop { background: rgba(31,37,37,.64); backdrop-filter: blur(4px); }
.weather-precipitation-modal>header { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 20px 22px; border-bottom: 1px solid #e2d9d0; }
.weather-precipitation-modal>header span { color: #a95535; font-size: 9px; font-weight: 850; letter-spacing: .11em; text-transform: uppercase; }
.weather-precipitation-modal>header h3 { margin-top: 3px; font-family: var(--weather-font-ui); font-size: 25px; letter-spacing: -.03em; }
.weather-precipitation-modal>header button { display: grid; width: 36px; height: 36px; place-items: center; border: 1px solid #cbd7d4; border-radius: 9px; background: #f4f8f6; color: #315f62; cursor: pointer; font: 700 22px/1 var(--weather-font-ui); }
.weather-precipitation-modal>header button:focus-visible { outline: 2px solid #315f62; outline-offset: 2px; }
.weather-precipitation-year-tabs { display: flex; gap: 7px; overflow-x: auto; padding: 15px 22px 0; }
.weather-precipitation-year-tabs button { flex: 0 0 auto; padding: 8px 13px; border: 1px solid #ccd8d5; border-radius: 99px; background: #f5f8f7; color: #52615d; cursor: pointer; font: 800 11px/1 var(--weather-font-ui); }
.weather-precipitation-year-tabs button[aria-pressed="true"] { border-color: #315f62; background: #315f62; color: #fff; }
.weather-precipitation-year-tabs button:focus-visible { outline: 2px solid #315f62; outline-offset: 2px; }
.weather-precipitation-history-content { padding: 18px 22px 22px; }
.weather-precipitation-history-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.weather-precipitation-history-stats span { display: grid; gap: 5px; padding: 14px 16px; border: 1px solid #d8cec4; border-radius: 11px; background: #f5eee7; }
.weather-precipitation-history-stats small { color: #766961; font-size: 9px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.weather-precipitation-history-stats b { color: #4f342d; font-size: 24px; font-variant-numeric: tabular-nums; }
.weather-precipitation-history-stats .weather-precipitation-annual { transition: background-color .18s ease, border-color .18s ease; }
.weather-precipitation-annual em { color: #6f625a; font-size: 9px; font-style: normal; font-weight: 760; line-height: 1.25; }
.weather-precipitation-annual.is-major-deficit { border-color: #c66c5b; background: #f0c5bb; }
.weather-precipitation-annual.is-deficit { border-color: #d28b68; background: #f3d6c3; }
.weather-precipitation-annual.is-below-average { border-color: #d0aa69; background: #f2e3c6; }
.weather-precipitation-annual.is-near-average { border-color: #c9b9aa; background: #f5eee7; }
.weather-precipitation-annual.is-surplus { border-color: #89b59f; background: #dcebe1; }
.weather-precipitation-annual.is-major-surplus { border-color: #5d9d98; background: #c9e4df; }
.weather-precipitation-calendar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }
.weather-precipitation-calendar span { display: grid; min-height: 70px; align-content: center; gap: 6px; padding: 10px 12px; border: 1px solid #d8e1de; border-radius: 10px; background: #f4f8f6; }
.weather-precipitation-calendar small { color: #5e736d; font-size: 9px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.weather-precipitation-calendar b { color: #254f51; font-size: 16px; font-variant-numeric: tabular-nums; }
.weather-precipitation-calendar .is-unavailable { opacity: .46; }
.weather-precipitation-modal>footer { padding: 13px 22px 15px; border-top: 1px solid #e2d9d0; color: #7f756e; font-size: 9px; }

.weather-hourly-card {
  display: flex;
  grid-area: hourly;
  flex-direction: column;
  background: #f7fbfc;
}
.weather-hourly-legend { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px; }
.weather-hourly-legend small { display: inline-flex; align-items: center; gap: 5px; color: #667d8c; font-size: 10px; font-weight: 750; }
.weather-hourly-legend small::before { width: 15px; border-top: 3px solid #2f6b6d; content: ''; }
.weather-hourly-legend .weather-hourly-legend-rain::before { border-top-color: #247eb4; border-top-style: dashed; }
.weather-hourly-controls { display: flex; gap: 6px; }
.weather-hourly-controls button {
  display: grid;
  width: 30px;
  height: 30px;
  border: 1px solid #c9d5d2;
  border-radius: 7px;
  background: #f7faf9;
  color: #2f6b6d;
  cursor: pointer;
  font: 800 15px/1 var(--weather-font-ui);
  place-items: center;
}
.weather-hourly-controls button:hover:not(:disabled) { border-color: #71918d; background: #fff; }
.weather-hourly-controls button:focus-visible { outline: 2px solid #2f6b6d; outline-offset: 2px; }
.weather-hourly-controls button:disabled { cursor: default; opacity: .35; }
.weather-hourly-scroll {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scrollbar-color: #b7c8c5 transparent;
  scrollbar-gutter: stable;
  -webkit-overflow-scrolling: touch;
}
.weather-hourly-scroll::-webkit-scrollbar { height: 10px; }
.weather-hourly-scroll::-webkit-scrollbar-track { background: #edf1ef; }
.weather-hourly-scroll::-webkit-scrollbar-thumb { border: 2px solid #edf1ef; border-radius: 99px; background: #8fa9a5; }
.weather-hourly-scroll:focus-visible { outline: 2px solid #2f6b6d; outline-offset: -2px; }
.weather-hourly-chart {
  display: grid;
  flex: 1 1 174px;
  min-height: 174px;
  padding-top: 14px;
}
.weather-hourly-chart>* { grid-area: 1 / 1; }
.weather-hourly-chart svg { display: block; width: 100%; height: 100%; overflow: visible; }
.weather-hourly-y-axis {
  position: sticky;
  left: 0;
  z-index: 2;
  width: 38px;
  height: 100%;
  background: linear-gradient(90deg, #fffdf9 72%, rgba(255,253,249,0));
  pointer-events: none;
}
.weather-hourly-y-axis span {
  position: absolute;
  left: 5px;
  color: #667d8c;
  font-size: 9px;
  font-variant-numeric: tabular-nums;
  font-weight: 750;
  line-height: 1;
  transform: translateY(-50%);
}
.weather-hourly-rain-axis {
  position: sticky;
  right: 0;
  z-index: 2;
  width: 54px;
  height: 100%;
  justify-self: end;
  background: linear-gradient(270deg, #f7fbfc 70%, rgba(247,251,252,0));
  pointer-events: none;
}
.weather-hourly-rain-axis span {
  position: absolute;
  right: 2px;
  color: #247eb4;
  font-size: 9px;
  font-variant-numeric: tabular-nums;
  font-weight: 750;
  line-height: 1;
  transform: translateY(-50%);
}
.weather-hourly-grid line { stroke: #dcdedb; stroke-dasharray: 3 5; stroke-width: 1; vector-effect: non-scaling-stroke; }
.weather-hourly-temperature-area { fill: rgba(47, 107, 109, .09); stroke: none; }
.weather-hourly-temperature-line { fill: none; stroke: #2f6b6d; stroke-width: 3; vector-effect: non-scaling-stroke; }
.weather-hourly-precipitation-line { fill: none; stroke: #247eb4; stroke-width: 2.5; stroke-dasharray: 6 4; vector-effect: non-scaling-stroke; }
.weather-hourly-points { position: relative; z-index: 1; pointer-events: none; }
.weather-hourly-points span { position: absolute; box-sizing: border-box; width: 8px; height: 8px; border: 1.5px solid; border-radius: 50%; transform: translate(-50%, -50%); }
.weather-hourly-points .weather-hourly-temperature-point { border-color: #2f6b6d; background: #fffdf9; }
.weather-hourly-points .weather-hourly-precipitation-point { border-color: #247eb4; background: #f7fbfc; }
.weather-hourly-list { display: grid; }
.weather-hourly-list>div { display: grid; justify-items: center; gap: 6px; padding: 3px 5px 17px; }
.weather-hourly-list time { color: #607786; font-size: 11px; font-weight: 700; }
.weather-condition-icon {
  display: grid;
  width: 32px;
  height: 32px;
  border: 1px solid #dce7e4;
  border-radius: 50%;
  background: #f0f5f3;
  color: #587c79;
  place-items: center;
}
.weather-condition-icon svg { width: 27px; height: 27px; overflow: visible; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2.2; }
.weather-condition-icon-sun { border-color: #f2ddaa; background: #fff6d9; color: #c78422; }
.weather-condition-icon-night,
.weather-condition-icon-night-cloud { border-color: #cdd9e3; background: #e8eff5; color: #49677c; }
.weather-condition-icon-rain { border-color: #c9e0e5; background: #e9f4f6; color: #37788a; }
.weather-condition-icon-storm { border-color: #d9d1e4; background: #f0edf5; color: #685a7f; }
.weather-condition-icon-snow { border-color: #cfe2e5; background: #f3fafb; color: #4f8793; }
.weather-condition-icon-fog { border-color: #d9dfdd; background: #f2f4f3; color: #6d7b78; }
.weather-condition-icon-wind { border-color: #cfe0da; background: #edf6f2; color: #42766c; }
.weather-condition-icon .weather-icon-sun,
.weather-condition-icon .weather-icon-moon,
.weather-condition-icon .weather-icon-star { stroke: none; }
.weather-condition-icon .weather-icon-sun { fill: #e7a83b; }
.weather-condition-icon .weather-icon-moon { fill: #63809a; }
.weather-condition-icon .weather-icon-star { fill: #d6a94b; }
.weather-condition-icon .weather-icon-cloud { fill: #fff; stroke: currentColor; }
.weather-condition-icon .weather-icon-rain,
.weather-condition-icon .weather-icon-snow,
.weather-condition-icon .weather-icon-fog,
.weather-condition-icon .weather-icon-wind { fill: none; }
.weather-condition-icon .weather-icon-lightning { fill: #e2aa37; stroke: #9a7123; stroke-width: 1.4; }
.weather-hourly-list strong { font-family: var(--weather-font-ui); font-size: 21px; font-weight: 700; }
.weather-hourly-list small { min-height: 14px; color: #317c91; font-size: 12px; font-weight: 800; }
.weather-hourly-list .weather-rain-chance,
.weather-daily-row>.weather-rain-chance {
  position: relative;
  display: inline-block;
  min-width: 44px;
  padding-bottom: 6px;
  color: var(--weather-rain-color, #225f73);
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}
.weather-hourly-list .weather-rain-chance::before,
.weather-hourly-list .weather-rain-chance::after,
.weather-daily-row>.weather-rain-chance::before,
.weather-daily-row>.weather-rain-chance::after {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 2px;
  border-radius: 99px;
  content: '';
}
.weather-hourly-list .weather-rain-chance::before,
.weather-daily-row>.weather-rain-chance::before {
  width: 100%;
  background: #e2dfda;
}
.weather-hourly-list .weather-rain-chance::after,
.weather-daily-row>.weather-rain-chance::after {
  width: var(--weather-rain-level, 0%);
  background: currentColor;
}

.weather-daily-card { grid-area: daily; }
.weather-daily-card .weather-freezing-key { display: inline-flex; align-items: center; gap: 7px; color: #58778a; font-size: 11px; font-weight: 750; white-space: nowrap; }
.weather-freezing-key i { width: 2px; height: 14px; background: #58778a; }
.weather-daily-list { padding: 8px 20px 14px; }
.weather-daily-row { display: grid; grid-template-columns: 92px 32px 44px minmax(80px, 1fr) 44px 100px; align-content: center; align-items: center; column-gap: 8px; min-height: 58px; padding-block: 8px; border-bottom: 1px solid #dfe8eb; }
.weather-daily-row:last-child { border-bottom: 0; }
.weather-day-label { min-width: 0; }
.weather-day-label strong { font-size: 13px; }
.weather-daily-row .weather-condition-icon { width: 30px; height: 30px; }
.weather-daily-row .weather-condition-icon svg { width: 25px; height: 25px; }
.weather-low, .weather-high { color: #81766f; font-family: var(--weather-font-ui); font-size: 17px; font-weight: 700; text-align: center; }
.weather-high { color: var(--ink); }
.weather-range { position: relative; height: 7px; border-radius: 99px; background: #e8e4df; }
.weather-range i { position: absolute; inset: 0 var(--range-end) 0 var(--range-start); min-width: 7px; border-radius: inherit; background: #d18b51; }
.weather-range::after { position: absolute; top: 50%; left: var(--freezing-position); width: 2px; height: 17px; background: #58778a; content: ''; transform: translate(-50%, -50%); }
.weather-range.is-unavailable i { display: none; }
.weather-daily-row>small { color: #317c91; font-size: 13px; font-weight: 680; white-space: nowrap; }

.weather-history-card { grid-area: history; }
.weather-history-card { background: #fbfaf7; }
.weather-history-card>header { align-items: center; flex-wrap: wrap; padding-block: 20px; background: #fffdf9; }
.weather-history-card>header h3 { font-size: 27px; letter-spacing: -.035em; }
.weather-history-card>header>div:first-child>small { display: block; margin-top: 7px; color: #81766f; font-size: 11px; font-weight: 700; }
.weather-history-controls { display: flex; align-items: flex-end; gap: 7px; }
.weather-history-view-toggle { display: flex; align-items: center; padding: 2px; border: 1px solid #c9d5d2; border-radius: 9px; background: #eef3f1; }
.weather-history-controls button,
.weather-history-controls select,
.weather-history-error button {
  min-height: 34px;
  border: 1px solid #c9d5d2;
  border-radius: 8px;
  background: #f7faf9;
  color: #315f62;
  cursor: pointer;
  font: 800 11px/1 var(--weather-font-ui);
}
.weather-history-controls button { width: 34px; padding: 0; font-size: 15px; }
.weather-history-controls select { padding: 0 30px 0 10px; }
.weather-history-view-toggle button { width: auto; min-height: 28px; padding: 0 10px; border: 0; border-radius: 6px; background: transparent; color: #6e7774; font-size: 9px; letter-spacing: .02em; }
.weather-history-view-toggle button[aria-pressed="true"] { background: #315f62; color: #fff; box-shadow: 0 1px 3px rgba(30, 55, 56, .18); }
.weather-history-card:not(.is-month-view) .weather-history-month-control { display: none; }
.weather-history-controls button:hover:not(:disabled),
.weather-history-controls select:hover,
.weather-history-error button:hover { border-color: #71918d; background: #fff; }
.weather-history-controls button:focus-visible,
.weather-history-controls select:focus-visible,
.weather-history-error button:focus-visible { outline: 2px solid #315f62; outline-offset: 2px; }
.weather-history-controls button:disabled { cursor: default; opacity: .38; }
.weather-history-content { min-height: 210px; }
.weather-history-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 0 20px 18px; }
.weather-history-summary article {
  position: relative;
  display: grid;
  min-height: 86px;
  align-content: center;
  padding: 13px 18px 13px 58px;
  border: 1px solid #cbd9d5;
  border-radius: 11px;
  background: #f1f7f5;
}
.weather-history-summary article::before {
  position: absolute;
  left: 18px;
  top: 50%;
  width: 23px;
  height: 30px;
  border-radius: 55% 55% 60% 60%;
  background: #87b8bc;
  clip-path: polygon(50% 0, 93% 56%, 93% 72%, 80% 91%, 50% 100%, 20% 91%, 7% 72%, 7% 56%);
  content: '';
  transform: translateY(-50%);
}
.weather-history-summary article>span { color: #65716e; font-size: 9px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.weather-history-summary article>strong { margin-top: 2px; color: #294f54; font-size: 25px; font-variant-numeric: tabular-nums; letter-spacing: -.025em; }
.weather-history-summary article>small { margin-top: 1px; color: #7c746e; font-size: 9px; font-weight: 700; }
.weather-history-summary>p { grid-column: 1 / -1; margin: 0; color: #81766f; font-size: 9px; line-height: 1.4; text-align: right; }
.weather-history-year-view,
.weather-history-decade-view { padding: 18px 20px 20px; }
.weather-history-year-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }
.weather-history-year-month,
.weather-history-decade-year {
  display: grid;
  min-width: 0;
  border: 1px solid #d7d2cb;
  border-radius: 10px;
  background: #fff;
  color: #352e2a;
  cursor: pointer;
  font: inherit;
  text-align: left;
}
.weather-history-year-month { gap: 13px; padding: 14px; }
.weather-history-year-month:hover:not(:disabled),
.weather-history-decade-year:hover { border-color: #8eaaa5; background: #f6faf8; }
.weather-history-year-month:focus-visible,
.weather-history-decade-year:focus-visible { outline: 2px solid #315f62; outline-offset: 2px; }
.weather-history-year-month:disabled { cursor: default; opacity: .46; }
.weather-history-year-month>span:first-child { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.weather-history-year-month>span:first-child strong { font-size: 13px; }
.weather-history-year-month>span:first-child small { color: #81766f; font-size: 8px; font-weight: 750; white-space: nowrap; }
.weather-history-year-temperatures,
.weather-history-decade-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.weather-history-year-temperatures>span,
.weather-history-decade-stats>span { display: grid; gap: 2px; }
.weather-history-year-month small,
.weather-history-decade-year small { color: #81766f; font-size: 7px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.weather-history-year-month b,
.weather-history-decade-year b { color: #3b3430; font-size: 15px; font-variant-numeric: tabular-nums; }
.weather-history-year-precipitation { display: grid; gap: 7px; }
.weather-history-year-precipitation>span { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.weather-history-year-month i,
.weather-history-decade-year>i { position: relative; display: block; height: 4px; overflow: hidden; border-radius: 99px; background: #e4e8e6; }
.weather-history-year-month i::after,
.weather-history-decade-year>i::after { position: absolute; inset: 0 auto 0 0; width: var(--weather-history-level, 0%); border-radius: inherit; background: #73aeb6; content: ''; }
.weather-history-annual-total { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 3px 18px; margin-top: 12px; padding: 15px 17px; border: 1px solid #cbd9d5; border-radius: 10px; background: #f1f7f5; }
.weather-history-annual-total>span { color: #65716e; font-size: 9px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.weather-history-annual-total>strong { grid-column: 2; grid-row: 1 / span 2; align-self: center; color: #294f54; font-size: 25px; font-variant-numeric: tabular-nums; }
.weather-history-annual-total>small { color: #7c746e; font-size: 9px; font-weight: 700; }
.weather-history-decade-grid {
  display: grid;
  grid-auto-flow: column;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(var(--weather-history-decade-rows, 5), minmax(0, auto));
  gap: 9px;
}
.weather-history-decade-year { grid-template-columns: 62px minmax(0, 1fr); align-items: center; gap: 12px 16px; padding: 15px 16px; }
.weather-history-decade-label { display: grid; gap: 2px; }
.weather-history-decade-label>strong { color: #294f54; font-size: 22px; font-variant-numeric: tabular-nums; }
.weather-history-decade-label>small { color: #a15c3b; }
.weather-history-decade-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.weather-history-decade-year>i { grid-column: 1 / -1; }
.weather-history-projection-note { margin: 12px 2px 0; color: #756c66; font-size: 9px; line-height: 1.45; }
.weather-history-calendar-scroll { overflow-x: auto; padding: 18px 20px 16px; scrollbar-color: #b7c8c5 transparent; }
.weather-history-calendar { min-width: 760px; }
.weather-history-period { margin: 0; padding: 2px 0 14px; color: #352e2a; font-family: var(--weather-font-ui); font-size: 19px; font-weight: 800; letter-spacing: -.02em; text-align: center; }
.weather-history-weekdays,
.weather-history-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.weather-history-weekdays { overflow: hidden; border: 1px solid #d7d2cb; border-bottom: 0; border-radius: 11px 11px 0 0; background: #eee9e2; }
.weather-history-weekdays span { padding: 8px 5px; border-right: 1px solid #d7d2cb; color: #6e655f; font-size: 9px; font-weight: 850; letter-spacing: .08em; text-align: center; text-transform: uppercase; }
.weather-history-weekdays span:last-child { border-right: 0; }
.weather-history-days { overflow: hidden; border-top: 1px solid #d7d2cb; border-left: 1px solid #d7d2cb; border-radius: 0 0 11px 11px; }
.weather-history-days>article,
.weather-history-blank {
  box-sizing: border-box;
  min-height: 118px;
  border: 0;
  border-right: 1px solid #d7d2cb;
  border-bottom: 1px solid #d7d2cb;
  border-radius: 0;
}
.weather-history-days>article { display: grid; align-content: start; gap: 9px; padding: 10px 11px 9px; background: #fff; }
.weather-history-days>article>header { display: flex; min-height: 30px; align-items: start; justify-content: space-between; gap: 6px; }
.weather-history-days>article time { color: #403832; font-size: 14px; font-weight: 850; line-height: 1; }
.weather-history-days>article>header small { color: #a25d42; font-size: 7px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.weather-history-day-status { display: flex; min-width: 0; align-items: center; justify-content: flex-end; gap: 5px; }
.weather-history-day-status .weather-condition-icon { width: 30px; height: 30px; }
.weather-history-day-status .weather-condition-icon svg { width: 24px; height: 24px; }
.weather-history-day-main { min-width: 0; }
.weather-history-temperatures { display: grid; min-width: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.weather-history-temperatures span { display: flex; min-width: 0; flex-direction: column; gap: 2px; }
.weather-history-temperatures small,
.weather-history-days>article>p small { color: #81766f; font-size: 8px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.weather-history-temperatures b { color: #2f2926; font-size: 16px; font-variant-numeric: tabular-nums; line-height: 1; }
.weather-history-temperatures .is-low b { color: #655d58; }
.weather-history-temperatures small { font-size: 7px; letter-spacing: .08em; }
.weather-history-days>article>p { display: flex; min-height: 19px; align-items: end; justify-content: space-between; gap: 7px; margin: 0; padding-top: 7px; border-top: 1px solid #e8e3dc; }
.weather-history-days>article>p b { color: #356b78; font-size: 11px; font-variant-numeric: tabular-nums; line-height: 1; white-space: nowrap; }
.weather-history-days>article.is-today { position: relative; z-index: 1; box-shadow: inset 0 0 0 2px #a85f40; }
.weather-history-days>article.is-forecast { background: #f2f7f5; }
.weather-history-days>article.is-unavailable { background: #f5f2ed; opacity: .55; }
.weather-history-blank { background: #f7f4ef; }
.weather-history-card>footer { padding: 12px 20px 14px; border-top: 1px solid #e2d9d0; color: #81766f; font-size: 9px; line-height: 1.45; }
.weather-history-loading,
.weather-history-error { display: grid; min-height: 210px; place-content: center; justify-items: center; gap: 10px; padding: 20px; color: #81766f; text-align: center; }
.weather-history-loading>span { width: 25px; height: 25px; border: 3px solid #c8d8d4; border-top-color: #2f6b6d; border-radius: 50%; animation: weather-spin .8s linear infinite; }
.weather-history-error button { padding: 0 13px; }

.weather-videos-card { grid-area: videos; border-color: #0d0d0d; background: #263d34; color: #fffdfa; }
.weather-videos-card>header { align-items: center; border-bottom-color: rgba(255,255,255,.15); }
.weather-videos-card>header a {
  color: #a8d5d7;
  font-size: 10px;
  font-weight: 780;
  text-decoration: none;
}
.weather-videos-card>header a:hover { text-decoration: underline; }
.weather-videos-card>header a:focus-visible { outline: 2px solid #a8d5d7; outline-offset: 3px; border-radius: 2px; }
.weather-featured-videos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; padding: 18px 20px; }
.weather-featured-videos article { min-width: 0; }
.weather-featured-video-link { position: relative; display: block; width: 100%; padding: 0; border: 0; border-radius: 10px; color: #fff; overflow: hidden; cursor: pointer; font: inherit; text-align: left; }
.weather-featured-video-link img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; background: #171717; }
.weather-featured-video-link span {
  position: absolute;
  top: 50%;
  left: 50%;
  display: grid;
  width: 58px;
  height: 42px;
  border-radius: 11px;
  background: #e62117;
  opacity: 0;
  place-items: center;
  transform: translate(-50%, -50%) scale(.88);
  transition: opacity .16s ease, transform .16s ease;
}
.weather-featured-video-link span::after { width: 0; height: 0; margin-left: 3px; border-top: 9px solid transparent; border-bottom: 9px solid transparent; border-left: 15px solid #fff; content: ''; }
.weather-featured-video-link:hover span,
.weather-featured-video-link:focus-visible span { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.weather-featured-video-link:focus-visible { outline: 3px solid #a8d5d7; outline-offset: 3px; }
.weather-featured-videos article>div { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 10px; padding-top: 9px; }
.weather-featured-videos strong { overflow: hidden; font-size: 13px; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.weather-featured-videos time,
.weather-video-strip time { color: #beb6af; font-size: 13px; font-weight: 650; white-space: nowrap; }
.weather-video-archive-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 4px 20px 10px; }
.weather-video-archive-heading>strong { font-size: 12px; }
.weather-video-controls { display: flex; gap: 6px; }
.weather-video-controls button {
  display: grid;
  width: 30px;
  height: 30px;
  border: 1px solid #536765;
  border-radius: 7px;
  background: #202625;
  color: #a8d5d7;
  cursor: pointer;
  font: 800 15px/1 var(--weather-font-ui);
  place-items: center;
}
.weather-video-controls button:hover:not(:disabled) { border-color: #a8d5d7; background: #293331; }
.weather-video-controls button:focus-visible { outline: 2px solid #a8d5d7; outline-offset: 2px; }
.weather-video-controls button:disabled { cursor: default; opacity: .35; }
.weather-video-strip {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  padding: 0 20px 14px;
  overscroll-behavior-inline: contain;
  scrollbar-color: #78928e #252525;
  scrollbar-gutter: stable;
  -webkit-overflow-scrolling: touch;
}
.weather-video-strip::-webkit-scrollbar { height: 10px; }
.weather-video-strip::-webkit-scrollbar-track { background: #252525; }
.weather-video-strip::-webkit-scrollbar-thumb { border: 2px solid #252525; border-radius: 99px; background: #78928e; }
.weather-video-strip:focus-visible { outline: 2px solid #a8d5d7; outline-offset: -2px; }
.weather-video-strip>button {
  position: relative;
  display: grid;
  flex: 0 0 210px;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px 8px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #fffdfa;
  cursor: pointer;
  font: inherit;
  text-align: left;
}
.weather-video-strip>button::before {
  position: absolute;
  top: 45px;
  left: 50%;
  width: 42px;
  height: 30px;
  border-radius: 8px;
  background: #e62117;
  content: '';
  opacity: 0;
  transform: translateX(-50%) scale(.88);
  transition: opacity .16s ease, transform .16s ease;
}
.weather-video-strip>button::after {
  position: absolute;
  top: 53px;
  left: calc(50% + 2px);
  width: 0;
  height: 0;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  border-left: 11px solid #fff;
  content: '';
  opacity: 0;
  transform: translateX(-50%) scale(.88);
  transition: opacity .16s ease, transform .16s ease;
}
.weather-video-strip>button:hover::before,
.weather-video-strip>button:hover::after,
.weather-video-strip>button:focus-visible::before,
.weather-video-strip>button:focus-visible::after { opacity: 1; transform: translateX(-50%) scale(1); }
.weather-video-strip img { grid-column: 1 / -1; width: 100%; aspect-ratio: 16 / 9; border-radius: 8px; object-fit: cover; background: #eee8e1; }
.weather-video-strip strong { overflow: hidden; font-size: 11px; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.weather-video-strip>button:hover strong { color: #a8d5d7; text-decoration: underline; }
.weather-video-strip>button:focus-visible { outline: 2px solid #a8d5d7; outline-offset: 3px; border-radius: 8px; }
.weather-video-disclosure { margin: 0 20px; padding: 12px 0 16px; border-top: 1px solid rgba(255,255,255,.15); color: #beb6af; font-size: 9px; line-height: 1.45; }
.weather-video-empty { padding: 20px; color: #d1cac4; font-size: 13px; }
.weather-video-loading { display: flex; align-items: center; gap: 10px; padding: 22px 20px; color: #d1cac4; font-size: 12px; }
.weather-video-loading span { width: 18px; height: 18px; border: 2px solid #c8d8d4; border-top-color: #2f6b6d; border-radius: 50%; animation: weather-spin .8s linear infinite; }
.weather-video-modal {
  width: min(900px, calc(100% - 28px));
  max-width: none;
  padding: 0;
  border: 1px solid #384744;
  border-radius: 14px;
  background: #0d0d0d;
  color: #fffdfa;
  box-shadow: 0 24px 80px rgba(0,0,0,.5);
}
.weather-video-modal::backdrop { background: rgba(16,14,13,.8); backdrop-filter: blur(4px); }
.weather-video-modal>header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 13px 15px; }
.weather-video-modal>header h3 { overflow: hidden; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.weather-video-modal>header button { display: grid; flex: 0 0 auto; width: 34px; height: 34px; border: 1px solid #536765; border-radius: 7px; background: #202625; color: #fffdfa; cursor: pointer; font: 700 22px/1 var(--weather-font-ui); place-items: center; }
.weather-video-modal>header button:hover { border-color: #a8d5d7; background: #293331; }
.weather-video-modal>header button:focus-visible { outline: 2px solid #a8d5d7; outline-offset: 2px; }
.weather-video-modal>iframe { display: block; width: 100%; min-height: 200px; aspect-ratio: 16 / 9; border: 0; background: #171717; }
.weather-video-modal>footer { display: flex; justify-content: flex-end; padding: 12px 15px 14px; }
.weather-video-modal>footer a { color: #a8d5d7; font-size: 11px; font-weight: 780; text-decoration: none; }
.weather-video-modal>footer a:hover { text-decoration: underline; }
.weather-video-modal>footer a:focus-visible { outline: 2px solid #a8d5d7; outline-offset: 3px; }

.weather-alert-card { grid-area: alert; scroll-margin-top: 16px; }
.weather-alert-card:not(.has-alerts) { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.weather-alert-card:not(.has-alerts)>header { flex: 0 1 auto; border: 0; }
.weather-alert-card:not(.has-alerts) .weather-clear-copy { padding: 12px; }
.weather-alert-card:not(.has-alerts) .weather-source { padding: 12px 22px; }
.weather-alert-card.has-alerts { border-color: #dfc596; background: #fbf4e5; }
.weather-alert-list { display: grid; gap: 8px; padding: 14px 20px 4px; }
.weather-alert-list article { padding: 12px 14px; border: 1px solid #e4cda5; border-radius: 8px; background: rgba(255,255,255,.55); }
.weather-alert-list .weather-alert-title { display: flex; align-items: baseline; gap: 9px; margin: 0; }
.weather-alert-title strong { font-size: 13px; font-weight: 760; }
.weather-alert-title span { color: #a36525; font-size: 9px; font-weight: 760; letter-spacing: .07em; text-transform: uppercase; }
.weather-alert-list p { margin-top: 8px; color: #5f554e; font-size: 12px; line-height: 1.45; }
.weather-clear-copy { padding: 17px 20px 6px; color: #71675f; font-size: 13px; }
.weather-source { display: block; padding: 12px 20px 16px; color: #8c8179; font-size: 9px; }
.weather-map-card { grid-area: map; display: flex; flex-direction: column; overflow: visible; container-type: inline-size; }
.weather-map-card>header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 1.35fr);
  align-items: center;
  gap: 12px 20px;
}
.weather-map-card>header>div:first-child { min-width: 0; }
.weather-map-card>header h3 { margin-top: 5px; font-size: 22px; }
.weather-map-card>header span { letter-spacing: .06em; }
.weather-map-card .weather-map { flex: 0 0 400px; height: 400px; min-height: 0; }
.weather-map-toolbar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  min-width: 0;
}
.weather-map-toolbar>span { flex: 0 1 auto; min-width: 0; overflow: hidden; color: #667e8c; font-size: 10px; font-variant-numeric: tabular-nums; font-weight: 760; letter-spacing: .04em; text-overflow: ellipsis; white-space: nowrap; }
.weather-map-toolbar.is-error>span { flex: 1 1 auto; overflow: visible; text-overflow: clip; white-space: normal; }
.weather-map-toolbar.is-error .weather-map-actions { flex: 0 0 auto; }
.weather-map-actions { display: flex; flex: 1 1 auto; min-width: 0; align-items: center; justify-content: flex-end; gap: 9px; }
.weather-map-frame-slider {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
  align-items: center;
}
.weather-map-frame-slider[hidden] { display: none; }
.weather-map-frame-slider input {
  appearance: none;
  width: 100%;
  height: 6px;
  margin: 0;
  border-radius: 999px;
  outline: 0;
  background: #4b8578;
  cursor: pointer;
}
.weather-map-frame-slider input::-webkit-slider-thumb {
  appearance: none;
  width: 17px;
  height: 17px;
  border: 2px solid #fff;
  border-radius: 50%;
  background: #315f5e;
  box-shadow: 0 1px 4px rgba(42, 27, 21, .32);
}
.weather-map-frame-slider input::-moz-range-thumb {
  width: 13px;
  height: 13px;
  border: 2px solid #fff;
  border-radius: 50%;
  background: #315f5e;
  box-shadow: 0 1px 4px rgba(42, 27, 21, .32);
}
.weather-map-frame-slider input:focus-visible { box-shadow: 0 0 0 3px rgba(47, 116, 118, .2); }
.weather-map-frame-slider input:disabled { cursor: default; opacity: .55; }
.weather-map-actions button,
.weather-map-actions a {
  min-height: 34px;
  padding: 8px 12px;
  border: 1px solid #c4d4d0;
  border-radius: 7px;
  background: #edf4f2;
  color: #285e60;
  font: inherit;
  font-size: 10px;
  font-weight: 780;
  line-height: 1;
  text-decoration: none;
}
.weather-map-actions button { flex: 0 0 auto; min-width: 70px; cursor: pointer; }

@container (max-width: 720px) {
  .weather-map-card>header { grid-template-columns: 1fr; }
  .weather-map-toolbar { width: 100%; justify-content: flex-start; }
}

@container (max-width: 420px) {
  .weather-map-toolbar { flex-wrap: wrap; gap: 9px; }
  .weather-map-toolbar>span { flex-basis: 100%; }
  .weather-map-actions { flex-basis: 100%; }
}
.weather-map-actions button[aria-pressed="false"] { border-color: #ddd5cc; background: #f5f1ec; color: #6e625a; }
.weather-map-actions button:disabled { cursor: default; opacity: .7; }
.weather-map-actions a:hover,
.weather-map-actions button:not(:disabled):hover { border-color: #71918d; background: #fff; }
.weather-map-layers {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 12px 20px;
  border-top: 1px solid #dce7eb;
  border-bottom: 1px solid #dce7eb;
  background: #eef5f7;
  scrollbar-width: thin;
}
.weather-map-layers button {
  flex: 0 0 auto;
  min-height: 34px;
  padding: 8px 13px;
  border: 1px solid #d5cec6;
  border-radius: 999px;
  background: #fffdf9;
  color: #6b615a;
  cursor: pointer;
  font: 760 10px/1 var(--weather-font-ui);
  white-space: nowrap;
}
.weather-map-layers button:hover { border-color: #77a09c; color: #245f61; }
.weather-map-layers button.is-active {
  border-color: #2f7476;
  background: #2f7476;
  color: #fff;
  box-shadow: 0 3px 10px rgba(36, 94, 96, .18);
}
.weather-map-guide {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 48px;
  padding: 10px 20px;
  border-bottom: 1px solid #d7dfdc;
  background: #eef5f7;
  color: #615851;
  font-size: 10px;
  line-height: 1.45;
}
.weather-map-guide>strong {
  flex: 0 0 auto;
  color: #285e60;
  font-size: 10px;
  letter-spacing: .025em;
}
.weather-map-guide>span { display: flex; align-items: center; gap: 6px; min-width: 0; }
.weather-map-guide-scale {
  display: grid !important;
  flex: 0 1 340px;
  gap: 3px !important;
  min-width: 250px !important;
}
.weather-map-guide-scale .weather-map-ramp {
  width: 100%;
  height: 10px;
}
.weather-map-guide-ticks {
  display: flex !important;
  justify-content: space-between;
  gap: 8px !important;
  width: 100%;
  color: #6f655e;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.weather-map-guide-ticks b {
  color: inherit;
  font-size: 8px;
  font-weight: 760;
  white-space: nowrap;
}
.weather-map-guide b { color: #453d38; font-weight: 800; }
.weather-map-guide>a {
  flex: 0 0 auto;
  margin-left: auto;
  color: #285e60;
  font-weight: 800;
  text-underline-offset: 3px;
}
.weather-map-guide-arrow { color: #81766e; font-weight: 800; }
.weather-map-ramp {
  display: inline-block;
  flex: 0 0 92px;
  width: 92px;
  height: 9px;
  border: 1px solid rgba(56, 47, 42, .12);
  border-radius: 999px;
}
.weather-map-ramp-radar { background: linear-gradient(90deg, #77c96e, #e7d840, #ed8a3f, #d74242, #a74daa); }
.weather-map-ramp-cloud { background: linear-gradient(90deg, #314b58, #788c94, #d7dcda, #fff); }
.weather-map-ramp-rain { background: linear-gradient(90deg, #e7f2ee, #82c7b4, #348a91, #315a86, #744e96); }
.weather-map-ramp-temperature { background: linear-gradient(90deg, #e06bc3, #7558b2, #3a70c1, #45b9c6, #54b867, #d5d847, #f0b444, #df6546, #8f3c72); }
.weather-map-ramp-wind { background: linear-gradient(90deg, #e2eee9, #84b8ae, #3e817d, #c58b43, #a9473f); }
.weather-map-ramp-smoke { background: linear-gradient(90deg, #f3f0e9, #c5bbaa, #8c7e72, #554a45); }
.weather-map-alert-symbol {
  display: inline-block;
  flex: 0 0 18px;
  width: 18px;
  height: 13px;
  border: 2px solid #73504f;
  background: linear-gradient(135deg, rgba(232, 139, 76, .72) 0 50%, rgba(198, 72, 127, .72) 50%);
}
.weather-map {
  width: 100%;
  height: clamp(460px, 52vw, 680px);
  background: #dfe8e5;
  border-radius: 0 0 13px 13px;
  font-family: var(--weather-font-ui);
}
.weather-map.is-alert-inspect { cursor: crosshair; }
.weather-map.leaflet-fade-anim .leaflet-tile {
  transition: none;
}
.weather-map .leaflet-control-zoom a { color: #244e4f; }
.weather-map .leaflet-control-attribution { color: #6f665f; font-size: 9px; max-width: calc(100% - 12px); white-space: normal; text-align: right; }
.weather-map .leaflet-tooltip { border: 0; border-radius: 6px; background: #2c2724; color: #fff; font-family: var(--weather-font-ui); font-size: 11px; font-weight: 720; box-shadow: 0 7px 18px rgba(33, 27, 24, .2); }
.weather-map .weather-alert-map-popup .leaflet-popup-content-wrapper {
  border: 1px solid #d9cfc5;
  border-radius: 10px;
  background: #fffdf9;
  color: #302925;
  box-shadow: 0 12px 30px rgba(43, 34, 29, .2);
}
.weather-map .weather-alert-map-popup .leaflet-popup-content { margin: 0; font-family: var(--weather-font-ui); }
.weather-map .weather-alert-map-popup .leaflet-popup-tip { background: #fffdf9; }
.weather-alert-map-loading,
.weather-alert-map-empty { display: grid; gap: 4px; padding: 14px 16px; }
.weather-alert-map-empty strong { color: #6b4640; font-size: 12px; }
.weather-alert-map-empty span { color: #776d66; font-size: 10px; }
.weather-alert-map-results>small {
  display: block;
  padding: 10px 14px 8px;
  border-bottom: 1px solid #ebe4dd;
  color: #82645b;
  font-size: 8px;
  font-weight: 820;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.weather-alert-map-results>div { display: grid; gap: 3px; padding: 11px 14px; border-bottom: 1px solid #eee8e1; }
.weather-alert-map-results>div:last-child { border-bottom: 0; }
.weather-alert-map-results strong { color: #492f2b; font-size: 13px; }
.weather-alert-map-results span { color: #776d66; font-size: 10px; }
.weather-alert-map-results a { width: max-content; color: #28696a; font-size: 9px; font-weight: 800; text-underline-offset: 2px; }
.weather-map-value {
  display: grid;
  gap: 5px;
  min-width: 180px;
  padding: 13px 15px 14px;
}
.weather-map-value strong { color: #554b45; font-size: 11px; }
.weather-map-value b {
  color: #246568;
  font-family: var(--weather-font-ui);
  font-size: 24px;
  line-height: 1.05;
}
.weather-map-fallback { display: grid; height: 100%; place-content: center; justify-items: center; gap: 9px; color: var(--muted); }
.weather-map-fallback a { color: #2f6b6d; font-weight: 760; }
.weather-empty-copy { padding: 24px 20px; color: var(--muted); }
.weather-attribution { width: min(1440px, 100%); margin: 18px auto 0; color: #8a8078; font-size: 9px; text-align: center; }
.weather-attribution a { color: inherit; font-weight: 750; }

@media (max-width: 1000px) {
  .weather-dashboard { grid-template-columns: 1fr; grid-template-areas: "current" "hourly" "daily" "map" "alert" "history" "videos"; }
  .weather-dashboard.has-weather-advisory { grid-template-areas: "advisory" "current" "hourly" "daily" "map" "alert" "history" "videos"; }
  .weather-dashboard.is-international { grid-template-areas: "current" "hourly" "daily" "history"; }
  .weather-daily-row { grid-template-columns: 100px 32px 42px minmax(100px, 1fr) 42px 100px; }
  .weather-map-card .weather-map { flex-basis: 460px; height: 460px; }
  .weather-location-chooser { grid-template-columns: 1fr; }
  .weather-location-results { grid-column: 1; margin-top: 0; }
}

@media (max-width: 700px) {
  .weather-workbench { height: auto; min-height: calc(100vh - 78px); padding: 22px 14px; }
  .weather-location-chooser { margin-top: 28px; padding: 22px 16px; }
  .weather-workbench-actions { align-items: stretch; flex-direction: column; }
  .weather-action-buttons { align-self: flex-end; }
  .weather-location-form>div { grid-template-columns: 1fr; gap: 8px; }
  .weather-location-form input { border: 1px solid #c6d2ce; border-radius: 9px; }
  .weather-location-form>div button { min-height: 48px; border-radius: 9px; }
  .weather-daily-list { padding-inline: 13px; }
  .weather-daily-row { grid-template-columns: 70px 28px 34px minmax(36px, 1fr) 34px 72px; gap: 6px; }
  .weather-daily-row>small { font-size: 11px; }
  .weather-alert-card:not(.has-alerts) { align-items: flex-start; flex-direction: column; gap: 0; }
  .weather-alert-card:not(.has-alerts) .weather-clear-copy { padding: 0 22px 6px; }
  .weather-featured-videos { grid-template-columns: 1fr; padding-inline: 13px; }
  .weather-video-strip { padding-inline: 13px; }
  .weather-video-archive-heading { padding-inline: 13px; }
  .weather-video-disclosure { margin-inline: 13px; }
  .weather-map-guide { align-items: flex-start; flex-wrap: wrap; padding-inline: 14px; }
  .weather-map-guide>span { flex: 1 1 calc(100% - 120px); flex-wrap: wrap; }
  .weather-map-guide .weather-map-guide-scale { flex-basis: 100%; min-width: 0 !important; }
  .weather-map-guide>a { width: 100%; margin-left: 0; }
  .weather-map { height: 460px; }
  .weather-advisory-bar { grid-template-columns: auto minmax(0, 1fr); }
  .weather-advisory-bar>small { display: none; }
  .weather-history-year-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .weather-history-decade-grid { grid-auto-flow: row; grid-template-columns: 1fr; grid-template-rows: none; }
}

@media (max-width: 400px) {
  .weather-daily-row { grid-template-columns: 56px 24px 30px minmax(24px, 1fr) 30px 55px; gap: 4px; }
  .weather-day-label strong { font-size: 11px; }
  .weather-daily-row>small { font-size: 9px; }
}

@media (max-width: 420px) {
  .weather-current-main { grid-template-columns: 62px minmax(0, 1fr); gap: 12px; padding-inline: 16px; }
  .weather-current-symbol { width: 62px; height: 62px; font-size: 37px; }
  .weather-temperature-cluster { grid-template-columns: max-content minmax(0, 1fr); gap: 6px; }
  .weather-current-temperature { font-size: 72px; }
  .weather-feels-like b { font-size: 16px; }
  .weather-current-range { grid-column: 1 / -1; grid-row: 2; }
  .weather-current-range small { font-size: 8px; }
  .weather-current-range b { font-size: 15px; }
  .weather-precipitation-totals { width: calc(100% - 32px); grid-template-columns: repeat(2, minmax(0, 1fr)); margin-inline: 16px; }
  .weather-precipitation-modal>header { padding-inline: 16px; }
  .weather-precipitation-year-tabs { padding-inline: 16px; }
  .weather-precipitation-history-content { padding-inline: 16px; }
  .weather-precipitation-calendar { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
  .weather-precipitation-calendar span { min-height: 64px; padding: 8px 9px; }
  .weather-history-controls { display: grid; width: 100%; grid-template-columns: 34px minmax(0, 1fr) 84px 34px; }
  .weather-history-view-toggle { grid-column: 1 / -1; }
  .weather-history-controls label,
  .weather-history-controls select { width: 100%; }
  .weather-history-card:not(.is-month-view) .weather-history-controls { grid-template-columns: 34px minmax(0, 1fr) 34px; }
  .weather-history-card:not(.is-month-view) .weather-history-controls label { grid-column: 2; }
  .weather-history-year-grid { grid-template-columns: 1fr; }
  .weather-history-year-view,
  .weather-history-decade-view { padding-inline: 13px; }
  .weather-history-decade-year { grid-template-columns: 52px minmax(0, 1fr); padding-inline: 13px; }
  .weather-history-decade-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; }
  .weather-history-summary { grid-template-columns: 1fr; padding-inline: 13px; }
  .weather-history-summary>p { text-align: left; }
  .weather-history-calendar-scroll { padding-inline: 13px; }
}

@media (hover: none) {
  .weather-featured-video-link span { opacity: 1; transform: translate(-50%, -50%) scale(1); }
  .weather-video-strip>button::before,
  .weather-video-strip>button::after { opacity: 1; transform: translateX(-50%) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  .weather-loading>span { animation: none; }
  .weather-featured-video-link span,
  .weather-video-strip>button::before,
  .weather-video-strip>button::after { transition: none; }
}

/* News workbench */
.news-workbench {
  min-width: 0;
  height: calc(100vh - 78px);
  padding: clamp(26px, 4vw, 52px);
  overflow-y: auto;
  background: #f5f1eb;
}

.news-controls,
.news-feed-heading,
.news-results,
.news-load-sentinel,
.news-attribution { width: min(1280px, 100%); margin-inline: auto; }

.news-controls { padding: 18px; border: 1px solid var(--line); border-radius: 13px; background: #e7ebed; box-shadow: 0 12px 30px rgba(57,39,31,.07); }
.news-search label { display: block; margin-bottom: 7px; color: #554b45; font-size: 10px; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
.news-search>div { display: grid; grid-template-columns: 20px minmax(0,1fr) auto auto; align-items: center; min-height: 48px; padding-left: 14px; border: 1px solid #cfc7c0; border-radius: 9px; background: #fff; overflow: hidden; }
.news-search svg { width: 19px; height: 19px; fill: none; stroke: #776d66; stroke-linecap: round; stroke-width: 1.8; }
.news-search input { min-width: 0; height: 46px; padding: 0 12px; border: 0; outline: 0; background: transparent; color: var(--ink); font-size: 14px; }
.news-search input::-webkit-search-cancel-button { display: none; -webkit-appearance: none; appearance: none; }
.news-search button { align-self: stretch; border: 0; }
#newsSearchClear { width: 42px; background: transparent; color: var(--muted); font-size: 22px; }
.news-search button[type="submit"] { padding: 0 22px; background: var(--brown); color: #fff; font-size: 11px; font-weight: 850; }
.news-filter-row { display: grid; grid-template-columns: 58px minmax(0,1fr); align-items: center; gap: 10px; margin-top: 13px; }
.news-filter-label { color: #69767d; font-size: 9px; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; }
.news-categories { display: flex; gap: 8px; padding-bottom: 2px; overflow-x: auto; scrollbar-width: thin; }
.news-categories button { flex: 0 0 auto; padding: 8px 12px; border: 1px solid #c7d0d4; border-radius: 99px; background: rgba(255,255,255,.72); color: #48565e; font-size: 10px; font-weight: 780; }
.news-categories button[aria-pressed="true"] { border-color: #405f71; background: #405f71; color: #fff; }
.news-topic-row { padding-top: 12px; border-top: 1px solid rgba(83,105,115,.16); }
.news-topics button[aria-pressed="true"] { border-color: #775041; background: #775041; }
.news-source-row { padding-top: 12px; border-top: 1px solid rgba(83,105,115,.16); }
.news-source-filter { position: relative; justify-self: start; }
.news-sources-button { min-width: 112px; padding: 8px 13px; border: 1px solid #c7d0d4; border-radius: 99px; background: rgba(255,255,255,.78); color: #48565e; font-size: 10px; font-weight: 800; text-align: left; }
.news-sources-button::after { content: "⌄"; margin-left: 8px; color: #738087; }
.news-sources-panel { position: absolute; z-index: 20; top: calc(100% + 8px); left: 0; width: min(520px,calc(100vw - 64px)); padding: 13px; border: 1px solid #bcc8cc; border-radius: 12px; background: #f8faf9; box-shadow: 0 18px 42px rgba(42,52,56,.2); }
.news-sources-panel[hidden] { display: none; }
.news-sources-panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 1px 2px 10px; }
.news-sources-panel-heading strong { color: #48565e; font-size: 11px; }
.news-sources-panel-heading button { border: 0; background: transparent; color: var(--brown); font-size: 10px; font-weight: 800; }
.news-sources-list { display: grid; max-height: 310px; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; overflow-y: auto; }
.news-sources-list button { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 10px; border: 1px solid #d2dade; border-radius: 8px; background: #fff; color: #526067; font-size: 10px; font-weight: 760; text-align: left; }
.news-sources-list button[aria-pressed="true"] { border-color: #75919d; background: #e3ecee; color: #315365; }
.news-sources-list button span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.news-sources-list button small { flex: 0 0 auto; color: #77838a; font-size: 9px; font-weight: 700; }
.news-sources-loading { grid-column: 1/-1; padding: 18px; color: var(--muted); font-size: 11px; text-align: center; }

.news-feed-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; margin-top: 30px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.news-feed-heading h3 { font-family: var(--font-display); font-size: 26px; font-variation-settings: "wght" 620; }
.news-feed-title { display: flex; align-items: center; gap: 14px; }
.news-sort { display: inline-flex; padding: 3px; border: 1px solid var(--line); border-radius: 99px; background: #ebe6df; }
.news-sort button { padding: 6px 10px; border: 0; border-radius: 99px; background: transparent; color: #716861; font-size: 9px; font-weight: 800; }
.news-sort button[aria-pressed="true"] { background: #fff; color: #405f71; box-shadow: 0 1px 3px rgba(57,39,31,.12); }
.news-feed-heading p { color: var(--muted); font-size: 11px; }
.news-feed-statuses { display: flex; align-items: center; justify-content: flex-end; gap: 8px 14px; }
.news-collection-status { display: flex; align-items: center; gap: 6px; }
.news-collection-status::after { content: "·"; margin-left: 8px; color: var(--line); }
.news-collection-status.is-refreshing { color: #2f6858; font-weight: 780; }
.news-collection-status.is-refreshing::before { content: ""; width: 10px; height: 10px; border: 2px solid #bad0c9; border-top-color: #3f806d; border-radius: 50%; animation: news-spin .8s linear infinite; }
.news-collection-status.is-delayed { color: #9b5d35; font-weight: 780; }
.news-results { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; margin-top: 18px; }
.news-article { min-width: 0; border: 1px solid var(--line); border-radius: 12px; background: var(--paper); overflow: hidden; box-shadow: 0 10px 26px rgba(57,39,31,.06); transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.news-article:hover,.news-article:focus-within { border-color: #a9b9be; box-shadow: 0 14px 32px rgba(57,39,31,.11); transform: translateY(-2px); }
.news-article-link { display: grid; height: 190px; grid-template-columns: minmax(145px,38%) minmax(0,1fr); color: inherit; text-decoration: none; }
.news-article-link:focus-visible { outline: 3px solid #7897a4; outline-offset: -3px; }
.news-article-image { position: relative; min-width: 0; height: 100%; background: #dce3e5; overflow: hidden; isolation: isolate; }
.news-article-image>img { position: absolute; z-index: 2; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.news-image-fallback { position: absolute; z-index: 1; inset: 0; display: grid; place-items: stretch; }
.news-image-fallback-logo { display: grid; width: 100%; height: 100%; place-items: center; overflow: hidden; }
.news-image-fallback-logo img { width: 100%; height: 100%; padding: 0; object-fit: cover; }
.news-image-fallback-logo span { font-family: var(--font-display); font-size: 27px; font-weight: 700; }
.news-image-theme-sports { background: #dce8e2; color: #356552; }
.news-image-theme-business { background: #e8e1d6; color: #725438; }
.news-image-theme-technology { background: #dfe4eb; color: #415f79; }
.news-image-theme-health { background: #e7e0e5; color: #74536a; }
.news-image-theme-environment { background: #e1e7d8; color: #587044; }
.news-image-theme-politics { background: #e7ddd8; color: #785245; }
.news-image-theme-culture { background: #ebe1d5; color: #865a3d; }
.news-image-theme-world { background: #dce6e8; color: #3e6870; }
.news-image-theme-top { background: #dce3e5; color: #405f71; }
.news-article-body { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; padding: 17px 18px 16px; overflow: hidden; }
.news-source { display: flex; min-width: 0; align-items: center; gap: 8px; color: var(--muted); font-size: 10px; }
.news-source img,.news-source>span:first-child { display: grid; width: 22px; height: 22px; flex: 0 0 22px; place-items: center; border-radius: 6px; background: #e7ebed; color: #405f71; object-fit: contain; font-weight: 850; }
.news-source>span:nth-child(2) { overflow: hidden; color: #405f71; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.news-source time { white-space: nowrap; }
.news-source time::before { content: "·"; margin-right: 8px; }
.news-article h3 { display: -webkit-box; overflow: hidden; font-family: var(--font-display); font-size: 22px; font-variation-settings: "wght" 610; letter-spacing: -.022em; line-height: 1.08; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.news-article:hover h3,.news-article:focus-within h3 { color: #405f71; }
.news-article .news-source { margin-top: 11px; }
.news-article p { display: -webkit-box; margin-top: auto; overflow: hidden; color: #675e57; font-size: 11px; line-height: 1.45; opacity: 0; transform: translateY(5px); transition: opacity .18s ease, transform .18s ease; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.news-article:hover p,.news-article:focus-within p { opacity: 1; transform: translateY(0); }
.news-loading { display: grid; grid-column: 1/-1; grid-template-columns: repeat(2,1fr); gap: 14px; }
.news-loading span { min-height: 190px; border: 1px solid var(--line); border-radius: 12px; background: linear-gradient(100deg,#e9e4de 20%,#f5f2ee 36%,#e9e4de 52%); background-size: 220% 100%; animation: news-shimmer 1.2s linear infinite; }
@keyframes news-shimmer { to { background-position-x: -220%; } }
.news-empty { grid-column: 1/-1; padding: 68px 24px; border: 1px solid var(--line); border-radius: 12px; background: var(--paper); text-align: center; }
.news-empty strong { font-family: var(--font-display); font-size: 27px; font-variation-settings: "wght" 620; }
.news-empty p { max-width: 440px; margin: 8px auto 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.news-empty.is-setup { border-style: dashed; background: #eef1f1; }
.news-load-sentinel { display: flex; min-height: 2px; align-items: center; justify-content: center; gap: 9px; margin-top: 18px; color: var(--muted); font-size: 11px; opacity: 0; }
.news-load-sentinel[hidden] { display: none; }
.news-load-sentinel.is-loading { min-height: 42px; opacity: 1; }
.news-load-sentinel>span { width: 17px; height: 17px; border: 2px solid #c7d0d4; border-top-color: #405f71; border-radius: 50%; animation: news-spin .8s linear infinite; }
.news-load-sentinel>b { font-weight: 750; }
@keyframes news-spin { to { transform: rotate(360deg); } }
.news-attribution { margin-top: 28px; padding-top: 14px; border-top: 1px solid var(--line); color: var(--muted); font-size: 10px; }
.news-attribution a { color: var(--brown); font-weight: 750; }

@media (max-width: 860px) {
  .news-article-link { height: 180px; grid-template-columns: minmax(125px,35%) minmax(0,1fr); }
  .news-article h3 { font-size: 20px; }
}

@media (max-width: 700px) {
  .news-results,.news-loading { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .news-workbench { height: auto; min-height: calc(100vh - 78px); padding: 24px 14px 38px; }
  .news-controls { padding: 14px; }
  .news-filter-row { grid-template-columns: 1fr; gap: 6px; }
  .news-categories { flex-wrap: wrap; overflow-x: visible; }
  .news-search>div { grid-template-columns: 19px minmax(0,1fr) auto; }
  #newsSearchClear { display: none; }
  .news-search button[type="submit"] { padding-inline: 14px; }
  .news-feed-heading { align-items: flex-start; flex-direction: column; gap: 4px; margin-top: 25px; }
  .news-feed-title { width: 100%; justify-content: space-between; }
  .news-sources-panel { width: calc(100vw - 56px); }
  .news-sources-list { grid-template-columns: 1fr; }
  .news-feed-statuses { align-items: flex-start; flex-direction: column; gap: 3px; }
  .news-collection-status::after { content: none; }
  .news-article-link { height: 168px; grid-template-columns: minmax(105px,34%) minmax(0,1fr); }
  .news-article-body { padding: 13px 14px 12px; }
  .news-article h3 { font-size: 18px; -webkit-line-clamp: 3; }
  .news-article .news-source { gap: 5px; margin-top: 8px; font-size: 9px; }
  .news-source img,.news-source>span:first-child { width: 19px; height: 19px; flex-basis: 19px; }
  .news-source time::before { margin-right: 5px; }
  .news-article p { font-size: 10px; line-height: 1.4; -webkit-line-clamp: 2; }
  .news-loading span:not(:first-child) { display: none; }
}

@media (hover: none) {
  .news-article p { opacity: 1; transform: none; }
  .news-article:hover { transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  .news-article,.news-article p { transition: none; }
  .news-load-sentinel>span { animation: none; }
}

/* National Debt */
.debt-planner {
  min-width: 0;
  background: #f7f4ef;
}

.debt-grid {
  display: grid;
  grid-template-columns: minmax(350px, .76fr) minmax(560px, 1.45fr);
  min-height: 100%;
}

.debt-input-panel,
.debt-results-panel {
  min-width: 0;
}

.debt-input-panel {
  border-right: 1px solid #cfc5bc;
  background: #eae4ddf7;
}

.debt-input-panel>.panel-heading,
.debt-results-panel>.panel-heading {
  min-height: 62px;
}

.debt-input-panel .input-section {
  padding: 25px 24px 29px;
  border-top: 5px solid rgba(107, 68, 54, .12);
}

.debt-input-panel .debt-personal-section {
  background: #eae4ddf7;
}

.debt-input-panel .debt-payoff-section {
  background: #eee9e3f7;
}

.debt-input-panel .debt-projection-section {
  background: #f2eee9f7;
}

.debt-assumption-note {
  margin: 18px 0 0;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.5;
}

.debt-results-panel {
  padding: 0 20px 28px;
  background: #fffdf9;
}

.debt-data-status {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 720;
}

.debt-data-status::before {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #b87927;
  content: "";
}

.debt-data-status.is-live::before {
  background: #3f765d;
  box-shadow: 0 0 0 4px rgba(63, 118, 93, .1);
}

.debt-hero-card {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(190px, .65fr);
  align-items: end;
  gap: 20px;
  margin: 10px 0 13px;
  padding: clamp(22px, 3vw, 32px);
  border: 1px solid #294c59;
  border-radius: 12px;
  background: #345766;
  box-shadow: 0 14px 32px rgba(41, 76, 89, .17);
  color: #fff;
}

.debt-live-copy,
.debt-live-change {
  display: grid;
  min-width: 0;
}

.debt-live-copy>span,
.debt-live-change>span {
  color: #bdd2da;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.debt-live-copy>strong {
  margin: 7px 0 5px;
  font-family: var(--font-body);
  font-size: clamp(27px, 3.35vw, 48px);
  font-weight: 760;
  letter-spacing: -.045em;
  line-height: 1;
  white-space: nowrap;
}

.debt-live-copy>small,
.debt-live-change>small {
  color: #d8e5e9;
  font-size: 9px;
  line-height: 1.4;
}

.debt-live-change {
  padding-left: 20px;
  border-left: 1px solid rgba(255, 255, 255, .2);
}

.debt-live-change>strong {
  margin: 7px 0 5px;
  color: #ffd4c4;
  font-size: clamp(18px, 2vw, 25px);
  font-weight: 760;
  letter-spacing: -.025em;
}

.debt-share-grid,
.debt-momentum-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  overflow: hidden;
  margin-bottom: 13px;
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  background: #fff;
}

.debt-share-grid article,
.debt-momentum-grid article {
  min-width: 0;
  padding: 16px;
  border-right: 1px solid var(--line-soft);
}

.debt-share-grid article:last-child,
.debt-momentum-grid article:last-child {
  border-right: 0;
}

.debt-share-grid span,
.debt-momentum-grid span {
  display: block;
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .045em;
  text-transform: uppercase;
}

.debt-share-grid strong,
.debt-momentum-grid strong {
  display: block;
  margin-top: 6px;
  font-size: clamp(15px, 1.45vw, 20px);
  font-weight: 760;
  letter-spacing: -.025em;
}

.debt-share-grid small,
.debt-momentum-grid small {
  display: block;
  margin-top: 3px;
  color: #837970;
  font-size: 8px;
}

.debt-share-grid .debt-personal-share {
  background: #f8ece9;
}

.debt-share-grid .debt-personal-share strong {
  color: #a7443b;
}

.debt-composition-card {
  margin-bottom: 13px;
  padding: 18px;
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  background: #fbfaf8;
}

.debt-composition-card .card-heading {
  margin-bottom: 14px;
  padding: 0;
}

.debt-composition-bar {
  display: flex;
  height: 15px;
  overflow: hidden;
  border: 2px solid #fff;
  border-radius: 99px;
  background: #e8e1da;
  box-shadow: 0 4px 12px rgba(57, 39, 31, .1);
}

.debt-composition-bar i:first-child {
  background: #416d7d;
}

.debt-composition-bar i:last-child {
  background: #b9783d;
}

.debt-composition-key {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 13px;
}

.debt-composition-key>span {
  display: grid;
  grid-template-columns: 8px 1fr auto;
  align-items: center;
  gap: 7px;
  min-width: 0;
}

.debt-composition-key i {
  width: 5px;
  height: 27px;
  border-radius: 99px;
}

.debt-composition-key i.public {
  background: #416d7d;
}

.debt-composition-key i.intragov {
  background: #b9783d;
}

.debt-composition-key b {
  color: var(--muted);
  font-size: 9px;
  text-transform: uppercase;
}

.debt-composition-key strong {
  font-size: 15px;
}

.debt-momentum-grid strong {
  color: #4d5f66;
}

.debt-chart-card {
  margin-bottom: 13px;
}

.debt-chart-key {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 9px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 750;
}

.debt-chart-key span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.debt-chart-key i {
  width: 18px;
  height: 3px;
  border-radius: 99px;
}

.debt-chart-key i.history {
  background: #c96c47;
}

.debt-chart-key i.baseline {
  background: #7b6660;
}

.debt-chart-key i.scenario {
  background: #34745b;
}

.debt-projection-chart {
  position: relative;
  min-height: 270px;
}

.debt-projection-chart svg {
  display: block;
  width: 100%;
  height: auto;
}

.debt-chart-gridline {
  stroke: #e8e1da;
  stroke-width: 1;
}

.debt-chart-line {
  fill: none;
  stroke-width: 3;
}

.debt-chart-line.history {
  stroke: #c96c47;
}

.debt-chart-line.baseline {
  stroke: #7b6660;
}

.debt-chart-line.scenario {
  stroke: #34745b;
}

.debt-chart-hover-point {
  fill: transparent;
  stroke: transparent;
  pointer-events: all;
  cursor: crosshair;
}

.debt-chart-hover-point.history {
  color: #c96c47;
}

.debt-chart-hover-point.baseline {
  color: #7b6660;
}

.debt-chart-hover-point.scenario {
  color: #34745b;
}

.debt-chart-event-marker {
  fill: #b7791f;
  stroke: #fffdfa;
  stroke-width: 2;
  pointer-events: none;
}

.debt-chart-hover-point:hover {
  fill: currentColor;
  stroke: #fffdfa;
  stroke-width: 2;
}

.debt-chart-hover-point.event:hover {
  fill: transparent;
  stroke: transparent;
}

.debt-chart-tooltip {
  position: absolute;
  z-index: 8;
  display: grid;
  gap: 3px;
  min-width: 184px;
  padding: 10px 12px;
  border-radius: 9px;
  background: #342720;
  color: #fff;
  box-shadow: 0 10px 24px rgba(40, 27, 21, .22);
  pointer-events: none;
  transform: translate(-50%, -100%);
}

.debt-chart-tooltip[hidden] {
  display: none;
}

.debt-chart-tooltip span {
  color: #dfd3ca;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .02em;
}

.debt-chart-tooltip strong {
  font-size: 16px;
  line-height: 1;
}

.debt-chart-tooltip small {
  max-width: 230px;
  color: #f0c98b;
  font-size: 9px;
  font-weight: 650;
  line-height: 1.3;
}

.debt-chart-label,
.debt-chart-today-label {
  fill: #746860;
  stroke: none;
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 600;
}

.debt-chart-today {
  stroke: #aaa098;
  stroke-dasharray: 4 5;
  stroke-width: 1;
}

.debt-chart-today-label {
  font-size: 9px;
  font-weight: 750;
}

.debt-calculator-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 13px;
  margin-bottom: 16px;
}

.debt-result-card {
  display: grid;
  min-height: 185px;
  padding: 20px;
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  background: #f8f5f1;
}

.debt-result-card>span {
  color: var(--clay);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.debt-result-card>strong {
  margin-top: 7px;
  font-family: var(--font-display);
  font-size: clamp(25px, 2.5vw, 35px);
  font-variation-settings: "wght" 620;
  letter-spacing: -.025em;
  line-height: 1;
}

.debt-result-card>p {
  margin: 10px 0 15px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.45;
}

.debt-result-card>div {
  align-self: end;
  padding-top: 12px;
  border-top: 1px solid var(--line-soft);
}

.debt-result-card>div b,
.debt-result-card>div small {
  display: block;
}

.debt-economy-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 12px;
  overflow: hidden;
  border: 1px solid #d5c9bf;
  border-radius: 13px;
  background: #fffdfa;
}

.debt-economy-strip article {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 15px 18px;
}

.debt-economy-strip article+article {
  border-left: 1px solid #dfd6ce;
}

.debt-economy-strip span {
  color: #786e67;
  font-size: 9px;
  font-weight: 820;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.debt-economy-strip strong {
  color: #34251f;
  font-family: var(--serif);
  font-size: clamp(24px, 2.3vw, 34px);
  line-height: 1;
}

.debt-economy-strip small {
  color: var(--muted);
  font-size: 9px;
  line-height: 1.35;
}

.debt-economy-strip .debt-gdp-ratio {
  background: #f8ece9;
}

.debt-economy-strip .debt-gdp-ratio strong {
  color: #a7443b;
}

.debt-result-card>div b {
  color: #3f6654;
  font-size: 15px;
}

.debt-result-card>div b.is-negative {
  color: #a7483f;
}

.debt-result-card>div small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 8px;
  font-weight: 750;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.debt-disclaimer a {
  color: inherit;
  font-weight: 760;
}

@media (min-width: 1101px) {
  .debt-planner,
  .debt-grid,
  .debt-input-panel,
  .debt-results-panel {
    height: 100%;
    min-height: 0;
  }

  .debt-input-panel,
  .debt-results-panel {
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
  }

  .debt-input-panel>.panel-heading,
  .debt-results-panel>.panel-heading {
    position: sticky;
    top: 0;
    z-index: 20;
    background: rgba(255, 253, 249, .97);
    backdrop-filter: blur(12px);
  }
}

@media (max-width: 1100px) {
  .debt-grid {
    grid-template-columns: 1fr;
  }

  .debt-input-panel {
    border-right: 0;
    border-bottom: 1px solid #cfc5bc;
  }
}

@media (min-width: 1101px) and (max-width: 1800px) {
  .debt-hero-card {
    grid-template-columns: minmax(0, 1.7fr) minmax(190px, .55fr);
  }

  .debt-live-copy>strong {
    font-size: clamp(27px, 2.35vw, 40px);
  }
}

@media (max-width: 760px) {
  .debt-results-panel {
    padding-inline: 14px;
  }

  .debt-hero-card {
    grid-template-columns: 1fr;
  }

  .debt-live-copy>strong {
    white-space: normal;
  }

  .debt-economy-strip {
    grid-template-columns: 1fr;
  }

  .debt-economy-strip article+article {
    border-top: 1px solid #dfd6ce;
    border-left: 0;
  }

  .debt-live-change {
    padding: 15px 0 0;
    border-top: 1px solid rgba(255, 255, 255, .2);
    border-left: 0;
  }

  .debt-share-grid,
  .debt-momentum-grid,
  .debt-calculator-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .debt-share-grid article:nth-child(2n),
  .debt-momentum-grid article:nth-child(2n) {
    border-right: 0;
  }

  .debt-share-grid article:nth-child(-n+2),
  .debt-momentum-grid article:nth-child(-n+2) {
    border-bottom: 1px solid var(--line-soft);
  }

  .debt-chart-key {
    justify-content: flex-start;
    width: 100%;
  }
}

@media (max-width: 520px) {
  .debt-share-grid,
  .debt-momentum-grid,
  .debt-calculator-grid,
  .debt-composition-key {
    grid-template-columns: 1fr;
  }

  .debt-share-grid article,
  .debt-momentum-grid article {
    border-right: 0;
    border-bottom: 1px solid var(--line-soft);
  }

  .debt-share-grid article:last-child,
  .debt-momentum-grid article:last-child {
    border-bottom: 0;
  }
}