:root {
  --blue: #102f45;
  --navy: #102f45;
  --ink: #263238;
  --muted: #687279;
  --line: #d4d9dd;
  --soft: #f3f5f6;
}

body { background: #f3f5f6; }
.demo-sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 50;
  display: flex;
  width: 264px;
  flex-direction: column;
  padding: 30px 22px 24px;
  background: #102f45;
  color: #fff;
}
.sidebar-brand { padding: 2px 10px 22px; color: #fff; font-size: 21px; font-weight: 800; letter-spacing: 1px; text-decoration: none; }
.sidebar-brand span { color: #fff; }
.demo-sidebar nav { display: flex; flex-direction: column; gap: 5px; margin-top: 28px; }
.sidebar-label { padding: 0 14px 10px; color: #c6d0d7; font-size: 10px; font-weight: 800; letter-spacing: .14em; }
.demo-sidebar nav a { display: flex; min-height: 48px; align-items: center; gap: 13px; padding: 12px 14px; border: 1px solid transparent; border-radius: 9px; color: #d5dde2; font-size: 13px; font-weight: 700; text-decoration: none; }
.demo-sidebar nav a i { width: 20px; color: #fff; font-style: normal; text-align: center; }
.demo-sidebar nav a:hover { background: #ffffff0d; color: #fff; }
.demo-sidebar nav a.active { border-color: #ffffff1f; border-left-color: #fff; background: #ffffff18; color: #fff; }
.sidebar-public { margin-top: auto; border-top: 1px solid #ffffff20; padding: 18px 10px 0; color: #d5dde2; font-size: 10px; font-weight: 700; text-decoration: none; }
.demo-topbar { margin-left: 264px; }
main { width: min(1180px,calc(100vw - 320px)); margin-left: calc(264px + max(28px,(100vw - 1444px)/2)); margin-right: auto; }
.demo-hero { background: #102f45; }
.demo-brand span { color: #102f45; }
.eyebrow,
.section-head > span,
.card-title > span,
.card-title > div > span { color: #102f45; }
.demo-hero .eyebrow,
.demo-hero p,
.demo-hero aside small { color: #fff; }
.demo-hero h1 em { color: #fff; }
.progress i { background: #fff; }
.steps button > span { background: #f3f5f6; color: #102f45; }
.steps button.active { border-color: #102f45; box-shadow: 0 0 0 3px #102f4524; }
.steps button.active > span { background: #102f45; color: #fff; }
input:focus,
select:focus,
textarea:focus { outline-color: #102f4524; border-color: #102f45; }
input,
select,
textarea { border-color: #c9d0d5; }
.secondary { border-color: #102f45; background: #f3f5f6; color: #102f45; }
.primary { background: #102f45; }
.room-count { background: #f3f5f6; }
.quick-row,
.review-grid article,
.form-actions { background: #f3f5f6; }
.level-card,
.room-card,
.room-wall-insulation { background: #fafafa; }
.room-count strong,
.review-grid span { color: #102f45; }

.info-button {
  border-color: #102f45;
  background: #fff;
  color: #102f45;
}
.info-button:hover,
.info-button:focus-visible,
.info-button[aria-expanded="true"] {
  background: #102f45;
  color: #fff;
}
.info-popover {
  border-color: #d4d9dd;
  background: #f3f5f6;
  color: #33434d;
}
.wall-direction-question,
.window-lookup,
.room-wall-insulation {
  border-color: #d4d9dd;
  background: #f3f5f6;
}
.wall-side-directions,
.dimension-direction,
.duct-location-details,
.skylight-details,
.fireplace-details,
.sliding-glass-details,
.window-lookup,
.blower-door-fields { border-color: #d4d9dd; }
.yes-no-control button,
.add-wall-direction,
.add-extra-wall,
.add-window {
  border-color: #102f45;
  background: #f3f5f6;
  color: #102f45;
}
.yes-no-control button.selected {
  border-color: #102f45;
  background: #102f45;
  color: #fff;
}

.signature-card {
  margin-top: 18px;
  padding: 20px;
  border: 1px solid #102f45;
  border-radius: 10px;
  background: #f7f7f7;
}
.signature-heading span { color: #102f45; font-size: 8px; font-weight: 800; letter-spacing: .12em; }
.signature-heading h3 { margin: 5px 0 4px; color: #263238; font-size: 15px; }
.signature-heading p { margin: 0 0 14px; color: #687279; font-size: 9px; }
.signature-card .certify { border-color: #d4d9dd; background: #fff; color: #263238; line-height: 1.65; }
.signature-card .certify input { accent-color: #102f45; }
.signature-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 12px; margin-top: 14px; }
.signature-grid input[readonly] { background: #f3f5f6; color: #263238; }
.signature-note { display: block; margin-top: 10px; color: #687279; font-size: 8px; line-height: 1.5; }
.demo-submit:disabled { background: #8a949a; cursor: not-allowed; opacity: .75; }
@media(max-width:850px){.demo-sidebar{display:none}.demo-topbar{margin-left:0}main{width:min(1180px,92vw);margin-left:auto;margin-right:auto}}
@media(max-width:580px){.signature-grid{grid-template-columns:1fr}}