.resource-rules-page,
.rule-wizard-modal {
  font-size: 15px;
}

.resource-rules-page .rules-heading.city-heading h1 {
  font-size: 32px !important;
  font-weight: 800 !important;
  line-height: 1.2;
  letter-spacing: -0.04em;
}

.rules-heading > div > p:last-child {
  font-size: 12px !important;
  line-height: 1.65;
}

.rules-create-button {
  font-size: 14px;
}

.rules-summary b {
  font-size: 26px;
}

.rules-summary span,
.rules-toolbar input,
.rule-filters button,
.rules-toolbar > span {
  font-size: 13px;
}

.rule-main b {
  font-size: 16px;
}

.rule-main p {
  font-size: 14px;
  line-height: 1.6;
}

.rule-main small,
.rule-tags span,
.rule-edit,
.rule-switch,
.rule-detail ol,
.rule-detail ul {
  font-size: 12px;
  line-height: 1.6;
}

.rule-detail h3 {
  font-size: 14px;
}

.rule-wizard-modal > header small,
.rule-wizard-steps li,
.rule-wizard-info small,
.rule-builder-head,
.rule-builder-row > span,
.rule-formula-preview,
.rule-review-list dt,
.rule-review-example,
.rule-wizard-status,
.rule-wizard-modal footer > span {
  font-size: 12px;
  line-height: 1.55;
}

.rule-wizard-modal > header h2 {
  font-size: 23px;
}

.rule-form-grid label,
.rule-form-grid input,
.rule-form-grid select,
.rule-form-grid textarea,
.rule-builder-row input,
.rule-builder-row select,
.rule-review-list dd {
  font-size: 14px;
  line-height: 1.5;
}

.rule-wizard-info b,
.rule-formula-preview b,
.rule-review-title b {
  font-size: 14px;
}

@media (max-width: 700px) {
  .resource-rules-page .rules-heading.city-heading h1 {
    font-size: clamp(21px, 6vw, 27px) !important;
  }
}

/* Make search, filters and rule cards easier to scan. */
.resource-rules-page .rules-toolbar {
  padding: 14px;
  border-color: #cfc5b3;
  box-shadow: 0 2px 8px rgb(44 57 48 / 7%);
}

.resource-rules-page .rules-toolbar > label {
  min-height: 44px;
  border: 1px solid #b9ad98;
  background: #fff;
  color: #2c3930;
  box-shadow: inset 0 0 0 1px rgb(44 57 48 / 3%);
}

.resource-rules-page .rules-toolbar > label:focus-within {
  border-color: #2c3930;
  box-shadow: 0 0 0 3px rgb(44 57 48 / 13%);
}

.resource-rules-page .rules-toolbar > label > span {
  font-size: 20px;
  font-weight: 800;
}

.resource-rules-page .rules-toolbar input {
  color: #2c3930;
  font-size: 14px;
}

.resource-rules-page .rules-toolbar input::placeholder {
  color: #806f5f;
  opacity: 1;
}

.resource-rules-page .rule-filters {
  gap: 7px;
}

.resource-rules-page .rule-filters button {
  border: 1px solid #ddd4c3;
  background: #fff;
  color: #674427;
  font-size: 13px;
}

.resource-rules-page .rule-filters button:hover {
  border-color: #9f927e;
  background: #fffaf0;
}

.resource-rules-page .rule-filters button.active {
  border-color: #2c3930;
  background: #2c3930;
  color: #fff;
}

.resource-rules-page .resource-rule-card {
  border: 1px solid #cfc7b8;
  border-left-width: 4px;
  box-shadow: 0 2px 8px rgb(44 57 48 / 6%);
}

.resource-rules-page .resource-rule-card[open] {
  border-color: #8b9b8f;
  box-shadow: 0 3px 12px rgb(44 57 48 / 10%);
}

.resource-rules-page .resource-rule-card summary {
  background: #fff;
}

.resource-rules-page .resource-rule-card.flood { border-left-color: #527f9d; }
.resource-rules-page .resource-rule-card.fire { border-left-color: #bd6532; }
.resource-rules-page .resource-rule-card.wind { border-left-color: #6f769c; }
.resource-rules-page .resource-rule-card.landslide { border-left-color: #8a6649; }
.resource-rules-page .resource-rule-card.drought { border-left-color: #a97924; }
.resource-rules-page .resource-rule-card.other { border-left-color: #607466; }

.resource-rules-page .resource-rule-card.flood .rule-icon { background: #e9f3f8; color: #527f9d; }
.resource-rules-page .resource-rule-card.fire .rule-icon { background: #fff0e7; color: #bd6532; }
.resource-rules-page .resource-rule-card.wind .rule-icon { background: #f0eff8; color: #6f769c; }
.resource-rules-page .resource-rule-card.landslide .rule-icon { background: #f5ece5; color: #8a6649; }
.resource-rules-page .resource-rule-card.drought .rule-icon { background: #fff5d9; color: #a97924; }
.resource-rules-page .resource-rule-card.other .rule-icon { background: #edf2ee; color: #607466; }

.resource-rules-page .rule-main b {
  color: #2c3930;
  font-weight: 800;
}

.resource-rules-page .rule-main p {
  color: #4f6255;
}

.resource-rules-page .rule-main small,
.resource-rules-page .rules-toolbar > span {
  color: #674427;
}

.resource-rules-page .rule-edit {
  border-color: #bdb2a0;
  color: #2c3930;
  font-weight: 700;
}

.resource-rules-page .rule-detail {
  border-top-color: #d8cfbd;
  background: #fffdf8;
}
